@font-face {
  font-family: "ShabnamHoma";
  src: url("fonts/Shabnam-FD.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "VazirHoma";
  src: url("fonts/Vazir-Bold-FD.woff2") format("woff2");
  font-weight: 700 900;
  font-style: normal;
  font-display: swap;
}
:root {
  --primary: #7366ff;
  --primary-2: #5b50dc;
  --primary-soft: #f0eeff;
  --accent: #ff7f5c;
  --bg: #f7f8fc;
  --surface: #fff;
  --surface-2: #fbfbfe;
  --text: #20233b;
  --muted: #80849b;
  --border: #e9eaf2;
  --success: #1fbe8a;
  --success-soft: #e8f9f3;
  --warning: #f2b84b;
  --warning-soft: #fff6df;
  --orange: #f08a37;
  --orange-soft: #fff0e4;
  --danger: #e85b6a;
  --danger-soft: #fdebed;
  --info: #4f8cff;
  --info-soft: #ebf2ff;
  --shadow: 0 6px 20px rgba(35, 40, 84, 0.06);
  --shadow-lg: 0 18px 55px rgba(35, 40, 84, 0.13);
  --radius: 14px;
  --radius-sm: 9px;
  --sidebar: 270px;
  --topbar: 72px;
}
:root[data-theme="dark"] {
  --bg: #171821;
  --surface: #20212b;
  --surface-2: #252631;
  --text: #f0f1f7;
  --muted: #9b9eb1;
  --border: #313340;
  --primary-soft: #2b2945;
  --success-soft: #18362e;
  --warning-soft: #3a3120;
  --orange-soft: #3b291f;
  --danger-soft: #3b2229;
  --info-soft: #202d47;
  --shadow: 0 6px 24px rgba(0, 0, 0, 0.22);
  --shadow-lg: 0 18px 55px rgba(0, 0, 0, 0.35);
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  background: var(--bg);
  color: var(--text);
  font-family: "ShabnamHoma", Tahoma, sans-serif;
  font-size: 14px;
}
body {
  min-height: 100vh;
}
a {
  text-decoration: none;
  color: inherit;
}
button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}
h1,
h2,
h3,
h4,
h5,
h6,
strong,
b,
.btn,
th,
.badge,
.kpi-card .value,
.nav-item.active,
.brand,
.page-heading h1 {
  font-family: "VazirHoma", "ShabnamHoma", Tahoma, sans-serif;
  font-weight: 700;
}
input,
select,
textarea {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 11px 12px;
  outline: 0;
  transition: 0.18s;
  width: 100%;
}
input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 14%, transparent);
}
textarea {
  min-height: 110px;
  resize: vertical;
}
input[type="checkbox"],
input[type="radio"] {
  width: auto;
  accent-color: var(--primary);
}
input[type="file"] {
  padding: 8px;
}
.ltr {
  direction: ltr;
  text-align: left;
}
.app-shell {
  min-height: 100vh;
}
.sidebar {
  width: var(--sidebar);
  position: fixed;
  right: 0;
  top: 0;
  bottom: 0;
  background: var(--surface);
  border-left: 1px solid var(--border);
  z-index: 40;
  display: flex;
  flex-direction: column;
  transition: 0.25s;
  box-shadow: -2px 0 12px rgba(0, 0, 0, 0.01);
}
.brand {
  height: var(--topbar);
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid var(--border);
  position: relative;
}
.brand-logo-only img {
  max-width: 114px;
  max-height: 43px;
  object-fit: contain;
}
.brand a {
  display: flex;
  align-items: center;
}
.sidebar-close {
  display: none;
  position: absolute;
  left: 12px;
  background: none;
  border: 0;
  font-size: 22px;
  color: var(--muted);
}
.sidebar-scroll {
  flex: 1;
  overflow: auto;
  padding: 18px 12px;
}
.menu-caption {
  font-size: 13px;
  color: var(--muted);
  padding: 0 10px 8px;
}
.nav-item {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  margin: 3px 0;
  border-radius: 10px;
  color: var(--muted);
  position: relative;
  transition: 0.18s;
}
.nav-item i {
  font-size: 19px;
  width: 24px;
  text-align: center;
}
.nav-item b {
  font-family: "ShabnamHoma";
  font-weight: 400;
  flex: 1;
  color: inherit;
}
.nav-item:hover {
  color: var(--primary);
  background: var(--primary-soft);
}
.nav-item.active {
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #fff;
  box-shadow: 0 7px 18px rgba(115, 102, 255, 0.2);
}
.nav-item.active b {
  font-family: "VazirHoma";
}
.nav-badge {
  font-style: normal;
  font-size: 13px;
  background: var(--danger);
  color: #fff;
  min-width: 20px;
  height: 20px;
  padding: 2px 6px;
  border-radius: 20px;
  text-align: center;
}
.nav-item.active .nav-badge {
  background: #fff;
  color: var(--primary);
}
.sidebar-bottom {
  padding: 15px 20px;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: var(--muted);
}
.sidebar-bottom small {
  font-size: 13px;
}
.sidebar-bottom span {
  font-size: 13px;
  direction: ltr;
}
.main {
  margin-right: var(--sidebar);
  min-height: 100vh;
  transition: 0.25s;
}
.topbar {
  height: var(--topbar);
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
  position: sticky;
  top: 0;
  z-index: 30;
}
.topbar-start,
.topbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.icon-btn {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 0;
  background: transparent;
  display: grid;
  place-items: center;
  cursor: pointer;
  color: var(--muted);
  position: relative;
  font-size: 20px;
}
.icon-btn:hover {
  background: var(--primary-soft);
  color: var(--primary);
}
.menu-toggle {
  display: none;
}
.top-badge {
  position: absolute;
  top: 3px;
  left: 2px;
  background: var(--danger);
  color: #fff;
  border: 2px solid var(--surface);
  border-radius: 20px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-dropdown {
  position: relative;
}
.dropdown-panel {
  position: absolute;
  top: 52px;
  left: 0;
  width: 330px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  display: none;
  overflow: hidden;
  z-index: 70;
}
.dropdown-panel.open {
  display: block;
}
.dropdown-head {
  display: flex;
  justify-content: space-between;
  padding: 13px 15px;
  border-bottom: 1px solid var(--border);
}
.dropdown-head a {
  color: var(--primary);
  font-size: 13px;
}
.notification-mini {
  display: flex;
  gap: 10px;
  padding: 11px 14px;
  border-bottom: 1px solid var(--border);
}
.notification-mini:last-child {
  border-bottom: 0;
}
.notification-mini.unread {
  background: var(--primary-soft);
}
.notification-mini > i {
  font-size: 18px;
  color: var(--primary);
  margin-top: 2px;
}
.notification-mini div {
  min-width: 0;
}
.notification-mini b,
.notification-mini small {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.notification-mini small {
  color: var(--muted);
  margin-top: 3px;
}
.dropdown-empty {
  padding: 24px;
  text-align: center;
  color: var(--muted);
}
.user-trigger {
  display: flex;
  align-items: center;
  gap: 9px;
  background: none;
  border: 0;
  padding: 3px 4px 3px 8px;
  border-radius: 10px;
  cursor: pointer;
}
.user-trigger:hover {
  background: var(--surface-2);
}
.avatar,
.avatar-img {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--primary), #9a6cff);
  color: #fff;
  object-fit: cover;
}
.user-meta {
  display: flex;
  flex-direction: column;
  text-align: right;
  min-width: 90px;
}
.user-meta b {
  font-size: 13px;
}
.user-meta small {
  font-size: 13px;
  color: var(--muted);
  direction: ltr;
}
.user-menu {
  width: 210px;
  left: 0;
}
.user-menu a {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 13px;
}
.user-menu a:hover {
  background: var(--primary-soft);
  color: var(--primary);
}
.user-menu hr {
  border: 0;
  border-top: 1px solid var(--border);
  margin: 4px 0;
}
.danger-link {
  color: var(--danger) !important;
}
.page-heading {
  padding: 24px 28px 8px;
}
.page-heading h1 {
  font-size: 21px;
  margin: 0 0 6px;
}
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 3px;
  color: var(--muted);
  font-size: 13px;
}
.breadcrumb a:hover {
  color: var(--primary);
}
.content {
  padding: 16px 28px 34px;
  max-width: 1800px;
  margin: auto;
}
.grid {
  display: grid;
  gap: 18px;
}
.kpi {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 18px;
}
.kpi-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 18px;
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}
.kpi-card:before {
  content: "";
  position: absolute;
  width: 86px;
  height: 86px;
  border-radius: 50%;
  left: -22px;
  top: -26px;
  background: var(--primary-soft);
}
.kpi-card .label {
  color: var(--muted);
  font-size: 13px;
}
.kpi-card .value {
  font-size: 27px;
  margin: 8px 0 3px;
}
.kpi-card .hint {
  color: var(--muted);
  font-size: 13px;
}
.welcome-card {
  background: linear-gradient(135deg, var(--primary), #8b76ff);
  color: #fff;
  border-radius: 16px;
  padding: 22px 25px;
  margin-bottom: 18px;
  position: relative;
  overflow: hidden;
  min-height: 126px;
  display: flex;
  align-items: center;
}
.welcome-card:after {
  content: "";
  position: absolute;
  width: 210px;
  height: 210px;
  border: 34px solid rgba(255, 255, 255, 0.09);
  border-radius: 50%;
  left: -30px;
  top: -74px;
}
.welcome-card h2 {
  margin: 0 0 8px;
  font-size: 22px;
}
.welcome-card p {
  margin: 0;
  color: #ffffffd9;
}
.quick-actions {
  display: flex;
  gap: 8px;
  margin-top: 14px;
  flex-wrap: wrap;
}
.quick-actions .btn {
  background: #fff;
  color: var(--primary);
  border: 0;
}
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  margin-bottom: 18px;
  overflow: hidden;
}
.card-head {
  min-height: 58px;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--border);
}
.card-head h2 {
  font-size: 14px;
  margin: 0;
}
.card-body {
  padding: 18px;
}
.card-actions {
  display: flex;
  gap: 8px;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid transparent;
  border-radius: 9px;
  padding: 9px 14px;
  cursor: pointer;
  font-size: 13px;
  transition: 0.18s;
  white-space: nowrap;
}
.btn-primary {
  background: var(--primary);
  color: #fff;
}
.btn-primary:hover {
  background: var(--primary-2);
}
.btn-outline {
  background: var(--surface);
  border-color: var(--border);
  color: var(--text);
}
.btn-outline:hover {
  border-color: var(--primary);
  color: var(--primary);
  background: var(--primary-soft);
}
.btn-danger {
  background: var(--danger-soft);
  color: var(--danger);
  border-color: transparent;
}
.btn-sm {
  padding: 6px 10px;
  font-size: 13px;
}
.actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px 18px;
}
.form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.form-group.full {
  grid-column: 1/-1;
}
.form-group label {
  font-size: 13px;
  color: var(--text);
}
.form-group label.required:after {
  content: " *";
  color: var(--danger);
}
.help {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.8;
}
.error {
  font-size: 13px;
  color: var(--danger);
}
.radio-row,
.check-row {
  display: flex;
  gap: 14px;
  align-items: center;
  flex-wrap: wrap;
}
.repeat-row {
  margin-bottom: 8px;
}
.table-wrap {
  overflow: auto;
}
.table-wrap table,
table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  min-width: 650px;
}
th,
td {
  text-align: right;
  padding: 11px 12px;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}
th {
  background: var(--surface-2);
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
}
td {
  font-size: 13px;
}
tr:last-child td {
  border-bottom: 0;
}
tbody tr:hover td {
  background: color-mix(in srgb, var(--primary-soft) 45%, transparent);
}
.badge {
  display: inline-flex;
  align-items: center;
  border-radius: 20px;
  padding: 5px 9px;
  font-size: 13px;
}
.badge.info {
  background: var(--info-soft);
  color: var(--info);
}
.badge.success {
  background: var(--success-soft);
  color: var(--success);
}
.badge.warning {
  background: var(--warning-soft);
  color: #b17a00;
}
.badge.danger {
  background: var(--danger-soft);
  color: var(--danger);
}
.badge.muted {
  background: var(--surface-2);
  color: var(--muted);
}
.alert {
  border-radius: 10px;
  padding: 11px 13px;
  margin-bottom: 14px;
  display: flex;
  gap: 8px;
  align-items: flex-start;
}
.alert.success {
  background: var(--success-soft);
  color: var(--success);
}
.alert.error {
  background: var(--danger-soft);
  color: var(--danger);
}
.alert.info {
  background: var(--info-soft);
  color: var(--info);
}
.meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.meta-item {
  padding: 11px 12px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  min-width: 0;
}
.meta-item small {
  display: block;
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 5px;
}
.meta-item b {
  font-size: 13px;
  word-break: break-word;
}
.split {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
  gap: 18px;
}
.timeline {
  position: relative;
}
.timeline-item {
  display: grid;
  grid-template-columns: 95px 18px 1fr;
  gap: 9px;
  padding: 0 0 20px;
}
.timeline-time {
  font-size: 13px;
  color: var(--muted);
  text-align: left;
  direction: ltr;
}
.timeline-dot {
  width: 11px;
  height: 11px;
  background: var(--primary);
  border: 3px solid var(--primary-soft);
  border-radius: 50%;
  margin-top: 3px;
  position: relative;
}
.timeline-dot:after {
  content: "";
  position: absolute;
  width: 1px;
  background: var(--border);
  height: 34px;
  top: 10px;
  right: 2px;
}
.timeline-item:last-child .timeline-dot:after {
  display: none;
}
.empty {
  text-align: center;
  color: var(--muted);
  padding: 28px;
}
.empty i {
  font-size: 30px;
  color: var(--border);
}
.empty p {
  margin: 6px 0;
}
.auth-shell {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 25px;
  background: radial-gradient(circle at 20% 20%, #eae7ff 0, transparent 26%),
    var(--bg);
}
:root[data-theme="dark"] .auth-shell {
  background: radial-gradient(circle at 20% 20%, #282641 0, transparent 26%),
    var(--bg);
}
.login-card {
  width: min(440px, 100%);
  background: var(--surface);
  padding: 30px;
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: var(--shadow-lg);
}
.login-logo {
  text-align: center;
  margin-bottom: 22px;
}
.login-logo img {
  max-width: 120px;
}
.login-logo h2 {
  font-size: 18px;
  margin: 14px 0 4px;
}
.login-logo p {
  font-size: 13px;
  color: var(--muted);
  margin: 0;
}
.auth-links {
  text-align: center;
  margin-top: 15px;
  color: var(--muted);
}
.auth-links a {
  color: var(--primary);
}
/* Calendar / availability */
.legend {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 14px;
}
.dot {
  width: 9px;
  height: 9px;
  border-radius: 3px;
  display: inline-block;
  margin-left: 4px;
}
.dot.registered {
  background: #f3c64b;
}
.dot.tentative {
  background: var(--orange);
}
.dot.confirmed {
  background: #e64f5e;
}
.dot.blocked {
  background: #8c92a6;
}
.hour-calendar {
  display: grid;
  grid-template-columns: 74px repeat(var(--hall-count, 1), minmax(180px, 1fr));
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: auto;
  background: var(--surface);
  min-width: 760px;
}
.hour-head {
  padding: 10px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-2);
  font-family: "VazirHoma";
  font-size: 13px;
  position: sticky;
  top: 0;
  z-index: 2;
}
.hour-label {
  padding: 9px;
  border-left: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  color: var(--muted);
  direction: ltr;
}
.hour-slot {
  min-height: 52px;
  border-left: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 4px;
  position: relative;
}
.cal-event {
  display: block;
  border-radius: 7px;
  padding: 5px 7px;
  font-size: 13px;
  line-height: 1.5;
  margin-bottom: 3px;
  border-right: 3px solid transparent;
  cursor: pointer;
}
.cal-event.registered {
  background: #fff2bd;
  color: #836000;
  border-color: #e9bc35;
}
.cal-event.tentative {
  background: var(--orange-soft);
  color: #a85116;
  border-color: var(--orange);
}
.cal-event.confirmed {
  background: var(--danger-soft);
  color: #a6303e;
  border-color: var(--danger);
}
.cal-event.blocked {
  background: #eceef3;
  color: #5e6475;
  border-color: #9298a8;
}
.cal-event .private {
  filter: blur(4px);
  user-select: none;
}
.calendar-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.date-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  padding: 7px 10px;
  border-radius: 9px;
}
/* Jalali popup */
.jdp-input {
  cursor: pointer;
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%),
    linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: 14px 50%, 10px 50%;
  background-size: 4px 4px;
  background-repeat: no-repeat;
  padding-left: 26px;
}
.jdp-popover {
  position: fixed;
  z-index: 1000;
  width: min(370px, calc(100vw - 24px));
  background: var(--surface);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-lg);
  border-radius: 14px;
  padding: 13px;
}
.jdp-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.jdp-nav {
  border: 0;
  background: var(--surface-2);
  border-radius: 8px;
  width: 32px;
  height: 32px;
  cursor: pointer;
}
.jdp-week,
.jdp-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
}
.jdp-week span {
  text-align: center;
  color: var(--muted);
  font-size: 13px;
  padding: 4px;
}
.jdp-day {
  position: relative;
  min-height: 38px;
  border: 1px solid transparent;
  background: var(--surface-2);
  border-radius: 8px;
  cursor: pointer;
}
.jdp-day:hover {
  border-color: var(--primary);
}
.jdp-day.is-today {
  border-color: var(--primary);
}
.jdp-day.is-selected {
  background: var(--primary);
  color: #fff;
}
.jdp-day.is-empty {
  visibility: hidden;
}
.jdp-day.is-disabled {
  opacity: 0.32;
  cursor: not-allowed;
}
.jdp-day.has-registered:not(.is-selected) {
  background: #fff2bd;
  color: #836000;
  border-color: #e9bc35;
}
.jdp-day.has-tentative:not(.is-selected) {
  background: var(--orange-soft);
  color: #a85116;
  border-color: #ef9a5a;
}
.jdp-day.has-confirmed:not(.is-selected) {
  background: var(--danger-soft);
  color: #a6303e;
  border-color: #eb8691;
}
.jdp-day.has-blocked:not(.is-selected) {
  background: #eceef3;
  color: #5e6475;
  border-color: #b3b8c4;
}
.jdp-day.is-holiday:after {
  content: "";
  position: absolute;
  left: 4px;
  bottom: 4px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--danger);
}
.jdp-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid var(--border);
}
.jdp-legend {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  font-size: 13px;
  color: var(--muted);
}
.jdp-legend i {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  margin-left: 2px;
}
.jdp-legend .y {
  background: #f3c64b;
}
.jdp-legend .o {
  background: var(--orange);
}
.jdp-legend .r {
  background: var(--danger);
}
.jdp-time {
  display: flex;
  align-items: center;
  gap: 5px;
}
.jdp-time input {
  width: 90px;
  padding: 6px;
}
.jdp-loading {
  font-size: 13px;
  color: var(--muted);
}
/* Admin / editor */
.admin-tabs {
  display: flex;
  gap: 6px;
  overflow: auto;
  padding-bottom: 4px;
  margin-bottom: 14px;
}
.admin-tabs a {
  white-space: nowrap;
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
}
.admin-tabs a.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.code-field,
.form-group input[name*="code"],
.form-group input[name*="national"],
.form-group input[name*="mobile"] {
  font-family: "ShabnamHoma", Tahoma, sans-serif;
  direction: ltr;
  text-align: left;
}
.rich-editor {
  min-height: 230px;
}
.workflow-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.workflow-node-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px;
  background: var(--surface-2);
}
.workflow-node-card .node-type {
  font-size: 13px;
  color: var(--muted);
}
.ticket-thread {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ticket-message {
  max-width: 80%;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--surface-2);
  border: 1px solid var(--border);
}
.ticket-message.mine {
  align-self: flex-start;
  background: var(--primary-soft);
  border-color: transparent;
}
.ticket-message small {
  display: block;
  color: var(--muted);
  margin-top: 5px;
}
.profile-photo {
  width: 88px;
  height: 88px;
  border-radius: 16px;
  object-fit: cover;
  border: 4px solid var(--surface);
  box-shadow: var(--shadow);
}
@media (max-width: 1100px) {
  .kpi {
    grid-template-columns: repeat(2, 1fr);
  }
  .meta {
    grid-template-columns: repeat(2, 1fr);
  }
  .split {
    grid-template-columns: 1fr;
  }
  .menu-toggle {
    display: grid;
  }
  .sidebar {
    transform: translateX(100%);
    box-shadow: var(--shadow-lg);
  }
  body.sidebar-open .sidebar {
    transform: translateX(0);
  }
  .sidebar-close {
    display: block;
  }
  .main {
    margin-right: 0;
  }
  .user-meta {
    display: none;
  }
}
@media (max-width: 700px) {
  .content {
    padding: 12px 14px 25px;
  }
  .page-heading {
    padding: 18px 15px 6px;
  }
  .topbar {
    padding: 0 12px;
  }
  .kpi {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .kpi-card {
    padding: 13px;
  }
  .kpi-card .value {
    font-size: 21px;
  }
  .form-grid {
    grid-template-columns: 1fr;
  }
  .meta {
    grid-template-columns: 1fr 1fr;
  }
  .dropdown-panel {
    position: fixed;
    left: 12px;
    right: 12px;
    top: 66px;
    width: auto;
  }
  .user-dropdown .dropdown-panel {
    right: auto;
    width: 210px;
  }
  .card-body {
    padding: 14px;
  }
  .card-head {
    padding: 12px 14px;
  }
  .welcome-card {
    padding: 18px;
  }
  .welcome-card h2 {
    font-size: 18px;
  }
}
@media (max-width: 430px) {
  .kpi,
  .meta {
    grid-template-columns: 1fr;
  }
  .topbar-actions {
    gap: 2px;
  }
  .user-trigger > i {
    display: none;
  }
}

/* ===== HOMA Functional Baseline 2.0 / Orchid-aligned interaction layer ===== */
:root {
  --primary: #9d2ab4;
  --primary-2: #6f5de7;
  --primary-soft: #f7ebfa;
  --accent: #d21f8d;
  --bg: #f5f6fa;
  --surface-2: #f8f8fb;
  --radius: 12px;
  --sidebar-folded: 86px;
}
:root[data-theme="dark"] {
  --primary: #bd67cf;
  --primary-2: #8c7df0;
  --primary-soft: #34233b;
  --bg: #15161d;
  --surface: #1f2028;
  --surface-2: #252630;
  --border: #32343f;
}
body {
  overflow-x: hidden;
}
.btn-block {
  width: 100%;
}
.success-text {
  color: var(--success);
}
.danger-text {
  color: var(--danger);
}
/* app shell */
.sidebar {
  overflow: hidden;
}
.sidebar-watermark {
  position: absolute;
  right: 0;
  left: 0;
  bottom: 38px;
  height: 180px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  pointer-events: none;
  overflow: hidden;
  opacity: 0.035;
}
.sidebar-watermark img {
  max-height: 165px;
  max-width: 70%;
  filter: grayscale(1);
}
:root[data-theme="dark"] .sidebar-watermark {
  opacity: 0.055;
  filter: invert(1);
}
.sidebar-bottom {
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-top: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  z-index: 2;
}
.sidebar-bottom span {
  font-family: Arial, sans-serif;
  font-size: 13px;
  letter-spacing: 0.7px;
  color: var(--muted);
  direction: ltr;
}
.nav-parent {
  width: 100%;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: right;
}
.nav-parent .nav-caret {
  font-size: 14px;
  width: 16px;
  transition: 0.2s;
}
.nav-group.open > .nav-parent .nav-caret {
  transform: rotate(180deg);
}
.nav-children {
  display: none;
  padding-right: 14px;
}
.nav-group.open > .nav-children {
  display: block;
}
.nav-children .nav-item {
  min-height: 39px;
  font-size: 13px;
}
.nav-children .nav-item > i:first-child {
  font-size: 16px;
}
.nav-group.open > .nav-parent {
  color: var(--primary);
  background: var(--primary-soft);
}
html.sidebar-prefold .sidebar,
body.sidebar-folded .sidebar {
  width: var(--sidebar-folded);
}
html.sidebar-prefold .main,
body.sidebar-folded .main {
  margin-right: var(--sidebar-folded);
}
html.sidebar-prefold .brand-logo-only img,
body.sidebar-folded .brand-logo-only img {
  width: 42px;
  height: 42px;
  object-fit: cover;
  object-position: left;
  border-radius: 10px;
}
html.sidebar-prefold .menu-caption,
html.sidebar-prefold .nav-item b,
html.sidebar-prefold .nav-parent .nav-caret,
html.sidebar-prefold .nav-badge,
html.sidebar-prefold .sidebar-bottom span,
body.sidebar-folded .menu-caption,
body.sidebar-folded .nav-item b,
body.sidebar-folded .nav-parent .nav-caret,
body.sidebar-folded .nav-badge,
body.sidebar-folded .sidebar-bottom span {
  display: none;
}
html.sidebar-prefold .nav-item,
body.sidebar-folded .nav-item {
  justify-content: center;
  padding: 10px;
}
html.sidebar-prefold .nav-item i,
body.sidebar-folded .nav-item i {
  width: auto;
  font-size: 21px;
}
html.sidebar-prefold .nav-children,
body.sidebar-folded .nav-children {
  padding: 0;
}
html.sidebar-prefold .sidebar-watermark,
body.sidebar-folded .sidebar-watermark {
  display: none;
}
.topbar {
  gap: 18px;
  box-shadow: 0 1px 0 var(--border);
}
.topbar-start {
  min-width: 300px;
}
.topbar-center {
  flex: 1;
  display: flex;
  justify-content: center;
}
.header-breadcrumb {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
}
.header-breadcrumb a {
  color: var(--muted);
}
.header-breadcrumb a:hover {
  color: var(--primary);
}
.desktop-fold {
  display: grid;
}
.global-search {
  width: min(520px, 100%);
  height: 40px;
  border: 1px solid var(--border);
  background: var(--surface-2);
  border-radius: 10px;
  display: flex;
  align-items: center;
  padding: 0 11px;
  gap: 8px;
}
.global-search input {
  border: 0;
  box-shadow: none;
  background: transparent;
  padding: 0;
  height: auto;
}
.global-search input:focus {
  box-shadow: none;
}
.global-search i {
  color: var(--muted);
  font-size: 18px;
}
.global-search kbd {
  font: 10px Arial;
  background: var(--surface);
  border: 1px solid var(--border);
  border-bottom-width: 2px;
  border-radius: 5px;
  color: var(--muted);
  padding: 3px 6px;
  white-space: nowrap;
}
.quick-menu {
  width: 230px;
}
.quick-menu > a,
.user-menu > a {
  display: flex;
  gap: 9px;
  align-items: center;
  padding: 10px 13px;
}
.quick-menu > a:hover {
  background: var(--primary-soft);
  color: var(--primary);
}
.user-menu-head {
  display: flex;
  flex-direction: column;
  padding: 13px;
  border-bottom: 1px solid var(--border);
}
.user-menu-head small {
  color: var(--muted);
  margin-top: 3px;
}
.user-meta small {
  direction: rtl;
  text-align: right;
}
.page-heading {
  padding: 22px 28px 6px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.page-heading h1 {
  font-size: 20px;
  margin: 0;
}
.content {
  padding-top: 12px;
}
/* auth, closer to premium split-screen dashboards */
.auth-shell {
  padding: 0;
  display: grid;
  grid-template-columns: minmax(420px, 44%) 1fr;
  background: var(--surface);
  align-items: stretch;
}
.auth-visual {
  min-height: 100vh;
  background: linear-gradient(145deg, #6d5ee8 0%, #962eb5 52%, #d11d8a 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 56px;
  position: relative;
  overflow: hidden;
  color: #fff;
}
.auth-visual:before,
.auth-visual:after {
  content: "";
  position: absolute;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 50%;
}
.auth-visual:before {
  width: 560px;
  height: 560px;
  right: -260px;
  top: -190px;
}
.auth-visual:after {
  width: 390px;
  height: 390px;
  left: -180px;
  bottom: -120px;
}
.auth-visual-content {
  position: relative;
  z-index: 1;
  max-width: 480px;
}
.auth-mark {
  width: 88px;
  height: 88px;
  border-radius: 22px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.18);
  margin-bottom: 28px;
}
.auth-visual h1 {
  font-size: 34px;
  margin: 0 0 12px;
}
.auth-visual p {
  font-size: 14px;
  line-height: 2;
  color: #ffffffd9;
  margin-bottom: 28px;
}
.auth-feature {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 11px 0;
  color: #fff;
}
.auth-feature i {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: #ffffff1c;
  display: grid;
  place-items: center;
  font-size: 17px;
}
.auth-main {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
  background: var(--bg);
}
.login-card {
  box-shadow: none;
  border: 0;
  background: transparent;
  width: min(430px, 100%);
  padding: 0;
}
.auth-card-wide {
  max-width: 430px;
}
.login-logo img {
  max-width: 110px;
}
.login-logo h2 {
  font-size: 22px;
  margin-top: 20px;
}
.login-logo p {
  font-size: 13px;
}
.login-card input {
  min-height: 46px;
}
.login-card .btn {
  min-height: 44px;
}
.otp-input {
  font-family: Arial, sans-serif;
  font-size: 22px;
  letter-spacing: 8px;
  text-align: center;
  direction: ltr;
}
/* cards / dashboard */
.card {
  box-shadow: 0 2px 14px rgba(35, 40, 84, 0.035);
}
.card:hover {
  box-shadow: 0 4px 18px rgba(35, 40, 84, 0.055);
}
.kpi-card {
  box-shadow: none;
}
.kpi-card .kpi-icon {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 21px;
  position: absolute;
  left: 16px;
  top: 16px;
}
.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);
  gap: 18px;
}
.mini-chart {
  height: 180px;
  display: flex;
  align-items: end;
  gap: 10px;
  padding: 15px 4px 0;
}
.mini-chart .bar {
  flex: 1;
  min-width: 12px;
  background: linear-gradient(180deg, var(--primary), var(--primary-2));
  border-radius: 7px 7px 2px 2px;
  opacity: 0.86;
  position: relative;
}
.mini-chart .bar:hover {
  opacity: 1;
}
.mini-chart .bar span {
  position: absolute;
  bottom: -22px;
  right: 0;
  left: 0;
  text-align: center;
  font-size: 13px;
  color: var(--muted);
}
.stat-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px dashed var(--border);
}
.stat-line:last-child {
  border-bottom: 0;
}
.trend-up {
  color: var(--success);
}
.trend-down {
  color: var(--danger);
}
/* image/file upload */
.upload-box {
  border: 1px dashed var(--border);
  border-radius: 12px;
  padding: 12px;
  background: var(--surface-2);
}
.upload-preview {
  display: block;
  width: 100%;
  max-width: 240px;
  height: 145px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid var(--border);
  margin-top: 9px;
  background: var(--surface);
}
.upload-preview[hidden] {
  display: none;
}
.file-preview-card {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 10px;
}
.file-preview-card img {
  width: 90px;
  height: 62px;
  object-fit: cover;
  border-radius: 7px;
}
/* request wizard/autosave */
.request-wizard {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 18px;
  padding: 12px 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  position: sticky;
  top: 82px;
  z-index: 18;
  box-shadow: var(--shadow);
}
.wizard-steps {
  display: flex;
  gap: 5px;
  overflow: auto;
}
.wizard-steps button {
  border: 0;
  background: transparent;
  color: var(--muted);
  padding: 7px 9px;
  white-space: nowrap;
  border-radius: 8px;
  cursor: pointer;
}
.wizard-steps button span {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 7px;
  background: var(--surface-2);
  margin-left: 4px;
  font-family: Arial;
}
.wizard-steps button.active {
  background: var(--primary-soft);
  color: var(--primary);
}
.wizard-steps button.active span {
  background: var(--primary);
  color: #fff;
}
.autosave-indicator {
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap;
}
.autosave-indicator.saving {
  color: var(--warning);
}
.autosave-indicator.saved {
  color: var(--success);
}
.wizard-panel-hidden {
  display: none;
}
.wizard-actions {
  display: flex;
  justify-content: space-between;
  margin-bottom: 18px;
}
/* full availability picker */
.jdp-popover.jdp-full {
  width: min(720px, calc(100vw - 24px));
  padding: 16px;
}
.jdp-full .jdp-layout {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) 260px;
  gap: 15px;
}
.jdp-slots {
  border-right: 1px solid var(--border);
  padding-right: 14px;
  max-height: 360px;
  overflow: auto;
}
.jdp-slots h4 {
  margin: 0 0 10px;
  font-size: 13px;
}
.jdp-slot-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
}
.jdp-slot {
  border: 1px solid var(--border);
  background: var(--surface-2);
  border-radius: 8px;
  padding: 8px 9px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  direction: ltr;
}
.jdp-slot small {
  direction: rtl;
  color: var(--muted);
}
.jdp-slot.registered {
  background: #fff3c7;
  border-color: #e9bc35;
}
.jdp-slot.tentative {
  background: var(--orange-soft);
  border-color: var(--orange);
}
.jdp-slot.confirmed,
.jdp-slot.blocked {
  cursor: not-allowed;
  opacity: 0.68;
}
.jdp-slot.confirmed {
  background: var(--danger-soft);
  border-color: var(--danger);
}
.jdp-slot.blocked {
  background: #eceef3;
  border-color: #a5aab8;
}
.jdp-slot.selected {
  box-shadow: 0 0 0 2px var(--primary);
  border-color: var(--primary);
}
/* profile */
.profile-hero {
  overflow: visible;
}
.profile-cover {
  height: 125px;
  background: linear-gradient(120deg, #725ee6, #a62bb4 55%, #d51f8e);
  position: relative;
}
.profile-cover:after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 20%, #ffffff35, transparent 24%);
}
.profile-identity {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  padding: 0 22px 20px;
  margin-top: -42px;
  position: relative;
}
.profile-avatar-wrap {
  padding: 5px;
  background: var(--surface);
  border-radius: 18px;
}
.profile-avatar-lg {
  width: 92px;
  height: 92px;
  border-radius: 14px;
  object-fit: cover;
  display: grid;
  place-items: center;
}
.avatar-fallback {
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #fff;
  font-size: 28px;
}
.profile-identity h2 {
  margin: 0 0 4px;
}
.profile-identity p {
  margin: 0;
  color: var(--muted);
}
.profile-actions {
  margin-right: auto;
}
.profile-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.8fr);
  gap: 18px;
}
.profile-meta {
  grid-template-columns: repeat(2, 1fr);
}
.session-list,
.activity-list {
  display: flex;
  flex-direction: column;
}
.session-row,
.activity-row {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
}
.session-row:last-child,
.activity-row:last-child {
  border-bottom: 0;
}
.session-row > i,
.activity-row > i {
  font-size: 22px;
  color: var(--primary);
}
.session-row > div,
.activity-row > div {
  flex: 1;
  min-width: 0;
}
.session-row b,
.activity-row b,
.session-row small,
.activity-row small {
  display: block;
}
.session-row small,
.activity-row small {
  color: var(--muted);
  font-size: 13px;
  margin-top: 4px;
}
.profile-onboarding {
  max-width: 900px;
  margin: 20px auto;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 28px;
  box-shadow: var(--shadow);
}
.onboarding-head {
  text-align: center;
  margin-bottom: 25px;
}
.onboarding-head h2 {
  font-size: 22px;
  margin: 10px 0 5px;
}
.onboarding-head p {
  color: var(--muted);
}
.step-badge {
  display: inline-flex;
  padding: 5px 10px;
  border-radius: 20px;
  background: var(--warning-soft);
  color: #a87500;
  font-size: 13px;
}
/* FAQ */
.faq-layout {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 18px;
}
.faq-categories {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px;
  height: max-content;
}
.faq-category {
  display: flex;
  justify-content: space-between;
  padding: 10px;
  border-radius: 8px;
  color: var(--muted);
  cursor: pointer;
}
.faq-category.active,
.faq-category:hover {
  background: var(--primary-soft);
  color: var(--primary);
}
.faq-item {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  margin-bottom: 9px;
  overflow: hidden;
}
.faq-question {
  width: 100%;
  border: 0;
  background: transparent;
  padding: 14px 16px;
  display: flex;
  justify-content: space-between;
  text-align: right;
  cursor: pointer;
}
.faq-answer {
  display: none;
  padding: 0 16px 16px;
  color: var(--muted);
  line-height: 2;
}
.faq-item.open .faq-answer {
  display: block;
}
.faq-item.open .faq-question i {
  transform: rotate(180deg);
}
/* Messages / tickets */
.messaging-shell {
  display: grid;
  grid-template-columns: 320px 1fr;
  min-height: 630px;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: var(--surface);
}
.conversation-list {
  border-left: 1px solid var(--border);
  background: var(--surface-2);
}
.conversation-head {
  padding: 14px;
  border-bottom: 1px solid var(--border);
}
.conversation-item {
  display: block;
  padding: 13px 14px;
  border-bottom: 1px solid var(--border);
  position: relative;
}
.conversation-item:hover,
.conversation-item.active {
  background: var(--primary-soft);
}
.conversation-item b,
.conversation-item small {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.conversation-item small {
  color: var(--muted);
  margin-top: 4px;
}
.conversation-view {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.conversation-title {
  padding: 14px 18px;
  border-bottom: 1px solid var(--border);
}
.message-thread {
  flex: 1;
  padding: 18px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  max-height: 520px;
}
.message-bubble {
  max-width: 70%;
  padding: 10px 13px;
  border-radius: 12px 12px 4px 12px;
  background: var(--surface-2);
  border: 1px solid var(--border);
}
.message-bubble.mine {
  align-self: flex-start;
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
  border-radius: 12px 12px 12px 4px;
}
.message-bubble small {
  display: block;
  margin-top: 5px;
  opacity: 0.7;
}
.message-compose {
  display: flex;
  gap: 8px;
  padding: 12px;
  border-top: 1px solid var(--border);
}
.message-compose textarea {
  min-height: 46px;
  max-height: 110px;
}
/* product/hall cards and admin lists */
.product-toolbar,
.data-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 15px;
}
.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 14px;
}
.product-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  padding: 16px;
  position: relative;
}
.product-card:hover {
  border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
  box-shadow: var(--shadow);
}
.product-card-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 24px;
  margin-bottom: 12px;
}
.product-card h3 {
  font-size: 14px;
  margin: 0 0 5px;
}
.product-card p {
  font-size: 13px;
  color: var(--muted);
  margin: 0 0 12px;
}
.product-meta {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.product-meta span {
  font-size: 13px;
  background: var(--surface-2);
  padding: 5px 7px;
  border-radius: 7px;
  color: var(--muted);
}
/* tasks */
.task-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 15px;
}
.task-summary-card {
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: 11px;
  padding: 13px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.task-summary-card i {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 19px;
}
.task-summary-card small,
.task-summary-card b {
  display: block;
}
.task-summary-card small {
  color: var(--muted);
  margin-top: 3px;
}
/* programs / meetings */
.meeting-date {
  font-size: 13px;
  color: var(--muted);
  margin: 18px 0 8px;
}
.meeting-row {
  display: grid;
  grid-template-columns: 86px 5px minmax(0, 1fr) auto;
  gap: 13px;
  align-items: center;
  padding: 12px;
  border-bottom: 1px solid var(--border);
}
.meeting-row:last-child {
  border-bottom: 0;
}
.meeting-time {
  direction: ltr;
  font-family: Arial;
  font-size: 13px;
}
.meeting-color {
  width: 5px;
  height: 46px;
  border-radius: 5px;
  background: var(--primary);
}
.meeting-info b,
.meeting-info small {
  display: block;
}
.meeting-info small {
  color: var(--muted);
  margin-top: 4px;
}
/* system logs / audit */
.log-level {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}
.log-level.INFO {
  background: var(--info);
}
.log-level.WARNING {
  background: var(--warning);
}
.log-level.ERROR,
.log-level.CRITICAL {
  background: var(--danger);
}
.json-preview {
  max-width: 420px;
  white-space: pre-wrap;
  direction: ltr;
  text-align: left;
  font: 10px Consolas, monospace;
  background: var(--surface-2);
  padding: 8px;
  border-radius: 7px;
}
/* settings */
.settings-layout {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 18px;
}
.settings-nav {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 8px;
  height: max-content;
}
.settings-nav a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px;
  border-radius: 8px;
  color: var(--muted);
}
.settings-nav a.active,
.settings-nav a:hover {
  background: var(--primary-soft);
  color: var(--primary);
}
.maintenance-card {
  border: 1px solid var(--warning);
  background: var(--warning-soft);
  border-radius: 12px;
  padding: 18px;
}
.toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.toggle input {
  width: 38px;
  height: 20px;
}
/* main hourly calendar, continuous multi-hour blocks */
.calendar-day-shell {
  display: grid;
  grid-template-columns: 72px repeat(var(--hall-count, 1), minmax(210px, 1fr));
  min-width: 900px;
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  background: var(--surface);
}
.calendar-time-axis,
.calendar-hall-column {
  position: relative;
  height: 960px;
  background-image: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 59px,
    var(--border) 59px,
    var(--border) 60px
  );
}
.calendar-time-axis {
  border-left: 1px solid var(--border);
  background-color: var(--surface-2);
}
.calendar-time-label {
  position: absolute;
  right: 0;
  left: 0;
  height: 22px;
  text-align: center;
  font: 10px Arial;
  color: var(--muted);
  transform: translateY(-6px);
}
.calendar-hall-column {
  border-left: 1px solid var(--border);
}
.calendar-hall-head,
.calendar-axis-head {
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--surface-2);
  padding: 10px;
  border-bottom: 1px solid var(--border);
  font-family: "VazirHoma";
  font-size: 13px;
}
.calendar-event-block {
  position: absolute;
  right: 7px;
  left: 7px;
  border-radius: 8px;
  padding: 6px 8px;
  font-size: 13px;
  overflow: hidden;
  z-index: 2;
  border-right: 4px solid;
  cursor: pointer;
  box-shadow: 0 2px 8px #0000000a;
}
.calendar-event-block.registered {
  background: #fff2bd;
  color: #785c00;
  border-color: #e9bc35;
}
.calendar-event-block.tentative {
  background: var(--orange-soft);
  color: #a85116;
  border-color: var(--orange);
}
.calendar-event-block.confirmed {
  background: var(--danger-soft);
  color: #a6303e;
  border-color: var(--danger);
}
.calendar-event-block.blocked {
  background: #eceef3;
  color: #5e6475;
  border-color: #9298a8;
}
.calendar-event-block .event-title {
  font-family: "VazirHoma";
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calendar-event-block .event-time {
  font-family: Arial;
  direction: ltr;
  display: block;
  margin-top: 2px;
}
.today-chip {
  box-shadow: 0 0 0 2px var(--primary);
  background: var(--primary-soft);
  color: var(--primary);
}
/* table utilities */
.table-card .table-wrap {
  max-width: 100%;
  overflow-x: auto;
}
.compact-table {
  min-width: 0 !important;
}
.compact-table th,
.compact-table td {
  white-space: normal;
}
.row-avatar {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  object-fit: cover;
  background: var(--primary-soft);
  display: grid;
  place-items: center;
  color: var(--primary);
}
@media (max-width: 1200px) {
  .topbar-center {
    display: none;
  }
  .topbar-start {
    min-width: auto;
  }
  .profile-layout,
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
  .task-summary {
    grid-template-columns: repeat(2, 1fr);
  }
  .settings-layout {
    grid-template-columns: 1fr;
  }
  .settings-nav {
    display: flex;
    overflow: auto;
  }
  .settings-nav a {
    white-space: nowrap;
  }
  .faq-layout {
    grid-template-columns: 1fr;
  }
  .faq-categories {
    display: flex;
    overflow: auto;
  }
  .faq-category {
    white-space: nowrap;
  }
}
@media (max-width: 1100px) {
  html.sidebar-prefold .sidebar {
    width: var(--sidebar);
    transform: translateX(100%);
  }
  html.sidebar-prefold .main {
    margin-right: 0;
  }
  .desktop-fold {
    display: none;
  }
  .header-breadcrumb {
    max-width: 250px;
    overflow: hidden;
  }
  .auth-shell {
    grid-template-columns: 1fr;
  }
  .auth-visual {
    display: none;
  }
  .auth-main {
    min-height: 100vh;
  }
  .messaging-shell {
    grid-template-columns: 1fr;
  }
  .conversation-list {
    border-left: 0;
    border-bottom: 1px solid var(--border);
    max-height: 250px;
    overflow: auto;
  }
}
@media (max-width: 700px) {
  .request-wizard {
    position: static;
    align-items: flex-start;
    flex-direction: column;
  }
  .wizard-steps {
    width: 100%;
  }
  .autosave-indicator {
    align-self: flex-end;
  }
  .jdp-full .jdp-layout {
    grid-template-columns: 1fr;
  }
  .jdp-slots {
    border-right: 0;
    border-top: 1px solid var(--border);
    padding: 12px 0 0;
  }
  .task-summary {
    grid-template-columns: 1fr 1fr;
  }
  .profile-identity {
    align-items: center;
    flex-wrap: wrap;
  }
  .profile-actions {
    width: 100%;
    margin: 0;
  }
  .auth-main {
    padding: 24px;
  }
  .meeting-row {
    grid-template-columns: 70px 4px minmax(0, 1fr);
  }
  .meeting-row > .actions {
    grid-column: 3;
  }
  .calendar-day-shell {
    min-width: 720px;
  }
  .page-heading {
    padding-top: 16px;
  }
}

/* ===== HOMA Functional Baseline 2.0 — Orchid-aligned application pages ===== */
.toolbar-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 14px 16px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.filter-row {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}
.search-field {
  position: relative;
  min-width: 230px;
  flex: 1;
}
.search-field i {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--muted);
}
.search-field input {
  padding-right: 38px;
}
.orchid-table td,
.orchid-table th {
  padding-top: 13px;
  padding-bottom: 13px;
}
.user-cell {
  display: flex;
  align-items: center;
  gap: 10px;
}
.avatar.small {
  width: 34px;
  height: 34px;
  font-size: 13px;
}
.admin-split,
.product-admin-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(320px, 0.75fr);
  gap: 18px;
  align-items: start;
}
.sticky-editor {
  position: sticky;
  top: 92px;
}
.admin-kpis {
  margin-bottom: 16px;
}
.input-action {
  display: flex;
  gap: 8px;
  align-items: center;
}
.check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}
.check-line {
  display: flex;
  align-items: center;
  gap: 8px;
}
.check-line input {
  width: auto;
}
.code-field,
.route-input {
  font-family: Consolas, monospace;
}
.role-grid {
  display: grid;
  grid-template-columns: minmax(250px, 0.7fr) minmax(0, 1.3fr);
  gap: 18px;
}
.role-cards {
  display: grid;
  gap: 10px;
}
.role-card {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  gap: 11px;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 13px;
  transition: 0.18s;
}
.role-card:hover,
.role-card.active {
  border-color: var(--primary);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--primary) 12%, transparent);
}
.role-icon {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: var(--primary-soft);
  display: grid;
  place-items: center;
  color: var(--primary);
  font-size: 20px;
}
.role-stats {
  color: var(--muted);
  font-size: 13px;
}
.permission-groups {
  display: grid;
  gap: 16px;
}
.permission-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 12px;
  background: var(--surface-2);
  border-radius: 10px;
}
.product-list-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.product-card {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 13px;
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: 13px;
  padding: 13px;
  transition: 0.18s;
}
.product-card:hover,
.product-card.selected {
  border-color: var(--primary);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--primary) 12%, transparent);
}
.product-thumb {
  width: 72px;
  height: 72px;
  border-radius: 12px;
  background: linear-gradient(145deg, var(--primary-soft), var(--surface-2));
  display: grid;
  place-items: center;
  color: var(--primary);
  font-size: 28px;
}
.product-info h3 {
  font-size: 13px;
  margin: 2px 0 8px;
}
.product-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 13px;
}
.status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  display: inline-block;
}
.status-dot.online {
  background: var(--success);
}
.status-dot.offline {
  background: var(--muted);
}
.task-overview {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  margin-bottom: 16px;
}
.task-mini-stats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.task-mini-stats > div {
  min-width: 90px;
  padding: 9px 11px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  text-align: center;
}
.segmented-tabs {
  display: flex;
  gap: 4px;
  background: var(--surface-2);
  padding: 4px;
  border-radius: 10px;
}
.segmented-tabs a {
  padding: 8px 12px;
  border-radius: 8px;
  color: var(--muted);
  font-size: 13px;
}
.segmented-tabs a.active {
  background: var(--surface);
  color: var(--primary);
  box-shadow: var(--shadow);
}
.task-board-list {
  display: grid;
  gap: 9px;
}
.task-card-row {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto auto;
  gap: 13px;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 13px 15px;
}
.task-card-row.unread {
  border-right: 3px solid var(--primary);
}
.task-card-row.overdue {
  border-color: color-mix(in srgb, var(--danger) 35%, var(--border));
}
.task-status-mark {
  width: 8px;
  height: 38px;
  border-radius: 10px;
  background: var(--primary);
}
.task-title-line {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.task-request,
.task-actor,
.task-due {
  color: var(--muted);
  font-size: 13px;
}
.task-actor {
  min-width: 120px;
}
.task-due {
  direction: ltr;
  text-align: left;
}
.transaction-feed {
  display: grid;
  gap: 8px;
  padding: 4px 0;
}
.transaction-item {
  display: grid;
  grid-template-columns: 42px 1fr auto;
  gap: 11px;
  align-items: center;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.tx-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--warning-soft);
  color: #b17a00;
}
.tx-icon.success {
  background: var(--success-soft);
  color: var(--success);
}
.transaction-kpis .success-soft {
  background: linear-gradient(145deg, var(--surface), var(--success-soft));
}
.transaction-kpis .warning-soft {
  background: linear-gradient(145deg, var(--surface), var(--warning-soft));
}
.audit-list {
  display: grid;
}
.audit-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 14px 4px;
  border-bottom: 1px solid var(--border);
}
.audit-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
}
.audit-main h4 {
  margin: 0 0 5px;
  font-size: 13px;
}
.audit-main p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}
.audit-diff {
  margin-top: 8px;
  background: var(--surface-2);
  border-radius: 8px;
  padding: 8px;
  font-size: 13px;
  max-height: 140px;
  overflow: auto;
}
.entity-pill {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 5px 8px;
  font-size: 13px;
}
.log-table .log-level {
  display: inline-flex;
  min-width: 58px;
  justify-content: center;
  border-radius: 20px;
  padding: 5px 8px;
  font-size: 13px;
  font-family: Arial, sans-serif;
}
.log-level.info {
  background: var(--info-soft);
  color: var(--info);
}
.log-level.warning,
.log-level.warn {
  background: var(--warning-soft);
  color: #a16e00;
}
.log-level.error,
.log-level.critical {
  background: var(--danger-soft);
  color: var(--danger);
}
.inline-details summary {
  cursor: pointer;
  color: var(--primary);
}
.inline-details pre {
  max-width: 480px;
  white-space: pre-wrap;
  word-break: break-all;
  background: var(--surface-2);
  padding: 9px;
  border-radius: 8px;
}
.settings-shell {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
.settings-nav {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 8px;
  box-shadow: var(--shadow);
  position: sticky;
  top: 92px;
}
.settings-nav a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 11px;
  border-radius: 9px;
  color: var(--muted);
  margin: 2px;
}
.settings-nav a i {
  font-size: 18px;
}
.settings-nav a:hover,
.settings-nav a.active {
  background: var(--primary-soft);
  color: var(--primary);
}
.appearance-preview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.theme-choice {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  min-height: 125px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
}
.theme-choice i {
  font-size: 30px;
  color: var(--primary);
}
.theme-choice:hover,
.theme-choice.active {
  border-color: var(--primary);
  background: var(--primary-soft);
}
.theme-choice small {
  color: var(--muted);
}
.setting-summary {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 9px;
  padding: 14px;
  background: var(--surface-2);
  border-radius: 10px;
  margin-bottom: 14px;
}
.setting-summary span {
  color: var(--muted);
}
.health-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.health-grid > div {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 15px;
  border: 1px solid var(--border);
  border-radius: 12px;
}
.health-grid i {
  font-size: 23px;
  color: var(--primary);
}
.health-grid span {
  color: var(--muted);
  font-size: 13px;
}
.health-grid .ok {
  color: var(--success);
}
.health-grid .bad {
  color: var(--danger);
}
.info-callout {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-top: 14px;
  padding: 13px;
  border-radius: 10px;
  background: var(--info-soft);
  color: var(--info);
}
.switch-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
}
.switch-row small {
  display: block;
  color: var(--muted);
  margin-top: 3px;
}
.switch {
  position: relative;
  width: 44px;
  height: 24px;
}
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.switch span {
  position: absolute;
  inset: 0;
  background: var(--border);
  border-radius: 20px;
  cursor: pointer;
}
.switch span:after {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  background: #fff;
  border-radius: 50%;
  right: 3px;
  top: 3px;
  transition: 0.18s;
  box-shadow: 0 2px 5px #0002;
}
.switch input:checked + span {
  background: var(--primary);
}
.switch input:checked + span:after {
  right: 23px;
}
.faq-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 26px;
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #fff;
  border-radius: 16px;
  margin-bottom: 17px;
  overflow: hidden;
  position: relative;
}
.faq-hero:after {
  content: "?";
  position: absolute;
  left: 22px;
  top: -30px;
  font: 700 170px Arial;
  color: #ffffff12;
}
.faq-hero h2 {
  margin: 4px 0 6px;
  font-size: 22px;
}
.faq-hero p {
  margin: 0;
  color: #ffffffd9;
}
.eyebrow {
  font-size: 13px;
  letter-spacing: 0.5px;
  opacity: 0.8;
}
.faq-search {
  position: relative;
  z-index: 2;
  width: min(360px, 100%);
}
.faq-search input {
  background: #fff;
  color: #2d2b3d;
  padding-right: 38px;
}
.faq-search i {
  position: absolute;
  right: 13px;
  top: 14px;
  color: #777;
}
.faq-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 16px;
}
.faq-categories {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.faq-categories button {
  border: 0;
  background: transparent;
  text-align: right;
  padding: 10px;
  border-radius: 9px;
  color: var(--muted);
  cursor: pointer;
}
.faq-categories button.active,
.faq-categories button:hover {
  background: var(--primary-soft);
  color: var(--primary);
}
.faq-list {
  display: grid;
  gap: 8px;
}
.faq-item {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 11px;
  overflow: hidden;
}
.faq-question {
  width: 100%;
  border: 0;
  background: transparent;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  cursor: pointer;
  text-align: right;
}
.faq-question i {
  transition: 0.18s;
}
.faq-answer {
  display: none;
  padding: 0 16px 15px;
  color: var(--muted);
  line-height: 2;
}
.faq-item.open .faq-answer {
  display: block;
}
.faq-item.open .faq-question i {
  transform: rotate(45deg);
}
.inline-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 10px;
}
.navigation-builder {
  display: grid;
  gap: 8px;
}
.navigation-row {
  display: grid;
  grid-template-columns: 28px 38px minmax(140px, 1fr) minmax(160px, 1fr) auto;
  gap: 9px;
  align-items: center;
  padding: 10px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
}
.navigation-row.core {
  border-right: 3px solid var(--primary);
}
.drag-handle {
  color: var(--muted);
  cursor: grab;
}
.nav-icon-preview {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
}
.lock-mark {
  color: var(--warning);
}
.top-dropdown-modal {
  position: fixed;
  inset: 0;
  background: #1613267d;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.modal-card {
  width: min(680px, 100%);
  max-height: 90vh;
  overflow: auto;
  margin: 0;
}
.upload-image-preview {
  margin-top: 9px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 7px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-2);
}
.upload-image-preview img {
  width: 86px;
  height: 66px;
  border-radius: 8px;
  object-fit: cover;
}
.upload-image-preview small {
  color: var(--muted);
  max-width: 200px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.compact-row {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}
.block {
  display: block;
}
.one {
  grid-template-columns: 1fr;
}
.danger-soft {
  background: linear-gradient(145deg, var(--surface), var(--danger-soft));
}
.info-soft {
  background: linear-gradient(145deg, var(--surface), var(--info-soft));
}
.warning-soft {
  background: linear-gradient(145deg, var(--surface), var(--warning-soft));
}
@media (max-width: 1050px) {
  .admin-split,
  .product-admin-grid,
  .role-grid,
  .settings-shell {
    grid-template-columns: 1fr;
  }
  .sticky-editor,
  .settings-nav {
    position: static;
  }
  .settings-nav {
    display: flex;
    overflow: auto;
  }
  .settings-nav a {
    white-space: nowrap;
  }
  .health-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .faq-layout {
    grid-template-columns: 1fr;
  }
  .faq-categories {
    flex-direction: row;
    overflow: auto;
  }
  .product-list-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 700px) {
  .toolbar-card,
  .faq-hero {
    align-items: stretch;
    flex-direction: column;
  }
  .search-field,
  .faq-search {
    min-width: 0;
    width: 100%;
  }
  .appearance-preview,
  .permission-list,
  .check-grid {
    grid-template-columns: 1fr;
  }
  .health-grid {
    grid-template-columns: 1fr 1fr;
  }
  .task-card-row {
    grid-template-columns: 7px 1fr;
  }
  .task-card-row > .task-actor,
  .task-card-row > .task-due {
    grid-column: 2;
  }
  .navigation-row {
    grid-template-columns: 24px 34px 1fr auto;
  }
  .navigation-row .route-input {
    grid-column: 3/-1;
  }
  .product-list-grid {
    grid-template-columns: 1fr;
  }
  .setting-summary {
    grid-template-columns: 1fr;
  }
  .admin-kpis {
    grid-template-columns: 1fr 1fr;
  }
}

.user-meta small,
.user-menu-head small {
  direction: rtl;
  text-align: right;
}
.top-dropdown-modal {
  display: none;
}
.top-dropdown-modal.open {
  display: flex;
}
.ticket-page-head,
.notification-center-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
}
.ticket-page-head h2,
.notification-center-head h2 {
  margin: 4px 0 4px;
  font-size: 21px;
}
.ticket-page-head p,
.notification-center-head p {
  margin: 0;
  color: var(--muted);
}
.ticket-no {
  color: var(--primary);
  font-family: Arial, sans-serif;
}
.row-title {
  font-family: "VazirHoma";
  font-weight: 700;
}
.cell-sub {
  display: block;
  color: var(--muted);
  margin-top: 4px;
  font-size: 13px;
}
.row-alert td {
  background: color-mix(in srgb, var(--danger-soft) 36%, var(--surface));
}
.sla-chip {
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap;
}
.sla-chip.overdue {
  color: var(--danger);
  font-family: "VazirHoma";
}
.notification-center {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 16px;
}
.notification-filters {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--border);
  padding: 8px;
  border-radius: var(--radius);
  align-self: start;
  position: sticky;
  top: 92px;
}
.notification-filters a {
  padding: 9px 10px;
  border-radius: 8px;
  color: var(--muted);
}
.notification-filters a:hover,
.notification-filters a.active {
  color: var(--primary);
  background: var(--primary-soft);
}
.notification-list {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}
.notification-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 13px 15px;
  border-bottom: 1px solid var(--border);
}
.notification-row:last-child {
  border-bottom: 0;
}
.notification-row.unread {
  background: color-mix(in srgb, var(--primary-soft) 65%, var(--surface));
  border-right: 3px solid var(--primary);
}
.notification-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 18px;
}
.notification-content b {
  display: block;
  font-size: 13px;
}
.notification-content p {
  margin: 4px 0;
  color: var(--muted);
}
.notification-content small {
  color: var(--muted);
  font-size: 13px;
}
.ticket-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 800px) {
  .notification-center {
    grid-template-columns: 1fr;
  }
  .notification-filters {
    position: static;
    flex-direction: row;
    overflow: auto;
  }
  .ticket-page-head,
  .notification-center-head {
    align-items: stretch;
    flex-direction: column;
  }
  .ticket-kpis {
    grid-template-columns: 1fr 1fr;
  }
}
.label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.mini-link {
  font-size: 13px;
  color: var(--primary);
}
table.report-simple {
  min-width: 0;
}
.split .table-wrap:has(.report-simple) {
  overflow: visible;
}

/* ===== HOMA 2.0.1 UI stabilization ===== */
/* Typography */
.btn {
  font-size: 13.5px;
  line-height: 1.65;
  padding: 9px 15px;
}
.btn-sm {
  font-size: 13px;
  padding: 7px 11px;
}
.form-group label,
.label-row > label,
.check-line,
.radio-row label,
.check-row label {
  font-size: 13px;
  line-height: 1.8;
}
.help,
.error {
  font-size: 13px;
}
.badge {
  font-size: 13px;
}
.card-head h2 {
  font-size: 15px;
}
.page-heading {
  padding-bottom: 12px;
}
.page-heading h1 {
  margin-bottom: 0;
}
.card-body.no-pad {
  padding: 0;
}
/* prevent values and currency from visually sticking */
.kpi-card b,
.mini-stat b,
.financial-summary b,
.task-mini-stats b,
.executive-kpis > div > b {
  display: block;
  unicode-bidi: isolate;
  white-space: nowrap;
}
.kpi-card small,
.mini-stat small {
  display: block;
  margin-top: 3px;
}
.financial-summary > div {
  min-width: 0;
}
.financial-summary b {
  margin-top: 5px;
}
/* Applicant dashboard */
.applicant-welcome {
  min-height: 190px;
  justify-content: space-between;
  gap: 28px;
  padding: 28px 34px;
  background: linear-gradient(135deg, #9f2bb4 0%, #7366ff 100%);
}
.applicant-welcome > div:first-child {
  position: relative;
  z-index: 2;
  max-width: 680px;
}
.applicant-welcome .welcome-art {
  position: relative;
  z-index: 2;
  flex: 0 0 180px;
  height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.applicant-welcome .welcome-art img {
  display: block;
  width: 138px;
  height: 138px;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 26px;
  box-shadow: 0 18px 45px rgba(30, 21, 80, 0.18);
  background: #fff;
}
.applicant-welcome h2 {
  font-size: 24px;
}
.applicant-welcome p {
  font-size: 13px;
  line-height: 2;
}
.applicant-kpis .kpi-card {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 118px;
}
.applicant-kpis .kpi-card:before {
  display: none;
}
.kpi-icon {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 22px;
}
.kpi-icon.soft-warning {
  background: var(--warning-soft);
  color: #b17a00;
}
.kpi-icon.soft-success {
  background: var(--success-soft);
  color: var(--success);
}
.kpi-icon.soft-info {
  background: var(--info-soft);
  color: var(--info);
}
.applicant-kpis .kpi-card span {
  display: block;
  color: var(--muted);
}
.applicant-kpis .kpi-card b {
  font-size: 25px;
  margin: 4px 0 0;
}
.applicant-kpis .kpi-card small {
  color: var(--muted);
}
.resume-draft {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-right: 4px solid var(--warning);
  border-radius: 12px;
  padding: 13px 15px;
  margin: 0 0 18px;
  box-shadow: var(--shadow);
}
.resume-draft > div {
  flex: 1;
}
.resume-draft p {
  margin: 4px 0 0;
  color: var(--muted);
}
.resume-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--warning-soft);
  color: #b17a00;
  display: grid;
  place-items: center;
  font-size: 20px;
}
.applicant-request-list {
  display: grid;
  gap: 10px;
}
.request-summary-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  transition: 0.18s;
}
.request-summary-card:hover {
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
  box-shadow: var(--shadow);
}
.request-service-icon {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 20px;
}
.request-summary-main > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.request-summary-main small,
.request-last-status small {
  display: block;
  color: var(--muted);
  margin-top: 5px;
}
.request-last-status {
  text-align: left;
}
.progress-line {
  height: 4px;
  background: var(--surface-2);
  border-radius: 4px;
  margin-top: 8px;
  overflow: hidden;
}
.progress-line i {
  display: block;
  height: 100%;
  width: 58%;
  background: var(--primary);
}
.applicant-list-actions {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 14px;
}
/* Executive dashboard */
.executive-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  background: linear-gradient(135deg, var(--surface), var(--primary-soft));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px 22px;
  margin-bottom: 18px;
}
.executive-hero h2 {
  margin: 3px 0 0;
}
.executive-hero p {
  display: none;
}
.executive-date {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
}
.executive-kpis .kpi-card:before {
  display: none;
}
.kpi-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--muted);
}
.kpi-top i {
  font-size: 20px;
  color: var(--primary);
}
.executive-kpis > .kpi-card > b {
  font-size: 26px;
  margin: 9px 0 4px;
}
.spark {
  height: 5px;
  background: var(--surface-2);
  border-radius: 5px;
  overflow: hidden;
  margin-top: 12px;
}
.spark i {
  display: block;
  height: 100%;
  background: var(--primary);
  border-radius: 5px;
}
.spark.warning i {
  background: var(--warning);
}
.spark.success i {
  background: var(--success);
}
.spark.info i {
  background: var(--info);
}
.dashboard-commerce-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 18px;
}
.dashboard-commerce-grid.lower {
  grid-template-columns: 1.15fr 0.85fr;
}
.chart-card .card-head small {
  color: var(--muted);
  display: block;
  margin-top: 4px;
}
.bar-chart,
.service-chart {
  display: grid;
  gap: 12px;
}
.bar-row,
.service-bar {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr) 34px;
  gap: 10px;
  align-items: center;
}
.bar-row > div,
.service-bar > div {
  height: 8px;
  border-radius: 8px;
  background: var(--surface-2);
  overflow: hidden;
}
.bar-row i,
.service-bar i {
  display: block;
  height: 100%;
  background: var(--primary);
  border-radius: 8px;
}
.service-bar i.c2 {
  background: var(--info);
}
.service-bar i.c3 {
  background: var(--success);
}
.service-bar i.c4 {
  background: var(--warning);
}
.service-bar i.c5 {
  background: var(--accent);
}
.compact-request-table {
  display: grid;
}
.compact-request-table > a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 130px auto;
  gap: 10px;
  align-items: center;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
}
.compact-request-table > a:last-child {
  border-bottom: 0;
}
.compact-request-table small {
  display: block;
  color: var(--muted);
  margin-top: 3px;
}
.activity-mini {
  display: grid;
  gap: 13px;
}
.activity-mini > div {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.activity-dot {
  width: 9px;
  height: 9px;
  margin-top: 5px;
  border-radius: 50%;
  background: var(--primary);
  box-shadow: 0 0 0 4px var(--primary-soft);
}
.activity-mini small {
  display: block;
  color: var(--muted);
  margin-top: 4px;
}
/* Tasks / inbox */
.task-overview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 20px;
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  margin-bottom: 14px;
}
.task-overview h2 {
  margin: 3px 0 0;
  font-size: 20px;
}
.task-overview p {
  display: none;
}
.task-mini-stats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.task-mini-stats > span {
  min-width: 90px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 11px;
}
.task-mini-stats > span.danger {
  background: var(--danger-soft);
  color: var(--danger);
}
.task-mini-stats b {
  font-size: 17px;
}
.toolbar-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 12px;
  box-shadow: var(--shadow);
  margin-bottom: 14px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}
.segmented-tabs {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.segmented-tabs a {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 11px;
  border-radius: 9px;
  color: var(--muted);
}
.segmented-tabs a.active {
  background: var(--primary-soft);
  color: var(--primary);
  font-family: "VazirHoma";
}
.segmented-tabs em {
  font-style: normal;
  background: var(--surface-2);
  border-radius: 20px;
  padding: 1px 6px;
}
.search-field {
  position: relative;
  min-width: 250px;
}
.search-field i {
  position: absolute;
  right: 11px;
  top: 12px;
  color: var(--muted);
}
.search-field input {
  padding-right: 34px;
}
.task-board-list {
  display: grid;
  gap: 9px;
}
.task-card-row {
  display: grid;
  grid-template-columns: 6px minmax(0, 1fr) minmax(120px, 160px) minmax(
      140px,
      180px
    ) auto;
  gap: 12px;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px 13px;
  box-shadow: 0 3px 12px rgba(35, 40, 84, 0.035);
}
.task-card-row.unread {
  border-color: color-mix(in srgb, var(--primary) 38%, var(--border));
  background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface));
}
.task-card-row.overdue {
  border-color: color-mix(in srgb, var(--danger) 40%, var(--border));
}
.task-status-mark {
  width: 5px;
  height: 52px;
  border-radius: 5px;
  background: var(--primary);
}
.task-card-row.overdue .task-status-mark {
  background: var(--danger);
}
.task-title-line {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
}
.task-title-line h3 {
  font-size: 14px;
  margin: 0;
}
.task-request {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  color: var(--muted);
  margin-top: 6px;
}
.task-request > a {
  color: var(--primary);
}
.task-actor,
.task-due {
  min-width: 0;
}
.task-actor small,
.task-due small {
  display: block;
  color: var(--muted);
  font-size: 13px;
}
.task-actor b,
.task-due b {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  white-space: normal;
  line-height: 1.8;
}
/* Request details */
.request-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.request-toolbar-actions {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}
.request-hero-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  background: linear-gradient(135deg, var(--surface), var(--primary-soft));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 19px 21px;
  margin-bottom: 18px;
  box-shadow: var(--shadow);
}
.request-hero-card h2 {
  margin: 4px 0 8px;
  font-size: 20px;
}
.request-hero-meta {
  display: flex;
  gap: 14px;
  align-items: center;
  flex-wrap: wrap;
  color: var(--muted);
}
.request-hero-meta span {
  display: flex;
  align-items: center;
  gap: 5px;
}
.request-hero-status {
  text-align: left;
}
.request-hero-status small {
  display: block;
  color: var(--muted);
  margin-top: 6px;
}
.process-stepper {
  display: flex;
  gap: 0;
  overflow: auto;
  padding: 5px 2px;
}
.process-step {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 165px;
  position: relative;
  padding-left: 18px;
}
.process-step:after {
  content: "";
  height: 2px;
  background: var(--border);
  flex: 1;
  min-width: 22px;
  margin-right: 8px;
}
.process-step:last-child:after {
  display: none;
}
.process-step > span {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--success-soft);
  color: var(--success);
  display: grid;
  place-items: center;
  font-family: "VazirHoma";
  flex: 0 0 28px;
}
.process-step b {
  display: block;
  font-size: 13px;
}
.process-step small {
  display: block;
  color: var(--muted);
  margin-top: 2px;
  font-size: 13px;
}
.activity-timeline {
  display: grid;
  gap: 0;
}
.activity-event {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 11px;
  padding: 11px 0;
  border-bottom: 1px solid var(--border);
}
.activity-event:last-child {
  border-bottom: 0;
}
.activity-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 18px;
}
.activity-event-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.activity-event-head small {
  color: var(--muted);
}
.activity-event p {
  margin: 5px 0 0;
  color: var(--muted);
}
.detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.detail-field {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 11px;
  min-width: 0;
}
.detail-field.wide {
  grid-column: 1/-1;
}
.detail-field small {
  display: block;
  color: var(--muted);
  margin-bottom: 5px;
}
.detail-field b {
  white-space: normal;
  word-break: break-word;
}
.detail-image-preview {
  display: block;
  width: 150px;
  height: 100px;
  object-fit: cover;
  border-radius: 9px;
  margin-top: 8px;
}
.schedule-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.schedule-card {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 11px;
  padding: 12px;
}
.schedule-card > i {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 18px;
}
.schedule-card small,
.schedule-card span {
  display: block;
  color: var(--muted);
}
.schedule-card b {
  display: block;
  margin: 4px 0;
}
.financial-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.financial-summary > div {
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-2);
}
.financial-summary small {
  display: block;
  color: var(--muted);
}
.attachment-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.attachment-card {
  display: flex;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px;
  min-width: 0;
}
.attachment-card img,
.file-type {
  width: 58px;
  height: 48px;
  border-radius: 8px;
  object-fit: cover;
  flex: 0 0 58px;
}
.file-type {
  display: grid;
  place-items: center;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 22px;
}
.attachment-card div {
  min-width: 0;
}
.attachment-card b,
.attachment-card small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.attachment-card small {
  color: var(--muted);
  margin-top: 4px;
}
/* Calendar */
.calendar-toolbar {
  display: grid;
  grid-template-columns: auto minmax(360px, 1fr) auto;
  gap: 16px;
  align-items: center;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 12px 14px;
  box-shadow: var(--shadow);
  margin-bottom: 12px;
}
.calendar-nav {
  display: flex;
  align-items: center;
  gap: 6px;
}
.calendar-current {
  display: flex;
  flex-direction: column;
  padding: 0 8px;
}
.calendar-current small {
  color: var(--muted);
  margin-top: 2px;
}
.calendar-current.today {
  border-right: 3px solid var(--primary);
  padding-right: 10px;
}
.calendar-toolbar .filter-row {
  display: grid;
  grid-template-columns: minmax(130px, 1fr) minmax(150px, 1fr) minmax(
      150px,
      1fr
    ) auto;
  gap: 8px;
}
.calendar-view-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
}
.calendar-view-tabs button {
  border: 0;
  background: var(--primary-soft);
  color: var(--primary);
  padding: 8px 12px;
  border-radius: 9px;
}
.calendar-legend {
  display: flex;
  gap: 16px;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 2px 11px;
  color: var(--muted);
  font-size: 13px;
}
.calendar-legend span {
  display: flex;
  align-items: center;
  gap: 6px;
}
.legend {
  width: 10px;
  height: 10px;
  border-radius: 3px;
}
.legend.registered {
  background: #f3c74f;
}
.legend.tentative {
  background: #f0953f;
}
.legend.confirmed {
  background: #e85b6a;
}
.legend.blocked {
  background: #7f8497;
}
.resource-calendar {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: auto;
  position: relative;
}
.resource-calendar.is-today {
  box-shadow: inset 0 0 0 2px
      color-mix(in srgb, var(--primary) 45%, transparent),
    var(--shadow);
}
.resource-header {
  display: grid;
  grid-template-columns: 72px repeat(var(--hall-count, 6), minmax(180px, 1fr));
  position: sticky;
  top: 0;
  z-index: 9;
  background: var(--surface);
  min-width: max-content;
  border-bottom: 1px solid var(--border);
}
.time-head,
.hall-head {
  height: 62px;
  padding: 10px;
  border-left: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.time-head {
  align-items: center;
  color: var(--muted);
  min-width: 72px;
}
.hall-head {
  min-width: 180px;
}
.hall-head small {
  color: var(--muted);
  margin-top: 3px;
}
.resource-body {
  display: grid;
  grid-template-columns: 72px repeat(var(--hall-count, 6), minmax(180px, 1fr));
  min-width: max-content;
}
.time-axis {
  position: relative;
  width: 72px;
  background: var(--surface-2);
  border-left: 1px solid var(--border);
}
.time-axis span {
  position: absolute;
  right: 9px;
  transform: translateY(-50%);
  font: 11px Arial, sans-serif;
  color: var(--muted);
  direction: ltr;
}
.hall-track {
  position: relative;
  min-width: 180px;
  border-left: 1px solid var(--border);
  background: linear-gradient(
    to bottom,
    color-mix(in srgb, var(--border) 48%, transparent) 1px,
    transparent 1px
  );
  background-size: 100% 64px;
}
.hour-line {
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: var(--border);
  opacity: 0.72;
}
.calendar-event {
  position: absolute;
  right: 5px;
  left: 5px;
  border-radius: 8px;
  padding: 5px 7px;
  overflow: hidden;
  z-index: 4;
  border-right: 4px solid transparent;
  box-shadow: 0 3px 10px rgba(35, 40, 84, 0.08);
  font-size: 13px;
  line-height: 1.5;
}
.calendar-event b,
.calendar-event small,
.calendar-event em {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calendar-event em {
  font-style: normal;
  opacity: 0.78;
}
.calendar-event.registered {
  background: #fff5c7;
  color: #755a00;
  border-right-color: #e7b929;
}
.calendar-event.tentative {
  background: #fff0df;
  color: #8e4e0d;
  border-right-color: #f08a37;
}
.calendar-event.confirmed {
  background: #fdebed;
  color: #9a2d3b;
  border-right-color: #e85b6a;
}
.calendar-event.blocked {
  background: #eceef3;
  color: #545866;
  border-right-color: #7f8497;
}
.calendar-event.own {
  outline: 2px solid color-mix(in srgb, var(--primary) 35%, transparent);
}
.unavailable-overlay,
.closed-overlay {
  position: absolute;
  left: 0;
  right: 0;
  background: repeating-linear-gradient(
    135deg,
    rgba(120, 124, 145, 0.08),
    rgba(120, 124, 145, 0.08) 8px,
    rgba(120, 124, 145, 0.15) 8px,
    rgba(120, 124, 145, 0.15) 16px
  );
  z-index: 2;
  pointer-events: none;
}
.closed-overlay {
  inset: 0;
  display: grid;
  place-items: center;
  color: var(--muted);
}
.calendar-admin-note {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 11px;
  padding: 11px 13px;
  background: var(--info-soft);
  color: var(--info);
  border-radius: 10px;
}
.calendar-admin-note span {
  flex: 1;
}
/* SMS */
.sms-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.mini-stat {
  display: flex;
  align-items: center;
  gap: 11px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px;
  box-shadow: var(--shadow);
}
.mini-stat > i {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 19px;
}
.mini-stat small {
  color: var(--muted);
}
.mini-stat b {
  font-size: 19px;
  margin-top: 3px;
}
.sms-toolbar form {
  width: 100%;
}
.sms-toolbar select {
  max-width: 170px;
}
.sms-toolbar input {
  max-width: 360px;
}
.sms-body-cell {
  max-width: 520px;
  white-space: normal;
  line-height: 1.9;
}
.sms-body-cell small {
  display: block;
  margin-top: 5px;
}
/* Profile image reliability */
.avatar-img {
  display: block;
  object-fit: cover;
  background: var(--primary-soft);
}
/* Report/table stabilization */
.card > .card-body > .table-wrap {
  max-width: 100%;
  overflow-x: auto;
}
.report-simple {
  width: 100%;
  table-layout: auto;
}
.report-simple th,
.report-simple td {
  white-space: normal;
}
@media (max-width: 1200px) {
  .dashboard-commerce-grid,
  .dashboard-commerce-grid.lower {
    grid-template-columns: 1fr;
  }
  .calendar-toolbar {
    grid-template-columns: 1fr;
  }
  .calendar-toolbar .filter-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .financial-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .attachment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 850px) {
  .applicant-welcome .welcome-art {
    display: none;
  }
  .task-card-row {
    grid-template-columns: 5px minmax(0, 1fr) auto;
  }
  .task-card-row .task-actor,
  .task-card-row .task-due {
    grid-column: 2;
  }
  .task-card-row > a.btn {
    grid-column: 3;
    grid-row: 1/3;
  }
  .toolbar-card {
    align-items: stretch;
    flex-direction: column;
  }
  .search-field {
    min-width: 0;
  }
  .calendar-toolbar .filter-row {
    grid-template-columns: 1fr;
  }
  .schedule-cards,
  .detail-grid,
  .attachment-grid {
    grid-template-columns: 1fr;
  }
  .request-hero-card,
  .request-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }
  .financial-summary {
    grid-template-columns: 1fr 1fr;
  }
  .sms-summary-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 600px) {
  .kpi,
  .applicant-kpis,
  .executive-kpis {
    grid-template-columns: 1fr 1fr;
  }
  .financial-summary,
  .sms-summary-grid {
    grid-template-columns: 1fr;
  }
  .request-summary-card {
    grid-template-columns: 42px minmax(0, 1fr);
  }
  .request-last-status {
    grid-column: 2;
    text-align: right;
  }
  .compact-request-table > a {
    grid-template-columns: 1fr auto;
  }
  .compact-request-table > a > .ltr {
    display: none;
  }
}

/* ===== HOMA 2.1 UI stabilization ===== */
/* Orchid-like shared page shell: consistent typography, header alignment and spacing */
html,
body,
input,
select,
textarea,
.ltr,
.time-axis span,
.calendar-event,
.metric-value,
.kpi-card b,
.kpi-card small {
  font-family: "ShabnamHoma", Tahoma, sans-serif;
}
.btn,
.form-group label,
.radio-row label,
.check-row label {
  font-size: 13px;
}
.btn {
  min-height: 40px;
  padding: 9px 15px;
}
.btn-sm {
  min-height: 34px;
  font-size: 13px;
  padding: 6px 11px;
}
.form-group label {
  line-height: 1.8;
}
.help {
  font-size: 13px;
}
.badge {
  font-size: 13px;
}
.brand {
  height: 82px;
  min-height: 82px;
}
.brand-logo-only img {
  max-width: 168px;
  max-height: 62px;
  width: auto;
  height: auto;
}
.sidebar-scroll {
  padding-top: 12px;
}
.menu-caption {
  display: none !important;
}
.page-heading {
  min-height: 68px;
  padding: 20px 28px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.page-heading h1 {
  margin: 0;
  font-size: 22px;
}
.page-actions,
.request-toolbar,
.toolbar-card {
  align-items: center;
}
.content {
  padding-top: 12px;
}
.user-meta small {
  direction: rtl;
}
.user-menu-head small {
  direction: rtl;
}
.metric-value,
.money-value {
  display: inline-flex !important;
  align-items: baseline;
  gap: 7px;
  white-space: nowrap;
}
.metric-value .unit,
.money-value .unit {
  font-family: "ShabnamHoma";
  font-size: 13px;
  color: var(--muted);
}
/* Avatar always keeps a real image box and never inherits icon sizing */
.avatar-img {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 11px;
  object-fit: cover;
  overflow: hidden;
}
.row-avatar {
  object-fit: cover;
}
/* Calendar: only horizontal scrolling belongs to resource grid; page owns vertical scrolling */
.resource-calendar {
  overflow: visible;
}
.resource-scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: inherit;
}
.resource-header {
  position: sticky;
  top: var(--topbar);
  z-index: 12;
}
.time-axis span:first-child {
  transform: none !important;
  top: 7px !important;
}
.time-axis span:last-child {
  transform: translateY(-100%);
}
.calendar-view-tabs {
  background: var(--surface-2);
  border: 1px solid var(--border);
  padding: 3px;
  border-radius: 10px;
}
.calendar-view-tabs a {
  padding: 7px 12px;
  border-radius: 8px;
  color: var(--muted);
}
.calendar-view-tabs a.active {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--primary) 20%, transparent);
}
.month-calendar {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.month-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  background: var(--surface-2);
  border-bottom: 1px solid var(--border);
}
.month-weekdays span {
  text-align: center;
  padding: 12px;
  color: var(--muted);
  font-family: "VazirHoma";
}
.month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(120px, 1fr));
}
.month-day {
  min-height: 125px;
  padding: 9px;
  border-left: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}
.month-day.empty {
  background: var(--surface-2);
}
.month-day.today {
  background: color-mix(in srgb, var(--primary-soft) 58%, var(--surface));
  box-shadow: inset 0 0 0 2px var(--primary);
}
.month-day-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 7px;
}
.month-day-head b {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
}
.month-day.today .month-day-head b {
  background: var(--primary);
  color: #fff;
}
.month-day-head small {
  color: var(--primary);
  font-size: 13px;
}
.month-events {
  display: grid;
  gap: 5px;
}
.month-event {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 6px;
  border-radius: 7px;
  font-size: 13px;
  min-width: 0;
}
.month-event i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: 0 0 7px;
}
.month-event span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.month-event.registered {
  background: #fff5c7;
  color: #755a00;
}
.month-event.registered i {
  background: #e7b929;
}
.month-event.tentative {
  background: #fff0df;
  color: #8e4e0d;
}
.month-event.tentative i {
  background: #f08a37;
}
.month-event.confirmed {
  background: #fdebed;
  color: #9a2d3b;
}
.month-event.confirmed i {
  background: #e85b6a;
}
.more-events {
  color: var(--muted);
  padding: 2px 4px;
}
/* Applicant SMS is a document/history view, not an analytics dashboard */
.sms-documents .card-body {
  padding: 0;
}
.sms-documents table {
  min-width: 760px;
}
/* Proxy registration helper */
.input-action {
  display: flex;
  gap: 8px;
  align-items: center;
}
.input-action select {
  flex: 1;
}
.request-wizard {
  position: relative;
}
.wizard-steps button {
  font-size: 13px;
  min-height: 42px;
}
/* More compact large admin editors */
.admin-split,
.product-admin-grid {
  align-items: start;
}
.toolbar-card {
  min-height: 58px;
}
@media (max-width: 900px) {
  .month-grid {
    min-width: 900px;
  }
  .month-calendar {
    overflow-x: auto;
  }
  .brand-logo-only img {
    max-width: 145px;
  }
  .page-heading {
    padding-inline: 18px;
  }
}

/* ===== HOMA 2.2 regression + UI stabilization ===== */
/* one shared page heading; page-specific subtitles are intentionally not part of the shell */
.page-heading {
  min-height: 64px;
  padding: 18px 26px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.page-heading h1 {
  margin: 0;
  line-height: 1.25;
}
.page-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.page-actions .btn,
.page-actions .inline-form {
  margin: 0;
}
.inline-form {
  display: inline-flex;
}
/* brand baseline: less vertical padding so sidebar divider aligns with topbar divider */
.brand {
  height: 72px !important;
  min-height: 72px !important;
  padding: 5px 14px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid var(--border);
}
.brand-logo-only a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
}
.brand-logo-only img {
  max-width: 190px !important;
  max-height: 60px !important;
  width: auto;
  height: auto;
  object-fit: contain;
}
.topbar {
  height: 72px;
  min-height: 72px;
  border-bottom: 1px solid var(--border);
}
/* labels/buttons readable but controlled */
.btn {
  font-size: 14px !important;
}
.form-group > label,
.form-group label.required {
  font-size: 14px !important;
}
.badge {
  font-size: 13px;
}
.kpi-card .value,
.kpi-card b,
.metric-value,
.money-value,
.ltr,
.time-axis span {
  font-family: "ShabnamHoma", Tahoma, sans-serif !important;
}
/* avatar boxes */
.avatar-img,
.user-cell img {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px;
  border-radius: 11px;
  object-fit: cover;
  background: var(--primary-soft);
  display: block;
}
.profile-avatar-lg {
  object-fit: cover;
}
/* applicant/staff ticket split */
.applicant-ticket-kpis {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 16px;
}
.ticket-kpis .kpi-card {
  min-height: 108px;
}
.task-mini-stats.standalone {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0 0 12px;
}
.task-mini-stats.standalone span {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 8px 12px;
}
.notification-summary-line {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}
/* SMS applicant view modeled after Orchid documents */
.documents-list {
  display: grid;
  gap: 10px;
}
.document-row {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
  box-shadow: var(--shadow);
}
.document-icon {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 20px;
}
.document-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.document-main p {
  margin: 7px 0;
  color: var(--text);
  line-height: 1.9;
}
.document-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 13px;
}
.document-meta span,
.document-meta a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.document-meta a {
  color: var(--primary);
}
/* Calendar: no internal vertical scrollbar; first hour must always remain visible */
.resource-calendar {
  overflow: visible !important;
  max-height: none !important;
}
.resource-scroll {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  max-height: none !important;
  height: auto !important;
}
.resource-header {
  position: relative !important;
  top: auto !important;
  z-index: 5;
}
.resource-body {
  align-items: start;
}
.time-axis span.first-hour {
  transform: none !important;
  top: 8px !important;
}
.time-axis span:last-child {
  transform: translateY(-100%);
}
.calendar-toolbar {
  position: relative;
  z-index: 6;
}
.calendar-view-tabs {
  white-space: nowrap;
}
.week-calendar {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow-x: auto;
}
.week-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(190px, 1fr));
  min-width: 1000px;
}
.week-day {
  min-height: 460px;
  border-left: 1px solid var(--border);
  background: var(--surface);
}
.week-day.today {
  background: color-mix(in srgb, var(--primary-soft) 45%, var(--surface));
  box-shadow: inset 0 3px 0 var(--primary);
}
.week-day-head {
  height: 58px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.week-day-head small {
  color: var(--primary);
}
.week-day-events {
  padding: 9px;
  display: grid;
  gap: 7px;
}
.week-event {
  display: grid;
  gap: 3px;
  padding: 9px;
  border-radius: 9px;
  border-right: 4px solid transparent;
}
.week-event .ltr {
  font-size: 13px;
}
.week-event small {
  color: inherit;
  opacity: 0.8;
}
.week-event.registered {
  background: #fff5c7;
  color: #755a00;
  border-color: #e7b929;
}
.week-event.tentative {
  background: #fff0df;
  color: #8e4e0d;
  border-color: #f08a37;
}
.week-event.confirmed {
  background: #fdebed;
  color: #9a2d3b;
  border-color: #e85b6a;
}
.week-empty {
  color: var(--muted);
  text-align: center;
  padding: 30px 5px;
}
/* Avoid inherited giant/sparse admin controls */
.navigation-builder input,
.navigation-builder select {
  min-height: 40px;
}
.toolbar-card .filter-row {
  align-items: end;
}
.request-toolbar {
  margin-top: 0;
}
@media (max-width: 850px) {
  .page-heading {
    padding-inline: 16px;
    align-items: flex-start;
    flex-direction: column;
  }
  .page-actions {
    width: 100%;
  }
  .applicant-ticket-kpis {
    grid-template-columns: 1fr;
  }
  .brand-logo-only img {
    max-width: 160px !important;
  }
}

/* ===== HOMA 2.2.1 dashboard spacing hotfix ===== */
/* Dashboard cards authored without a .card-body must still keep Orchid-like inner gutters. */
.dashboard-commerce-grid > .card > .bar-chart,
.dashboard-commerce-grid > .card > .service-chart,
.dashboard-commerce-grid > .card > .compact-request-table,
.dashboard-commerce-grid > .card > .activity-mini {
  padding: 16px 18px 18px;
}
.dashboard-commerce-grid > .card > .compact-request-table {
  padding-top: 4px;
  padding-bottom: 6px;
}
.dashboard-commerce-grid > .card > .activity-mini {
  padding-top: 14px;
}
.dashboard-commerce-grid .bar-row,
.dashboard-commerce-grid .service-bar {
  min-height: 28px;
}
.dashboard-commerce-grid .bar-row > span,
.dashboard-commerce-grid .service-bar > span,
.dashboard-commerce-grid .bar-row > b,
.dashboard-commerce-grid .service-bar > b {
  padding-inline: 2px;
}
.dashboard-commerce-grid .compact-request-table > a {
  padding-inline: 2px;
}
.dashboard-commerce-grid .activity-mini > div {
  padding-inline: 2px;
}
@media (max-width: 700px) {
  .dashboard-commerce-grid > .card > .bar-chart,
  .dashboard-commerce-grid > .card > .service-chart,
  .dashboard-commerce-grid > .card > .compact-request-table,
  .dashboard-commerce-grid > .card > .activity-mini {
    padding-inline: 14px;
  }
  .bar-row,
  .service-bar {
    grid-template-columns: 105px minmax(0, 1fr) 30px;
  }
}

/* ===== HOMA 2.3 shared Orchid interaction system ===== */
.error,
.field-error,
.invalid-feedback {
  font-size: 15px !important;
  line-height: 1.8;
  font-weight: 700;
  color: var(--danger);
  margin-top: 6px;
  display: block;
}
.header-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--muted);
}
.header-breadcrumb a,
.header-breadcrumb span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}
.header-breadcrumb a {
  color: var(--muted);
}
.header-breadcrumb a:hover {
  color: var(--primary);
}
.header-breadcrumb > i {
  font-size: 15px;
  opacity: 0.7;
}
.header-breadcrumb a:first-child span {
  display: inline;
}
.nav-children .nav-item {
  font-size: 14px !important;
  min-height: 42px;
}
.nav-children .nav-item b {
  font-size: 14px !important;
  font-weight: 600;
}
.page-heading {
  align-items: center !important;
}
.page-actions {
  align-self: center !important;
}
.page-actions > .btn,
.page-actions > a.btn,
.page-actions > form {
  align-self: center !important;
}

/* Request flow density */
.content > section.card:first-of-type {
  margin-top: 0;
}
.request-wizard {
  margin: 8px 0 12px !important;
}
.wizard-steps {
  margin-block: 0 !important;
}
.wizard-steps button {
  padding-block: 9px !important;
}
.request-wizard + .card {
  margin-top: 0 !important;
}
#requestForm > .card {
  margin-bottom: 12px;
}
.form-grid {
  row-gap: 12px;
}

/* Orchid toolbar: filters stay in one line on desktop and wrap gracefully */
.orchid-toolbar {
  padding: 10px 12px !important;
}
.inline-filter,
.toolbar-card .filter-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  width: 100%;
}
.inline-filter .search-field,
.toolbar-card .filter-row .search-field {
  flex: 1 1 300px;
  min-width: 220px;
}
.inline-filter select,
.toolbar-card .filter-row select {
  flex: 0 1 190px;
  min-width: 150px;
}
.inline-filter .btn,
.toolbar-card .filter-row .btn {
  flex: 0 0 auto;
}
.toolbar-hint {
  margin-inline-start: auto;
  color: var(--muted);
  font-size: 13px;
}

/* Sortable data tables */
.sortable-th {
  cursor: pointer;
  user-select: none;
  position: relative;
  padding-inline-end: 25px !important;
}
.sortable-th:after {
  content: "↕";
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  font: 12px Arial;
  color: var(--muted);
  opacity: 0.45;
}
.sortable-th.sort-asc:after {
  content: "↑";
  opacity: 1;
  color: var(--primary);
}
.sortable-th.sort-desc:after {
  content: "↓";
  opacity: 1;
  color: var(--primary);
}
.orchid-table th {
  white-space: nowrap;
}
.orchid-table td {
  vertical-align: middle;
}
.orchid-table tbody tr:hover {
  background: var(--surface-2);
}

/* Orchid slide-over drawer used by admin CRUDs */
.drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1200;
  pointer-events: none;
}
.drawer-backdrop.open {
  pointer-events: auto;
}
.drawer-dismiss {
  position: absolute;
  inset: 0;
  background: rgba(25, 28, 45, 0.36);
  backdrop-filter: blur(1px);
}
.orchid-drawer {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: min(480px, 92vw);
  background: var(--surface);
  border-left: 1px solid var(--border);
  box-shadow: -18px 0 55px rgba(27, 30, 58, 0.18);
  transform: translateX(105%);
  transition: transform 0.2s ease;
  display: flex;
  flex-direction: column;
}
.orchid-drawer.open {
  transform: none;
}
.orchid-drawer.wide {
  width: min(720px, 96vw);
}
.drawer-head {
  height: 74px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 18px;
  border-bottom: 1px solid var(--border);
}
.drawer-head h2 {
  font-size: 18px;
  margin: 2px 0 0;
}
.drawer-head small {
  color: var(--muted);
}
.drawer-body {
  padding: 18px;
  overflow: auto;
  flex: 1;
}
.drawer-actions {
  position: sticky;
  bottom: -18px;
  background: linear-gradient(to top, var(--surface) 72%, transparent);
  padding: 22px 0 2px;
  margin-top: 8px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}
.drawer-section-title {
  font-size: 15px;
  margin: 18px 0 10px;
}
.danger-zone {
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px dashed var(--border);
}

/* Users KPI cards - Orchid users page visual hierarchy */
.orchid-kpis {
  gap: 12px !important;
}
.orchid-stat {
  min-height: 112px !important;
  padding: 15px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 13px !important;
  overflow: hidden;
  position: relative;
}
.orchid-stat:after {
  content: "";
  position: absolute;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  left: -28px;
  top: -25px;
  background: var(--primary-soft);
  opacity: 0.55;
}
.orchid-stat .stat-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 20px;
  flex: 0 0 44px;
  z-index: 1;
}
.stat-icon.violet {
  background: #f0e4fb;
  color: #9f2bb4;
}
.stat-icon.green {
  background: #e5f7ef;
  color: #199a67;
}
.stat-icon.blue {
  background: #e7efff;
  color: #4f7ee8;
}
.stat-icon.amber {
  background: #fff1dc;
  color: #d98718;
}
.orchid-stat small {
  display: block;
  color: var(--muted);
  font-size: 13px;
}
.orchid-stat b {
  display: block;
  font-size: 23px;
  line-height: 1.2;
  margin: 5px 0 2px;
  font-family: "ShabnamHoma", Tahoma, sans-serif !important;
}
.orchid-stat div > span {
  font-size: 13px;
  color: var(--muted);
}

/* Compact Orchid roles */
.compact-orchid-role-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.compact-role {
  min-height: 118px !important;
  padding: 14px !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) 36px !important;
  align-items: center !important;
  gap: 12px !important;
}
.compact-role .role-icon {
  width: 42px !important;
  height: 42px !important;
  border-radius: 11px !important;
}
.role-copy {
  min-width: 0;
}
.role-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
}
.role-title-row h3 {
  font-size: 15px !important;
  margin: 0 !important;
}
.compact-role .role-stats {
  margin-top: 9px !important;
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap;
}
.compact-role .role-stats span {
  font-size: 13px !important;
  display: inline-flex;
  gap: 4px;
  align-items: center;
}

/* Hall/Product cards */
.orchid-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.orchid-product-grid .product-card {
  min-height: 130px;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 36px;
  align-items: center;
  gap: 12px;
  padding: 14px;
}
.orchid-product-grid .product-thumb {
  width: 52px;
  height: 52px;
}
.orchid-product-grid .product-info h3 {
  font-size: 15px;
  margin: 3px 0 8px;
}
.orchid-product-grid .product-info p {
  font-size: 13px;
  margin: 7px 0 0;
  color: var(--muted);
}

/* Navigation menu builder */
.navigation-orchid-card .card-body {
  padding: 10px 14px 16px;
}
.nav-tree {
  display: grid;
  gap: 7px;
}
.nav-tree-node {
  display: grid;
  grid-template-columns: 28px 38px minmax(0, 1fr) auto 24px 36px;
  align-items: center;
  gap: 9px;
  min-height: 58px;
  border: 1px solid var(--border);
  border-radius: 11px;
  padding: 8px 10px;
  background: var(--surface);
  transition: 0.15s;
}
.nav-tree-node:hover {
  border-color: color-mix(in srgb, var(--primary) 35%, var(--border));
  box-shadow: 0 5px 18px rgba(40, 44, 83, 0.06);
}
.nav-tree-node.dragging {
  opacity: 0.48;
}
.nav-tree-node.drag-over {
  border-color: var(--primary);
  box-shadow: inset 0 0 0 1px var(--primary);
}
.nav-tree-icon {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 17px;
}
.nav-tree-copy {
  min-width: 0;
}
.nav-tree-copy b,
.nav-tree-copy small {
  display: block;
}
.nav-tree-copy small {
  color: var(--muted);
  margin-top: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nav-tree-children {
  margin-right: 38px;
  padding-right: 12px;
  border-right: 1px dashed var(--border);
  display: grid;
  gap: 7px;
  margin-top: 7px;
}
.drag-handle {
  cursor: grab;
  color: var(--muted);
  font-size: 18px;
}
.drag-handle:active {
  cursor: grabbing;
}

/* Availability picker: no implicit close on day selection */
.jdp-full .jdp-day.is-selected {
  box-shadow: inset 0 0 0 2px var(--primary);
}
.jdp-apply {
  font-size: 14px !important;
}
.jdp-slot-grid {
  max-height: 290px;
  overflow: auto;
  padding-inline-end: 3px;
}
.jdp-time-input {
  font-family: "ShabnamHoma", Tahoma, sans-serif !important;
}

@media (max-width: 1100px) {
  .compact-orchid-role-grid,
  .orchid-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .orchid-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 720px) {
  .header-breadcrumb {
    font-size: 13px;
    max-width: 62vw;
    overflow: auto;
  }
  .header-breadcrumb a:first-child span {
    display: none;
  }
  .inline-filter,
  .toolbar-card .filter-row {
    align-items: stretch !important;
  }
  .inline-filter > * {
    flex: 1 1 100% !important;
    max-width: none !important;
  }
  .compact-orchid-role-grid,
  .orchid-product-grid,
  .orchid-kpis {
    grid-template-columns: 1fr !important;
  }
  .orchid-drawer,
  .orchid-drawer.wide {
    width: 100vw;
  }
  .nav-tree-node {
    grid-template-columns: 24px 34px minmax(0, 1fr) 32px;
  }
  .nav-tree-node > .badge,
  .nav-tree-node > .muted {
    display: none;
  }
  .nav-tree-children {
    margin-right: 20px;
  }
  .toolbar-hint {
    margin: 0;
  }
}
.filter-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.filter-row > .search-field {
  flex: 1 1 280px;
}
.filter-row > select,
.filter-row > input {
  flex: 0 1 190px;
}
.filter-row > .btn {
  flex: 0 0 auto;
}
@media (max-width: 720px) {
  .filter-row {
    align-items: stretch;
  }
  .filter-row > * {
    max-width: none !important;
  }
}
/* CEO dashboard is independent from admin/staff dashboards. */
.ceo-action-list {
  display: grid;
}
.ceo-action-list > a {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 12px 16px;
  border-top: 1px solid var(--border);
  color: inherit;
}
.ceo-action-list > a:first-child {
  border-top: 0;
}
.ceo-action-list > a:hover {
  background: var(--surface-2);
}
.ceo-action-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 18px;
}
.ceo-action-list b,
.ceo-action-list small {
  display: block;
}
.ceo-action-list small {
  color: var(--muted);
  margin-top: 3px;
}
.ceo-action-list em {
  font-style: normal;
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap;
}
.ceo-finance-summary {
  padding: 8px 16px 16px;
  display: grid;
}
.ceo-finance-summary > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
}
.ceo-finance-summary > div:last-child {
  border-bottom: 0;
}
.ceo-finance-summary span {
  color: var(--muted);
}
.ceo-finance-summary b {
  font-family: "ShabnamHoma", Tahoma, sans-serif !important;
}
.ceo-hero {
  margin-bottom: 14px;
}
@media (max-width: 720px) {
  .ceo-action-list > a {
    grid-template-columns: 38px minmax(0, 1fr);
  }
  .ceo-action-list em {
    grid-column: 2;
  }
  .ceo-finance-summary > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }
}

/* ===== HOMA 2.4 Orchid fidelity & UI stabilization ===== */
:root {
  --scroll-track: transparent;
  --scroll-thumb: #c9ccd9;
  --scroll-thumb-hover: #aeb3c6;
}
:root[data-theme="dark"] {
  --scroll-track: transparent;
  --scroll-thumb: #454858;
  --scroll-thumb-hover: #5b5f72;
}
* {
  scrollbar-width: thin;
  scrollbar-color: var(--scroll-thumb) var(--scroll-track);
}
*::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}
*::-webkit-scrollbar-track {
  background: var(--scroll-track);
}
*::-webkit-scrollbar-thumb {
  background: var(--scroll-thumb);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover {
  background: var(--scroll-thumb-hover);
  background-clip: padding-box;
}
.header-breadcrumb {
  font-size: 15px !important;
  font-weight: 400 !important;
}
.header-breadcrumb a,
.header-breadcrumb span {
  font-weight: 400 !important;
  font-family: "ShabnamHoma", Tahoma, sans-serif !important;
}
.nav-children .nav-item,
.nav-children .nav-item b {
  font-size: 15px !important;
  font-weight: 400 !important;
  font-family: "ShabnamHoma", Tahoma, sans-serif !important;
}
.nav-children .nav-item.active b {
  font-weight: 400 !important;
  font-family: "ShabnamHoma", Tahoma, sans-serif !important;
}
.brand-folded {
  display: none !important;
}
.sidebar-folded .brand-full {
  display: none !important;
}
.sidebar-folded .brand-folded {
  display: block !important;
  width: 42px !important;
  height: 42px !important;
  max-width: 42px !important;
  max-height: 42px !important;
  border-radius: 11px;
}
/* Drawers consistently slide in from the left, like the selected Orchid interaction pattern. */
.orchid-drawer {
  right: auto !important;
  left: 0 !important;
  border-left: 0 !important;
  border-right: 1px solid var(--border) !important;
  box-shadow: 18px 0 55px rgba(27, 30, 58, 0.18) !important;
  transform: translateX(-105%) !important;
  transition: transform 0.24s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
}
.orchid-drawer.open {
  transform: translateX(0) !important;
}
/* Dense single-row filter bars on desktop. Search never stretches across the full row. */
.orchid-toolbar .filter-row {
  flex-wrap: nowrap !important;
  overflow-x: auto;
  padding-bottom: 1px;
}
.filter-search-compact {
  flex: 0 0 250px !important;
  min-width: 210px !important;
  max-width: 280px !important;
}
.filter-input-compact {
  flex: 0 0 165px !important;
  max-width: 185px !important;
}
.orchid-toolbar select {
  flex: 0 0 160px !important;
  min-width: 145px !important;
}
.orchid-toolbar .btn {
  flex: 0 0 auto !important;
}
.users-table th,
.users-table td {
  font-size: 13.5px !important;
  padding-block: 13px;
}
.users-table th {
  font-size: 13px !important;
}
.user-cell {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 210px;
}
.user-cell-copy {
  min-width: 0;
}
.user-cell-copy b,
.user-cell-copy small {
  display: block !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.user-cell-copy b {
  font-size: 14px;
}
.user-cell-copy small {
  font-size: 13px;
  color: var(--muted);
  margin-top: 3px;
  max-width: 210px;
}
.user-drawer-grid .full {
  grid-column: 1/-1;
}
.status-segment {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}
.status-segment label {
  cursor: pointer;
}
.status-segment input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.status-choice {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 88px;
  padding: 9px 13px;
  border-radius: 9px;
  border: 1px solid var(--border);
  background: var(--surface-2);
  transition: 0.18s;
}
.status-segment input:checked + .status-choice.active {
  background: var(--success-soft);
  color: var(--success);
  border-color: color-mix(in srgb, var(--success) 30%, var(--border));
}
.status-segment input:checked + .status-choice.inactive {
  background: var(--warning-soft);
  color: #a26a00;
  border-color: color-mix(in srgb, var(--warning) 35%, var(--border));
}
.status-segment input:checked + .status-choice.suspended {
  background: var(--danger-soft);
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 30%, var(--border));
}
.stat-icon.red {
  background: var(--danger-soft);
  color: var(--danger);
}
.audit-user b,
.audit-user small {
  display: block;
}
.audit-user small {
  color: var(--muted);
  margin-top: 2px;
}
.event-chip {
  display: inline-flex;
  padding: 5px 8px;
  border-radius: 7px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  font-size: 13px;
}
.log-detail-row td {
  background: var(--surface-2) !important;
  padding: 0 !important;
}
.audit-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 14px 16px;
}
.audit-detail-grid > div > span,
.system-log-detail span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 6px;
}
.audit-detail-grid pre,
.system-log-detail pre {
  margin: 0;
  max-height: 230px;
  overflow: auto;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: 12px;
  direction: ltr;
  text-align: left;
  white-space: pre-wrap;
}
.system-log-detail {
  padding: 14px 16px;
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 12px;
}
.system-log-detail pre {
  grid-column: 1/-1;
}
.log-message-cell {
  max-width: 420px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dashboard-title-card {
  margin-bottom: 14px;
  background: linear-gradient(
    135deg,
    var(--surface),
    color-mix(in srgb, var(--primary-soft) 48%, var(--surface))
  );
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 18px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.dashboard-title-card h1 {
  font-size: 22px;
  margin: 2px 0 0;
}
.dashboard-title-card .eyebrow {
  color: var(--primary);
  font-size: 13px;
  letter-spacing: 0.08em;
}
.dashboard-title-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
}
/* Navigation menu hierarchy */
.nav-tree-children {
  position: relative;
  margin-right: 42px !important;
  padding-right: 18px !important;
  border-right: 1px solid var(--border) !important;
}
.nav-tree-children:before {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 50%;
  width: 12px;
  border-bottom: 1px solid var(--border);
}
.nav-tree-node[data-drop-mode="child"] {
  box-shadow: inset 0 0 0 2px var(--primary) !important;
  background: var(--primary-soft);
}
.nav-tree-node[data-drop-mode="before"] {
  border-top: 2px solid var(--primary) !important;
}
.nav-tree-node[data-drop-mode="after"] {
  border-bottom: 2px solid var(--primary) !important;
}
/* Custom page rich editor */
.rich-toolbar {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  border: 1px solid var(--border);
  border-bottom: 0;
  border-radius: 10px 10px 0 0;
  background: var(--surface-2);
  padding: 7px;
}
.rich-toolbar button {
  min-width: 34px;
  height: 32px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  cursor: pointer;
}
.rich-toolbar button:hover {
  background: var(--primary-soft);
  color: var(--primary);
}
.orchid-rich-editor {
  min-height: 330px;
  border: 1px solid var(--border);
  border-radius: 0 0 10px 10px;
  padding: 16px;
  background: var(--surface);
  outline: none;
  line-height: 2;
}
.orchid-rich-editor:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}
/* Duration-aware request scheduling */
.schedule-repeat-row {
  grid-template-columns: 1.1fr 0.65fr 1.1fr 0.55fr auto !important;
}
.jdp-slot.selected-range {
  background: var(--primary-soft) !important;
  color: var(--primary) !important;
  box-shadow: inset 0 0 0 1px
    color-mix(in srgb, var(--primary) 45%, transparent);
}
.jdp-slot.range-conflict {
  box-shadow: inset 0 0 0 2px var(--danger) !important;
}
.jdp-duration-note {
  margin-top: 8px;
  padding: 7px 9px;
  border-radius: 8px;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 13px;
}
@media (max-width: 1000px) {
  .orchid-toolbar .filter-row {
    flex-wrap: wrap !important;
    overflow: visible;
  }
  .filter-search-compact {
    flex: 1 1 240px !important;
  }
  .schedule-repeat-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 720px) {
  .filter-search-compact,
  .orchid-toolbar select,
  .filter-input-compact {
    flex: 1 1 100% !important;
    max-width: none !important;
  }
  .audit-detail-grid,
  .system-log-detail {
    grid-template-columns: 1fr;
  }
  .schedule-repeat-row {
    grid-template-columns: 1fr !important;
  }
  .dashboard-title-card {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (min-width: 1001px) {
  .toolbar-card .filter-row {
    flex-wrap: nowrap !important;
    overflow-x: auto;
  }
  .toolbar-card .filter-row .search-field {
    flex: 0 0 250px !important;
    min-width: 210px !important;
    max-width: 280px !important;
  }
  .toolbar-card .filter-row select {
    flex: 0 0 160px !important;
    min-width: 145px !important;
  }
}

/* V2.5 incremental UI refinements */
.dashboard-kicker {
  display: block;
  font-family: "ShabnamHoma", Tahoma, sans-serif;
  font-size: 13px;
  font-weight: 400;
  opacity: 0.9;
  margin-bottom: 5px;
}
.welcome-card .dashboard-kicker {
  color: #fff;
}
.executive-hero .dashboard-kicker {
  color: var(--primary);
}

/* Drawer animation: medium-speed left slide, including initial server-rendered open state. */
@keyframes homaDrawerSlideIn {
  from {
    transform: translateX(-104%);
    opacity: 0.92;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes homaDrawerSlideOut {
  from {
    transform: translateX(0);
    opacity: 1;
  }
  to {
    transform: translateX(-104%);
    opacity: 0.92;
  }
}
@keyframes homaBackdropIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes homaBackdropOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.drawer-backdrop.open {
  animation: homaBackdropIn 0.34s ease both;
}
.drawer-backdrop.open .orchid-drawer.open {
  animation: homaDrawerSlideIn 0.38s cubic-bezier(0.22, 0.75, 0.25, 1) both;
}
.drawer-backdrop.drawer-leaving {
  animation: homaBackdropOut 0.34s ease both;
  pointer-events: none;
}
.drawer-backdrop.drawer-leaving .orchid-drawer {
  animation: homaDrawerSlideOut 0.36s cubic-bezier(0.55, 0.05, 0.7, 0.25) both !important;
}
.drawer-backdrop.drawer-entering .orchid-drawer {
  transform: translateX(-104%) !important;
}

/* Orchid-style navigation builder: compact hierarchy, single nested submenu level. */
.orchid-menu-builder .card-body {
  padding: 14px 16px 18px;
}
.menu-builder-help {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 10px 12px;
  margin-bottom: 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: 13px;
}
.menu-builder-help i {
  font-size: 18px;
  color: var(--primary);
}
.nav-builder {
  display: grid;
  gap: 8px;
}
.nav-builder-item {
  position: relative;
}
.nav-builder-row {
  display: grid;
  grid-template-columns: 28px 28px 38px minmax(0, 1fr) auto 24px 36px;
  align-items: center;
  gap: 8px;
  min-height: 58px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface);
  transition: border-color 0.18s, box-shadow 0.18s, background 0.18s;
}
.nav-builder-row:hover {
  border-color: color-mix(in srgb, var(--primary) 32%, var(--border));
  box-shadow: 0 5px 18px rgba(40, 44, 83, 0.055);
}
.nav-builder-icon {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 17px;
}
.nav-builder-copy {
  min-width: 0;
}
.nav-builder-copy b,
.nav-builder-copy small {
  display: block;
}
.nav-builder-copy b {
  font-size: 13px;
}
.nav-builder-copy small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.nav-tree-toggle {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  transition: 0.18s;
}
.nav-tree-toggle:hover {
  background: var(--primary-soft);
  color: var(--primary);
}
.nav-tree-toggle i {
  transition: transform 0.18s;
}
.nav-tree-toggle.placeholder {
  pointer-events: none;
}
.nav-builder-children {
  display: grid;
  gap: 7px;
  margin: 7px 0 0 0;
  padding-right: 54px;
  position: relative;
}
.nav-builder-children:empty {
  display: none;
}
.nav-builder-children:not(:empty):before {
  content: "";
  position: absolute;
  right: 27px;
  top: -3px;
  bottom: 29px;
  border-right: 1px dashed var(--border);
}
.nav-builder-children > .nav-builder-item:before {
  content: "";
  position: absolute;
  right: -27px;
  top: 29px;
  width: 23px;
  border-top: 1px dashed var(--border);
}
.nav-builder-item.collapsed > .nav-builder-children {
  display: none;
}
.nav-builder-item.collapsed > .nav-builder-row .nav-tree-toggle i {
  transform: rotate(90deg);
}
.nav-builder-item.dragging {
  opacity: 0.42;
}
.nav-builder-item.drop-before > .nav-builder-row {
  box-shadow: inset 0 2px 0 var(--primary);
}
.nav-builder-item.drop-after > .nav-builder-row {
  box-shadow: inset 0 -2px 0 var(--primary);
}
.nav-builder-item.drop-child > .nav-builder-row {
  background: var(--primary-soft);
  border-color: var(--primary);
  box-shadow: inset 0 0 0 1px var(--primary);
}
.nav-builder-item > .nav-builder-children .nav-builder-row {
  background: color-mix(in srgb, var(--surface-2) 68%, var(--surface));
  min-height: 54px;
}
.drag-handle {
  cursor: grab;
  color: var(--muted);
  font-size: 19px;
  display: grid;
  place-items: center;
}
.drag-handle:active {
  cursor: grabbing;
}

/* Role-based visibility chips for custom CMS pages. */
.role-access-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.role-access-chip {
  position: relative;
  cursor: pointer;
}
.role-access-chip input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.role-access-chip span {
  display: flex;
  flex-direction: column;
  gap: 2px;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 12px;
  background: var(--surface-2);
  transition: 0.18s;
}
.role-access-chip span b {
  font-size: 13px;
}
.role-access-chip span small {
  font-size: 13px;
  color: var(--muted);
}
.role-access-chip input:checked + span {
  border-color: var(--primary);
  background: var(--primary-soft);
  color: var(--primary);
}

/* Request details: financial summary first, then two-column information/activity layout. */
.request-detail-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(340px, 0.8fr);
  gap: 18px;
  align-items: start;
  direction: rtl;
}
.request-detail-main,
.request-detail-side {
  min-width: 0;
}
.request-detail-side {
  position: sticky;
  top: calc(var(--topbar) + 14px);
}
.request-detail-side .card:last-child {
  margin-bottom: 0;
}
.financial-summary {
  margin-bottom: 0;
}

@media (max-width: 980px) {
  .request-detail-columns {
    grid-template-columns: 1fr;
  }
  .request-detail-side {
    position: static;
  }
  .role-access-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .nav-builder-row {
    grid-template-columns: 24px 24px 34px minmax(0, 1fr) 34px;
  }
  .nav-builder-row > .badge,
  .nav-builder-row > .muted {
    display: none;
  }
  .nav-builder-children {
    padding-right: 34px;
  }
  .nav-builder-children:not(:empty):before {
    right: 17px;
  }
  .nav-builder-children > .nav-builder-item:before {
    right: -17px;
    width: 14px;
  }
}

/* HOMA 2.6 — graphical request service / venue selector (Orchid-aligned) */
.request-choice-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 18px;
  align-items: start;
  margin-bottom: 12px;
}
.request-choice-main {
  padding: 0;
  overflow: hidden;
}
.choice-section {
  padding: 22px 24px;
}
.choice-divider {
  height: 1px;
  background: var(--border);
  margin: 0 24px;
}
.choice-section-head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 16px;
}
.choice-section-head h2 {
  font-size: 18px;
  margin: 0 0 4px;
  font-family: "VazirHoma";
  font-weight: 700;
}
.choice-section-head p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}
.choice-step {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--primary), #7c3aed);
  color: #fff;
  font-family: "ShabnamHoma";
  font-size: 14px;
  box-shadow: 0 6px 18px color-mix(in srgb, var(--primary) 22%, transparent);
  flex: 0 0 32px;
}
.service-choice-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.service-choice-card {
  position: relative;
  min-height: 128px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  padding: 16px 10px 13px;
  text-align: center;
  color: var(--text);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  transition: border-color 0.18s ease, box-shadow 0.18s ease,
    transform 0.18s ease, background 0.18s ease;
}
.service-choice-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
  box-shadow: 0 10px 26px rgba(25, 20, 60, 0.08);
}
.service-choice-card > i {
  font-size: 30px;
  color: var(--primary);
  line-height: 1;
}
.service-choice-card strong {
  font-family: "VazirHoma";
  font-size: 13px;
}
.service-choice-card small {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.65;
}
.service-choice-card.selected {
  border: 1.5px solid var(--primary);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--primary) 8%, var(--surface)),
    var(--surface)
  );
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 8%, transparent);
}
.choice-check {
  position: absolute;
  top: 8px;
  left: 8px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: grid;
  place-items: center;
  font-size: 14px;
}
.venue-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.venue-choice-card {
  position: relative;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface);
  padding: 12px;
  display: grid;
  grid-template-columns: 44% minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  color: var(--text);
  transition: border-color 0.18s ease, box-shadow 0.18s ease,
    transform 0.18s ease;
}
.venue-choice-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
  box-shadow: 0 10px 26px rgba(25, 20, 60, 0.08);
}
.venue-choice-card.selected {
  border: 1.5px solid var(--primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 8%, transparent);
}
.venue-choice-image {
  position: relative;
  height: 132px;
  border-radius: 11px;
  overflow: hidden;
  background: var(--surface-2);
}
.venue-choice-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.venue-choice-radio {
  position: absolute;
  top: 9px;
  left: 9px;
  right: auto;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.92);
  background: rgba(255, 255, 255, 0.82);
  display: grid;
  place-items: center;
  color: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.16);
}
.venue-choice-card.selected .venue-choice-radio {
  background: var(--primary);
  border-color: var(--primary);
}
.venue-choice-copy h3 {
  font-family: "VazirHoma";
  font-size: 17px;
  margin: 0 0 5px;
}
.venue-choice-copy p {
  font-size: 13px;
  color: var(--muted);
  margin: 0 0 12px;
  line-height: 1.7;
}
.venue-choice-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  color: var(--muted);
  font-size: 13px;
}
.venue-choice-meta span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.venue-choice-meta i {
  color: var(--primary);
  font-size: 15px;
}
.request-choice-summary {
  position: sticky;
  top: calc(var(--topbar) + 14px);
  padding: 20px 16px;
}
.choice-summary-icon {
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 30px;
  margin: 0 auto 12px;
}
.request-choice-summary > h3 {
  text-align: center;
  font-family: "VazirHoma";
  font-size: 16px;
  margin: 0 0 6px;
}
.request-choice-summary > p {
  text-align: center;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.75;
  margin: 0 0 16px;
}
.choice-summary-item {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 11px;
  margin-top: 10px;
}
.choice-summary-item > small {
  display: block;
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 8px;
}
.choice-summary-item > div {
  display: flex;
  align-items: center;
  gap: 9px;
}
.choice-summary-item > div > i {
  width: 38px;
  height: 38px;
  border-radius: 9px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  font-size: 20px;
  flex: 0 0 38px;
}
.choice-summary-item img {
  width: 44px;
  height: 38px;
  border-radius: 8px;
  object-fit: cover;
  flex: 0 0 44px;
}
.choice-summary-item span {
  min-width: 0;
}
.choice-summary-item b,
.choice-summary-item em {
  display: block;
  font-style: normal;
}
.choice-summary-item b {
  font-size: 13px;
}
.choice-summary-item em {
  font-size: 13px;
  color: var(--muted);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.choice-empty {
  color: var(--muted);
  font-size: 13px;
}
.choice-summary-note {
  margin-top: 12px;
  border-radius: 12px;
  padding: 11px;
  background: var(--primary-soft);
  color: var(--primary);
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 13px;
  line-height: 1.7;
}
.choice-summary-note.ready {
  background: var(--success-soft);
  color: var(--success);
}
.choice-summary-note i {
  font-size: 17px;
  margin-top: 1px;
}
@media (max-width: 1180px) {
  .request-choice-shell {
    grid-template-columns: 1fr;
  }
  .request-choice-summary {
    position: static;
    display: grid;
    grid-template-columns: auto 1fr 1fr;
    gap: 10px;
    align-items: center;
  }
  .choice-summary-icon,
  .request-choice-summary > h3,
  .request-choice-summary > p {
    display: none;
  }
  .choice-summary-note {
    margin-top: 0;
  }
  .service-choice-grid {
    grid-template-columns: repeat(5, minmax(100px, 1fr));
  }
}
@media (max-width: 860px) {
  .service-choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .venue-choice-grid {
    grid-template-columns: 1fr;
  }
  .request-choice-summary {
    display: block;
  }
  .choice-summary-item {
    display: block;
  }
  .choice-summary-note {
    margin-top: 10px;
  }
  .choice-section {
    padding: 18px;
  }
  .choice-divider {
    margin: 0 18px;
  }
}
@media (max-width: 520px) {
  .service-choice-grid {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .service-choice-card {
    min-height: 116px;
  }
  .venue-choice-card {
    grid-template-columns: 1fr;
  }
  .venue-choice-image {
    height: 150px;
  }
}
[data-theme="dark"] .service-choice-card.selected {
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--primary) 13%, var(--surface)),
    var(--surface)
  );
}
[data-theme="dark"] .venue-choice-radio {
  background: rgba(15, 18, 30, 0.82);
  border-color: rgba(255, 255, 255, 0.65);
}

/* HOMA 2.7 — request program selection handoff + persistent wizard summary */
.program-choice-icon {
  width: 50px;
  height: 50px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--primary-soft) 78%, var(--surface));
  display: grid;
  place-items: center;
  margin-bottom: 2px;
  transition: transform 0.18s ease, background 0.18s ease;
}
.program-choice-icon img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  display: block;
}
.program-choice-card:hover .program-choice-icon {
  transform: scale(1.04);
  background: color-mix(in srgb, var(--primary-soft) 92%, var(--surface));
}
.program-choice-card.selected .program-choice-icon {
  background: color-mix(in srgb, var(--primary) 14%, var(--surface));
}
.service-choice-card > i {
  display: none;
}
.summary-program-icon {
  width: 44px;
  height: 38px;
  border-radius: 8px;
  background: var(--primary-soft);
  display: grid !important;
  place-items: center;
  flex: 0 0 44px;
}
.summary-program-icon img {
  width: 29px !important;
  height: 29px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
}
.venue-choice-copy p {
  margin: 0;
  line-height: 1.9;
}
.choice-continue-row {
  display: flex;
  justify-content: flex-start;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}
.choice-continue-row .btn {
  min-width: 200px;
  justify-content: center;
}
.request-form-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 290px;
  gap: 18px;
  align-items: start;
}
.request-form-main {
  min-width: 0;
}
.request-wizard-summary {
  position: sticky;
  top: calc(var(--topbar) + 14px);
}
.request-wizard-summary .choice-summary-item:first-of-type {
  margin-top: 14px;
}
.choice-edit-link {
  margin-top: 14px;
  justify-content: center;
  width: 100%;
}
.wizard-steps button {
  font-family: "VazirHoma", "ShabnamHoma", Tahoma, sans-serif;
  font-weight: 500;
}
.wizard-steps button span {
  font-family: "VazirHoma", "ShabnamHoma", Tahoma, sans-serif;
  font-weight: 700;
}
.request-form-shell #requestForm {
  min-width: 0;
}
.request-form-shell .request-wizard {
  margin-top: 0 !important;
}
[data-theme="dark"] .program-choice-icon {
  background: color-mix(in srgb, var(--primary) 12%, var(--surface-2));
}
@media (max-width: 1180px) {
  .request-form-shell {
    grid-template-columns: 1fr;
  }
  .request-wizard-summary {
    position: static;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .request-wizard-summary > .choice-summary-icon,
  .request-wizard-summary > h3 {
    display: none;
  }
  .request-wizard-summary .choice-summary-item {
    margin-top: 0;
  }
  .request-wizard-summary .choice-edit-link {
    margin-top: 0;
    grid-column: 1/-1;
  }
}
@media (max-width: 720px) {
  .request-wizard-summary {
    display: block;
  }
  .request-wizard-summary .choice-summary-item {
    margin-top: 9px;
  }
  .request-wizard-summary .choice-edit-link {
    margin-top: 12px;
  }
  .choice-continue-row .btn {
    width: 100%;
  }
  .program-choice-icon {
    width: 44px;
    height: 44px;
  }
  .program-choice-icon img {
    width: 31px;
    height: 31px;
  }
}

/* HOMA 2.7.1 — request wizard and legal-entity UX refinements */
.choice-summary-icon {
  overflow: hidden;
}
.choice-summary-icon img {
  width: 34px;
  height: 34px;
  object-fit: contain;
  display: block;
}
.choice-summary-continue {
  margin-top: 12px;
  width: 100%;
  justify-content: center;
}
.request-form-shell {
  margin-top: -8px;
}
.request-form-shell .request-wizard {
  margin-bottom: 10px !important;
}
:root:not([data-theme="dark"]) .radio-row input[type="radio"] {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1.5px solid #d8dbe6;
  background: #fff;
  display: inline-grid;
  place-items: center;
  vertical-align: middle;
  position: relative;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.75) inset;
  padding: 0;
  margin: 0px 3px;
}
:root:not([data-theme="dark"]) .radio-row input[type="radio"]::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--primary);
  transform: scale(0);
  transition: transform 0.14s ease;
}
:root:not([data-theme="dark"]) .radio-row input[type="radio"]:checked {
  border-color: var(--primary);
  background: #fff;
  padding: 0;
}
:root:not([data-theme="dark"]) .radio-row input[type="radio"]:checked::after {
  transform: scale(1.5);
}
.legal-entity-intro {
  margin-bottom: 14px;
}
.legal-entity-intro p {
  margin: 4px 0 0;
  line-height: 1.9;
}
.legal-entity-intro b {
  font-size: 14px;
}
.legal-entity-intro > i {
  font-size: 22px;
}
@media (max-width: 720px) {
  .request-form-shell {
    margin-top: -4px;
  }
  .choice-summary-continue {
    margin-top: 10px;
  }
}

/* =========================================================
   HOMA 3.0 — Deep Review design system
   ========================================================= */
.page-heading {
  padding-top: 14px !important;
  padding-bottom: 6px !important;
  min-height: auto !important;
  align-items: flex-start !important;
}
.page-heading-copy {
  min-width: 0;
}
.page-heading-copy h1 {
  margin: 0 !important;
}
.page-subtitle {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.9;
  max-width: 920px;
}
.content {
  padding-top: 8px !important;
}

/* Floating system feedback — Orchid-style basic auto-hide with title */
.toast-stack {
  position: fixed;
  left: 16px;
  top: 16px;
  z-index: 10000;
  width: min(330px, calc(100vw - 32px));
  display: grid;
  gap: 10px;
  pointer-events: none;
}
.toast-card {
  pointer-events: auto;
  border: 0;
  border-radius: 5px;
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.2);
  padding: 11px 12px 12px;
  display: block;
  color: #fff;
  transform: translateY(-8px);
  opacity: 0;
  transition: transform .2s ease, opacity .2s ease;
  overflow: hidden;
}
.toast-card.visible,
.toast-card:not(.leaving) { transform: translateY(0); opacity: 1; }
.toast-card.leaving { transform: translateY(-8px); opacity: 0; }
.toast-head { display: flex; align-items: center; gap: 8px; min-height: 24px; }
.toast-title { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; min-width: 0; }
.toast-title i { font-size: 18px; line-height: 1; }
.toast-time { margin-inline-start: auto; font-size: 13px; opacity: .88; white-space: nowrap; }
.toast-message { margin-top: 7px; line-height: 1.75; font-size: 13px; }
.toast-close {
  border: 0;
  background: transparent;
  color: inherit;
  opacity: .82;
  font-size: 18px;
  cursor: pointer;
  width: 24px;
  height: 24px;
  padding: 0;
  display: grid;
  place-items: center;
  border-radius: 4px;
}
.toast-close:hover { background: rgba(255,255,255,.14); opacity: 1; }
.toast-card.success { background: #2f8f57; }
.toast-card.error { background: #dc3545; }
.toast-card.warning { background: #f59e0b; color: #1f2937; }
.toast-card.info { background: #0d6efd; }

/* Orchid-style choices: <= 3 choices become a true segmented control. */
.segmented-choice {
  display: flex;
  direction: rtl;
  width: 100%;
  max-width: 620px;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: var(--surface);
  min-height: 42px;
}
.segmented-choice label {
  position: relative;
  flex: 1;
  display: flex;
  align-items: stretch;
  justify-content: center;
  cursor: pointer;
  margin: 0 !important;
  border-left: 1px solid var(--border);
  min-width: 0;
}
.segmented-choice label:last-child {
  border-left: 0;
}
.segmented-choice input {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
  pointer-events: none;
}
.segmented-choice span {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 9px 12px;
  color: var(--muted);
  font-size: 13px;
  transition: 0.16s;
  background: var(--surface);
  text-align: center;
}
.segmented-choice label:hover span {
  background: var(--surface-2);
  color: var(--text);
}
.segmented-choice input:checked + span {
  background: var(--primary);
  color: #fff;
  font-family: "VazirHoma", "ShabnamHoma", Tahoma, sans-serif;
  font-weight: 700;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 85%, #0000);
}
.segmented-choice input:focus-visible + span {
  box-shadow: inset 0 0 0 2px #fff, 0 0 0 2px var(--primary);
}
.segmented-choice input:disabled + span {
  opacity: 0.45;
  cursor: not-allowed;
  background: var(--surface-2);
}
.choice-card-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 9px;
}
.choice-card-row > label {
  border: 1px solid var(--border);
  border-radius: 11px;
  padding: 7px 12px;
  background: var(--surface);
  cursor: pointer;
  transition: 0.15s;
}
.choice-card-row > label:has(input:checked) {
  border-color: var(--primary);
  background: var(--primary-soft);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 8%, transparent);
}

/* Validation is local to the current wizard step. */
.form-group.field-invalid > input,
.form-group.field-invalid > select,
.form-group.field-invalid > textarea,
.form-group.field-invalid > .segmented-choice,
.form-group.field-invalid > .radio-row,
.form-group.field-invalid > .check-row {
  border-color: var(--danger) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 9%, transparent);
}
.form-group.field-invalid > label {
  color: var(--danger) !important;
}

/* New request: horizontal compact summary + metadata driven wizard. */
.request-summary-bar {
  position: sticky;
  top: calc(var(--topbar) + 8px);
  z-index: 22;
  background: color-mix(in srgb, var(--surface) 95%, transparent);
  backdrop-filter: blur(14px);
  border: 1px solid var(--border);
  border-radius: 13px;
  padding: 10px 12px;
  margin: 0 0 9px;
  display: flex;
  align-items: center;
  gap: 0;
  box-shadow: 0 8px 22px rgba(26, 29, 64, 0.055);
  overflow: auto;
}
.request-summary-bar > span {
  display: grid;
  grid-template-columns: auto auto;
  align-items: baseline;
  gap: 5px;
  padding: 2px 13px;
  border-left: 1px solid var(--border);
  white-space: nowrap;
}
.request-summary-bar > span:first-child {
  padding-right: 2px;
}
.request-summary-bar > span small {
  color: var(--muted);
  font-size: 13px;
}
.request-summary-bar > span b {
  font-size: 13px;
}
.request-summary-bar > a {
  margin-right: auto;
  color: var(--primary);
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--primary-soft);
  display: grid;
  place-items: center;
  flex: 0 0 32px;
}
.request-summary-bar > a:hover {
  background: var(--primary);
  color: #fff;
}
.deep-wizard.request-wizard {
  position: relative !important;
  top: auto !important;
  margin: 0 0 9px !important;
  padding: 8px 10px !important;
  box-shadow: none;
}
.deep-wizard .wizard-steps {
  gap: 2px;
  flex: 1;
}
.deep-wizard .wizard-steps button {
  min-height: 38px !important;
  padding: 6px 8px !important;
  font-size: 13px !important;
}
.deep-wizard .wizard-steps button span {
  width: 23px;
  height: 23px;
  border-radius: 50%;
  font-size: 13px;
}
.deep-wizard .wizard-steps button.completed {
  color: var(--success);
}
.deep-wizard .wizard-steps button.completed span {
  background: var(--success-soft);
  color: var(--success);
}
.request-wizard-panel {
  box-shadow: 0 5px 18px rgba(29, 32, 66, 0.035);
  border-radius: 14px;
}
.request-wizard-panel > .card-head {
  min-height: 52px;
  padding: 12px 17px;
}
.request-wizard-panel > .card-head h2 {
  font-size: 15px;
}
.request-wizard-panel > .card-body {
  padding: 17px;
}
.request-wizard-panel .form-grid {
  gap: 15px 16px;
}
.wizard-actions {
  position: sticky;
  bottom: 8px;
  z-index: 20;
  background: color-mix(in srgb, var(--surface) 94%, transparent);
  backdrop-filter: blur(12px);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 9px 10px;
  box-shadow: 0 10px 28px rgba(20, 25, 60, 0.1);
  margin-top: 0;
}
.wizard-actions .btn {
  min-width: 130px;
}

/* Applicant nature now reads as a first-class choice instead of a plain radio. */
.nature-choice-grid,
.party-nature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.nature-choice-card,
.party-nature-card {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 16px;
  background: var(--surface);
  display: flex;
  align-items: center;
  gap: 12px;
  transition: 0.17s;
  cursor: pointer;
}
.nature-choice-card:hover,
.party-nature-card:hover {
  border-color: var(--primary);
  transform: translateY(-1px);
}
.nature-choice-card.selected,
.party-nature-card.selected {
  border-color: var(--primary);
  background: var(--primary-soft);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 8%, transparent);
}
.nature-choice-card > i,
.party-nature-card > i {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--surface-2);
  display: grid;
  place-items: center;
  color: var(--primary);
  font-size: 22px;
  flex: 0 0 44px;
}
.nature-choice-card b,
.party-nature-card b {
  display: block;
}
.nature-choice-card small,
.party-nature-card small {
  display: block;
  color: var(--muted);
  margin-top: 3px;
  line-height: 1.7;
}
.legal-rep-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.legal-rep-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  background: var(--surface);
  transition: 0.15s;
}
.legal-rep-card:hover,
.legal-rep-card.selected {
  border-color: var(--primary);
  background: var(--primary-soft);
}

/* Schedule is a multi-day business object, not a single date field. */
.schedule-range-card {
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 12px;
  background: color-mix(in srgb, var(--surface-2) 38%, var(--surface));
  position: relative;
}
.schedule-priority-label {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 12px;
  color: var(--primary);
}
.schedule-priority-label i {
  font-size: 19px;
}
.schedule-priority-label b {
  font-size: 13px;
}
.schedule-range-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.schedule-calculation {
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px dashed var(--border);
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}
.schedule-calculation > span {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: 7px 10px;
  display: flex;
  gap: 7px;
  align-items: baseline;
}
.schedule-calculation small {
  color: var(--muted);
  font-size: 13px;
}
.schedule-calculation b {
  font-size: 13px;
}
.schedule-calculation .btn {
  margin-right: auto;
}
.embedded-service-block {
  border-top: 1px solid var(--border);
  margin-top: 18px;
  padding-top: 16px;
}
.embedded-service-head h3 {
  font-size: 14px;
  margin: 0 0 4px;
}
.embedded-service-head p {
  margin: 0 0 13px;
  color: var(--muted);
  font-size: 13px;
}

/* Cleaner dynamic form visuals: avoid nested fieldset look. */
.request-wizard-panel fieldset,
.request-wizard-panel .fieldset {
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
.request-wizard-panel legend {
  font-family: "VazirHoma", "ShabnamHoma", Tahoma, sans-serif;
  font-weight: 700;
  padding: 0;
  margin-bottom: 9px;
}
.request-wizard-panel .form-group {
  padding: 0;
}
.request-wizard-panel .form-group > label {
  margin-bottom: 1px;
}
.request-wizard-panel .radio-row:not(.choice-card-row),
.request-wizard-panel .check-row:not(.choice-card-row) {
  padding: 8px 10px;
  /* border: 1px solid var(--border);
  border-radius: 10px; */
  background: var(--surface);
  margin-bottom: 15px;
}

/* Larger calendar: no cramped inner scroll on desktop, fullscreen on small screens. */
.jdp-popover.jdp-full {
  width: min(1180px, calc(100vw - 32px)) !important;
  max-height: min(86vh, 820px);
  padding: 18px !important;
}
.jdp-full .jdp-layout {
  grid-template-columns: minmax(480px, 1.35fr) minmax(300px, 0.65fr) !important;
  gap: 20px !important;
}
.jdp-full .jdp-day {
  min-height: 52px;
}
.jdp-full .jdp-slots {
  max-height: none !important;
  overflow: visible !important;
  padding-right: 18px;
}
.jdp-full .jdp-slot-grid {
  max-height: none !important;
  overflow: visible !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.jdp-full .jdp-calendar {
  min-width: 0;
}

/* Auth pages */
.auth-centered .form-group,
.auth-centered .login-logo {
  text-align: center;
}
.auth-centered .form-group label {
  text-align: center;
}
.auth-centered input[type="text"],
.auth-centered input[type="password"],
.auth-centered input[type="tel"] {
  text-align: center;
  direction: ltr;
}
.auth-centered .help {
  text-align: center;
}
.auth-centered .btn {
  width: 100%;
}
.auth-centered .auth-links {
  text-align: center;
}

/* Admin branding previews */
.branding-preview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.branding-preview {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px;
  text-align: center;
  background: var(--surface-2);
}
.branding-preview img {
  max-width: 120px;
  max-height: 70px;
  object-fit: contain;
  display: block;
  margin: 0 auto 8px;
}
.branding-preview small {
  color: var(--muted);
}

@media (max-width: 980px) {
  .schedule-range-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .jdp-popover.jdp-full {
    position: fixed !important;
    inset: 10px !important;
    width: auto !important;
    max-height: none !important;
    overflow: auto;
  }
  .jdp-full .jdp-layout {
    grid-template-columns: 1fr !important;
  }
  .jdp-full .jdp-slots {
    border-right: 0;
    border-top: 1px solid var(--border);
    padding: 14px 0 0;
  }
  .request-summary-bar {
    top: calc(var(--topbar) + 4px);
  }
}
@media (max-width: 700px) {
  .toast-stack {
    left: 14px;
    right: 14px;
    top: 14px;
    width: auto;
  }
  .request-summary-bar {
    position: relative;
    top: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }
  .request-summary-bar > span {
    border-left: 0;
    border-bottom: 1px solid var(--border);
    padding: 7px 6px;
  }
  .request-summary-bar > a {
    position: absolute;
    left: 8px;
    top: 8px;
  }
  .nature-choice-grid,
  .party-nature-grid {
    grid-template-columns: 1fr;
  }
  .schedule-range-grid {
    grid-template-columns: 1fr;
  }
  .schedule-calculation > span {
    flex: 1;
    justify-content: center;
  }
  .schedule-calculation .btn {
    width: 100%;
    margin: 2px 0 0;
  }
  .deep-wizard.request-wizard {
    padding: 7px !important;
  }
  .deep-wizard .autosave-indicator {
    display: none;
  }
  .branding-preview-grid {
    grid-template-columns: 1fr;
  }
  .jdp-popover.jdp-full {
    inset: 0 !important;
    border-radius: 0 !important;
  }
  .jdp-full .jdp-day {
    min-height: 44px;
  }
}

/* V3 Deep Review: roomy date-only picker used by multi-day request scheduling. */
.jdp-popover.jdp-large {
  width: min(780px, calc(100vw - 32px)) !important;
  padding: 20px !important;
}
.jdp-large .jdp-calendar {
  width: 100%;
}
.jdp-large .jdp-day {
  min-height: 58px;
  font-size: 14px;
}
.jdp-large .jdp-week span {
  font-size: 13px;
  padding: 8px;
}
.jdp-large .jdp-head {
  margin-bottom: 14px;
}
.jdp-large .jdp-nav {
  width: 40px;
  height: 40px;
}
.jdp-large .jdp-footer {
  margin-top: 14px;
}
.jdp-large .jdp-legend {
  font-size: 13px;
}
@media (max-width: 700px) {
  .jdp-popover.jdp-large {
    inset: 0 !important;
    width: auto !important;
    max-height: none !important;
    border-radius: 0 !important;
    overflow: auto;
  }
  .jdp-large .jdp-day {
    min-height: 48px;
  }
}

/* HOMA V3.1 — request flow and dynamic form deep UX review */
.request-nature-shell {
  max-width: 1120px;
  margin: 0 auto 18px;
}
.nature-page-section {
  padding: 28px 30px;
}
.legal-choice-panel {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--border);
}
.legal-choice-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.legal-choice-head > div b,
.legal-choice-head > div small {
  display: block;
}
.legal-choice-head > div small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}
.legal-rep-card {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 72px;
  position: relative;
}
.legal-rep-card > span:nth-child(2) {
  min-width: 0;
  flex: 1;
}
.legal-rep-card small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}
.legal-rep-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  flex: 0 0 38px;
  font-size: 18px;
}
.legal-rep-check {
  color: var(--primary);
  font-size: 20px;
}
.legal-empty-state {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  border: 1px dashed var(--border);
  border-radius: 12px;
  background: var(--surface-2);
  margin-top: 12px;
}
.legal-empty-state > i {
  font-size: 28px;
  color: var(--primary);
}
.legal-empty-state > div {
  flex: 1;
}
.legal-empty-state p {
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 13px;
}
.nature-continue {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
}
.request-choice-shell.request-choice-deep {
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 16px;
}
.request-choice-summary {
  position: sticky;
  top: calc(var(--topbar) + 14px);
  padding: 18px 16px;
  align-self: start;
}
.request-choice-summary h3 {
  margin: 0 0 4px;
  font-size: 15px;
}
.request-choice-summary > p {
  margin: 0 0 13px;
  color: var(--muted);
  font-size: 13px;
}
.request-choice-summary .btn-block {
  width: 100%;
  margin-top: 12px;
}
.choice-summary-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px solid var(--border);
}
.choice-summary-item:last-of-type {
  border-bottom: 0;
}
.choice-summary-item > div {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: var(--primary-soft);
  color: var(--primary);
  display: grid;
  place-items: center;
  flex: 0 0 34px;
}
.choice-summary-item span {
  min-width: 0;
}
.choice-summary-item em,
.choice-summary-item b {
  display: block;
  font-style: normal;
}
.choice-summary-item em {
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 2px;
}
.choice-summary-item b {
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hall-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.hall-choice-card {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 92px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  transition: 0.17s;
  position: relative;
}
.hall-choice-card:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--primary) 45%, var(--border));
  box-shadow: 0 8px 22px rgba(26, 29, 64, 0.07);
}
.hall-choice-card.selected {
  border-color: var(--primary);
  background: var(--primary-soft);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 8%, transparent);
}
.hall-choice-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--surface-2);
  display: grid;
  place-items: center;
  color: var(--primary);
  font-size: 21px;
  flex: 0 0 44px;
}
.hall-choice-copy {
  min-width: 0;
  flex: 1;
}
.hall-choice-copy b,
.hall-choice-copy small {
  display: block;
}
.hall-choice-copy b {
  font-size: 13px;
}
.hall-choice-copy small {
  color: var(--muted);
  font-size: 13px;
  margin-top: 4px;
  line-height: 1.6;
}
.hall-choice-radio {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1.5px solid var(--border);
  background: var(--surface);
  display: grid;
  place-items: center;
  color: #fff;
  flex: 0 0 22px;
}
.hall-choice-card.selected .hall-choice-radio {
  background: var(--primary);
  border-color: var(--primary);
}
/* compact Orchid-style segmented choices: never stretch to fill the form */
.segmented-choice {
  width: max-content !important;
  max-width: 100%;
  min-height: 36px !important;
}
.segmented-choice label {
  flex: 0 0 auto !important;
}
.segmented-choice span {
  width: auto !important;
  min-width: 88px;
  padding: 7px 13px !important;
  font-size: 13px !important;
}
.segmented-choice label:first-child span {
  min-width: 92px;
}
.request-wizard-panel .segmented-choice {
  align-self: flex-start;
}
/* traditional radios stay small with a clear center dot */
.radio-row:not(.choice-card-row) input[type="radio"] {
  -webkit-appearance: none;
  appearance: none;
  width: 15px !important;
  height: 15px !important;
  border-radius: 50%;
  border: 1.5px solid var(--border) !important;
  background: var(--surface) !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  box-shadow: none !important;
  vertical-align: middle;
}
.radio-row:not(.choice-card-row) input[type="radio"]::after {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--primary);
  transform: scale(0);
  transition: 0.13s;
}
.radio-row:not(.choice-card-row) input[type="radio"]:checked {
  border-color: var(--primary) !important;
}
.radio-row:not(.choice-card-row) input[type="radio"]:checked::after {
  transform: scale(1);
}
.request-wizard-panel .radio-row:not(.choice-card-row) {
  width: max-content;
  max-width: 100%;
  padding: 7px 9px !important;
  gap: 12px !important;
}
/* conditional "other" fields occupy the neighboring grid cell and stay invisible until needed */
.form-group.conditional-inline {
  align-self: end;
  max-width: 460px;
}
.form-group.conditional-inline textarea {
  min-height: 44px;
}
/* consistent repeater cards */
.repeat-card-list {
  display: grid;
  gap: 10px;
}
.repeat-card {
  border: 1px solid var(--border);
  border-radius: 13px;
  background: color-mix(in srgb, var(--surface-2) 38%, var(--surface));
  padding: 12px 13px;
  margin: 0 !important;
}
.repeat-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 11px;
  padding-bottom: 9px;
  border-bottom: 1px dashed var(--border);
}
.repeat-card-head > span {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--primary);
}
.repeat-card-head i {
  font-size: 17px;
}
.repeat-card-head b {
  font-size: 13px;
}
.repeat-fields-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 10px 12px;
  align-items: end;
}
.repeat-fields-grid .form-group {
  gap: 5px;
}
.repeat-fields-grid label {
  font-size: 13px;
}
.repeat-add-btn {
  margin-top: 10px;
}
.person-name-inline {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px !important;
}
/* one upload preview only + front-end metadata */
.file-preview-card {
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface-2);
}
.file-preview-card[hidden] {
  display: none !important;
}
.file-preview-thumb {
  width: 48px;
  height: 48px;
  border-radius: 9px;
  background: var(--surface);
  border: 1px solid var(--border);
  display: grid;
  place-items: center;
  overflow: hidden;
  color: var(--primary);
  font-size: 21px;
  flex: 0 0 48px;
}
.file-preview-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.file-preview-meta {
  min-width: 0;
  flex: 1;
}
.file-preview-meta b,
.file-preview-meta small {
  display: block;
}
.file-preview-meta b {
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.file-preview-meta small {
  margin-top: 3px;
  color: var(--muted);
  font-size: 13px;
}
.file-preview-card > .icon-btn {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
}
.schedule-priority-label {
  justify-content: space-between;
}
.schedule-priority-label > span {
  display: flex;
  align-items: center;
  gap: 7px;
}
.schedule-priority-label .btn {
  color: var(--primary);
}
.jdp-slot-help {
  margin: -4px 0 10px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}
.jdp-legend .g {
  background: #a5aab8;
}
.jdp-popover.jdp-full {
  overflow: visible !important;
}
.jdp-full .jdp-layout {
  align-items: start;
}
.jdp-full .jdp-slots {
  min-height: 500px;
}
.jdp-full .jdp-slot-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  max-height: 570px !important;
  overflow: auto !important;
  padding-left: 2px;
}
.agreement-preview strong {
  font-family: "VazirHoma", "ShabnamHoma", Tahoma, sans-serif;
  font-weight: 700;
  color: var(--text);
}
@media (max-width: 1180px) {
  .request-choice-shell.request-choice-deep {
    grid-template-columns: 1fr;
  }
  .request-choice-summary {
    position: static;
    display: block;
  }
  .hall-choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 700px) {
  .nature-page-section {
    padding: 18px;
  }
  .legal-choice-head,
  .legal-empty-state {
    align-items: flex-start;
    flex-direction: column;
  }
  .nature-continue .btn {
    width: 100%;
  }
  .hall-choice-grid {
    grid-template-columns: 1fr;
  }
  .segmented-choice {
    width: 100% !important;
  }
  .segmented-choice label {
    flex: 1 1 0 !important;
  }
  .segmented-choice span {
    width: 100% !important;
    min-width: 0;
  }
  .repeat-fields-grid,
  .person-name-inline {
    grid-template-columns: 1fr;
  }
  .schedule-priority-label {
    align-items: flex-start;
    flex-direction: column;
  }
  .schedule-priority-label .btn {
    width: 100%;
  }
  .jdp-full .jdp-slots {
    min-height: 0;
  }
  .jdp-full .jdp-slot-grid {
    max-height: none !important;
  }
}

/* ===== HOMA V3.1 — conditional subforms and repeatable-form consistency ===== */
.side-program-main {
  margin-bottom: 12px;
}
.conditional-subform-card {
  grid-column: 1/-1;
  margin-top: 12px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--border));
  border-radius: 14px;
  background: color-mix(in srgb, var(--primary-soft) 22%, var(--surface));
  box-shadow: 0 5px 18px rgba(35, 37, 72, 0.035);
}
.conditional-subform-head {
  display: flex;
  align-items: center;
  gap: 9px;
  padding-bottom: 10px;
  margin-bottom: 12px;
  border-bottom: 1px dashed var(--border);
}
.conditional-subform-head > i {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 18px;
  flex: 0 0 34px;
}
.conditional-subform-head h3 {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
}
.conditional-subform-card > .form-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px 12px;
}
.conditional-subform-card .form-group.full {
  grid-column: 1/-1;
}

/* Compact segmented controls should look like Orchid controls, never stretch. */
.form-group > .segmented-choice.compact-segmented {
  display: inline-flex !important;
  width: max-content !important;
  max-width: 100%;
  justify-self: start;
  align-self: start;
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: var(--surface);
  gap: 0 !important;
}
.segmented-choice.compact-segmented label {
  flex: 0 0 auto !important;
  min-width: 92px !important;
  width: auto !important;
  max-width: 220px;
  margin: 0 !important;
  border: 0 !important;
  border-inline-start: 1px solid var(--border) !important;
  border-radius: 0 !important;
  padding: 2px 4px !important;
  justify-content: center !important;
  background: transparent !important;
  cursor: pointer;
  white-space: nowrap;
}
.segmented-choice.compact-segmented label:first-child {
  border-inline-start: 0 !important;
}
.segmented-choice.compact-segmented label:has(input:checked) {
  background: var(--primary) !important;
  color: #fff !important;
}
.segmented-choice.compact-segmented input {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 1px !important;
  height: 1px !important;
}

/* Native-looking radios for choices that intentionally use normal radio presentation. */
.radio-row.option-grid label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: auto !important;
  min-width: 0 !important;
}
.radio-row.option-grid input[type="radio"],
.check-row:not(.segmented-choice) input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  width: 15px !important;
  height: 15px !important;
  min-width: 15px;
  border: 1.5px solid #aeb4c4;
  border-radius: 50%;
  background: var(--surface);
  display: inline-grid;
  place-items: center;
  margin: 0 !important;
  box-shadow: none !important;
}
.radio-row.option-grid input[type="radio"]::before,
.check-row:not(.segmented-choice) input[type="radio"]::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--primary);
  transform: scale(0);
  transition: transform 0.12s ease;
}
.radio-row.option-grid input[type="radio"]:checked {
  border-color: var(--primary);
}
.radio-row.option-grid input[type="radio"]:checked::before,
.check-row:not(.segmented-choice) input[type="radio"]:checked::before {
  transform: scale(1);
}

/* Inline conditional "other" inputs stay visually attached to their source group. */
.form-group.conditional-inline {
  align-self: end;
  animation: homaFieldReveal 0.16s ease;
}
.form-group.conditional-inline input,
.form-group.conditional-inline textarea {
  border-color: color-mix(in srgb, var(--primary) 28%, var(--border));
  background: color-mix(in srgb, var(--primary-soft) 10%, var(--surface));
}
@keyframes homaFieldReveal {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* Repeatable person rows: name / surname / national code stay in one line on desktop. */
.repeat-fields-grid:has(input[data-validator="IR_NATIONAL_CODE"]) {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* File control is one component; browser preview is never duplicated by a second preview area. */
.file-preview-card[hidden] {
  display: none !important;
}
.file-preview-card {
  margin-top: 8px;
}

@media (max-width: 900px) {
  .conditional-subform-card > .form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .repeat-fields-grid:has(input[data-validator="IR_NATIONAL_CODE"]) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 620px) {
  .conditional-subform-card > .form-grid,
  .repeat-fields-grid:has(input[data-validator="IR_NATIONAL_CODE"]) {
    grid-template-columns: 1fr;
  }
  .form-group > .segmented-choice.compact-segmented {
    width: 100% !important;
    overflow-x: auto;
  }
  .segmented-choice.compact-segmented label {
    min-width: max-content !important;
    padding-inline: 14px !important;
  }
}

/* V3.1 final overrides: compact choices stay compact and calendar has no nested desktop scroll. */
.form-group > .segmented-choice.compact-segmented {
  width: max-content !important;
  max-width: 100% !important;
}
.jdp-full .jdp-slot-grid {
  max-height: none !important;
  overflow: visible !important;
}
.jdp-full .jdp-slots {
  overflow: visible !important;
}
@media (max-width: 620px) {
  .form-group > .segmented-choice.compact-segmented {
    width: max-content !important;
    max-width: 100% !important;
  }
  .segmented-choice.compact-segmented label {
    flex: 0 0 auto !important;
  }
}

/* V3.1.2 request UI refinements */
.nature-choice-card {
  background: var(--surface) !important;
  border-color: var(--border) !important;
  color: var(--text);
}
.nature-choice-card > i {
  background: var(--surface-2) !important;
  color: var(--muted) !important;
}
.nature-choice-card.selected {
  background: var(--primary-soft) !important;
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 10%, transparent);
}
.nature-choice-card.selected > i {
  background: color-mix(in srgb, var(--primary) 14%, var(--surface)) !important;
  color: var(--primary) !important;
}
@media (min-width: 1181px) {
  .request-choice-main .choice-section {
    padding: 13px 18px;
  }
  .request-choice-main .choice-section-head {
    margin-bottom: 9px;
  }
  .request-choice-main .choice-section-head h2 {
    font-size: 15px;
  }
  .request-choice-main .choice-section-head p {
    font-size: 13px;
  }
  .request-choice-main .choice-step {
    width: 27px;
    height: 27px;
    flex-basis: 27px;
    font-size: 13px;
  }
  .request-choice-main .choice-divider {
    margin: 0 18px;
  }
  .program-choice-grid {
    gap: 7px;
  }
  .program-choice-card {
    min-height: 86px !important;
    padding: 8px 7px !important;
    gap: 3px !important;
  }
  .program-choice-icon {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    margin: 0;
  }
  .program-choice-icon img {
    width: 28px;
    height: 28px;
  }
  .service-choice-card strong {
    font-size: 13px;
  }
  .service-choice-card small {
    font-size: 13px;
    line-height: 1.35;
  }
  .venue-choice-grid {
    gap: 8px;
  }
  .venue-choice-card {
    padding: 8px;
    grid-template-columns: 34% minmax(0, 1fr);
    gap: 9px;
  }
  .venue-choice-image {
    height: 78px;
  }
  .venue-choice-copy h3 {
    font-size: 13px;
    margin-bottom: 8px;
  }
  .venue-choice-copy p {
    font-size: 13px;
    line-height: 1.5;
  }
  .hall-choice-grid {
    gap: 7px;
  }
  .hall-choice-card {
    min-height: 62px;
    padding: 8px;
  }
  .hall-choice-icon {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
    font-size: 18px;
  }
  .hall-choice-copy small {
    margin-top: 2px;
  }
  .request-choice-deep {
    align-items: start;
  }
}
.jdp-popover.jdp-full {
  position: fixed !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%);
  width: min(1180px, calc(100vw - 40px)) !important;
  max-height: calc(100vh - 40px) !important;
  overflow: auto !important;
  padding: 18px !important;
  z-index: 1200;
}
.jdp-modal-head {
  display: grid;
  grid-template-columns: 42px 1fr 42px;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  text-align: center;
}
.jdp-modal-head > div {
  display: grid;
  gap: 2px;
}
.jdp-modal-head small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 400;
}
.jdp-full .jdp-layout {
  grid-template-columns: minmax(0, 1.65fr) minmax(260px, 0.55fr) !important;
  gap: 18px !important;
}
.jdp-calendars {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.jdp-calendars.single {
  grid-template-columns: 1fr;
}
.jdp-calendar {
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px;
}
.jdp-calendar .jdp-head {
  justify-content: center;
  margin-bottom: 7px;
}
.jdp-calendar .jdp-title {
  font-size: 13px;
}
.jdp-full .jdp-day {
  min-height: 42px !important;
}
.jdp-full .jdp-slots {
  border-right: 1px solid var(--border);
  padding-right: 16px;
  min-height: 0 !important;
}
.jdp-full .jdp-slot-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  max-height: 430px !important;
  overflow: auto !important;
}
.jdp-no-slots {
  grid-column: 1/-1;
  padding: 18px;
  text-align: center;
  color: var(--muted);
  background: var(--surface-2);
  border-radius: 10px;
}
.jdp-apply {
  margin-top: 12px;
}
.time-slot-input {
  cursor: pointer !important;
  background-image: linear-gradient(
    135deg,
    transparent 50%,
    var(--primary) 50%
  ) !important;
  background-position: 12px 50% !important;
  background-size: 6px 6px !important;
  background-repeat: no-repeat !important;
  padding-left: 28px !important;
}
.homa-time-modal {
  position: fixed;
  inset: 0;
  z-index: 1300;
  background: rgba(16, 18, 28, 0.42);
  display: grid;
  place-items: center;
  padding: 20px;
}
.homa-time-card {
  width: min(620px, 100%);
  max-height: min(680px, calc(100vh - 40px));
  overflow: auto;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 16px;
  box-shadow: var(--shadow-lg);
}
.homa-time-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}
.homa-time-head > div {
  display: grid;
  gap: 3px;
}
.homa-time-head small {
  color: var(--muted);
  font-size: 13px;
}
.homa-time-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
  direction: ltr;
}
.homa-time-slot {
  min-height: 42px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface-2);
  color: var(--text);
  cursor: pointer;
  font: inherit;
}
.homa-time-slot:hover {
  border-color: var(--primary);
}
.homa-time-slot.selected {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
@media (max-width: 900px) {
  .jdp-full .jdp-layout {
    grid-template-columns: 1fr !important;
  }
  .jdp-full .jdp-slots {
    border-right: 0;
    border-top: 1px solid var(--border);
    padding: 14px 0 0;
  }
  .jdp-calendars {
    grid-template-columns: 1fr;
  }
  .homa-time-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (max-width: 700px) {
  .jdp-popover.jdp-full {
    inset: 8px !important;
    left: 8px !important;
    top: 8px !important;
    transform: none;
    width: auto !important;
    max-height: calc(100vh - 16px) !important;
    border-radius: 14px !important;
  }
  .jdp-calendars {
    grid-template-columns: 1fr;
  }
  .homa-time-modal {
    padding: 8px;
  }
  .homa-time-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* V3.1.3 — corrected applicant choice, standard radios, readable compact cards, scheduling modal */
.nature-choice-card {
  position: relative;
}
.nature-choice-card:not(.selected) {
  background: var(--surface) !important;
  border-color: var(--border) !important;
}
.nature-choice-card:not(.selected) > i {
  background: var(--surface-2) !important;
  color: var(--muted) !important;
}
.nature-continue {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
}
.nature-continue .btn {
  min-width: 150px;
}
.nature-continue .btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  filter: saturate(0.65);
}
.radio-row.option-grid {
  width: auto !important;
  max-width: 100%;
  padding: 6px 8px !important;
  gap: 14px !important;
}
.radio-row.option-grid label {
  font-size: 13px;
  line-height: 1.7;
}
.radio-row.option-grid input[type="radio"] {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  padding: 0 !important;
}
.radio-row.option-grid input[type="radio"]::before,
.radio-row.option-grid input[type="radio"]::after {
  width: 7px !important;
  height: 7px !important;
}
@media (min-width: 1181px) {
  .service-choice-card strong {
    font-size: 16px !important;
    line-height: 2.45;
  }
  .service-choice-card small {
    font-size: 13px !important;
    line-height: 1.45;
  }
  .venue-choice-copy h3 {
    font-size: 16px !important;
  }
  .venue-choice-copy p {
    font-size: 13px !important;
  }
  .hall-choice-copy b {
    font-size: 16px !important;
  }
  .hall-choice-copy small {
    font-size: 13px !important;
  }
}
.jdp-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 1190;
  background: rgba(16, 18, 28, 0.45);
  display: grid;
  place-items: center;
  padding: 20px;
}
.jdp-popover.jdp-full {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  margin: 0 !important;
  z-index: 1;
}
.jdp-close {
  position: absolute !important;
  left: 12px;
  top: 12px;
  z-index: 4;
  background: var(--surface-2) !important;
}
.jdp-slot {
  display: grid;
  gap: 2px;
  align-content: center;
  min-height: 44px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface-2);
  padding: 7px 9px;
}
.jdp-slot span {
  font-weight: 700;
  direction: ltr;
}
.jdp-slot small {
  font-size: 13px;
  color: var(--muted);
}
.jdp-slot.confirmed,
.jdp-slot.blocked {
  opacity: 0.62;
}
.jdp-slot.tentative,
.jdp-slot.registered {
  border-style: dashed;
}
.homa-time-slot {
  display: grid;
  align-content: center;
  gap: 2px;
  padding: 6px;
}
.homa-time-slot span {
  font-weight: 700;
}
.homa-time-slot small {
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.homa-time-slot.selected small {
  color: inherit;
}
.homa-time-slot:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}
.homa-time-slot.confirmed,
.homa-time-slot.blocked {
  border-color: color-mix(in srgb, var(--danger) 35%, var(--border));
}
.homa-time-slot.tentative,
.homa-time-slot.registered {
  border-style: dashed;
}
.homa-time-loading,
.homa-time-empty {
  grid-column: 1/-1;
  padding: 22px;
  text-align: center;
  color: var(--muted);
  background: var(--surface-2);
  border-radius: 10px;
}
@media (max-width: 700px) {
  .jdp-modal-overlay {
    padding: 8px;
  }
  .jdp-popover.jdp-full {
    width: 100% !important;
    max-height: calc(100vh - 16px) !important;
    border-radius: 14px !important;
  }
  .nature-continue {
    justify-content: stretch;
  }
  .nature-continue .btn {
    width: 100%;
  }
}

.segmented-choice.compact-segmented {
  width: max-content;
  max-width: 100%;
  min-height: 38px;
}
.segmented-choice.compact-segmented label {
  flex: 0 1 auto;
}
.segmented-choice.compact-segmented span {
  min-width: 105px;
  padding: 8px 12px;
}
.jdp-modal-overlay .jdp-popover.jdp-full {
  inset: auto !important;
  right: auto !important;
  bottom: auto !important;
}
/* HOMA V3.2 — custom request form layouts (12-column responsive grid) */
.form-layout-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 15px 18px;
  align-items: start;
}
.form-layout-grid > .form-group.form-layout-col {
  grid-column: span 6;
  min-width: 0;
}
.form-layout-grid > .form-group.form-layout-col.full {
  grid-column: span 6;
}
.form-layout-missing {
  grid-column: 1 / -1;
  padding: 10px 12px;
  border: 1px dashed var(--danger);
  border-radius: 10px;
  color: var(--danger);
  background: color-mix(in srgb, var(--danger) 5%, var(--surface));
  font-size: 13px;
}
.form-layout-card {
  grid-column: 1 / -1;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-2) 34%, var(--surface));
  padding: 15px;
}
.form-layout-card + .form-layout-card {
  margin-top: 14px;
}
.form-layout-card-head {
  margin-bottom: 13px;
  padding-bottom: 10px;
  border-bottom: 1px dashed var(--border);
}
.form-layout-card-head h3 {
  margin: 0 0 4px;
  font-size: 14px;

}
.form-layout-card-head p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.8;
}
.form-layout-grid > .form-col-d-1 { grid-column: span 1 !important; }
.form-layout-grid > .form-col-d-2 { grid-column: span 2 !important; }
.form-layout-grid > .form-col-d-3 { grid-column: span 3 !important; }
.form-layout-grid > .form-col-d-4 { grid-column: span 4 !important; }
.form-layout-grid > .form-col-d-5 { grid-column: span 5 !important; }
.form-layout-grid > .form-col-d-6 { grid-column: span 6 !important; }
.form-layout-grid > .form-col-d-7 { grid-column: span 7 !important; }
.form-layout-grid > .form-col-d-8 { grid-column: span 8 !important; }
.form-layout-grid > .form-col-d-9 { grid-column: span 9 !important; }
.form-layout-grid > .form-col-d-10 { grid-column: span 10 !important; }
.form-layout-grid > .form-col-d-11 { grid-column: span 11 !important; }
.form-layout-grid > .form-col-d-12 { grid-column: span 12 !important; }
@media (max-width: 1100px) {
  .form-layout-grid > .form-col-t-1 { grid-column: span 1 !important; }
  .form-layout-grid > .form-col-t-2 { grid-column: span 2 !important; }
  .form-layout-grid > .form-col-t-3 { grid-column: span 3 !important; }
  .form-layout-grid > .form-col-t-4 { grid-column: span 4 !important; }
  .form-layout-grid > .form-col-t-5 { grid-column: span 5 !important; }
  .form-layout-grid > .form-col-t-6 { grid-column: span 6 !important; }
  .form-layout-grid > .form-col-t-7 { grid-column: span 7 !important; }
  .form-layout-grid > .form-col-t-8 { grid-column: span 8 !important; }
  .form-layout-grid > .form-col-t-9 { grid-column: span 9 !important; }
  .form-layout-grid > .form-col-t-10 { grid-column: span 10 !important; }
  .form-layout-grid > .form-col-t-11 { grid-column: span 11 !important; }
  .form-layout-grid > .form-col-t-12 { grid-column: span 12 !important; }
}
@media (max-width: 700px) {
  .form-layout-grid { gap: 13px; }
  .form-layout-grid > .form-col-m-1 { grid-column: span 1 !important; }
  .form-layout-grid > .form-col-m-2 { grid-column: span 2 !important; }
  .form-layout-grid > .form-col-m-3 { grid-column: span 3 !important; }
  .form-layout-grid > .form-col-m-4 { grid-column: span 4 !important; }
  .form-layout-grid > .form-col-m-5 { grid-column: span 5 !important; }
  .form-layout-grid > .form-col-m-6 { grid-column: span 6 !important; }
  .form-layout-grid > .form-col-m-7 { grid-column: span 7 !important; }
  .form-layout-grid > .form-col-m-8 { grid-column: span 8 !important; }
  .form-layout-grid > .form-col-m-9 { grid-column: span 9 !important; }
  .form-layout-grid > .form-col-m-10 { grid-column: span 10 !important; }
  .form-layout-grid > .form-col-m-11 { grid-column: span 11 !important; }
  .form-layout-grid > .form-col-m-12 { grid-column: span 12 !important; }
}

/* HOMA V3.2.3 — conditional fields are truly removed from layout until active. */
.form-group[hidden],
[data-show-when][hidden] {
    display: none !important;
}

/* HOMA form layout utilities — conditional containers and reusable nested 12-column layouts. */
.form-group[data-other-dependent="1"][hidden],
.form-group[data-other-dependent="1"][aria-hidden="true"],
.conditional-container[hidden],
[data-conditional-container="1"][hidden],
[data-show-when]:not([data-condition-ready="1"]) {
  display: none !important;
}

.form-two-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px;
  align-items: start;
  min-width: 0;
}

.form-column {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 16px;
  row-gap: 24px;
  align-items: start;
  min-width: 0;
}

.form-column > .form-group.form-layout-col,
.form-column > .form-layout-col {
  min-width: 0;
}

.form-column > .form-col-d-1 { grid-column: span 1 !important; }
.form-column > .form-col-d-2 { grid-column: span 2 !important; }
.form-column > .form-col-d-3 { grid-column: span 3 !important; }
.form-column > .form-col-d-4 { grid-column: span 4 !important; }
.form-column > .form-col-d-5 { grid-column: span 5 !important; }
.form-column > .form-col-d-6 { grid-column: span 6 !important; }
.form-column > .form-col-d-7 { grid-column: span 7 !important; }
.form-column > .form-col-d-8 { grid-column: span 8 !important; }
.form-column > .form-col-d-9 { grid-column: span 9 !important; }
.form-column > .form-col-d-10 { grid-column: span 10 !important; }
.form-column > .form-col-d-11 { grid-column: span 11 !important; }
.form-column > .form-col-d-12 { grid-column: span 12 !important; }

@media (max-width: 1100px) {
  .form-column > .form-col-t-1 { grid-column: span 1 !important; }
  .form-column > .form-col-t-2 { grid-column: span 2 !important; }
  .form-column > .form-col-t-3 { grid-column: span 3 !important; }
  .form-column > .form-col-t-4 { grid-column: span 4 !important; }
  .form-column > .form-col-t-5 { grid-column: span 5 !important; }
  .form-column > .form-col-t-6 { grid-column: span 6 !important; }
  .form-column > .form-col-t-7 { grid-column: span 7 !important; }
  .form-column > .form-col-t-8 { grid-column: span 8 !important; }
  .form-column > .form-col-t-9 { grid-column: span 9 !important; }
  .form-column > .form-col-t-10 { grid-column: span 10 !important; }
  .form-column > .form-col-t-11 { grid-column: span 11 !important; }
  .form-column > .form-col-t-12 { grid-column: span 12 !important; }
}

@media (max-width: 768px) {
  .form-two-columns {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

@media (max-width: 700px) {
  .form-column {
    column-gap: 12px;
    row-gap: 20px;
  }
  .form-column > .form-col-m-1 { grid-column: span 1 !important; }
  .form-column > .form-col-m-2 { grid-column: span 2 !important; }
  .form-column > .form-col-m-3 { grid-column: span 3 !important; }
  .form-column > .form-col-m-4 { grid-column: span 4 !important; }
  .form-column > .form-col-m-5 { grid-column: span 5 !important; }
  .form-column > .form-col-m-6 { grid-column: span 6 !important; }
  .form-column > .form-col-m-7 { grid-column: span 7 !important; }
  .form-column > .form-col-m-8 { grid-column: span 8 !important; }
  .form-column > .form-col-m-9 { grid-column: span 9 !important; }
  .form-column > .form-col-m-10 { grid-column: span 10 !important; }
  .form-column > .form-col-m-11 { grid-column: span 11 !important; }
  .form-column > .form-col-m-12 { grid-column: span 12 !important; }
}

.form-row-break {
    grid-column: 1 / -1;
    height: 0;
    padding: 0;
    margin: 0;
}

/* =========================================================
   HOMA V3.2.8 — Orchid-aligned design tokens and request details
   ========================================================= */
:root {
  --primary: #7366ff;
  --primary-2: #5b50dc;
  --primary-soft: #f0eeff;
  --accent: #d21f8d;
  --bg: #f6f7fb;
  --surface: #ffffff;
  --surface-2: #f8f8fc;
  --text: #20233b;
  --muted: #6f7488;
  --border: #d8dbe8;
  --border-strong: #c7cbdb;
  --shadow: 0 7px 22px rgba(35, 40, 84, 0.075);
  --shadow-lg: 0 18px 55px rgba(35, 40, 84, 0.15);
}
:root[data-theme="dark"] {
  --primary: #8f84ff;
  --primary-2: #7366ff;
  --primary-soft: #302d50;
  --accent: #e450a6;
  --border: #3a3c49;
  --border-strong: #4a4d5d;
}

input,
select,
textarea,
.card,
.form-layout-card,
.choice-section,
.service-choice-card,
.venue-choice-card,
.hall-choice-card,
.attachment-card,
.schedule-card {
  border-color: var(--border);
}
input,
select,
textarea {
  border-color: var(--border-strong);
}
input:focus,
select:focus,
textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 16%, transparent);
}
.service-choice-card.selected,
.venue-choice-card.selected,
.hall-choice-card.selected,
.choice-card-row label:has(input:checked),
.check-row label:has(input:checked) {
  border-color: var(--primary) !important;
  border-width: 1.5px !important;
}

/* Venue cards are intentionally taller than the compact V3.1 desktop override. */
@media (min-width: 1181px) {
  .venue-choice-card {
    min-height: 184px !important;
    padding: 12px !important;
    grid-template-columns: 39% minmax(0, 1fr) !important;
    gap: 14px !important;
  }
  .venue-choice-image {
    height: 158px !important;
  }
  .venue-choice-copy h3 {
    font-size: 17px !important;
  }
  .venue-choice-copy p,
  .venue-choice-meta {
    font-size: 13px !important;
  }
}

/* Request detail report: one content area, navigated by tabs. */
.request-detail-tabs {
  display: grid;
  gap: 14px;
}
.request-detail-tabbar {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
  scrollbar-width: thin;
  padding: 7px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: var(--shadow);
}
.request-detail-tabbar button {
  appearance: none;
  border: 1px solid transparent;
  background: transparent;
  color: var(--muted);
  min-height: 42px;
  padding: 9px 14px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  white-space: nowrap;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.request-detail-tabbar button:hover {
  color: var(--primary);
  background: var(--primary-soft);
}
.request-detail-tabbar button.active {
  color: var(--primary);
  background: var(--primary-soft);
  border-color: color-mix(in srgb, var(--primary) 38%, var(--border));
}
.request-detail-tabbar button i {
  font-size: 17px;
}
.request-detail-tab-panel[hidden] {
  display: none !important;
}
.request-detail-tab-panel > .card {
  margin: 0;
}
.request-detail-tab-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 16px;
}
@media (max-width: 720px) {
  .request-detail-tabbar {
    justify-content: flex-start;
    padding: 6px;
  }
  .request-detail-tabbar button {
    min-height: 40px;
    padding: 8px 11px;
  }
}

/* ===== HOMA V3.2.9 — scheduling modal and autosave refinements ===== */
.autosave-indicator.error {
  color: var(--danger);
}

/* Scheduling availability calendar: single month with navigation; hour selection stays outside the date picker. */
.jdp-modal-overlay .jdp-popover.jdp-full {
  width: min(1180px, calc(100vw - 32px)) !important;
  max-height: calc(100vh - 32px) !important;
  overflow: auto !important;
}

.jdp-full .jdp-layout {
  display: grid !important;
  grid-template-columns: minmax(430px, 0.95fr) minmax(460px, 1.05fr) !important;
  gap: 20px !important;
  align-items: start !important;
}

.jdp-full .jdp-calendars {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

.jdp-full .jdp-calendar {
  padding: 9px !important;
}

.jdp-full .jdp-calendar .jdp-head {
  margin-bottom: 6px !important;
}

.jdp-full .jdp-day {
  min-height: 34px !important;
}

.jdp-full .jdp-slots {
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  border-right: 1px solid var(--border) !important;
  padding: 0 18px 0 0 !important;
}

.jdp-full .jdp-slot-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 7px !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 !important;
}

.jdp-full .jdp-slot {
  min-height: 46px !important;
  padding: 6px 7px !important;
}

.jdp-full .jdp-slot-help {
  margin: 0 0 12px !important;
}

@media (max-width: 1050px) {
  .jdp-full .jdp-layout {
    grid-template-columns: minmax(360px, 0.9fr) minmax(360px, 1.1fr) !important;
  }

  .jdp-full .jdp-slot-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 820px) {
  .jdp-full .jdp-layout {
    grid-template-columns: 1fr !important;
  }

  .jdp-full .jdp-slots {
    border-right: 0 !important;
    border-top: 1px solid var(--border) !important;
    padding: 14px 0 0 !important;
  }

  .jdp-full .jdp-slot-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 560px) {
  .jdp-full .jdp-slot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ===== HOMA V3.3.3 — offline icons + date-only scheduling calendar ===== */
.choice-summary-item > div > i,
.choice-summary-note > i,
.jdp-close > i,
.jdp-nav > i,
.homa-time-close > i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

.choice-summary-item > div > i::before {
  width: 20px;
  height: 20px;
}

.choice-summary-note > i::before {
  width: 17px;
  height: 17px;
}

.jdp-close > i::before,
.jdp-nav > i::before,
.homa-time-close > i::before {
  width: 18px;
  height: 18px;
}

.jdp-modal-overlay .jdp-popover.jdp-full {
  width: min(760px, calc(100vw - 32px)) !important;
  max-height: calc(100vh - 32px) !important;
  overflow: auto !important;
}

.jdp-full .jdp-layout,
.jdp-full .jdp-date-only-layout {
  display: block !important;
}

.jdp-full .jdp-calendars {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  width: min(100%, 680px);
  margin: 0 auto;
}

.jdp-full .jdp-calendar {
  width: 100%;
}

.jdp-full .jdp-slots,
.jdp-full .jdp-slot-grid,
.jdp-full .jdp-slot-help {
  display: none !important;
}

.jdp-full .jdp-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.jdp-full .jdp-loading {
  flex: 1 1 100%;
  min-height: 0;
  color: var(--danger);
  font-size: 13px;
}

.jdp-full .jdp-loading:empty {
  display: none;
}

.jdp-full .jdp-apply {
  min-width: 160px;
}

.jdp-close,
.jdp-nav {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

@media (max-width: 620px) {
  .jdp-modal-overlay .jdp-popover.jdp-full {
    width: calc(100vw - 20px) !important;
    max-height: calc(100vh - 20px) !important;
  }

  .jdp-full .jdp-footer {
    align-items: stretch !important;
  }

  .jdp-full .jdp-legend {
    width: 100%;
  }

  .jdp-full .jdp-apply {
    width: 100%;
  }
}

/* ===== HOMA V3.3.6 — compact repeaters + direct Jalali month/year jump ===== */
.jdp-compact-head {
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  gap: 8px;
}
.jdp-jump {
  display: grid;
  grid-template-columns: minmax(120px, 1fr) minmax(96px, 0.75fr);
  gap: 8px;
  min-width: 0;
}
.jdp-jump select {
  width: 100%;
  min-width: 0;
  min-height: 34px;
  padding: 5px 9px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 13px;
}
.jdp-jump select:focus {
  outline: 0;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}

/* Repeatable rows: index, fields and delete icon share one compact line. */
.repeat-card-list {
  gap: 8px;
}
.repeat-card {
  padding: 9px 10px;
}
.repeat-inline-row {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) 34px;
  gap: 10px;
  align-items: end;
}
.repeat-row-index {
  width: 32px;
  height: 36px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface-2);
  color: var(--primary);
  display: grid;
  place-items: center;
  align-self: end;
}
.repeat-row-index b {
  font-size: 13px;
  line-height: 1;
}
.repeat-inline-row > .repeat-fields-grid {
  min-width: 0;
  margin: 0;
}
.repeat-inline-row > .repeat-remove {
  width: 34px;
  height: 36px;
  min-width: 34px;
  padding: 0;
  align-self: end;
  color: var(--danger);
  border-color: color-mix(in srgb, var(--danger) 32%, var(--border));
  background: color-mix(in srgb, var(--danger) 5%, var(--surface));
}
.repeat-inline-row > .repeat-remove:hover {
  color: #fff;
  border-color: var(--danger);
  background: var(--danger);
}
.repeat-inline-row > .repeat-remove i {
  margin: 0;
  font-size: 17px;
}
.repeat-card-head {
  display: none !important;
}

.music-women-only-dance-note {
  border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--border));
  border-radius: 12px;
  background: color-mix(in srgb, var(--primary-soft) 62%, var(--surface));
  padding: 14px 16px;
  color: var(--text);
  line-height: 1.9;
}
.music-women-only-dance-note i {
  color: var(--primary);
  margin-left: 6px;
  vertical-align: middle;
}

@media (max-width: 640px) {
  .jdp-jump {
    grid-template-columns: 1fr 1fr;
  }
  .repeat-inline-row {
    grid-template-columns: 28px minmax(0, 1fr) 32px;
    gap: 7px;
    align-items: start;
  }
  .repeat-row-index,
  .repeat-inline-row > .repeat-remove {
    margin-top: 23px;
  }
}

/* HOMA V3.4.1 */
.password-eye-wrap{position:relative;display:block;width:100%}
.password-eye-wrap>input{width:100%;padding-left:48px}
.password-eye-btn{position:absolute;left:7px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;border-radius:9px;background:transparent;color:var(--muted);display:grid;place-items:center;cursor:pointer;z-index:2}
.password-eye-btn:hover{background:var(--surface-2);color:var(--primary)}
.password-eye-btn i{font-size:18px}
.pricing-preview-box{margin-top:16px;border:1px solid color-mix(in srgb,var(--primary) 22%,var(--border));border-radius:14px;padding:14px 16px;background:color-mix(in srgb,var(--primary-soft) 40%,var(--surface))}
.pricing-preview-box .pricing-preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.pricing-preview-box .pricing-preview-values{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.pricing-preview-box .pricing-preview-values>div{border:1px solid var(--border);border-radius:11px;padding:10px;background:var(--surface)}
.pricing-preview-box .pricing-preview-values small{display:block;color:var(--muted);margin-bottom:4px}.pricing-preview-box .pricing-preview-values b{font-size:15px}
.pricing-preview-note{font-size:13px;color:var(--muted);line-height:1.9;margin:10px 0 0}
.case-edit-panel{margin-top:16px;border:1px dashed color-mix(in srgb,var(--primary) 34%,var(--border));border-radius:14px;background:var(--surface)}
.case-edit-panel>summary{cursor:pointer;padding:13px 15px;font-weight:700;color:var(--primary);list-style:none}.case-edit-panel>summary::-webkit-details-marker{display:none}.case-edit-panel>summary i{margin-left:7px}
.case-edit-form{border-top:1px solid var(--border);padding:15px}.case-edit-schedules>.form-grid+ .form-grid{border-top:1px dashed var(--border);padding-top:12px;margin-top:12px}
.danger-soft{color:var(--danger)!important;border-color:color-mix(in srgb,var(--danger) 34%,var(--border))!important}.danger-soft:hover{background:color-mix(in srgb,var(--danger) 8%,var(--surface))!important}
.identity-snapshot-card{margin-top:14px;border:1px solid var(--border);border-radius:13px;background:var(--surface-2);padding:13px 15px}.identity-snapshot-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.identity-snapshot-card-head strong{display:flex;gap:7px;align-items:center}.identity-snapshot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.identity-snapshot-grid>div{min-width:0}.identity-snapshot-grid small{display:block;color:var(--muted);font-size:13px;margin-bottom:3px}.identity-snapshot-grid b{font-size:13px;word-break:break-word}.snapshot-seal{font-size:13px;color:var(--success);display:inline-flex;align-items:center;gap:5px}
.homa-error-shell{min-height:100vh;display:grid;place-items:center;padding:24px}.homa-error-card{width:min(560px,100%);text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:22px;padding:34px;box-shadow:var(--shadow)}.homa-error-code{font-size:13px;color:var(--muted);letter-spacing:.18em}.homa-error-icon{width:68px;height:68px;margin:14px auto;display:grid;place-items:center;border-radius:20px;background:var(--primary-soft);color:var(--primary);font-size:30px}.homa-error-card h1{margin:8px 0}.homa-error-card p{color:var(--muted);line-height:2}.homa-error-card .actions{justify-content:center}.homa-error-tech{text-align:right;margin-top:18px}.homa-error-tech pre{direction:ltr;text-align:left;white-space:pre-wrap;word-break:break-word;background:var(--surface-2);padding:12px;border-radius:10px}
@media(max-width:800px){.pricing-preview-box .pricing-preview-values,.identity-snapshot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.pricing-preview-box .pricing-preview-values,.identity-snapshot-grid{grid-template-columns:1fr}}


/* ===== HOMA V3.4.1 corrective UI layer ===== */
.header-breadcrumb{font-size:13px !important;}
.header-breadcrumb a,.header-breadcrumb span{font-size:13px !important;}
.program-table-title{display:inline-flex;align-items:center;gap:10px;min-width:0;}
.program-table-title img{width:34px !important;height:34px !important;max-width:34px !important;max-height:34px !important;object-fit:contain !important;display:block;flex:0 0 34px;}
.dashboard-title-row{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 18px;padding:2px 0 12px;border-bottom:1px solid var(--border);}
.dashboard-title-row h2{margin:0;font-size:20px;}
.dashboard-title-row p{margin:4px 0 0;color:var(--muted);font-size:13px;}
.dashboard-date-inline{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:13px;white-space:nowrap;}

/* Admin CRUDs are centered modals, not side drawers. Markup stays reusable. */
.drawer-backdrop{display:none;position:fixed;inset:0;z-index:220;background:rgba(20,24,48,.42);backdrop-filter:blur(3px);align-items:center;justify-content:center;padding:24px;}
.drawer-backdrop.open{display:flex !important;}
.drawer-dismiss{position:absolute;inset:0;}
.orchid-drawer,.orchid-drawer.wide{position:relative !important;inset:auto !important;width:min(760px,calc(100vw - 40px)) !important;max-width:760px !important;max-height:calc(100vh - 48px);border-radius:18px !important;box-shadow:0 24px 80px rgba(15,22,55,.26);transform:translateY(14px) scale(.985) !important;opacity:0;overflow:hidden;background:var(--surface);z-index:2;}
.orchid-drawer.wide{width:min(980px,calc(100vw - 40px)) !important;max-width:980px !important;}
.orchid-drawer.open{transform:translateY(0) scale(1) !important;opacity:1 !important;}
.drawer-body{max-height:calc(100vh - 170px);overflow:auto;}
.drawer-backdrop.drawer-leaving .orchid-drawer{transform:translateY(12px) scale(.985) !important;opacity:0 !important;}
.drawer-backdrop.drawer-entering .orchid-drawer{transform:translateY(12px) scale(.985) !important;opacity:0 !important;}
@media(max-width:700px){.drawer-backdrop{padding:10px}.orchid-drawer,.orchid-drawer.wide{width:calc(100vw - 20px) !important;max-height:calc(100vh - 20px);border-radius:14px !important}.drawer-body{max-height:calc(100vh - 145px)}.dashboard-title-row{align-items:flex-start;flex-direction:column}.dashboard-title-row>.btn{width:100%;justify-content:center}}

/* Pricing preview: per priority with detailed item table. */
.pricing-preview-result{display:grid;gap:14px;margin-top:14px;}
.pricing-priority-card{border:1px solid var(--border);border-radius:14px;background:var(--surface);overflow:hidden;}
.pricing-priority-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;background:var(--surface-2);border-bottom:1px solid var(--border);}
.pricing-priority-head>div{display:grid;gap:3px}.pricing-priority-head small{color:var(--muted);font-size:13px}.pricing-priority-head strong{font-size:16px;white-space:nowrap}
.pricing-preview-table{margin:0;border-radius:0;border:0;box-shadow:none}.pricing-preview-table table{min-width:620px}.pricing-preview-table th,.pricing-preview-table td{padding:10px 12px;font-size:13px}
.pricing-preview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:12px 14px;border-top:1px solid var(--border);}
.pricing-preview-grid>span{display:grid;gap:3px;padding:10px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2)}.pricing-preview-grid small{font-size:13px;color:var(--muted)}.pricing-preview-grid .strong{border-color:color-mix(in srgb,var(--primary) 35%,var(--border));background:var(--primary-soft)}
@media(max-width:900px){.pricing-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.pricing-preview-grid{grid-template-columns:1fr}}

/* Request case layout — V3.4.1, aligned with approved case mockup. */
.request-overview-card{padding:0;overflow:hidden;margin-bottom:18px}
.request-overview-card>.card-head{padding:18px 22px 8px;border-bottom:0}
.request-overview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 14px;padding:8px 22px 22px}
.request-overview-grid>div{min-width:0;display:grid;gap:5px;padding:11px 14px;border-radius:999px;background:var(--surface-2)}
.request-overview-grid small{font-size:13px;color:var(--muted);font-weight:650}
.request-overview-grid b{font-size:14px;min-width:0;overflow-wrap:anywhere}
.request-overview-grid .badge{justify-self:start}
.request-case-layout{display:grid;grid-template-columns:300px minmax(0,1fr);grid-template-areas:"side main";gap:18px;align-items:start}
.request-case-main{grid-area:main;min-width:0;display:grid;gap:18px}
.request-case-side{grid-area:side;min-width:0;display:grid;gap:18px;position:sticky;top:86px;align-self:start}
.request-case-detail{overflow:hidden}
.request-case-detail>.card-head{padding-bottom:8px;border-bottom:0}
.request-detail-tabbar{display:flex;align-items:center;gap:4px;margin:0 18px;padding:5px;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;overflow:auto}
.request-detail-tabbar button{appearance:none;border:0;background:transparent;color:var(--muted);font:inherit;font-weight:700;font-size:13px;white-space:nowrap;cursor:pointer;padding:10px 15px;border-radius:9px;transition:.18s ease}
.request-detail-tabbar button:hover{color:var(--text);background:color-mix(in srgb,var(--surface) 75%,transparent)}
.request-detail-tabbar button.active{color:var(--primary);background:var(--surface);box-shadow:0 1px 4px rgba(20,28,70,.08)}
.request-case-tabbody{padding:18px 20px 22px;min-height:310px}
.request-detail-tab-panel[hidden]{display:none!important}
.request-detail-tab-panel.active{display:block}
.request-task-action-card{overflow:hidden}
.request-task-action-card .card-body{padding:18px 20px 22px}
.task-result-readonly{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.task-result-readonly>div{display:grid;gap:5px;padding:12px 14px;background:var(--surface-2);border-radius:11px}
.task-result-readonly small{font-size:13px;color:var(--muted)}
.request-process-card,.request-history-card{overflow:hidden}
.request-process-card>.card-head,.request-history-card>.card-head{padding-bottom:10px}
.current-process-state{display:flex;gap:12px;align-items:flex-start;padding:4px 18px 18px}
.current-process-state>div{display:grid;gap:5px;min-width:0}
.current-process-state small{font-size:13px;color:var(--muted)}
.current-process-state b{font-size:14px;line-height:1.8}
.current-process-state em{font-style:normal;margin-top:3px}
.process-pulse{width:12px;height:12px;border-radius:999px;background:var(--primary);box-shadow:0 0 0 5px color-mix(in srgb,var(--primary) 14%,transparent);margin-top:7px;flex:0 0 auto}
.request-history-card .activity-timeline{padding:0 16px 18px;max-height:610px;overflow:auto}
.request-history-card .activity-event{grid-template-columns:28px minmax(0,1fr);gap:9px;padding:10px 0}
.request-history-card .activity-event-head{display:grid;gap:2px}
.request-history-card .activity-event-head b{font-size:13px;line-height:1.8}
.request-history-card .activity-event-head small{font-size:13px;color:var(--muted)}
.request-history-card .activity-event p{font-size:13px;line-height:1.8;margin:3px 0 0;color:var(--muted)}
@media(max-width:1100px){.request-overview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.request-case-layout{grid-template-columns:1fr;grid-template-areas:"main" "side"}.request-case-side{position:static;grid-template-columns:1fr 1fr}.request-history-card .activity-timeline{max-height:420px}}
@media(max-width:700px){.request-overview-grid{grid-template-columns:1fr;padding:8px 14px 16px}.request-overview-card>.card-head{padding:16px 14px 7px}.request-overview-grid>div{border-radius:12px}.request-case-side{grid-template-columns:1fr}.request-detail-tabbar{margin:0 12px}.request-case-tabbody{padding:14px}.task-result-readonly{grid-template-columns:1fr}}


/* ===== HOMA V3.4.8 request corrective layer ===== */
@media (min-width: 701px) {
  .request-wizard-panel .schedule-range-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}
.pricing-preview-box .pricing-preview-head > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.pricing-preview-box .pricing-preview-head b,
.pricing-preview-box .pricing-preview-head small {
  display: block;
  line-height: 1.8;
}
.request-choice-summary .choice-summary-item > div {
  align-items: center !important;
}
.request-choice-summary .choice-summary-item > div > i {
  display: grid !important;
  place-items: center !important;
  line-height: 1 !important;
  margin: 0 !important;
}
@media (max-width: 700px) {
  .toast-stack { left: 14px; right: auto; top: 14px; width: min(330px, calc(100vw - 28px)); }
}


/* ===== HOMA V3.4.9 focused corrections ===== */
.planner-picker-list{display:grid;gap:8px}.planner-picker-item{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--border-color,#e6e8ec);border-radius:10px;padding:9px 10px;background:var(--card-bg,#fff)}.planner-picker-item.selected{border-color:rgba(59,130,246,.35)}.planner-picker-item.primary{box-shadow:0 0 0 2px rgba(245,158,11,.12)}.planner-picker-check{display:flex;align-items:center;gap:8px;flex:1;cursor:pointer}.planner-primary-toggle{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--border-color,#e6e8ec);background:transparent;border-radius:999px;padding:4px 9px;font:inherit;font-size:13px;cursor:pointer;color:var(--muted,#64748b)}.planner-primary-toggle:disabled{display:none}.planner-primary-toggle.active{border-color:#f59e0b;color:#b45309;background:#fffbeb}.planner-primary-toggle i{font-size:15px}
.venue-choice-card{position:relative}.venue-choice-check{position:absolute!important;left:12px!important;right:auto!important;top:12px!important;z-index:3}.venue-choice-radio{display:none!important}
.request-choice-summary .choice-summary-item{direction:ltr;align-items:center}.request-choice-summary .choice-summary-item>span{direction:rtl;text-align:right;flex:1}.request-choice-summary .choice-summary-item>div{flex:0 0 auto;align-self:center}
.schedule-priority-actions{display:flex;align-items:center;gap:8px}.schedule-remove-btn{width:36px;height:36px;color:#dc2626;border-color:rgba(220,38,38,.22);flex:0 0 36px}.schedule-remove-btn:hover{background:#fef2f2;border-color:#fecaca}
.jdp-full .jdp-calendars{grid-template-columns:minmax(0,1fr)!important;max-width:560px;margin-inline:auto}.jdp-day.is-disabled,.jdp-day.has-blocked{background:#e5e7eb!important;border-color:#d1d5db!important;color:#9ca3af!important;cursor:not-allowed!important;opacity:1!important}.jdp-nav:disabled,.jdp-nav.disabled{opacity:.35;cursor:not-allowed}

/* ===== HOMA V3.6.0.3 — modal-safe Jalali picker + two-month scheduling ===== */
.jdp-popover{z-index:6100!important}
.jdp-modal-overlay{z-index:6200!important;isolation:isolate}
.jdp-modal-overlay .jdp-popover.jdp-full{z-index:1!important}
.homa-time-modal{z-index:6300!important;isolation:isolate}
.jdp-full .jdp-calendars{grid-template-columns:minmax(0,1fr)!important;max-width:580px!important;gap:16px!important}
.jdp-full .jdp-calendar+.jdp-calendar{border-top:1px solid var(--border);padding-top:14px}


/* ===== HOMA V3.7.13-dev2.0 — one-month scheduling modal stabilization ===== */
.jdp-modal-overlay .jdp-popover.jdp-full{max-width:760px!important;width:min(760px,calc(100vw - 24px))!important}
.jdp-popover.jdp-full .jdp-modal-head{display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px 44px!important;align-items:center!important;gap:8px!important;padding:14px 16px!important}
.jdp-popover.jdp-full .jdp-modal-head>div{grid-column:2!important;text-align:center!important;min-width:0!important}
.jdp-popover.jdp-full .jdp-nav.prev{grid-column:1!important;grid-row:1!important}
.jdp-popover.jdp-full .jdp-nav.next{grid-column:3!important;grid-row:1!important}
.jdp-popover.jdp-full .jdp-close{position:static!important;inset:auto!important;grid-column:4!important;grid-row:1!important;width:40px!important;height:40px!important;margin:0!important}
.jdp-full .jdp-calendars{grid-template-columns:minmax(0,1fr)!important;max-width:580px!important;margin-inline:auto!important}
.jdp-full .jdp-calendar+.jdp-calendar{display:none!important}
@media(max-width:700px){.jdp-popover.jdp-full .jdp-modal-head{grid-template-columns:40px minmax(0,1fr) 40px 40px!important;gap:4px!important;padding:10px!important}}

/* HOMA dev2.0 in-page validation summary */
.homa-error-summary{margin:0 0 18px;padding:14px 16px;border:1px solid #fecaca;border-radius:12px;background:#fef2f2;color:#991b1b}
.homa-error-summary[hidden]{display:none!important}.homa-error-summary-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:8px}.homa-error-summary-head>i{font-size:20px;line-height:1.5}.homa-error-summary-head>div{display:grid;gap:2px}.homa-error-summary-head small{color:#b91c1c}.homa-error-summary ul{margin:0;padding:0 22px 0 0;display:grid;gap:4px}.homa-error-summary li button{font:inherit;color:#991b1b;background:transparent;border:0;padding:2px 0;cursor:pointer;text-align:right}.homa-error-summary li button:hover{text-decoration:underline}.form-group.field-invalid input,.form-group.field-invalid select,.form-group.field-invalid textarea{border-color:#dc2626!important}.field-error{display:block;margin-top:6px;color:#b91c1c;font-size:12px;line-height:1.7}