/* ================================================================
   VERTICZ.CSS — Design System & Component Library
   Single source of truth. No inline styles. No duplication.
   ================================================================ */

/* ── 1. DESIGN TOKENS ── */
/* Moved to variables.css (loaded before this file) — do not redefine :root here. */

/* ── 2. BASE ── */
body { font-family:'Inter',sans-serif; line-height:var(--lh-base); letter-spacing:var(--ls-base); }
body.dark-only { background:var(--bg-alt); }

/* Skip-to-content link — visually hidden until keyboard-focused */
.skip-link {
  position: absolute;
  top: -48px;
  left: 0;
  background: var(--lime);
  color: var(--bg);
  padding: var(--sp-10) var(--sp-16);
  font-size:var(--fs-14);
  font-weight:var(--fw-semibold);
  text-decoration: none;
  border-radius: 0 0 var(--br-inner) 0;
  z-index: 99999;
  transition: top var(--t-fast);
}
.skip-link:focus { top: 0; }

/* ── 3. LAYOUT UTILITIES ── */
/* .page-title on nearly every page wraps a raw Bootstrap .row (title +
   action, e.g. "row align-items-center") directly — no .container parent
   to cancel Bootstrap's negative gutter margins (-12px each side from
   --bs-gutter-x:1.5rem), and .page-title itself has no horizontal padding
   either. That pushes the row 12px past the viewport edge on every one of
   these pages, causing a page-wide horizontal scrollbar. These rows are
   simple two-item headers, not real multi-column grids needing gutters. */
.page-title > .row { margin-left: 0; margin-right: 0; }

.vz-flex    { display:flex; }
.vz-col     { flex-direction:column; }
.vz-center  { align-items:center;justify-content:center; }
.vz-between { align-items:center;justify-content:space-between; }
.vz-start   { align-items:flex-start; }
.vz-wrap    { flex-wrap:wrap; }
.vz-flex-1  { flex:1; }
.vz-shrink0 { flex-shrink:0; }

.vz-grid-2  { display:grid;grid-template-columns:repeat(2,1fr); }
.vz-grid-3  { display:grid;grid-template-columns:repeat(3,1fr); }
.vz-grid-4  { display:grid;grid-template-columns:repeat(4,1fr); }
.vz-grid-5  { display:grid;grid-template-columns:repeat(5,1fr); }

.gap-4  { gap:var(--sp-4); }
.gap-5  { gap:var(--sp-4); }
.gap-6  { gap:var(--sp-8); }
.gap-7  { gap:var(--sp-8); }
.gap-8  { gap:var(--sp-8); }
.gap-10 { gap:var(--sp-10); }
.gap-12 { gap:var(--sp-12); }
.gap-14 { gap:var(--sp-14); }
.gap-16 { gap:var(--sp-16); }
.gap-20 { gap:var(--sp-20); }
.gap-24 { gap:var(--sp-24); }
.gap-28 { gap:var(--sp-28); }

/* ── 4. TYPOGRAPHY ── */
.t1 { color:var(--t1); }
.t2 { color:var(--t2); }
.t3 { color:var(--t3); }
.t4 { color:var(--t4); }
.t5 { color:var(--t5); }
.t6 { color:var(--t6); }

.c-lime   { color:var(--lime); }
.c-cyan   { color:var(--cyan); }
.c-purple { color:var(--purple); }
.c-green  { color:var(--green); }
.c-amber  { color:var(--amber); }
.c-orange { color:var(--orange); }
.c-red    { color:var(--red); }

.fw4 { font-weight:var(--fw-regular); }
.fw5 { font-weight:var(--fw-medium); }
.fw6 { font-weight:var(--fw-semibold); }
.fw7 { font-weight:var(--fw-bold); }
.fw8 { font-weight:var(--fw-extrabold); }
.fw9 { font-weight:var(--fw-black); }

.fs10 { font-size:var(--fs-10); }
.fs11 { font-size:var(--fs-12); }
.fs10 { font-size:var(--fs-10); }
.fs11 { font-size:var(--fs-12); }
.fs12 { font-size:var(--fs-12); }
.fs13 { font-size:var(--fs-14); }
.fs14 { font-size:var(--fs-14); }
.fs16 { font-size:var(--fs-16); }
.fs18 { font-size:var(--fs-18); }
.fs20 { font-size:var(--fs-20); }
.fs22 { font-size:var(--fs-22); }
.fs24 { font-size:var(--fs-24); }
.fs26 { font-size:var(--fs-26); }
.fs28 { font-size:var(--fs-28); }
.fs32 { font-size:var(--fs-32); }
.fs34 { font-size:var(--fs-34); }

.uc   { text-transform:uppercase; }
.tc   { text-align:center; }
.tr   { text-align:right; }
.ls1  { /* letter-spacing:1.2px; */ }
.ls2  { /* letter-spacing:1.4px; */ }
.lh15 { /* line-height:1.5; */ }
.lh16 { /* line-height:1.6; */ }
.lh17 { /* line-height:1.7; */ }
.tl   { text-align:left; }
.c-amber-dim { color:var(--amber-a50); }

/* micro-label pattern */
.micro-lbl {
  font-size:var(--fs-12);font-weight:var(--fw-bold);/* letter-spacing:1.2px; */
  text-transform:uppercase;color:var(--t5);
}

/* ── 5. SPACING ── */
.mb4  { margin-bottom:var(--sp-4); }
.mb6  { margin-bottom:var(--sp-8); }
.mb8  { margin-bottom:var(--sp-8); }
.mb10 { margin-bottom:var(--sp-10); }
.mb12 { margin-bottom:var(--sp-12); }
.mb14 { margin-bottom:var(--sp-14); }
.mb16 { margin-bottom:var(--sp-16); }
.mb20 { margin-bottom:var(--sp-20); }
.mb24 { margin-bottom:var(--sp-24); }
.mb28 { margin-bottom:var(--sp-28); }

.mt3  { margin-top:var(--sp-4); }
.mt4  { margin-top:var(--sp-4); }
.mt6  { margin-top:var(--sp-8); }
.mt8  { margin-top:var(--sp-8); }
.mt10 { margin-top:var(--sp-10); }
.mt12 { margin-top:var(--sp-12); }
.mt14 { margin-top:var(--sp-14); }
.mt16 { margin-top:var(--sp-16); }
.mt20 { margin-top:var(--sp-20); }

.p12 { padding:var(--sp-12); }
.p14 { padding:var(--sp-14); }
.p16 { padding:var(--sp-16); }
.p20 { padding:var(--sp-20); }
.p24 { padding:var(--sp-24); }
.px14 { padding-left:var(--sp-14);padding-right:var(--sp-14); }
.py8  { padding-top:var(--sp-8);padding-bottom:var(--sp-8); }

/* ── 6. CARD COMPONENTS ── */
/* Base dark card */
.vz-card {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--br-outer);
  padding:var(--sp-16);
}
.vz-card-md {
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--br-outer);
  padding:var(--sp-20) var(--sp-24);
}
.vz-card-lg {
  background:var(--bg-card);
  border:1px solid var(--border-md);
  border-radius:var(--br-outer);
  padding:var(--sp-24) var(--sp-28);
}
.vz-card-subtle {
  background:var(--bg-subtle);
  border:1px solid var(--border);
  border-radius:var(--br-outer);
  padding:var(--sp-16);
}
.vz-card-glass {
  background:var(--bg-card);
  border:1px solid var(--border-md);
  backdrop-filter:blur(20px);
  border-radius:var(--br-outer);
  padding:var(--sp-40);
}

/* Colored card accents */
.vz-card-lime   { border-color:var(--lime-bd);background:var(--lime-a10); }
.vz-card-cyan   { border-color:var(--cyan-bd);background:var(--cyan-a10); }
.vz-card-purple { border-color:var(--purple-bd);background:var(--purple-a10); }
.vz-card-green  { border-color:var(--green-bd);background:var(--green-a05); }
.vz-card-amber  { border-color:var(--amber-bd);background:var(--amber-a10); }
.vz-card-red    { border-color:var(--red-bd);background:var(--red-a10); }

/* ── 7. BUTTON COMPONENTS ── */
.btn-vz {
  display:inline-flex;align-items:center;justify-content:center;
  gap:var(--sp-8);cursor:pointer;font-family:'Inter',sans-serif;
  font-weight:var(--fw-bold);border:none;transition:all var(--t-default);text-decoration:none;
}
.btn-vz-pill  { border-radius:var(--br-full);padding:var(--sp-12) var(--sp-28);font-size:var(--fs-14); }
.btn-vz-round { border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-20);font-size:var(--fs-14); }
.btn-vz-sm    { border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-14);font-size:var(--fs-12); }

/* Primary gradient */
.btn-vz-primary {
  background:var(--grad);color:var(--bg);border:none;
  border-radius:var(--br-full);padding:var(--sp-12) var(--sp-28);font-size:var(--fs-14);font-weight:var(--fw-bold);
  cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;gap:var(--sp-8);
  text-decoration:none;transition:opacity var(--t-default),transform var(--t-default);
}
.btn-vz-primary:hover { opacity:.9;transform:translateY(-1px);color: var(--bg); }
.btn-vz-primary-sm {
  background:var(--grad);color:var(--bg);border:none;
  border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-20);font-size:var(--fs-14);font-weight:var(--fw-bold);
  cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;gap:var(--sp-8);text-decoration:none;
}

/* Ghost */
.btn-vz-ghost {
  background:var(--bg-card);
  border:1px solid var(--border-md);
  border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-semibold);
  color:var(--t3);cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;gap:var(--sp-8);
  text-decoration:none;transition:all var(--t-default);
}
.btn-vz-ghost:hover { background:var(--border-md);color:var(--t1); }
.btn-vz-ghost-pill {
  background:transparent;border:1px solid var(--border-md);
  border-radius:var(--br-full);padding:var(--sp-12) var(--sp-24);font-size:var(--fs-14);font-weight:var(--fw-semibold);
  color:var(--t3);cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;gap:var(--sp-8);text-decoration:none;
  justify-content: center;
}

/* Secondary (lime-tinted secondary action) */
.btn-vz-secondary {
  background:var(--lime-bg);border:1px solid var(--lime-bd);
  color:var(--lime);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-bold);
  cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;gap:var(--sp-8);transition:all var(--t-default);
}
.btn-vz-secondary:hover { background:var(--lime-a15); }

/* Warning (amber) */
.btn-vz-warning {
  background:var(--amber-bg);border:1px solid var(--amber-bd);
  color:var(--amber);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-bold);
  cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;gap:var(--sp-8);transition:all var(--t-default);
}
.btn-vz-warning:hover { background:var(--amber-bd); }

/* Accent variants */
.btn-vz-lime {
  background:var(--lime-bg);border:1px solid var(--lime-bd);
  color:var(--lime);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-bold);
  cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;gap:var(--sp-8);transition:all var(--t-default);
}
.btn-vz-lime:hover { background:var(--lime-a15); }
.btn-vz-cyan {
  background:var(--cyan-a10);border:1px solid var(--cyan-bd);
  color:var(--cyan);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-bold);
  cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;gap:var(--sp-8);
}
.btn-vz-purple {
  background:var(--purple-a10);border:1px solid var(--purple-bd);
  color:var(--purple);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-bold);
  cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;gap:var(--sp-8);
}

/* Full-width pill (CTA) */
.btn-full-primary {
  width:100%;background:var(--grad);border:none;border-radius:var(--br-full);
  padding:var(--sp-14);font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--bg);cursor:pointer;
  font-family:'Inter',sans-serif;display:flex;align-items:center;
  justify-content:center;gap:var(--sp-8);transition:opacity var(--t-default),transform var(--t-default);
}
.btn-full-primary:hover { opacity:.92;transform:translateY(-1px); }
.btn-full-ghost {
  width:100%;background:var(--bg-mid);border:1px solid var(--border-md);
  border-radius:var(--br-full);padding:var(--sp-14);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t3);
  cursor:pointer;font-family:'Inter',sans-serif;
  display:flex;align-items:center;justify-content:center;gap:var(--sp-8);
}

/* ── 8. BADGE / PILL COMPONENTS ── */
/* Base badge */
.badge {
  display:inline-flex;align-items:center;
  border-radius:var(--br-full);padding:var(--sp-4) var(--sp-10);
  font-size:var(--fs-10);font-weight:var(--fw-bold);
  border:1px solid transparent;
}
.badge-lg { padding:var(--sp-4) var(--sp-16);font-size:var(--fs-12); }
.badge-sm { padding:var(--sp-2) var(--sp-8);font-size:var(--fs-10); }

/* Semantic badge colours */
.badge-lime   { background:var(--lime-bg);border-color:var(--lime-bd);color:var(--lime); }
.badge-cyan   { background:var(--cyan-bg);border-color:var(--cyan-bd);color:var(--cyan); }
.badge-purple { background:var(--purple-bg);border-color:var(--purple-bd);color:var(--purple); }
.badge-green  { background:var(--green-bg);border-color:var(--green-bd);color:var(--green); }
.badge-amber  { background:var(--amber-bg);border-color:var(--amber-bd);color:var(--amber); }
.badge-orange { background:var(--orange-bg);border-color:var(--orange-bd);color:var(--orange); }
.badge-red    { background:var(--red-bg);border-color:var(--red-bd);color:var(--red); }
.badge-ghost  { background:var(--bg-mid);border-color:var(--border-md);color:var(--t4); }

/* Solid grade pills */
.grade-established { background:var(--green);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.grade-managed     { background:var(--amber);color:var(--bg);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.grade-developing  { background:var(--orange);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.grade-high-risk   { background:var(--red);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold); }

/* Inline status badges */
.status-complete  { background:var(--green-bg);color:var(--green);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.status-inprog    { background:var(--cyan-bg);color:var(--cyan);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.status-notstart  { background:var(--bg-mid);color:var(--t4);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.status-pending   { background:var(--amber-bg);color:var(--amber);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }

/* Admin/table badge variants */
.badge-verified   { background:var(--green-bg);border:1px solid var(--green-bd);color:var(--green);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-pending    { background:var(--amber-bg);border:1px solid var(--amber-bd);color:var(--amber);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-rejected   { background:var(--red-bg);border:1px solid var(--red-bd);color:var(--red);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-active     { background:var(--green-bg);border:1px solid var(--green-bd);color:var(--green);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-inactive   { background:var(--bg-mid);border:1px solid var(--border-md);color:var(--t4);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-submitted  { background:var(--lime-a10);border:1px solid var(--lime-a15);color:var(--lime);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-reviewed   { background:var(--purple-bg);border:1px solid var(--purple-bd);color:var(--purple);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-inprog     { background:var(--cyan-bg);border:1px solid var(--cyan-bd);color:var(--cyan);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-overdue    { background:var(--red-bg);border:1px solid var(--red-bd);color:var(--red);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-atrisk     { background:var(--amber-bg);border:1px solid var(--amber-bd);color:var(--amber);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.badge-ontrack    { background:var(--green-bg);border:1px solid var(--green-bd);color:var(--green);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }

/* Plan tier badges */
.plan-badge { border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.plan-foundation { background:var(--green-a05);color:var(--green); }
.plan-enhanced   { background:var(--lime-a10);color:var(--lime); }
.plan-advanced   { background:var(--orange-bg);color:var(--orange); }
.plan-pinnacle   { background:var(--purple-bg);color:var(--purple); }

/* ── 9. ICON CONTAINERS ── */
.vz-icon {
  border-radius:var(--br-outer);display:flex;align-items:center;
  justify-content:center;font-size:var(--fs-18);flex-shrink:0;
}
.vz-icon-sm { width:32px;height:32px;font-size:var(--fs-14);border-radius:var(--br-inner); }
.vz-icon-md { width:40px;height:40px;font-size:var(--fs-16); }
.vz-icon    { width:44px;height:44px;font-size:var(--fs-18); }
.vz-icon-lg { width:52px;height:52px;font-size:var(--fs-22); }

/* Circle icon */
.vz-icon-circle { border-radius:50%; }

/* Icon colour variants */
.vi-lime   { background:var(--lime-bg);color:var(--lime); }
.vi-cyan   { background:var(--cyan-bg);color:var(--cyan); }
.vi-purple { background:var(--purple-bg);color:var(--purple); }
.vi-green  { background:var(--green-bg);color:var(--green); }
.vi-amber  { background:var(--amber-bg);color:var(--amber); }
.vi-orange { background:var(--orange-bg);color:var(--orange); }
.vi-red    { background:var(--red-bg);color:var(--red); }
.vi-ghost  { background:var(--bg-mid);color:var(--t4); }

/* Avatar initials circle */
.vz-avatar {
  border-radius:50%;background:var(--grad);display:flex;
  align-items:center;justify-content:center;
  font-weight:var(--fw-bold);color:var(--bg);flex-shrink:0;
}
.vz-avatar-sm { width:30px;height:30px;font-size:var(--fs-12); }
.vz-avatar-md { width:34px;height:34px;font-size:var(--fs-12); }
.vz-avatar-lg { width:40px;height:40px;font-size:var(--fs-14); }
.vz-avatar-img { object-fit:cover; }

/* ── 10. INFO ROW (key-value pairs) ── */
.vz-info { display:flex;align-items:center;justify-content:space-between;padding:var(--sp-8) 0;border-bottom:1px solid var(--bg-mid); }
.vz-info:last-child { border-bottom:none; }
.vz-info-lbl { font-size:var(--fs-12);color:var(--t4); }
.vz-info-val { font-size:var(--fs-14);color:var(--t2);font-weight:var(--fw-medium); }

/* ── 11. DIVIDER ── */
.vz-divider { border:none;border-top:1px solid var(--border);margin:var(--sp-14) 0; }

/* ── 12. TAGS ── */
.vz-tag { display:inline-flex;align-items:center;border-radius:var(--br-full);padding:var(--sp-4) var(--sp-12);font-size:var(--fs-12);font-weight:var(--fw-bold);border:1px solid transparent; }
.vz-tag-lime   { background:var(--lime-bg);border-color:var(--lime-bd);color:var(--lime); }
.vz-tag-cyan   { background:var(--cyan-bg);border-color:var(--cyan-bd);color:var(--cyan); }
.vz-tag-purple { background:var(--purple-bg);border-color:var(--purple-bd);color:var(--purple); }
.vz-tag-green  { background:var(--green-bg);border-color:var(--green-bd);color:var(--green); }
.vz-tag-orange { background:var(--orange-bg);border-color:var(--orange-bd);color:var(--orange); }
.vz-tag-red    { background:var(--red-bg);border-color:var(--red-bd);color:var(--red); }

/* ── 13. DONUT WIDGET ── */
.vz-donut { position:relative; }
.vz-donut svg { transform:rotate(-90deg); }
.vz-donut-inner { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center; }
.vz-donut-val { font-size:var(--fs-26);font-weight:var(--fw-black);color:var(--t1);/* line-height:1; */ }
.vz-donut-sub { font-size:var(--fs-12);color:var(--t4); }

/* ── 14. PROGRESS BARS ── */
.vz-prog { height:6px;background:var(--border);border-radius:var(--br-inner);overflow:hidden; }
.vz-prog-fill { height:100%;border-radius:var(--br-inner);background:var(--grad); }
.vz-prog-lg { height:8px;background:var(--border);border-radius:var(--br-inner);overflow:hidden; }
.vz-prog-lg-fill { height:100%;border-radius:var(--br-inner);background:var(--grad); }

/* ── 15. TABLES ── */
.vz-table { width:100%;border-collapse:collapse;display:table; }
.vz-table thead { display:table-header-group; }
.vz-table tbody { display:table-row-group; }
.vz-table tbody tr { display:table-row; width:100%; }
.vz-table tbody td { display:table-cell; }
.vz-table th {
  background:var(--bg-mid);
  color:var(--white-a35);font-size:var(--fs-10);font-weight:var(--fw-bold);
  text-transform:uppercase;/* letter-spacing:.7px; */
  padding:var(--sp-10) var(--sp-14);text-align:left;
  border-bottom:1px solid var(--border);
}
.vz-table td {
  padding:var(--sp-14) var(--sp-14);font-size:var(--fs-14);color:var(--t3);
  border-bottom:1px solid var(--bg-card);vertical-align:middle;
}
.vz-table th.tc { text-align:center; }
.vz-table tbody tr:last-child td { border-bottom:none; }
.vz-table tbody tr:hover td { background:var(--bg-subtle); }
.act-icon { font-size:var(--fs-16);cursor:pointer;color:var(--t4);margin-right:var(--sp-8); }

/* Alias for existing usage */
.history-table  { width:100%;border-collapse:collapse; }
.history-table th { background:var(--bg-mid);color:var(--white-a35);font-size:var(--fs-10);font-weight:var(--fw-bold);text-transform:uppercase;/* letter-spacing:.7px; */padding:var(--sp-10) var(--sp-14);text-align:left;border-bottom:1px solid var(--border); }
.history-table td { padding:var(--sp-14) var(--sp-14);font-size:var(--fs-14);color:var(--t3);border-bottom:1px solid var(--bg-card);vertical-align:middle;transition:background var(--t-fast); }
.history-table tbody tr:hover td { background:var(--bg-card); }
.history-table tbody tr:last-child td { border-bottom:none; }

/* Admin table */
.admin-table { width:100%;border-collapse:collapse;background:transparent; }
.admin-table th { color:var(--white-a35);font-size:var(--fs-10);font-weight:var(--fw-bold);text-transform:uppercase;/* letter-spacing:.7px; */padding:var(--sp-12) var(--sp-14);text-align:left;border-bottom:1px solid var(--border);white-space:nowrap; }
.admin-table td { padding:var(--sp-14) var(--sp-14);font-size:var(--fs-14);color:var(--t3);border-bottom:1px solid var(--bg-card);vertical-align:middle; }
.admin-table tbody tr:last-child td { border-bottom:none; }
.admin-table tbody tr:hover td { background:var(--bg-subtle); }

/* ── 16. FORM ELEMENTS ── */
/* x-forms.input/select/textarea fall back to plain .form-control whenever
   no custom inputClass prop is passed — Bootstrap's .form-control has a
   hardcoded font-size:1rem that never changes with viewport, bypassing
   the var(--fs-14) responsive token every other input on the site uses.
   Same specificity as Bootstrap's rule (0,1,0); wins on source order since
   this file loads after style.css. */
.form-control { font-size: var(--fs-14); }

.vz-input {
  width:100%;padding:var(--sp-12) var(--sp-14);
  background:var(--bg-mid);border:1px solid var(--border-md);
  border-radius:var(--br-inner);color:var(--t1);font-size:var(--fs-14);font-family:'Inter',sans-serif;
  transition:border var(--t-default);box-sizing:border-box;color-scheme:dark;
}
.vz-input::placeholder { color:var(--t5); }
.vz-input:focus { outline:none;border-color:var(--lime-a60); }
.vz-input:disabled { color:var(--t4);cursor:default; }
.vz-input option { background:var(--bg-mid);color:var(--t1); }
.vz-label { display:block;font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--t4);margin-bottom:var(--sp-8); }

.vz-select {
  width:100%;padding:var(--sp-12) var(--sp-14);
  background:var(--bg-mid);border:1px solid var(--border-md);
  border-radius:var(--br-inner);color:var(--t3);font-size:var(--fs-14);font-family:'Inter',sans-serif;
  box-sizing:border-box;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='var(--t6)' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
}
.vz-select option { background:var(--dark-navy); }

/* ── 17. AUTH PAGES ── */
.auth-bg {
  min-height:100vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;padding:var(--sp-40) var(--sp-16);
  background:radial-gradient(ellipse 80% 60% at 50% -20%,var(--purple-bd) 0%,transparent 70%),
             radial-gradient(ellipse 60% 50% at 80% 100%,var(--cyan-a10) 0%,transparent 60%),
             var(--bg-alt);
  position:relative;overflow:hidden;
}
.auth-bg::before {
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(0deg,transparent,transparent 60px,var(--bg-subtle) 60px,var(--bg-subtle) 61px),
                   repeating-linear-gradient(90deg,transparent,transparent 60px,var(--bg-subtle) 60px,var(--bg-subtle) 61px);
}
.auth-logo { text-align:center;margin-bottom:var(--sp-32);position:relative;z-index:1; }
.auth-logo h1 { font-size:var(--fs-36);font-weight:var(--fw-black);color:var(--t1);/* letter-spacing:-1px; */margin-bottom:var(--sp-4); }
.auth-logo p  { font-size:var(--fs-14);color:var(--t4); }
.auth-logo .logo { display:flex;justify-content:center;margin-bottom:var(--sp-4); }
.auth-logo .logo img { max-width:100%;height:60px; }
.auth-card {
  background:var(--bg-card);border:1px solid var(--border-md);
  backdrop-filter:blur(20px);border-radius:var(--br-outer);padding:var(--sp-40);
  width:100%;max-width:540px;position:relative;z-index:1;
}
.auth-card h2  { font-size:var(--fs-24);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-8);text-align:center; }
.auth-card p.sub { font-size:var(--fs-14);color:var(--t4);text-align:center;margin-bottom:var(--sp-28); }
/* auth-card size modifiers */
.auth-card-wide   { max-width:640px; }
.auth-card-narrow { max-width:480px; }
.auth-card-center { text-align:center;padding:var(--sp-40) var(--sp-40); }
.auth-card-500    { max-width:500px; }
/* vz-card-lime compact (smaller padding) */
.vz-card-lime-sm  { background:var(--lime-a10);border:1px solid var(--lime-a10);border-radius:var(--br-outer);padding:var(--sp-12) var(--sp-16); }
/* no-underline utility */
.no-underline     { text-decoration:none; }
/* SVG utility */
.vz-svg-20 { width:20px;height:20px; }
/* letter-spacing utilities */
.ls-tight { /* letter-spacing:-0.5px; */ }
.section-label { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--lime);margin:var(--sp-20) 0 var(--sp-14); }
.form-group    { margin-bottom:var(--sp-16); }
.form-group label { display:block;font-size:var(--fs-14);color:var(--t3);margin-bottom:var(--sp-8); }
.form-group label .req,.req { color:var(--red);margin-left:var(--sp-2); }
.form-row   { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-14); }
.form-row-3 { display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--sp-14); }
/* keep auth-input alias for backward compat */
.auth-input {
  width:100%;padding:var(--sp-12) var(--sp-14);
  background:var(--bg-mid);border:1px solid var(--border-md);
  border-radius:var(--br-inner);color:var(--t1);font-size:var(--fs-14);font-family:'Inter',sans-serif;
  transition:border var(--t-default);box-sizing:border-box;
}
.auth-input::placeholder { color:var(--t5); }
.auth-input:focus { outline:none;border-color:var(--lime-a60); }
.auth-input:disabled { color:var(--t4);cursor:default; }
.select-input {
  width:100%;padding:var(--sp-12) var(--sp-14);background:var(--bg-mid);
  border:1px solid var(--border-md);border-radius:var(--br-inner);color:var(--t3);
  font-size:var(--fs-14);font-family:'Inter',sans-serif;box-sizing:border-box;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='var(--t6)' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
}
.select-input option { background:var(--dark-navy); }
.select-input:focus,
.vz-select:focus,
select.form-control:focus,
.dark-only select:focus,
.dark-only select:focus-visible,
.dark-only select:active,
select:focus,
select:focus-visible,
select:active {
  outline: none !important;
  border: 1px solid var(--border-md) !important;
  box-shadow: none !important;
}
.input-btn-row { display:flex;gap:var(--sp-10); }
.input-btn-row .auth-input { flex:1; }
.verify-btn {
  background:transparent;border:1px solid var(--lime-a60);border-radius:var(--br-inner);
  padding:0 var(--sp-16);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--lime);cursor:pointer;
  white-space:nowrap;font-family:'Inter',sans-serif;transition:all var(--t-default);
}
.verify-btn:hover { background:var(--lime-a10); }
.verify-btn-success { background:var(--green-a05);border-color:var(--green-bd);color:var(--green);cursor:default; }
.verify-btn-error   { background:var(--red-a10);border-color:var(--red-bd);color:var(--red);cursor:default; }
/* Alert / info banners */
.alert-box { border-radius:var(--br-outer);padding:var(--sp-14) var(--sp-16);display:flex;gap:var(--sp-12);align-items:flex-start; }
.alert-box-amber { background:var(--orange-a15);border:1px solid var(--orange-bd); }
.alert-box-red   { background:var(--red-a10);border:1px solid var(--red-bd); }
.alert-box-green { background:var(--green-a05);border:1px solid var(--green-bd); }
.alert-box-cyan  { background:var(--cyan-a10);border:1px solid var(--cyan-bd); }
.verified-msg  { font-size:var(--fs-12);color:var(--green);display:flex;align-items:center;gap:var(--sp-4);margin-top:var(--sp-4); }
/* Auto-verified block */
.auto-verified-box { background:var(--green-a05);border:1px solid var(--green-a05);border-radius:var(--br-outer);padding:var(--sp-16) var(--sp-20); }
/* Terms of service row */
.tos-row { display:flex;align-items:flex-start;gap:var(--sp-10);margin-bottom:var(--sp-20);margin-top:var(--sp-8); }
.tos-checkbox { accent-color:var(--lime);width:16px;height:16px;margin-top:var(--sp-2);flex-shrink:0; }
.tos-label { font-size:var(--fs-14);color:var(--t3);cursor:pointer;/* line-height:1.5; */ }
.tos-link { color:var(--lime);text-decoration:none; }
.error-msg     { font-size:var(--fs-12);color:var(--orange);display:flex;align-items:center;gap:var(--sp-4);margin-top:var(--sp-4); }
.doc-upload-section { border:1px dashed var(--border-md);border-radius:var(--br-outer);padding:var(--sp-16);margin-bottom:var(--sp-16); }
.doc-upload-section .section-label { margin-top:0; }
.file-row { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-14); }
.file-input-wrap { display:flex;align-items:center;gap:var(--sp-10); }
.file-btn { background:var(--grad);border:none;border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--bg);cursor:pointer;white-space:nowrap;font-family:'Inter',sans-serif; }
.file-label { font-size:var(--fs-12);color:var(--t6); }
.note-text { font-size:var(--fs-12);color:var(--t6);margin-top:var(--sp-10); }
.submit-btn {
  width:100%;background:var(--grad);border:none;border-radius:var(--br-full);
  padding:var(--sp-14);font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--bg);cursor:pointer;
  font-family:'Inter',sans-serif;margin-top:var(--sp-10);transition:all var(--t-default);
}
.submit-btn:hover { opacity:.92;transform:translateY(-1px); }
.otp-boxes { display:flex;gap:var(--sp-12);justify-content:center;margin:var(--sp-24) 0; }
.otp-box {
  width:52px;height:56px;border-radius:var(--br-outer);
  background:var(--bg-mid);border:1px solid var(--border-lg);
  text-align:center;font-size:var(--fs-22);font-weight:var(--fw-bold);color:var(--t1);font-family:'Inter',sans-serif;
}
.otp-box:focus { outline:none;border-color:var(--lime); }
.resend-link { font-size:var(--fs-14);color:var(--t3);text-align:center; }
.resend-link a, .resend-link .resend-btn { color:var(--lime);font-weight:var(--fw-semibold);text-decoration:none;transition:opacity var(--t-fast); }
.resend-link a:hover, .resend-link .resend-btn:hover { opacity:.85;text-decoration:underline; }
.success-icon { width:72px;height:72px;border-radius:50%;background:var(--green);display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-20);font-size:var(--fs-32);color:var(--t1); }
.auth-link { text-align:center;font-size:var(--fs-14);color:var(--t4);margin-top:var(--sp-16); }
.auth-link a { color:var(--lime);text-decoration:none; }
/* Password field with inline eye-toggle */
.pwd-field-wrap { position:relative; }
.pwd-field-wrap .auth-input { padding-right:var(--sp-40); }
.pwd-field-wrap .form-control { padding-right:var(--sp-40); }
.pwd-field-wrap .form-control.is-invalid,
.pwd-field-wrap .auth-input.is-invalid,
.pwd-field-wrap input.is-invalid { background-image:none !important; padding-right:var(--sp-40) !important; }
.pwd-toggle-btn { position:absolute; right:var(--pos-12); top:50%; transform:translateY(-50%); background:none; border:none; cursor:pointer; color:var(--t5); font-size:var(--fs-16); padding:var(--sp-4); transition:color var(--t-fast); z-index:2; /* line-height:1; */ }
.pwd-toggle-btn:hover { color:var(--t2); }
/* Assessment Domain Start page */
.dstart-card       { overflow:hidden; }
.dstart-domain-cell { border-color:var(--lime-a15)!important; background:var(--lime-a10)!important; }
.recaptcha-box { border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-14) var(--sp-16);display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-20);background:var(--bg-card); }
.recaptcha-check { display:flex;align-items:center;gap:var(--sp-10);font-size:var(--fs-14);color:var(--t3); }
.recaptcha-check input[type=checkbox] { width:18px;height:18px;accent-color:var(--lime);cursor:pointer; }
.recaptcha-logo { font-size:var(--fs-10);color:var(--white-a35);text-align:right;/* line-height:1.6; */ }

/* Terms row */
.tos-row       { display:flex;align-items:flex-start;gap:var(--sp-10);cursor:pointer;margin-bottom:0; }
.tos-checkbox  { width:16px;height:16px;accent-color:var(--lime);cursor:pointer;flex-shrink:0;margin-top:var(--sp-2); }
.tos-label     { font-size:var(--fs-14);color:var(--t3);/* line-height:1.5; */ }
.tos-link      { color:var(--lime);text-decoration:none;font-weight:var(--fw-semibold); }
.tos-link:hover { text-decoration:underline; }
.recaptcha-check { display:flex;align-items:center;gap:var(--sp-10);font-size:var(--fs-14);color:var(--t3); }
.recaptcha-logo { font-size:var(--fs-10);color:var(--white-a35);text-align:right;/* line-height:1.4; */ }
.center-card { background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-40) var(--sp-40);max-width:480px;width:100%;text-align:center;position:relative;z-index:1; }
.center-card h2 { font-size:var(--fs-26);font-weight:var(--fw-extrabold);color:var(--t1);margin-bottom:var(--sp-12); }
.center-card p  { font-size:var(--fs-14);color:var(--t4);/* line-height:1.7; */margin-bottom:var(--sp-28); }
.btn-row { display:flex;gap:var(--sp-12);justify-content:center; }
.btn-primary { background:var(--grad);border:none;border-radius:var(--br-full);padding:var(--sp-12) var(--sp-28);font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--bg);cursor:pointer;font-family:'Inter',sans-serif;text-decoration:none; }
.btn-outline  { background:transparent;border:1px solid var(--border-lg);border-radius:var(--br-full);padding:var(--sp-12) var(--sp-28);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t3);cursor:pointer;font-family:'Inter',sans-serif; }

/* ── 18. LOGO COMPONENT ── */
.vz-logo { display:flex;align-items:center;gap:var(--sp-10);text-decoration:none; }
.vz-logo-name { font-size:var(--fs-20);font-weight:var(--fw-black);color:var(--t1);/* letter-spacing:-0.5px; */ }
.vz-logo-tag  { font-size:var(--fs-10);color:var(--t6);/* letter-spacing:0.5px; */display:block; }

/* ── 19. SIDEBAR ENTERPRISE WIDGET ── */
.sidebar-ei-widget { margin:var(--sp-20) var(--sp-16) var(--sp-8);padding:var(--sp-14);border:1px solid var(--lime-a15);border-radius:var(--br-outer);background:var(--lime-a10);text-align:center; }
.sidebar-ei-widget .ei-icon { font-size:var(--fs-22);color:var(--lime);margin-bottom:var(--sp-8); }
.sidebar-ei-widget h6 { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-2); }
.sidebar-ei-widget p  { font-size:var(--fs-12);color:var(--t6);margin:0; }

/* ── 20. ASSESSMENT HUB ── */
.hub-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-16);flex-wrap:wrap;gap:var(--sp-12); }
.hub-tags   { display:flex;gap:var(--sp-8); }
.progress-bar-big      { height:8px;background:var(--border);border-radius:var(--br-inner);overflow:hidden;margin-top:var(--sp-8); }
.progress-fill-big     { height:100%;border-radius:var(--br-inner);background:var(--grad); }
.overview-grid         { display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-14);margin-bottom:var(--sp-16); }
.ov-cell               { background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-16);display:flex;align-items:center;gap:var(--sp-14); }
.domain-assign-grid    { display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-14);margin-bottom:var(--sp-16); }
.da-card               { background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-16); }
.da-title              { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-4);display:flex;align-items:center;justify-content:space-between; }
.da-meta-row           { display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-4); }
.da-assignee           { font-size:var(--fs-12);color:var(--t4); }
.da-date               { font-size:var(--fs-12);color:var(--white-a35);display:inline-flex;align-items:center;gap:var(--sp-4);flex-shrink:0; }
.da-date i             { cursor:help; transition:color var(--t-fast); }
.da-date i:hover       { color:var(--purple); }
/* Bootstrap tooltip styled to match project dark theme */
.tooltip .tooltip-inner { background:var(--bg-alt);border:1px solid var(--purple-bd);color:var(--t2);font-family:'Inter',sans-serif;font-size:var(--fs-12);font-weight:var(--fw-semibold);padding:var(--sp-4) var(--sp-10);border-radius:var(--br-inner);box-shadow:0 4px 16px var(--black-a50); }
.bs-tooltip-top    .tooltip-arrow::before { border-top-color:var(--purple-bd); }
.bs-tooltip-bottom .tooltip-arrow::before { border-bottom-color:var(--purple-bd); }
.bs-tooltip-start  .tooltip-arrow::before { border-left-color:var(--purple-bd); }
.bs-tooltip-end    .tooltip-arrow::before { border-right-color:var(--purple-bd); }
.da-prog               { height:6px;background:var(--bg-mid);border-radius:var(--br-inner);overflow:hidden;margin:var(--sp-10) 0 var(--sp-8); }
.da-prog-fill          { height:100%;border-radius:var(--br-inner); }
.da-prog-label         { display:flex;justify-content:space-between;font-size:var(--fs-12);color:var(--t4); }
.da-btn                { display:flex;justify-content:center;width:100%;margin-top:var(--sp-10);background:var(--bg-mid);border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-8);font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--t3);cursor:pointer;font-family:'Inter',sans-serif; }
.da-btn-start          { background:var(--lime-a10);border-color:var(--lime-a15);color:var(--lime); }
.da-btn-continue       { background:var(--purple-a10);border-color:var(--purple-bd);color:var(--purple); }
.da-btn-done           { background:var(--green-a05);border-color:var(--green-bd);color:var(--green); }

/* ── 21. ASSESSMENT PREVIEW ── */
.prev-domain     { margin-bottom:var(--sp-24); }
.prev-domain-hdr { font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--lime);margin-bottom:var(--sp-12);display:flex;align-items:center;gap:var(--sp-8);padding:var(--sp-12) var(--sp-16);background:var(--lime-a10);border:1px solid var(--lime-a15);border-radius:var(--br-inner); }
.prev-ctrl       { margin-bottom:var(--sp-10); }
.prev-ctrl-name  { font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--t3);padding:var(--sp-8) 0; }
.prev-q-row      { display:flex;align-items:baseline;justify-content:space-between;padding:var(--sp-8) var(--sp-14);border-bottom:1px solid var(--bg-card);font-size:var(--fs-14);color:var(--t3);gap:var(--sp-16); }
.prev-q-row:last-child { border-bottom:none; }
.prev-q-val      { flex-shrink:0;font-weight:var(--fw-bold);min-width:32px;text-align:right; }
.val-yes  { color:var(--green); }
.val-no   { color:var(--red); }
.val-num  { color:var(--t2); }
.confirm-bar    { position:sticky;bottom:0;background:var(--bg);border-top:1px solid var(--border);padding:var(--sp-16) var(--sp-24);display:flex;align-items:center;justify-content:space-between; }
.confirm-check  { display:flex;align-items:center;gap:var(--sp-10);font-size:var(--fs-14);color:var(--t3); }
.confirm-check input { accent-color:var(--lime);width:16px;height:16px; }
.prev-table { width:100%; border-collapse:collapse; }
.prev-table th { background:var(--bg-mid); color:var(--white-a35); font-size:var(--fs-10); font-weight:var(--fw-bold); text-transform:uppercase; /* letter-spacing:.7px; */ padding:var(--sp-10) var(--sp-14); text-align:left; border-bottom:1px solid var(--border); }
.prev-table td { padding:var(--sp-14) var(--sp-14); font-size:var(--fs-14); color:var(--t3); border-bottom:1px solid var(--bg-card); vertical-align:middle; transition:background var(--t-fast); }
.prev-table tbody tr:hover td { background:var(--bg-card); }
.prev-table tbody tr:last-child td { border-bottom:none; }

/* ── 22. ASSESSMENT SCREEN ── */
.sc-layout   { display:grid;grid-template-columns:220px 1fr 200px;gap:var(--sp-12);align-items:start; }
.ctrl-panel  { background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--br-outer);overflow:hidden;position:sticky;top:var(--pos-20); }
.ctrl-title  { padding:var(--sp-12) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t4);border-bottom:1px solid var(--bg-mid);/* letter-spacing:.8px; */text-transform:uppercase; }
.ctrl-item   { padding:var(--sp-12) var(--sp-14);border-bottom:1px solid var(--bg-card);cursor:pointer;transition:all var(--t-fast);display:flex;align-items:center;gap:var(--sp-10);border-left:3px solid transparent; }
.ctrl-item:last-child { border-bottom:none; }
.ctrl-item.active { background:var(--lime-a10);border-left-color:var(--lime); }
.ctrl-dot          { width:9px;height:9px;border-radius:50%;flex-shrink:0; }
.ctrl-dot.filled   { background:var(--lime);box-shadow:0 0 4px var(--lime-a60); }
.ctrl-dot.empty    { border:1.5px solid var(--cyan-bd); }
.ctrl-name         { font-size:var(--fs-12);color:var(--t3);flex:1; }
.ctrl-item.active .ctrl-name { color:var(--lime);font-weight:var(--fw-semibold); }
.ctrl-score-lbl    { font-size:var(--fs-10);color:var(--white-a35); }
.qs-area  { display:flex;flex-direction:column;gap:var(--sp-10); }
.q-card   { background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-16); }
.q-num    { width:26px;height:26px;border-radius:var(--br-inner);background:var(--lime-a10);border:1px solid var(--lime-a15);color:var(--lime);font-size:var(--fs-12);font-weight:var(--fw-bold);display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.q-head   { display:flex;align-items:flex-start;gap:var(--sp-10);margin-bottom:var(--sp-14); }
.q-text   { font-size:var(--fs-14);color:var(--t2);/* line-height:1.55; */flex:1; }
.q-help   { color:var(--amber-a50);background:none;border:none;cursor:pointer;padding:0;font-size:var(--fs-14);flex-shrink:0;margin-top:var(--sp-2); }
.toggle-row  { display:flex;align-items:center;justify-content:space-between; }
.toggle-wrap { display:flex;align-items:center;gap:var(--sp-10); }
.vz-toggle:not(:has(.vz-toggle-track))   { width:44px;height:24px;border-radius:var(--br-outer);background:var(--border);cursor:pointer;position:relative;border:1px solid var(--border-md);transition:all var(--t-default);flex-shrink:0; }
.vz-toggle:not(:has(.vz-toggle-track))::after { content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--white-a35);transition:all var(--t-default); }
.vz-toggle:not(:has(.vz-toggle-track)).on { background:var(--lime-a15);border-color:var(--lime); }
.vz-toggle:not(:has(.vz-toggle-track)).on::after { transform:translateX(20px);background:var(--lime); }
.toggle-label { font-size:var(--fs-14);color:var(--t4); }
.toggle-hint  { font-size:var(--fs-12);color:var(--white-a35); }
.score-btns   { display:flex;gap:var(--sp-8);flex-wrap:wrap; }
.sc-btn       { width:42px;height:42px;border-radius:var(--br-inner);border:1px solid var(--border-md);background:var(--bg-card);color:var(--t3);font-size:var(--fs-16);font-weight:var(--fw-bold);cursor:pointer;transition:all var(--t-fast);font-family:'Inter',sans-serif;display:flex;align-items:center;justify-content:center; }
.sc-btn:hover { background:var(--lime-a10);border-color:var(--lime-a15);color:var(--lime); }
.sc-btn.sel   { background:var(--lime-a10);border-color:var(--lime);color:var(--lime); }
.q-nav        { display:flex;align-items:center;justify-content:space-between;margin-top:var(--sp-14);padding-top:var(--sp-12);border-top:1px solid var(--bg-mid); }
.nav-btn         { background:var(--bg-mid);border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-20);font-size:var(--fs-14);color:var(--t3);cursor:pointer;font-family:'Inter',sans-serif;display:flex;align-items:center;gap:var(--sp-8); }
.nav-btn-primary { background:var(--grad);border:none;color:var(--bg);font-weight:var(--fw-bold); }
.info-panel  { display:flex;flex-direction:column;gap:var(--sp-10);position:sticky;top:var(--pos-20); }
.info-card   { background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-14); }
.info-title  { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--lime);margin-bottom:var(--sp-10);display:flex;align-items:center;gap:var(--sp-8);text-transform:uppercase;/* letter-spacing:.7px; */ }
.scale-row   { display:flex;align-items:center;gap:var(--sp-8);padding:var(--sp-4) 0;border-bottom:1px solid var(--bg-card); }
.scale-row:last-child { border-bottom:none; }
.scale-num   { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--lime);width:14px;flex-shrink:0; }
.scale-lbl   { font-size:var(--fs-12);color:var(--t3);flex:1; }
.stat-row    { display:flex;justify-content:space-between;align-items:center;padding:var(--sp-4) 0;border-bottom:1px solid var(--bg-card);font-size:var(--fs-12); }
.stat-row:last-child { border-bottom:none; }
.stat-lbl    { color:var(--t4); }
.stat-val    { font-weight:var(--fw-bold);color:var(--lime); }
.modal-overlay   { position:fixed;inset:0;background:var(--black-a65);z-index:1000;display:none;align-items:center;justify-content:center; }
.modal-overlay.open { display:flex; }
.modal-box   { background:var(--bg);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-28);max-width:480px;width:90%;max-height:80vh;overflow-y:auto; }
.modal-box-sm { max-width:380px; }
.del-icon-wrap { width:52px;height:52px;border-radius:50%;background:var(--red-a10);border:1px solid var(--red-bd);display:flex;align-items:center;justify-content:center;font-size:var(--fs-20);color:var(--red); }
.btn-solid-red    { background:var(--red-a10);border:1px solid var(--red-bd);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--red);cursor:pointer;font-family:'Inter',sans-serif;display:flex;align-items:center;justify-content:center;gap:var(--sp-8);white-space:nowrap; }
.btn-solid-red:hover { background:var(--red-bd); }
.modal-close  { float:right;background:none;border:none;color:var(--t4);font-size:var(--fs-18);cursor:pointer; }
.modal-title  { font-size:var(--fs-18);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-16); }
.modal-section { font-size:var(--fs-16);font-weight:var(--fw-semibold);color:var(--lime);margin-bottom:var(--sp-8);display:flex;align-items:center;gap:var(--sp-8); }
.modal-item    { font-size:var(--fs-14);color:var(--t3);margin-bottom:var(--sp-8);/* line-height:1.6; */padding-left:var(--sp-8); }
.prog-wrap      { flex:1;height:6px;background:var(--border);border-radius:var(--br-inner);overflow:hidden; }
.prog-fill      { height:100%;border-radius:var(--br-inner);background:var(--grad); }
.prog-bar-wrap  { flex:1;height:8px;background:var(--border);border-radius:var(--br-inner);overflow:hidden; }
.prog-bar-fill  { height:100%;border-radius:var(--br-inner);background:var(--grad); }

/* ── 23. DASHBOARD ── */
.summary-card { background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-20) var(--sp-24);margin-bottom:var(--sp-16);display:grid;grid-template-columns:200px 1fr auto;gap:var(--sp-28);align-items:start; }
.score-col    { text-align:center; }
.score-lbl    { font-size:var(--fs-10);font-weight:var(--fw-bold);/* letter-spacing:1.2px; */text-transform:uppercase;color:var(--t6);margin-bottom:var(--sp-12); }
.grade-pill   { background:var(--amber-bg);border:1px solid var(--amber-bd);border-radius:var(--br-full);padding:var(--sp-8) var(--sp-28);font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--amber);display:inline-block;margin-bottom:var(--sp-8); }
.grade-desc   { font-size:var(--fs-12);color:var(--t4);/* line-height:1.5; */ }
.domain-grid  { display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-10);margin-bottom:var(--sp-16); }
.domain-tile  { border-radius:var(--br-outer);padding:var(--sp-14) var(--sp-16);cursor:pointer;border:1px solid transparent;transition:all var(--t-default);position:relative;overflow:hidden; }
.domain-tile:hover { transform:translateY(-2px);box-shadow:0 6px 24px var(--black-a25); }
.dt-score { font-size:var(--fs-28);font-weight:var(--fw-black);/* line-height:1; */margin-bottom:var(--sp-4); }
.dt-name  { font-size:var(--fs-12);font-weight:var(--fw-semibold);margin-bottom:var(--sp-4); }
.dt-grade { font-size:var(--fs-12);font-weight:var(--fw-bold); }
.dt-established { background:var(--green-a05);border-color:var(--green-bd); }
.dt-established .dt-score,.dt-established .dt-grade { color:var(--green); }
.dt-managed     { background:var(--amber-a10);border-color:var(--amber-bd); }
.dt-managed .dt-score,.dt-managed .dt-grade { color:var(--amber); }
.dt-developing  { background:var(--orange-a15);border-color:var(--orange-bd); }
.dt-developing .dt-score,.dt-developing .dt-grade { color:var(--orange); }
.dt-high-risk   { background:var(--red-a10);border-color:var(--red-bd); }
.dt-high-risk .dt-score,.dt-high-risk .dt-grade { color:var(--red); }
.dt-locked      { background:var(--bg-card);border-color:var(--bg-mid);color:var(--white-a35); }
.dt-locked .dt-score { color:var(--white-a35);font-size:var(--fs-22); }
.legend-bar  { display:flex;gap:var(--sp-16);align-items:center;margin-bottom:var(--sp-12);flex-wrap:wrap; }
.legend-item { display:flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-12);color:var(--t3); }
.legend-dot  { width:10px;height:10px;border-radius:var(--br-inner); }
.attention-card   { border:1px solid var(--red-bd);border-radius:var(--br-outer);padding:var(--sp-16) var(--sp-20);margin-bottom:var(--sp-10);background:var(--red-a10); }
.attention-title  { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--red);margin-bottom:var(--sp-4);display:flex;align-items:center;gap:var(--sp-8); }
.attention-bullets { list-style:disc;padding-left:var(--sp-16);font-size:var(--fs-12);color:var(--t3);/* line-height:2; */ }
.impr-card    { border:1px solid var(--bg-mid);border-radius:var(--br-outer);padding:var(--sp-14) var(--sp-16);margin-bottom:var(--sp-8);background:var(--bg-subtle);display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-14); }
.impr-dot     { width:10px;height:10px;border-radius:50%;flex-shrink:0;margin-top:var(--sp-4); }
.impr-body    { flex:1; }
.impr-title   { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-4); }
.impr-bullets { font-size:var(--fs-12);color:var(--t3);list-style:disc;padding-left:var(--sp-14);/* line-height:1.8; */ }
.impr-action  { font-size:var(--fs-12);color:var(--lime);display:flex;align-items:center;gap:var(--sp-4);white-space:nowrap;text-decoration:none;flex-shrink:0;padding-top:var(--sp-2); }
.qa-btn       { display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-12) var(--sp-14);border-radius:var(--br-outer);border:1px solid var(--border);background:var(--bg-subtle);font-size:var(--fs-14);color:var(--t3);text-decoration:none;margin-bottom:var(--sp-8);transition:all var(--t-fast);cursor:pointer; }
.qa-btn:last-child { margin-bottom:0; }
.qa-btn:hover { background:var(--lime-a10);border-color:var(--lime-a15);color:var(--lime); }
.qa-btn.primary-action { background:var(--lime-a10);border-color:var(--lime-a15);color:var(--lime); }
.qa-icon      { width:32px;height:32px;border-radius:var(--br-inner);display:flex;align-items:center;justify-content:center;font-size:var(--fs-14);flex-shrink:0;background:var(--bg-mid); }
.ra-row       { display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-10) 0;border-bottom:1px solid var(--bg-card); }
.ra-row:last-child { border-bottom:none; }
.ra-icon      { width:30px;height:30px;border-radius:50%;background:var(--lime-a10);border:1px solid var(--lime-a15);display:flex;align-items:center;justify-content:center;font-size:var(--fs-12);color:var(--lime);flex-shrink:0; }
.ra-text      { flex:1;font-size:var(--fs-14);color:var(--t3); }
.ra-time      { font-size:var(--fs-12);color:var(--white-a35);white-space:nowrap; }
.modal-box h3  { font-size:var(--fs-18);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-8); }
.modal-box p   { font-size:var(--fs-14);color:var(--t4);margin-bottom:var(--sp-20); }

/* Dashboard-1 variant */
.summary-strip { display:grid;grid-template-columns:220px 1fr 260px;gap:0;background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);overflow:hidden;margin-bottom:var(--sp-14); }
.strip-section { padding:var(--sp-20) var(--sp-24);border-right:1px solid var(--border); }
.strip-section:last-child { border-right:none; }
.strip-label { font-size:var(--fs-10);font-weight:var(--fw-bold);/* letter-spacing:1.4px; */text-transform:uppercase;color:var(--white-a35);margin-bottom:var(--sp-12); }
.score-donut-wrap  { position:relative;width:90px;height:90px;margin:0 auto var(--sp-8); }
.score-donut-wrap svg { transform:rotate(-90deg); }
.score-donut-inner { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center; }
.grade-pill-solid  { background:var(--green);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-8) var(--sp-28);font-size:var(--fs-16);font-weight:var(--fw-extrabold);display:inline-block;margin-bottom:var(--sp-8); }
.grade-sub         { font-size:var(--fs-12);color:var(--t6);/* line-height:1.5; */ }
.ai-row            { display:flex;justify-content:space-between;padding:var(--sp-8) 0;border-bottom:1px solid var(--bg-mid);font-size:var(--fs-14); }
.ai-row:last-child { border-bottom:none; }
.ai-lbl            { color:var(--t4); }
.ai-val            { font-weight:var(--fw-semibold);color:var(--t2); }
.dash-bottom       { display:grid;grid-template-columns:1fr 260px;gap:var(--sp-14); }
.stats-row-5       { display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-14);margin-bottom:var(--sp-16); }
.stat-box          { background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-20); }
.stat-box-val      { font-size:var(--fs-28);font-weight:var(--fw-extrabold);color:var(--t1);margin:var(--sp-8) 0 var(--sp-2); }
.stat-box-lbl      { font-size:var(--fs-12);color:var(--t4); }
.stat-box-ico      { width:38px;height:38px;border-radius:var(--br-inner);display:flex;align-items:center;justify-content:center;font-size:var(--fs-18);margin-bottom:var(--sp-4); }
.two-cols          { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-14);margin-bottom:var(--sp-14); }
.rev-big           { font-size:var(--fs-26);font-weight:var(--fw-extrabold);color:var(--lime);margin-bottom:var(--sp-4); }
.rev-lbl           { font-size:var(--fs-12);color:var(--t4); }
.rev-sub           { font-size:var(--fs-12);color:var(--white-a35);margin-top:var(--sp-4); }
.bar-track-h       { display:flex;height:8px;background:var(--bg-mid);border-radius:var(--br-inner);overflow:hidden;margin-top:var(--sp-8); }
.bar-fill-h        { height:100%;border-radius:var(--br-inner); }
.plan-row          { display:flex;align-items:center;gap:var(--sp-10);margin-bottom:var(--sp-10); }
.plan-name         { font-size:var(--fs-14);color:var(--t3);width:88px;flex-shrink:0;margin-bottom:var(--sp-8); }
.plan-orgs         { font-size:var(--fs-12);color:var(--t4);width:50px; }
.plan-track        { flex:1;height:7px;background:var(--bg-mid);border-radius:var(--br-inner);overflow:hidden; }
.plan-fill         { height:100%;border-radius:var(--br-inner); }
.plan-fill-lime    { background:var(--lime); }
.plan-rev          { font-size:var(--fs-12);font-weight:var(--fw-semibold);width:55px;text-align:right;flex-shrink:0; }
.plan-pct          { font-size:var(--fs-12);color:var(--t4);width:30px;text-align:right;flex-shrink:0; }
.vq-item           { display:flex;align-items:flex-start;gap:var(--sp-12);padding:var(--sp-14) var(--sp-16);border-bottom:1px solid var(--bg-mid); }
.vq-item:last-child { border-bottom:none; }
.vq-left           { display:flex;flex-direction:column;gap:var(--sp-4);flex:1; }
.vq-right          { flex-shrink:0;padding-top:var(--sp-2); }
.vq-name           { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1);display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-8); }
.vq-meta           { display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-2); }
.vq-date           { display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-4); }
.tracker-table           { width:100%;border-collapse:collapse;background:transparent; }
.tracker-table thead tr  { background:var(--bg-card); }
.tracker-table th        { color:var(--t6);font-size:var(--fs-10);font-weight:var(--fw-bold);text-transform:uppercase;/* letter-spacing:.7px; */padding:var(--sp-10) var(--sp-14);text-align:left;border-bottom:1px solid var(--border); }
.tracker-table td        { padding:var(--sp-12) var(--sp-14);font-size:var(--fs-14);color:var(--t3);border-bottom:1px solid var(--bg-card);vertical-align:middle; }
.tracker-table tbody tr:last-child td { border-bottom:none; }
.tracker-table tbody tr:hover { background:var(--bg-card); }
.funnel-row        { display:grid;grid-template-columns:1fr 80px 70px;align-items:center;padding:var(--sp-12) 0;border-bottom:1px solid var(--bg-mid); }
.funnel-row:last-child { border-bottom:none; }
.activity-row      { display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-12) 0;border-bottom:1px solid var(--bg-mid); }
.activity-row:last-child { border-bottom:none; }
.activity-ico      { width:32px;height:32px;border-radius:50%;background:var(--bg-mid);display:flex;align-items:center;justify-content:center;font-size:var(--fs-12);color:var(--t4);flex-shrink:0; }
.adr-item          { padding:var(--sp-14) var(--sp-16);border-bottom:1px solid var(--bg-mid);display:flex;align-items:flex-start;gap:var(--sp-12); }
.adr-item:last-child { border-bottom:none; }
.adr-left          { flex:1;display:flex;flex-direction:column;gap:var(--sp-4); }
.adr-left h6       { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1);margin-bottom:var(--sp-2);display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-8); }
.adr-left .meta    { display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-4); }
.adr-date          { display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-4); }
.adr-right         { flex-shrink:0;padding-top:var(--sp-2); }

/* ── 23b. ADMIN DASHBOARD — missing utility classes ── */
/* Revenue KPI row */
.rev-card          { display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:var(--sp-16) 0 var(--sp-20);border-bottom:1px solid var(--border);margin-bottom:0; }
.rev-cell          { display:flex;flex-direction:column;justify-content:center;padding:0 var(--sp-24);border-right:1px solid var(--border); }
.rev-cell:first-child { padding-left:0; }
.rev-cell:last-child  { border-right:none; }
/* Big value (non-lime) — same size as .rev-big but no color override */
.rev-val           { font-size:var(--fs-26);font-weight:var(--fw-extrabold);margin-bottom:var(--sp-4);/* line-height:1; */ }
/* Color utilities */
.c-white           { color:var(--t1); }
.c-muted           { color:var(--t4); }
.c-muted-28        { color:var(--white-a35); }
.c-muted-30        { color:var(--white-a35); }
.c-muted-35        { color:var(--white-a35); }
.c-muted-40        { color:var(--t6); }
.c-muted-45        { color:var(--t4); }
.c-muted-55        { color:var(--t3); }
.c-muted-70        { color:var(--t3); }
.c-muted-75        { color:var(--t2); }
/* Org filter — native select styled as chip */
.org-filter-wrap   { display:inline-flex;align-items:center;gap:var(--sp-8);padding:var(--sp-8) var(--sp-14);background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-inner);cursor:pointer;position:relative; }
.org-filter-wrap:hover { background:var(--border);border-color:var(--border-lg); }
.org-filter-ico    { font-size:var(--fs-14);color:var(--t6);pointer-events:none;flex-shrink:0; }
.org-filter-caret  { font-size:var(--fs-10);color:var(--t6);pointer-events:none;flex-shrink:0;transition:transform var(--t-default); }
.org-filter-select {
  appearance:none;-webkit-appearance:none;background:transparent;border:none;
  outline:none;font-size:var(--fs-14);font-weight:var(--fw-medium);color:var(--t3);
  font-family:'Inter',sans-serif;cursor:pointer;padding:0;min-width:130px;
}
.org-filter-select option { background:var(--bg-alt);color:var(--gray-light); }
.org-filter-wrap:focus-within .org-filter-caret { transform:rotate(180deg); }
/* Misc utilities */
.cursor-pointer    { cursor:pointer; }
.px-20             { padding-left:var(--sp-20);padding-right:var(--sp-20); }
/* Funnel header labels row */
.funnel-header-row { display:grid;grid-template-columns:1fr 80px 70px;padding-bottom:var(--sp-8);margin-bottom:var(--sp-4);border-bottom:1px solid var(--border); }
/* Legend dots for revenue split bar */
.dot-purple        { width:10px;height:10px;border-radius:50%;background:var(--purple);flex-shrink:0;display:inline-block; }
.dot-amber         { width:10px;height:10px;border-radius:50%;background:var(--amber);flex-shrink:0;display:inline-block; }
/* Revenue split bar fill colors (data-color attribute) */
.bar-fill-h[data-color="purple"] { background:var(--purple); }
.bar-fill-h[data-color="amber"]  { background:var(--amber); }
/* Revenue section separator */
.rev-section-sep   { border-top:1px solid var(--bg-mid);margin-top:var(--sp-20);padding-top:var(--sp-20); }
/* Activity icon color variants */
.activity-ico-lime   { background:var(--lime-bg);color:var(--lime); }
.activity-ico-amber  { background:var(--amber-bg);color:var(--amber); }
.activity-ico-cyan   { background:var(--cyan-bg);color:var(--cyan); }
.activity-ico-purple { background:var(--purple-bg);color:var(--purple); }
/* Add-on License Snapshot */
.addon-snap-grid   { display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-10);margin-bottom:var(--sp-10); }
.addon-snap-cell   { background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--br-inner);padding:var(--sp-14) var(--sp-12);text-align: center; }
.addon-snap-val    { font-size:var(--fs-20);font-weight:var(--fw-extrabold);color:var(--lime);margin-bottom:var(--sp-4);/* line-height:1; */ }
.addon-snap-lbl    { font-size:var(--fs-12);color:var(--t4);/* line-height:1.4; */ }
.addon-note        { font-size:var(--fs-12);color:var(--white-a35);margin-top:var(--sp-8);/* line-height:1.5; */ }
/* Top Revenue Organisations */
.top-rev-row       { display:flex;align-items:center;justify-content:space-between;padding:var(--sp-12) 0;border-bottom:1px solid var(--bg-mid); }
.top-rev-row:last-child { border-bottom:none; }
.top-rev-name      { font-size:var(--fs-14);color:var(--t3); }
.top-rev-amt       { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1); }

/* Two-column layout with vertical divider */
.two-cols-divided  { display:grid;grid-template-columns:1fr 1fr;gap:0;margin-bottom:0; }
.two-cols-divided > :first-child { padding-right:var(--sp-28);border-right:1px solid var(--border); }
.two-cols-divided > :last-child  { padding-left:var(--sp-28); }

/* VQ/ADR colorful org/status icon */
.vq-ico  { width:40px;height:40px;border-radius:var(--br-outer);display:flex;align-items:center;justify-content:center;font-size:var(--fs-18);flex-shrink:0;margin-top:var(--sp-4); }
.adr-ico { width:40px;height:40px;border-radius:var(--br-outer);display:flex;align-items:center;justify-content:center;font-size:var(--fs-18);flex-shrink:0;margin-top:var(--sp-4); }

/* Colorful meta/info chips */
.meta-chip    { display:inline-flex;align-items:center;gap:var(--sp-4);padding:var(--sp-2) var(--sp-10);border-radius:var(--br-full);font-size:var(--fs-10);font-weight:var(--fw-medium);/* line-height:1.5; */white-space:nowrap; }
.chip-default { background:var(--bg-mid);color:var(--t4); }
.chip-lime    { background:var(--lime-a10);color:var(--lime-a80); }
.chip-cyan    { background:var(--cyan-a10);color:var(--cyan-a78); }
.chip-amber   { background:var(--amber-a10);color:var(--amber-a100); }
.chip-orange  { background:var(--orange-a15);color:var(--orange-a82); }
.chip-purple  { background:var(--purple-a10);color:var(--purple-a95); }
.chip-green   { background:var(--green-a05);color:var(--green-a85); }

/* Choices.js org-filter dark theme */
.org-filter-outer { position:relative;display:inline-flex;align-items:center; }
.org-filter-pfx   { position:absolute;left:var(--pos-12);z-index:10;font-size:var(--fs-14);color:var(--t6);pointer-events:none; }
.org-filter-outer .choices { margin-bottom:0; }
.org-filter-outer .choices__inner {
  background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-inner);
  min-height:auto;padding:var(--sp-8) var(--sp-40) var(--sp-8) var(--sp-40);display:flex;align-items:center;
  transition:border-color var(--t-fast);
}
.org-filter-outer .choices__inner:hover { border-color:var(--border-lg); }
.org-filter-outer .choices__list--single { padding:0; }
.org-filter-outer .choices__list--single .choices__item {
  font-size:var(--fs-14);font-weight:var(--fw-medium);color:var(--t3);
  font-family:'Inter',sans-serif;padding:0;
}
.org-filter-outer .choices__list--dropdown {
  background:var(--bg-alt);border:1px solid var(--border-md);
  border-radius:var(--br-inner);margin-top:var(--sp-4);z-index:999;
  box-shadow:0 10px 30px var(--black-a65);overflow:hidden;
}
.org-filter-outer .choices__list--dropdown .choices__item {
  font-size:var(--fs-14);color:var(--t3);padding:var(--sp-10) var(--sp-14);
  font-family:'Inter',sans-serif;transition:background var(--t-fast);
}
.org-filter-outer .choices__list--dropdown .choices__item.is-highlighted {
  background:var(--lime-a10);color:var(--lime);
}
/* hide default Choices caret — replaced by FA chevron */
.org-filter-outer .choices[data-type*='select-one']::after,
.org-filter-outer .choices[data-type*='select-one'].is-open::after { display:none; }
/* FA chevron suffix — rotates when dropdown is open */
.org-filter-sfx { position:absolute;right:var(--pos-12);z-index:10;font-size:var(--fs-12);color:var(--t4);pointer-events:none;transition:transform var(--t-default); }
.org-filter-outer .choices.is-open ~ .org-filter-sfx { transform:rotate(180deg); }

/* Revenue Split — single stacked pill bar */
.rev-split-chart   { display:flex;flex-direction:column;gap:var(--sp-14); }
.rev-split-bar     { height:28px;border-radius:var(--br-full);display:flex;overflow:hidden;background:var(--bg-mid); }
.rev-split-seg     { height:100%;flex-shrink:0;transition:width var(--t-slow) cubic-bezier(.4,0,.2,1),opacity var(--t-medium) ease; }
.rev-split-legends { display:flex;align-items:center;gap:var(--sp-24);flex-wrap:wrap; }
.rsl-btn           { display:inline-flex;align-items:center;gap:var(--sp-8);background:none;border:none;padding:0;cursor:pointer;user-select:none;transition:opacity var(--t-default); }
.rsl-btn.is-off    { opacity:0.3; }
.rsl-dot           { width:10px;height:10px;border-radius:50%;flex-shrink:0; }
.rsl-text          { font-size:var(--fs-12);font-weight:var(--fw-medium);color:var(--t3);font-family:'Inter',sans-serif; }

/* ── 23c. ORG DETAIL PAGE ── */
.orgd-name         { font-size:var(--fs-22);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-12); }
.orgd-meta-row     { display:flex;align-items:center;flex-wrap:wrap; }
.orgd-meta-tag     { display:inline-flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-14);font-weight:var(--fw-medium);color:var(--t3);padding-right:var(--sp-20);margin-right:var(--sp-20);border-right:1px solid var(--border); }
.orgd-meta-tag:last-of-type { border-right:none;padding-right:0;margin-right:0; }
.orgd-meta-tag i   { font-size:var(--fs-12);color:var(--t5); }
.orgd-stat-grid    { display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-14);margin-top:var(--sp-20); }
.orgd-stat-box     { background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-16) var(--sp-20);display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-12); }
.orgd-stat-left    { display:flex;flex-direction:column; }
.orgd-stat-lbl     { font-size:var(--fs-12);font-weight:var(--fw-medium);color:var(--t5);margin-bottom:var(--sp-8); }
.orgd-stat-val     { font-size:var(--fs-22);font-weight:var(--fw-extrabold);color:var(--t1);/* line-height:1; */ }
.orgd-stat-ico     { width:34px;height:34px;border-radius:var(--br-inner);display:flex;align-items:center;justify-content:center;font-size:var(--fs-16);flex-shrink:0; }
.rev-sum-row       { display:grid;grid-template-columns:repeat(3,1fr);padding-bottom:var(--sp-20); }
.rev-sum-cell      { padding:0 var(--sp-20); }
.rev-sum-cell:first-child { padding-left:0; }
.rev-sum-val       { font-size:var(--fs-22);font-weight:var(--fw-extrabold);/* line-height:1; */margin-bottom:var(--sp-4); }
.rev-sum-lbl       { font-size:var(--fs-12);color:var(--t5); }
.plan-lic-row      { display:flex;align-items:center;justify-content:space-between;padding:var(--sp-10) 0;border-bottom:1px solid var(--bg-card); }
.plan-lic-row:last-of-type { border-bottom:none; }
.plan-lic-key      { font-size:var(--fs-14);color:var(--t4); }
.plan-lic-val      { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1); }
.col-sep           { border-top:1px solid var(--bg-mid);margin:var(--sp-20) 0; }
.lic-util-bar      { height:10px;border-radius:var(--br-full);background:var(--border);overflow:hidden;margin-bottom:var(--sp-8); }
.lic-util-fill     { height:100%;border-radius:var(--br-full);transition:width var(--t-slow) ease; }
.lic-util-lbl      { font-size:var(--fs-12);color:var(--t4); }
.revlic-grid       { display:grid;grid-template-columns:1fr 1fr; }
.revlic-cell       { padding:var(--sp-20) var(--sp-28); }
.revlic-cell:nth-child(odd)  { padding-left:0;border-right:1px solid var(--border); }
.revlic-cell:nth-child(even) { padding-right:0; }
.revlic-cell:nth-child(-n+2) { padding-top:0;border-bottom:1px solid var(--bg-mid); }
.revlic-cell:nth-child(n+3)  { padding-bottom:0; }
.wflow-grid        { display:grid;grid-template-columns:repeat(3,1fr); }
.wflow-col         { padding:0 var(--sp-24);border-right:1px solid var(--border); }
.wflow-col:first-child { padding-left:0; }
.wflow-col:last-child  { border-right:none; }
.wflow-lbl         { font-size:var(--fs-10);font-weight:var(--fw-bold);text-transform:uppercase;/* letter-spacing:.8px; */color:var(--t5);margin-bottom:var(--sp-10); }
.wflow-val         { font-size:var(--fs-14);font-weight:var(--fw-medium);color:var(--t3); }
.od-act-row        { display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-12) 0;border-bottom:1px solid var(--bg-card); }
.od-act-row:last-child { border-bottom:none; }
.od-act-ico        { width:30px;height:30px;border-radius:var(--br-inner);background:var(--bg-card);display:flex;align-items:center;justify-content:center;font-size:var(--fs-12);color:var(--t4);flex-shrink:0; }
.od-act-text       { flex:1;font-size:var(--fs-14);color:var(--t3); }
.od-act-date       { font-size:var(--fs-12);color:var(--t5);flex-shrink:0;white-space:nowrap; }
.badge-completed   { background:var(--green-bg);border:1px solid var(--green-bd);color:var(--green);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold);display:inline-block; }
.badge-notstarted  { background:var(--bg-mid);border:1px solid var(--border-md);color:var(--t4);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold);display:inline-block; }

/* ── 23d. REVENUE ANALYTICS PAGE ── */
.ra-select         { width:auto;min-width:150px;padding:var(--sp-12) var(--sp-40) var(--sp-12) var(--sp-16);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t2);border-radius:var(--br-outer); }
.ra-select-sm      { min-width:130px; }
.ra-overview-row   { display:grid;grid-template-columns:repeat(5,1fr); }
.ra-ov-cell        { padding:0 var(--sp-24);border-right:1px solid var(--border); }
.ra-ov-cell:first-child { padding-left:0; }
.ra-ov-cell:last-child  { border-right:none;padding-right:0; }
.ra-ov-val         { font-size:var(--fs-24);font-weight:var(--fw-extrabold);color:var(--t1);/* line-height:1; */margin-bottom:var(--sp-8); }
.ra-ov-lbl         { font-size:var(--fs-12);color:var(--t4);/* line-height:1.4; */ }
.ra-section-sep    { border-top:1px solid var(--bg-mid);margin:var(--sp-20) 0; }

/* Organization Distribution pie */
.orgd-pie-stage    { position:relative;display:flex;justify-content:center;align-items:center;width:100%;min-height:320px;padding:var(--sp-32) var(--sp-96); }
.orgd-pie-stage .apexcharts-canvas { margin:0 auto; }
.orgd-pie-ext-labels { position:absolute;inset:0;pointer-events:none; }
.orgd-pie-ext-label  { position:absolute;font-size:var(--fs-14);font-weight:var(--fw-medium);font-family:'Inter',sans-serif;white-space:nowrap;/* line-height:1; */ }
.orgd-pie-stats    { display:flex;border-top:1px solid var(--bg-mid);margin-top:var(--sp-20);padding-top:var(--sp-16); }
.orgd-pie-stat     { flex:1;text-align:center; }
.orgd-pie-stat-val { font-size:var(--fs-20);font-weight:var(--fw-extrabold);color:var(--t1);/* line-height:1; */margin-bottom:var(--sp-4); }
.orgd-pie-stat-lbl { font-size:var(--fs-12);color:var(--t4); }

/* Top Revenue Organisations list */
.top-rev-plan      { font-size:var(--fs-12);color:var(--t5);margin-top:var(--sp-2); }

/* Revenue Trend: view tabs */
.ra-view-tabs      { display:inline-flex;background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-4);gap:var(--sp-2); }
.ra-view-tab       { padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--t4);background:none;border:none;border-radius:var(--br-inner);cursor:pointer;font-family:'Inter',sans-serif;transition:background var(--t-default),color var(--t-default); }
.ra-view-tab.active{ background:var(--border);color:var(--t1); }
.ra-trend-view     { display:none; }
.ra-trend-view.active { display:block; }
.ra-trend-chart-wrap,
.ra-bar-chart-wrap { position:relative; }
.ra-trend-legend   { display:flex;align-items:center;justify-content:center;gap:var(--sp-24);margin-top:var(--sp-14); }
.ra-trend-leg-item { display:inline-flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-12);color:var(--t3); }
.ra-trend-dot      { width:10px;height:10px;border-radius:50%;flex-shrink:0; }

/* Hover tooltip shared by line + bar charts */
.ra-tooltip        { position:absolute;transform:translate(-50%,-115%);background:var(--bg-alt);border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-12);font-size:var(--fs-12);pointer-events:none;opacity:0;visibility:hidden;transition:opacity var(--t-fast) ease;white-space:nowrap;box-shadow:0 8px 24px var(--black-a25);z-index:5; }
.ra-tooltip.show   { opacity:1;visibility:visible; }
.ra-tooltip.ra-tt-flip { transform:translate(-85%,-115%); }
.ra-tt-title       { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-8); }
.ra-tt-row         { display:flex;align-items:center;gap:var(--sp-8);color:var(--t3);margin-bottom:var(--sp-4); }
.ra-tt-row b       { color:var(--t1);font-weight:var(--fw-bold); }
.ra-tt-dot         { width:8px;height:8px;border-radius:50%;flex-shrink:0; }
.ra-tt-total       { margin-top:var(--sp-8);padding-top:var(--sp-8);border-top:1px solid var(--border);color:var(--t3); }
.ra-tt-total b     { color:var(--lime);font-weight:var(--fw-extrabold); }

/* Group view grouped bar chart */
.ra-bar-chart-wrap { display:flex;height:260px; }
.ra-bar-grid       { display:flex;flex-direction:column;justify-content:space-between;width:54px;flex-shrink:0; }
.ra-bar-gridline   { font-size:var(--fs-10);color:var(--white-a35);height:0;display:flex;align-items:center;justify-content:flex-end;padding-right:var(--sp-10); }
.ra-bar-groups     { flex:1;display:flex;align-items:flex-end;justify-content:space-around;gap:var(--sp-20);border-left:1px solid var(--bg-mid);border-bottom:1px solid var(--bg-mid);padding:0 var(--sp-10); }
.ra-bar-group      { flex:1;display:flex;align-items:flex-end;justify-content:center;gap:var(--sp-4);height:100%;cursor:pointer; }
.ra-bar            { width:14px;border-radius:var(--br-inner) var(--br-inner) 0 0;min-height:2px;transition:opacity var(--t-default) ease; }
.ra-bar-group:hover .ra-bar { opacity:0.7; }
.ra-bar-xlabels    { display:flex;justify-content:space-around;gap:var(--sp-20);padding:var(--sp-8) var(--sp-10) 0 var(--sp-64); }
.ra-bar-xlabels span { flex:1;text-align:center;font-size:var(--fs-12);color:var(--white-a35); }

/* ── 24. DOMAIN DASHBOARD ── */
.domain-banner    { background:linear-gradient(135deg,var(--lime-a10),var(--cyan-a10));border:1px solid var(--lime-a15);border-radius:var(--br-outer);padding:var(--sp-14) var(--sp-20);margin-bottom:var(--sp-14);display:flex;align-items:center;justify-content:space-between; }
.vz-summary-strip { display:grid;grid-template-columns:200px 1fr 280px;gap:0;background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);overflow:hidden;margin-bottom:var(--sp-14); }
.strip-sec        { padding:var(--sp-20) var(--sp-24);border-right:1px solid var(--border); }
.strip-sec:last-child { border-right:none; }
.strip-lbl        { font-size:var(--fs-10);font-weight:var(--fw-bold);/* letter-spacing:1.4px; */text-transform:uppercase;color:var(--white-a35);margin-bottom:var(--sp-10); }
.donut-wrap       { position:relative;width:80px;height:80px;margin:0 auto var(--sp-8); }
.donut-inner      { position:absolute;inset:0;display:flex;align-items:center;justify-content:center; }
.grade-pill-amber { background:var(--amber);color:var(--bg);border-radius:var(--br-full);padding:var(--sp-8) var(--sp-24);font-size:var(--fs-16);font-weight:var(--fw-extrabold);display:inline-block;margin-bottom:var(--sp-8); }
.cpb-table        { width:100%;border-collapse:collapse; }
.cpb-table th     { color:var(--white-a35);font-size:var(--fs-10);font-weight:var(--fw-bold);text-transform:uppercase;/* letter-spacing:.7px; */padding:var(--sp-10) var(--sp-14);text-align:left;border-bottom:1px solid var(--border); }
.cpb-table td     { padding:var(--sp-14) var(--sp-14);font-size:var(--fs-14);color:var(--t2);border-bottom:1px solid var(--bg-card);vertical-align:middle; }
.cpb-table tbody tr:last-child td { border-bottom:none; }
.gb-e  { background:var(--green);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-12);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.gb-m  { background:var(--amber);color:var(--bg);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-12);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.gb-d  { background:var(--orange);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-12);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.gb-r  { background:var(--red);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-12);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.status-done      { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--green);display:flex;align-items:center;gap:var(--sp-4); }
.impr-row         { border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-14) var(--sp-16);margin-bottom:var(--sp-10);background:var(--bg-subtle); }
.impr-row:last-child { margin-bottom:0; }
.impr-title-row   { display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-8); }
.impr-name        { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1); }
.impr-score       { font-size:var(--fs-14);color:var(--t4); }
.impr-bullets     { list-style:disc;padding-left:var(--sp-16);font-size:var(--fs-14);color:var(--t3);/* line-height:2; */ }
.bottom-grid      { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-14);margin-top:var(--sp-14); }

/* ── 25. DOMAIN DRILLDOWN ── */

/* ── Page title header ── */
.drilldown-header    { display:flex; align-items:center; justify-content:space-between; padding-top:var(--sp-20); margin-bottom:var(--sp-20); gap:var(--sp-20); flex-wrap:wrap; }
.dd-title-block      { display:flex; flex-direction:column; }
.dd-back-btn         { display:inline-flex; align-items:center; gap:var(--sp-8); padding:var(--sp-8) var(--sp-14); background:var(--bg-mid); border:1px solid var(--border-md); border-radius:var(--br-full); font-size:var(--fs-12); font-weight:var(--fw-semibold); color:var(--t3); text-decoration:none; margin-bottom:var(--sp-12); width:fit-content; transition:background var(--t-fast), color var(--t-fast); }
.dd-back-btn:hover   { background:var(--border-md); color:var(--t1); }
.dd-main-title       { font-size:var(--fs-22); font-weight:var(--fw-extrabold); color:var(--t1); margin:0 0 var(--sp-4); /* letter-spacing:-0.3px; */ }
.dd-main-sub         { font-size:var(--fs-14); color:var(--t4); margin:0; }
.overall-score-badge { display:flex; align-items:center; gap:var(--sp-16);
  /* background:var(--bg-card);
  border:1px solid var(--border-md);  */
  border-radius:var(--br-outer);
  /* padding:var(--sp-14) var(--sp-20);  */
  flex-shrink:0; }
#ddScoreChart        { width:130px; min-height:130px; }
.dd-score-info       { display:flex; flex-direction:column; gap:var(--sp-8); }
.dd-score-lbl        { font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--t2); white-space:nowrap; }

/* ── Domain section headers ── */
.dd-domain-hdr     { font-size:var(--fs-12); font-weight:var(--fw-bold); /* letter-spacing:1.2px; */ text-transform:uppercase; color:var(--t1); padding:var(--sp-20) var(--sp-16) var(--sp-16); background:transparent; }
/* .dd-domain-hdr-sep — top spacing comes from accordion margin-bottom below */

/* ── Bootstrap accordion overrides ── */
.dd-accordion {
  --bs-accordion-bg:           transparent;
  --bs-accordion-border-color: transparent;
  --bs-accordion-btn-bg:       transparent;
  --bs-accordion-btn-color:    var(--t2);
  --bs-accordion-active-bg:    var(--bg-subtle);
  --bs-accordion-active-color: var(--t1);
  border: 1px solid var(--border-md);
  border-radius: var(--br-outer);
  overflow: hidden;
  margin: 0 0 var(--sp-24);
}
.dd-acc-item { background:transparent; border:none; border-top:1px solid var(--bg-mid); }
.dd-acc-item:first-child { border-top:none; }

.dd-acc-btn {
  display: flex; align-items: center; gap: var(--sp-12);
  padding: var(--sp-14) var(--sp-16); width: 100%;
  background: transparent; box-shadow: none !important;
  border: none; font-size:var(--fs-14); font-weight:var(--fw-medium);
  font-family: 'Inter', sans-serif; color: var(--t2);
  transition: background var(--t-fast);
}
.dd-acc-btn::after   { display: none; } /* remove Bootstrap's default chevron */
.dd-acc-btn:focus    { box-shadow: none !important; outline: none; }
.dd-acc-btn:not(.collapsed) { background: var(--bg-subtle); color: var(--t1); }
.dd-acc-btn:hover    { background: var(--bg-card); }

/* Left chevron — rotates when open */
.dd-acc-chev { font-size:var(--fs-12); color:var(--t5); transition:transform var(--t-default) ease, color var(--t-default); flex-shrink:0; }
.dd-acc-btn:not(.collapsed) .dd-acc-chev { transform:rotate(90deg); color:var(--lime); }

/* Control name */
.dd-acc-name { flex:1; font-size:var(--fs-14); color:inherit; text-align:left; }

/* Right-side: score + badge */
.dd-acc-meta  { display:flex; align-items:center; justify-content:space-between; gap:var(--sp-10); margin-left:auto; min-width:260px; flex-shrink:0; }
.dd-acc-score { font-size:var(--fs-14); font-weight:var(--fw-semibold); color:var(--t3); }

/* Accordion body */
.dd-acc-body { padding:var(--sp-12) var(--sp-16) var(--sp-16) var(--sp-40); background:var(--bg-subtle); border-top:1px solid var(--bg-card); }

/* Questions label inside accordion body */
.dd-q-lbl { font-size:var(--fs-10); font-weight:var(--fw-bold); color:var(--t5); /* letter-spacing:.5px; */ text-transform:uppercase; padding:var(--sp-8) 0 var(--sp-8); }

/* Existing shared badge / panel styles (unchanged) */
.gb-reactive    { background:linear-gradient(135deg, rgba(239,68,68,0.25), rgba(239,68,68,0.15));color:var(--red);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);white-space:nowrap; border:1px solid var(--red-bd); }
.gb-managed     { background:var(--amber-a10);color:var(--amber);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);white-space:nowrap; border:1px solid var(--amber-bd); }
.gb-established { background:var(--lime-a15);color:var(--lime);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);white-space:nowrap; border:1px solid var(--lime-a15); }
.gb-optimized   { background:var(--cyan-bg);color:var(--cyan);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);white-space:nowrap; border:1px solid var(--cyan-bg); }
.gb-intelligent { background:rgba(168,85,247,0.18);color:var(--purple);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);white-space:nowrap; border:1px solid rgba(168,85,247,0.3); }
.gb-critical    { background:var(--red);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);white-space:nowrap; }
.gb-developing  { background:var(--orange);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);white-space:nowrap; }
.gb-high-risk   { background:var(--red);color:var(--t1);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);white-space:nowrap; }
.improvement-panel    { background:var(--amber-a10);border:1px solid var(--amber-bd);border-radius:var(--br-inner);padding:var(--sp-12) var(--sp-14);margin-bottom:var(--sp-10);display:none; }
.improvement-panel.open { display:block; }
.improvement-title    { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--amber);margin-bottom:var(--sp-8);display:flex;align-items:center;gap:var(--sp-4); }
.improvement-bullets  { list-style:disc;padding-left:var(--sp-16);font-size:var(--fs-12);color:var(--t3);/* line-height:1.9; */margin:0; }
.questions-panel      { background:var(--bg-subtle);border:1px solid var(--bg-mid);border-radius:var(--br-inner);padding:var(--sp-12) var(--sp-16);margin-top:var(--sp-8);display:none; }
.questions-panel.open { display:block; }
.q-assessed-row       { display:flex;align-items:center;padding:var(--sp-8) 0;border-bottom:1px solid var(--bg-card);gap:var(--sp-10); }
.q-assessed-row:last-child { border-bottom:none; }
.q-assessed-text      { font-size:var(--fs-14);color:var(--t3);flex:1; }
.q-assessed-val       { font-size:var(--fs-14);font-weight:var(--fw-bold);flex-shrink:0;min-width:30px;text-align:right; }

/* Legacy table classes (kept for other pages) */
.domain-section-header { font-size:var(--fs-12);font-weight:var(--fw-bold);/* letter-spacing:1.2px; */text-transform:uppercase;color:var(--t4);padding:var(--sp-14) var(--sp-16) var(--sp-8);background:var(--bg-subtle);border-bottom:1px solid var(--bg-mid); }
.ctrl-table           { width:100%;border-collapse:collapse; }
.ctrl-table td        { padding:var(--sp-14) var(--sp-16);font-size:var(--fs-14);color:var(--t3);border-bottom:1px solid var(--bg-card);vertical-align:middle; }
.ctrl-table tbody tr:last-child td { border-bottom:none; }
.ctrl-table tbody tr  { transition:background var(--t-fast);cursor:pointer; }
.ctrl-table tbody tr:hover { background:var(--bg-subtle); }
.ctrl-expand-row      { cursor:pointer; }
.ctrl-chevron         { transition:transform var(--t-default);color:var(--white-a35);font-size:var(--fs-12); }
.ctrl-expand-row.open .ctrl-chevron { transform:rotate(90deg); }

/* ── 26. REPORTS ── */
.rep-overview-card { background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-24) var(--sp-28);margin-bottom:var(--sp-14); }
.rep-grid-top      { display:grid;grid-template-columns:auto 1fr auto;gap:var(--sp-24);align-items:center;margin-bottom:var(--sp-24); }
.heatmap-grid      { display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-10); }
/* heatmap-grid tiles — mirrors d1-dt exactly */
.hm-tile {
  border-radius:var(--br-outer); padding:var(--sp-16) var(--sp-14); text-decoration:none; display:block;
  position:relative; overflow:hidden; min-height:110px; cursor:pointer;
  transition:transform var(--t-default) cubic-bezier(0.34,1.56,0.64,1), box-shadow var(--t-default) ease, background var(--t-default) ease, border-color var(--t-default) ease;
}
.hm-tile::before {
  content:''; position:absolute; top:0; left:0;
  width:55%; height:100%;
  background:linear-gradient(105deg, transparent 0%, var(--border) 50%, transparent 100%);
  transform:translateX(-160%); transition:transform var(--t-slow) ease;
  pointer-events:none; border-radius:inherit;
}
.hm-tile:hover::before { transform:translateX(260%); }
.hm-tile > * { position:relative; z-index:1; }
.hm-tile .score { font-size:var(--fs-28); font-weight:var(--fw-black); /* line-height:1; */ margin-bottom:var(--sp-4); display:inline-block; transition:transform var(--t-default) cubic-bezier(0.34,1.56,0.64,1); transform-origin:left center; }
.hm-tile:hover .score { transform:scale(1.13); }
.hm-tile .name  { font-size:var(--fs-12); font-weight:var(--fw-semibold); /* line-height:1.3; */ margin-bottom:var(--sp-4); }
.hm-tile .grade { font-size:var(--fs-12); font-weight:var(--fw-semibold); opacity:.85; }
.hm-tile .arrow { position:absolute; right:var(--pos-12); bottom:var(--pos-12); width:24px; height:24px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:var(--fs-10); transition:transform var(--t-default) cubic-bezier(0.34,1.56,0.64,1), background var(--t-default) ease; }
.hm-tile:hover .arrow { transform:translateX(4px); }
/* Arrow colour variants — mirrors d1-arrow-* */
.hm-arrow-green  { background:var(--green-bd);  color:var(--green); }
.hm-arrow-amber  { background:var(--amber-bd);  color:var(--amber); }
.hm-arrow-orange { background:var(--orange-bd);  color:var(--orange); }
.hm-arrow-red    { background:var(--red-bd);   color:var(--red); }
/* Arrow brightens on hover — mirrors d1-dt-*:hover .d1-dt-arrow */
.hm-established:hover .arrow { background:var(--green-bd); }
.hm-managed:hover     .arrow { background:var(--amber-a50); }
.hm-developing:hover  .arrow { background:var(--orange-bd); }
.hm-high-risk:hover   .arrow { background:var(--red-a62); }
/* Grade colour variants — mirrors d1-dt-* */
.hm-established { background:var(--green-a05);  border:1px solid var(--green-bd);  color:var(--green); }
.hm-managed     { background:var(--amber-a10);  border:1px solid var(--amber-bd);  color:var(--amber); }
.hm-developing  { background:var(--orange-a15);  border:1px solid var(--orange-bd);  color:var(--orange); }
.hm-high-risk   { background:var(--red-a10);   border:1px solid var(--red-bd);   color:var(--red); }
/* Hover — lift + deep colored glow + inset rim — mirrors d1-dt-*:hover */
.hm-established:hover { transform:translateY(-7px); background:var(--green-bd);  border-color:var(--green-a85);  box-shadow:0 16px 40px var(--green-bd),  0 0 0 1px var(--green-bd)  inset; color:var(--green); }
.hm-managed:hover     { transform:translateY(-7px); background:var(--amber-bd);  border-color:var(--amber-a50);  box-shadow:0 16px 40px var(--amber-bd),  0 0 0 1px var(--amber-bd)  inset; color:var(--amber); }
.hm-developing:hover  { transform:translateY(-7px); background:var(--orange-bd);  border-color:var(--orange-a82);  box-shadow:0 16px 40px var(--orange-bd),  0 0 0 1px var(--orange-a15)  inset; color:var(--orange); }
.hm-high-risk:hover   { transform:translateY(-7px); background:var(--red-bd);   border-color:var(--red-a62);   box-shadow:0 16px 40px var(--red-bd),   0 0 0 1px var(--red-bd)   inset; color:var(--red); }
/* Reports page utilities */
.rep-overview-lbl { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-16); }
.rep-org-name     { font-size:var(--fs-22);font-weight:var(--fw-extrabold);color:var(--t1);/* line-height:1.2; */ }
.rep-meta-item    { display:inline-flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t3); }
.rep-meta-ico     { color:var(--t5);font-size:var(--fs-12); }
.rep-score-lbl    { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1); }
.rep-heatmap-lbl  { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1); }
.rep-heatmap-sub  { font-size:var(--fs-12);color:var(--t4); }
.prev-ico-primary { font-size:var(--fs-16);color:var(--purple);cursor:pointer;margin-right:var(--sp-10);transition:color var(--t-fast); }
.prev-ico-primary:hover { color:var(--cyan); }
.prev-ico-muted   { font-size:var(--fs-16);color:var(--t5);cursor:pointer;transition:color var(--t-fast); }
.prev-ico-muted:hover { color:var(--t2); }
#repScoreChart    { width:130px;min-height:130px;flex-shrink:0; }

/* ── 27. PDF REPORT (dark theme — matches project color system) ── */
.pdf-page {
  max-width: 900px; margin: 0 auto; padding: var(--sp-32) var(--sp-40);
  background: var(--bg-alt); min-height: 100vh;
  /* Subtle lime glow at top for creative depth */
  background-image: radial-gradient(ellipse 70% 300px at 50% 0, var(--lime-a10) 0%, transparent 100%);
}
.pdf-header       { display:flex; align-items:flex-start; justify-content:space-between; padding-bottom:var(--sp-20); border-bottom:1px solid var(--border-md); margin-bottom:var(--sp-28); }
/* Logo: lime→cyan gradient text */
.pdf-logo-text    { font-size:var(--fs-26); font-weight:var(--fw-black); /* letter-spacing:-1px; */ background:var(--grad); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.pdf-logo-sub     { font-size:var(--fs-12); color:var(--t4); margin-top:var(--sp-4); }
.pdf-report-title { text-align:right; }
.pdf-report-title h3 { font-size:var(--fs-18); font-weight:var(--fw-bold); color:var(--t1); margin:0; /* line-height:1.55; */ }
/* Org card: glass card + lime left-border accent */
.org-card         { background:var(--bg-card); border:1px solid var(--border-md); border-left:3px solid var(--lime); border-radius:var(--br-outer); padding:var(--sp-24); margin-bottom:var(--sp-28); display:grid; grid-template-columns:1fr auto; gap:var(--sp-24); align-items:center; }
.org-name         { font-size:var(--fs-26); font-weight:var(--fw-black); color:var(--t1); margin-bottom:var(--sp-14); }
.meta-grid        { display:grid; grid-template-columns:repeat(1,auto); gap:var(--sp-8) var(--sp-24); }
.meta-item        { display:flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-14); color:var(--t3); }
.meta-item i      { color:var(--t4); font-size:var(--fs-12); }
.org-score-row    { display:flex; align-items:center; gap:var(--sp-12); }
.org-score-lbl    { font-size:var(--fs-14); font-weight:var(--fw-semibold); color:var(--t2); }
.overall-score {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.score-circle     { width:130px; height:130px; position:relative; }
.score-circle svg { transform:rotate(-90deg); }
.score-inner      { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.score-big        { font-size:var(--fs-28); font-weight:var(--fw-black); color:var(--t1); /* line-height:1; */ }
.score-denom      { font-size:var(--fs-14); color:var(--t4); }
#pdfScoreChart    { width:130px; min-height:130px; }
.grade-badge      { background:var(--green); color:var(--t1); border-radius:var(--br-full); padding:var(--sp-8) var(--sp-20); font-size:var(--fs-14); font-weight:var(--fw-bold); display:inline-block; margin-top:var(--sp-8); }
/* Section titles: lime underline accent */
.section-title    { font-size:var(--fs-18); font-weight:var(--fw-bold); color:var(--t1); margin:var(--sp-28) 0 var(--sp-12); border-bottom:2px solid var(--lime); padding-bottom:var(--sp-8); }
.exec-summary     { font-size:var(--fs-14); color:var(--t3); /* line-height:1.8; */ margin-bottom:var(--sp-28); }
.domain-table     { width:100%; border-collapse:collapse; }
.domain-table th  { text-align:left; padding:var(--sp-12) var(--sp-14); font-size:var(--fs-12); color:var(--t4); font-weight:var(--fw-semibold); border-bottom:1px solid var(--border-md); text-transform:uppercase; /* letter-spacing:.5px; */ }
.domain-table td  { padding:var(--sp-12) var(--sp-14); font-size:var(--fs-14); color:var(--t2); border-bottom:1px solid var(--border); }
.domain-table tbody tr:last-child td { border-bottom:none; }
.domain-table tbody tr:hover td { background:var(--bg-subtle); }
.back-btn         { display:inline-flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-14); color:var(--t3); text-decoration:none; background:var(--bg-mid); border:1px solid var(--border-md); border-radius:var(--br-inner); padding:var(--sp-8) var(--sp-16); margin-bottom:var(--sp-24); transition:background var(--t-fast), color var(--t-fast); }
.back-btn:hover   { background:var(--border-md); color:var(--t1); }
.pdf-footer-row   { display:flex; align-items:center; justify-content:space-between; margin-top:var(--sp-32); padding-top:var(--sp-20); border-top:1px solid var(--border); }
.pdf-footer-lbl   { font-size:var(--fs-12); color:var(--t5); }
.btn-print        { background:var(--grad); border:none; border-radius:var(--br-full); padding:var(--sp-10) var(--sp-24); font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--bg); cursor:pointer; font-family:'Inter',sans-serif; display:inline-flex; align-items:center; gap:var(--sp-8); text-decoration:none; transition:opacity var(--t-default); }
.btn-print:hover  { opacity:.88; }
/* rb-* badges: dark-theme adaptation using project color tokens */
.rb-established   { background:var(--green-bg); color:var(--green); border:1px solid var(--green-bd); border-radius:var(--br-full); padding:var(--sp-4) var(--sp-12); font-size:var(--fs-12); font-weight:var(--fw-bold); white-space:nowrap; display:inline-block; }
.rb-managed       { background:var(--amber-bg); color:var(--amber); border:1px solid var(--amber-bd); border-radius:var(--br-full); padding:var(--sp-4) var(--sp-12); font-size:var(--fs-12); font-weight:var(--fw-bold); white-space:nowrap; display:inline-block; }
.rb-developing    { background:var(--orange-bg); color:var(--orange); border:1px solid var(--orange-bd); border-radius:var(--br-full); padding:var(--sp-4) var(--sp-12); font-size:var(--fs-12); font-weight:var(--fw-bold); white-space:nowrap; display:inline-block; }
.rb-high-risk     { background:var(--red-bg); color:var(--red); border:1px solid var(--red-bd); border-radius:var(--br-full); padding:var(--sp-4) var(--sp-12); font-size:var(--fs-12); font-weight:var(--fw-bold); white-space:nowrap; display:inline-block; }

/* ── PDF Report: multi-page layout ── */
.pdf-report-wrap  { background:var(--bg); padding:var(--sp-24) var(--sp-16) var(--sp-40); }
/* Each page sits as a card in the scroll; remove min-height for non-first pages */
.pdf-report-wrap .pdf-page { min-height:auto; margin:0 auto var(--sp-20); }
/* Repeat header on each inner page */
.pdf-page-header  { display:flex; align-items:flex-start; justify-content:space-between; padding-bottom:var(--sp-14); border-bottom:1px solid var(--border-md); margin-bottom:var(--sp-24); }

/* Control breakdown (static report rows — no accordion) */
.ctrl-rpt-domain  { font-size:var(--fs-12); font-weight:var(--fw-bold); /* letter-spacing:1.2px; */ text-transform:uppercase; color:var(--t4); padding:var(--sp-10) var(--sp-14) var(--sp-8); background:var(--bg-subtle); border-bottom:1px solid var(--border); }
.ctrl-rpt-table   { width:100%; border-collapse:collapse; margin-bottom:var(--sp-2); }
.ctrl-rpt-table td { padding:var(--sp-10) var(--sp-14); font-size:var(--fs-14); color:var(--t2); border-bottom:1px solid var(--border); vertical-align:middle; }
.ctrl-rpt-table tr:last-child td { border-bottom:none; }
.ctrl-rpt-score   { font-size:var(--fs-14); font-weight:var(--fw-semibold); color:var(--t3); width:96px; }
.ctrl-rpt-badge   { width:126px; text-align:right; }

/* Improvement Recommendations */
.impr-rpt-wrap    { margin-bottom:var(--sp-4); }
.impr-rpt-item    { padding:var(--sp-12) 0; border-bottom:1px solid var(--border); }
.impr-rpt-item:last-child { border-bottom:none; }
.impr-rpt-hdr     { display:flex; align-items:center; gap:var(--sp-8); margin-bottom:var(--sp-4); }
.impr-rpt-dot     { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.impr-rpt-name    { font-size:var(--fs-14); font-weight:var(--fw-semibold); color:var(--t1); }
.impr-rpt-score   { font-size:var(--fs-14); color:var(--t4); }
.impr-rpt-bullets { list-style:disc; padding-left:var(--sp-20); font-size:var(--fs-14); color:var(--t3); /* line-height:1.75; */ margin:var(--sp-4) 0 0; }

/* Azvizory Expert Recommendations */
.azviz-meta-row   { display:flex; align-items:center; gap:var(--sp-10); font-size:var(--fs-12); color:var(--t4); margin-bottom:var(--sp-16); padding:var(--sp-10) var(--sp-14); background:var(--bg-card); border-radius:var(--br-inner); border:1px solid var(--border); }
.azviz-meta-sep   { color:var(--border-md); }
.azviz-rpt-card   { background:var(--bg-card); border:1px solid var(--border-md); border-radius:var(--br-outer); padding:var(--sp-16) var(--sp-20); margin-bottom:var(--sp-14); }
.azviz-rpt-title  { display:flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--t1); margin-bottom:var(--sp-10); }
.azviz-rpt-dot    { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.azviz-rpt-score  { font-size:var(--fs-14); color:var(--t4); font-weight:var(--fw-regular); }
.expert-lbl       { font-size:var(--fs-10); font-weight:var(--fw-extrabold); /* letter-spacing:1px; */ text-transform:uppercase; color:var(--lime); margin:var(--sp-12) 0 var(--sp-4); }
.expert-body      { font-size:var(--fs-14); color:var(--t3); /* line-height:1.7; */ margin:0; }
.expert-list      { list-style:disc; padding-left:var(--sp-20); font-size:var(--fs-14); color:var(--t3); /* line-height:1.75; */ margin:var(--sp-4) 0 0; }

/* Assessment Details */
.assess-table     { width:100%; border-collapse:collapse; }
.assess-table tr  { border-bottom:1px solid var(--border); }
.assess-table tr:last-child { border-bottom:none; }
.assess-table td  { padding:var(--sp-12) 0; font-size:var(--fs-14); vertical-align:top; }
.assess-lbl       { width:220px; color:var(--t4); font-weight:var(--fw-medium); }
.assess-val       { color:var(--t1); font-weight:var(--fw-semibold); }

/* Footer note */
.pdf-report-note  { font-size:var(--fs-12); color:var(--t5); text-align:center; margin-top:var(--sp-28); padding-top:var(--sp-16); border-top:1px solid var(--border); font-style:italic; }

/* Invoice-specific classes */
.inv-chevron      { font-size:var(--fs-12); }
.inv-header       { display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:var(--sp-24);border-bottom:2px solid var(--gray-light);margin-bottom:var(--sp-28); }
.inv-brand-name   { font-size:var(--fs-28);font-weight:var(--fw-black);color:var(--bg-alt);/* letter-spacing:-1px; */margin-bottom:var(--sp-4); }
.inv-brand-tag    { font-size:var(--fs-12);color:var(--gray-2);margin-bottom:var(--sp-12); }
.inv-from-addr    { font-size:var(--fs-12);color:var(--gray-1);/* line-height:1.8; */ }
.inv-title-word   { font-size:var(--fs-28);font-weight:var(--fw-black);color:var(--bg-alt);margin-bottom:var(--sp-8); }
.inv-meta-grid    { display:grid;grid-template-columns:auto auto;gap:var(--sp-4) var(--sp-16);text-align:left;font-size:var(--fs-14); }
.inv-meta-lbl     { color:var(--gray-2); }
.inv-meta-val     { font-weight:var(--fw-bold);color:var(--dark-green); }
.inv-meta-date    { font-weight:var(--fw-semibold);color:var(--dark-navy); }
.inv-mono         { font-family:monospace; }
.inv-status-paid  { background:var(--green-100);color:var(--green-600);border-radius:var(--br-inner);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.inv-parties      { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-24);margin-bottom:var(--sp-28); }
.inv-section-lbl  { font-size:var(--fs-10);font-weight:var(--fw-bold);text-transform:uppercase;/* letter-spacing:.8px; */color:var(--gray-2);margin-bottom:var(--sp-8); }
.inv-party-name   { font-size:var(--fs-16);font-weight:var(--fw-extrabold);color:var(--dark-green);margin-bottom:var(--sp-8); }
.inv-party-addr   { font-size:var(--fs-14);color:var(--gray-1);/* line-height:1.8; */ }
.inv-strong       { color:var(--dark-green); }
.inv-table        { width:100%;border-collapse:collapse;margin-bottom:var(--sp-24); }
.inv-thead-row    { background:var(--t1); }
.inv-th           { text-align:left;padding:var(--sp-12) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--gray-2);text-transform:uppercase;/* letter-spacing:.7px; */border-bottom:2px solid var(--gray-light); }
.inv-td           { padding:var(--sp-14);border-bottom:1px solid var(--gray-light); }
.inv-td-dim       { font-size:var(--fs-14);color:var(--gray-1); }
.inv-td-bold      { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--dark-green); }
.inv-item-name    { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--dark-green); }
.inv-item-desc    { font-size:var(--fs-12);color:var(--gray-2);margin-top:var(--sp-2); }
.inv-totals-wrap  { display:flex;justify-content:flex-end;margin-bottom:var(--sp-32); }
.inv-totals       { min-width:280px; }
.inv-total-row    { display:flex;justify-content:space-between;padding:var(--sp-8) 0;font-size:var(--fs-14);color:var(--gray-1);border-bottom:1px solid var(--gray-light); }
.inv-grand-total  { display:flex;justify-content:space-between;padding:var(--sp-12) 0;font-size:var(--fs-16);font-weight:var(--fw-black);color:var(--dark-green); }
.inv-paid-badge   { background:var(--green-100);border:1px solid var(--emerald-200);border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-14);text-align:center;font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--green-600); }
.inv-footer       { padding-top:var(--sp-20);border-top:1px solid var(--gray-light);display:flex;justify-content:space-between;align-items:center; }
.inv-footer-note  { font-size:var(--fs-12);color:var(--gray-3); }
.inv-footer-link  { color:var(--indigo-600); }
.inv-btn-print    { background:var(--gray-light);border:1px solid var(--gray-light);border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-20);font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--gray-1);cursor:pointer;font-family:'Inter',sans-serif;display:flex;align-items:center;gap:var(--sp-8); }
.inv-btn-download { background:var(--indigo-600);border:none;border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-20);font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t1);cursor:pointer;font-family:'Inter',sans-serif;display:flex;align-items:center;gap:var(--sp-8); }
.rb-established   { background:var(--green-100);color:var(--green-600);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.rb-managed       { background:var(--amber-100);color:var(--amber-700);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.rb-developing    { background:var(--orange-100);color:var(--orange-700);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.rb-high-risk     { background:var(--red-100);color:var(--red-600);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-12);font-weight:var(--fw-bold); }

/* ================================================================
   SETUP PAGE — Dark Mode (single source, no duplication)
   ================================================================ */

/* Outer scroll container */
.setup-outer {
  min-height:100vh;
  background:var(--bg-alt);
  padding:var(--sp-40) var(--sp-24) var(--sp-60);
  font-family:'Inter',sans-serif;
}

/* Centered content column */
.setup-wrapper {
  max-width:960px;
  margin:0 auto;
}

/* Page heading */
.setup-heading  { text-align:center;margin-bottom:var(--sp-32); }
.setup-title    { font-size:var(--fs-26);font-weight:var(--fw-extrabold);color:var(--t1);margin-bottom:var(--sp-8);/* letter-spacing:-0.3px; */ }
.setup-subtitle { font-size:var(--fs-14);color:var(--t4);/* line-height:1.5; */ }

/* Section card */
.setup-card {
  background:var(--bg-card);
  border:1px solid var(--border-md);
  border-radius:var(--br-outer);
  padding:var(--sp-24) var(--sp-24);
  margin-bottom:var(--sp-14);
}

/* Section label (lime accent) */
.setup-section-lbl {
  font-size:var(--fs-14);font-weight:var(--fw-bold);
  color:var(--lime);
  margin-bottom:var(--sp-16);
  display:block;
}
.setup-section-inline { margin-bottom:0;display:inline; }

/* Two-column layout for form fields */
.setup-two-col {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--sp-60);
}

/* Logo + fields grid */
.setup-logo-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--sp-60);
  align-items:start;
}
.setup-logo-col   { display:flex;flex-direction:column;gap:var(--sp-8); }
.setup-fields-col { display:flex;flex-direction:column; }

/* FilePond wrapper — controls the visible drop-zone size */
.setup-logo-drop {
  border: 2px dashed var(--border-lg);
  border-radius: var(--br-outer);
  cursor: pointer;
  transition: border-color var(--t-default);
  background: var(--bg-subtle);
  min-height: 168px;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.setup-logo-drop:hover { border-color: var(--lime); }

/* FilePond idle label — custom HTML injected via labelIdle option */
.fp-idle {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-8);
  padding: var(--sp-20) var(--sp-16);
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}
.fp-idle-icon {
  font-size:var(--fs-24);
  color: var(--t3);
  display: block;
  margin-bottom: var(--sp-2);
}
.fp-idle-lbl {
  font-size:var(--fs-12);
  font-weight:var(--fw-medium);
  color: var(--t2);
  /* line-height: 1.4; */
  white-space: normal;
  word-break: break-word;
}
.fp-idle-hint {
  font-size:var(--fs-12);
  color: var(--t5);
  white-space: normal;
}

/* FilePond dark-mode overrides — scoped to logo drop area only */

/* Root must fill the flex container width-AND-height */
.setup-logo-drop .filepond--root {
  width: 100% !important;
  height: 100% !important;
  min-height: 168px;
  margin-bottom: 0 !important;
}
.setup-logo-drop .filepond--wrapper {
  width: 100%;
  height: 100%;
  min-height: 168px;
}

/* Background panels — transparent so our dashed border shows */
.setup-logo-drop .filepond--panel-root,
.setup-logo-drop .filepond--panel       { background:transparent !important; }

/* Drop-label: full-width flex centering container */
.setup-logo-drop .filepond--drop-label {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 168px;
  left: auto !important;
  right: auto !important;
  color: var(--t4) !important;
}

/* Label action: block + full width so fp-idle content centres properly */
.setup-logo-drop .filepond--label-action {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  text-decoration: none !important;
  color: inherit !important;
  cursor: pointer !important;
}

.setup-logo-drop .filepond--drip-blob          { background: var(--lime) !important; }
.setup-logo-drop .filepond--item-panel          { background: var(--bg-mid) !important; }
.setup-logo-drop .filepond--file-action-button  { background: var(--border-lg) !important; }

/* Field group */
.setup-field-group            { margin-bottom:var(--sp-12); }
.setup-field-group:last-child { margin-bottom:0; }
.setup-field-lbl {
  display:block;
  font-size:var(--fs-12);font-weight:var(--fw-semibold);
  color:var(--t3);
  margin-bottom:var(--sp-4);
}

/* Dark inputs — used exclusively on setup page */
.setup-inp {
  width:100%;padding:var(--sp-10) var(--sp-12);
  background:var(--bg-mid);
  border:1px solid var(--border-md);
  border-radius:var(--br-inner);color:var(--t1);
  font-size:var(--fs-14);font-family:'Inter',sans-serif;
  box-sizing:border-box;transition:border var(--t-default);
}
.setup-inp::placeholder { color:var(--t5); }
.setup-inp:focus        { outline:none;border-color:var(--lime-a60); }
.setup-inp:disabled     { color:var(--t4);cursor:default;opacity:.8; }

/* Dark select — used exclusively on setup page */
.setup-sel {
  width:100%;padding:var(--sp-10) var(--sp-12);
  background:var(--bg-mid);
  border:1px solid var(--border-md);
  border-radius:var(--br-inner);color:var(--t3);
  font-size:var(--fs-12);font-family:'Inter',sans-serif;
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'%3E%3Cpath d='M1 1l4 4 4-4' stroke='var(--white-a35)' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;
}
.setup-sel option { background:var(--dark-navy); }

/* Auto Verified badge */
.setup-verified-badge {
  display:inline-flex;align-items:center;gap:var(--sp-10);
  background:var(--green-a05);
  border:1px solid var(--green-bd);
  border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-14);
  margin-bottom:var(--sp-10);
}
.setup-verified-icon { color:var(--green);font-size:var(--fs-18);flex-shrink:0; }
.setup-verified-lbl  { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--green); }
.setup-verified-note { font-size:var(--fs-12);color:var(--t4); }
.setup-note {
  font-size:var(--fs-12);color:var(--t5);
  /* line-height:1.6; */margin-bottom:var(--sp-14);
}

/* Document upload dashed box */
.setup-doc-box {
  border:1px dashed var(--border-lg);
  border-radius:var(--br-inner);padding:var(--sp-16);
  background:var(--bg-subtle);
}
.setup-doc-title {
  font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--lime);
  margin-bottom:var(--sp-14);
}

/* Choose File row */
.setup-file-row     { display:flex;align-items:center;gap:var(--sp-10); }
.setup-file-btn {
  background:var(--grad);border:none;border-radius:var(--br-inner);
  padding:var(--sp-8) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);
  color:var(--bg);cursor:pointer;font-family:'Inter',sans-serif;
  white-space:nowrap;flex-shrink:0;transition:opacity var(--t-fast);
}
.setup-file-btn:hover    { opacity:.88; }
.setup-file-name         { font-size:var(--fs-12);color:var(--t5);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.setup-file-set          { color:var(--t2);font-weight:var(--fw-medium); }
.setup-hidden-input      { display:none; }

/* Scrollable table wrapper */
.setup-table-wrap { overflow-x:auto;margin-bottom:0; }

/* Tables */
.setup-table           { width:100%;border-collapse:collapse;min-width:480px; }
.setup-table th {
  font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t6);
  text-transform:uppercase;/* letter-spacing:.6px; */
  padding:var(--sp-10) var(--sp-12);text-align:left;
  border-bottom:1px solid var(--border);
  white-space:nowrap;
}
.setup-table td {
  padding:var(--sp-12) var(--sp-12);font-size:var(--fs-14);color:var(--t2);
  border-bottom:1px solid var(--bg-card);
  vertical-align:middle;
}
.setup-table tbody tr:last-child td { border-bottom:none; }
.setup-table tbody tr:hover td      { background:var(--bg-subtle); }
.setup-actions { white-space:nowrap;text-align:right; }

/* Action icon buttons */
.setup-icon-btn {
  background:none;border:none;cursor:pointer;
  padding:var(--sp-4) var(--sp-8);border-radius:var(--br-inner);
  color:var(--t4);font-size:var(--fs-14);
  transition:all var(--t-fast);
}
.setup-icon-btn:hover  { background:var(--border);color:var(--lime); }
.setup-icon-del:hover  { color:var(--red); }

/* Add-location row */
.setup-add-row {
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr auto;
  gap:var(--sp-8);align-items:center;
  padding-top:var(--sp-12);
  border-top:1px solid var(--bg-mid);
}

/* Shared add / invite button */
.setup-add-btn {
  background:var(--grad);border:none;border-radius:var(--br-inner);
  padding:var(--sp-10) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);
  color:var(--bg);cursor:pointer;font-family:'Inter',sans-serif;
  display:flex;align-items:center;gap:var(--sp-4);
  white-space:nowrap;transition:opacity var(--t-fast);
}
.setup-add-btn:hover { opacity:.88; }

/* Invite header */
.setup-invite-hd {
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:var(--sp-12);flex-wrap:wrap;gap:var(--sp-8);
}
.setup-seats-row     { display:flex;align-items:center;gap:var(--sp-14); }
.setup-seats-txt     { font-size:var(--fs-14);color:var(--t4); }
.setup-buy-seats-btn {
  background:none;border:none;
  font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--lime);
  cursor:pointer;font-family:'Inter',sans-serif;
  text-decoration:underline;padding:0;
}
.setup-seats-info {
  background:var(--lime-a10);
  border:1px solid var(--lime-a10);
  border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-14);
  font-size:var(--fs-12);color:var(--t3);
  margin-bottom:var(--sp-12);
}

/* Invite row — 6 fields + button */
.setup-invite-row {
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr auto;
  gap:var(--sp-8);align-items:center;
  padding-top:var(--sp-12);
  border-top:1px solid var(--bg-mid);
}
.setup-invite-btn { white-space:nowrap; }

/* Status & role badges for dark mode */
.setup-status-active  { background:var(--green-a05);color:var(--green);border:1px solid var(--green-bd);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.setup-status-pending { background:var(--amber-a10);color:var(--amber);border:1px solid var(--amber-bd);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.role-badge-admin   { background:var(--lime-a10);color:var(--lime);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.role-badge-contrib { background:var(--orange-a15);color:var(--orange);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-12);font-weight:var(--fw-bold); }

/* Footer buttons */
.setup-footer {
  display:flex;align-items:center;justify-content:space-between;
  margin-top:var(--sp-20);gap:var(--sp-12);
}
.setup-btn-back {
  background:var(--bg-mid);
  border:1px solid var(--border-lg);
  border-radius:var(--br-full);padding:var(--sp-12) var(--sp-28);
  font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t3);
  cursor:pointer;font-family:'Inter',sans-serif;
  transition:all var(--t-default);
}
.setup-btn-back:hover  { background:var(--border-md);color:var(--t1); }
.setup-btn-complete {
  background:var(--grad);border:none;
  border-radius:var(--br-full);padding:var(--sp-12) var(--sp-28);
  font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--bg);
  cursor:pointer;font-family:'Inter',sans-serif;
  transition:opacity var(--t-default);
}
.setup-btn-complete:hover { opacity:.9; }

/* Responsive */
@media(max-width:760px) {
  .setup-outer       { padding:var(--sp-24) var(--sp-14) var(--sp-40); }
  .setup-logo-grid   { grid-template-columns:1fr; }
  .setup-two-col     { grid-template-columns:1fr; }
  .setup-add-row     { grid-template-columns:1fr 1fr; }
  .setup-invite-row  { grid-template-columns:1fr 1fr; }
}

/* ── 29. PLAN SELECTION (light page) ── */
.plan-page        { max-width:1100px;margin:0 auto;padding:var(--sp-40) var(--sp-20); }
.plan-title       { text-align:center;margin-bottom:var(--sp-32); }
.plan-title h2    { font-size:var(--fs-28);font-weight:var(--fw-extrabold);color:var(--dark-green);margin-bottom:var(--sp-8); }
.plan-title p     { font-size:var(--fs-16);color:var(--gray-1); }
.plan-grid        { display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-16);margin-bottom:var(--sp-40); }
.light-plan-card  { border-radius:var(--br-outer);padding:var(--sp-24);border:1px solid var(--gray-light);background:var(--t1);position:relative;transition:all var(--t-default); }
.light-plan-card:hover { box-shadow:0 6px 24px var(--black-a15); }
.light-plan-card.featured { border-color:var(--indigo-600);box-shadow:0 4px 20px var(--purple-bg); }
.light-plan-badge { position:absolute;top:calc(var(--pos-4) * -1);right:var(--pos-16);background:var(--indigo-600);color:var(--t1);font-size:var(--fs-10);font-weight:var(--fw-extrabold);padding:var(--sp-4) var(--sp-12);border-radius:0 0 var(--br-inner) var(--br-inner); }
/* plan-selection.html plan cards (light page) */
.plan-card        { border-radius:var(--br-outer);padding:var(--sp-24);border:1px solid var(--gray-light);background:var(--t1);position:relative;transition:all var(--t-default); }
.plan-card:hover  { box-shadow:0 6px 24px var(--black-a15); }
.plan-card.featured { border-color:var(--indigo-600);box-shadow:0 4px 20px var(--purple-bg); }
/* .plan-badge       { position:absolute;top:calc(var(--pos-4) * -1);right:var(--pos-16);background:var(--indigo-600);color:var(--t1);font-size:var(--fs-10);font-weight:var(--fw-extrabold);padding:var(--sp-4) var(--sp-12);border-radius:0 0 var(--br-inner) var(--br-inner); } */
.plan-icon        { width:48px;height:48px;border-radius:var(--br-outer);display:flex;align-items:center;justify-content:center;font-size:var(--fs-22);margin-bottom:var(--sp-12); }
.plan-icon-green  { background:var(--green-a05);color:var(--green); }
.plan-icon-purple { background:var(--gray-light);color:var(--indigo-600); }
.plan-icon-amber  { background:var(--orange-a15);color:var(--orange); }
.plan-icon-indigo { background:var(--purple-a10);color:var(--purple); }
.plan-name-green  { color:var(--green); }
.plan-name-purple { color:var(--indigo-600); }
.plan-name-amber  { color:var(--orange); }
.plan-name-indigo { color:var(--purple); }
.plan-desc        { font-size:var(--fs-14);color:var(--gray-1);margin-bottom:var(--sp-14);/* line-height:1.5; */ }
.plan-features    { list-style:none;padding:0;margin:0 0 var(--sp-16);font-size:var(--fs-14);color:var(--gray-1); }
.plan-features li { display:flex;align-items:flex-start;gap:var(--sp-8);margin-bottom:var(--sp-8); }
.plan-features li i { flex-shrink:0;font-size:var(--fs-10);margin-top:var(--sp-4); }
.plan-check-green  { color:var(--green); }
.plan-check-purple { color:var(--indigo-600); }
.plan-check-amber  { color:var(--orange); }
.plan-check-indigo { color:var(--purple); }
.plan-price       { font-size:var(--fs-24);font-weight:var(--fw-black);color:var(--dark-green);margin-bottom:var(--sp-4); }
.plan-price span  { font-size:var(--fs-14);font-weight:var(--fw-regular);color:var(--gray-2); }
.plan-price-yr    { font-size:var(--fs-12);color:var(--gray-2);margin-bottom:var(--sp-14); }
.plan-price-yr span { font-weight:var(--fw-medium);color:var(--gray-1); }
.plan-price-yr-wrap { font-size:var(--fs-12);color:var(--gray-2);margin-bottom:var(--sp-8); }
.plan-btn         { width:100%;padding:var(--sp-12);border-radius:var(--br-inner);font-size:var(--fs-14);font-weight:var(--fw-bold);cursor:pointer;font-family:'Inter',sans-serif;transition:all var(--t-default); }
.plan-btn-primary { background:var(--indigo-600);border:none;color:var(--t1); }
.plan-btn-primary:hover { background:var(--indigo-600); }
.plan-btn-outline { background:transparent;border:1.5px solid var(--gray-light);color:var(--gray-1); }
.plan-btn-outline:hover { border-color:var(--indigo-600);color:var(--indigo-600); }
.plan-btn-mb      { margin-bottom:var(--sp-8); }
/* comparison table wrapper */
.comp-table-wrap  { background:var(--t1);border-radius:var(--br-outer);padding:var(--sp-24);border:1px solid var(--gray-light); }
.comp-table-title { font-size:var(--fs-18);font-weight:var(--fw-bold);color:var(--dark-green);margin-bottom:var(--sp-20); }
.comp-table       { width:100%;border-collapse:collapse; }
.comp-table th    { text-align:left;padding:var(--sp-12) var(--sp-16);font-size:var(--fs-14);color:var(--gray-2);font-weight:var(--fw-semibold);border-bottom:2px solid var(--gray-light); }
.comp-table th:first-child { color:var(--dark-green);font-weight:var(--fw-bold); }
.comp-table td    { padding:var(--sp-12) var(--sp-16);font-size:var(--fs-14);color:var(--gray-1);border-bottom:1px solid var(--gray-light); }
.comp-table tbody tr:last-child td { border-bottom:none; }
.comp-table td:first-child { font-weight:var(--fw-medium);color:var(--dark-navy); }
.comp-check       { color:var(--green);font-size:var(--fs-16); }
.comp-cross       { color:var(--red);font-size:var(--fs-14); }

/* ── 30. ADMIN SCREENS ── */
.org-avatar       { width:32px;height:32px;border-radius:var(--br-inner);display:flex;align-items:center;justify-content:center;font-size:var(--fs-12);font-weight:var(--fw-extrabold);flex-shrink:0; }
.table-toolbar    { display:flex;align-items:center;gap:var(--sp-10);flex-wrap:wrap;margin-bottom:var(--sp-16); }
.search-box       { display:flex;align-items:center;gap:var(--sp-8);background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-12) var(--sp-14);flex:1;min-width:200px;box-sizing:border-box; }
.search-box input { background:none;border:none;
  outline:none;
  color:var(--t1);font-size:var(--fs-14);font-family:'Inter',sans-serif;width:100%;pointer-events: auto; }
.search-box input::placeholder { color:var(--t5); }
.filter-select    { background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-14);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t3);cursor:pointer;font-family:'Inter',sans-serif;appearance:none;-webkit-appearance:none;z-index: 1;box-sizing:border-box; }
.filter-select option { background:var(--dark-green);color:var(--t1); }
.btn-lime         { background:var(--lime-a10);border:1px solid var(--lime-a15);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--lime);cursor:pointer;font-family:'Inter',sans-serif;display:flex;align-items:center;gap:var(--sp-8);white-space:nowrap; }
.btn-lime:hover   { background:var(--lime-a15); }
.btn-ghost        { background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--t3);cursor:pointer;font-family:'Inter',sans-serif;display:flex;align-items:center;gap:var(--sp-8); }
.pagination-bar   { display:flex;align-items:center;justify-content:space-between;padding:var(--sp-14) 0 0;flex-wrap:wrap;gap:var(--sp-8); }
.pagination-info  { font-size:var(--fs-12);color:var(--t6); }
.pagination-btns  { display:flex;gap:var(--sp-4); }
.pg-btn           { width:30px;height:30px;border-radius:var(--br-inner);background:var(--bg-card);border:1px solid var(--border-md);color:var(--t4);font-size:var(--fs-12);font-weight:var(--fw-semibold);cursor:pointer;display:flex;align-items:center;justify-content:center; }
.pg-btn.active    { background:var(--lime-a10);border-color:var(--lime-a15);color:var(--lime); }
.pg-btn:hover:not(.active) { background:var(--border); }
.modal-lg-box     { background:var(--bg);border:1px solid var(--border-md);border-radius:var(--br-outer);max-width:640px;width:95%;padding:0;overflow:hidden; }
.modal-header-bar { display:flex;align-items:center;justify-content:space-between;padding:var(--sp-20) var(--sp-24);border-bottom:1px solid var(--border); }
.modal-header-bar h4 { font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--t1);margin:0; }
.modal-close      { width:28px;height:28px;border-radius:50%;background:var(--bg-mid);border:none;color:var(--t4);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:var(--fs-14); }
.modal-body-pad   { padding:var(--sp-24); }
.modal-footer-bar { display:flex;align-items:center;justify-content:flex-end;gap:var(--sp-10);padding:var(--sp-16) var(--sp-24);border-top:1px solid var(--border); }
.field-row        { margin-bottom:var(--sp-16); }
.field-label      { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t4);text-transform:uppercase;/* letter-spacing:.6px; */margin-bottom:var(--sp-8); }
.field-val        { font-size:var(--fs-14);color:var(--t2);font-weight:var(--fw-medium); }
.field-grid-2     { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-16); }
.field-grid-3     { display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--sp-14); }
.action-btn ,
.dataTables_wrapper button.action-btn      { background:none;border:none;color:var(--lime);font-size:var(--fs-16);cursor:pointer;padding:var(--sp-4) var(--sp-8);border-radius:var(--br-inner); }
.action-btn:hover { background:var(--lime-a10); }
.admin-tabs       { display:flex;gap:0;border-bottom:1px solid var(--border);margin-bottom:var(--sp-20); }
.admin-tab        { padding:var(--sp-10) var(--sp-20);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t4);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all var(--t-fast); }
.admin-tab.active { color:var(--lime);border-bottom-color:var(--lime); }
.admin-tab:hover:not(.active) { color:var(--t2); }
.detail-section    { border:1px solid var(--border);border-radius:var(--br-outer);margin-bottom:var(--sp-12);overflow:hidden; }
.detail-section-hd { display:flex;align-items:center;justify-content:space-between;padding:var(--sp-14) var(--sp-20);cursor:pointer;background:var(--bg-subtle); }
.detail-section-hd h6 { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t3);margin:0; }
.detail-section-bd { padding:var(--sp-16) var(--sp-20);border-top:1px solid var(--bg-mid); }
.qb-card           { background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-16) var(--sp-20);margin-bottom:var(--sp-10); }
.qb-card-header    { display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-10);margin-bottom:var(--sp-8); }
.qb-num            { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--white-a35);flex-shrink:0; }
.qb-text           { font-size:var(--fs-14);color:var(--t2);font-weight:var(--fw-medium);flex:1;/* line-height:1.5; */ }
.qb-tags           { display:flex;flex-wrap:wrap;gap:var(--sp-8);margin-top:var(--sp-8); }
.qb-tag            { font-size:var(--fs-10);font-weight:var(--fw-bold);border-radius:var(--br-inner);padding:var(--sp-2) var(--sp-8);border:1px solid transparent; }
.qb-scale          { display:flex;gap:var(--sp-4);margin-top:var(--sp-10); }
.qb-scale-item     { flex:1;text-align:center;padding:var(--sp-4) var(--sp-4);border-radius:var(--br-inner);font-size:var(--fs-10);font-weight:var(--fw-bold); }

/* ── 31. BILLING PAGE — pixel-perfect dark rebuild ── */

/* Outer scroll / centering shell */
.bill-page {
  min-height: 100vh;
  background: var(--bg-alt);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: var(--sp-40) var(--sp-24) var(--sp-64);
  font-family: 'Inter', sans-serif;
}

/* Outer rounded card (matches File Cover-25 white card) */
.bill-outer {
  background: var(--bg-card);
  border: 1px solid var(--border-md);
  border-radius: var(--br-full);
  padding: var(--sp-40) var(--sp-40);
  width: 100%;
  max-width: 1020px;
}

/* Back link — pill outline */
.bill-back-link {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-8);
  font-size:var(--fs-14);
  font-weight:var(--fw-medium);
  color: var(--t3);
  text-decoration: none;
  border: 1.5px solid var(--border-lg);
  border-radius: var(--br-full);
  padding: var(--sp-8) var(--sp-16);
  margin-bottom: var(--sp-32);
  transition: all var(--t-default);
}
.bill-back-link:hover { color: var(--t1); border-color: var(--white-a35); }

/* Two-column grid: form | summary */
.bill-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: var(--sp-24);
  align-items: start;
}

/* ── Form card (left column) ── */
.bill-form-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--br-outer);
  padding: var(--sp-28) var(--sp-32) var(--sp-32);
}
.bill-form-title    { font-size:var(--fs-20); font-weight:var(--fw-bold); color: var(--t1); margin-bottom: var(--sp-4); }
.bill-form-subtitle { font-size:var(--fs-14); color: var(--t4); margin-bottom: var(--sp-24); }

/* Form field */
.bill-field           { margin-bottom: var(--sp-16); }
.bill-field:last-child{ margin-bottom: 0; }
.bill-lbl {
  display: block;
  font-size:var(--fs-14);
  font-weight:var(--fw-medium);
  color: var(--t3);
  margin-bottom: var(--sp-8);
}

/* Two-column field row */
.bill-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-14);
}

/* Dark input — scoped to billing page */
.bill-inp {
  width: 100%;
  padding: var(--sp-12) var(--sp-14);
  background: var(--bg-card);
  border: 1px solid var(--border-lg);
  border-radius: var(--br-inner);
  color: var(--t1);
  font-size:var(--fs-14);
  font-family: 'Inter', sans-serif;
  box-sizing: border-box;
  transition: border-color var(--t-default);
}
.bill-inp::placeholder { color: var(--t5); }
.bill-inp:focus { outline: none; border-color: var(--lime-a60); }

/* Horizontal separator */
.bill-sep {
  height: 1px;
  background: var(--border);
  margin: var(--sp-24) 0;
}

/* Payment Method heading */
.bill-section-title {
  font-size:var(--fs-16);
  font-weight:var(--fw-bold);
  color: var(--t1);
  margin-bottom: var(--sp-12);
}

/* Payment method container */
.bill-pay-methods {
  display: flex;
  flex-direction: column;
  gap: var(--sp-10);
  margin-bottom: var(--sp-24);
}

/* Payment option card (radio) */
.bill-pay-opt {
  display: flex;
  align-items: center;
  gap: var(--sp-12);
  border: 1.5px solid var(--border-lg);
  border-radius: var(--br-inner);
  padding: var(--sp-14) var(--sp-16);
  cursor: pointer;
  background: var(--bg-subtle);
  transition: border-color var(--t-fast), background var(--t-fast);
}
/* Selected AND hover look identical */
.bill-pay-opt.selected,
.bill-pay-opt:hover {
  border-color: var(--lime-a60);
  background: var(--lime-a10);
}
/* Hide native radio */
.bill-pay-opt input[type="radio"] { display: none; }

/* Custom radio dot */
.bill-pay-radio {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid var(--white-a35);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--t-fast);
  box-sizing: border-box;
}
.bill-pay-opt.selected .bill-pay-radio,
.bill-pay-opt:hover    .bill-pay-radio {
  background: var(--lime);
  border-color: var(--lime);
}
.bill-pay-opt.selected .bill-pay-radio::after,
.bill-pay-opt:hover    .bill-pay-radio::after {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--bg);
  display: block;
}

/* Payment icon */
.bill-pay-icon {
  font-size:var(--fs-18);
  color: var(--t3);
  width: 24px;
  text-align: center;
  flex-shrink: 0;
}
.bill-pay-opt.selected .bill-pay-icon,
.bill-pay-opt:hover    .bill-pay-icon { color: var(--lime); }

/* Payment label */
.bill-pay-label {
  font-size:var(--fs-14);
  font-weight:var(--fw-medium);
  color: var(--t3);
}
.bill-pay-opt.selected .bill-pay-label,
.bill-pay-opt:hover    .bill-pay-label { color: var(--t1); }

/* ── Order summary card (right column) ── */
.bill-summary-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--br-outer);
  padding: var(--sp-24) var(--sp-28);
}
.bill-summary-title {
  font-size:var(--fs-18);
  font-weight:var(--fw-bold);
  color: var(--t1);
  margin-bottom: var(--sp-20);
}

/* Summary rows */
.bill-summary-rows { margin-bottom: var(--sp-8); }
.bill-os-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--sp-10) 0;
  border-bottom: 1px solid var(--bg-mid);
  font-size:var(--fs-14);
}
.bill-os-row:last-child { border-bottom: none; }
.bill-os-lbl { color: var(--t4); font-weight:var(--fw-regular); }
.bill-os-val { color: var(--t1); font-weight:var(--fw-bold); }

/* Separator before total */
.bill-os-sep {
  height: 1px;
  background: var(--border-md);
  margin: var(--sp-10) 0 var(--sp-14);
}

/* Total row */
.bill-os-total {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: var(--sp-20);
}
.bill-os-total-lbl {
  font-size:var(--fs-16);
  font-weight:var(--fw-bold);
  color: var(--t1);
}
.bill-os-total-val {
  font-size:var(--fs-28);
  font-weight:var(--fw-black);
  color: var(--t1);
  /* letter-spacing: -0.5px; */
  /* line-height: 1; */
}

/* Pay button */
.bill-pay-btn {
  width: 100%;
  background: var(--grad);
  border: none;
  border-radius: var(--br-full);
  padding: var(--sp-14);
  font-size:var(--fs-16);
  font-weight:var(--fw-bold);
  color: var(--bg);
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  transition: opacity var(--t-default), transform var(--t-default);
}
.bill-pay-btn:hover { opacity: .9; transform: translateY(-1px); }

/* Responsive */
@media(max-width: 760px) {
  .bill-outer  { padding: var(--sp-24) var(--sp-20); }
  .bill-layout { grid-template-columns: 1fr; }
  .bill-row-2  { grid-template-columns: 1fr; }
}

/* ── Kept: subscription page classes (still used by subscription.html) ── */
.card-lime-border { border-color:var(--lime-a15); }
.plan-toggle-group { background:var(--bg-mid);border:1px solid var(--border-md);border-radius:var(--br-inner);overflow:hidden;display:flex; }
.plan-toggle-btn   { padding:var(--sp-8) var(--sp-20);font-size:var(--fs-14);cursor:pointer;border:none;font-family:'Inter',sans-serif; }
.plan-toggle-active  { background:linear-gradient(135deg,var(--lime),var(--cyan));color:var(--bg);font-weight:var(--fw-bold); }
.plan-toggle-inactive { background:transparent;color:var(--t4); }
.sub-plan-features { list-style:none;padding:0;margin:var(--sp-16) 0;font-size:var(--fs-12);color:var(--t3); }
.sub-plan-btn      { width:100%;background:var(--bg-mid);border:1px solid var(--border-lg);border-radius:var(--br-inner);padding:var(--sp-10);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t3);cursor:pointer;font-family:'Inter',sans-serif; }
.sub-plan-current  { background:var(--lime-a10);border:2px solid var(--lime-a15);position:relative; }
.sub-plan-current-tag { position:absolute;top:calc(var(--pos-4) * -1);right:var(--pos-16);background:linear-gradient(135deg,var(--lime),var(--cyan));color:var(--bg);font-size:var(--fs-10);font-weight:var(--fw-extrabold);padding:var(--sp-4) var(--sp-12);border-radius:0 0 var(--br-inner) var(--br-inner); }
.sub-plan-btn-current { background:var(--lime-a10);border-color:var(--lime-a15);color:var(--lime-a60);cursor:not-allowed; }
.sub-plan-pinnacle { background:var(--purple-a10);border-color:var(--purple-bd); }
.sub-plan-btn-pinnacle { background:var(--purple-a10);border-color:var(--purple-bd);color:var(--purple); }

/* ══ Subscription page — redesigned components ══ */

/* Plan identity row */
.sb-plan-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--sp-20); }
.sb-plan-icon {
  width:52px; height:52px; border-radius:var(--br-outer); flex-shrink:0;
  background:var(--purple-bg); border:1px solid var(--purple-bd);
  display:flex; align-items:center; justify-content:center;
  font-size:var(--fs-22); color:var(--purple);
}

/* 4-col and 2-col stat tile grids */
.sb-stats-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-12); }
.sb-stats-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--sp-12); max-width:50%; }

/* Individual stat tile */
.sb-tile     { border-radius:var(--br-outer); padding:var(--sp-16); text-align:center; border:1px solid; }
.sb-tile-lbl { font-size:var(--fs-12); font-weight:var(--fw-medium); margin-bottom:var(--sp-8); opacity:.65; }
.sb-tile-val    { font-size:var(--fs-26); font-weight:var(--fw-black); /* line-height:1; */ }
.sb-tile-val-md { font-size:var(--fs-20); font-weight:var(--fw-extrabold); /* line-height:1.25; */ }

/* Tile color variants — each inherits its accent color for label + value */
.sb-tile-purple { background:var(--purple-bg); border-color:var(--purple-bd); color:var(--purple); }
.sb-tile-cyan   { background:var(--cyan-bg);   border-color:var(--cyan-bd);   color:var(--cyan); }
.sb-tile-green  { background:var(--green-bg);  border-color:var(--green-bd);  color:var(--green); }
.sb-tile-orange { background:var(--orange-bg); border-color:var(--orange-bd); color:var(--orange); }
.sb-tile-lime   { background:var(--lime-bg);   border-color:var(--lime-bd);   color:var(--lime); }
.sb-tile-amber  { background:var(--amber-bg);  border-color:var(--amber-bd);  color:var(--amber); }

/* Features grid */
.sb-feat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-8) var(--sp-16); }
.sb-feat-item { display:flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-14); color:var(--t2); }

/* Monthly / Yearly pill toggle */
.sb-toggle-pill {
  display:flex; align-items:center;
  background:var(--bg-mid); border:1px solid var(--border-md);
  border-radius:var(--br-full); padding:var(--sp-4);
}
.sb-toggle-opt {
  padding:var(--sp-8) var(--sp-20); border-radius:var(--br-full); border:none;
  font-size:var(--fs-14); font-weight:var(--fw-semibold); cursor:pointer;
  font-family:'Inter',sans-serif; transition:all var(--t-default);
  background:transparent; color:var(--t4);
}
.sb-toggle-active { background:var(--grad); color:var(--bg); }

/* Suppress ps-grid's standalone-page margins inside a card */
.card-body .ps-grid.sb-plans-grid { max-width:none; margin:0; }

/* Advanced card — "Current Plan" (lime accent) */
.ps-card-current { border-color:var(--lime-bd); background:var(--lime-a10); }
.ps-card-current:hover { box-shadow:0 14px 40px var(--lime-a15); }

/* Gradient ribbon for current plan (overrides default amber ribbon) */
.ps-ribbon-grad { background:var(--grad); color:var(--bg); }

/* "Current Plan" disabled button */
.ps-btn-curr {
  border-radius:var(--br-full); padding:var(--sp-8) var(--sp-16); font-size:var(--fs-12); font-weight:var(--fw-semibold);
  border:1px solid var(--lime-bd); background:var(--lime-a10);
  color:var(--lime-a60); cursor:not-allowed;
  font-family:'Inter',sans-serif;
}

/* Pinnacle card — amber accent */
.ps-card-pinnacle-sb { border-color:var(--amber-bd); background:var(--amber-a10); }
.ps-card-pinnacle-sb:hover { box-shadow:0 14px 40px var(--amber-bd); }

/* Period label */
.sb-per { color:var(--t4); }

/* Plan Comparison table */
.sb-comp-wrap { overflow-x:auto; }
.sb-comp-table {
  width:100%; border-collapse:collapse; min-width:600px;
}
.sb-comp-table thead tr { border-bottom:2px solid var(--border-md); }
.sb-comp-table th {
  padding:var(--sp-12) var(--sp-16); font-size:var(--fs-12); font-weight:var(--fw-bold);
  text-align:center; white-space:nowrap; /* letter-spacing:.2px; */
}
.sb-th-feat   { text-align:left; color:var(--t4); font-weight:var(--fw-semibold); min-width:190px; }
.sb-th-cyan   { color:var(--cyan); }
.sb-th-purple { color:var(--purple); }
.sb-th-lime   { color:var(--lime); }
.sb-th-amber  { color:var(--amber); }
/* Highlight the current plan column header */
.sb-th-active { background:var(--lime-a10); border-bottom:2px solid var(--lime-bd); }
.sb-comp-table td {
  padding:var(--sp-10) var(--sp-16); font-size:var(--fs-12); color:var(--t3);
  text-align:center; border-bottom:1px solid var(--border);
}
.sb-comp-table td:first-child { text-align:left; color:var(--t2); font-weight:var(--fw-medium); }
/* Highlight the current plan column (4th) */
.sb-comp-table tbody td:nth-child(4) { background:var(--lime-a10); }
.sb-comp-table tbody tr:last-child td { border-bottom:none; }
.sb-comp-table tbody tr:hover td { background:var(--bg-card); }
.sb-comp-table tbody tr:hover td:nth-child(4) { background:var(--lime-a10); }

/* Responsive */
@media(max-width:960px) {
  .sb-stats-4 { grid-template-columns:repeat(2,1fr); }
  .sb-stats-2 { max-width:100%; }
  .sb-feat-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:600px) {
  .sb-feat-grid { grid-template-columns:1fr; }
  .sb-toggle-pill { width:100%; margin-top:var(--sp-12); }
}

/* ══ Plan Upgrade Cards — sb-pc redesign ══ */

/* Grid */
.sb-plans-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sp-14);
  align-items: stretch;
}

/* Base card */
.sb-pc {
  border-radius: var(--br-outer);
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid;
  transition: transform var(--t-default) cubic-bezier(0.34,1.56,0.64,1), box-shadow var(--t-default) ease;
}
.sb-pc:hover { transform: translateY(-5px); }

/* Card body (flex-grows to push button to bottom) */
.sb-pc-body {
  padding: var(--sp-24) var(--sp-20) var(--sp-16);
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* Plan icon */
.sb-pc-icon {
  width: 50px; height: 50px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size:var(--fs-20); margin-bottom: var(--sp-14); flex-shrink: 0;
  border: 1px solid;
}

/* Plan name */
.sb-pc-name {
  font-size:var(--fs-20); font-weight:var(--fw-extrabold); color: var(--t1);
  margin-bottom: var(--sp-8); /* letter-spacing: -0.2px; */
}

/* Plan description */
.sb-pc-desc {
  font-size:var(--fs-12); color: var(--t4); /* line-height: 1.6; */
  margin-bottom: var(--sp-16);
}

/* Inline price row */
.sb-pc-price {
  display: flex; align-items: baseline; gap: var(--sp-4);
  margin-bottom: var(--sp-20);
}
.sb-pc-amt {
  font-size:var(--fs-34); font-weight:var(--fw-black); color: var(--t1);
  /* letter-spacing: -1px; */ /* line-height: 1; */
}
.sb-pc-per { font-size:var(--fs-14); color: var(--t5); font-weight:var(--fw-regular); }

/* Feature list */
.sb-pc-feats {
  list-style: none; padding: 0; margin: 0;
  flex: 1; display: flex; flex-direction: column; gap: var(--sp-10);
}
.sb-pc-feats li {
  display: flex; align-items: flex-start; gap: var(--sp-8);
  font-size:var(--fs-12); color: var(--t2); /* line-height: 1.4; */
}
.sb-pc-feats li i { font-size:var(--fs-14); flex-shrink: 0; margin-top: var(--sp-2); }

/* Bottom button — full-width pill */
.sb-pc-btn {
  margin: 0 var(--sp-20) var(--sp-20);
  padding: var(--sp-12) 0;
  border-radius: var(--br-full);
  border: none;
  font-size:var(--fs-14); font-weight:var(--fw-bold);
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  transition: opacity var(--t-default), transform var(--t-default);
  width: calc(100% - 40px);
  text-align: center;
}
.sb-pc-btn-grad {
  background: var(--grad); color: var(--bg);
}
.sb-pc-btn-grad:hover { opacity: .88; transform: translateY(-1px); }
.sb-pc-btn-outline {
  background: var(--border);
  border: 1.5px solid var(--border-lg) !important;
  color: var(--t2);
}
.sb-pc-btn-outline:hover {
  background: var(--border-lg);
  border-color: var(--white-a35) !important;
  color: var(--t1);
}
.sb-pc-btn-curr {
  background: var(--lime-a10);
  border: 1.5px solid var(--lime-a15) !important;
  color: var(--lime-a60);
  cursor: not-allowed;
}

/* Diagonal ribbon (current plan) */
.sb-pc-ribbon {
  position: absolute; top: var(--pos-20); right: calc(var(--pos-28) * -1);
  background: var(--grad); color: var(--bg);
  font-size:var(--fs-10); font-weight:var(--fw-extrabold);
  /* letter-spacing: .6px; */ text-transform: uppercase;
  padding: var(--sp-4) var(--sp-40);
  transform: rotate(45deg);
  white-space: nowrap; z-index: 2; /* line-height: 1; */
}

/* ── Color variants ── */

/* Foundation — cyan */
.sb-pc-cyan {
  background: linear-gradient(155deg, var(--cyan-a10) 0%, var(--bg-alt) 70%);
  border-color: var(--cyan-bd);
}
.sb-pc-cyan:hover { box-shadow: 0 16px 44px var(--cyan-a10); }
.sb-pci-cyan { background: var(--cyan-a10); color: var(--cyan); border-color: var(--cyan-bd); }
.sb-chk-cyan { color: var(--cyan); }

/* Enhanced — purple */
.sb-pc-purple {
  background: linear-gradient(155deg, var(--purple-a10) 0%, var(--bg-alt) 70%);
  border-color: var(--purple-bd);
}
.sb-pc-purple:hover { box-shadow: 0 16px 44px var(--purple-bd); }
.sb-pci-purple { background: var(--purple-bd); color: var(--purple); border-color: var(--purple-bd); }
.sb-chk-purple { color: var(--purple); }

/* Advanced (current) — lime, more vibrant */
.sb-pc-lime {
  background: linear-gradient(155deg, var(--lime-a15) 0%, var(--bg) 70%);
  border-color: var(--lime-a60);
  box-shadow: 0 4px 28px var(--lime-a10);
}
.sb-pc-lime:hover { box-shadow: 0 16px 44px var(--lime-a15); }
.sb-pci-lime { background: var(--lime-a15); color: var(--lime); border-color: var(--lime-a15); }
.sb-chk-lime { color: var(--lime); }

/* Pinnacle — amber */
.sb-pc-amber {
  background: linear-gradient(155deg, var(--amber-a10) 0%, var(--bg) 70%);
  border-color: var(--amber-bd);
}
.sb-pc-amber:hover { box-shadow: 0 16px 44px var(--amber-bd); }
.sb-pci-amber { background: var(--amber-a10); color: var(--amber); border-color: var(--amber-bd); }
.sb-chk-amber { color: var(--amber); }

/* Responsive */
@media(max-width:960px) { .sb-plans-grid { grid-template-columns: repeat(2,1fr); } }
@media(max-width:540px) { .sb-plans-grid { grid-template-columns: 1fr; } }
/* Company profile avatar */
.co-avatar { width:60px;height:60px;border-radius:var(--br-outer);background:var(--lime-a10);border:1px solid var(--lime-a15);display:flex;align-items:center;justify-content:center;font-size:var(--fs-24);font-weight:var(--fw-extrabold);color:var(--lime);flex-shrink:0; }

/* ── Company Profile: field layout ── */
.cp-fields-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-16) var(--sp-28); }
.cp-field         { display:flex; flex-direction:column; gap:var(--sp-4); }
.cp-field-sep     { padding-bottom:var(--sp-14); margin-bottom:var(--sp-14); border-bottom:1px solid var(--border); }
.cp-field-full    { grid-column:1 / -1; }
.cp-field-lbl     { display:flex; align-items:center; gap:8px; font-size:var(--fs-12); color:var(--t4); /* line-height:1.4; */ }
/* Card-header icon+title pairs (e.g. team/profile.blade.php's "Personal
   Details" header) use the .gap-8 utility, whose token (--sp-8) the Stage 0
   mobile scaling system shrinks to 2px at sm/xs — same legibility-floor
   issue as .cp-field-lbl above. Scoped to card-header icon+title only, not
   the shared .gap-8 utility itself (used in 39+ other, unrelated contexts
   where the scaling is intentional). */
.card-header > h5.vz-flex,
.card-header > h6.vz-flex { gap: 8px; align-items: center; }
.cp-field-icon    { font-size:var(--fs-12); color:var(--t4); flex-shrink:0; }
.cp-field-val     { font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--t1); margin-top:var(--sp-2); padding-left:var(--sp-20); }
.cp-field-val-reg { font-size:var(--fs-14); font-weight:var(--fw-medium); color:var(--t2); margin-top:var(--sp-2); padding-left:var(--sp-20); }
.cp-field-hdr     { display:flex; align-items:center; justify-content:space-between; }
.cp-eye-btn       { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:var(--purple-bg); border:1px solid var(--purple-bd); color:var(--purple); font-size:var(--fs-14); cursor:pointer; text-decoration:none; margin-top:var(--sp-8); transition:background var(--t-fast); }
.cp-eye-btn:hover { background:var(--purple-bd); color:var(--purple); }

/* Team page seats banner */
.seats-banner { background:var(--lime-a10);border:1px solid var(--lime-a15);border-radius:var(--br-outer);padding:var(--sp-16) var(--sp-20);display:flex;align-items:center;justify-content:space-between; }

/* Team note bullet list */
.tm-note-list { padding-left:var(--sp-20); margin:0; }

/* ── Team page modals — Redesigned ── */
/* Modal shell: deep dark background with strong depth shadow */
.tm-modal-content {
  --bs-modal-bg: var(--bg-alt);
  --bs-modal-border-color: var(--border-md);
  --bs-modal-border-radius: var(--br-outer);
  background: var(--bg-alt);
  border: 1px solid var(--border-md);
  border-radius: var(--br-outer);
  overflow: hidden;
  box-shadow: 0 32px 80px var(--black-a65), 0 0 0 1px var(--bg-card);
}
/* Gradient top accent bar — creative touch */
.tm-modal-accent {
  height: 3px;
  background: var(--grad);
  flex-shrink: 0;
}
/* Lift input/select contrast inside modal */
.tm-modal-content .auth-input,
.tm-modal-content .select-input {
  /* background: var(--border);  */
  border-color: var(--border-md); }
.tm-modal-content .auth-input:focus,
.tm-modal-content .select-input:focus { border-color: var(--purple-a45); box-shadow: 0 0 0 3px var(--purple-a10); }
/* Header */
.tm-modal-hdr  { display:flex; align-items:flex-start; justify-content:space-between; padding:var(--sp-24) var(--sp-24) 0; gap:var(--sp-12); width: 100%;}
.tm-modal-title { font-size:var(--fs-20); font-weight:var(--fw-extrabold); color:var(--t1); margin:0 0 var(--sp-4); /* letter-spacing:-0.3px; */ }
.tm-modal-sub  { font-size:var(--fs-14); color:var(--t4); margin:0; /* line-height:1.5; */ }
/* Close button — circular with hover rotation */
.tm-modal-close {
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--bg-mid); border: 1px solid var(--border-md);
  color: var(--t4); cursor: pointer; font-size:var(--fs-14);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; padding: 0; margin-top: var(--sp-2); transition: all var(--t-default);
}
.tm-modal-close:hover { background:var(--border-md); border-color:var(--border-lg); color:var(--t1); transform:rotate(90deg); }
/* Body / footer */
.tm-modal-body-pad {
    padding: var(--sp-20) var(--sp-24);
    width: 100%;
}
.tm-modal-foot { padding:var(--sp-4) var(--sp-24) var(--sp-24); display:flex; justify-content:center; }
/* Dialog widths */
.tm-dialog-md { max-width:520px; }
.tm-dialog-lg { max-width:600px; }
.modal-dialog-430 { max-width:430px; }
.modal-dialog-480 { max-width:480px; }
.modal-body-confirm { text-align:center; padding:var(--sp-40) var(--sp-32) var(--sp-32); }
/* 2-col form grid */
.tm-form-grid  { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-16); margin-bottom:var(--sp-16); }
/* Form group */
.tm-form-group { display:flex; flex-direction:column; gap:var(--sp-8); }
.tm-form-lbl   { font-size:var(--fs-14); font-weight:var(--fw-semibold); color:var(--t2); }
.tm-req        { color:var(--red); margin-left:var(--sp-2); }
/* Textarea */
textarea.auth-input { resize:vertical; min-height:100px; }
/* Purple info/notice box */
.tm-info-box { background:var(--purple-a10); border:1px solid var(--purple-bd); border-radius:var(--br-outer); padding:var(--sp-14) var(--sp-16); font-size:var(--fs-14); color:var(--purple-a95); /* line-height:1.65; */ }
.tm-info-box-note { display:block; font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--t1); margin-top:var(--sp-8); }
.tm-info-box-lbl  { display:block; font-size:var(--fs-10); font-weight:var(--fw-bold); text-transform:uppercase; /* letter-spacing:0.6px; */ opacity:.65; }
/* Domain info box */
.tm-domain-box { background:var(--bg-card); border:1px solid var(--border-md); border-radius:var(--br-outer); padding:0 var(--sp-16); margin-bottom:var(--sp-16); }
.tm-domain-row { display:flex; align-items:center; justify-content:space-between; padding:var(--sp-12) 0; border-bottom:1px solid var(--bg-mid); }
.tm-domain-row:last-child { border-bottom:none; }
.tm-domain-lbl { font-size:var(--fs-14); color:var(--t4); }
.tm-domain-val { font-size:var(--fs-14); font-weight:var(--fw-semibold); color:var(--t1); }
/* "What would you like to do?" heading */
.tm-what-lbl { font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--t1); margin:0 0 var(--sp-12); display:flex; align-items:center; gap:var(--sp-8); }
.tm-what-lbl::before { content:''; width:3px; height:16px; background:var(--grad); border-radius:var(--br-inner); flex-shrink:0; }
/* Radio list — card-style interactive options */
.tm-radio-list { display:flex; flex-direction:column; gap:var(--sp-8); margin-bottom:var(--sp-4); }
.tm-radio-lbl {
  display:flex; align-items:center; gap:var(--sp-12);
  font-size:var(--fs-14); color:var(--t2); cursor:pointer;
  padding:var(--sp-12) var(--sp-14); border-radius:var(--br-outer);
  border:1px solid var(--border);
  background:var(--bg-card);
  transition:border-color var(--t-fast), background var(--t-fast), color var(--t-fast);
}
.tm-radio-lbl:hover { border-color:var(--purple-bd); background:var(--purple-a10); color:var(--t1); }
.tm-radio-lbl:has(input:checked) { border-color:var(--purple-a45); background:var(--purple-a10); color:var(--t1); }
.tm-radio-lbl input[type="radio"] { width:18px; height:18px; accent-color:var(--purple); cursor:pointer; flex-shrink:0; }
/* CTA button */
.tm-modal-btn { background:var(--grad); border:none; border-radius:var(--br-full); padding:var(--sp-14) var(--sp-60); font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--bg); cursor:pointer; font-family:'Inter',sans-serif; transition:opacity var(--t-default), transform var(--t-default); min-width:200px; }
.tm-modal-btn:hover { opacity:.88; transform:translateY(-1px); }
/* Table action icon buttons */
.tm-act-btn { background:none; border:none; padding:0; cursor:pointer; display:inline-flex; align-items:center; }
/* Misc utilities */
.ws-nowrap { white-space:nowrap; }
.mt2 { margin-top:var(--sp-2); }  .mb2 { margin-bottom:var(--sp-2); }  .mb3 { margin-bottom:var(--sp-4); }
/* Header utilities */
.vz-logo-svg  { width:34px;height:34px; }  .vz-logo-text { /* line-height:1.1; */ }
.vz-icon-18   { width:18px;height:18px; }  .vz-icon-20   { width:20px;height:20px; }
.cursor-ptr   { cursor:pointer; }
.hdr-notif-li { position:relative; }
.hdr-notif-badge { position:absolute;top:calc(var(--pos-4) * -1);right:calc(var(--pos-4) * -1);font-size:var(--fs-10); }
/* Back-link-dark kept for legacy pages */
.back-link-dark { display:inline-flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t3);text-decoration:none;background:var(--bg-mid);border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16); }
.back-link-dark:hover { color:var(--t1); }

/* ── Azvizory Review page ── */
.vz-form-lbl { display:block; font-size:var(--fs-14); font-weight:var(--fw-semibold); color:var(--t2); margin-bottom:var(--sp-8); }
.vz-textarea { width:100%; padding:var(--sp-12) var(--sp-14); background:var(--bg-mid); border:1px solid var(--border-md); border-radius:var(--br-inner); color:var(--t1); font-size:var(--fs-14); font-family:'Inter',sans-serif; transition:border var(--t-default); box-sizing:border-box; resize:vertical; min-height:130px; }
.vz-textarea::placeholder { color:var(--t5); }
.vz-textarea:focus { outline:none; border-color:var(--lime-a60); }
.vz-textarea-sm { min-height:90px; font-size:var(--fs-14); padding:var(--sp-10) var(--sp-12); }
.vz-input:disabled { background:var(--bg-card); color:var(--t3); cursor:default; }
.vz-tbl-ico-muted { font-size:var(--fs-16); color:var(--t5); cursor:pointer; transition:color var(--t-fast); }
.vz-tbl-ico-muted:hover { color:var(--t2); }
.vz-tbl-ico-primary { font-size:var(--fs-16); color:var(--orange); cursor:pointer; transition:color var(--t-fast); }
.vz-tbl-ico-primary:hover { color:var(--amber); }
.btn-vz-primary-pill { background:var(--grad); color:var(--bg); border:none; border-radius:var(--br-full); padding:var(--sp-12) var(--sp-28); font-size:var(--fs-14); font-weight:var(--fw-bold); cursor:pointer; font-family:'Inter',sans-serif; display:inline-flex; align-items:center; gap:var(--sp-8); text-decoration:none; transition:opacity var(--t-default),transform var(--t-default); }
.btn-vz-primary-pill:hover { opacity:.9; transform:translateY(-1px);color: var(--bg); }

/* ── Assessment Hub page ── */
/* Utility positions & ghost text */
.c-ghost    { color:var(--white-a35); }
.vz-pos-rel { position:relative; }
.vz-pos-abs { position:absolute; }

/* Header progress tracker (right column) */
.hub-prog-section { flex-shrink:0; text-align:right; min-width:240px; }
.hub-prog-count   { font-size:var(--fs-14); font-weight:var(--fw-semibold); color:var(--t3); margin-bottom:var(--sp-8); }
.hub-prog-track   { height:8px; background:var(--border); border-radius:var(--br-inner); overflow:hidden; width:240px; margin-left:auto; }
.hub-prog-fill    { height:100%; border-radius:var(--br-inner); background:var(--purple); width:62.5%; }

/* Overview wrapper label */
.hub-section-hdr { font-size:var(--fs-12); font-weight:var(--fw-bold); color:var(--t4); /* letter-spacing:.5px; */ margin-bottom:var(--sp-14); }

/* Domain card state borders — replaces inline style="border-color:…" */
.da-card-inprog { border-color:var(--purple-bd); }
.da-card-done   { border-color:var(--green-bd); }

/* Domain progress fill — color-only, no width here */
.da-prog-purple { background:var(--purple); }
.da-prog-green  { background:var(--green); }
.da-prog-faint  { background:var(--border-md); }

/* Domain progress fill widths — per-domain, replaces inline style="width:…" */
.da-w-0   { width:0.5%; }    /* visual zero (Not Started) */
.da-w-15  { width:15%; }     /* Operational Risk  12/80 */
.da-w-56  { width:56.25%; }  /* G&L 45/80 */
.da-w-87  { width:87.5%; }   /* Third-Party 70/80 */
.da-w-100 { width:100%; }    /* Cybersecurity 50/50 — complete */

/* Maturity Journey dot variants — replace inline style="background:…;border:…;box-shadow:…" */
.mj-dot-red    { background:var(--red);   border:2px solid var(--red);   box-shadow:0 0 12px var(--red-bd); }
.mj-dot-amber  { background:var(--amber); border:2px solid var(--amber); box-shadow:0 0 16px var(--amber-a50); }
.mj-dot-lime   { background:var(--lime-a10); border:2px solid var(--lime-a15); }
.mj-dot-cyan   { background:var(--cyan-a10);   border:2px solid var(--cyan-bd); }
.mj-dot-purple { background:var(--purple-a10);  border:2px solid var(--purple-bd); }
/* MJ dot icon colours */
.mj-icon-red    { color:var(--t1);         font-size:var(--fs-16); }
.mj-icon-amber  { color:var(--bg);      font-size:var(--fs-18); }
.mj-icon-lime   { color:var(--lime);  font-size:var(--fs-16); }
.mj-icon-cyan   { color:var(--cyan);  font-size:var(--fs-16); }
.mj-icon-purple { color:var(--purple);font-size:var(--fs-16); }
/* "YOU ARE HERE" label */
.mj-here-lbl { position:absolute; top:calc(var(--pos-28) * -1); left:50%; transform:translateX(-50%); white-space:nowrap; background:var(--amber); color:var(--bg); font-size:var(--fs-10); font-weight:var(--fw-extrabold); border-radius:var(--br-inner); padding:var(--sp-2) var(--sp-8); }
/* Maturity journey body padding */
.mj-body       { padding:var(--sp-20) 0 var(--sp-10); }
.mj-stages-row { position:relative; z-index:1; }

/* ── Assessment Preview standalone page ── */
.ap-page      { min-height:100vh; display:flex; flex-direction:column; background:var(--bg-alt); }
.ap-top       { position:sticky; top:0; z-index:200; background:var(--bg-alt); }
/* Header row */
.ap-header    { display:flex; align-items:center; gap:var(--sp-20); padding:var(--sp-20) var(--sp-32) var(--sp-16); border-bottom:1px solid var(--border); }
.ap-back      { display:inline-flex; align-items:center; gap:var(--sp-8); border:1px solid var(--border-lg); border-radius:var(--br-full); padding:var(--sp-8) var(--sp-20); font-size:var(--fs-14); font-weight:var(--fw-semibold); color:var(--t3); text-decoration:none; font-family:'Inter',sans-serif; transition:all var(--t-fast); flex-shrink:0; }
.ap-back:hover { background:var(--border); color:var(--t1); }
.ap-pg-title  { font-size:var(--fs-22); font-weight:var(--fw-extrabold); color:var(--t1); margin:0; /* letter-spacing:-.3px; */ }
/* Tab strip */
/* Bootstrap tab pane visibility — required when not loading Bootstrap CSS globally */
.tab-content > .tab-pane            { display:none; }
.tab-content > .tab-pane.active     { display:block; }
.tab-content > .tab-pane.fade       { opacity:0; transition:opacity var(--t-fast) linear; }
.tab-content > .tab-pane.fade.show  { opacity:1; }
/* Tab strip */
.ap-tab-strip { border-bottom:1px solid var(--border); background:var(--bg-subtle); overflow:hidden; }
.ap-tab-nav   { display:flex; list-style:none; padding:0; margin:0; }
.ap-tab-nav .nav-item { flex:1; border-right:1px solid var(--border); }
.ap-tab-nav .nav-item:last-child { border-right:none; }
.ap-tab-btn   { width:100%;height: 100%; background:none; border:none; border-bottom:3px solid transparent; padding:var(--sp-14) var(--sp-16) var(--sp-12); cursor:pointer; font-family:'Inter',sans-serif; text-align:left; display:flex; flex-direction:column; gap:var(--sp-4); color:var(--t4); transition:background var(--t-fast), color var(--t-fast), opacity var(--t-fast); }
.ap-tab-btn:hover:not(.active) { background:var(--bg-mid); color:var(--t2); }
/* Creative active tab: project primary gradient with dark text */
.ap-tab-btn.active { background:var(--grad); color:var(--bg); border-bottom-color:transparent; }
.ap-tab-nm    { font-size:var(--fs-14); font-weight:var(--fw-semibold); /* line-height:1.3; */ }
.ap-tab-ct    { font-size:var(--fs-12); font-weight:var(--fw-medium); opacity:.82; }
.ap-tab-btn.active .ap-tab-nm { font-weight:var(--fw-bold); color:var(--bg); }
.ap-tab-btn.active .ap-tab-ct { opacity:1; color:var(--black-a65); }
/* Domain icon colour modifiers — one per domain for creative depth */
.ap-dom-ico-lime   { border-color:var(--lime);   color:var(--lime);   background:var(--lime-bg); }
.ap-dom-ico-cyan   { border-color:var(--cyan);   color:var(--cyan);   background:var(--cyan-bg); }
.ap-dom-ico-orange { border-color:var(--orange); color:var(--orange); background:var(--orange-bg); }
.ap-dom-ico-amber  { border-color:var(--amber);  color:var(--amber);  background:var(--amber-bg); }
.ap-dom-ico-red    { border-color:var(--red);    color:var(--red);    background:var(--red-bg); }
.ap-dom-ico-purple { border-color:var(--purple); color:var(--purple); background:var(--purple-bg); }
/* Body / panel */
.ap-body      { flex:1; padding:var(--sp-24) var(--sp-32) var(--sp-40); }
.ap-panel     { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--br-outer); padding:var(--sp-28) var(--sp-32) var(--sp-20); }
/* Domain section */
.ap-dom-hdr  { display:flex; align-items:center; gap:var(--sp-12); margin-bottom:var(--sp-20); }
.ap-dom-ico  { width:28px; height:28px; border-radius:50%; border:2px solid var(--orange); display:flex; align-items:center; justify-content:center; font-size:var(--fs-14); color:var(--orange); flex-shrink:0; }
.ap-dom-nm   { font-size:var(--fs-20); font-weight:var(--fw-bold); color:var(--t1); margin:0; }
/* Control block */
.ap-ctrl     { margin-bottom:var(--sp-20); }
.ap-ctrl-lbl { font-size:var(--fs-12); color:var(--t4); padding:var(--sp-8) 0 var(--sp-4); }
/* Question row */
.ap-q-row    { display:flex; align-items:baseline; justify-content:space-between; gap:var(--sp-16); padding:var(--sp-10) 0; border-bottom:1px solid var(--bg-card); font-size:var(--fs-14); color:var(--t2); }
.ap-q-row:last-child { border-bottom:none; }
.ap-q-val    { flex-shrink:0; font-weight:var(--fw-bold); min-width:36px; text-align:right; }

/* ── Assessment Guidelines page ── */
/* Numbered section badges */
.ag-num        { display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;font-size:var(--fs-14);font-weight:var(--fw-extrabold);flex-shrink:0; }
.ag-num-lime   { background:var(--lime-bg);   border:1.5px solid var(--lime-bd);   color:var(--lime); }
.ag-num-cyan   { background:var(--cyan-bg);   border:1.5px solid var(--cyan-bd);   color:var(--cyan); }
.ag-num-amber  { background:var(--amber-bg);  border:1.5px solid var(--amber-bd);  color:var(--amber); }
.ag-num-orange { background:var(--orange-bg); border:1.5px solid var(--orange-bd); color:var(--orange); }
/* Beats vendor `.card-header > span` (display:block;font-size:12px;margin-top:5px;letter-spacing:1px;color:var(--sub-title)) which otherwise breaks the flex centering above */
.card-header > .ag-num {
  display:inline-flex;align-items:center;justify-content:center;
  font-size:var(--fs-14);margin-top:0;letter-spacing:normal;
}
.card-header > .ag-num-lime   { color:var(--lime); }
.card-header > .ag-num-cyan   { color:var(--cyan); }
.card-header > .ag-num-amber  { color:var(--amber); }
.card-header > .ag-num-orange { color:var(--orange); }
.card-header > .ag-num-purple { color:var(--purple); }
.ag-num-purple { background:var(--purple-bg); border:1.5px solid var(--purple-bd); color:var(--purple); }
/* Maturity score pills (0-5) */
.ag-score      { display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;font-size:var(--fs-12);font-weight:var(--fw-extrabold);flex-shrink:0; }
.ag-s0 { background:var(--red-bg);    color:var(--red); }
.ag-s1 { background:var(--red-bg);    color:var(--red);    opacity:.72; }
.ag-s2 { background:var(--orange-bg); color:var(--orange); }
.ag-s3 { background:var(--amber-bg);  color:var(--amber); }
.ag-s4 { background:var(--lime-bg);   color:var(--lime); }
.ag-s5 { background:var(--green-bg);  color:var(--green); }
/* Yes / No response pills */
.ag-yes { background:var(--green-bg); color:var(--green); padding:var(--sp-2) var(--sp-12); border-radius:var(--br-full); font-size:var(--fs-14); font-weight:var(--fw-bold); }
.ag-no  { background:var(--red-bg);   color:var(--red);   padding:var(--sp-2) var(--sp-12); border-radius:var(--br-full); font-size:var(--fs-14); font-weight:var(--fw-bold); }
.ag-scoring-list { list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--sp-8);/* line-height:2; */ }
.ag-scoring-list li { display:flex;align-items:flex-start;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t2); }
.heg-badge { display:inline-flex;align-items:center;gap:var(--sp-4);background:var(--lime-a10);border:1px solid var(--lime-a15);color:var(--lime);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-semibold); }
.how-step  { background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-20) var(--sp-20);position:relative; }
.how-num   { display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--lime-bg);border:1.5px solid var(--lime-bd);color:var(--lime);font-size:var(--fs-12);font-weight:var(--fw-extrabold);margin-bottom:var(--sp-12); }
/* Domain weight highlights */
.ag-wt-hi { color:var(--lime); font-weight:var(--fw-bold); }
.ag-wt-md { color:var(--t3);   font-weight:var(--fw-semibold); }
/* Checkmark list item (After Completion) */
.ag-chk   { display:flex;align-items:flex-start;gap:var(--sp-8);padding:var(--sp-4) 0;font-size:var(--fs-14);color:var(--t2);/* line-height:1.5; */ }
.ag-chk i { color:var(--green);flex-shrink:0;margin-top:var(--sp-2); }
/* Bullet list item */
.ag-bul   { display:flex;align-items:flex-start;gap:var(--sp-8);padding:var(--sp-4) 0;font-size:var(--fs-14);color:var(--t3);/* line-height:1.5; */ }
.ag-bul::before { content:'•';color:var(--t5);flex-shrink:0;margin-top:var(--sp-2); }
/* Bottom note box */
.ag-note  { background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-16) var(--sp-20);font-size:var(--fs-14);color:var(--t3);/* line-height:1.75; */ }
/* Bottom action row */
.ag-actions { display:flex;align-items:center;justify-content:center;gap:var(--sp-12);padding:var(--sp-4) 0 var(--sp-8); }

/* ── Assessment Screen fine-tuned ── */
.sc-back-link { display:inline-flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t4);text-decoration:none;transition:color var(--t-fast);margin-bottom:var(--sp-10); }
.sc-back-link:hover { color:var(--t2); }
.sc-domain-bar { display:flex;align-items:center;gap:var(--sp-16);margin-bottom:var(--sp-16);flex-wrap:wrap; }
.sc-domain-title { font-size:var(--fs-22);font-weight:var(--fw-extrabold);color:var(--t1);margin:0;white-space:nowrap; }
.sc-prog-wrap { display:flex;align-items:center;gap:var(--sp-8);flex:1;min-width:0; }
.sc-prog-pct { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--cyan);flex-shrink:0; }
/* Bootstrap ctrl tab buttons — override nav-link visuals */
.ctrl-tab-btn { background:transparent;border:none;border-bottom:1px solid var(--bg-card);border-left:3px solid transparent;padding:var(--sp-12) var(--sp-14);display:flex;align-items:center;gap:var(--sp-10);text-align:left;width:100%;color:var(--t3);cursor:pointer;transition:background var(--t-fast),color var(--t-fast),border-color var(--t-fast);font-family:'Inter',sans-serif;border-radius:0; }
.ctrl-tab-btn:hover:not(.active) { background:var(--bg-card);color:var(--t2);border-left-color:var(--cyan-bd); }
.ctrl-tab-btn.active { background:var(--cyan-a10);border-left-color:var(--cyan);color:var(--cyan); }
.ctrl-tab-btn.active .ctrl-score-lbl { color:var(--cyan-a78); }
.ctrl-subdomain-label { font-size:var(--fs-10);font-weight:var(--fw-bold);text-transform:uppercase;color:var(--t6);padding:var(--sp-12) var(--sp-10) var(--sp-4);letter-spacing:0.4px; }
.ctrl-subdomain-label:first-child { padding-top:var(--sp-4); }
/* Ctrl dot states — cyan theme */
.ctrl-dot.on  { background:var(--cyan);box-shadow:0 0 6px var(--cyan-bd); }
.ctrl-dot.off { background:transparent;border:1.5px solid var(--cyan-bd); }
/* Bootstrap form-switch — flex alignment fix + cyan checked state */
.sc-toggle-wrap { display:flex!important;align-items:center!important;flex-wrap:nowrap;gap:var(--sp-10);padding:0!important;margin:0!important;min-height:auto!important; }
.sc-toggle-wrap .sc-switch { float:none!important;margin-left:0!important;margin-top:0!important; }
.sc-switch { width:44px!important;height:24px!important;cursor:pointer;flex-shrink:0;background-color:var(--border)!important;border-color:var(--border-lg)!important;border-radius:var(--br-outer)!important;transition:background-color var(--t-default),border-color var(--t-default)!important; }
.sc-switch:focus { box-shadow:none!important; }
.sc-switch:checked { background-color:var(--cyan-bd)!important;border-color:var(--cyan)!important; }
.sc-switch-lbl { font-size:var(--fs-14);color:var(--t4);cursor:pointer;flex-shrink:0;user-select:none;margin-bottom:0!important;/* line-height:1; */ }
.sc-yn-hint { margin-left:auto;font-size:var(--fs-12);color:var(--t5);flex-shrink:0;white-space:nowrap; }
/* Bootstrap modal — dark theme shell */
.sc-modal .modal-content { background:var(--bg-alt);border:1px solid var(--border-md);border-radius:var(--br-outer);overflow:hidden;box-shadow:0 32px 80px var(--black-a65); }
.sc-modal .modal-header { border-bottom:1px solid var(--border);padding:var(--sp-16) var(--sp-24); }
.sc-modal .modal-title { font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--t1); }
.sc-modal .modal-body { padding:var(--sp-20) var(--sp-24); }
.sc-modal .modal-footer { border-top:1px solid var(--bg-mid);padding:var(--sp-14) var(--sp-24); }
.sc-modal .btn-close { filter:invert(1) grayscale(1) opacity(.35);transition:filter var(--t-fast); }
.sc-modal .btn-close:hover { filter:invert(1) grayscale(0) opacity(.75); }
/* Score buttons — purple active theme */
.sc-btn:hover { background:var(--cyan-a10)!important;border-color:var(--cyan-bd)!important;color:var(--cyan)!important; }
.sc-btn.sel { background:var(--cyan-a10)!important;border-color:var(--cyan)!important;color:var(--cyan)!important;box-shadow:0 0 0 2px var(--cyan-a10)!important; }
/* Dynamic score display (right panel) */
.sc-score-empty { font-size:var(--fs-12);color:var(--t5);text-align:center;padding:var(--sp-10) 0; }
.sc-score-live { text-align:center; }
.sc-score-live-num { font-size:var(--fs-26);font-weight:var(--fw-black);/* line-height:1; */margin-bottom:var(--sp-4); }
.sc-score-live-lbl { font-size:var(--fs-12);font-weight:var(--fw-bold);margin-bottom:var(--sp-4); }
.sc-score-live-desc { font-size:var(--fs-12);color:var(--t4);/* line-height:1.55; */ }
.scale-row-hl { background:var(--cyan-a10)!important;border-radius:var(--br-inner);margin:0 -4px;padding:var(--sp-2) var(--sp-4); }
/* q-help button */
.q-help { background:var(--amber-a10);border:1px solid var(--amber-bd);border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;color:var(--amber);cursor:pointer;flex-shrink:0;font-size:var(--fs-12);transition:background var(--t-fast);padding:0; }
.q-help:hover { background:var(--amber-bd); }

/* ── Assessment Preview pre-submit (asprv) ── */
.asprv-top-bar       { display:flex; align-items:center; gap:var(--sp-16); margin-bottom:var(--sp-20); }
/* Sticky confirmation bar — sticks to viewport bottom while scrolling, settles at natural page end */
.asprv-confirm-bar   { position:sticky; bottom:0; z-index:100; background:var(--bg-alt); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-top:1px solid var(--border-md); margin-top:var(--sp-20); padding: var(--sp-14) 0 var(--sp-14) var(--sp-14);}
.asprv-confirm-inner { display:flex; align-items:center; justify-content:space-between; gap:var(--sp-16); flex-wrap:wrap; }
.asprv-confirm-check { display:flex; align-items:center; gap:var(--sp-10); font-size:var(--fs-14); color:var(--t3); cursor:pointer; flex:1; min-width:200px; /* line-height:1.5; */ }
.asprv-confirm-input { accent-color:var(--lime); width:15px; height:15px; cursor:pointer; flex-shrink:0; margin:0; }
.asprv-success-ico   { width:66px; height:66px; border-radius:50%; background:var(--green); display:flex; align-items:center; justify-content:center; font-size:var(--fs-28); color:var(--t1); margin:0 auto var(--sp-20); box-shadow:0 8px 24px var(--green-bd); }

/* ── Trends & Analytics page ── */
.vz-kpi-card { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--br-outer); padding:var(--sp-20) var(--sp-24); display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-12); position:relative; overflow:hidden; transition:transform var(--t-default),box-shadow var(--t-default); }
.vz-kpi-card:hover { transform:translateY(-2px); box-shadow:0 8px 28px var(--black-a25); }
.vz-kpi-card-lime  { border-left:3px solid var(--lime);  background:var(--lime-a10); }
.vz-kpi-card-green { border-left:3px solid var(--green); background:var(--green-a05); }
.vz-kpi-card-amber { border-left:3px solid var(--amber); background:var(--amber-a10); }
.vz-kpi-card-red   { border-left:3px solid var(--red);   background:var(--red-a10); }
/* Progress fill colour variants for reports/highlights */
.vz-prog-fill-amber { background:var(--amber); }
.vz-prog-fill-red   { background:var(--red); }
.vz-kpi-lbl  { font-size:var(--fs-12); font-weight:var(--fw-bold); /* letter-spacing:.8px; */ text-transform:uppercase; color:var(--t4); margin-bottom:var(--sp-8); }
.vz-kpi-val  { font-size:var(--fs-34); font-weight:var(--fw-black); /* line-height:1; */ margin-bottom:var(--sp-8); }
.vz-kpi-name { font-size:var(--fs-16); font-weight:var(--fw-bold); color:var(--t1); /* line-height:1.35; */ margin-bottom:var(--sp-8); }
.vz-kpi-sub  { font-size:var(--fs-12); font-weight:var(--fw-semibold); display:flex; align-items:center; gap:var(--sp-4); }
.vz-select-sm { padding:var(--sp-8) var(--sp-28) var(--sp-8) var(--sp-10); background:var(--bg-mid); border:1px solid var(--border-md); border-radius:var(--br-inner); color:var(--t3); font-size:var(--fs-12); font-family:'Inter',sans-serif; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='var(--white-a35)' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 7px center; cursor:pointer; min-width:110px; }
.vz-select-sm option { background:var(--dark-navy); }
.vz-select-sm:focus  { outline:none; border-color:var(--purple-a45); }
.vz-chart-legend { display:flex; align-items:center; justify-content:center; gap:var(--sp-20); flex-wrap:wrap; padding:var(--sp-10) 0 0; border-top:1px solid var(--bg-mid); margin-top:var(--sp-4); }
.vz-legend-item { display:flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-12); color:var(--t4); }
.vz-legend-line { width:22px; height:2px; border-radius:var(--br-inner); }
.vz-legend-dot  { width:8px; height:8px; border-radius:50%; }
.apex-trend-tt,.apex-domain-tt,.apex-bar-tt { background:var(--bg-alt); border:1px solid var(--border-md); border-radius:var(--br-inner); padding:var(--sp-10) var(--sp-14); min-width:170px; box-shadow:0 8px 24px var(--black-a50); font-family:'Inter',sans-serif; }
.apex-tt-title,.apex-dt-title,.apex-bt-title { font-size:var(--fs-12); font-weight:var(--fw-bold); color:var(--t4); margin-bottom:var(--sp-4); }
.apex-tt-score { font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--purple); margin-bottom:var(--sp-2); }
.apex-tt-plan  { font-size:var(--fs-12); color:var(--t6); margin-top:var(--sp-4); }
.apex-dt-plan  { font-size:var(--fs-12); color:var(--t6); margin-bottom:var(--sp-8); }
.apex-dt-row,.apex-bt-row { display:flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-12); margin-bottom:var(--sp-4); }
.apex-dt-dot,.apex-bt-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.apex-dt-name,.apex-bt-lbl { color:var(--t3); flex:1; }
.apex-dt-val,.apex-bt-val  { font-weight:var(--fw-bold); color:var(--t1); }
.apex-bt-curr { font-weight:var(--fw-bold); color:var(--purple); }
.trend-axis-labels { display:flex; justify-content:space-between; padding:0 var(--sp-8); margin-top:var(--sp-4); }
.trend-axis-lbl    { font-size:var(--fs-10); color:var(--white-a35); }
.trend-legend      { display:flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-12); color:var(--t4); justify-content:center; margin-top:var(--sp-8); }
.trend-legend-line { width:24px; height:2px; background:var(--lime); border-radius:var(--br-inner); }
/* Line-circle legend marker (─●─) */
.vz-legend-lc { display:inline-block; width:26px; height:2px; border-radius:var(--br-inner); position:relative; flex-shrink:0; }
.vz-legend-lc::after { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:7px; height:7px; border-radius:50%; background:inherit; }
.vz-legend-lc.vz-legend-dot { width:9px; height:9px; border-radius:50%; }
.vz-legend-lc.vz-legend-dot::after { content:none; }
.vz-legend-item { cursor:pointer; user-select:none; transition:opacity var(--t-fast); }
.vz-legend-inactive { opacity:.32; }
/* Legacy billing classes (kept for backward compat if referenced elsewhere) */
.bill-layout-old { display:grid;grid-template-columns:1fr 320px;gap:var(--sp-24);align-items:start; }
.pay-btn    { width:100%;background:var(--grad);border:none;border-radius:var(--br-full);padding:var(--sp-14);font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--bg);cursor:pointer;font-family:'Inter',sans-serif;margin-top:var(--sp-16);transition:opacity var(--t-default); }
.pay-btn:hover { opacity:.9; }
.os-heading { font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-16); }
.os-row     { display:flex;justify-content:space-between;padding:var(--sp-10) 0;border-bottom:1px solid var(--bg-mid);font-size:var(--fs-14);color:var(--t3); }
.os-row:last-child { border-bottom:none; }
.os-label   { color:var(--t3); }  .os-val { font-weight:var(--fw-semibold);color:var(--t1); }
.os-total   { font-size:var(--fs-16);font-weight:var(--fw-extrabold);color:var(--lime);border-top:1px solid var(--border-md);padding-top:var(--sp-14);margin-top:var(--sp-8);display:flex;justify-content:space-between; }

/* ── 32. ASSESSMENT COMPLETION (animations) ── */
@keyframes pulse-ring  { 0%,100%{transform:scale(1);opacity:.6} 50%{transform:scale(1.08);opacity:1} }
@keyframes shield-pop  { 0%{transform:scale(0.3);opacity:0} 80%{transform:scale(1.08)} 100%{transform:scale(1);opacity:1} }
@keyframes sparkle1    { 0%,100%{transform:scale(1) rotate(0deg);opacity:.7} 50%{transform:scale(1.4) rotate(20deg);opacity:1;color:var(--lime)} }
@keyframes sparkle2    { 0%,100%{transform:scale(1) rotate(0deg);opacity:.5} 50%{transform:scale(1.3) rotate(-15deg);opacity:1} }
@keyframes float-up    { 0%{opacity:0;transform:translateY(20px)} 100%{opacity:1;transform:translateY(0)} }
.fade-in          { animation:float-up .5s ease forwards; }
.fade-in-delay-1  { animation:float-up .5s ease .15s both; }
.fade-in-delay-2  { animation:float-up .5s ease .3s both; }
.fade-in-delay-3  { animation:float-up .5s ease .45s both; }
.fade-in-delay-4  { animation:float-up .5s ease .6s both; }

/* ── 33. LOGIN SPLIT-PANEL PAGE ── */
.login-layout {
  display:flex;min-height:100vh;
  background:var(--bg-alt);font-family:'Inter',sans-serif;
}

/* Left marketing panel */
.login-left {
  width:45%;flex-shrink:0;
  background:linear-gradient(160deg,var(--bg-alt) 0%,var(--bg-alt) 60%,var(--dark-green) 100%);
  border-right:1px solid var(--lime-a10);
  display:flex;flex-direction:column;justify-content:space-between;
  padding:var(--sp-40) var(--sp-40);position:relative;overflow:hidden;
}
.login-left::before {
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 80% 60% at 20% 30%,var(--lime-a10) 0%,transparent 60%),
             radial-gradient(ellipse 60% 50% at 80% 80%,var(--cyan-a10) 0%,transparent 55%);
}
.login-left::after {
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(0deg,transparent,transparent 60px,var(--bg-subtle) 60px,var(--bg-subtle) 61px),
                   repeating-linear-gradient(90deg,transparent,transparent 60px,var(--bg-subtle) 60px,var(--bg-subtle) 61px);
}
.ll-logo { display:flex;align-items:center;gap:var(--sp-10);text-decoration:none;position:relative;z-index:1; }
.ll-logo-icon {
  width:40px;height:40px;border-radius:var(--br-inner);
  background:linear-gradient(135deg,var(--lime),var(--cyan));
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.ll-logo-icon svg { width:22px;height:22px; }
.ll-logo-name { font-size:var(--fs-22);font-weight:var(--fw-black);color:var(--t1);/* letter-spacing:-0.5px; */ }
.ll-logo-tag  { font-size:var(--fs-12);color:var(--t5);display:block; }

.ll-body { flex:1;display:flex;flex-direction:column;justify-content:center;padding:var(--sp-40) 0 var(--sp-32);position:relative;z-index:1; }
.ll-headline { font-size:var(--fs-32);font-weight:var(--fw-black);/* line-height:1.15; */margin-bottom:var(--sp-12);color:var(--t1); }
.ll-headline .grad {
  background:linear-gradient(90deg,var(--lime),var(--cyan));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.ll-sub { font-size:var(--fs-16);color:var(--t4);/* line-height:1.6; */margin-bottom:var(--sp-40); }

.ll-features { display:flex;flex-direction:column;gap:var(--sp-20); }
.ll-feat      { display:flex;align-items:flex-start;gap:var(--sp-14); }
.ll-feat-icon { width:40px;height:40px;border-radius:var(--br-outer);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:var(--fs-16); }
.ll-feat-text h6 { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-2); }
.ll-feat-text p  { font-size:var(--fs-12);color:var(--t4);/* line-height:1.5; */margin:0; }

.ll-partners { position:relative;z-index:1; }
.ll-partners-lbl { font-size:var(--fs-10);font-weight:var(--fw-bold);/* letter-spacing:1.2px; */text-transform:uppercase;color:var(--white-a35);margin-bottom:var(--sp-14); }
.ll-partners-row { display:flex;gap:var(--sp-20);flex-wrap:wrap;align-items:center; }
.ll-partner      { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--white-a35);/* letter-spacing:-0.3px; */ }

/* Right auth panel */
.login-right {
  flex:1;background:var(--bg-alt);
  display:flex;align-items:center;justify-content:center;
  padding:var(--sp-40) var(--sp-24);position:relative;overflow:hidden;
}
.login-right::before {
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 70% 50% at 50% -10%,var(--purple-bd) 0%,transparent 60%),
             radial-gradient(ellipse 50% 40% at 90% 90%,var(--cyan-a10) 0%,transparent 55%);
}
.auth-box {
  background:var(--bg-card);border:1px solid var(--border-md);
  backdrop-filter:blur(24px);border-radius:var(--br-full);padding:var(--sp-40) var(--sp-40);
  width:100%;max-width:480px;position:relative;z-index:1;
}
.auth-brand       { text-align:center;margin-bottom:var(--sp-32); }
.auth-brand-icon  {
  width:64px;height:64px;border-radius:var(--br-outer);
  background:linear-gradient(135deg,var(--lime-a15),var(--cyan-a10));
  border:1px solid var(--lime-a15);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto var(--sp-14);font-size:var(--fs-28);color:var(--lime);
}
.auth-brand h2 { font-size:var(--fs-26);font-weight:var(--fw-extrabold);color:var(--t1);margin-bottom:var(--sp-8); }
.auth-brand p  { font-size:var(--fs-14);color:var(--t5); }

.form-grp       { margin-bottom:var(--sp-20); }
.form-grp label { display:block;font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--t3);margin-bottom:var(--sp-8);/* letter-spacing:0.2px; */ }
.form-grp .lbl-opt { font-size:var(--fs-12);font-weight:var(--fw-regular);color:var(--t5);margin-left:var(--sp-4); }
.inp-wrap       { position:relative; }
.inp-ico        { position:absolute;left:var(--pos-12);top:50%;transform:translateY(-50%);color:var(--t5);font-size:var(--fs-14);pointer-events:none; }
.inp-ico-right  { position:absolute;right:var(--pos-12);top:50%;transform:translateY(-50%);color:var(--white-a35);font-size:var(--fs-14);cursor:pointer;background:none;border:none;padding:0; }
.inp-icon-pad   { padding-left:var(--sp-40); }

.remember-row   { display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-24); }
.remember-row label { display:flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t4);cursor:pointer; }
.remember-row input[type=checkbox] { width:15px;height:15px;accent-color:var(--lime);cursor:pointer; }
.forgot-link    { font-size:var(--fs-14);color:var(--lime);text-decoration:none;font-weight:var(--fw-medium); }
.forgot-link:hover { text-decoration:underline; }

.sign-btn {
  width:100%;background:var(--grad);border:none;border-radius:var(--br-full);padding:var(--sp-14);
  font-size:var(--fs-16);font-weight:var(--fw-extrabold);color:var(--bg);cursor:pointer;
  font-family:'Inter',sans-serif;display:flex;align-items:center;justify-content:center;
  gap:var(--sp-10);transition:opacity var(--t-default),transform var(--t-default);
}
.sign-btn:hover { opacity:.92;transform:translateY(-1px); }

.vz-divider-text {
  display:flex;align-items:center;gap:var(--sp-12);margin:var(--sp-24) 0;
  color:var(--white-a35);font-size:var(--fs-12);
}
.vz-divider-text::before,.vz-divider-text::after {
  content:'';flex:1;height:1px;background:var(--border-md);
}
.sso-btn {
  width:100%;background:var(--bg-mid);border:1px solid var(--border-md);
  border-radius:var(--br-outer);padding:var(--sp-12);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t3);
  cursor:pointer;font-family:'Inter',sans-serif;display:flex;align-items:center;
  justify-content:center;gap:var(--sp-10);margin-bottom:var(--sp-10);transition:all var(--t-default);
}
.sso-btn:last-of-type { margin-bottom:0; }
.sso-btn:hover { background:var(--border-md);border-color:var(--border-lg); }
.sso-btn img { width:18px;height:18px; }

.auth-footer-note {
  text-align:center;font-size:var(--fs-12);color:var(--white-a35);margin-top:var(--sp-24);
  display:flex;align-items:center;justify-content:center;gap:var(--sp-4);
}
.auth-footer-note a { color:var(--lime);text-decoration:none;font-weight:var(--fw-medium); }
.register-link { text-align:center;font-size:var(--fs-14);color:var(--t4);margin-top:var(--sp-20); }
.register-link a { color:var(--lime);text-decoration:none;font-weight:var(--fw-semibold); }

@media(max-width:768px){
  .login-left { display:none; }
  .login-right { padding:var(--sp-32) var(--sp-16); }
  .auth-box { padding:var(--sp-32) var(--sp-24); }
}

/* ── 34. LANDING / MARKETING PAGE ── */
.lp-nav {
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:var(--sp-16) var(--sp-60);display:flex;align-items:center;justify-content:space-between;
  background:var(--bg);backdrop-filter:blur(16px);
  border-bottom:1px solid var(--bg-mid);
}
.lp-nav-logo { display:flex;align-items:center;gap:var(--sp-10);text-decoration:none; }
.lp-nav-logo-icon {
  width:36px;height:36px;border-radius:var(--br-inner);
  background:var(--grad);display:flex;align-items:center;justify-content:center;
}
.lp-nav-logo-icon svg { width:20px;height:20px; }
.lp-nav-logo-name { font-size:var(--fs-20);font-weight:var(--fw-black);color:var(--t1);/* letter-spacing:-0.5px; */ }
.lp-nav-logo-tag  { font-size:var(--fs-10);color:var(--t5);display:block; }
.lp-nav-links { display:flex;align-items:center;gap:var(--sp-32); }
.lp-nav-links a { font-size:var(--fs-14);color:var(--t3);text-decoration:none;font-weight:var(--fw-medium);transition:color var(--t-default); }
.lp-nav-links a:hover { color:var(--lime); }
.lp-nav-cta { display:flex;align-items:center;gap:var(--sp-12); }
.lp-btn-ghost {
  background:transparent;border:1px solid var(--border-lg);border-radius:var(--br-inner);
  padding:var(--sp-10) var(--sp-20);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t2);
  text-decoration:none;transition:all var(--t-default);
}
.lp-btn-ghost:hover { border-color:var(--lime-a60);color:var(--lime); }
.lp-btn-primary {
  background:var(--grad);border:none;border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-24);
  font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--bg);text-decoration:none;
  cursor:pointer;transition:opacity var(--t-default);
}
.lp-btn-primary:hover { opacity:.9; }

.lp-hero {
  min-height:100vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:var(--sp-120) var(--sp-60) var(--sp-80);position:relative;overflow:hidden;text-align:center;
}
.lp-hero::before {
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 70% 50% at 50% -10%,var(--lime-a10) 0%,transparent 60%),
             radial-gradient(ellipse 50% 40% at 10% 60%,var(--cyan-a10) 0%,transparent 50%),
             radial-gradient(ellipse 50% 40% at 90% 70%,var(--purple-a10) 0%,transparent 50%);
}
.lp-hero::after {
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:repeating-linear-gradient(0deg,transparent,transparent 80px,var(--bg-subtle) 80px,var(--bg-subtle) 81px),
                   repeating-linear-gradient(90deg,transparent,transparent 80px,var(--bg-subtle) 80px,var(--bg-subtle) 81px);
}
.hero-badge {
  display:inline-flex;align-items:center;gap:var(--sp-8);background:var(--lime-a10);
  border:1px solid var(--lime-a15);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);
  font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--lime);margin-bottom:var(--sp-28);position:relative;z-index:1;
}
.hero-h1 {
  font-size:var(--fs-fluid-lg);font-weight:var(--fw-black);/* line-height:1.08; */
  margin-bottom:var(--sp-24);position:relative;z-index:1;/* letter-spacing:-1.5px; */color:var(--t1);
}
.hero-h1 .grad {
  background:linear-gradient(90deg,var(--lime) 20%,var(--cyan) 80%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.hero-sub {
  font-size:var(--fs-18);color:var(--t4);max-width:660px;/* line-height:1.65; */
  margin-bottom:var(--sp-40);position:relative;z-index:1;
}
.hero-ctas {
  display:flex;align-items:center;gap:var(--sp-14);justify-content:center;
  margin-bottom:var(--sp-60);position:relative;z-index:1;flex-wrap:wrap;
}
.hero-btn {
  background:var(--grad);border:none;border-radius:var(--br-full);padding:var(--sp-16) var(--sp-32);
  font-size:var(--fs-16);font-weight:var(--fw-extrabold);color:var(--bg);text-decoration:none;cursor:pointer;
  display:inline-flex;align-items:center;gap:var(--sp-10);font-family:'Inter',sans-serif;
  transition:opacity var(--t-default),transform var(--t-default);
}
.hero-btn:hover { opacity:.9;transform:translateY(-2px); }
.hero-btn-ghost {
  background:transparent;border:1.5px solid var(--border-lg);border-radius:var(--br-full);
  padding:var(--sp-14) var(--sp-32);font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--t1);text-decoration:none;
  display:inline-flex;align-items:center;gap:var(--sp-10);transition:all var(--t-default);
}
.hero-btn-ghost:hover { border-color:var(--lime-a60);color:var(--lime); }

/* Hero mock frame */
.hero-mock {
  position:relative;z-index:1;max-width:900px;width:100%;
  background:var(--bg-card);border:1px solid var(--border-md);
  border-radius:var(--br-full);padding:var(--sp-4);
  box-shadow:0 0 80px var(--lime-a10),0 0 40px var(--black-a50);
}
.mock-bar {
  background:var(--bg-card);border-radius:var(--br-outer) var(--br-outer) 0 0;
  padding:var(--sp-10) var(--sp-16);display:flex;align-items:center;gap:var(--sp-8);
  border-bottom:1px solid var(--bg-mid);
}
.mock-dot    { width:10px;height:10px;border-radius:50%; }
.mock-label  { font-size:var(--fs-12);color:var(--t5);margin-left:var(--sp-8); }
.mock-screen {
  background:var(--bg);border-radius:0 0 var(--br-outer) var(--br-outer);padding:var(--sp-20);
  min-height:220px;display:grid;grid-template-columns:160px 1fr;gap:0;overflow:hidden;
}
.mock-sidebar { background:var(--bg-subtle);border-right:1px solid var(--border);padding:var(--sp-14) 0;border-radius:0 0 0 var(--br-outer); }
.mock-sidebar-item { display:flex;align-items:center;gap:var(--sp-8);padding:var(--sp-8) var(--sp-14);font-size:var(--fs-12);color:var(--t4); }
.mock-sidebar-item i { font-size:var(--fs-12); }
.mock-sidebar-item.active { background:var(--lime-a10);color:var(--lime);border-left:3px solid var(--lime); }
.mock-content { padding:var(--sp-14) var(--sp-20); }
.mock-title   { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-14); }
.mock-domain-grid { display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-8);margin-bottom:var(--sp-14); }
.mock-tile    { border-radius:var(--br-inner);padding:var(--sp-10) var(--sp-8);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.mt-g  { background:var(--green-a05);border:1px solid var(--green-bd);color:var(--green); }
.mt-a  { background:var(--amber-a10);border:1px solid var(--amber-bd);color:var(--amber); }
.mt-o  { background:var(--orange-a15);border:1px solid var(--orange-bd);color:var(--orange); }
.mt-r  { background:var(--red-a10);border:1px solid var(--red-bd);color:var(--red); }
.mock-tile .ts { font-size:var(--fs-16);font-weight:var(--fw-black);display:block;margin-bottom:var(--sp-2); }
.mock-stat-box { flex:1;border-radius:var(--br-inner);padding:var(--sp-10);text-align:center; }
.mock-stat-box .val { font-size:var(--fs-22);font-weight:var(--fw-black); }
.mock-stat-box .lbl { font-size:var(--fs-10);color:var(--t5); }

/* Trust bar */
.lp-trust {
  background:var(--bg-subtle);border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);padding:var(--sp-20) var(--sp-60);
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--sp-16);
}
.lp-trust-label { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--white-a35);text-transform:uppercase;/* letter-spacing:0.5px; */ }
.lp-trust-logos { display:flex;gap:var(--sp-32);align-items:center; }
.lp-trust-logo  { font-size:var(--fs-16);font-weight:var(--fw-extrabold);color:var(--border-lg);/* letter-spacing:-0.5px; */ }

/* Sections */
.lp-section { padding:var(--sp-100) var(--sp-60); }
.lp-section-hd { text-align:center; }
.section-badge {
  display:inline-flex;align-items:center;gap:var(--sp-8);background:var(--lime-a10);
  border:1px solid var(--lime-a15);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);
  font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--lime);margin-bottom:var(--sp-20);
}
.lp-h2 { font-size:var(--fs-fluid-sm);font-weight:var(--fw-black);/* line-height:1.15; */margin-bottom:var(--sp-16);/* letter-spacing:-0.5px; */ }
.lp-h2 .grad {
  background:linear-gradient(90deg,var(--lime),var(--cyan));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.lp-lead { font-size:var(--fs-16);color:var(--t4);/* line-height:1.65; */max-width:600px;margin:0 auto; }

/* Domain cards */
.lp-domains-grid { display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-12);margin-top:var(--sp-40); }
.lp-domain-card {
  background:var(--bg-card);border:1px solid var(--border);
  border-radius:var(--br-outer);padding:var(--sp-24) var(--sp-16);text-align:center;transition:all var(--t-default);cursor:pointer;
}
.lp-domain-card:hover { background:var(--bg-mid);border-color:var(--lime-a15);transform:translateY(-3px); }
.lp-domain-icon { width:52px;height:52px;border-radius:var(--br-outer);display:flex;align-items:center;justify-content:center;font-size:var(--fs-22);margin:0 auto var(--sp-14); }
.lp-domain-card h6 { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-8); }
.lp-domain-card p  { font-size:var(--fs-12);color:var(--t6);/* line-height:1.5; */margin:0; }

/* How it works */
.lp-how-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-2);background:var(--border);border:1px solid var(--border);border-radius:var(--br-outer);overflow:hidden;margin-top:var(--sp-40); }
.lp-how-step { background:var(--bg);padding:var(--sp-40) var(--sp-28);position:relative; }
.lp-step-num  { font-size:var(--fs-36);font-weight:var(--fw-black);color:var(--lime-a15);/* line-height:1; */margin-bottom:var(--sp-14); }
.lp-step-icon { width:48px;height:48px;border-radius:var(--br-outer);display:flex;align-items:center;justify-content:center;font-size:var(--fs-20);margin-bottom:var(--sp-16); }
.lp-how-step h5 { font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-8); }
.lp-how-step p  { font-size:var(--fs-14);color:var(--t4);/* line-height:1.6; */margin:0; }
.lp-how-arrow {
  position:absolute;top:50%;right:calc(var(--pos-16) * -1);transform:translateY(-50%);
  width:28px;height:28px;background:var(--bg);border:1px solid var(--border-md);
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-12);color:var(--t4);z-index:1;
}
.lp-how-step:last-child .lp-how-arrow { display:none; }

/* Journey stages */
.lp-journey { background:linear-gradient(180deg,transparent,var(--lime-a10) 40%,transparent);border-top:1px solid var(--border);border-bottom:1px solid var(--border); }
.lp-journey-stages { display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:var(--sp-40);position:relative; }
.lp-journey-stages::before {
  content:'';position:absolute;top:var(--pos-28);left:10%;right:10%;height:2px;
  background:linear-gradient(90deg,var(--red),var(--amber),var(--lime),var(--cyan),var(--purple));z-index:0;
}
.lp-stage { text-align:center;position:relative;z-index:1;padding:0 var(--sp-14); }
.lp-stage-dot { width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--fs-22);margin:0 auto var(--sp-14);border:3px solid; }
.lp-stage-title  { font-size:var(--fs-16);font-weight:var(--fw-extrabold);margin-bottom:var(--sp-8); }
.lp-stage-range  { font-size:var(--fs-12);color:var(--t5);margin-bottom:var(--sp-10); }
.lp-stage-desc   { font-size:var(--fs-12);color:var(--t4);/* line-height:1.55; */ }

/* Stats bar */
.lp-stats-bar { background:var(--bg-subtle);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:var(--sp-60); }
.lp-stats-grid { display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-2);background:var(--border);border:1px solid var(--border);border-radius:var(--br-outer);overflow:hidden; }
.lp-stat-cell  { background:var(--bg);padding:var(--sp-28);text-align:center; }
.lp-stat-val   { font-size:var(--fs-32);font-weight:var(--fw-black);color:var(--lime);margin-bottom:var(--sp-8); }
.lp-stat-lbl   { font-size:var(--fs-14);color:var(--t4); }

/* Plans */
.lp-plans-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-16);margin-top:var(--sp-40); }
.lp-plan-card  {
  background:var(--bg-card);border:1px solid var(--border-md);
  border-radius:var(--br-outer);padding:var(--sp-28);position:relative;transition:all var(--t-default);
}
.lp-plan-card:hover { transform:translateY(-3px);box-shadow:0 12px 40px var(--black-a25); }
.lp-plan-card.featured { border-color:var(--purple-bd);background:var(--purple-bg); }
.lp-plan-badge { position:absolute;top:calc(var(--pos-4) * -1);right:var(--pos-20);background:var(--purple);color:var(--t1);font-size:var(--fs-10);font-weight:var(--fw-extrabold);padding:var(--sp-4) var(--sp-12);border-radius:0 0 var(--br-inner) var(--br-inner);/* letter-spacing:0.3px; */ }
.lp-plan-icon  { width:48px;height:48px;border-radius:var(--br-outer);display:flex;align-items:center;justify-content:center;font-size:var(--fs-22);margin-bottom:var(--sp-14); }
.lp-plan-name  { font-size:var(--fs-20);font-weight:var(--fw-black);color:var(--t1);margin-bottom:var(--sp-8); }
.lp-plan-desc  { font-size:var(--fs-12);color:var(--t4);/* line-height:1.5; */margin-bottom:var(--sp-16); }
.lp-plan-price { font-size:var(--fs-32);font-weight:var(--fw-black);color:var(--t1);margin-bottom:var(--sp-4); }
.lp-plan-price sub { font-size:var(--fs-14);font-weight:var(--fw-regular);color:var(--t4); }
.lp-plan-period { font-size:var(--fs-14);color:var(--t4);margin-bottom:var(--sp-20); }
.lp-plan-features { list-style:none;padding:0;margin:0 0 var(--sp-24); }
.lp-plan-features li { display:flex;align-items:flex-start;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t3);margin-bottom:var(--sp-10);/* line-height:1.4; */ }
.lp-plan-features li i { color:var(--lime);flex-shrink:0;margin-top:var(--sp-2);font-size:var(--fs-12); }
.lp-plan-btn { width:100%;padding:var(--sp-12);border-radius:var(--br-full);font-size:var(--fs-14);font-weight:var(--fw-bold);cursor:pointer;font-family:'Inter',sans-serif;text-align:center;text-decoration:none;display:block;transition:all var(--t-default); }
.lp-plan-btn-outline { background:transparent;border:1.5px solid var(--border-lg);color:var(--t3); }
.lp-plan-btn-outline:hover { border-color:var(--lime-a60);color:var(--lime); }
.lp-plan-btn-fill { background:linear-gradient(135deg,var(--purple),var(--cyan));border:none;color:var(--t1); }

/* CTA section */
.lp-cta { text-align:center;padding:var(--sp-100) var(--sp-60);border-top:1px solid var(--border); }
.lp-cta h2 { font-size:var(--fs-fluid-md);font-weight:var(--fw-black);margin-bottom:var(--sp-16);/* letter-spacing:-0.5px; */ }
.lp-cta p  { font-size:var(--fs-16);color:var(--t4);max-width:560px;margin:0 auto var(--sp-40);/* line-height:1.65; */ }
.lp-cta-feats { display:flex;gap:var(--sp-28);justify-content:center;margin-bottom:var(--sp-40);flex-wrap:wrap; }
.lp-cta-feat  { display:flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t4); }
.lp-cta-feat i { color:var(--lime);font-size:var(--fs-14); }

/* Footer */
.lp-footer { background:var(--bg);border-top:1px solid var(--border);padding:var(--sp-40) var(--sp-60) var(--sp-32); }
.lp-footer-grid { display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:var(--sp-40);margin-bottom:var(--sp-40); }
.lp-footer-brand p { font-size:var(--fs-14);color:var(--t6);/* line-height:1.65; */margin-top:var(--sp-14); }
.lp-footer-col h6 { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t3);text-transform:uppercase;/* letter-spacing:0.8px; */margin-bottom:var(--sp-14); }
.lp-footer-col a  { display:block;font-size:var(--fs-14);color:var(--t4);text-decoration:none;margin-bottom:var(--sp-10);transition:color var(--t-default); }
.lp-footer-col a:hover { color:var(--lime); }
.lp-footer-bottom { display:flex;align-items:center;justify-content:space-between;padding-top:var(--sp-24);border-top:1px solid var(--border);font-size:var(--fs-12);color:var(--white-a35);flex-wrap:wrap;gap:var(--sp-12); }

@media(max-width:768px){
  .lp-nav { padding:var(--sp-16) var(--sp-20); }
  .lp-nav-links { display:none; }
  .lp-hero,.lp-section,.lp-cta { padding:var(--sp-80) var(--sp-20); }
  .lp-trust { padding:var(--sp-20); }
  .lp-stats-bar { padding:var(--sp-40) var(--sp-20); }
  .lp-footer { padding:var(--sp-40) var(--sp-20); }
  .lp-domains-grid,.lp-how-grid,.lp-plans-grid { grid-template-columns:1fr; }
  .lp-stats-grid { grid-template-columns:repeat(2,1fr); }
  .lp-footer-grid { grid-template-columns:1fr; }
}

/* ── 35. MISC APP COMPONENTS ── */
/* Gradient text helper */
.grad-text {
  background:var(--grad);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
/* Glow radial overlay (hero backgrounds) */
.vz-glow-bg::before {
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 50% at 50% 0%,var(--lime-a10) 0%,transparent 60%);
}
/* Page-level glow card (assessment submitted etc.) */
.page-glow { position:relative;overflow:hidden; }
.page-glow::before {
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 60% 50% at 50% -10%,var(--lime-a10) 0%,transparent 55%);
}

/* Inline trust badge row */
.trust-row { display:flex;justify-content:center;gap:var(--sp-20);flex-wrap:wrap; }
.trust-item { display:flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-12);color:var(--t5); }
.trust-item i { font-size:var(--fs-14); }

/* Step number circle */
.step-num {
  width:48px;height:48px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-20);font-weight:var(--fw-black);flex-shrink:0;
}
.step-num-lime   { background:var(--lime-a10);border:2px solid var(--lime-a15);color:var(--lime); }
.step-num-cyan   { background:var(--cyan-a10);border:2px solid var(--cyan-bd);color:var(--cyan); }
.step-num-purple { background:var(--purple-a10);border:2px solid var(--purple-bd);color:var(--purple); }
.step-num-green  { background:var(--green);border:none;color:var(--t1); }
.step-num-amber  { background:var(--orange-a15);border:2px solid var(--orange);color:var(--orange); }
.step-num-ghost  { background:var(--bg-mid);border:1px solid var(--border-lg);color:var(--white-a35); }
/* Small step circle (28px) used in verification flow */
.step-num { width:48px;height:48px; }
.step-num-sm { width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0; }
/* Step connector vertical line */
.step-connector { width:1px;height:16px;background:var(--border);margin-left:var(--sp-14);margin-bottom:var(--sp-14); }
/* Registration success ring */
.reg-success-ring { position:relative;width:96px;height:96px;border-radius:50%;background:var(--green-a05);border:2px solid var(--green-bd);display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-24); }
.reg-success-inner { width:72px;height:72px;border-radius:50%;background:var(--green-bd);display:flex;align-items:center;justify-content:center; }
.orbit-dot { position:absolute;border-radius:50%; }
.orbit-dot-lime { top:calc(var(--pos-4) * -1);right:var(--pos-16);width:10px;height:10px;background:var(--lime);box-shadow:0 0 8px var(--lime-a60); }
.orbit-dot-cyan { bottom:calc(var(--pos-4) * -1);left:var(--pos-16);width:8px;height:8px;background:var(--cyan);box-shadow:0 0 6px var(--cyan-a78); }
/* Plan activated hero ring */
.plan-activated-ring { position:relative;width:110px;height:110px;border-radius:50%;background:var(--lime-a10);border:2px solid var(--lime-a15);display:flex;align-items:center;justify-content:center;margin:0 auto var(--sp-28); }
.plan-activated-inner { width:82px;height:82px;border-radius:50%;background:linear-gradient(135deg,var(--lime-a15),var(--cyan-bd));display:flex;align-items:center;justify-content:center; }
.plan-activated-summary { border-color:var(--lime-a15); }
/* Sparkle dots */
.sparkle-dot { position:absolute;border-radius:50%; }
.sparkle-lime { background:var(--lime);box-shadow:0 0 10px var(--lime-a80); }
.sparkle-cyan { background:var(--cyan);box-shadow:0 0 8px var(--cyan-a80); }
.sparkle-purple { background:var(--purple);box-shadow:0 0 6px var(--purple-a95); }
.sparkle-tr { top:var(--pos-4);right:var(--pos-4);width:12px;height:12px; }
.sparkle-bl { bottom:var(--pos-8);left:var(--pos-4);width:8px;height:8px; }
.sparkle-tl { top:var(--pos-16);left:var(--pos-4);width:6px;height:6px; }

/* Timeline / journey step */
.journey-step-check {
  width:32px;height:32px;border-radius:50%;background:var(--green);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.journey-step-line { width:2px;flex:1;min-height:32px;background:var(--border);margin:var(--sp-4) 0; }
.journey-step-active { width:32px;height:32px;border-radius:50%;background:var(--grad);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 0 14px var(--lime-a60); }
.journey-step-next  { width:32px;height:32px;border-radius:50%;background:var(--bg-mid);border:1px solid var(--border-lg);display:flex;align-items:center;justify-content:center;flex-shrink:0; }

/* Assessment maturity journey mini */
.mj-stage { text-align:center;z-index:1;flex:1;position:relative; }
/* .mj-track uses align-items:flex-start (not center) so column height
   differences — from the larger current dot, or per-column subtext wrapping —
   never shift dot vertical position. Every dot's own center must therefore
   land at the same offset from the column top: the 40px dots get a 4px
   top-margin so their center matches the 48px current dot's, which sits
   flush against the column top. */
.mj-stage-dot { width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:4px auto var(--sp-8);font-size:var(--fs-14); }
.mj-stage-dot-current { width:48px;height:48px;font-size:var(--fs-18);position:relative;margin-top:0; }
.mj-stage-lbl { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t2);margin-top:var(--sp-8);/* line-height:1.3; */ }
.mj-stage-sub { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-4);/* line-height:1.4; */ }
.mj-dot-inactive { background:var(--bg-mid);border:1px solid var(--border-md); }
.mj-ico-inactive { color:var(--border-lg);font-size:var(--fs-14); }

/* Compliance badge row */
.compliance-row { display:flex;justify-content:center;gap:var(--sp-20);flex-wrap:wrap; }
.compliance-badge { background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t3);display:flex;align-items:center;gap:var(--sp-8); }

/* Feature item (assessment flow step) */
.flow-step { text-align:center;padding:var(--sp-20) var(--sp-14);background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--br-outer); }
.flow-step h6 { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-8); }
.flow-step p  { font-size:var(--fs-12);color:var(--t4);/* line-height:1.5; */margin:0; }

/* Report include card */
.report-inc-card { border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-16);text-align:center; }
.report-inc-card h6 { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-4); }
.report-inc-card p  { font-size:var(--fs-12);color:var(--t6);/* line-height:1.5; */margin:0; }

/* Maturity journey progress line container */
.mj-body  { overflow-x:auto; }
.mj-track { position:relative;display:flex;justify-content:space-between;align-items:flex-start;padding:var(--sp-10) 0;min-width:560px; }
.mj-track::before { content:'';position:absolute;top:var(--pos-34);left:10%;right:10%;height:3px;background:var(--border);border-radius:var(--br-inner);z-index:0; }
.mj-progress-line { position:absolute;top:var(--pos-34);left:10%;height:3px;border-radius:var(--br-inner);background:linear-gradient(90deg,var(--red),var(--amber),var(--lime));z-index:0; }

/* Glow ring for shield icon */
.glow-ring { position:absolute;inset:-20px;border-radius:50%;background:radial-gradient(circle,var(--lime-a15) 0%,transparent 70%);animation:pulse-ring 2.5s ease-in-out infinite;pointer-events:none; }

/* Section label (app pages) */
.page-section-tag { font-size:var(--fs-10);font-weight:var(--fw-bold);/* letter-spacing:1.4px; */text-transform:uppercase;color:var(--white-a35);margin-bottom:var(--sp-4); }

.mt-n5 {
  margin-top: -5px;
}
.fx,
.form-group .fx {
  display: flex;
}
.submit-btn.cst-w-a {
  width: auto;
  padding-left: var(--sp-32);
  padding-right: var(--sp-32);
}

/* ================================================================
   DASHBOARD-1  (dashboard-1.html)  — pixel-perfect File Cover-28
   ================================================================ */

/* ── Logo wrapper — distinct darker panel matching screenshot ── */
.d1-logo-wrapper {
  background: var(--black-a25);
  border-right: 1px solid var(--bg-mid);
  padding: 0 var(--sp-20);
  min-width: 220px;
  justify-content: space-between;
}
.d1-logo-text { /* line-height: 1.15; */ }
.d1-logo-name { font-size:var(--fs-20); font-weight:var(--fw-black); color: var(--t1); /* letter-spacing: -0.5px; */ display: block; }
.d1-logo-tag  { font-size:var(--fs-10); color: var(--t1); /* letter-spacing: 0.3px; */ display: block; margin-top: var(--sp-2); }
.d1-toggle-btn {
  color: var(--t4);
  font-size:var(--fs-16);
  text-decoration: none;
  transition: color var(--t-default);
  padding: var(--sp-8);
}
.d1-toggle-btn:hover { color: var(--lime); }

/* Mobile-only logo + close button shown inside the sidebar once the
   header logo is hidden at ≤768px (see .d1-logo-wrapper .vz-logo below).
   The close button reuses .toggle-sidebar (see sidebar.js) so it collapses
   the sidebar the same way the header hamburger opens it — needed because
   .page-sidebar and header share z-index:3 on mobile and the sidebar
   renders later in the DOM, so an open sidebar visually covers the header
   (hamburger included), leaving no other way to close it. */
.d1-sidebar-mobile-header {
  display: none;
  align-items: center;
  justify-content: space-between;
}
.d1-sidebar-mobile-logo img { height: 28px; }
.d1-sidebar-close-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  color: var(--t4);
  font-size: var(--fs-18);
  flex-shrink: 0;
}
.d1-sidebar-close-btn:hover { color: var(--lime); }

/* ── Sidebar icons (Font Awesome per item) ── */
.sidebar-icon {
  font-size:var(--fs-14);
  width: 16px;
  text-align: center;
  flex-shrink: 0;
  transition: color var(--t-fast);
}

/* ── Sidebar link hover — lime accent consistent with palette ── */
/* Redundant with global block's higher-specificity rule; kept for specificity parity */
.page-sidebar .sidebar-link:not(.active):hover {
  background: var(--lime-a10);
  color: var(--lime);
}
.page-sidebar .sidebar-link:not(.active):hover h6 { color: var(--lime); }
.page-sidebar .sidebar-link:not(.active):hover .sidebar-icon { color: var(--lime); }

/* ── Redesigned main header ── */
/* .page-main-header inherits Bootstrap's .col (flex: 1 0 0 — note
   flex-shrink:0). Combined with .page-header's .row (flex-wrap:wrap), a
   flex-shrink:0 item refuses to shrink below its content's min-content
   width, so the row wraps it onto its own line no matter how much content
   is trimmed inside it. min-width:0 is what actually lets it shrink and
   stay on the same row as .logo-wrapper at narrow widths. */
.d1-main-header {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0;
  padding: 0 var(--sp-16) 0 var(--sp-24);
}

/* Breadcrumb — left-anchored */
.d1-breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--sp-8);
  font-size:var(--fs-14);
  flex-shrink: 0;
}
.d1-bc-home {
  color: var(--t4); text-decoration: none;
  display: flex; align-items: center; gap: var(--sp-4);
  transition: color var(--t-fast);
}
.d1-bc-home:hover { color: var(--t2); }
.d1-bc-sep    { font-size:var(--fs-10); color: var(--t5); }
.d1-bc-active { font-size:var(--fs-14); font-weight:var(--fw-semibold); color: var(--t2); }

/* Flex spacer — pushes search+right to far right */
.d1-header-spacer { flex: 1; }

/* Search bar — icon sits inside, icon is absolutely positioned */
.d1-search-wrap {
  position: relative;
  width: 200px;
  flex-shrink: 0;
}
.d1-search-icon {
  position: absolute;
  right: var(--pos-12);
  top: 50%;
  transform: translateY(-50%);
  font-size:var(--fs-14);
  color: var(--white-a35);
  pointer-events: none;
  z-index: 1;
}
.d1-search-input {
  width: 100%;
  padding: var(--sp-8) var(--sp-32) var(--sp-8) var(--sp-14);
  background: var(--bg-mid);
  border: 1px solid var(--border-md);
  border-radius: var(--br-inner);
  color: var(--t2);
  font-size:var(--fs-14);
  font-family: 'Inter', sans-serif;
  outline: none;
  box-sizing: border-box;
  transition: border-color var(--t-default), background var(--t-default);
}
.d1-search-input::placeholder { color: var(--t5); }
.d1-search-input:focus {
  border-color: var(--lime-a60);
  background: var(--border);
}
.d1-search-input:focus + .d1-search-icon,
.d1-search-wrap:focus-within .d1-search-icon { color: var(--lime); }

/* Bell + profile cluster */
.d1-header-right {
  display: flex; align-items: center;
  gap: var(--sp-16); margin-left: var(--sp-16); flex-shrink: 0;
}
.d1-notif-outer { position: relative; }
.d1-bell-wrap  { position: relative; cursor: pointer; padding: var(--sp-4); }
.d1-bell-icon  { font-size:var(--fs-18); color: var(--amber); transition: transform var(--t-fast); }
.d1-bell-wrap:hover .d1-bell-icon { transform: rotate(-12deg) scale(1.1); }
.d1-notif-dot {
  position: absolute; top: 2px; right: 2px;
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--red); border: 1.5px solid var(--dark-navy);
}

/* Notification dropdown */
.d1-notif-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + var(--pos-8));
  right: 0;
  width: 320px;
  max-height: 380px;
  overflow-y: auto;
  background: var(--dark-navy);
  border: 1px solid var(--border-md);
  border-radius: var(--br-outer);
  box-shadow: 0 12px 36px var(--black-a50);
  z-index: 9999;
  animation: d1-dd-in .15s ease;
}
.d1-notif-dropdown.open { display: block; }
.d1-notif-title { font-size:var(--fs-14); font-weight:var(--fw-bold); color: var(--t1); }
.d1-notif-item {
  padding: var(--sp-10) var(--sp-16);
  border-bottom: 1px solid var(--bg-mid);
}
.d1-notif-item:last-child { border-bottom: 0; }
.d1-notif-item-title { font-size:var(--fs-13); font-weight:var(--fw-medium); color: var(--t2); }
.d1-notif-item-meta { font-size:var(--fs-11); color: var(--t5); margin-top: var(--sp-2); }
.d1-notif-item-sep { margin: 0 var(--sp-4); }
.d1-notif-empty { padding: var(--sp-20) var(--sp-16); text-align: center; font-size:var(--fs-13); color: var(--t5); }

/* Notification footer with action buttons */
.d1-notif-footer {
  display: flex;
  gap: var(--sp-8);
  padding: var(--sp-12) var(--sp-16);
  border-top: 1px solid rgba(255,255,255,0.05);
  background: rgba(255,255,255,0.02);
}
.d1-notif-btn {
  flex: 1;
  padding: var(--sp-8) var(--sp-12);
  border: none;
  border-radius: var(--br-inner);
  font-size: var(--fs-12);
  font-weight: var(--fw-semibold);
  cursor: pointer;
  transition: all var(--t-fast);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.d1-notif-btn-primary {
  background: var(--amber);
  color: #070707;
}
.d1-notif-btn-primary:hover {
  background: #ffc107;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(255,193,7,0.25);
}
.d1-notif-btn-secondary {
  background: rgba(255,193,7,0.1);
  color: var(--amber);
  border: 1px solid rgba(255,193,7,0.3);
}
.d1-notif-btn-secondary:hover {
  background: rgba(255,193,7,0.15);
  border-color: rgba(255,193,7,0.5);
  transform: translateY(-1px);
}

/* Profile trigger */
.d1-profile-outer { position: relative; }
.d1-profile-wrap  {
  display: flex; align-items: center; gap: var(--sp-8);
  cursor: pointer; padding: var(--sp-4) var(--sp-8);
  border-radius: var(--br-inner); transition: background var(--t-fast);
}
.d1-profile-wrap:hover { background: var(--bg-mid); }
.d1-profile-wrap.open  { background: var(--border); }
.d1-avatar {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--grad);
  display: flex; align-items: center; justify-content: center;
  font-size:var(--fs-12); font-weight:var(--fw-extrabold); color: var(--bg); flex-shrink: 0;
  object-fit: cover;
}
.d1-profile-name  { font-size:var(--fs-14); font-weight:var(--fw-semibold); color: var(--t2); }
.d1-profile-caret {
  font-size:var(--fs-10); color: var(--t4);
  transition: transform var(--t-default);
}
.d1-profile-wrap.open .d1-profile-caret { transform: rotate(180deg); }

/* Profile dropdown */
.d1-profile-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + var(--pos-8));
  right: 0;
  width: 200px;
  background: var(--dark-navy);
  border: 1px solid var(--border-md);
  border-radius: var(--br-outer);
  box-shadow: 0 12px 36px var(--black-a50);
  z-index: 9999;
  overflow: hidden;
  animation: d1-dd-in .15s ease;
}
.d1-profile-dropdown.open { display: block; }
@keyframes d1-dd-in {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.d1-pd-header {
  display: flex; align-items: center; gap: var(--sp-10);
  padding: var(--sp-14) var(--sp-16);
  border-bottom: 1px solid var(--border);
}
.d1-pd-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--grad);
  display: flex; align-items: center; justify-content: center;
  font-size:var(--fs-12); font-weight:var(--fw-extrabold); color: var(--bg); flex-shrink: 0;
  object-fit: cover;
}
.d1-pd-name { font-size:var(--fs-14); font-weight:var(--fw-bold); color: var(--t1); }
.d1-pd-role { font-size:var(--fs-12); color: var(--t5); margin-top: var(--sp-2); }
.d1-pd-divider { height: 1px; background: var(--border); }
.d1-pd-item {
  display: flex; align-items: center; gap: var(--sp-10);
  padding: var(--sp-10) var(--sp-16);
  font-size:var(--fs-14); font-weight:var(--fw-medium); color: var(--t3);
  text-decoration: none; transition: all var(--t-fast);
}
.d1-pd-item:hover { background: var(--bg-mid); color: var(--t1); }
.d1-pd-item i { font-size:var(--fs-14); width: 16px; text-align: center; color: var(--t4); }
.d1-pd-item:hover i { color: var(--lime); }
.d1-pd-logout { color: var(--red); }
.d1-pd-logout:hover { background: var(--red-a10); }
.d1-pd-logout i { color: var(--red); }

/* ── Page title row ── */
.d1-pt-row     { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--sp-12); }
.d1-page-title { font-size:var(--fs-22); font-weight:var(--fw-extrabold); color: var(--t1); margin-bottom: var(--sp-4); /* letter-spacing: -0.3px; */ }
.d1-page-sub   { font-size:var(--fs-14); color: var(--t4); }

/* Period select — dark on open/focus */
.d1-period-select {
  background: var(--bg-mid);
  border: 1px solid var(--border-md);
  border-radius: var(--br-inner);
  padding: var(--sp-8) var(--sp-40) var(--sp-8) var(--sp-14);
  font-size:var(--fs-14); color: var(--t2);
  font-family: 'Inter', sans-serif;
  appearance: none; cursor: pointer;
  transition: border-color var(--t-fast), background var(--t-fast);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='var(--t6)' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
}
.d1-period-select:focus,
.d1-period-select:active {
  outline: none;
  background-color: var(--black-a50);
  border-color: var(--lime-a60);
}
.d1-period-select option { background: var(--dark-navy); color: var(--t1); }

/* ── Score summary strip ── */
.d1-strip .card-body { padding: 0; }
.d1-strip-inner {
  display: grid;
  grid-template-columns: 230px 1fr 270px;
  border: 1px solid var(--border);
  border-radius: var(--br-outer);
  overflow: hidden;
}
.d1-strip-col        { padding: var(--sp-24) var(--sp-28); border-right: 1px solid var(--border); }
.d1-strip-col:last-child { border-right: none; }
.d1-strip-lbl  { font-size:var(--fs-14); font-weight:var(--fw-bold); /* letter-spacing: 1.4px; */ text-transform: uppercase; color: var(--white-a35); margin-bottom: var(--sp-12); }
.d1-strip-col-score { text-align: center; }
#d1ScoreChart  { margin: 0 auto; }
.d1-score-caption { font-size:var(--fs-14); color: var(--t5); margin-top: var(--sp-4); /* line-height: 1.5; */ }
.d1-strip-col-grade { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.d1-grade-pill { background: var(--green); color: var(--t1); border-radius: var(--br-full); padding: var(--sp-10) var(--sp-32); font-size:var(--fs-18); font-weight:var(--fw-extrabold); display: inline-block; margin-bottom: var(--sp-10); box-shadow: 0 4px 16px var(--green-bd); }
.d1-grade-sub  { font-size:var(--fs-14); color: var(--t5); /* line-height: 1.5; */ }
.d1-info-row   { display: flex; align-items: center; justify-content: space-between; padding: var(--sp-8) 0; border-bottom: 1px solid var(--bg-mid); font-size:var(--fs-14); }
.d1-info-row:last-child { border-bottom: none; }
.d1-info-lbl   { color: var(--t4); font-size:var(--fs-14); }
.d1-info-val   { color: var(--t2); }
.d1-info-bold  { font-weight:var(--fw-bold); color: var(--t1); }
.d1-plan-val   { display: flex; align-items: center; gap: var(--sp-8); font-weight:var(--fw-bold); color: var(--t1); }
.d1-plan-icon  { width: 20px; height: 20px; border-radius: var(--br-inner); background: var(--lime-a15); display: flex; align-items: center; justify-content: center; font-size:var(--fs-10); color: var(--lime); }
.d1-status-badge { background: var(--green); color: var(--t1); border-radius: var(--br-full); padding: var(--sp-4) var(--sp-12); font-size:var(--fs-12); font-weight:var(--fw-bold); }

/* ── Domain Dashboard extras ── */
.d1-domain-title-row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:var(--sp-12); }
.d1-domain-title-h   { font-size:var(--fs-24); font-weight:var(--fw-black); color:var(--t1); margin:0; /* letter-spacing:-.3px; */ }
.d1-org-info         { display:flex; align-items:center; gap:var(--sp-20); flex-wrap:wrap; }
.d1-org-item         { display:inline-flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-14); color:var(--t4); }
.d1-org-item i       { color:var(--t5); font-size:var(--fs-12); }
.d1-grade-pill-amber  { background:var(--amber);  color:var(--bg); border-radius:var(--br-full); padding:var(--sp-10) var(--sp-32); font-size:var(--fs-18); font-weight:var(--fw-extrabold); display:inline-block; margin-bottom:var(--sp-10); box-shadow:0 4px 16px var(--amber-bd); }
.d1-grade-pill-orange { background:var(--orange); color:var(--t1);    border-radius:var(--br-full); padding:var(--sp-10) var(--sp-32); font-size:var(--fs-18); font-weight:var(--fw-extrabold); display:inline-block; margin-bottom:var(--sp-10); box-shadow:0 4px 16px var(--amber2-a30); }
.d1-grade-pill-red    { background:var(--red);    color:var(--t1);    border-radius:var(--br-full); padding:var(--sp-10) var(--sp-32); font-size:var(--fs-18); font-weight:var(--fw-extrabold); display:inline-block; margin-bottom:var(--sp-10); box-shadow:0 4px 16px var(--red-bd); }
.d1-grade-pill-lime   { background:var(--lime);   color:var(--bg); border-radius:var(--br-full); padding:var(--sp-10) var(--sp-32); font-size:var(--fs-18); font-weight:var(--fw-extrabold); display:inline-block; margin-bottom:var(--sp-10); box-shadow:0 4px 16px var(--lime-a15); }
.d1-ctrl-stat        { display:flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-14); color:var(--t3); padding:var(--sp-4) 0; }
.d1-ctrl-stat i      { font-size:var(--fs-12); flex-shrink:0; }
.d1-cs-lbl           { font-size:var(--fs-12); color:var(--t4); }
.d1-cs-val           { font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--t1); }
.d1-impr-badge-row   { display:flex; align-items:center; gap:var(--sp-8); flex-shrink:0; }
.d1-impr-score-val   { font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--t2); }

/* ── Domain Risk Overview ── */
.d1-domain-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--sp-12); }
.d1-sub      { font-size:var(--fs-12); color: var(--t4); }
.d1-legend   { display: flex; align-items: center; gap: var(--sp-14); flex-wrap: wrap; }
.d1-leg-item { display: flex; align-items: center; gap: var(--sp-4); font-size:var(--fs-12); color: var(--t4); }
.d1-leg-dot  { width: 12px; height: 12px; border-radius: var(--br-inner); flex-shrink: 0; }
.d1-domain-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: var(--sp-10); }
/* Base card */
.d1-dt {
  border-radius: var(--br-outer); padding: var(--sp-16) var(--sp-14); text-decoration: none; display: block;
  position: relative; overflow: hidden; min-height: 110px; cursor: pointer;
  transition: transform var(--t-default) cubic-bezier(0.34,1.56,0.64,1), box-shadow var(--t-default) ease, background var(--t-default) ease, border-color var(--t-default) ease;
}
/* Diagonal shimmer sweep on hover */
.d1-dt::before {
  content: ''; position: absolute; top: 0; left: 0;
  width: 55%; height: 100%;
  background: linear-gradient(105deg, transparent 0%, var(--border) 50%, transparent 100%);
  transform: translateX(-160%); transition: transform var(--t-slow) ease;
  pointer-events: none; border-radius: inherit;
}
.d1-dt:hover::before { transform: translateX(260%); }
/* Lift all content above the shimmer layer */
.d1-dt > * { position: relative; z-index: 1; }

/* Score — spring-scales up on hover */
.d1-dt-score { font-size:var(--fs-28); font-weight:var(--fw-black); /* line-height: 1; */ margin-bottom: var(--sp-4); display: inline-block; transition: transform var(--t-default) cubic-bezier(0.34,1.56,0.64,1); transform-origin: left center; }
.d1-dt:hover .d1-dt-score { transform: scale(1.13); }

.d1-dt-name  { font-size:var(--fs-12); font-weight:var(--fw-semibold); /* line-height: 1.3; */ margin-bottom: var(--sp-4); }
.d1-dt-grade { font-size:var(--fs-12); font-weight:var(--fw-semibold); opacity: .85; }

/* Arrow — nudges right and brightens on hover */
.d1-dt-arrow { position: absolute; bottom: var(--pos-12); right: var(--pos-12); width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size:var(--fs-10); transition: transform var(--t-default) cubic-bezier(0.34,1.56,0.64,1), background var(--t-default) ease; }
.d1-dt:hover .d1-dt-arrow { transform: translateX(4px); }
.d1-arrow-green  { background: var(--green-bd);  color: var(--green); }
.d1-arrow-amber  { background: var(--amber-bd);  color: var(--amber); }
.d1-arrow-orange { background: var(--orange-bd);  color: var(--orange); }
.d1-arrow-red    { background: var(--red-bd);   color: var(--red); }
.d1-dt-green:hover  .d1-dt-arrow { background: var(--green-bd); }
.d1-dt-amber:hover  .d1-dt-arrow { background: var(--amber-a50); }
.d1-dt-orange:hover .d1-dt-arrow { background: var(--orange-bd); }
.d1-dt-red:hover    .d1-dt-arrow { background: var(--red-a62); }

/* Lock icon */
.d1-lock-icon { position: absolute; bottom: var(--pos-12); right: var(--pos-12); font-size:var(--fs-14); color: var(--border-lg); transition: color var(--t-default) ease; }

/* Color variants */
.d1-dt-green  { background: var(--green-a05);  border: 1px solid var(--green-bd);  color: var(--green); }
.d1-dt-amber  { background: var(--amber-a10);  border: 1px solid var(--amber-bd);  color: var(--amber); }
.d1-dt-orange { background: var(--orange-a15);  border: 1px solid var(--orange-bd);  color: var(--orange); }
.d1-dt-red    { background: var(--red-a10);   border: 1px solid var(--red-bd);   color: var(--red); }
.d1-dt-locked { background: var(--bg-card); border: 1px solid var(--border); color: var(--white-a35); }
.d1-dt-locked .d1-dt-score { color: var(--border-lg); font-size:var(--fs-22); }
.d1-dt-locked .d1-dt-name  { color: var(--white-a35); }

/* Hover — lift + deep colored glow + inset rim light */
.d1-dt-green:hover  { transform: translateY(-7px); background: var(--green-bd);  border-color: var(--green-a85);  box-shadow: 0 16px 40px var(--green-bd),  0 0 0 1px var(--green-bd)  inset; }
.d1-dt-amber:hover  { transform: translateY(-7px); background: var(--amber-bd);  border-color: var(--amber-a50);  box-shadow: 0 16px 40px var(--amber-bd),  0 0 0 1px var(--amber-bd)  inset; }
.d1-dt-orange:hover { transform: translateY(-7px); background: var(--orange-bd);  border-color: var(--orange-a82);  box-shadow: 0 16px 40px var(--orange-bd),  0 0 0 1px var(--orange-a15)  inset; }
.d1-dt-red:hover    { transform: translateY(-7px); background: var(--red-bd);   border-color: var(--red-a62);   box-shadow: 0 16px 40px var(--red-bd),   0 0 0 1px var(--red-bd)   inset; }
.d1-dt-locked:hover { transform: translateY(-4px); background: var(--bg-mid); border-color: var(--border-lg); box-shadow: 0 10px 28px var(--black-a50); }

.d1-dt-green:hover  {
  color: var(--green-a100);
 }
.d1-dt-amber:hover  {
color: var(--amber-a100);
 }
.d1-dt-orange:hover {
color: var(--orange-a100);
 }
.d1-dt-red:hover    {
color: var(--red-a100);
 }
.d1-dt-locked:hover {
color: var(--t1);
 }

/* Lock shake on hover */
@keyframes d1-lock-shake {
  0%,100% { transform: rotate(0); }
  20% { transform: rotate(-11deg); }
  45% { transform: rotate(11deg); }
  65% { transform: rotate(-6deg); }
  82% { transform: rotate(6deg); }
}
.d1-dt-locked:hover .d1-lock-icon { animation: d1-lock-shake .45s ease; color: var(--t4); }

/* ══ Locked Domain Modal ══
   Colors matched to register-org-verified.html:
   card bg → var(--bg-card)  |  border → --border-md
   icon/link accent → --lime family  |  button → --grad (lime→cyan) + var(--bg) text
   ══ */
.d1-locked-dialog  { max-width: 420px; }
.d1-locked-content {
  background: var(--bg);
  border: 1px solid var(--border-md);
  border-radius: var(--br-outer);
  box-shadow: 0 24px 60px var(--black-a50);
}
.d1-locked-body {
  padding: var(--sp-40) var(--sp-40) var(--sp-40);
  text-align: center;
  display: flex; flex-direction: column; align-items: center;
}
/* Lock icon ring — lime accent (matches register page's lime palette) */
.d1-lm-icon-wrap  { margin-bottom: var(--sp-24); }
.d1-lm-icon-ring  {
  width: 80px; height: 80px; border-radius: 50%;
  background: var(--lime-bg);
  border: 2px solid var(--lime-bd);
  display: flex; align-items: center; justify-content: center;
}
.d1-lm-lock-svg        { width: 34px; height: 34px; }
.d1-lm-lock-svg rect,
.d1-lm-lock-svg path   { stroke: var(--lime); }
/* Title — same as .center-card h2 */
.d1-lm-title {
  font-size:var(--fs-20); font-weight:var(--fw-extrabold); color: var(--t1);
  margin-bottom: var(--sp-10); /* line-height: 1.3; */
}
/* Description — same as .center-card p */
.d1-lm-desc {
  font-size:var(--fs-14); color: var(--t4); /* line-height: 1.65; */
  margin-bottom: var(--sp-20); max-width: 300px;
}
/* "View what's included" link — matches .auth-link a / .resend-link a (lime) */
.d1-lm-view-link {
  display: inline-block; font-size:var(--fs-14); font-weight:var(--fw-medium);
  color: var(--lime); text-decoration: underline;
  text-underline-offset: 3px; margin-bottom: var(--sp-28); cursor: pointer;
  transition: opacity var(--t-fast);
}
.d1-lm-view-link:hover { opacity: .75; color: var(--lime); }
/* Upgrade Plan — matches .btn-primary (--grad, dark text) */
.d1-lm-upgrade-btn {
  display: inline-block; background: var(--grad); color: var(--bg);
  font-size:var(--fs-16); font-weight:var(--fw-bold); padding: var(--sp-14) var(--sp-40);
  border-radius: var(--br-full); text-decoration: none;
  transition: opacity var(--t-default), transform var(--t-default);
}
.d1-lm-upgrade-btn:hover { opacity: .9; transform: translateY(-2px); color: var(--bg); }

/* ══ Domain Included Modal (multi-modal detail view) ══
   Same card treatment as modal 1 — var(--bg-card) / --border-md / r-16px
   ══ */
.d1-included-dialog  { max-width: 520px; }
.d1-included-content {
  background: var(--bg);
  border: 1px solid var(--border-md);
  border-radius: var(--br-outer);
  box-shadow: 0 28px 70px var(--black-a65);
  max-height: 88vh;
}
/* Close-only header */
.d1-included-header {
  display: flex; justify-content: flex-end;
  padding: var(--sp-16) var(--sp-20) 0; flex-shrink: 0;
  align-self: end;
}
.d1-included-close {
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--border); border: none;
  color: var(--t4); cursor: pointer; font-size:var(--fs-14);
  display: flex; align-items: center; justify-content: center;
  transition: background var(--t-fast), color var(--t-fast);
}
.d1-included-close:hover { background: var(--border-lg); color: var(--t1); }
/* Scrollable body */
.d1-included-body  { padding: var(--sp-4) var(--sp-24) 0; overflow-y: auto; flex: 1 1 auto; }
/* Title */
.d1-inc-title  { font-size:var(--fs-18); font-weight:var(--fw-bold); color: var(--t1); margin: 0 0 var(--sp-8); }
/* Description */
.d1-inc-desc   { font-size:var(--fs-14); color: var(--t3); /* line-height: 1.6; */ margin: 0 0 var(--sp-20); }
/* "Key Controls Covered" bullet */
.d1-inc-kc-list  { list-style: disc; padding-left: var(--sp-24); margin: 0 0 var(--sp-10); }
.d1-inc-kc-label { font-size:var(--fs-14); font-weight:var(--fw-bold); color: var(--t1); }
/* Table — neutral tokens unchanged; row hover uses same bg-card as other cards */
.d1-inc-table-wrap {
  width: 100%; border-radius: var(--br-outer); overflow: hidden;
  border: 1px solid var(--border-md);
}
.d1-inc-table { width: 100%; border-collapse: collapse; }
.d1-inc-table thead tr  { background: var(--bg-mid); }
.d1-inc-table thead th  {
  padding: var(--sp-12) var(--sp-16); font-size:var(--fs-14); font-weight:var(--fw-bold); color: var(--t2);
  text-align: left;
}
.d1-inc-table thead th:last-child { text-align: right; }
.d1-inc-table tbody tr  { border-top: 1px solid var(--border); transition: background var(--t-fast); }
.d1-inc-table tbody tr:hover { background: var(--bg-card); }
.d1-inc-table tbody td  { padding: var(--sp-10) var(--sp-16); font-size:var(--fs-14); color: var(--t3); text-align: left; }
.d1-inc-table tbody td:last-child { text-align: right; color: var(--t4); }
/* Footer — matches .btn-primary (--grad, dark text) */
.d1-included-footer {
  padding: var(--sp-16) var(--sp-24) var(--sp-24); text-align: center;
  border-top: 1px solid var(--border); flex-shrink: 0;
}
.d1-inc-upgrade-btn {
  display: inline-block; background: var(--grad); color: var(--bg);
  font-size:var(--fs-16); font-weight:var(--fw-bold); padding: var(--sp-14) var(--sp-40);
  border-radius: var(--br-full); text-decoration: none;
  transition: opacity var(--t-default), transform var(--t-default);
}
.d1-inc-upgrade-btn:hover { opacity: .9; transform: translateY(-2px); color: var(--bg); }

/* ── Bottom two-column layout ── */
.d1-bottom-grid  { display: grid; grid-template-columns: 1fr 300px; gap: var(--sp-16); }
.d1-right-col    { display: flex; flex-direction: column; gap: 0; }

/* Improvement cards */
.d1-impr-card    { border: 1px solid var(--bg-mid); border-radius: var(--br-outer); padding: var(--sp-14) var(--sp-16); margin-bottom: var(--sp-10); background: var(--bg-subtle); }
.d1-impr-card:last-child { margin-bottom: 0; }
.d1-impr-top     { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--sp-8); gap: var(--sp-10); }
.d1-impr-left    { display: flex; align-items: center; gap: var(--sp-8); flex-wrap: wrap; }
.d1-impr-dot        { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.d1-impr-dot-amber  { background: var(--amber); }
.d1-impr-dot-orange { background: var(--orange); }
.d1-impr-dot-red    { background: var(--red); }
.d1-impr-name    { font-size:var(--fs-14); font-weight:var(--fw-bold); color: var(--t1); }
.d1-impr-score   { font-size:var(--fs-12); color: var(--t4); }
.d1-review-link  { display: flex; align-items: center; gap: var(--sp-4); font-size:var(--fs-12); font-weight:var(--fw-semibold); color: var(--t4); text-decoration: none; white-space: nowrap; flex-shrink: 0; transition: color var(--t-fast); }
.d1-review-link:hover { color: var(--t1); }
.d1-impr-bullets { list-style: disc; padding-left: var(--sp-20); margin: 0; font-size:var(--fs-12); color: var(--t3); /* line-height: 1.8; */ }

/* Quick Actions */
.d1-qa-body      { display: flex; flex-direction: column; gap: var(--sp-8); }
.d1-qa-btn       { display: flex; align-items: center; gap: var(--sp-10); padding: var(--sp-12) var(--sp-14); border-radius: var(--br-inner); text-decoration: none; font-size:var(--fs-14); font-weight:var(--fw-medium); color: var(--t2); background: var(--bg-subtle); border: 1px solid var(--bg-mid); transition: all var(--t-fast); }
.d1-qa-btn:hover { background: var(--lime-a10); border-color: var(--lime-a15); color: var(--lime); }
.d1-qa-btn:hover .d1-qa-icon { background: var(--lime-a15); color: var(--lime); }
.d1-qa-primary   { background: var(--grad); border-color: transparent; color: var(--bg); font-weight:var(--fw-bold); }
.d1-qa-primary:hover { box-shadow: 0 4px 18px var(--lime-a15); filter: brightness(1.06); }
.d1-qa-icon      { width: 28px; height: 28px; border-radius: var(--br-inner); display: flex; align-items: center; justify-content: center; font-size:var(--fs-14); background: var(--bg-mid); color: var(--t3); flex-shrink: 0; transition: background var(--t-fast), color var(--t-fast); }
.d1-qa-icon-filled { background: var(--black-a15); color: var(--bg); }

/* Recent Activity */
.d1-activity-row { display: flex; align-items: center; gap: var(--sp-10); padding: var(--sp-10) 0; border-bottom: 1px solid var(--bg-mid); }
.d1-activity-row:last-child { border-bottom: none; }
.d1-act-icon     { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size:var(--fs-14); flex-shrink: 0; }
.d1-act-cyan     { background: var(--cyan-bg);  color: var(--cyan); }
.d1-act-lime     { background: var(--lime-bg);  color: var(--lime); }
.d1-act-amber    { background: var(--amber-bg); color: var(--amber); }
.d1-act-body     { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: var(--sp-8); }
.d1-act-text     { font-size:var(--fs-14); color: var(--t2); }
.d1-act-time     { font-size:var(--fs-12); color: var(--t5); white-space: nowrap; }

/* ApexCharts canvas override */
#d1ScoreChart .apexcharts-canvas { background: transparent !important; }

/* ── Responsive ── */
@media(max-width:1100px){
  .d1-strip-inner    { grid-template-columns: 1fr 1fr; }
  .d1-strip-col-info { border-right: none; border-top: 1px solid var(--border); }
  .d1-domain-grid    { grid-template-columns: repeat(3,1fr); }
  .d1-bottom-grid    { grid-template-columns: 1fr; }
}
@media(max-width:768px){
  .d1-logo-wrapper   { min-width: auto; }
  .d1-strip-inner    { grid-template-columns: 1fr; }
  .d1-domain-grid    { grid-template-columns: repeat(2,1fr); }
  .d1-main-header    { gap: var(--sp-8); padding: 0 var(--sp-12); }
  .d1-search-wrap    { width: 130px; }
  .d1-profile-name   { display: none; }
}

/* ================================================================
   PLAN SELECTION PAGE  — dark mode, pixel-perfect
   ================================================================ */

/* ── Page wrapper ── */
.ps-page {
  min-height: 100vh;
  background: var(--bg-alt);
  padding: var(--sp-60) var(--sp-40) var(--sp-64);
  font-family: 'Inter', sans-serif;
}

/* ── Header ── */
.ps-header  { text-align: center; margin-bottom: var(--sp-40); }
.ps-title   { font-size:var(--fs-24); font-weight:var(--fw-extrabold); color: var(--t1); margin-bottom: var(--sp-8); /* letter-spacing: -0.3px; */ }
.ps-subtitle{ font-size:var(--fs-14); color: var(--t4); }

/* ── 4-column card grid ── */
.ps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sp-16);
  max-width: 1060px;
  margin: 0 auto var(--sp-40);
  align-items: stretch;
}

/* ── Individual plan card ── */
.ps-card {
  background: var(--bg-card);
  border: 1px solid var(--border-md);
  border-radius: var(--br-outer);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  transition: box-shadow var(--t-default), transform var(--t-default);
}
.ps-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 36px var(--black-a25);
}

/* Featured card (Enhanced) */
.ps-card-featured {
  border-color: var(--purple-bd);
  background: var(--purple-a10);
  box-shadow: 0 4px 24px var(--purple-bd);
}
.ps-card-featured:hover {
  box-shadow: 0 14px 40px var(--purple-bd);
}

/* "Most Popular" diagonal ribbon */
.ps-ribbon {
  position: absolute;
  top: var(--pos-22);
  right: calc(var(--pos-30) * -1);
  background: var(--amber);
  color: var(--bg);
  font-size:var(--fs-10);
  font-weight:var(--fw-extrabold);
  /* letter-spacing: 0.6px; */
  text-transform: uppercase;
  padding: var(--sp-4) var(--sp-40);
  transform: rotate(45deg);
  white-space: nowrap;
  z-index: 2;
  /* line-height: 1; */
}

/* Card body (grows to push pricing to bottom) */
.ps-card-body {
  padding: var(--sp-24) var(--sp-24) var(--sp-16);
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* ── Icon circle ── */
.ps-icon-wrap {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size:var(--fs-20);
  margin-bottom: var(--sp-16);
  flex-shrink: 0;
}
.ps-icon-cyan   { background: var(--cyan-a10);   color: var(--cyan);   border: 1px solid var(--cyan-bd); }
.ps-icon-purple { background: var(--purple-bd);  color: var(--purple); border: 1px solid var(--purple-bd); }
.ps-icon-lime   { background: var(--lime-a15);  color: var(--lime);   border: 1px solid var(--lime-a15); }
.ps-icon-amber  { background: var(--amber-a10);  color: var(--amber);  border: 1px solid var(--amber-bd); }

/* ── Plan name & description ── */
.ps-name {
  font-size:var(--fs-20);
  font-weight:var(--fw-extrabold);
  color: var(--t1);
  margin-bottom: var(--sp-8);
  /* letter-spacing: -0.2px; */
}
.ps-desc {
  font-size:var(--fs-12);
  color: var(--t4);
  /* line-height: 1.6; */
  margin-bottom: var(--sp-20);
}

/* ── Feature list ── */
.ps-features {
  list-style: none;
  padding: 0;
  margin: 0;
  flex: 1;
}
.ps-features li {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-10);
  font-size:var(--fs-12);
  color: var(--t2);
  margin-bottom: var(--sp-10);
  /* line-height: 1.45; */
}
.ps-features li:last-child { margin-bottom: 0; }

/* Feature check circles */
.ps-check {
  width: 17px;
  height: 17px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size:var(--fs-10);
  flex-shrink: 0;
  margin-top: var(--sp-2);
}
.ps-check-cyan   { background: var(--cyan-bd);  color: var(--cyan); }
.ps-check-purple { background: var(--purple-bd);  color: var(--purple); }
.ps-check-lime   { background: var(--lime-a15); color: var(--lime); }
.ps-check-amber  { background: var(--amber-bd); color: var(--amber); }

/* ── Pricing section (pinned to bottom) ── */
.ps-pricing {
  padding: 0 var(--sp-24) var(--sp-20);
  border-top: 1px solid var(--border);
  margin-top: var(--sp-4);
}

.ps-price-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--sp-14) 0;
}

.ps-price-left {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.ps-amount {
  font-size:var(--fs-26);
  font-weight:var(--fw-black);
  color: var(--t1);
  /* line-height: 1; */
  /* letter-spacing: -0.5px; */
}
.ps-amount-featured { color: var(--purple); }
.ps-period {
  font-size:var(--fs-12);
  color: var(--t5);
  font-weight:var(--fw-medium);
}

.ps-divider {
  height: 1px;
  background: var(--border);
}

/* ── Plan buttons ── */
.ps-btn {
  border-radius: var(--br-full);
  padding: var(--sp-8) var(--sp-16);
  font-size:var(--fs-12);
  font-weight:var(--fw-bold);
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  white-space: nowrap;
  transition: all var(--t-default);
  flex-shrink: 0;
}
.ps-btn-ghost {
  background: transparent;
  border: 1.5px solid var(--border-lg);
  color: var(--t2);
}
.ps-btn-ghost:hover {
  border-color: var(--t4);
  color: var(--t1);
  background: var(--bg-mid);
}
.ps-btn-primary {
  background: var(--grad);
  border: none;
  color: var(--bg);
}
.ps-btn-primary:hover { opacity: .9; }

/* ── Comparison table section ── */
.ps-comp-section {
  max-width: 1060px;
  margin: 0 auto;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--br-outer);
  overflow: hidden;
}
.ps-comp-title {
  font-size:var(--fs-18);
  font-weight:var(--fw-bold);
  color: var(--t1);
  padding: var(--sp-24) var(--sp-28) var(--sp-16);
  border-bottom: 1px solid var(--border);
  margin: 0;
  /* letter-spacing: -0.2px; */
}
.ps-table-wrap { overflow-x: auto; }

/* ── Comparison table ── */
.ps-comp-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 620px;
}
.ps-comp-table th {
  padding: var(--sp-12) var(--sp-16);
  font-size:var(--fs-12);
  font-weight:var(--fw-bold);
  color: var(--t4);
  text-transform: uppercase;
  /* letter-spacing: .7px; */
  text-align: center;
  border-bottom: 2px solid var(--border);
  background: var(--bg-subtle);
  white-space: nowrap;
}
/* Specificity: th.ps-th-feature (0,1,1) beats .ps-comp-table th (0,1,1) via cascade order */
th.ps-th-feature {
  text-align: left;
  width: 220px;
  color: var(--t3);
  font-size:var(--fs-12);
  /* letter-spacing: 0; */
  font-weight:var(--fw-extrabold);
}
.ps-comp-table td {
  padding: var(--sp-12) var(--sp-16);
  font-size:var(--fs-12);
  color: var(--t3);
  border-bottom: 1px solid var(--bg-mid);
  text-align: center;
  vertical-align: middle;
}
.ps-comp-table td:first-child {
  text-align: left;
  color: var(--t2);
  font-weight:var(--fw-medium);
  font-size:var(--fs-14);
}
.ps-comp-table tbody tr:last-child td { border-bottom: none; }
.ps-comp-table tbody tr:hover td { background: var(--bg-subtle); }

/* Tick and cross marks */
.ps-tick {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--green-a05);
  color: var(--green);
  font-size:var(--fs-10);
}
.ps-cross {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--red-a10);
  color: var(--red);
  font-size:var(--fs-10);
}
.ps-tick-note {
  font-size:var(--fs-12);
  color: var(--green);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-4);
}
.ps-tick-note i { font-size:var(--fs-10); }

/* ── Responsive ── */
@media(max-width:900px) {
  .ps-page  { padding: var(--sp-32) var(--sp-16) var(--sp-40); }
  .ps-grid  { grid-template-columns: repeat(2,1fr); }
}
@media(max-width:540px) {
  .ps-grid  { grid-template-columns: 1fr; }
}

/* ================================================================
   PLAN ACTIVATION MODAL  (SweetAlert2 popup — dark theme)
   ================================================================ */

/* Override SweetAlert2 popup container */
.pa-popup {
  background: var(--dark-navy) !important;
  border: 1px solid var(--border-md) !important;
  border-radius: var(--br-full) !important;
  padding: 0 !important;
  box-shadow: 0 24px 80px var(--black-a65) !important;
  font-family: 'Inter', sans-serif !important;
  overflow: visible !important;
}

/* Modal inner wrapper */
.pa-modal {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--sp-40) var(--sp-40) var(--sp-40);
  text-align: center;
}

/* Green check icon with outer glow ring */
.pa-icon-ring {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: var(--green-a05);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--sp-28);
}
.pa-icon-circle {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--green);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 24px var(--green-bd);
}
.pa-icon-check {
  font-size:var(--fs-32);
  color: var(--t1);
}

/* Title */
.pa-title {
  font-size:var(--fs-22);
  font-weight:var(--fw-extrabold);
  color: var(--t1);
  margin-bottom: var(--sp-12);
  /* letter-spacing: -0.3px; */
  /* line-height: 1.2; */
}

/* Description */
.pa-desc {
  font-size:var(--fs-14);
  color: var(--t4);
  /* line-height: 1.65; */
  margin-bottom: var(--sp-8);
  max-width: 360px;
}
.pa-desc:last-of-type { margin-bottom: var(--sp-28); }

/* Go to Dashboard button */
.pa-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--grad);
  border: none;
  border-radius: var(--br-full);
  padding: var(--sp-14) var(--sp-40);
  font-size:var(--fs-16);
  font-weight:var(--fw-bold);
  color: var(--bg);
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  transition: opacity var(--t-default), transform var(--t-default);
  min-width: 200px;
}
.pa-btn:hover { opacity: .9; transform: translateY(-1px); }

.page-header .logo-wrapper .close-btn {
    flex-shrink: 0;
}

/* ================================================================
   GLOBAL LAYOUT OVERRIDES — Dark App (compact-wrapper)
   File Cover-28 pixel-perfect layout.

   No !important needed: body.dark-only prefix adds (0,1,1)
   over Admiro's base selectors, ensuring our rules always win
   via specificity alone. The sidebar-open compound selector
   adds one more class, beating our own default rule.
   ================================================================ */

/* 1. Sidebar: 185 px wide, dark bg */
body.dark-only .page-sidebar {
  width: 205px;
  margin-top: var(--sp-64);
  background: var(--bg-alt);
  box-shadow: 1px 0 0 var(--bg-mid);
  transition: var(--t-slow) all ease;
}

/* 2. Logo-wrapper — (0,3,1) > Admiro (0,2,0) */
body.dark-only .page-header .logo-wrapper {
  width: 205px;
  min-width: 205px;
  padding: 0 var(--sp-14) 0 var(--sp-20);
  background: var(--black-a25);
  border-right: 1px solid var(--bg-mid);
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* 3. Page-body-wrapper left margin — (0,3,1) > Admiro (0,2,0) */
@media (min-width: 1200px) {
  body.dark-only .page-wrapper .page-body-wrapper {
    margin-left: var(--sp-185);
    transition: var(--t-slow) all ease;
  }
}

/* 4. Header heights */
body.dark-only .page-header {
  height: 64px;
  display: flex;
  align-items: center;
}
body.dark-only .page-main-header {
  height: 64px;
  display: flex;
  align-items: center;
}

/* 5. Sidebar menu: no dividers, tight padding */
body.dark-only .sidebar-menu {
  padding: var(--sp-8) var(--sp-10);
  height: calc(100vh - 64px);
  flex-direction: column;
}
body.dark-only .sidebar-menu .sidebar-list {
  border-bottom: none;
  width: 100%;
}

/* 6. Section titles */
body.dark-only .sidebar-menu .sidebar-main-title {
  padding: var(--sp-4) 0;
  border-bottom: none;
}
body.dark-only .sidebar-menu .sidebar-main-title h5,
body.dark-only .sidebar-menu .sidebar-main-title .sidebar-title {
  font-size:var(--fs-10);
  font-weight:var(--fw-bold);
  color: var(--white-a35);
  text-transform: uppercase;
  /* letter-spacing: 1.1px; */
  padding: var(--sp-10) var(--sp-8) var(--sp-4);
  margin: 0;
}

/* 7. Sidebar link base — (0,4,1) > Admiro .sm .sl .sl-link (0,3,0) */
body.dark-only .sidebar-menu .sidebar-list .sidebar-link {
  padding: var(--sp-10) var(--sp-10);
  border-radius: var(--br-inner);
  gap: var(--sp-10);
  color: var(--t4);
  background: transparent;
  transition: background var(--t-fast), color var(--t-fast);
}
body.dark-only .sidebar-menu .sidebar-list .sidebar-link h6,
body.dark-only .sidebar-menu .sidebar-list .sidebar-link .h6 {
  font-size:var(--fs-14);
  font-weight:var(--fw-medium);
  color: var(--t1);
  transition: color var(--t-fast);
}
body.dark-only .sidebar-menu .sidebar-list .sidebar-link .sidebar-icon {
  font-size:var(--fs-14);
  width: 16px;
  text-align: center;
  flex-shrink: 0;
  color: var(--t2);
  transition: color var(--t-fast);
}

/* 8. Active — (0,5,1) > Admiro .sm .sl.active .sl-link (0,4,0) */
body.dark-only .sidebar-menu .sidebar-list.active .sidebar-link,
body.dark-only .sidebar-menu .sidebar-list .sidebar-link.active {
  background: var(--lime-a10);
  color: var(--lime);
  border-left: 3px solid var(--lime);
  padding-left: var(--sp-8);
}
body.dark-only .sidebar-menu .sidebar-list.active .sidebar-link h6,
body.dark-only .sidebar-menu .sidebar-list.active .sidebar-link .h6,
body.dark-only .sidebar-menu .sidebar-list .sidebar-link.active h6 {
  color: var(--lime);
  font-weight:var(--fw-semibold);
}
body.dark-only .sidebar-menu .sidebar-list.active .sidebar-link .sidebar-icon,
body.dark-only .sidebar-menu .sidebar-list .sidebar-link.active .sidebar-icon {
  color: var(--lime);
}

/* 9. Hover — (0,6,1) > Admiro .sm .sl:hover .sl-link (0,4,0) */
body.dark-only .sidebar-menu .sidebar-list:hover .sidebar-link:not(.active) {
  background: var(--lime-a10);
  color: var(--lime);
}
body.dark-only .sidebar-menu .sidebar-list:hover .sidebar-link:not(.active) h6,
body.dark-only .sidebar-menu .sidebar-list:hover .sidebar-link:not(.active) .h6 {
  color: var(--lime);
}
body.dark-only .sidebar-menu .sidebar-list:hover .sidebar-link:not(.active) .sidebar-icon,
body.dark-only .sidebar-menu .sidebar-list:hover .sidebar-link:not(.active) i {
  color: var(--lime);
}

/* 10. Page body padding — (0,4,1) > Admiro .pw .pbw .page-body (0,3,0) */
body.dark-only .page-wrapper .page-body-wrapper .page-body {
  padding: 0 var(--sp-20) var(--sp-20);
}

/* 11. Page title */
body.dark-only .page-title {
  padding: var(--sp-20) 0 var(--sp-14);
}

/* 12. Card spacing */
body.dark-only .page-body .card {
  margin-bottom: var(--sp-16);
}

/* 13. Card header/body inner padding — (0,3,1) > Bootstrap (0,1,0) */
body.dark-only .page-body .card .card-header {
  padding: var(--sp-20) var(--sp-20) var(--sp-14);
}
body.dark-only .page-body .card .card-body {
  padding: var(--sp-14) var(--sp-20) var(--sp-20);
}
body.dark-only .page-body .card .card-header.no-border {
  border-bottom: none;
}

/* 14. Toggle button — (0,4,1) > Admiro .ph .lw .close-btn (0,3,0) */
body.dark-only .page-header .logo-wrapper .close-btn {
  background: transparent;
  color: var(--t6);
  border: none;
  font-size:var(--fs-16);
  width: auto;
  height: auto;
  padding: var(--sp-8);
  border-radius: var(--br-inner);
  transition: color var(--t-fast), background var(--t-fast);
}
body.dark-only .page-header .logo-wrapper .close-btn:hover {
  background: var(--border);
  color: var(--lime);
}

/* 15. Footer */
body.dark-only .footer {
  padding: var(--sp-12) var(--sp-20);
  background: var(--bg-alt);
  border-top: 1px solid var(--bg-mid);
}

/* 16. Sidebar-open state (sidebar slides off-screen)
   Selector (0,4,1) beats our default rule (0,2,1) and
   Admiro's .pw.sidebar-open .page-sidebar (0,3,0)            */
body.dark-only .page-wrapper.sidebar-open .page-sidebar {
  left: calc(var(--pos-215) * -1);
}

/* body.dark-only .pw.sidebar-open .pbw = (0,4,1)
   beats our default (0,3,1) because .pw.sidebar-open
   contributes an extra class in the compound selector.       */
@media (min-width: 1200px) {
  body.dark-only .page-wrapper.sidebar-open .page-body-wrapper {
    margin-left: 0;
    transition: var(--t-slow) all ease;
  }
}

/* 17. Mobile: sidebar is auto-hidden, full-width body */
@media (max-width: 1199px) {
  body.dark-only .page-wrapper .page-body-wrapper {
    margin-left: 0;
  }
}

.nav-btn-primary:hover {
  color: initial;
}

.org-filter-outer .choices__list--dropdown .choices__item--selectable, .org-filter-outer .choices__list[aria-expanded] .choices__item--selectable {
    padding-right: 0;
}
.rev-split-bar.cst,
.lic-util-bar.cst {
  height: 18px;
}

/* ═══════════════════════════════════════════════════════
   ORGANISATIONS PAGE  (DataTables integration)
   ═══════════════════════════════════════════════════════ */

/* Filter select with caret arrow */
.filter-select-caret {
  /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' width='11' height='11'%3E%3Cpath fill='rgba(255%2C255%2C255%2C0.4)' d='M8 11L2 5h12z'/%3E%3C/svg%3E"); */
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='11' height='11' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 11px center;
  padding-right: var(--sp-32);
}

/* Contact person cell */
.org-cp-name  { font-size:var(--fs-14); font-weight:var(--fw-medium); color: var(--t2); }
.org-cp-email { font-size:var(--fs-12); color: var(--t5); margin-top: var(--sp-2); }

/* Scoped search-box width for toolbar */
.table-toolbar .org-search-box { max-width: 280px; }

/* DataTables: reset wrapper */
.dataTables_wrapper { position: relative; clear: both; }
.dataTables_wrapper table.dataTable { margin: 0 !important; }

/* DataTables: foot row (info + pagination side-by-side) */
.org-dt-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--sp-14) 0 0;
  flex-wrap: wrap;
  gap: var(--sp-8);
}

/* DataTables: length + filter controls — unstyled by default since
   dataTables.bootstrap4.min.js (which normally wraps these in themed
   Bootstrap markup) isn't loaded, only the core + Responsive extension. */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
  display: flex;
  align-items: center;
  gap: var(--sp-8);
  margin-bottom: var(--sp-14);
  font-size:var(--fs-12);
  color: var(--t4);
}
.dataTables_wrapper .dataTables_filter label {
  display: flex;
  align-items: center;
  gap: var(--sp-8);
  width: 100%;
}
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
  background: var(--bg-card);
  border: 1px solid var(--border-md);
  border-radius: var(--br-inner);
  color: var(--t2);
  font-size:var(--fs-14);
  font-family: 'Inter', sans-serif;
  padding: var(--sp-8) var(--sp-10);
  outline: none;
}
.dataTables_wrapper .dataTables_length select { cursor: pointer; }
.dataTables_wrapper .dataTables_length select option { background:var(--dark-green); color: var(--t1); }
.dataTables_wrapper .dataTables_filter input {
  flex: 1;
  min-width: 0;
}
.dataTables_wrapper .dataTables_filter input:focus {
  border-color: var(--lime-a60);
  background: var(--border);
}

/* orgTable / assessTable already have their own styled search-box + filter-select
   toolbar (table-toolbar); hide DataTables' auto-generated length/filter controls
   there to avoid a duplicate search box. */
#orgTable_wrapper > .dataTables_length,
#orgTable_wrapper > .dataTables_filter,
#assessTable_wrapper > .dataTables_length,
#assessTable_wrapper > .dataTables_filter,
#qbTable_wrapper > .dataTables_length,
#qbTable_wrapper > .dataTables_filter {
  display: none;
}

/* DataTables: info text */
.dataTables_wrapper .dataTables_info {
  font-size:var(--fs-12);
  color: var(--t5);
  padding: 0;
  white-space: nowrap;
}
.dataTables_wrapper table.dataTable tbody tr {
  background-color: var(--bs-body-bg);
}

/* DataTables: pagination */
.dataTables_wrapper .dataTables_paginate {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  flex-wrap: wrap;
  border: 0;
}
div.dataTables_wrapper .dataTables_paginate .paginate_button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  padding: 0 var(--sp-8);
  border-radius: var(--br-inner);
  background: var(--bg-card);
  border: 1px solid var(--border-md);
  color: var(--t4) !important;
  font-size:var(--fs-12);
  font-weight:var(--fw-semibold);
  cursor: pointer;
  box-sizing: border-box;
  text-decoration: none !important;
  transition: background var(--t-fast);
  font-family: 'Inter', sans-serif;
  box-shadow: none !important;
  /* line-height: 1; */
}
div.dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.current):not(.disabled) {
  background: var(--border) !important;
  color: var(--t2) !important;
  border-color: var(--border-md) !important;
}
div.dataTables_wrapper .dataTables_paginate .paginate_button.current,
div.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: var(--lime-a10) !important;
  border-color: var(--lime-a15) !important;
  color: var(--lime) !important;
}
div.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
div.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
  opacity: 0.4;
  cursor: default;
  color: var(--t5) !important;
  background: var(--bg-card) !important;
  border-color: var(--border-md) !important;
}
.dataTables_wrapper .dataTables_paginate span { display: flex; gap: var(--sp-4); }

/* DataTables: sorting arrows on admin-table / tracker-table */
.admin-table thead th.sorting,
.admin-table thead th.sorting_asc,
.admin-table thead th.sorting_desc,
.tracker-table thead th.sorting,
.tracker-table thead th.sorting_asc,
.tracker-table thead th.sorting_desc { cursor: pointer; position: relative; padding-right: var(--sp-24); }
.admin-table thead th.sorting::after,
.tracker-table thead th.sorting::after      { content: '⇅'; position:absolute; right:var(--pos-8); top:50%; transform:translateY(-50%); opacity:0.35; font-size:var(--fs-10); }
.admin-table thead th.sorting_asc::after,
.tracker-table thead th.sorting_asc::after  { content: '↑'; position:absolute; right:var(--pos-8); top:50%; transform:translateY(-50%); opacity:0.75; font-size:var(--fs-10); }
.admin-table thead th.sorting_desc::after,
.tracker-table thead th.sorting_desc::after { content: '↓'; position:absolute; right:var(--pos-8); top:50%; transform:translateY(-50%); opacity:0.75; font-size:var(--fs-10); }

/* badge variant for Manually Verified (same colour family as badge-verified) */
.badge-manual-verified { background:var(--green-a05);border:1px solid var(--green-bd);color:var(--green-400);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold); }

/* org-dt-wrap: only scroll when table is wider than container */
.org-dt-wrap { overflow-x: auto; }
.org-dt-wrap::-webkit-scrollbar        { height: 4px; }
.org-dt-wrap::-webkit-scrollbar-track  { background: transparent; }
.org-dt-wrap::-webkit-scrollbar-thumb  { background: var(--lime-a15); border-radius: var(--br-inner); }
.org-dt-wrap::-webkit-scrollbar-thumb:hover { background: var(--lime-a60); }
.org-search-box input {
  opacity: 1;
}

/* ── ORG-DETAIL PAGE ── */

/* Back link */
.od-back-link { display:inline-flex;align-items:center;gap:var(--sp-8);color:var(--t4);font-size:var(--fs-14);text-decoration:none;margin-bottom:var(--sp-20);transition:color var(--t-fast); }
.od-back-link:hover { color:var(--lime); }

/* Org Header */
.od-header { display:flex;align-items:center;gap:var(--sp-24);padding:var(--sp-24);background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);margin-bottom:var(--sp-24); }
.od-logo { width:72px;height:72px;border-radius:var(--br-outer);background:var(--purple-bg);border:1px solid var(--purple-bd);display:flex;align-items:center;justify-content:center;font-size:var(--fs-26);font-weight:var(--fw-extrabold);color:var(--purple);flex-shrink:0;overflow:hidden;/* letter-spacing:-1px; */ }
.od-logo img, .od-logo-img { width:100%;height:100%;object-fit:contain;background:var(--bg-mid);border-radius:inherit; }
.od-header-body { flex:1;min-width:0; }
.od-org-name { font-size:var(--fs-22);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-8);/* line-height:1.2; */ }
.od-meta { display:flex;align-items:center;gap:var(--sp-16);flex-wrap:wrap; }
.od-meta-item { display:flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t3); }
.od-meta-icon { color:var(--t4);font-size:var(--fs-12); }
.od-meta-sep { width:1px;height:14px;background:var(--border-md); }
.od-actions { display:flex;gap:var(--sp-10);align-items:center;flex-shrink:0; }
.btn-view-dash { display:inline-flex;align-items:center;gap:var(--sp-8);padding:var(--sp-8) var(--sp-20);border-radius:var(--br-full);border:1px solid var(--border-lg);background:transparent;color:var(--t2);font-size:var(--fs-14);font-weight:var(--fw-medium);cursor:pointer;transition:all var(--t-fast); }
.btn-view-dash:hover { border-color:var(--lime);color:var(--lime); }
.btn-deactivate-org { display:inline-flex;align-items:center;gap:var(--sp-8);padding:var(--sp-8) var(--sp-20);border-radius:var(--br-full);border:1px solid var(--purple-bd);background:transparent;color:var(--purple);font-size:var(--fs-14);font-weight:var(--fw-medium);cursor:pointer;transition:all var(--t-fast); }
.btn-deactivate-org:hover { background:var(--purple-bg); }
.btn-activate-org { display:inline-flex;align-items:center;gap:var(--sp-8);padding:var(--sp-8) var(--sp-20);border-radius:var(--br-full);border:1px solid var(--green-bd);background:transparent;color:var(--green);font-size:var(--fs-14);font-weight:var(--fw-medium);cursor:pointer;transition:all var(--t-fast); }
.btn-activate-org:hover { background:var(--green-bg); }
.btn-reject-org { display:inline-flex;align-items:center;gap:var(--sp-8);padding:var(--sp-8) var(--sp-20);border-radius:var(--br-full);border:1px solid var(--red-bd);background:transparent;color:var(--red);font-size:var(--fs-14);font-weight:var(--fw-medium);cursor:pointer;transition:all var(--t-fast); }
.btn-reject-org:hover { background:var(--red-bg); }

/* Tab Nav — Pill Segmented Control */
.od-tab-nav { border-bottom:none;margin-bottom:var(--sp-24);background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-full);padding:var(--sp-4);display:flex; }
.od-tab-nav .nav-item { flex:1; }
.od-tab-nav .nav-link { display:block;width:100%;text-align:center;color:var(--t4);font-size:var(--fs-14);font-weight:var(--fw-medium);padding:var(--sp-10) var(--sp-16);border:none !important;background:transparent !important;cursor:pointer;transition:all var(--t-default);border-radius:var(--br-full);position:relative; }
.od-tab-nav .nav-link:hover { color:var(--t2); }
.od-tab-nav .nav-link.active { color:var(--bg);font-weight:var(--fw-semibold);background:var(--grad) !important; }
.od-tab-nav .nav-link.active::after { display:none; }

/* Info Cards Grid */
.od-info-grid { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-16);margin-bottom:var(--sp-16); }
.od-card { background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-20); }
.od-card-full { grid-column:1/-1; }
.od-card-header { display:flex;align-items:center;gap:var(--sp-10);margin-bottom:var(--sp-16);padding-bottom:var(--sp-12);border-bottom:1px solid var(--border); }
.od-card-icon { width:32px;height:32px;border-radius:var(--br-inner);background:var(--amber-bg);border:1px solid var(--amber);display:flex;align-items:center;justify-content:center;font-size:var(--fs-12);color:var(--amber);flex-shrink:0; }
.od-card-title { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1); }
.od-fields { display:flex;flex-direction:column;gap:var(--sp-12); }
.od-field-block { display:flex;flex-direction:column;gap:var(--sp-4); }
.od-field-lbl { font-size:var(--fs-12);font-weight:var(--fw-semibold);/* letter-spacing:0.5px; */text-transform:uppercase;color:var(--t4); }
.od-field-val { font-size:var(--fs-14);color:var(--t2);/* line-height:1.5; */ }
.od-field-row { display:flex;align-items:center;gap:var(--sp-8);flex-wrap:wrap; }

/* Document Items */
.od-doc-item { display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-10) 0;border-bottom:1px solid var(--border); }
.od-doc-item:last-child { border-bottom:none; }
.od-doc-icon { width:30px;height:30px;border-radius:var(--br-inner);background:var(--bg-card);display:flex;align-items:center;justify-content:center;font-size:var(--fs-12);color:var(--t3);flex-shrink:0; }
.od-doc-body { flex:1; }
.od-doc-name { font-size:var(--fs-14);color:var(--t2);font-weight:var(--fw-medium); }
.od-doc-meta { font-size:var(--fs-12);color:var(--t4); }
.od-doc-view { background:none;border:none;color:var(--t4);font-size:var(--fs-14);cursor:pointer;padding:var(--sp-4);transition:color var(--t-fast); }
.od-doc-view:hover { color:var(--lime); }

/* Branch Items */
.od-branch-list {
    display: grid;
    /* flex-direction: column; */
    gap: var(--sp-10);
    grid-template-columns: 1fr 1fr;
}
.od-branch-item { display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-12) var(--sp-14);border-radius:var(--br-inner);background:var(--bg-subtle);border:1px solid var(--border); }
.od-branch-icon { width:28px;height:28px;border-radius:var(--br-inner);background:var(--purple-bg);border:1px solid var(--purple-bd);display:flex;align-items:center;justify-content:center;font-size:var(--fs-12);color:var(--purple);flex-shrink:0; }
.od-branch-body { flex:1; }
.od-branch-name { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1);margin-bottom:var(--sp-2); }
.od-branch-loc { font-size:var(--fs-12);color:var(--t4); }

/* Badge Role */
.badge-role { background:var(--purple-bg);border:1px solid var(--purple-bd);color:var(--purple);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-10);font-size:var(--fs-10);font-weight:var(--fw-bold);white-space:nowrap; }

/* Assessments Tab — Section Header */
.od-assess-header { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-12);margin-bottom:var(--sp-20); }
.od-assess-title { font-size:var(--fs-18);font-weight:var(--fw-bold);color:var(--t1); }
.btn-full-preview { display:inline-flex;align-items:center;gap:var(--sp-8);padding:var(--sp-10) var(--sp-20);border-radius:var(--br-full);border:1px solid var(--purple-bd);background:transparent;color:var(--purple);font-size:var(--fs-14);font-weight:var(--fw-medium);cursor:pointer;transition:all var(--t-fast);white-space:nowrap; }
.btn-full-preview:hover { background:var(--purple-bg); }
.od-assess-history-title { font-size:var(--fs-18);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-14); }

/* Domain Assessment Cards */
.od-domain-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-14);margin-bottom:var(--sp-32); }
.od-domain-card { background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-16) var(--sp-20);display:flex;flex-direction:column; }
.od-domain-card-top { display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-8);margin-bottom:var(--sp-8); }
.od-domain-card-name { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);/* line-height:1.4; */ }
.od-domain-score-inline { font-size:var(--fs-14);color:var(--t3);white-space:nowrap;flex-shrink:0;padding-top:var(--sp-2); }
.od-domain-score-inline strong { color:var(--lime);font-weight:var(--fw-extrabold);font-size:var(--fs-16); }
.od-domain-card-status { margin-bottom:var(--sp-12); }
.od-domain-fields { flex:1;display:flex;flex-direction:column;gap:var(--sp-8);margin-bottom:var(--sp-16); }
.od-domain-assign { font-size:var(--fs-14);color:var(--t3);/* line-height:1.5; */ }
.od-domain-assign strong { color:var(--t1);font-weight:var(--fw-semibold); }
.od-domain-actions { display:flex;gap:var(--sp-8);margin-top:auto; }
.btn-domain-preview,
.btn-domain-report { flex:1;display:inline-flex;align-items:center;justify-content:center;padding:var(--sp-8) var(--sp-10);border-radius:var(--br-inner);border:1px solid var(--border-lg);background:transparent;color:var(--t3);font-size:var(--fs-12);font-weight:var(--fw-medium);cursor:pointer;transition:all var(--t-fast); }
.btn-domain-preview:hover { border-color:var(--lime);color:var(--lime); }
.btn-domain-report:hover { border-color:var(--purple);color:var(--purple); }
.btn-domain-dim { opacity:0.38;pointer-events:none; }

/* Assessment History action icons */
.od-action-icon-btn { background:none;border:none;color:var(--amber);font-size:var(--fs-16);cursor:pointer;padding:var(--sp-4) var(--sp-4);/* line-height:1; */transition:opacity var(--t-fast); }
.od-action-icon-btn:hover { opacity:0.7; }

/* Users Tab - License & Notes */
.od-notes-section { background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-16);margin-top:var(--sp-20); }
.od-notes-title { font-size:var(--fs-12);font-weight:var(--fw-bold);text-transform:uppercase;/* letter-spacing:0.8px; */color:var(--t4);margin-bottom:var(--sp-8); }
.od-notes-text { font-size:var(--fs-14);color:var(--t3);/* line-height:1.7; */ }
.od-license-bar { display:flex;align-items:center;gap:var(--sp-16);padding:var(--sp-12) var(--sp-16);background:var(--bg-subtle);border:1px solid var(--border);border-radius:var(--br-outer);margin-bottom:var(--sp-20);flex-wrap:wrap; }
.od-license-item { display:flex;flex-direction:column;gap:var(--sp-2); }
.od-license-lbl { font-size:var(--fs-12);color:var(--t4);font-weight:var(--fw-semibold);text-transform:uppercase;/* letter-spacing:0.5px; */ }
.od-license-val { font-size:var(--fs-14);color:var(--t1);font-weight:var(--fw-bold); }
.od-license-sep { width:1px;height:30px;background:var(--border-md); }

/* Timeline */
.od-timeline { display:flex;flex-direction:column; }
.od-timeline-item { display:flex;gap:var(--sp-16);padding:var(--sp-14) 0;border-bottom:1px solid var(--border); }
.od-timeline-item:last-child { border-bottom:none;padding-bottom:0; }
.od-timeline-dot-col { display:flex;flex-direction:column;align-items:center;padding-top:var(--sp-4); }
.od-timeline-dot { width:10px;height:10px;border-radius:50%;background:var(--purple);flex-shrink:0; }
.od-timeline-body { flex:1;min-width:0; }
.od-timeline-title { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1);margin-bottom:var(--sp-4); }
.od-timeline-meta { display:flex;align-items:center;gap:var(--sp-8);flex-wrap:wrap;font-size:var(--fs-12);color:var(--t4); }
.od-timeline-sep { color:var(--border-lg);font-size:var(--fs-10); }
.od-timeline-date { font-size:var(--fs-12);color:var(--t4);white-space:nowrap;flex-shrink:0;padding-top:var(--sp-4); }

/* Users Tab — Section Header */
.od-users-header { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-16);margin-bottom:var(--sp-20);flex-wrap:wrap; }
.od-users-license { display:flex;align-items:center;gap:var(--sp-20); }
.od-license-stat { font-size:var(--fs-14);color:var(--t3); }
.od-license-stat strong { color:var(--t1);font-weight:var(--fw-bold); }

/* Pending status badge */
.badge-user-pending { background:var(--purple-a10);border:1px solid var(--purple-bd);color:var(--t4);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-12);font-size:var(--fs-12);font-weight:var(--fw-semibold); }

/* Users Tab — Role Notes */
.od-role-notes { margin-top:var(--sp-20); }
.od-role-notes-lbl { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t2);margin-bottom:var(--sp-8); }
.od-role-notes-list { list-style:disc;padding-left:var(--sp-20);display:flex;flex-direction:column;gap:var(--sp-4); }
.od-role-notes-list li { font-size:var(--fs-14);color:var(--t4);/* line-height:1.6; */ }
.od-role-notes-list li strong { color:var(--t2);font-weight:var(--fw-semibold); }

/* Bootstrap Modal Dark Override — Deactivate */
.od-deactivate-modal .modal-content { background:var(--bg);border:1px solid var(--border-md);border-radius:var(--br-outer);color:var(--t1); }
.od-deactivate-modal .modal-header { border-bottom:1px solid var(--border);padding:var(--sp-20) var(--sp-24) var(--sp-16); }
.od-deactivate-modal .modal-title { color:var(--t1);font-size:var(--fs-18);font-weight:var(--fw-bold); }
.od-deactivate-modal .btn-close { filter:invert(1) brightness(0.5);opacity:0.7; }
.od-deactivate-modal .btn-close:hover { opacity:1; }
.od-deactivate-modal .modal-body { padding:var(--sp-20) var(--sp-24); }
.od-deactivate-modal .modal-body p { font-size:var(--fs-14);color:var(--t3);/* line-height:1.7; */margin:0; }
.od-deactivate-modal .modal-footer { border-top:1px solid var(--border);padding:var(--sp-14) var(--sp-24);gap:var(--sp-10); }
.btn-deactivate-confirm { padding:var(--sp-10) var(--sp-24);border-radius:var(--br-full);border:none;background:var(--purple);color:var(--t1);font-size:var(--fs-14);font-weight:var(--fw-semibold);cursor:pointer;transition:background var(--t-fast); }
.btn-deactivate-confirm:hover { background:var(--purple); }
.btn-cancel-pill { padding:var(--sp-10) var(--sp-24);border-radius:var(--br-full);border:1px solid var(--border-lg);background:transparent;color:var(--t2);font-size:var(--fs-14);font-weight:var(--fw-medium);cursor:pointer;transition:border-color var(--t-fast); }
.btn-cancel-pill:hover { border-color:var(--t2); }

/* ═══════════════════════════════════════════════════════
   ASSESSMENTS (ADMIN) PAGE
   ═══════════════════════════════════════════════════════ */

/* Export button - outlined purple/indigo pill */
.btn-export-purple {
  background: transparent;
  border: 1.5px solid var(--purple);
  border-radius: var(--br-full);
  padding: var(--sp-8) var(--sp-20);
  font-size:var(--fs-14);
  font-weight:var(--fw-semibold);
  color: var(--purple);
  cursor: pointer;
  font-family: 'Inter', sans-serif;
  display: inline-flex;
  align-items: center;
  gap: var(--sp-8);
  transition: background var(--t-fast);
  white-space: nowrap;
}
.btn-export-purple:hover { background: var(--purple-bg); }

/* Action column icon buttons */
.tbl-icon-btn { background:none;border:none;font-size:var(--fs-16);cursor:pointer;padding:var(--sp-4) var(--sp-4);/* line-height:1; */transition:opacity var(--t-fast); }
.tbl-icon-btn:hover { opacity:0.7; }
.tbl-icon-green  { color:var(--green); }
.tbl-icon-cyan   { color:var(--cyan); }
.tbl-icon-purple { color:var(--purple); }
.tbl-icon-orange { color:var(--orange); }

/* ── Send Reminder Modal ── */
.sr-modal .modal-dialog { max-width:600px; }
.sr-row { display:flex;gap:var(--sp-16); }
.sr-row > div { flex:1;min-width:0; }
.vz-input-readonly { background:var(--bg-card);color:var(--t3);cursor:default; }
.vz-input-readonly:focus { outline:none;border-color:var(--border-md); }

.sr-date-wrap { position:relative; }
.sr-date-wrap input { padding-right:var(--sp-40);cursor:pointer; }
.sr-date-wrap .sr-date-icon { position:absolute;right:var(--pos-12);top:50%;transform:translateY(-50%);color:var(--t4);font-size:var(--fs-14);pointer-events:none; }

.sr-checklist { display:flex;flex-direction:column;gap:var(--sp-10);margin-top:var(--sp-8); }
.sr-check-item { display:flex;align-items:center;gap:var(--sp-10);font-size:var(--fs-14);color:var(--t2);cursor:pointer; }
.sr-check-item input[type="checkbox"] { width:16px;height:16px;accent-color:var(--purple);cursor:pointer;flex-shrink:0; }
.sr-note { font-size:var(--fs-12);color:var(--t4);margin:var(--sp-14) 0 0;/* line-height:1.6; */ }

/* ── Flatpickr — theme override ──
   Selectors are prefixed with .dark-only (always present on <body>) so they
   out-specificity flatpickr's own rules and style.css's ".dark-only" rules
   without needing !important. */
.dark-only .flatpickr-calendar {
  background: var(--bg);
  border: 1px solid var(--border-md);
  border-radius: var(--br-outer);
  box-shadow: 0 12px 32px var(--black-a50);
}
.dark-only .flatpickr-calendar.arrowTop:before,
.dark-only .flatpickr-calendar.arrowTop:after { border-bottom-color: var(--bg); }
.dark-only .flatpickr-calendar.arrowBottom:before,
.dark-only .flatpickr-calendar.arrowBottom:after { border-top-color: var(--bg); }
.dark-only .flatpickr-months .flatpickr-month { background: transparent; color: var(--t1); fill: var(--t1); border-radius: var(--br-outer) var(--br-outer) 0 0; }
.dark-only .flatpickr-current-month { color: var(--t1); }
.dark-only .flatpickr-current-month input.cur-year { color: var(--t1); }
.dark-only .flatpickr-current-month .flatpickr-monthDropdown-months { color: var(--t1); background: transparent; }
.dark-only .flatpickr-current-month .flatpickr-monthDropdown-months:hover { background: var(--bg-mid); }
.dark-only .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month { background: var(--bg); color: var(--t1); }
.dark-only .flatpickr-prev-month, .dark-only .flatpickr-next-month { fill: var(--t3); color: var(--t3); }
.dark-only .flatpickr-prev-month:hover, .dark-only .flatpickr-next-month:hover { fill: var(--purple); color: var(--purple); }
.dark-only .flatpickr-prev-month:hover svg, .dark-only .flatpickr-next-month:hover svg { fill: var(--purple); }
.dark-only .flatpickr-prev-month svg, .dark-only .flatpickr-next-month svg { fill: inherit; }
.dark-only .flatpickr-weekdays { background: transparent; }
.dark-only span.flatpickr-weekday { background: transparent; color: var(--t4); font-weight:var(--fw-semibold); }
.dark-only .flatpickr-day { color: var(--t2); }
.dark-only .flatpickr-day.prevMonthDay, .dark-only .flatpickr-day.nextMonthDay { color: var(--t5); }
.dark-only .flatpickr-day.flatpickr-disabled, .dark-only .flatpickr-day.flatpickr-disabled:hover { color: var(--t6); }
.dark-only .flatpickr-day:hover, .dark-only .flatpickr-day.prevMonthDay:hover, .dark-only .flatpickr-day.nextMonthDay:hover,
.dark-only .flatpickr-day:focus, .dark-only .flatpickr-day.prevMonthDay:focus, .dark-only .flatpickr-day.nextMonthDay:focus {
  background: var(--purple-a10);
  border-color: var(--purple-a10);
  color: var(--t1);
}
.dark-only .flatpickr-day.today { border-color: var(--purple); }
.dark-only .flatpickr-day.today:hover, .dark-only .flatpickr-day.today:focus { color: var(--t1); }
.dark-only .flatpickr-day.selected, .dark-only .flatpickr-day.startRange, .dark-only .flatpickr-day.endRange,
.dark-only .flatpickr-day.selected:hover, .dark-only .flatpickr-day.startRange:hover, .dark-only .flatpickr-day.endRange:hover,
.dark-only .flatpickr-day.selected.inRange, .dark-only .flatpickr-day.startRange.inRange, .dark-only .flatpickr-day.endRange.inRange {
  background: var(--purple);
  border-color: var(--purple);
  color: var(--t1);
  box-shadow: none;
}
.dark-only .flatpickr-day.inRange, .dark-only .flatpickr-day.prevMonthDay.inRange, .dark-only .flatpickr-day.nextMonthDay.inRange {
  background: var(--purple-a10);
  border-color: var(--purple-a10);
  box-shadow: -5px 0 0 var(--purple-a10), 5px 0 0 var(--purple-a10);
}
.dark-only .numInputWrapper span.arrowUp:after { border-bottom-color: var(--t3); }
.dark-only .numInputWrapper span.arrowDown:after { border-top-color: var(--t3); }
.dark-only .numInputWrapper:hover { background: transparent; }
.dark-only .numInputWrapper span:hover { background: var(--bg-mid); }
.dataTables_wrapper #assessDTable button {
  color: revert-rule;
}

/* ═══════════════════════════════════════════════════════
   VERIFICATION & REQUESTS PAGE
   ═══════════════════════════════════════════════════════ */

/* Tab nav — left-aligned, auto-width pill tabs */
.vr-tab-nav { border-bottom:none;margin-bottom:var(--sp-24);background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-full);padding:var(--sp-4);display:flex;gap:var(--sp-4); }
.vr-tab-nav .nav-link { display:inline-flex;align-items:center;gap:var(--sp-8);color:var(--t4);font-size:var(--fs-14);font-weight:var(--fw-medium);padding:var(--sp-10) var(--sp-24);border:none !important;background:transparent !important;cursor:pointer;transition:all var(--t-default);border-radius:var(--br-full); }
.vr-tab-nav .nav-link:hover { color:var(--t2); }
.vr-tab-nav .nav-link.active { color:var(--bg);background:var(--grad) !important; }
.vr-tab-count { background:var(--border-lg);border-radius:var(--br-full);padding:var(--sp-2) var(--sp-8);font-size:var(--fs-10);font-weight:var(--fw-bold); }
.vr-tab-nav .nav-link.active .vr-tab-count { background:var(--black-a15); }

/* Section title above tables/cards */
.vr-section-title { font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-16); }

/* Uploaded document chips */
.vr-doc-list { display:flex;flex-direction:column;gap:var(--sp-8); }
.vr-doc-chip { display:inline-flex;align-items:center;gap:var(--sp-8);background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-inner);padding:var(--sp-4) var(--sp-10);font-size:var(--fs-12);color:var(--t3);white-space:nowrap;width:fit-content; }
.vr-doc-chip i { color:var(--t4);font-size:var(--fs-12); }

/* Action icon — red variant (reject) */
.tbl-icon-red { color:var(--red); }

/* Role transfer cards */
.vr-rt-card { background:var(--bg-subtle);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-24) var(--sp-24);margin-bottom:var(--sp-16); }
.vr-rt-card:last-child { margin-bottom:0; }
.vr-rt-header { display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-12);margin-bottom:var(--sp-20);flex-wrap:wrap; }
.vr-rt-org { font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--t1); }
.vr-rt-submitted { font-size:var(--fs-12);color:var(--t4);display:flex;align-items:center;gap:var(--sp-8);white-space:nowrap; }
.vr-rt-grid { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-20);margin-bottom:var(--sp-20); }
.vr-rt-label { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t4);text-transform:uppercase;/* letter-spacing:.6px; */margin-bottom:var(--sp-8); }
.vr-rt-value { font-size:var(--fs-14);color:var(--t1);font-weight:var(--fw-medium); }
.vr-rt-reason { margin-bottom:var(--sp-20); }
.vr-rt-actions { display:flex;gap:var(--sp-10); }

/* Reject button — purple outline pill */
.btn-reject-pill { padding:var(--sp-10) var(--sp-24);border-radius:var(--br-full);border:1px solid var(--purple);background:transparent;color:var(--purple);font-size:var(--fs-14);font-weight:var(--fw-semibold);cursor:pointer;transition:background var(--t-fast); }
.btn-reject-pill:hover { background:var(--purple-bg); }

/* ═══════════════════════════════════════════════════════
   VERIFICATION DETAIL PAGE
   ═══════════════════════════════════════════════════════ */

/* Back link — pill with border */
.vd-back-link { display:inline-flex;align-items:center;gap:var(--sp-8);color:var(--t3);font-size:var(--fs-14);font-weight:var(--fw-medium);text-decoration:none;border:1px solid var(--border-lg);border-radius:var(--br-full);padding:var(--sp-8) var(--sp-20);margin-bottom:var(--sp-20);transition:all var(--t-fast); }
.vd-back-link:hover { color:var(--t1);border-color:var(--t3); }

/* Org Header */
.vd-header { margin-bottom:var(--sp-24); }
.vd-org-name { font-size:var(--fs-24);font-weight:var(--fw-extrabold);color:var(--t1);margin-bottom:var(--sp-10);/* line-height:1.2; */ }
.vd-meta { display:flex;align-items:center;gap:var(--sp-16);flex-wrap:wrap;padding-bottom:var(--sp-20);border-bottom:1px solid var(--border); }
.vd-meta-item { display:flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t4); }
.vd-meta-icon { font-size:var(--fs-14);color:var(--t4); }
.vd-meta-icon-purple { color:var(--purple); }
.vd-meta-lbl { color:var(--t4); }
.vd-meta-val { color:var(--t1);font-weight:var(--fw-bold); }
.vd-meta-sep { width:1px;height:14px;background:var(--border-md); }
.vd-meta-status { color:var(--t4); }

/* Card header icon — colour variants */
.od-card-icon-purple { background:var(--purple-bg);border-color:var(--purple-bd);color:var(--purple); }
.od-card-icon-cyan   { background:var(--cyan-bg);border-color:var(--cyan-bd);color:var(--cyan); }
.od-card-icon-green  { background:var(--green-bg);border-color:var(--green-bd);color:var(--green); }
.od-card-icon-orange { background:var(--orange-bg);border-color:var(--orange-bd);color:var(--orange); }

/* Field-level icon */
.od-field-icon { color:var(--t5);font-size:var(--fs-10);margin-right:var(--sp-8); }

/* Document type icon — red variant (PDF) */
.od-doc-icon-red { background:var(--red-bg);color:var(--red); }

/* Document view button — purple circle */
.vd-doc-view { width:32px;height:32px;border-radius:50%;background:var(--purple-bg);border:1px solid var(--purple-bd);color:var(--purple);display:flex;align-items:center;justify-content:center;font-size:var(--fs-14);cursor:pointer;transition:all var(--t-fast);flex-shrink:0; }
.vd-doc-view:hover { background:var(--purple);color:var(--t1); }

/* Rejection reason */
.vd-reject-card { margin-bottom:var(--sp-24); }
.vd-reject-title { font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-14); }
.vd-reject-textarea { min-height:110px; }

/* Approve / Reject actions */
.vd-actions { display:flex;gap:var(--sp-12);margin-bottom:var(--sp-24); }

/* ═══════════════════════════════════════════════════════
   ADVISORY REQUEST DETAIL PAGE
   ═══════════════════════════════════════════════════════ */

/* Status pill (meta row) */
.vd-status-pill { display:inline-flex;align-items:center;padding:var(--sp-4) var(--sp-16);border-radius:var(--br-full);font-size:var(--fs-12);font-weight:var(--fw-bold); }
.vd-status-pending { background:var(--amber-bg);border:1px solid var(--amber-bd);color:var(--amber); }

/* Assessment stats card */
.ad-stats-card { display:flex;align-items:center;background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-24) 0;margin-bottom:var(--sp-24); }
.ad-stat { flex:1;text-align:center;padding:0 var(--sp-16); }
.ad-stat-lbl { font-size:var(--fs-12);color:var(--t4);margin-bottom:var(--sp-8); }
.ad-stat-val { font-size:var(--fs-18);font-weight:var(--fw-bold);color:var(--t1); }
.ad-stat-score { font-size:var(--fs-18);font-weight:var(--fw-bold);color:var(--cyan); }
.ad-stat-score-max { font-size:var(--fs-14);font-weight:var(--fw-medium);color:var(--t4); }
.ad-stat-divider { width:1px;align-self:stretch;background:var(--border-md); }

/* Weak domains report card */
.ad-report-card { background:var(--bg-card);border:1px solid var(--border-md);border-radius:var(--br-outer);padding:var(--sp-24);margin-bottom:var(--sp-24); }

/* Weak domains accordion */
.wd-accordion {
  --bs-accordion-bg: transparent;
  --bs-accordion-border-color: var(--border-md);
  --bs-accordion-btn-bg: transparent;
  --bs-accordion-active-bg: var(--bg-subtle);
  --bs-accordion-active-color: var(--t1);
  border:1px solid var(--border-md);border-radius:var(--br-outer);overflow:hidden;
}
.wd-acc-item { background:transparent;border:none;border-top:1px solid var(--border); }
.wd-acc-item:first-child { border-top:none; }
.wd-acc-btn {
  display:flex;align-items:center;gap:var(--sp-10);padding:var(--sp-14) var(--sp-16);width:100%;
  background:transparent;box-shadow:none !important;border:none;
  font-size:var(--fs-14);font-weight:var(--fw-semibold);font-family:'Inter',sans-serif;color:var(--t1);
}
.wd-acc-btn::after { display:none; }
.wd-acc-btn:focus { box-shadow:none !important;outline:none; }
.wd-acc-dot { width:8px;height:8px;border-radius:50%;flex-shrink:0; }
.wd-acc-dot-amber  { background:var(--amber); }
.wd-acc-dot-orange { background:var(--orange); }
.wd-acc-dot-red    { background:var(--red); }
.wd-acc-name { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1); }
.wd-acc-score { font-size:var(--fs-12);font-weight:var(--fw-medium);color:var(--t4); }
.wd-acc-chev { margin-left:auto;font-size:var(--fs-12);color:var(--t5);transition:transform var(--t-default); }
.wd-acc-btn.collapsed .wd-acc-chev { transform:rotate(-90deg); }
.wd-acc-body { padding:0 var(--sp-16) var(--sp-20) var(--sp-32);background:var(--bg-subtle);border-top:1px solid var(--border); }

/* System suggestions */
.wd-suggest-lbl { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t4);text-transform:uppercase;/* letter-spacing:.5px; */margin:var(--sp-16) 0 var(--sp-8); }
.wd-suggest-list { list-style:disc;padding-left:var(--sp-20);font-size:var(--fs-14);color:var(--t3);/* line-height:1.8; */margin:0 0 var(--sp-16); }

/* Advisory expert recommendations panel */
.wd-expert-panel { background:var(--cyan-bg);border-left:3px solid var(--cyan);border-radius:var(--br-inner);padding:var(--sp-16); }
.wd-expert-title { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--cyan);margin-bottom:var(--sp-14); }
.wd-field-group { margin-bottom:var(--sp-14); }
.wd-field-group:last-child { margin-bottom:0; }
.wd-field-num { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1);margin-bottom:var(--sp-4);display:block; }
.wd-field-desc { font-size:var(--fs-12);color:var(--t4);margin-bottom:var(--sp-8); }
.wd-textarea-sm { min-height:70px; }

/* Fixed bottom action bar */
.ad-fixed-bar { position:sticky;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:var(--sp-16);flex-wrap:wrap;background:var(--bg-alt);border-top:1px solid var(--border-md);padding: var(--sp-14) 0 var(--sp-14) var(--sp-14);;margin-top:var(--sp-24); }
.ad-fixed-bar-text { font-size:var(--fs-14);color:var(--t4); }
.ad-fixed-bar-actions { display:flex;gap:var(--sp-12); }
.ad-fixed-bar-actions .btn-reject-pill { border-color:var(--cyan);color:var(--cyan); }
.ad-fixed-bar-actions .btn-reject-pill:hover { background:var(--cyan-bg); }
.ad-fixed-bar-actions .btn-deactivate-confirm { padding:var(--sp-12) var(--sp-28);font-size:var(--fs-14);font-weight:var(--fw-bold);background:var(--cyan);color:var(--bg); }
.ad-fixed-bar-actions .btn-deactivate-confirm:hover { background:var(--cyan); }

/* ── 32. QUESTION BANK — DOMAIN HIERARCHY & TABLE ── */
.qb-tree-parent      { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-8);padding:var(--sp-10) var(--sp-10);border-radius:var(--br-inner);cursor:pointer;transition:background var(--t-fast); }
.qb-tree-parent:hover { background:var(--bg-card); }
.qb-tree-parent.active { background:var(--lime-a10); }
.qb-tree-parent-left { display:flex;align-items:center;gap:var(--sp-10);min-width:0; }
.qb-tree-parent-left i { font-size:var(--fs-14);color:var(--t5);flex-shrink:0;width:14px;text-align:center; }
.qb-tree-parent.active .qb-tree-parent-left i { color:var(--lime); }
.qb-tree-parent-name { font-size:var(--fs-14);color:var(--t3);font-weight:var(--fw-medium);overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.qb-tree-parent.active .qb-tree-parent-name { color:var(--lime);font-weight:var(--fw-semibold); }
.qb-tree-count       { font-size:var(--fs-10);font-weight:var(--fw-bold);color:var(--t5);flex-shrink:0; }
.qb-tree-parent.active .qb-tree-count { color:var(--lime); }
.qb-tree-children    { display:none;flex-direction:column;gap:var(--sp-2);padding:var(--sp-2) 0 var(--sp-8) var(--sp-28); }
.qb-tree-children.open { display:flex; }

/* Domain tree: scroll within a bounded height instead of growing the page */
#domainTree {
  max-height: 70vh;
  overflow-y: auto;
  padding-right: var(--sp-4);
}
#domainTree::-webkit-scrollbar        { width: 5px; }
#domainTree::-webkit-scrollbar-track  { background: transparent; }
#domainTree::-webkit-scrollbar-thumb  { background: rgba(183,255,42,0.3); border-radius: var(--br-inner); }
#domainTree::-webkit-scrollbar-thumb:hover { background: rgba(183,255,42,0.5); }
.qb-tree-child       { display:flex;align-items:center;gap:var(--sp-8);padding:var(--sp-8) var(--sp-10);border-radius:var(--br-inner);cursor:pointer;font-size:var(--fs-12);color:var(--t4);transition:background var(--t-fast),color var(--t-fast); }
.qb-tree-child:hover { background:var(--bg-card);color:var(--t2); }
.qb-tree-child.active { background:var(--lime-a10);color:var(--lime); }
.qb-tree-child i     { font-size:var(--fs-10);color:var(--t6);flex-shrink:0; }
.qb-tree-child.active i { color:var(--lime); }
.qb-tree-child-code  { font-weight:var(--fw-bold);flex-shrink:0; }

.qb-tree-subdomain { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-8);padding:var(--sp-6) var(--sp-10) var(--sp-2); }
.qb-tree-subdomain-name { font-size:var(--fs-10);font-weight:var(--fw-bold);text-transform:uppercase;color:var(--t6);letter-spacing:0.4px; }
.qb-tree-subdomain-industry { font-size:var(--fs-11);font-weight:var(--fw-medium);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;color:var(--t4); }

/* Domain Hierarchy + Question table layout */
.qb-layout-grid       { display:grid;grid-template-columns:300px 1fr;gap:var(--sp-16);align-items:start; }
.qb-input-sm          { width:72px !important; }
.qb-select-sm         { min-width:120px !important; }
.qb-search-wrap       { max-width:280px; }

/* Question table */
.qb-table-wrap        { overflow-x:auto;position:relative;min-height:120px; }
.qb-table-wrap .tracker-table { min-width:1180px; }
.qb-table-wrap .tracker-table th,
.qb-table-wrap .tracker-table td { white-space:nowrap; }
.qb-table-wrap .tracker-table td.qb-col-text { white-space:normal;min-width:280px;/* line-height:1.5; */ }
.qb-trend-yes { color:var(--green);font-weight:var(--fw-semibold); }
.qb-trend-no  { color:var(--t5);font-weight:var(--fw-semibold); }
.qb-plan-list { display:flex;flex-wrap:wrap;gap:var(--sp-4); }

/* Question table: server-side DataTables loading overlay (replaces the
   default unstyled "Processing..." text with a proper spinner). */
#qbTable_wrapper { position:relative; }
#qbTable_wrapper .dataTables_processing {
  position: absolute;
  inset: 0;
  /* Vendor DataTables CSS ships several .dataTables_processing rules;
     the highest-specificity one (element+class x2) sets a fixed
     width:200px + margin-left:-100px left over from its own
     left:50%-based centering trick. Since we center via flex + inset
     instead, reset both so that trick can't offset our box. */
  width: auto;
  height: auto;
  margin: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-10);
  background: rgba(10,10,14,0.6);
  backdrop-filter: blur(1px);
  border-radius: var(--br-inner);
  color: var(--t3);
  font-size: var(--fs-13);
  font-weight: var(--fw-medium);
  pointer-events: none;
}
.qb-spinner {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 3px solid rgba(183,255,42,0.15);
  border-top-color: var(--lime);
  animation: qbSpin 0.7s linear infinite;
}
@keyframes qbSpin { to { transform: rotate(360deg); } }

/* Question Bank: Add/Edit Question modal — reuses the project's dark Bootstrap modal shell (.sc-modal) */
.qedit-dialog { max-width:640px; }
.qedit-section { margin-bottom:var(--sp-24); }
.qedit-section:last-child { margin-bottom:0; }
.qedit-sec-title { font-size:var(--fs-12);font-weight:var(--fw-extrabold);color:var(--cyan);text-transform:uppercase;/* letter-spacing:.6px; */margin:0 0 var(--sp-12); }
.qedit-grid-4 { display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-16); }
.qedit-hint { font-size:var(--fs-12);font-style:italic;color:var(--t5);margin:var(--sp-8) 0 var(--sp-16); }
.qedit-check-row { display:flex;align-items:center;gap:var(--sp-28);flex-wrap:wrap; }
.qedit-check-row-fw { justify-content:space-between; }
.qedit-check { display:flex;align-items:center;gap:var(--sp-8);font-size:var(--fs-14);color:var(--t2);cursor:pointer; }
.qedit-check input[type="checkbox"] { width:16px;height:16px;accent-color:var(--cyan);cursor:pointer;flex-shrink:0; }
.qedit-toggle-row { display:flex;align-items:center;gap:var(--sp-10); }
.qedit-toggle-lbl { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t2);cursor:pointer;margin:0; }
.qedit-foot       { justify-content:flex-end;gap:var(--sp-10); }

/* ── SETTINGS & HELP CENTER PAGES ── */

/* Small gap aliases (px-suffixed, used alongside .gap-N) */
.gap-8px  { gap:var(--sp-8); }
.gap-10px { gap:var(--sp-10); }
.gap-12px { gap:var(--sp-12); }
.gap-14px { gap:var(--sp-14); }
.vz-end   { align-items:center;justify-content:flex-end; }
.self-start { align-self:flex-start; }

/* Subtitle / footer text aliases */
.vz-subtitle    { font-size:var(--fs-14);color:var(--t4); }
.vz-footer-text { font-size:var(--fs-12);color:var(--white-a35); }

/* Field label (alias of .field-label) */
.vz-field-lbl { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t4);text-transform:uppercase;/* letter-spacing:.6px; */margin-bottom:var(--sp-8); }

/* Small button variants */
.btn-vz-lime-sm {
  background:var(--lime-bg);border:1px solid var(--lime-bd);color:var(--lime);
  border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);
  cursor:pointer;font-family:'Inter',sans-serif;display:inline-flex;align-items:center;gap:var(--sp-8);
  text-decoration:none;transition:all var(--t-default);
}
.btn-vz-lime-sm:hover { background:var(--lime-a15); }
.btn-vz-cyan-sm {
  background:var(--cyan-a10);border:1px solid var(--cyan-bd);color:var(--cyan);
  border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold);
  cursor:pointer;font-family:'Inter',sans-serif;display:inline-flex;align-items:center;gap:var(--sp-8);
  text-decoration:none;transition:all var(--t-default);
}
.btn-vz-cyan-sm:hover { background:var(--cyan-a10); }
.btn-vz-ghost-sm {
  background:var(--bg-card);border:1px solid var(--border-md);color:var(--t3);
  border-radius:var(--br-inner);padding:var(--sp-8) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-semibold);
  cursor:pointer;font-family:'Inter',sans-serif;display:inline-flex;align-items:center;gap:var(--sp-8);
  text-decoration:none;transition:all var(--t-default);
}
.btn-vz-ghost-sm:hover { background:var(--border-md);color:var(--t1); }
.btn-vz-ghost-sm-muted  { color:var(--t4); }
.btn-vz-ghost-sm-purple { color:var(--purple);border-color:var(--purple-bd); }
.btn-vz-ghost-sm-purple:hover { background:var(--purple-a10); }
.btn-vz-danger, .btn-vz-danger-sm {
  background:var(--red-bg);border:1px solid var(--red-bd);color:var(--red);
  border-radius:var(--br-inner);font-weight:var(--fw-bold);cursor:pointer;font-family:'Inter',sans-serif;
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-8);transition:all var(--t-default);
}
.btn-vz-danger    { padding:var(--sp-8) var(--sp-16);font-size:var(--fs-12); }
.btn-vz-danger-sm { padding:var(--sp-8) var(--sp-14);font-size:var(--fs-12); }
.btn-vz-danger:hover, .btn-vz-danger-sm:hover { background:var(--red-bd); }

/* Small select (used in Preferences) */
.vz-select-sm {
  padding:var(--sp-10) var(--sp-32) var(--sp-10) var(--sp-12);background:var(--bg-mid);border:1px solid var(--border-md);
  border-radius:var(--br-inner);color:var(--t3);font-size:var(--fs-14);font-family:'Inter',sans-serif;
  box-sizing:border-box;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='var(--t6)' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;
}
.vz-select-full { width:100%; }

/* Danger-styled input (Delete Account modal) */
.vz-input-danger { border-color:var(--red-bd); }
.vz-input-danger:focus { outline:none;border-color:var(--red); }

/* ── Settings: two-column layout ── */
.settings-layout { display:grid;grid-template-columns:220px 1fr;gap:var(--sp-16);align-items:start; }
.settings-nav-body { display:flex;flex-direction:column;gap:var(--sp-2); }
.settings-nav-item {
  display:flex;align-items:center;gap:var(--sp-10);
  padding:var(--sp-10) var(--sp-12);border-radius:var(--br-inner);border-left:3px solid transparent;
  font-size:var(--fs-14);color:var(--t3);cursor:pointer;transition:all var(--t-fast);
}
.settings-nav-item:hover { background:var(--bg-card);color:var(--t1); }
.settings-nav-item.active {
  border-left-color:var(--lime);background:var(--lime-a10);
}
.settings-nav-item.active span,
.settings-nav-item.active i { color:var(--lime); }
.settings-nav-ico { width:16px;text-align:center;font-size:var(--fs-14);color:var(--t4); }
.settings-nav-lbl { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t3); }
.settings-nav-ico-active, .settings-nav-lbl-active { color:var(--lime); }
.settings-nav-ico-danger, .settings-nav-lbl-danger { color:var(--red); }
.settings-nav-divider { height:1px;background:var(--border);margin:var(--sp-8) var(--sp-4); }

/* ── Settings: My Profile ── */
.settings-avatar-row { display:flex;align-items:center;gap:var(--sp-14); }
.settings-avatar-name { font-size:var(--fs-16);font-weight:var(--fw-bold);color:var(--t1); }
.settings-avatar-meta { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-2); }

/* ── Settings: Security ── */
.settings-section { padding-bottom:var(--sp-20);margin-bottom:var(--sp-20);border-bottom:1px solid var(--bg-mid); }
.settings-section:last-child { padding-bottom:0;margin-bottom:0;border-bottom:none; }
.settings-section-title { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-4);display:flex;align-items:center; }
.settings-section-sub { font-size:var(--fs-12);color:var(--t4);/* line-height:1.5; */max-width:480px; }
.settings-pw-form { max-width:360px; }
.session-row {
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--sp-12) var(--sp-14);border:1px solid var(--border);border-radius:var(--br-outer);background:var(--bg-subtle);
}
.session-row-current { border-color:var(--lime-a15);background:var(--lime-a10); }
.session-device { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1); }
.session-device-muted { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t3); }
.session-location { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-2); }
.session-ico-muted { color:var(--t4); }

/* ── Settings: Notifications ── */
.notif-section { padding:var(--sp-16) 0;border-bottom:1px solid var(--bg-mid); }
.notif-section:first-child { padding-top:0; }
.notif-section-last { border-bottom:none;padding-bottom:0; }
.notif-section-lbl { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t4);text-transform:uppercase;/* letter-spacing:.6px; */margin-bottom:var(--sp-12); }
.notif-row-title { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t2); }
.notif-row-sub { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-2); }

/* ── Settings: Preferences ── */
.settings-pref-row { padding-bottom:var(--sp-16);margin-bottom:var(--sp-16);border-bottom:1px solid var(--bg-mid); }
.settings-pref-row:last-child { padding-bottom:0;margin-bottom:0;border-bottom:none; }
.pref-row-title { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t2); }
.pref-row-sub { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-2); }

/* ── Settings: Integrations ── */
.integration-card {
  display:flex;align-items:center;justify-content:space-between;
  padding:var(--sp-14) var(--sp-16);border:1px solid var(--border);border-radius:var(--br-outer);background:var(--bg-subtle);
}
.integration-ico {
  width:40px;height:40px;border-radius:var(--br-outer);display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-18);flex-shrink:0;background:var(--bg-mid);
}
.integration-ico-white  { background:var(--border); color:var(--t1); }
.integration-ico-slack  { background:var(--cyan-a10); color:var(--cyan); }
.integration-ico-jira   { background:var(--purple-a10); color:var(--purple); }
.integration-ico-sheets { background:var(--green-a05); color:var(--green); }
.integration-name { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1); }
.integration-desc { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-2); }
.integration-connected { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--green); }

/* ── Settings: Danger Zone ── */
.card-danger { border-color:var(--red-bd); }
.danger-row {
  display:flex;align-items:center;justify-content:space-between;gap:var(--sp-16);
  padding:var(--sp-14) var(--sp-16);border:1px solid var(--red-bd);border-radius:var(--br-outer);background:var(--red-a10);
}
.danger-action-title { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1); }
.danger-action-desc { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-2);max-width:480px; }

/* ── Confirmation modals (Leave Org / Delete Account) ── */
.modal-ico {
  width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-22);margin:0 auto var(--sp-16);
}
.modal-ico-danger { background:var(--red-bg);color:var(--red); }
.modal-desc { font-size:var(--fs-14);color:var(--t4);/* line-height:1.6; */margin-bottom:var(--sp-20); }
.btn-modal-cancel {
  background:var(--bg-mid);border:1px solid var(--border-md);color:var(--t3);
  border-radius:var(--br-inner);padding:var(--sp-10);font-size:var(--fs-14);font-weight:var(--fw-semibold);cursor:pointer;font-family:'Inter',sans-serif;transition:all var(--t-default);
}
.btn-modal-cancel:hover { background:var(--border-md);color:var(--t1); }
.btn-modal-danger {
  background:var(--red);border:none;color:var(--t1);
  border-radius:var(--br-inner);padding:var(--sp-10);font-size:var(--fs-14);font-weight:var(--fw-bold);cursor:pointer;font-family:'Inter',sans-serif;transition:opacity var(--t-default);
}
.btn-modal-danger:hover { opacity:.88; }
.btn-modal-danger:disabled { opacity:.4;cursor:not-allowed; }
.btn-modal-danger:disabled:hover { opacity:.4; }

/* ── Help Center: hero search ── */
.help-hero {
  background:linear-gradient(135deg,var(--lime-a10),var(--cyan-a10));
  border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-32) var(--sp-24);text-align:center;
}
.help-hero-title { font-size:var(--fs-22);font-weight:var(--fw-extrabold);color:var(--t1);margin-bottom:var(--sp-8); }
.help-hero-sub { font-size:var(--fs-14);color:var(--t4); }
.help-search-bar {
  display:flex;
  align-items:center;
  gap:var(--sp-10);
  max-width:560px;
  margin:0 auto;
  background:var(--bg-mid);
  border:1px solid var(--border-md);
  border-radius:var(--br-inner);
  padding:var(--sp-8) var(--sp-8) var(--sp-8) var(--sp-20);
  -webkit-border-radius:var(--br-inner);
  -moz-border-radius:var(--br-inner);
  -ms-border-radius:var(--br-inner);
  -o-border-radius:var(--br-inner);
}
.help-search-ico { color:var(--t4);font-size:var(--fs-14); }
.help-search-input { flex:1;background:transparent;border:none;outline:none;color:var(--t1);font-size:var(--fs-14);font-family:'Inter',sans-serif; }
.help-search-input::placeholder { color:var(--t5); }

/* ── Help Center: quick contact cards ── */
.help-contact-card { background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-24) var(--sp-16); }
.help-contact-title { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1); }
.help-contact-desc { font-size:var(--fs-12);color:var(--t4); }

/* ── Help Center: FAQ ── */
.faq-section-lbl { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);display:flex;align-items:center;gap:var(--sp-8);margin-bottom:var(--sp-10); }
.faq-item { border:1px solid var(--border);border-radius:var(--br-inner);overflow:hidden; }
.faq-header { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-12);width:100%;padding:var(--sp-12) var(--sp-16);cursor:pointer;background:none;border:0;text-align:left;font-family:inherit;transition:background var(--t-fast); }
.faq-header:hover { background:var(--bg-subtle); }
.faq-question { font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t2); }
.faq-chevron { font-size:var(--fs-12);color:var(--t4);flex-shrink:0;transition:transform var(--t-default) ease; }
.faq-answer { padding:0 var(--sp-16);font-size:var(--fs-12);color:var(--t4);/* line-height:1.7; */ }
.faq-answer.show, .faq-answer.collapsing { padding:var(--sp-12) var(--sp-16) var(--sp-14);border-top:1px solid var(--bg-card); }
.faq-item:has(.faq-header[aria-expanded="true"]) { border-color:var(--lime-a15); }
.faq-header[aria-expanded="true"] { background:var(--lime-a10); }
.faq-header[aria-expanded="true"] .faq-question { color:var(--t1); }
.faq-header[aria-expanded="true"] .faq-chevron { color:var(--lime);transform:rotate(180deg); }
.help-no-results { text-align:center;padding:var(--sp-24) 0;font-size:var(--fs-14);color:var(--t4); }

/* ── Settings: 2FA disabled badge ── */
.grade-disabled { background:var(--border);color:var(--t4);border-radius:var(--br-full);padding:var(--sp-4) var(--sp-14);font-size:var(--fs-12);font-weight:var(--fw-bold); }

/* ── Toast notifications ── */
.vz-toast-wrap { position:fixed;bottom:var(--pos-24);right:var(--pos-24);display:flex;flex-direction:column;gap:var(--sp-10);z-index:2000; }
.vz-toast {
  background:var(--bg);border:1px solid var(--border-md);border-left:3px solid var(--lime);border-radius:var(--br-outer);
  padding:var(--sp-12) var(--sp-16);font-size:var(--fs-14);font-weight:var(--fw-semibold);color:var(--t1);display:flex;align-items:center;gap:var(--sp-10);
  box-shadow:0 8px 24px var(--black-a50);min-width:240px;max-width:360px;animation:vzToastIn .25s ease;
}
.vz-toast i { font-size:var(--fs-14);color:var(--lime); }
.vz-toast-cyan { border-left-color:var(--cyan); }
.vz-toast-cyan i { color:var(--cyan); }
.vz-toast-red { border-left-color:var(--red); }
.vz-toast-red i { color:var(--red); }
.vz-toast-out { animation:vzToastOut .25s ease forwards; }
@keyframes vzToastIn  { from{opacity:0;transform:translateX(24px);} to{opacity:1;transform:translateX(0);} }
@keyframes vzToastOut { from{opacity:1;transform:translateX(0);} to{opacity:0;transform:translateX(24px);} }
.dl-logo img {
  max-width: 100%;
  height: 40px;
}
.dl-logo-lg img {
  max-width: 100%;
  height: 80px;
}
.dl-logo-md img {
  max-width: 100%;
  height: 60px;
}

/* ── Skeleton Loading ─────────────────────────────────────────── */
@keyframes plxShimmer {
  0%   { background-position: -400px 0; }
  100% { background-position:  400px 0; }
}
.plx-skeleton {
  background: linear-gradient(90deg, var(--bg-card) 25%, var(--border-md) 50%, var(--bg-card) 75%);
  background-size: 800px 100%;
  animation: plxShimmer 1.4s infinite linear;
  border-radius: var(--br-inner);
  display: block;
}
.plx-skeleton-round { border-radius: 50%; }
.plx-skeleton-card  { pointer-events: none; }

/* ── Dashboard: Control Breakdown & Recommendations ────────────── */
.d1-section-title    { font-size:var(--fs-16); font-weight:var(--fw-extrabold); color:var(--t1); margin-bottom:var(--sp-4); }
.d1-section-sub      { font-size:var(--fs-12); color:var(--t4); margin-bottom:var(--sp-16); }

/* Domain assignment cards within breakdown */
.d1-bd-domain-hdr    { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-12); margin-bottom:var(--sp-14); }
.d1-bd-domain-name   { font-size:var(--fs-16); font-weight:var(--fw-extrabold); color:var(--t1); }
.d1-bd-domain-meta   { font-size:var(--fs-12); color:var(--t4); margin-top:var(--sp-4); }
.d1-bd-domain-score  { font-size:var(--fs-22); font-weight:var(--fw-black); flex-shrink:0; }
.d1-bd-domain-score span { font-size:var(--fs-14); font-weight:var(--fw-regular); color:var(--t5); }

/* Control breakdown table */
.d1-ctrl-tbl          { width:100%; border-collapse:collapse; }
.d1-ctrl-tbl thead th { font-size:var(--fs-12); font-weight:var(--fw-bold); text-transform:uppercase; /* letter-spacing:.8px; */ color:var(--t5); padding:var(--sp-8) var(--sp-12); border-bottom:1px solid var(--border); text-align:left; }
.d1-ctrl-tbl tbody td { font-size:var(--fs-14); color:var(--t2); padding:var(--sp-10) var(--sp-12); border-bottom:1px solid var(--bg-card); }
.d1-ctrl-tbl tbody tr:last-child td { border-bottom:none; }
.d1-ctrl-tbl .d1-ctrl-score { font-weight:var(--fw-bold); }
.d1-ctrl-tbl .d1-ctrl-done  { color:var(--t5); font-size:var(--fs-12); }

/* Maturity grade colour helpers */
.d1-grade-critical   { color:var(--red); }
.d1-grade-developing { color:var(--orange, var(--orange)); }
.d1-grade-defined    { color:var(--amber); }
.d1-grade-managed    { color:var(--cyan); }
.d1-grade-optimised  { color:var(--lime); }

/* Improvement recommendation items */
.d1-rec-item      { padding:var(--sp-16); border-radius:var(--br-outer); border:1px solid var(--border); background:var(--bg-subtle); margin-bottom:var(--sp-10); }
.d1-rec-item:last-child { margin-bottom:0; }
.d1-rec-hdr       { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:var(--sp-10); margin-bottom:var(--sp-12); }
.d1-rec-ctrl-name { font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--t1); }
.d1-rec-score-row { display:flex; align-items:center; gap:var(--sp-8); font-size:var(--fs-14); }
.d1-rec-tips      { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:var(--sp-8); }
.d1-rec-tip       { display:flex; align-items:flex-start; gap:var(--sp-8); font-size:var(--fs-14); color:var(--t3); /* line-height:1.55; */ }
.d1-rec-tip-dot   { width:6px; height:6px; border-radius:50%; background:var(--lime); flex-shrink:0; margin-top:var(--sp-4); }

/* ── Assessment Guidelines page (ag-chain, ag-example, ag-notes) ── */
.ag-score-chain   { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:var(--sp-8); padding:var(--sp-16) 0; }
.ag-chain-step    { display:flex; flex-direction:column; align-items:center; gap:var(--sp-8); background:var(--bg-card); border:1px solid var(--border); border-radius:var(--br-outer); padding:var(--sp-12) var(--sp-20); min-width:120px; text-align:center; }
.ag-chain-icon    { font-size:var(--fs-20); color:var(--lime); }
.ag-chain-label   { font-size:var(--fs-14); font-weight:var(--fw-bold); color:var(--t1); }
.ag-chain-sub     { font-size:var(--fs-12); color:var(--t5); }
.ag-chain-arrow   { font-size:var(--fs-14); color:var(--t5); flex-shrink:0; }
.ag-example-box   { background:var(--bg-card); border:1px solid var(--border); border-radius:var(--br-outer); padding:var(--sp-14) var(--sp-20); display:flex; flex-direction:column; gap:var(--sp-8); }
.ag-example-lbl   { font-size:var(--fs-12); font-weight:var(--fw-bold); text-transform:uppercase; /* letter-spacing:.08em; */ color:var(--t5); }
.ag-notes-list    { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:var(--sp-10); }
.ag-notes-list li { display:flex; align-items:flex-start; gap:var(--sp-8); font-size:var(--fs-14); color:var(--t2); /* line-height:1.6; */ }

/* ── Settings Enhancement (Phase 5) ── */
.settings-nav-danger .settings-nav-ico,
.settings-nav-danger .settings-nav-lbl { color:var(--red) !important; }
.settings-toggle-row   { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-12);padding:var(--sp-10) 0;border-bottom:1px solid var(--bg-card); }
.settings-toggle-row:last-child { border-bottom:none; }
.settings-toggle-lbl   { font-size:var(--fs-14);color:var(--t2);flex:1; }
.notif-section-title   { font-size:var(--fs-12);font-weight:var(--fw-bold);color:var(--t4);text-transform:uppercase;/* letter-spacing:.6px; */margin-bottom:var(--sp-10); }
.vz-toggle             { display:inline-flex;align-items:center;cursor:pointer;flex-shrink:0;margin:0;position:relative; }
.vz-toggle:has(.vz-toggle-track) { width:auto;height:auto;background:transparent;border:none;padding:0; }
.vz-toggle:has(.vz-toggle-track)::after { display:none;content:none; }
.vz-toggle input       { display:none; }
.vz-toggle-track       { width:44px;height:24px;border-radius:var(--br-outer);background:var(--border);position:relative;border:1px solid var(--border-md);transition:all var(--t-default);flex-shrink:0;display:inline-block; }
.vz-toggle-track::after { content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--white-a35);transition:all var(--t-default); }
.vz-toggle input:checked + .vz-toggle-track { background:var(--lime-a15);border-color:var(--lime); }
.vz-toggle input:checked + .vz-toggle-track::after { transform:translateX(20px);background:var(--lime); }
.settings-integration-card { display:flex;align-items:center;gap:var(--sp-12);padding:var(--sp-14);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer); }
.settings-int-icon     { width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:var(--fs-20);color:var(--t3); }
.settings-int-body     { flex:1;min-width:0; }
.settings-int-name     { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1); }
.settings-int-desc     { font-size:var(--fs-12);color:var(--t4); }
.danger-divider        { height:1px;background:var(--red-bg);margin:var(--sp-16) 0; }
.card-danger           { border-color:var(--red-bd) !important; }
.danger-row            { display:flex;align-items:center;justify-content:space-between;gap:var(--sp-16);flex-wrap:wrap; }
.danger-row-title      { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-4); }
.danger-row-desc       { font-size:var(--fs-12);color:var(--t4); }

/* ── Subscription & Billing page (Phase 5 TASK-002) ── */
.sub-stat-grid      { display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--sp-12); }
.sub-stat-item      { background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-12) var(--sp-16); }
.sub-stat-val       { font-size:var(--fs-22);font-weight:var(--fw-extrabold);color:var(--lime); }
.sub-stat-lbl       { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-2); }
.sub-feat-list      { list-style:none;padding:0;margin:0;display:flex;flex:1;flex-direction:column;gap:var(--sp-4);font-size:var(--fs-14);color:var(--t3); }
.sub-cycle-toggle   { display:flex;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-full);padding:var(--sp-4); }
.sub-cycle-opt      { padding:var(--sp-4) var(--sp-14);border-radius:var(--br-full);font-size:var(--fs-12);font-weight:var(--fw-semibold);color:var(--t4);cursor:pointer;transition:all var(--t-default); }
.sub-cycle-opt[data-active="true"] { background:var(--lime-bg);color:var(--lime);border:1px solid var(--lime-bd); }
.sub-plan-grid      { display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--sp-14); }
.sub-plan-card-inner{ background:var(--bg-card);border:1px solid var(--border);border-radius:var(--br-outer);padding:var(--sp-16);display:flex;flex-direction:column;gap:var(--sp-8); }
.sub-plan-card-inner.sub-plan-current { border-color:var(--lime-bd);background:var(--lime-a10); }
.sub-plan-name      { font-size:var(--fs-16);font-weight:var(--fw-extrabold);color:var(--t1); }
.sub-plan-price     { display:flex;align-items:baseline;gap:var(--sp-4); }
.sub-plan-amt       { font-size:var(--fs-24);font-weight:var(--fw-extrabold);color:var(--lime); }
.sub-plan-cycle     { font-size:var(--fs-14);color:var(--t4); }
.sub-compare-table th:first-child,
.sub-compare-table td:first-child { min-width:200px; }

/* ── Trends & Analytics (Phase 5 TASK-003) ── */
.trends-kpi-grid     { display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-14); }
@media(max-width:768px){ .trends-kpi-grid { grid-template-columns:1fr; } }
.trends-kpi-lbl      { font-size:var(--fs-12);font-weight:var(--fw-bold);text-transform:uppercase;/* letter-spacing:.06em; */color:var(--t5);margin-bottom:var(--sp-8); }
.trends-kpi-val      { font-size:var(--fs-26);font-weight:var(--fw-extrabold); }
.trends-kpi-sub      { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-4); }
.trends-chart-card   { }

/* ── Company Logo Upload (Phase 5 TASK-006) ── */
.logo-upload-wrap    { position:relative;display:inline-block; }
.co-logo             { width:56px;height:56px;border-radius:var(--br-outer);object-fit:contain;background:var(--bg-mid);border:1px solid var(--border-md);display:block;flex-shrink:0; }
.logo-upload-btn     { position:absolute;bottom:calc(var(--pos-6) * -1);right:calc(var(--pos-6) * -1);width:22px;height:22px;border-radius:50%;background:var(--lime);color:var(--bg);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:var(--fs-10); }
.logo-upload-btn:hover { background:var(--lime-2); }

/* ── Domain Highlights (Phase 5 TASK-011) ── */
.dh-card          { border-radius:var(--br-outer);padding:var(--sp-14) var(--sp-16);border:1px solid; }
.dh-green         { background:var(--lime-a10);border-color:var(--lime-a15); }
.dh-amber         { background:var(--amber2-a05);border-color:var(--amber2-a20); }
.dh-red           { background:var(--red-a10);border-color:var(--red-bd); }
.dh-card-lbl      { font-size:var(--fs-10);font-weight:var(--fw-bold);text-transform:uppercase;/* letter-spacing:.06em; */color:var(--t5);margin-bottom:var(--sp-8); }
.dh-card-name     { font-size:var(--fs-14);font-weight:var(--fw-bold);color:var(--t1);margin-bottom:var(--sp-8); }
.dh-score-bar     { height:4px;background:var(--border);border-radius:var(--br-inner);margin-bottom:var(--sp-8);overflow:hidden; }
.dh-bar-fill      { height:100%;border-radius:var(--br-inner); }
.bg-lime          { background:var(--lime); }
.bg-amber         { background:var(--amber2); }
.bg-red           { background:var(--red); }
.dh-card-score    { font-size:var(--fs-12);color:var(--t4); }
.q-improvement-note { font-size:var(--fs-12);color:var(--t4);font-style:italic;padding:var(--sp-4) var(--sp-16) var(--sp-8);border-left:2px solid var(--amber2-a30); }

/* ── Revenue Analytics (Phase 5 TASK-012) ── */
.rev-overview-row    { display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-14); }
@media(max-width:900px){ .rev-overview-row { grid-template-columns:repeat(2,1fr); } }
.rev-two-col         { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-14); }
@media(max-width:768px){ .rev-two-col { grid-template-columns:1fr; } }
.rev-kpi-icon        { width:32px;height:32px;border-radius:var(--br-inner);display:flex;align-items:center;justify-content:center;font-size:var(--fs-14);margin:0 auto var(--sp-8); }
.rev-kpi-val         { font-size:var(--fs-22);font-weight:var(--fw-extrabold);color:var(--t1); }
.rev-kpi-lbl         { font-size:var(--fs-12);color:var(--t4);margin-top:var(--sp-4); }
.rev-plan-row        { margin-bottom:var(--sp-12); }
.rev-bar-track       { height:6px;background:var(--border);border-radius:var(--br-inner);overflow:hidden; }
.rev-bar-fill        { height:100%;background:var(--lime);border-radius:var(--br-inner);transition:width var(--t-slow); }
.rev-rank            { width:24px;height:24px;border-radius:50%;background:var(--border);font-size:var(--fs-12);font-weight:var(--fw-bold);display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.border-bottom-dim   { border-bottom:1px solid var(--bg-mid); }
.tr-danger-soft      { background:var(--red-a10); }
.vi-amber            { background:var(--amber2-a15);color:var(--amber2); }

/* ── Billing Form (Phase 5 TASK-001) ── */
.billing-form-grid    { display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-14);align-items:start; }
@media(max-width:860px){ .billing-form-grid { grid-template-columns:1fr; } }
.bill-pay-methods     { display:flex;gap:var(--sp-12);flex-wrap:wrap; }
.bill-pay-opt         { display:flex;align-items:center;gap-6px;gap:var(--sp-8);padding:var(--sp-8) var(--sp-14);border:1px solid var(--border-md);border-radius:var(--br-inner);cursor:pointer;font-size:var(--fs-14);transition:border-color var(--t-fast); }
.bill-pay-opt:has(input:checked) { border-color:var(--lime);color:var(--lime); }
.bill-pay-fields      { margin-top:var(--sp-12); }
.bill-summary-rows    { display:flex;flex-direction:column;gap:var(--sp-10); }
.bill-summary-row     { display:flex;justify-content:space-between;font-size:var(--fs-14); }
.bill-summary-total   { display:flex;justify-content:space-between;font-size:var(--fs-16);font-weight:var(--fw-extrabold);padding-top:var(--sp-10);border-top:1px solid var(--border); }

/* ── Billing success card width ── */
.bill-success-card   { max-width:480px;width:100%; }

/* ── Office add-row flex layout ── */
.office-row-flex     { display:flex;flex-wrap:wrap;gap:var(--sp-8);align-items:flex-end; }
.office-inp-name     { flex:2;min-width:160px; }
.office-inp-sm       { flex:1;min-width:120px; }
/* ── Misc size classes ── */
.vz-select-sm        { width:160px; }
.vz-select-xs        { width:120px; }
.co-logo-lg          { width:64px;height:64px; }

/* ── Standards cleanup (phase-wide audit) ── */
.col-score-sm        { width:80px; }
.col-usage-bar       { min-width:100px; }
.settings-upload-lbl { cursor:pointer; }
.settings-period-wrap{ max-width:300px; }

/* ── Heatmap (Phase 6) ── */
.hm-body         { overflow-x:auto; }
.hm-row          { display:flex;flex-wrap:wrap;gap:var(--sp-8); }
.hm-cell         { display:flex;flex-direction:column;align-items:center;justify-content:center;
                   width:80px;min-height:52px;border-radius:var(--br-inner);cursor:default;padding:var(--sp-4) var(--sp-8);
                   text-align:center; }
.hm-cell-name    { font-size:var(--fs-10);font-weight:var(--fw-semibold);color:inherit;opacity:.8;
                   /* line-height:1.2; */margin-bottom:var(--sp-2);overflow:hidden;
                   display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical; }
.hm-cell-score   { font-size:var(--fs-14);font-weight:var(--fw-extrabold);color:inherit; }
.hm-cell-red     { background:linear-gradient(135deg, rgba(239, 68, 68, 0.25), rgba(239, 68, 68, 0.12)); color:var(--red); border:1px solid var(--red-bd); }
.hm-cell-orange  { background:var(--orange-bd);   color:var(--orange); border:1px solid var(--orange-a15); }
.hm-cell-amber   { background:var(--amber-bd);   color:var(--amber);  border:1px solid var(--amber-a10); }
.hm-cell-lime    { background:var(--lime-a15);   color:var(--lime);   border:1px solid var(--lime-a15); }
.hm-cell-cyan    { background:var(--cyan-bg);   color:var(--cyan);   border:1px solid var(--cyan-bg); }
.hm-cell-purple,
.hm-cell-violet  { background:rgba(168, 85, 247, 0.18); color:var(--purple, #a855f7); border:1px solid rgba(168, 85, 247, 0.25); }
.hm-cell-empty   { background:var(--bg-card);  color:var(--t5);     border:1px solid var(--bg-mid); }
.hm-legend       { display:flex;gap:var(--sp-14);flex-wrap:wrap;font-size:var(--fs-12);color:var(--t3); }
.hm-legend-dot   { display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:var(--sp-4);
                   vertical-align:middle; }
.hm-ld-red       { background:var(--red); }
.hm-ld-orange    { background:var(--orange); }
.hm-ld-amber     { background:var(--amber); }
.hm-ld-lime      { background:var(--lime); }
.hm-ld-cyan      { background:var(--cyan); }
.hm-ld-purple,
.hm-ld-violet    { background:var(--purple, #a855f7); }

/* ── Choices.js vz-choices dark theme (admin form selects) ── */
/* choices.min.css loads before verticz.css via @push('head') so same-specificity rules here win */
.vz-choices { margin-bottom:0;display:block; }
.vz-choices .choices__inner {
  background:var(--bg-card);border:1px solid var(--border-md);
  border-radius:var(--br-inner);min-height:auto;padding:var(--sp-8) var(--sp-32) var(--sp-8) var(--sp-12);
  font-family:'Inter',sans-serif;font-size:var(--fs-14);color:var(--t3);
  display:flex;align-items:center;transition:border-color var(--t-fast);cursor:pointer;
}
.vz-choices .choices__inner:hover,
.vz-choices.is-focused .choices__inner,
.vz-choices.is-open .choices__inner { border-color:var(--white-a35); }
.vz-choices .choices__list--single { padding:0; }
.vz-choices .choices__list--single .choices__item { padding:0;color:var(--t3);font-size:var(--fs-14); }
.vz-choices .choices__placeholder { color:var(--white-a35);opacity:1; }
.vz-choices[data-type*='select-one']::after {
  border-color:var(--white-a35) transparent transparent;right:var(--pos-12);
}
.vz-choices[data-type*='select-one'].is-open::after {
  border-color:transparent transparent var(--white-a35);
}
.vz-choices .choices__list--dropdown,
.vz-choices .choices__list[aria-expanded] {
  background:var(--bg-alt);border:1px solid var(--border-lg);
  border-radius:var(--br-inner);margin-top:var(--sp-4);z-index:1055;
  box-shadow:0 10px 28px var(--black-a50);
}
/* 3-class selector to beat choices.min.css .choices[data-type*=select-one] .choices__input (also 3 classes) */
/* Since choices.min.css loads first, equal-specificity rules here win due to later position */
.vz-choices .choices__list--dropdown .choices__input,
.vz-choices .choices__list[aria-expanded] .choices__input {
  background:var(--bg-mid);border:none;border-bottom:1px solid var(--border-md);
  color:var(--t3);font-size:var(--fs-14);font-family:'Inter',sans-serif;
  padding:var(--sp-8) var(--sp-12);width:100%;margin-bottom:0;box-sizing:border-box;
}
.vz-choices .choices__list--dropdown .choices__item,
.vz-choices .choices__list[aria-expanded] .choices__item {
  font-size:var(--fs-14);color:var(--t3);padding:var(--sp-10) var(--sp-12);
  font-family:'Inter',sans-serif;transition:background var(--t-fast);
}
.vz-choices .choices__list--dropdown .choices__item.is-highlighted,
.vz-choices .choices__list[aria-expanded] .choices__item.is-highlighted {
  background:var(--lime-a10);color:var(--lime);
}
.vz-choices .choices__list--dropdown .choices__item--selectable,
.vz-choices .choices__list[aria-expanded] .choices__item--selectable { padding-right:0; }
.modal .vz-choices .choices__list--dropdown,
.modal .vz-choices .choices__list[aria-expanded] { z-index:1060; }

/* ── vzToast — global toast notifications ── */
#vz-toast-container {
  position:fixed;bottom:var(--pos-24);right:var(--pos-24);z-index:9999;
  display:flex;flex-direction:column;gap:var(--sp-10);pointer-events:none;
}
.vz-toast {
  display:flex;align-items:flex-start;gap:var(--sp-10);
  padding:var(--sp-12) var(--sp-16);border-radius:var(--br-inner);
  min-width:260px;max-width:380px;
  background:var(--dark-navy);border:1px solid var(--border-md);
  font-size:var(--fs-14);/* line-height:1.45; */color:var(--t2);
  box-shadow:0 8px 24px var(--black-a50);
  pointer-events:auto;cursor:pointer;
  animation:vz-toast-in .22s ease;
  transition:opacity var(--t-medium),transform var(--t-medium);
}
.vz-toast.vz-toast-out { opacity:0;transform:translateX(20px); }
.vz-toast-icon { font-size:var(--fs-16);flex-shrink:0;margin-top:var(--sp-2); }
.vz-toast.vz-toast-success .vz-toast-icon { color:var(--lime); }
.vz-toast.vz-toast-error   .vz-toast-icon { color:var(--red); }
.vz-toast.vz-toast-warning .vz-toast-icon { color:var(--amber-400); }
.vz-toast.vz-toast-info    .vz-toast-icon { color:var(--cyan); }
@keyframes vz-toast-in { from { opacity:0;transform:translateX(20px); } to { opacity:1;transform:none; } }