/* pro.maghzeto.ir — پنل متخصصان و کلینیک‌ها
   -------------------------------------------------------------------------
   A sibling of panel.css/admin.css in spirit (self-hosted fonts, same
   near-black Maghzeto ink, same peach/mint accent threads from
   docs/design-v4-editorial-CURRENT.md) but its own "room": this is the one
   Maghzeto surface a paying EXTERNAL business looks at, not an internal
   instrument — so it borrows the public site's editorial voice (Estedad
   headings over Vazirmatn body) rather than the admin/specialist panels'
   plain single-face instrument look.

   Signature element: the "voucher" card — every referral link and every
   credit-consuming action is visually a ticket stub, because that is
   literally what a credit is (one referral, one paid-for slip), and it is
   the one thing this product's own vernacular (clinics issuing referral
   slips) hands you for free. Used for the wallet balance and every
   invitation row. Rationed to those two places only. */

@font-face {
  font-family: 'Vazirmatn'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('fonts/vazirmatn-arabic.woff2') format('woff2');
}
@font-face {
  font-family: 'Vazirmatn'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('fonts/vazirmatn-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Estedad'; font-style: normal; font-weight: 200 900; font-display: swap;
  src: url('fonts/estedad-variable.woff2') format('woff2');
}

:root {
  --paper:#FFFFFF;
  --paper-warm:#FBFAF6;
  --surface:#F2F1EC;
  --ink:#17191C;
  --ink-soft:#3A3D42;
  --muted:#6B6F76;
  --faint:#74777E;
  --border:#E7E4DC;
  --border-strong:#D8D4C8;

  --room:#1B4332;      /* pro panel's own identity colour */
  --room-deep:#0E2A1F;
  --room-tint:#EAF2EC;
  --room-ink:#EAF3EE;  /* text on --room */

  --accent-bg:#FBE1D1; --accent-ink:#5D2A1A;   /* shared Maghzeto peach — attention / pending */
  --mint-bg:#DFF5E3;   --mint-ink:#14532D;     /* shared Maghzeto mint — success / completed */
  --danger:#B3261E;    --danger-bg:#FBE9E6;    --danger-ink:#7A2413;

  --radius-sm:12px; --radius-md:18px; --radius-lg:26px;
  --shadow-card:0 1px 2px rgba(23,25,28,.04), 0 8px 24px -12px rgba(23,25,28,.10);
  --shadow-pop:0 12px 32px -8px rgba(14,42,31,.28);

  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px; --space-7:48px;
}

* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0; min-height:100vh; background:var(--paper-warm); color:var(--ink);
  font-family:'Vazirmatn', Tahoma, system-ui, sans-serif;
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
  overflow-x:hidden; /* belt-and-braces: no surface on this panel should ever cause page-level horizontal scroll */
}
h1,h2,h3,.font-display { font-family:'Estedad','Vazirmatn',Tahoma,sans-serif; font-weight:700; letter-spacing:-.01em; }
a { color:var(--room); text-underline-offset:3px; }
:focus-visible { outline:2.5px solid var(--room); outline-offset:2px; border-radius:4px; }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.001ms !important; transition-duration:.001ms !important; } }

/* ---------------------------------------------------------------- shell */
.app-shell { display:flex; min-height:100vh; }
.app-side {
  width:248px; flex-shrink:0; background:linear-gradient(175deg, var(--room) 0%, var(--room-deep) 100%);
  color:var(--room-ink); padding:var(--space-5) var(--space-4); position:sticky; top:0; height:100vh;
  display:flex; flex-direction:column;
}
.app-side .brand-mark { display:flex; align-items:center; gap:var(--space-2); padding:0 var(--space-2) var(--space-6); }
.app-side .brand-mark img { width:30px; height:30px; filter:brightness(0) invert(1); opacity:.95; }
.app-side .brand-mark span { font-family:'Estedad','Vazirmatn',sans-serif; font-weight:700; font-size:16px; }
.app-side .brand-mark small { display:block; font-family:'Vazirmatn',sans-serif; font-weight:400; font-size:11px; opacity:.62; margin-top:1px; }
.app-nav { display:flex; flex-direction:column; gap:2px; flex:1; }
.app-nav a {
  display:flex; align-items:center; gap:var(--space-3); padding:11px var(--space-3); border-radius:var(--radius-sm);
  color:var(--room-ink); text-decoration:none; font-size:14.5px; opacity:.78; transition:background .15s ease, opacity .15s ease;
}
.app-nav a svg { flex-shrink:0; opacity:.9; }
.app-nav a:hover { background:rgba(255,255,255,.08); opacity:1; }
.app-nav a.active { background:rgba(255,255,255,.14); opacity:1; font-weight:600; }
.app-side .side-foot { padding-top:var(--space-4); border-top:1px solid rgba(255,255,255,.14); }
.app-side .side-foot a { opacity:.62; font-size:13px; }
.app-main { flex:1; min-width:0; padding:var(--space-6) var(--space-7); }
.page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--space-4); margin-bottom:var(--space-5); flex-wrap:wrap; }
.page-head h1 { font-size:26px; margin:0 0 4px; }
.page-head .lede { color:var(--muted); font-size:14.5px; margin:0; }

/* ---------------------------------------------------------------- cards */
.card { background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-lg); padding:var(--space-5); margin-bottom:var(--space-4); box-shadow:var(--shadow-card); }
.card-head { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); margin-bottom:var(--space-4); }
.card-head h2 { font-size:17px; margin:0; }
.card-head .hint { color:var(--muted); font-size:13px; }
.muted { color:var(--muted); font-size:14px; }
.faint { color:var(--faint); font-size:12.5px; }

/* hero stat (wallet balance) */
.stat-hero { display:flex; align-items:center; gap:var(--space-5); flex-wrap:wrap; }
.stat-hero .stat-figure { display:flex; align-items:baseline; gap:8px; }
.stat-hero .stat-figure b { font-family:'Estedad',sans-serif; font-size:44px; line-height:1; font-variant-numeric:tabular-nums; }
.stat-hero .stat-figure span { color:var(--muted); font-size:14px; }
.stat-hero .stat-actions { display:flex; gap:var(--space-2); margin-inline-start:auto; flex-wrap:wrap; }

/* ---------------------------------------------------------------- voucher (signature component) */
.voucher {
  position:relative; display:flex; align-items:stretch; background:var(--paper);
  border:1px solid var(--border); border-radius:var(--radius-md); overflow:visible; margin-bottom:var(--space-3);
  box-shadow:var(--shadow-card);
}
.voucher .voucher-main { flex:1; min-width:0; padding:var(--space-4) var(--space-4); display:flex; flex-direction:column; gap:6px; }
.voucher .voucher-main .v-title { font-weight:700; font-size:15px; }
.voucher .voucher-main .v-sub { color:var(--muted); font-size:13px; display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.voucher .voucher-stub {
  width:132px; flex-shrink:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  padding:var(--space-3); position:relative; border-inline-start:2px dashed var(--border-strong);
  text-align:center;
}
.voucher .voucher-stub::before, .voucher .voucher-stub::after {
  content:""; position:absolute; inset-inline-start:-9px; width:18px; height:18px; border-radius:50%; background:var(--paper-warm);
  border:1px solid var(--border);
}
.voucher .voucher-stub::before { top:-9px; }
.voucher .voucher-stub::after { bottom:-9px; }
.voucher .voucher-stub .v-stub-label { font-size:11px; color:var(--muted); }
.voucher .voucher-stub .v-stub-value { font-family:'Estedad',sans-serif; font-weight:700; font-size:20px; }
.voucher.is-cancelled { opacity:.55; }
.voucher .voucher-link { direction:ltr; text-align:left; font-size:12px; background:var(--surface); border-radius:8px; padding:6px 10px; color:var(--ink-soft); display:inline-block; max-width:100%; overflow-wrap:anywhere; }
code.token-link { overflow-wrap:anywhere; max-width:100%; }

/* ---------------------------------------------------------------- dashboard recent-referrals list (2026-09-30) */
.dref-list { display:flex; flex-direction:column; gap:var(--space-2); }
.dref {
  display:flex; align-items:center; gap:var(--space-3); padding:11px var(--space-4); border-radius:var(--radius-md);
  border:1px solid var(--border); background:var(--paper); text-decoration:none; color:inherit;
  transition:box-shadow .15s ease, border-color .15s ease, transform .1s ease;
}
.dref-avatar {
  flex:none; width:38px; height:38px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  font-family:'Estedad',sans-serif; font-weight:700; font-size:14px;
}
.dref-body { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.dref-title { font-weight:700; font-size:14.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dref-sub { color:var(--muted); font-size:12.5px; }
.dref-go { flex:none; color:var(--faint); display:flex; transition:transform .15s ease, color .15s ease; }
.dref.is-done { cursor:pointer; }
.dref.is-done:hover { border-color:var(--room); box-shadow:0 10px 22px -16px rgba(23,25,28,.3); }
.dref.is-done:hover .dref-go { transform:translateX(-3px); color:var(--room); }
.dref.is-done:active { transform:scale(.995); }
.dref.is-muted { opacity:.6; }
.dref:not(.is-done) { cursor:default; }

/* ---------------------------------------------------------------- buttons */
.btn {
  font-family:inherit; font-size:14.5px; font-weight:600; border:none; cursor:pointer; text-decoration:none;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:12px 22px; border-radius:999px; background:var(--ink); color:#fff; min-height:44px;
  transition:opacity .15s ease, transform .1s ease;
}
.btn:hover { opacity:.88; }
.btn:active { transform:scale(.98); }
.btn[disabled] { opacity:.4; cursor:not-allowed; }
.btn-ghost { background:transparent; color:var(--ink); border:1.5px solid var(--ink); }
.btn-room { background:var(--room); color:var(--room-ink); }
.btn-danger { background:transparent; color:var(--danger); border:1.5px solid var(--danger); }
.btn-sm { padding:8px 16px; font-size:13px; min-height:36px; }
.btn-block { width:100%; }

/* ---------------------------------------------------------------- forms */
.field { margin-bottom:var(--space-4); }
.field label { display:block; font-size:13.5px; font-weight:600; margin-bottom:6px; color:var(--ink-soft); }
.field-check { display:flex; align-items:center; gap:10px; }
.field-check input[type=checkbox] { width:20px; height:20px; min-height:0; padding:0; margin:0; flex:none; accent-color:var(--room); }
.field-check label { margin:0; font-size:14px; font-weight:500; cursor:pointer; }
.field .field-hint { font-size:12.5px; color:var(--muted); margin-top:5px; }
.field .field-error { font-size:12.5px; color:var(--danger); margin-top:5px; }
input, select {
  font-family:inherit; font-size:15px; padding:13px 16px; border-radius:var(--radius-sm); border:1.5px solid var(--border);
  width:100%; background:var(--paper); color:var(--ink); min-height:48px;
}
input::placeholder { color:var(--faint); }
input:focus, select:focus { outline:none; border-color:var(--room); box-shadow:0 0 0 3px var(--room-tint); }
input:invalid[data-touched] { border-color:var(--danger); }

/* ---------------------------------------------------------------- badges & alerts */
.badge { display:inline-flex; align-items:center; gap:5px; padding:4px 12px; border-radius:999px; font-size:12px; font-weight:600; background:var(--surface); color:var(--muted); }
.badge-pending { background:var(--accent-bg); color:var(--accent-ink); }
.badge-completed { background:var(--mint-bg); color:var(--mint-ink); }
.badge-cancelled { background:var(--surface); color:var(--faint); }
.alert { border-radius:var(--radius-sm); padding:13px 18px; margin-bottom:var(--space-4); font-size:14px; display:flex; gap:10px; align-items:flex-start; }
.alert-error { background:var(--danger-bg); color:var(--danger-ink); }
.alert-ok { background:var(--mint-bg); color:var(--mint-ink); }
.alert svg { flex-shrink:0; margin-top:2px; }

/* ---------------------------------------------------------------- table */
table { width:100%; border-collapse:collapse; font-size:14px; }
th,td { text-align:right; padding:12px 10px; border-bottom:1px solid var(--border); }
th { color:var(--muted); font-weight:600; font-size:12.5px; text-transform:none; }
tbody tr:last-child td { border-bottom:none; }
td.num, th.num { font-variant-numeric:tabular-nums; }

/* ---------------------------------------------------------------- empty state */
.empty-state { text-align:center; padding:var(--space-7) var(--space-4); color:var(--muted); }
.empty-state svg { opacity:.5; margin-bottom:var(--space-3); }
.empty-state p { margin:0 0 var(--space-3); }

/* ---------------------------------------------------------------- auth pages */
.auth-shell {
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:var(--space-5);
  background:
    radial-gradient(560px 420px at 82% 8%, var(--room-tint) 0%, transparent 65%),
    radial-gradient(480px 380px at 10% 95%, var(--accent-bg) 0%, transparent 60%),
    var(--paper-warm);
  position:relative; overflow:hidden;
}
.auth-shell::before {
  content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
  background-image:radial-gradient(circle, var(--border-strong) 1px, transparent 1px);
  background-size:22px 22px; mask-image:radial-gradient(circle at 50% 30%, black, transparent 72%);
}
.auth-card { position:relative; width:100%; max-width:408px; background:var(--paper); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:var(--space-6) var(--space-5); box-shadow:var(--shadow-pop); }
.auth-brand { display:flex; align-items:center; gap:10px; margin-bottom:var(--space-5); }
.auth-brand img { width:34px; height:34px; }
.auth-brand b { font-family:'Estedad',sans-serif; font-size:16px; }
.auth-brand span { display:block; font-size:11.5px; color:var(--muted); margin-top:1px; }
.auth-card h1 { font-size:21px; margin:0 0 6px; }
.auth-card .auth-lede { color:var(--muted); font-size:14px; margin:0 0 var(--space-5); }
.auth-foot { margin-top:var(--space-4); text-align:center; font-size:13.5px; color:var(--muted); }
.auth-shell .auth-legal { position:absolute; bottom:var(--space-4); font-size:12px; color:var(--faint); }

/* ---------------------------------------------------------------- responsive */
.app-drawer { display:contents; }
.burger, .drawer-head, .navscrim { display:none; }
@keyframes navfade { from { opacity:0; } to { opacity:1; } }
@keyframes navin { from { opacity:0; transform:translateX(14px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) { .app-drawer, .burger__bars i, .navscrim, .nav-open .app-nav a { transition:none !important; animation:none !important; } }
@media (max-width: 860px) {
  .app-shell { flex-direction:column; }
  .app-side { width:100%; height:auto; position:sticky; top:0; z-index:40; padding:10px var(--space-4);
    flex-direction:row; align-items:center; gap:12px; box-shadow:0 6px 18px rgba(14,42,31,.25); }
  .app-side > .brand-mark { padding:0; margin:0; }
  .app-side > .brand-mark small { display:none; }
  .app-side > .brand-mark span { font-size:17px; }

  .burger { display:grid; place-items:center; position:relative; flex:none; order:-1; width:42px; height:42px; padding:0; cursor:pointer;
    border:1px solid rgba(255,255,255,.18); border-radius:13px; background:rgba(255,255,255,.08); color:#fff;
    transition:background .15s, border-color .15s, transform .15s; -webkit-tap-highlight-color:transparent; }
  .burger:active { transform:scale(.94); }
  .burger:focus-visible { outline:2px solid var(--accent-bg); outline-offset:2px; }
  .burger__bars { position:relative; width:18px; height:14px; display:block; }
  .burger__bars i { position:absolute; inset-inline:0; height:2px; border-radius:2px; background:currentColor; transition:transform .28s cubic-bezier(.4,0,.2,1), opacity .2s; }
  .burger__bars i:nth-child(1) { top:0; }
  .burger__bars i:nth-child(2) { top:6px; width:70%; inset-inline-start:auto; inset-inline-end:0; }
  .burger__bars i:nth-child(3) { top:12px; }
  .nav-open .burger { background:rgba(255,255,255,.2); border-color:rgba(255,255,255,.32); }
  .nav-open .burger__bars i:nth-child(1) { transform:translateY(6px) rotate(45deg); }
  .nav-open .burger__bars i:nth-child(2) { opacity:0; }
  .nav-open .burger__bars i:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }
  .burger__dot { position:absolute; top:6px; inset-inline-start:6px; width:9px; height:9px; border-radius:50%; background:#FF8A3D; border:2px solid var(--room); }
  .nav-open .burger__dot { display:none; }

  .navscrim { display:block; position:fixed; inset:0; z-index:1000; background:rgba(10,24,18,.6); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); animation:navfade .22s ease both; }
  .navscrim[hidden] { display:none; }

  .app-drawer { display:flex; flex-direction:column; position:fixed; z-index:1001; top:0; bottom:0; inset-inline-start:0;
    width:min(86vw,330px); padding:0 12px env(safe-area-inset-bottom); overflow-y:auto; overscroll-behavior:contain;
    background:linear-gradient(175deg, var(--room) 0%, var(--room-deep) 100%); color:var(--room-ink);
    transform:translateX(104%); visibility:hidden; border-radius:24px 0 0 24px; box-shadow:-18px 0 48px rgba(0,0,0,.4);
    transition:transform .32s cubic-bezier(.32,.72,0,1), visibility 0s linear .32s; }
  .nav-open .app-drawer { transform:none; visibility:visible; transition-delay:0s; }
  body.nav-open { overflow:hidden; }
  .drawer-head { display:flex; align-items:center; justify-content:space-between; padding:22px 8px 16px; margin-bottom:6px; border-bottom:1px solid rgba(255,255,255,.12); }
  .drawer-brand { font-family:'Estedad','Vazirmatn',sans-serif; font-weight:700; font-size:19px; }
  .drawer-brand small { display:block; font-family:'Vazirmatn',sans-serif; font-weight:400; font-size:11.5px; opacity:.6; margin-top:2px; }
  .drawer-close { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; cursor:pointer; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.07); color:#fff; }
  .app-nav { flex-direction:column; overflow:visible; flex:1; min-width:0; gap:3px; padding:6px 0 14px; }
  .app-nav a { flex-direction:row; gap:12px; font-size:15px; padding:13px 14px; white-space:normal; flex-shrink:0; opacity:.88; }
  .nav-open .app-nav a { animation:navin .38s cubic-bezier(.2,.7,.2,1) both; }
  .app-drawer .side-foot { display:block; padding:14px 8px 20px; }
  .app-drawer .side-foot a { display:flex; align-items:center; gap:10px; padding:11px 14px; opacity:.95; font-size:14.5px; color:var(--room-ink); text-decoration:none; border:1px solid rgba(255,255,255,.16); border-radius:var(--radius-sm); background:rgba(255,255,255,.05); margin-top:8px; }
  .app-main { padding:var(--space-4); max-width:100%; }
  .voucher { flex-direction:column; }
  .voucher .voucher-stub { width:100%; border-inline-start:none; border-top:2px dashed var(--border-strong); flex-direction:row; justify-content:space-between; padding:10px var(--space-4); }
  .voucher .voucher-stub::before, .voucher .voucher-stub::after { inset-inline-start:auto; top:-9px; }
  .voucher .voucher-stub::before { right:16px; }
  .voucher .voucher-stub::after { left:16px; bottom:auto; top:-9px; }
  .stat-hero .stat-actions { margin-inline-start:0; width:100%; }
  .stat-hero .stat-actions .btn { flex:1; }
}

/* sample gallery + settings (2026-09-26) */
.badge-sample { background:var(--accent-bg); color:var(--accent-ink); }
.sample-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:var(--space-4); margin-bottom:var(--space-5); }
.sample-card { display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-3); margin:0; }
.sample-card h3 { font-size:16px; margin:0; }
.sample-card p { color:var(--muted); font-size:13.5px; margin:0; flex:1; }
.setting-row { display:flex; align-items:flex-start; gap:var(--space-3); }
.setting-row input[type=checkbox] { width:20px; height:20px; margin-top:3px; flex:none; }
.setting-row label { font-weight:600; cursor:pointer; }
.setting-row small { display:block; color:var(--muted); font-weight:400; margin-top:4px; }

/* onboarding tour (2026-09-26) — see tour.js */
.tour-overlay { position:fixed; inset:0; z-index:1000; }
.tour-ring { position:fixed; border-radius:14px; box-shadow:0 0 0 9999px rgba(14,42,31,.62); outline:2px solid #E9D8A6; pointer-events:none; transition:all .2s ease; }
.tour-card { position:fixed; width:min(340px, calc(100vw - 16px)); background:var(--paper); border-radius:var(--radius-md); padding:var(--space-4) var(--space-5); box-shadow:var(--shadow-pop); }
.tour-card h3 { margin:2px 0 6px; font-size:16px; }
.tour-card p { margin:0 0 var(--space-4); color:var(--ink-soft); font-size:14px; line-height:1.8; }
.tour-count { font-size:12px; color:var(--faint); }
.tour-actions { display:flex; align-items:center; gap:var(--space-2); justify-content:flex-end; }
.tour-skip { margin-inline-end:auto; background:none; border:0; color:var(--muted); font:inherit; font-size:13px; cursor:pointer; padding:4px; }
@media (prefers-reduced-motion: reduce) { .tour-ring { transition:none; } }

/* ---- report reading view + premium layer (2026-09-26) ---------------------------------------------------
   A soft champagne secondary next to the emerald --room: used only on report chrome, never on status colours. */
:root { --gold:#A88645; --gold-tint:#F7F0DF; --gold-line:#E6D6AE; }
.btn-room { box-shadow:0 1px 0 rgba(255,255,255,.14) inset, 0 8px 18px -8px rgba(14,42,31,.55); }
.btn-room:hover { box-shadow:0 1px 0 rgba(255,255,255,.14) inset, 0 12px 22px -8px rgba(14,42,31,.6); }
.head-actions { display:flex; gap:var(--space-2); flex-wrap:wrap; }
.report-head { align-items:flex-start; }
.rp-tabs { display:flex; gap:4px; padding:4px; background:var(--surface); border-radius:999px; margin:0 0 var(--space-4); max-width:520px; }
.rp-tab { border:0; background:none; font:inherit; font-size:14px; font-weight:600; color:var(--muted); padding:8px 6px; flex:1; text-align:center; border-radius:999px; cursor:pointer; }
.rp-tab.is-active { background:var(--paper); color:var(--room); box-shadow:0 1px 3px rgba(23,25,28,.12); }
.rp-pane { max-width:none; }
.rp-hint { color:var(--muted); font-size:13.5px; margin:0 0 var(--space-3); }
.rp-card { background:var(--paper); border:1px solid var(--border); border-inline-start:3px solid var(--gold-line); border-radius:var(--radius-lg); padding:var(--space-5); margin-bottom:var(--space-4); box-shadow:var(--shadow-card); }
.rp-title { display:flex; align-items:center; gap:var(--space-3); font-size:18px; margin:0 0 var(--space-4); color:var(--room-deep); }
.rp-n { flex:none; width:10px; height:10px; border-radius:50%; background:var(--gold); box-shadow:0 0 0 4px var(--gold-tint); }
.rp-h { font-size:15px; margin:var(--space-4) 0 var(--space-2); color:var(--room); }
.rp-p { margin:0 0 var(--space-3); line-height:2; color:var(--ink-soft); font-size:14.5px; overflow-wrap:anywhere; }
.rp-note { margin:var(--space-3) 0; padding:var(--space-3) var(--space-4); background:var(--surface); border-radius:var(--radius-sm); color:var(--muted); font-size:13px; line-height:1.9; }
.rp-note i { font-style:normal; }
.rp-tip { margin:var(--space-3) 0; padding:var(--space-3) var(--space-4); background:var(--gold-tint); border:1px solid var(--gold-line); border-radius:var(--radius-sm); font-size:14px; line-height:1.9; }
.rp-list { list-style:none; margin:0 0 var(--space-3); padding:0; }
.rp-list li { display:flex; gap:var(--space-3); padding:8px 0; border-bottom:1px dashed var(--border); font-size:14px; line-height:1.9; overflow-wrap:anywhere; }
.rp-list li:last-child { border-bottom:0; }
.rp-list small { display:block; color:var(--muted); font-size:12.5px; }
.rp-mark { flex:none; color:var(--gold); }
.rp-p i, .rp-list i { font-style:normal; color:var(--muted); }
@media print {
  .app-side, .head-actions, .rp-tabs, .alert { display:none !important; }
  .app-main { padding:0 !important; margin:0 !important; }
  .rp-card { box-shadow:none; break-inside:avoid; }
  body { background:#fff; }
}
.rp-h-sub { font-size:13.5px; color:var(--gold); margin-top:var(--space-3); }
.rp-p bdi, .rp-list bdi { unicode-bidi:isolate; }


/* ---- سازمان (HR): اعضا، واحدها، تیم — 2026-09-27 -------------------------------------------------- */
.tbl-wrap { overflow-x:auto; }
.tbl { width:100%; border-collapse:collapse; font-size:14px; }
.tbl th { text-align:right; font-size:12.5px; color:var(--muted); font-weight:600; padding:10px 12px; border-bottom:1px solid var(--border-strong); white-space:nowrap; }
.tbl td { padding:12px; border-bottom:1px solid var(--border); vertical-align:top; }
.tbl tr:hover td { background:var(--paper-warm); }
.tbl .cell-name a { font-weight:600; color:var(--ink); text-decoration:none; }
.tbl .cell-name a:hover { color:var(--room); }
.tbl .sub { font-size:12.5px; color:var(--muted); }
.tbl .num { text-align:center; white-space:nowrap; }
.badge-ok { background:var(--mint-bg); color:var(--mint-ink); }
.badge-warn { background:var(--accent-bg); color:var(--accent-ink); }
.badge-bad { background:var(--danger-bg); color:var(--danger-ink); }
.badge-mute { background:var(--surface); color:var(--muted); }
.kpi-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:14px; margin-bottom:var(--space-4); }
.kpi { background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-sm); padding:16px 18px; }
.kpi b { display:block; font-family:'Estedad','Vazirmatn',sans-serif; font-size:28px; line-height:1.2; }
.kpi span { font-size:12.5px; color:var(--muted); }
.bar { height:8px; border-radius:999px; background:var(--surface); overflow:hidden; min-width:90px; }
.bar > i { display:block; height:100%; background:var(--room); }
.filters { display:flex; gap:10px; flex-wrap:wrap; align-items:end; margin-bottom:var(--space-4); }
.filters .field { margin:0; }
.bulkbar { position:sticky; bottom:0; background:var(--paper); border:1px solid var(--border-strong); border-radius:var(--radius-sm); padding:12px 14px; display:flex; gap:10px; flex-wrap:wrap; align-items:end; margin-top:14px; box-shadow:0 -6px 20px rgba(0,0,0,.05); }
.bulkbar .field { margin:0; }
.bulkbar .grow { flex:1; min-width:180px; }
.inline-form { display:inline; }
.consent-steps { margin:0; padding-inline-start:20px; color:var(--ink-soft); font-size:13.5px; line-height:1.9; }
details.card > summary { cursor:pointer; font-weight:600; list-style:none; }
details.card > summary::-webkit-details-marker { display:none; }
.grid-2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; }

/* ---------------------------------------------------------------- «ارجاع سریع» (2026-09-30) */
.step-title { display:flex; align-items:center; gap:var(--space-2); font-weight:700; font-size:15px; margin:var(--space-5) 0 var(--space-3); color:var(--room-deep); }
.step-title:first-of-type { margin-top:0; }
.step-n { flex:none; width:24px; height:24px; border-radius:50%; background:var(--room); color:var(--room-ink); display:inline-flex; align-items:center; justify-content:center; font-size:13px; }
.inv-grid { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:var(--space-6); align-items:start; }
.inv-side { position:sticky; top:var(--space-5); display:flex; flex-direction:column; gap:var(--space-2); background:var(--surface); border-radius:var(--radius-md); padding:var(--space-4); }
.inv-side .step-title { margin-top:0; }
.inv-fields { max-width:none; }
.tool-cards { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:var(--space-3); max-width:none; }
.tool-card { position:relative; display:block; cursor:pointer; }
.tool-card input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.tool-card-body { position:relative; display:flex; flex-direction:column; gap:6px; height:100%; padding:var(--space-4) var(--space-4) var(--space-3); border:1px solid var(--border); border-radius:var(--radius-md); background:var(--paper); transition:border-color .18s, box-shadow .18s, background .18s, transform .18s; }
.tool-card-body::after { content:''; position:absolute; top:14px; left:14px; width:18px; height:18px; border-radius:50%; border:1.5px solid var(--border-strong); background:#fff center/10px no-repeat; transition:all .18s; }
.tool-card:hover .tool-card-body { border-color:var(--room); transform:translateY(-1px); box-shadow:0 4px 14px rgba(0,0,0,.05); }
.tool-card input:focus-visible + .tool-card-body { outline:2.5px solid var(--room); outline-offset:2px; }
.tool-card input:checked + .tool-card-body { border-color:var(--room); background:var(--room-tint); box-shadow:0 0 0 1px var(--room); }
.tool-card input:checked + .tool-card-body::after { border-color:var(--room); background-color:var(--room); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 5.3l2.2 2.2L8 3' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.tool-card-name { font-family:'Estedad','Vazirmatn',sans-serif; font-weight:700; font-size:21px; letter-spacing:.02em; color:var(--room-deep); direction:ltr; text-align:right; }
.tool-card-sub { font-size:12.5px; color:var(--muted); line-height:1.7; flex:1; }
.tool-card-cost { align-self:flex-start; margin-top:4px; padding-top:8px; border-top:1px solid var(--border); width:100%; font-size:12px; font-weight:600; color:#8A6D2B; }
.tool-card input:checked + .tool-card-body .tool-card-cost { border-top-color:var(--gold-line); }
.couple-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-4); }
.sms-preview { display:flex; flex-direction:column; gap:var(--space-3); margin-bottom:var(--space-4); }
.sms-bubble { background:var(--surface); border-radius:var(--radius-md); padding:var(--space-3) var(--space-4); border:1px dashed var(--border-strong); }
.sms-to { font-size:12px; color:var(--muted); margin-bottom:4px; }
.sms-text { font-size:14px; line-height:2; white-space:pre-line; color:var(--ink-soft); overflow-wrap:anywhere; }
.sent-card.is-ok { border-color:var(--room); background:var(--room-tint); }
.sent-card.is-warn { border-color:#D9A441; background:var(--gold-tint); }
.sent-card .card-head h2 { display:flex; align-items:center; gap:6px; }
@media (max-width:960px) {
  .inv-grid { grid-template-columns:1fr; }
  .inv-side { position:static; }
}
@media (max-width:640px) {
  .tool-cards { grid-template-columns:1fr; }
  .tool-card-body { flex-direction:row; align-items:center; gap:var(--space-3); padding:var(--space-3) var(--space-4); }
  .tool-card-body::after { top:50%; margin-top:-9px; }
  .tool-card-name { font-size:18px; min-width:64px; }
  .tool-card-sub { flex:1; }
  .tool-card-cost { width:auto; margin:0; padding:0; border:0; margin-inline-end:30px; }
  .tool-card input:checked + .tool-card-body .tool-card-cost { border:0; }
  .couple-grid { grid-template-columns:1fr; }
}

/* full case report (pro/casepages.py): use the whole content width -- pro's normal 980px reading column and the panel's
   own 1080px cap on .cx both left ~20% of a wide screen empty */
.app-main.case-scope { max-width:none; }
.app-main.case-scope .cx { max-width:none; }

/* pro's global form/heading rules must not reach into the panel's report markup (a bare <input type=checkbox> in the NEO
   checklist was stretched into a 100%-wide 48px box; headings switch to the panel's own body font) */
.case-scope input[type=checkbox], .case-scope input[type=radio] {
  width:auto; min-height:0; padding:0; border:revert; border-radius:revert; background:revert; box-shadow:none; font-size:inherit;
}
.case-scope input:not([type=checkbox]):not([type=radio]), .case-scope select { min-height:0; font-size:inherit; }
.case-scope h1, .case-scope h2, .case-scope h3, .case-scope h4 { font-family:inherit; letter-spacing:normal; }

/* ---------------------------------------------------------------- wallet (2026-09-30)
   One accent (emerald) with the panel's champagne gold as the single highlight, the panel's own radius scale
   (12 / 18 / 26) and its voucher notch motif. Variety comes from scale: a 96px balance, 52px credit counts on the
   packages, a raised featured package, small quiet metadata. */
.wl-top { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4) var(--space-6); flex-wrap:wrap; margin-bottom:var(--space-2); padding:var(--space-4) var(--space-5); background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-md); }
.wl-balance { display:flex; align-items:baseline; gap:var(--space-4); flex-wrap:wrap; min-width:0; }
.wl-balance__figure { display:flex; align-items:baseline; gap:var(--space-2); }
.wl-balance__figure b { font-family:'Estedad',sans-serif; font-size:44px; line-height:1; font-weight:800; font-variant-numeric:tabular-nums; color:var(--room-deep); }
.wl-balance__figure span { font-size:14px; color:var(--muted); }
.wl-balance__buys { margin:0; font-size:13.5px; color:var(--muted); }
.wl-balance__buys b { color:var(--ink); }
.wl-costs { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:var(--space-2); }
.wl-costs li { font-size:13px; color:var(--ink-soft); background:var(--surface); border-radius:999px; padding:5px 14px; }
.wl-costs li b { font-family:'Estedad',sans-serif; font-size:15px; color:var(--room); margin-inline-start:4px; }
.wl-cost-kind { color:var(--muted); }

.wl-section-head { margin:var(--space-5) 0 var(--space-4); }
.wl-section-head h2 { font-size:24px; margin:0 0 2px; }
.wl-section-head p { margin:0; color:var(--muted); font-size:14px; }

.wl-grid { display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:var(--space-4); align-items:end; padding-top:var(--space-3); }
.wl-pack {
  position:relative; display:grid; gap:10px; background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-md);
  padding:var(--space-5); box-shadow:var(--shadow-card);
  transition:transform .28s cubic-bezier(.16,1,.3,1), box-shadow .28s cubic-bezier(.16,1,.3,1), border-color .2s;
}
.wl-pack:hover { transform:translateY(-3px); border-color:var(--border-strong); box-shadow:0 18px 34px -18px rgba(23,25,28,.22); }
.wl-pack__name { font-size:14px; font-weight:700; color:var(--ink-soft); }
.wl-pack__count { display:flex; align-items:baseline; gap:8px; }
.wl-pack__count b { font-family:'Estedad',sans-serif; font-size:52px; line-height:1; font-weight:800; font-variant-numeric:tabular-nums; color:var(--room-deep); letter-spacing:-.02em; }
.wl-pack__count span { font-size:14px; color:var(--muted); }
.wl-pack__price { font-family:'Estedad',sans-serif; font-size:20px; font-weight:700; font-variant-numeric:tabular-nums; }
.wl-pack__price small { font-family:inherit; font-size:12px; font-weight:400; color:var(--muted); margin-inline-start:5px; }
.wl-pack__meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; font-size:12.5px; color:var(--muted); min-height:54px; align-content:flex-start; margin-bottom:var(--space-2); }
.wl-pack__save { background:var(--room-tint); color:var(--room); font-weight:700; border-radius:999px; padding:2px 10px; }

.wl-pack.is-featured {
  background:linear-gradient(160deg, var(--room-deep), var(--room)); border-color:#3a6a52; color:var(--room-ink);
  padding:calc(var(--space-5) + 14px) var(--space-5) calc(var(--space-5) + 6px); box-shadow:0 30px 46px -26px rgba(14,42,31,.7);
}
.wl-pack.is-featured:hover { border-color:var(--gold); box-shadow:0 34px 50px -24px rgba(14,42,31,.75); }
.wl-pack.is-featured .wl-pack__name { color:rgba(234,243,238,.8); }
.wl-pack.is-featured .wl-pack__count b { color:#fff; font-size:68px; }
.wl-pack.is-featured .wl-pack__count span, .wl-pack.is-featured .wl-pack__price small, .wl-pack.is-featured .wl-pack__meta { color:rgba(234,243,238,.72); }
.wl-pack.is-featured .wl-pack__price { color:#fff; font-size:22px; }
.wl-pack.is-featured .wl-pack__save { background:var(--gold-tint); color:#5C4519; }
.wl-pack__flag { position:absolute; top:-13px; inset-inline-start:var(--space-5); background:var(--gold-tint); color:#5C4519; border:1px solid var(--gold-line); border-radius:999px; padding:3px 14px; font-size:12px; font-weight:700; }
.btn-gold { background:#EBD9A8; color:#1F2A1F; box-shadow:0 8px 18px -10px rgba(0,0,0,.5); }
.btn-gold:hover { opacity:1; background:#F2E4BC; }

.wl-ledger { margin-top:var(--space-4); }
.wl-tx { list-style:none; margin:0; padding:0; display:grid; gap:var(--space-2); }
.wl-tx__row { display:grid; grid-template-columns:96px minmax(0,1fr) auto; align-items:center; gap:var(--space-4); background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-sm); padding:var(--space-3) var(--space-4); }
.wl-tx__delta { font-family:'Estedad',sans-serif; font-size:26px; font-weight:800; font-variant-numeric:tabular-nums; color:var(--ink-soft); direction:ltr; text-align:right; }
.wl-tx--in .wl-tx__delta { color:var(--room); }
.wl-tx__what { display:grid; gap:1px; min-width:0; }
.wl-tx__what b { font-size:14.5px; }
.wl-tx__what small { color:var(--muted); font-size:12.5px; overflow-wrap:anywhere; }
.wl-tx__bal { display:grid; text-align:center; font-family:'Estedad',sans-serif; font-weight:700; font-size:17px; font-variant-numeric:tabular-nums; }
.wl-tx__bal small { font-family:'Vazirmatn',sans-serif; font-weight:400; font-size:11px; color:var(--faint); }

@media (prefers-reduced-motion:no-preference) {
  .wl-pack { animation:wl-rise .55s cubic-bezier(.16,1,.3,1) both; animation-delay:calc(var(--i, 0) * 70ms); }
  @keyframes wl-rise { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
}
@media (prefers-reduced-motion:reduce) { .wl-pack, .wl-pack:hover { transition:none; animation:none; transform:none; } }

@media (max-width:900px) {
}
@media (max-width:1180px) {
  .wl-grid { grid-template-columns:1fr 1fr; align-items:stretch; }
  .wl-pack.is-featured { grid-column:1 / -1; order:-1; }
}
@media (max-width:520px) {
  .wl-grid { grid-template-columns:1fr; }
  .wl-tx__row { grid-template-columns:72px minmax(0,1fr) auto; gap:var(--space-3); }
  .wl-tx__delta { font-size:22px; }
}

/* the panel uses the whole content width (was a 980px column that left the left side empty); forms keep a readable width */
.page-head .lede { max-width:80ch; }
.app-main > form.card { max-width:none; }

.wl-note { margin:var(--space-2) 0 0; padding:var(--space-3) var(--space-4); background:var(--gold-tint); border:1px solid var(--gold-line); border-radius:var(--radius-sm); font-size:13px; line-height:1.9; color:#4B3A15; }
.wl-note b { color:#2F2410; margin-inline-end:4px; }

/* ---------------------------------------------------------------- sample gallery (2026-09-30)
   Light and minimal: white cards, each test keeps its OWN brand colour (the one in its logo) only as a thin top line, the
   acronym and the button outline. Same column order in both rows (NEO, MBTI, MMPI) so single vs couple lines up. */
.sp-group { margin-bottom:var(--space-6); }
.sp-group h2 { font-size:22px; margin:0 0 var(--space-4); }
.sp-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--space-4); }
.sp-card { --tone:#555; --tone-ink:#333; display:flex; flex-direction:column; gap:var(--space-3); background:var(--paper); border:1px solid var(--border); border-top:3px solid var(--tone); border-radius:var(--radius-md); padding:var(--space-5); transition:transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s cubic-bezier(.16,1,.3,1), border-color .2s; }
.sp-card:hover { transform:translateY(-2px); border-color:var(--border-strong); border-top-color:var(--tone); box-shadow:0 16px 30px -22px rgba(23,25,28,.35); }
.sp-card--neo { --tone:#7A4AA8; --tone-ink:#5B2F86; }
.sp-card--mbti { --tone:#2C6199; --tone-ink:#1F4C7C; }
.sp-card--mmpi { --tone:#E48420; --tone-ink:#A85A0B; }
.sp-card--schema { --tone:#2F7A55; --tone-ink:#1F5A3E; }
.sp-head { display:flex; align-items:center; gap:var(--space-4); }
.sp-logo { width:84px; height:84px; flex:none; border-radius:var(--radius-sm); object-fit:cover; background:#fff; }
.sp-title { min-width:0; }
.sp-code { font-family:'Estedad',sans-serif; font-weight:800; font-size:40px; line-height:1; letter-spacing:-.01em; color:var(--tone-ink); text-align:right; }
.sp-name { margin-top:6px; font-size:13.5px; color:var(--muted); }
.sp-kind { display:flex; align-items:center; gap:var(--space-2); margin:0; font-size:12.5px; font-weight:700; color:var(--ink-soft); }
.sp-mark { display:inline-flex; direction:ltr; }
.sp-mark i { width:14px; height:14px; border-radius:50%; border:2px solid var(--tone); background:transparent; }
.sp-mark.is-pair i + i { margin-left:-6px; background:var(--tone); }
.sp-blurb { margin:0; flex:1; font-size:13.5px; line-height:2; color:var(--ink-soft); }
.sp-btn { align-self:flex-start; display:inline-flex; align-items:center; min-height:40px; padding:0 var(--space-5); border-radius:999px; border:1.5px solid var(--tone); color:var(--tone-ink); font-weight:600; font-size:14px; text-decoration:none; transition:background .2s, color .2s; }
.sp-btn:hover { background:var(--tone); color:#fff; }
.sp-btn:active { transform:scale(.98); }
.sp-card--mmpi .sp-btn:hover { color:#1B1F24; }

@media (prefers-reduced-motion:reduce) { .sp-card, .sp-card:hover, .sp-btn { transition:none; transform:none; } }
@media (max-width:900px) { .sp-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .sp-grid { grid-template-columns:1fr; } }

/* ---------------------------------------------------------------- «مراجعین من» (2026-09-30)
   A working list: filter tabs with counts, live search, one row per referral where the person, the test and the status
   are each readable at a glance (avatar tinted by test, chip colour = state). Filtering is client-side. */
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.cl-bar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--space-3) var(--space-4); margin-bottom:var(--space-2); }
.cl-tabs { display:inline-flex; gap:4px; padding:4px; background:var(--surface); border-radius:999px; flex-wrap:wrap; }
.cl-tab { border:0; background:none; font:inherit; font-size:13.5px; font-weight:600; color:var(--muted); padding:8px 16px; border-radius:999px; cursor:pointer; display:inline-flex; align-items:center; gap:8px; }
.cl-tab b { font-family:'Estedad',sans-serif; font-size:12.5px; background:var(--paper); color:var(--ink-soft); border-radius:999px; padding:1px 8px; min-width:24px; text-align:center; }
.cl-tab.is-on { background:var(--paper); color:var(--room); box-shadow:0 1px 3px rgba(23,25,28,.12); }
.cl-tab.is-on b { background:var(--room); color:var(--room-ink); }
.cl-tools { display:flex; gap:var(--space-2); flex-wrap:wrap; flex:1 1 320px; justify-content:flex-end; }
.cl-search { flex:1 1 240px; max-width:420px; }
.cl-tools input[type=search], .cl-tools select { min-height:44px; padding:0 var(--space-4); border-radius:999px; font-size:14px; }
.cl-tools select { width:auto; min-width:150px; }
.cl-count { min-height:22px; margin:0 0 var(--space-2); font-size:12.5px; color:var(--muted); }

.cl-list { display:grid; gap:var(--space-2); }
.cl-row { display:grid; grid-template-columns:44px minmax(0,1.5fr) 58px minmax(0,1.2fr) 330px; align-items:center; gap:var(--space-4); background:var(--paper); border:1px solid var(--border); border-inline-start:3px solid var(--border-strong); border-radius:var(--radius-sm); padding:var(--space-3) var(--space-4); transition:box-shadow .2s, border-color .2s; }
.cl-row[hidden] { display:none; }
.cl-row:hover { box-shadow:0 10px 22px -16px rgba(23,25,28,.3); border-color:var(--border-strong); }
.cl-row--waiting { border-inline-start-color:#E0A27E; }
.cl-row--opened { border-inline-start-color:#6C8FC0; }
.cl-row--completed { border-inline-start-color:var(--room); }
.cl-row--declined, .cl-row--cancelled, .cl-row--expired { border-inline-start-color:var(--border-strong); }
.cl-row--declined .cl-who, .cl-row--cancelled .cl-who, .cl-row--expired .cl-who { opacity:.72; }

.cl-avatar { width:44px; height:44px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-family:'Estedad',sans-serif; font-weight:700; font-size:18px; }
.cl-tone--bigfive { background:#F0E8F7; color:#5B2F86; }
.cl-tone--typemap { background:#E6EEF7; color:#1F4C7C; }
.cl-tone--mindprofile { background:#FCEBD8; color:#A85A0B; }
.cl-tone--schema { background:#E3F1EA; color:#1F5A3E; }
.schema-ack { margin:var(--space-3) 0 var(--space-4); padding:14px 16px; border:1px solid var(--gold-line); border-radius:12px; background:var(--gold-tint); }
.schema-ack[hidden] { display:none; }
.schema-ack-terms summary { cursor:pointer; font-weight:700; font-size:14px; color:#5C4519; }
.schema-ack-terms p, .schema-ack-terms li { font-size:13px; line-height:1.9; color:var(--muted); margin:6px 0 0; }
.schema-ack-terms ul { margin:6px 0 0; padding-inline-start:20px; }
.schema-ack-check { display:flex; gap:10px; align-items:flex-start; margin-top:12px; font-size:13.5px; line-height:1.9; cursor:pointer; }
.schema-ack-check input { margin-top:6px; flex:none; }
.cl-who { min-width:0; }
.cl-name { font-weight:700; font-size:15px; display:flex; align-items:center; gap:var(--space-2); overflow-wrap:anywhere; }
.cl-pair { font-size:11px; font-weight:700; padding:1px 8px; border-radius:999px; border:1px solid var(--gold-line); background:var(--gold-tint); color:#5C4519; }
.cl-meta { margin-top:2px; font-size:12.5px; color:var(--muted); }
.cl-sep { display:inline-block; width:3px; height:3px; border-radius:50%; background:var(--faint); margin:0 8px; vertical-align:middle; }
.cl-test { font-family:'Estedad',sans-serif; font-weight:800; font-size:12.5px; text-align:center; border-radius:8px; padding:5px 0; direction:ltr; }
.cl-state { display:grid; gap:3px; justify-items:start; min-width:0; }
.cl-chip { font-size:12.5px; font-weight:700; padding:3px 12px; border-radius:999px; background:var(--surface); color:var(--muted); }
.cl-chip--waiting { background:var(--accent-bg); color:var(--accent-ink); }
.cl-chip--opened { background:#E6EDF7; color:#1E3A5F; }
.cl-chip--completed { background:var(--mint-bg); color:var(--mint-ink); }
.cl-chip--declined { background:var(--danger-bg); color:var(--danger-ink); }
.cl-hint { font-size:12px; color:var(--muted); }
.cl-actions { display:flex; flex-wrap:wrap; gap:6px; justify-content:flex-end; align-items:center; }
.cl-actions form { margin:0; }
.cl-btn { font:inherit; font-size:13px; font-weight:600; min-height:36px; padding:0 14px; border-radius:999px; border:1.5px solid var(--border-strong); background:var(--paper); color:var(--ink-soft); cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; transition:background .15s, border-color .15s; }
.cl-btn:hover { border-color:var(--room); color:var(--room); }
.cl-btn:active { transform:scale(.98); }
.cl-btn--main { background:var(--room); border-color:var(--room); color:var(--room-ink); }
.cl-btn--main:hover { background:var(--room-deep); color:var(--room-ink); }
.cl-btn--danger:hover { border-color:var(--danger); color:var(--danger); }
.cl-note { font-size:12px; color:var(--muted); }
.cl-empty { text-align:center; color:var(--muted); padding:var(--space-6) 0; display:grid; gap:var(--space-3); justify-items:center; }
.cl-empty[hidden] { display:none; }

@media (max-width:1100px) { .cl-row { grid-template-columns:44px minmax(0,1fr) 58px; } .cl-state { grid-column:2 / 4; grid-row:2; } .cl-actions { grid-column:1 / -1; justify-content:flex-start; } }
@media (max-width:560px) { .cl-tools { justify-content:stretch; } .cl-search { max-width:none; } .cl-tools select { flex:1; } }
@media (prefers-reduced-motion:reduce) { .cl-row, .cl-btn { transition:none; } }

/* ---------------------------------------------------------------- smart dashboard (2026-10-01) */
.qi { padding:var(--space-5) var(--space-6); transition:opacity .5s ease, transform .5s ease; }
.qi--big { background:linear-gradient(160deg, var(--paper) 0%, var(--room-tint) 100%); border-color:var(--gold-line); padding:var(--space-6); }
.qi-head { display:flex; justify-content:space-between; align-items:flex-start; gap:var(--space-3); margin-bottom:var(--space-4); }
.qi-head h2 { font-size:19px; margin:0 0 2px; }
.qi--big .qi-head h2 { font-size:23px; }
.qi-head .muted { margin:0; }
.qi-head .hint { color:var(--muted); font-size:13px; white-space:nowrap; }
.qi-tools { display:flex; gap:var(--space-2); flex-wrap:wrap; margin-bottom:var(--space-3); }
.qi-chip { position:relative; cursor:pointer; flex:0 1 auto; }
.qi--big .qi-chip { flex:1 1 180px; }
.qi-chip input { position:absolute; opacity:0; inset:0; margin:0; min-height:0; cursor:pointer; }
.qi-chip-body { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:9px 16px; border:1.5px solid var(--border-strong); border-radius:999px; background:var(--paper); transition:border-color .15s, background .15s, box-shadow .15s; }
.qi--big .qi-chip-body { flex-direction:column; align-items:flex-start; gap:2px; border-radius:var(--radius-md); padding:12px 16px; }
.qi-chip-body b { font-family:'Estedad',sans-serif; font-size:16px; color:var(--room-deep); }
.qi-chip-body small { color:var(--muted); font-size:12px; }
.qi-chip-body i { font-style:normal; font-size:11.5px; font-weight:600; color:#6B531F; background:var(--gold-tint); border:1px solid var(--gold-line); border-radius:999px; padding:1px 9px; }
.qi-chip:hover .qi-chip-body { border-color:var(--room); }
.qi-chip input:focus-visible + .qi-chip-body { outline:2.5px solid var(--room); outline-offset:2px; }
.qi-chip input:checked + .qi-chip-body { border-color:var(--room); background:var(--room-tint); box-shadow:0 0 0 3px var(--gold-line); }
.qi-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.8fr) auto; gap:var(--space-2); align-items:stretch; }
.qi-field input { height:100%; }
.qi-send { white-space:nowrap; }
.qi-msg { margin-top:var(--space-3); font-size:13.5px; padding:9px 14px; border-radius:var(--radius-sm); }
.qi-msg.is-err { background:var(--danger-bg); color:var(--danger-ink); }
.qi-done { text-align:center; padding:var(--space-4) 0 var(--space-2); animation:qi-pop .35s cubic-bezier(.16,1,.3,1); }
.qi-done h3 { margin:6px 0 2px; font-size:18px; }
.qi-done .muted { margin:0 0 var(--space-3); }
.qi-done-mark { color:var(--mint-ink); }
.qi-done-actions { display:flex; gap:var(--space-2); justify-content:center; flex-wrap:wrap; }
@keyframes qi-pop { from { opacity:0; transform:translateY(8px) scale(.98); } to { opacity:1; transform:none; } }
.qi-balance { display:flex; flex-direction:column; align-items:flex-end; gap:0; background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-md); padding:8px 18px; box-shadow:var(--shadow-card); }
.qi-balance span { color:var(--muted); font-size:12px; }
.qi-balance b { font-family:'Estedad',sans-serif; font-size:26px; line-height:1.2; font-variant-numeric:tabular-nums; }

#mz-welcome { transition:opacity .6s ease, transform .6s ease; }
#mz-welcome.is-leaving > :not(.qi) { opacity:0; transform:translateY(10px); pointer-events:none; transition:opacity .6s ease, transform .6s ease; }
.wc-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-3); margin:0 0 var(--space-4); }
.wc-step { background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-md); padding:var(--space-4); display:flex; flex-direction:column; gap:4px; }
.wc-step p { margin:0; color:var(--muted); font-size:13px; line-height:1.8; }
.wc-n { width:26px; height:26px; border-radius:50%; background:var(--room); color:var(--room-ink); display:inline-flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; }
.wc-block { margin-bottom:var(--space-4); }
.wc-samples, .wc-packs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-3); }
.wc-sample { display:flex; flex-direction:column; gap:3px; padding:var(--space-4); border-radius:var(--radius-md); text-decoration:none; transition:transform .2s ease, box-shadow .2s ease; }
.wc-sample b { font-family:'Estedad',sans-serif; font-size:22px; }
.wc-sample span { font-size:12.5px; opacity:.85; }
.wc-sample em { font-style:normal; font-size:12.5px; font-weight:600; display:inline-flex; align-items:center; gap:4px; margin-top:6px; }
.wc-sample:hover, .wc-pack:hover { transform:translateY(-2px); box-shadow:0 12px 24px -14px rgba(23,25,28,.35); }
.wc-pack { display:flex; flex-direction:column; gap:2px; padding:var(--space-4); background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-md); text-decoration:none; color:var(--ink); transition:transform .2s ease, box-shadow .2s ease; }
.wc-pack b { font-family:'Estedad',sans-serif; font-size:18px; }
.wc-pack span { font-weight:600; }
.wc-pack small { color:var(--muted); }

.kpis { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:var(--space-3); margin-bottom:var(--space-4); }
.kpi { background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-md); padding:var(--space-4); display:flex; flex-direction:column; gap:2px; box-shadow:var(--shadow-card); }
.kpi span { color:var(--muted); font-size:12.5px; }
.kpi b { font-family:'Estedad',sans-serif; font-size:32px; line-height:1.2; font-variant-numeric:tabular-nums; }
.kpi small { color:var(--faint); font-size:12px; }
.kpi--credit { background:linear-gradient(165deg, var(--room) 0%, var(--room-deep) 100%); border-color:transparent; color:var(--room-ink); }
.kpi--credit span { color:var(--room-ink); opacity:.7; }
.kpi--credit a { color:var(--room-ink); font-size:12.5px; text-decoration:none; display:inline-flex; gap:5px; align-items:center; opacity:.85; margin-top:2px; }
.kpi--credit a:hover { opacity:1; text-decoration:underline; }

.first-top { display:flex; justify-content:space-between; gap:var(--space-4); align-items:flex-start; flex-wrap:wrap; }
.first-top h2 { margin:0 0 2px; font-size:19px; }
.first-top .muted { margin:0; }
.pipe { list-style:none; margin:var(--space-5) 0 var(--space-2); padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--space-2); }
.pipe li { position:relative; display:flex; flex-direction:column; gap:8px; font-size:12.5px; color:var(--faint); }
.pipe li i { display:block; height:6px; border-radius:99px; background:var(--surface); }
.pipe li.is-done { color:var(--room); font-weight:600; }
.pipe li.is-done i { background:var(--room); }
.pipe li.is-now i { background:linear-gradient(90deg, var(--gold-line), var(--surface)); background-size:200% 100%; animation:pipe-pulse 1.8s ease-in-out infinite; }
@keyframes pipe-pulse { 0%,100% { background-position:100% 0; } 50% { background-position:0 0; } }

.nudge { display:flex; align-items:center; gap:var(--space-3); padding:11px 16px; border-radius:var(--radius-md); margin-bottom:var(--space-3); background:var(--accent-bg); color:var(--accent-ink); font-size:13.5px; }
.nudge svg { flex:none; }
.nudge span { flex:1; }
.nudge .btn { color:var(--accent-ink); border-color:var(--accent-ink); }

@media (max-width:860px) {
  .qi, .qi--big { padding:var(--space-4); }
  .qi-row { grid-template-columns:1fr; }
  .wc-steps, .wc-samples, .wc-packs { grid-template-columns:1fr; }
  .pipe { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .qi-head .hint { display:none; }
}
@media (prefers-reduced-motion:reduce) { .qi, #mz-welcome, .wc-sample, .wc-pack { transition:none; } .qi-done, .pipe li.is-now i { animation:none; } }

/* quick-invite: solo / couple switch (2026-10-01) */
.qi-switch { display:inline-flex; gap:2px; padding:3px; background:var(--surface); border-radius:999px; margin-bottom:var(--space-3); }
.qi-switch button { font-family:inherit; font-size:13px; font-weight:600; border:0; background:transparent; color:var(--muted); padding:7px 18px; border-radius:999px; cursor:pointer; transition:background .15s, color .15s, box-shadow .15s; }
.qi-switch button.is-on { background:var(--paper); color:var(--room-deep); box-shadow:0 1px 3px rgba(23,25,28,.12); }
.qi-switch button:focus-visible { outline:2.5px solid var(--room); outline-offset:2px; }
.qi-row--b { margin-top:var(--space-2); }
.qi-send-gap { display:block; }
.qi-note { margin:var(--space-3) 0 0; font-size:12.5px; color:var(--muted); }
@media (max-width:860px) { .qi-send-gap { display:none; } }
.qi--couple .qi-row { grid-template-columns:minmax(0,1fr) minmax(0,.8fr) 280px; }
@media (max-width:860px) { .qi--couple .qi-row { grid-template-columns:1fr; } }
.qi [hidden] { display:none !important; }
@media (max-width:860px) {
  /* phone: one column; the CTA goes after every field (also the second person), not after the first pair */
  #mz-qi-form { display:flex; flex-direction:column; gap:var(--space-2); }
  #mz-qi-form .qi-row { display:contents; }
  #mz-qi-form .qi-switch { align-self:flex-start; order:0; }
  #mz-qi-form .qi-tools { order:1; }
  #mz-qi-form .qi-field { order:2; }
  #mz-qi-form .qi-send { order:3; }
  #mz-qi-form .qi-note { order:4; margin-top:0; }
  #mz-qi-form .qi-msg { order:5; margin-top:0; }
}
@media (max-width:860px) { #mz-qi-form .qi-chip { flex:1 1 100%; } #mz-qi-form .qi-chip-body { width:100%; } }

/* purchase terms ticked before a credit pack can be bought (service/b2b/purchase_terms.py) */
.wl-terms { margin:0 0 var(--space-4); padding:var(--space-4); border:1px solid var(--gold-line); border-radius:var(--radius-sm); background:var(--gold-tint); }
.wl-terms h3 { margin:0 0 var(--space-2); font-size:15px; }
.wl-terms details { margin:0 0 var(--space-2); font-size:13px; line-height:1.9; }
.wl-terms summary { cursor:pointer; font-weight:600; }
.wl-terms ol { margin:var(--space-2) 0 0; padding-inline-start:20px; }
.wl-terms__strong { margin:var(--space-2) 0; font-size:14px; }
.wl-terms__tick { display:flex; gap:10px; align-items:flex-start; margin:8px 0; font-size:13px; line-height:1.9; cursor:pointer; }
.wl-terms__tick input { margin-top:6px; flex-shrink:0; }
.wl-terms__note { margin:0 0 var(--space-4); font-size:13px; line-height:1.9; color:var(--muted); }
.wl-value { margin:0 0 var(--space-2); font-size:14.5px; line-height:1.9; color:var(--ink-soft); font-weight:600; }
.wl-pack__cost { font-size:12.5px; line-height:1.8; color:var(--muted); margin-bottom:var(--space-2); }
.wl-pack.is-featured .wl-pack__cost { color:rgba(234,243,238,.72); }
.wl-contact { margin:var(--space-4) 0 0; font-size:13.5px; line-height:1.9; color:var(--muted); }
.wl-grid--many { grid-template-columns:repeat(3, minmax(0, 1fr)); align-items:stretch; }
.wl-section-head--sub { margin-top:var(--space-6); }
.wl-grid--sub { grid-template-columns:repeat(3, minmax(0, 1fr)); align-items:stretch; }
.wl-pack--sub { border-color:var(--room-tint); }
.wl-pack__flag--sub { position:absolute; inset-block-start:-11px; inset-inline-start:20px; background:var(--room); color:#fff; font-size:12px; font-weight:700; border-radius:999px; padding:3px 12px; }
.wl-pack__term { font-size:12.5px; line-height:1.8; color:var(--muted); margin:0 0 var(--space-2); }
.wl-pack--contact { align-content:space-between; background:var(--paper); border-style:dashed; }
.wl-contact-title { font-family:'Estedad',sans-serif; font-size:32px; line-height:1.2; color:var(--room-deep); }
.wl-balance__period { margin:var(--space-2) 0 0; font-size:13.5px; line-height:1.9; color:var(--muted); }
.wl-balance__period.is-soon { color:var(--accent-ink); background:var(--accent-bg); border-radius:var(--radius-md); padding:8px 12px; }
@media (max-width:1100px) { .wl-grid--many, .wl-grid--sub { grid-template-columns:1fr 1fr; } }
@media (max-width:640px) { .wl-grid--many, .wl-grid--sub { grid-template-columns:1fr; } }
.wl-pack button[disabled] { opacity:.5; cursor:not-allowed; }


/* ---------------------------------------------------------------- support tickets (docs/B2B-SUPPORT-TICKETS-PLAN.md, phase 2) */
.nav-badge { margin-inline-start:auto; background:var(--accent-bg); color:var(--accent-ink); font-size:11px; font-weight:700; border-radius:999px; min-width:20px; padding:0 7px; text-align:center; line-height:20px; }
.sp-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-3); margin-bottom:var(--space-4); }
.sp-stat { background:var(--paper); border:1px solid var(--border); border-radius:var(--radius-lg); padding:var(--space-4) var(--space-5); }
.sp-stat b { display:block; font-family:'Estedad',sans-serif; font-size:28px; line-height:1.3; }
.sp-stat span { color:var(--muted); font-size:13px; }
.sp-stat.is-hot { background:var(--accent-bg); border-color:transparent; }
.sp-stat.is-hot b, .sp-stat.is-hot span { color:var(--accent-ink); }
.sp-list .cl-tabs { margin-bottom:var(--space-3); }
.sp-list .cl-tab { text-decoration:none; }
.sp-row { display:flex; align-items:center; gap:var(--space-3); padding:var(--space-4) var(--space-2); border-top:1px solid var(--border); color:inherit; text-decoration:none; }
.sp-row:first-of-type { border-top:0; }
.sp-row:hover { background:var(--surface); }
.sp-row-main { flex:1; min-width:0; }
.sp-row-main b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sp-row-main small { color:var(--muted); font-size:12.5px; }
.sp-dot { width:9px; height:9px; border-radius:50%; background:transparent; flex:none; }
.sp-dot.is-new { background:var(--room); }
.sp-empty { text-align:center; padding:var(--space-6) var(--space-4); color:var(--muted); }
.sp-empty p { margin:var(--space-3) 0; }
.sp-step { font-size:16px; margin:var(--space-5) 0 var(--space-3); }
.sp-step:first-of-type { margin-top:0; }
.sp-step small { color:var(--muted); font-weight:400; }
.sp-cats { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-3); }
.sp-cat { position:relative; cursor:pointer; }
.sp-cat input { position:absolute; opacity:0; inset:0; cursor:pointer; }
.sp-cat span { display:block; border:1.5px solid var(--border); border-radius:var(--radius-md,14px); padding:var(--space-3) var(--space-4); background:var(--paper); }
.sp-cat b { display:block; font-size:14.5px; }
.sp-cat small { color:var(--muted); font-size:12.5px; }
.sp-cat input:checked + span { border-color:var(--room); background:var(--room-tint); }
.sp-cat input:focus-visible + span { outline:2px solid var(--room); outline-offset:2px; }
.sp-field { display:block; margin-bottom:var(--space-3); font-size:14px; font-weight:600; }
.sp-field input, .sp-field textarea, .sp-field select, .sp-reply textarea { display:block; width:100%; margin-top:6px; font:inherit; font-weight:400; border:1px solid var(--border-strong); border-radius:var(--radius-sm); padding:10px 14px; background:var(--paper); color:var(--ink); }
.sp-form .btn { margin-top:var(--space-3); }
.sp-steps { list-style:none; display:flex; margin:0 0 var(--space-5); padding:0; }
.sp-steps li { flex:1; text-align:center; font-size:12.5px; color:var(--muted); }
.sp-steps li::before { content:""; display:block; width:14px; height:14px; border-radius:50%; background:var(--border-strong); margin:0 auto 4px; }
.sp-steps li.is-done::before { background:var(--room); }
.sp-steps li.is-cur { color:var(--ink); font-weight:700; }
.sp-steps li.is-cur::before { background:var(--room); box-shadow:0 0 0 4px var(--room-tint); }
.sp-chat { display:flex; flex-direction:column; gap:var(--space-3); margin-bottom:var(--space-4); }
.sp-msg { max-width:78%; padding:10px 14px; border-radius:16px; font-size:14.5px; }
.sp-msg small { display:block; opacity:.7; font-size:11.5px; margin-top:4px; }
.sp-body { white-space:pre-wrap; overflow-wrap:anywhere; }
.sp-me { align-self:flex-start; background:var(--room); color:var(--room-ink); border-end-start-radius:4px; }
.sp-them { align-self:flex-end; background:var(--surface); border-end-end-radius:4px; }
.sp-sys { align-self:center; max-width:100%; text-align:center; color:var(--muted); font-size:12.5px; border:1px dashed var(--border-strong); background:transparent; }
.sp-actions { margin-top:var(--space-2); }
.sp-inline { display:inline-block; margin-top:var(--space-3); }
.sp-rate { margin-top:var(--space-5); padding-top:var(--space-4); border-top:1px solid var(--border); }
.sp-rate h3 { font-size:15px; margin:0 0 var(--space-2); }
.sp-stars button { border:0; background:none; font-size:30px; line-height:1; color:var(--border-strong); cursor:pointer; padding:0 2px; }
.sp-stars button.is-on { color:#D9A400; }
.sp-stars:hover button { color:#D9A400; }
.sp-stars button:hover ~ button { color:var(--border-strong); }
@media (max-width:760px) {
  .sp-cats { grid-template-columns:1fr 1fr; }
  .sp-stats { gap:var(--space-2); }
  .sp-stat { padding:var(--space-3); }
  .sp-stat b { font-size:22px; }
  .sp-stat span { font-size:12px; }
  .sp-msg { max-width:92%; }
}

.sp-suggest { background:var(--room-tint); border-radius:var(--radius-sm); padding:var(--space-3) var(--space-4); margin:var(--space-3) 0; font-size:14px; }
.sp-suggest details { margin-top:var(--space-2); }
.sp-suggest summary { cursor:pointer; font-weight:600; }
.sp-suggest p { margin:6px 0 0; color:var(--ink-soft); }
.sp-files { display:flex; gap:var(--space-2); flex-wrap:wrap; margin-top:var(--space-2); }
.sp-files img { max-width:160px; max-height:120px; border-radius:10px; display:block; border:1px solid var(--border); background:var(--paper); }
.sp-actions { display:flex; gap:var(--space-3); align-items:center; flex-wrap:wrap; }
.sp-actions input[type=file] { font-size:13px; max-width:100%; }

/* ================================================================ پوسته‌ی لاکچری (پنل متخصصان و کلینیک‌ها)
   سبزِ زمردیِ بسیار تیره + برنجِ قدیمی/شامپاینی. هویتِ «B2B جدی و گران‌قیمت»؛ پنل شرکا بنفش‌-طلایی است، این یکی زمردی‌-برنزی.
   فقط متغیرها و چند لایه‌ی تزئینی؛ ساختار و کلاس‌ها دست‌نخورده. */
:root {
  --room:#0F3A2B;
  --room-deep:#061C15;
  --room-tint:#E8F1EC;
  --room-ink:#EEF5F0;
  --brass:#C9A560;
  --brass-light:#EDDCB4;
  --brass-deep:#9A7A3C;
  --brass-tint:#F8F1DF;
  --brass-ink:#5A4210;
}
.app-side {
  background:
    radial-gradient(360px 260px at 92% -4%, rgba(201,165,96,.22), transparent 70%),
    radial-gradient(320px 320px at -12% 108%, rgba(52,150,110,.26), transparent 70%),
    linear-gradient(175deg, var(--room) 0%, var(--room-deep) 100%);
  box-shadow: inset 1px 0 0 rgba(201,165,96,.32);
}
.app-side .brand-mark span, .drawer-brand {
  background:linear-gradient(135deg, var(--brass-light) 0%, var(--brass) 55%, var(--brass-deep) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
}
.app-side .brand-mark small, .drawer-brand small { -webkit-text-fill-color:rgba(238,245,240,.62); color:rgba(238,245,240,.62); }
.app-side .brand-mark img { filter:brightness(0) invert(1) sepia(.5) saturate(2.4) hue-rotate(5deg); opacity:.95; }
.app-nav a { position:relative; }
.app-nav a:hover { background:rgba(201,165,96,.11); }
.app-nav a.active { background:linear-gradient(270deg, rgba(201,165,96,.24), rgba(201,165,96,.05)); color:var(--brass-light); }
.app-nav a.active svg { color:var(--brass); opacity:1; }
.app-nav a.active::before { content:""; position:absolute; inset-block:10px; inset-inline-start:-16px; width:3px; border-radius:3px; background:linear-gradient(180deg, var(--brass-light), var(--brass-deep)); }
.app-side .side-foot { border-top-color:rgba(201,165,96,.24); }
.nav-badge { background:linear-gradient(135deg, var(--brass-light), var(--brass)); color:var(--brass-ink); }

.btn-room { background:linear-gradient(135deg, #1C5A43 0%, var(--room) 55%, var(--room-deep) 100%); box-shadow:0 8px 18px -8px rgba(6,28,21,.7), inset 0 0 0 1px rgba(201,165,96,.4); }
.card { box-shadow:0 1px 2px rgba(6,28,21,.05), 0 14px 34px -18px rgba(15,58,43,.26); }
.kpi { box-shadow:0 1px 2px rgba(6,28,21,.05), 0 12px 28px -16px rgba(15,58,43,.28); }
.auth-card { box-shadow:0 30px 70px -28px rgba(15,58,43,.5), 0 0 0 1px rgba(201,165,96,.28); }
.stat-hero .stat-figure b { background:linear-gradient(135deg, var(--room), #2E8A66); -webkit-background-clip:text; background-clip:text; color:transparent; }
.page-head h1 { letter-spacing:-.01em; }
.page-head::after { content:""; flex-basis:100%; height:2px; margin-top:var(--space-2); border-radius:2px; background:linear-gradient(270deg, var(--brass) 0%, rgba(201,165,96,0) 38%); }

@media (max-width: 860px) {
  .app-side { box-shadow:0 1px 0 rgba(201,165,96,.4), 0 8px 22px rgba(6,28,21,.38); }
  .app-drawer {
    background:
      radial-gradient(320px 220px at 100% 0%, rgba(201,165,96,.22), transparent 70%),
      linear-gradient(175deg, var(--room) 0%, var(--room-deep) 100%);
    box-shadow:-18px 0 48px rgba(3,14,10,.6), inset 1px 0 0 rgba(201,165,96,.32);
  }
  .drawer-head { border-bottom-color:rgba(201,165,96,.26); }
  .app-nav a.active::before { inset-inline-start:-12px; }
  .burger { border-color:rgba(201,165,96,.38); background:rgba(201,165,96,.09); }
  .burger__dot { background:var(--brass-light); }
}

/* برند (مغزتو / لوگو) لینک به داشبورد است */
a.brand-mark { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; transition: opacity .15s; }
a.brand-mark:hover { opacity: .85; }
a.brand-mark:focus-visible, a.drawer-brand:focus-visible { outline: 2px solid rgba(255,255,255,.6); outline-offset: 4px; border-radius: 6px; }
a.drawer-brand { text-decoration: none; }

/* دکمه‌ی خروج از حساب */
.app-side .side-foot a, .app-drawer .side-foot a {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin-top: 10px; padding: 11px 14px; opacity: 1; font-size: 14px; font-weight: 700;
  color: var(--room-ink); text-decoration: none; border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, .07); border: 1px solid var(--brass);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset;
  transition: background .18s, color .18s, border-color .18s, transform .12s;
}
.app-side .side-foot a svg { flex: none; color: var(--brass); transition: color .18s; }
.app-side .side-foot a[href$="/logout"]:hover { background: linear-gradient(135deg, var(--brass-light), var(--brass)); color: #0F3A2B; border-color: var(--brass-light); }
.app-side .side-foot a[href$="/logout"]:hover svg { color: #0F3A2B; }
.app-side .side-foot a:active { transform: scale(.97); }
.app-side .side-foot a:focus-visible { outline: 2px solid var(--brass-light); outline-offset: 2px; }
.app-side .side-foot a[data-tour-start] { border-color: rgba(255, 255, 255, .2); font-weight: 600; }

/* ---- Branded file picker (filepick.js) — RULE: never show the native Browse button ---- */
.fp { position:relative; display:flex; align-items:center; gap:14px; width:100%; min-height:56px; padding:8px 8px 8px 14px; box-sizing:border-box;
  background:var(--paper); border:1.5px dashed var(--border-strong); border-radius:var(--radius-md); transition:border-color .15s, background .15s, box-shadow .15s; }
.fp:hover, .fp.is-drag { border-color:var(--room); background:var(--room-tint); }
.fp:focus-within { border-color:var(--room); box-shadow:0 0 0 3px var(--room-tint); }
.fp.has-file { border-style:solid; border-color:var(--room); background:var(--room-tint); }
.fp-native { position:absolute !important; inset:0; width:100% !important; height:100% !important; min-height:0 !important; opacity:0; cursor:pointer; margin:0; padding:0 !important; border:0 !important; }
.fp-native::file-selector-button { cursor:pointer; }
.fp-btn { flex:none; display:inline-flex; align-items:center; gap:8px; padding:10px 18px; border-radius:999px; font-size:14px; font-weight:700; color:var(--room-ink);
  background:linear-gradient(135deg, var(--room) 0%, var(--room-deep) 100%); box-shadow:0 4px 12px rgba(0,0,0,.16); transition:transform .15s, box-shadow .15s; }
.fp:hover .fp-btn { transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.22); }
.fp-name { flex:1; min-width:0; font-size:13.5px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fp.has-file .fp-name { color:var(--ink); font-weight:600; }

/* ===== چک‌باکس یکدست (مهر با جرقه؛ تیکِ دقیقاً وسط که هنگام زدن از کادر بیرون می‌پرد) ===== */
input[type=checkbox][type=checkbox] {
  --cb-fill: #0F3A2B; --cb-fill2: #1C5A43; --cb-tick: #fff; --cb-bg: #fff; --cb-ring: #C9A560; --cb-light: #EDDCB4; --cb-s: 24px;
  -webkit-appearance: none; appearance: none; position: relative; flex: none; display: inline-block; vertical-align: middle;
  width: var(--cb-s); height: var(--cb-s); min-width: 0; min-height: 0; padding: 0;
  margin: 1px 0 0; margin-top: max(0px, calc((1lh - var(--cb-s)) / 2));
  border: 2px solid var(--cb-ring); border-radius: 50%; background: var(--cb-bg); cursor: pointer;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--cb-ring) 22%, transparent);
  accent-color: var(--cb-fill);
  transition: background .25s, border-color .25s, box-shadow .25s;
}
input[type=checkbox][type=checkbox]:focus-visible { outline: 2px solid var(--cb-ring); outline-offset: 5px; }
input[type=checkbox][type=checkbox]:disabled { opacity: .45; cursor: not-allowed; }
input[type=checkbox][type=checkbox]::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: var(--cb-s); height: var(--cb-s);
  margin: calc(var(--cb-s) / -2) 0 0 calc(var(--cb-s) / -2); background: var(--cb-tick);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 12.6l4.2 4.2L18.5 7.4'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 12.6l4.2 4.2L18.5 7.4'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: 0; pointer-events: none; border: 0; transform: none;
}
input[type=checkbox][type=checkbox]::before {
  content: ""; position: absolute; left: 50%; top: 50%; width: 4px; height: 4px; margin: -2px;
  border-radius: 50%; pointer-events: none; opacity: 0;
}
input[type=checkbox][type=checkbox]:checked { background: linear-gradient(135deg, var(--cb-fill2), var(--cb-fill)); animation: mzcb-ring .7s ease-out; }
input[type=checkbox][type=checkbox]:checked::after { opacity: 1; animation: mzcb-out .65s cubic-bezier(.34, 1.3, .5, 1) both; }
input[type=checkbox][type=checkbox]:checked::before { animation: mzcb-burst .65s ease-out; }
@keyframes mzcb-out { 0% { transform: scale(0); clip-path: inset(0 100% 0 0); } 35% { transform: scale(2.2); clip-path: inset(0 0 0 0); } 100% { transform: scale(1); clip-path: inset(0 0 0 0); } }
@keyframes mzcb-ring { 0% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--cb-ring) 22%, transparent), 0 0 0 0 color-mix(in srgb, var(--cb-ring) 55%, transparent); } 100% { box-shadow: 0 0 0 3px color-mix(in srgb, var(--cb-ring) 22%, transparent), 0 0 0 16px transparent; } }
@keyframes mzcb-burst {
  0% { opacity: 1; box-shadow: 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-ring), 0 0 0 0 var(--cb-light), 0 0 0 0 var(--cb-light); }
  100% { opacity: 0; box-shadow: -26px -4px 0 -1px var(--cb-ring), 26px -4px 0 -1px var(--cb-ring), 0 -27px 0 -1px var(--cb-ring), -16px 20px 0 -1px var(--cb-ring), 16px 20px 0 -1px var(--cb-ring), 0 27px 0 -1px var(--cb-ring), -19px -19px 0 -2px var(--cb-light), 19px -19px 0 -2px var(--cb-light); }
}
@media (prefers-reduced-motion: reduce) { input[type=checkbox][type=checkbox], input[type=checkbox][type=checkbox]::before, input[type=checkbox][type=checkbox]::after { animation: none !important; transition: none !important; } }
