/* ============================================================
   Adeva Pro — Design Tokens
   Single source of truth. CSS variables consumed by Tailwind v3
   and Razor partials. shadcn/ui-compatible naming.
   Ported from design-system/tokens.css in the Adeva Pro handoff.
   ============================================================ */

:root {
  /* ─── Brand (overridable per-tenant via BrandingTheme middleware) ─── */
  --brand-50:  248 250 252;   /* #F8FAFC */
  --brand-100: 240 253 250;   /* #F0FDFA */
  --brand-200: 153 246 228;   /* #99F6E4 — accent border */
  --brand-300: 94  234 212;
  --brand-400: 45  212 191;
  --brand-500: 11  94  90;    /* #0B5E5A — primary action */
  --brand-600: 13  148 136;
  --brand-700: 15  118 110;
  --brand-800: 17  94  89;
  --brand-900: 19  78  74;
  --brand-950: 11  37  69;    /* #0B2545 — deep navy */

  /* Hex twins (for inline styles + non-Tailwind CSS) */
  --adv-primary:      #0B5E5A;
  --adv-primary-hov:  #0E7A75;
  --adv-primary-deep: #0B2545;
  --adv-accent:       #14B8A6;
  --adv-accent-soft:  #F0FDFA;
  --adv-navy:         #0B2545;

  /* ─── Semantic surfaces (light) ─────────────────────────── */
  --background:        250 250 248;  /* #FAFAF8 */
  --foreground:        11  37  69;   /* #0B2545 */
  --card:              255 255 255;
  --card-foreground:   11  37  69;
  --popover:           255 255 255;
  --popover-foreground:11  37  69;

  --primary:           11  94  90;
  --primary-foreground:255 255 255;
  --secondary:         243 244 246;
  --secondary-foreground:11 37 69;

  --muted:             243 244 246;
  --muted-foreground:  107 114 128;

  --accent:            240 253 250;
  --accent-foreground: 11  94  90;

  --destructive:       153 27  27;   /* #991B1B */
  --destructive-foreground:255 255 255;
  --destructive-soft:  254 226 226;

  --warning:           146 64  14;   /* #92400E */
  --warning-foreground:255 255 255;
  --warning-soft:      254 243 199;

  --success:           6   95  70;   /* #065F46 */
  --success-foreground:255 255 255;
  --success-soft:      209 250 229;

  --info:              30 64 175;
  --info-soft:         219 234 254;

  --adv-border:        229 231 235;
  --adv-input:         229 231 235;
  --adv-ring:          11  94  90;

  /* ─── Radii ──────────────────────────────────────────────── */
  --adv-radius-sm: 4px;
  --adv-radius:    6px;
  --adv-radius-md: 8px;
  --adv-radius-lg: 12px;
  --adv-radius-xl: 16px;
  --adv-radius-2xl: 20px;

  /* ─── Shadows ────────────────────────────────────────────── */
  --adv-shadow-xs:  0 1px 2px 0 rgb(0 0 0 / 0.04);
  --adv-shadow-sm:  0 1px 3px 0 rgb(0 0 0 / 0.06), 0 1px 2px -1px rgb(0 0 0 / 0.06);
  --adv-shadow:     0 4px 14px -2px rgb(0 0 0 / 0.06), 0 2px 4px -2px rgb(0 0 0 / 0.04);
  --adv-shadow-md:  0 10px 24px -8px rgb(0 0 0 / 0.10), 0 4px 8px -4px rgb(0 0 0 / 0.06);
  --adv-shadow-lg:  0 24px 48px -12px rgb(0 0 0 / 0.14);
  --adv-shadow-focus: 0 0 0 3px rgb(11 94 90 / 0.18);

  /* ─── Type ───────────────────────────────────────────────── */
  --adv-font-sans:  'Inter Tight', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --adv-font-mono:  'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --adv-font-serif: 'Fraunces', Georgia, serif;

  /* ─── Motion ─────────────────────────────────────────────── */
  --adv-duration-fast: 120ms;
  --adv-duration-base: 180ms;
  --adv-duration-slow: 280ms;
  --adv-easing-standard:   cubic-bezier(0.2, 0, 0, 1);
  --adv-easing-emphasized: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ─── Dark variant (debtor portal default) ────────────────── */
.dark, html.dark, [data-bs-theme="dark"] {
  --background:        11  18  32;   /* #0B1220 */
  --foreground:        237 237 239;  /* #EDEDEF */
  --card:              19  27  43;
  --card-foreground:   237 237 239;
  --popover:           24  32  48;
  --popover-foreground:237 237 239;

  --primary:           94  234 212;
  --primary-foreground:11  37  69;
  --secondary:         30  41  59;
  --secondary-foreground:237 237 239;

  --muted:             30  41  59;
  --muted-foreground:  156 163 175;

  --accent:            17  94  89;
  --accent-foreground: 153 246 228;

  --destructive:       248 113 113;
  --destructive-foreground:127 29 29;
  --destructive-soft:  60  15 15;

  --warning:           251 191 36;
  --warning-foreground:69  26  3;
  --warning-soft:      66  32  6;

  --success:           74  222 128;
  --success-foreground:6   46  27;
  --success-soft:      6   46  27;

  --info:              147 197 253;
  --info-soft:         23 37 84;

  --adv-border: 42 53 71;
  --adv-input:  42 53 71;
  --adv-ring:   94 234 212;

  --adv-shadow-xs:  0 1px 2px 0 rgb(0 0 0 / 0.4);
  --adv-shadow-sm:  0 1px 3px 0 rgb(0 0 0 / 0.5);
  --adv-shadow:     0 4px 14px -2px rgb(0 0 0 / 0.5);
  --adv-shadow-md:  0 10px 24px -8px rgb(0 0 0 / 0.6);
  --adv-shadow-lg:  0 24px 48px -12px rgb(0 0 0 / 0.7);
  --adv-shadow-focus: 0 0 0 3px rgb(94 234 212 / 0.28);
}

/* ============================================================
   Component primitives — the .adv-* utility classes used by
   every Adeva-rebranded surface. Self-contained, no Tailwind
   dependency required, but plays nicely alongside Tailwind.
   ============================================================ */

/* Typography helpers */
.adv-font-sans  { font-family: var(--adv-font-sans); }
.adv-font-mono  { font-family: var(--adv-font-mono); }
.adv-font-serif { font-family: var(--adv-font-serif); }

.adv-eyebrow {
  font-family: var(--adv-font-mono);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--adv-primary);
}
.dark .adv-eyebrow { color: var(--adv-accent); }

.adv-display {
  font-family: var(--adv-font-serif);
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.05;
  color: var(--adv-navy);
}
.dark .adv-display { color: rgb(var(--foreground)); }

.adv-h1 { font-size: clamp(34px, 5vw, 56px); }
.adv-h2 { font-size: clamp(28px, 3.6vw, 40px); }
.adv-h3 { font-size: clamp(22px, 2.6vw, 28px); }

/* Money — tabular nums, mono. Principle 01: numbers must be unambiguous. */
.adv-money {
  font-family: var(--adv-font-mono);
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum';
  letter-spacing: -0.01em;
  white-space: nowrap;
}
.adv-money-neg { color: rgb(var(--destructive)); }
.adv-money-pos { color: rgb(var(--success)); }

/* AmountDisplay size + tone variants (matches catalogue.jsx AmountDisplay) */
.adv-money { font-weight: 700; }
.adv-money.size-sm   { font-size: 14px; letter-spacing: -0.01em; }
.adv-money.size-md   { font-size: 16px; letter-spacing: -0.01em; }
.adv-money.size-lg   { font-size: 20px; letter-spacing: -0.01em; }
.adv-money.size-xl   { font-size: 30px; letter-spacing: -0.015em; }
.adv-money.size-hero { font-size: 48px; letter-spacing: -0.02em; line-height: 1; }
.adv-money.tone-default { color: rgb(var(--foreground)); }
.adv-money.tone-subtle  { color: rgb(var(--muted-foreground)); }
.adv-money.tone-success { color: rgb(var(--success)); }
.adv-money.tone-danger  { color: rgb(var(--destructive)); }
.adv-money.tone-warning { color: rgb(var(--warning)); }

/* Buttons — match Button.tsx variants */
.adv-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
  font-family: var(--adv-font-sans);
  font-weight: 600;
  letter-spacing: -0.025em;
  border-radius: var(--adv-radius);
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background-color var(--adv-duration-fast) var(--adv-easing-standard),
              border-color var(--adv-duration-fast) var(--adv-easing-standard),
              color var(--adv-duration-fast) var(--adv-easing-standard),
              box-shadow var(--adv-duration-fast) var(--adv-easing-standard);
}
.adv-btn:focus-visible { outline: none; box-shadow: var(--adv-shadow-focus); }
.adv-btn:disabled, .adv-btn[aria-busy="true"] { opacity: 0.5; pointer-events: none; }

.adv-btn-sm  { height: 32px; padding: 0 12px; font-size: 12px; }
.adv-btn-md  { height: 36px; padding: 0 16px; font-size: 14px; }
.adv-btn-lg  { height: 44px; padding: 0 24px; font-size: 14px; }
.adv-btn-icon{ height: 36px; width: 36px; padding: 0; }

.adv-btn-primary {
  background: rgb(var(--primary));
  color: rgb(var(--primary-foreground));
  box-shadow: var(--adv-shadow-xs);
}
.adv-btn-primary:hover  { opacity: 0.9; color: rgb(var(--primary-foreground)); text-decoration: none; }

.adv-btn-secondary {
  background: rgb(var(--card));
  color: rgb(var(--foreground));
  border-color: rgb(var(--adv-border));
}
.adv-btn-secondary:hover { background: rgb(var(--muted)); text-decoration: none; }

.adv-btn-outline {
  background: transparent;
  color: rgb(var(--foreground));
  border-color: rgb(var(--adv-border));
}
.adv-btn-outline:hover { background: rgb(var(--muted)); text-decoration: none; }

.adv-btn-ghost {
  background: transparent;
  color: rgb(var(--foreground));
}
.adv-btn-ghost:hover { background: rgb(var(--muted)); text-decoration: none; }

.adv-btn-destructive {
  background: rgb(var(--card));
  color: rgb(var(--destructive));
  border-color: rgb(var(--destructive) / 0.3);
}
.adv-btn-destructive:hover { background: rgb(var(--destructive-soft)); text-decoration: none; }

.adv-btn-link {
  background: transparent;
  color: rgb(var(--primary));
  height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
}
.adv-btn-link:hover { text-decoration: underline; }

/* Cards */
.adv-card {
  background: rgb(var(--card));
  color: rgb(var(--card-foreground));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-lg);
  box-shadow: var(--adv-shadow-xs);
}
.adv-card-pad   { padding: 20px; }
.adv-card-pad-sm{ padding: 16px; }
.adv-card-pad-lg{ padding: 32px; }

.adv-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border-bottom: 1px solid rgb(var(--adv-border));
}
.adv-card-body  { padding: 20px; }
.adv-card-footer{
  padding: 14px 20px;
  border-top: 1px solid rgb(var(--adv-border));
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

/* Chips / pills / badges */
.adv-chip, .adv-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 999px;
  font-family: var(--adv-font-mono);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  line-height: 1.5;
}
.adv-chip-accent  { background: var(--adv-accent-soft); color: var(--adv-primary); }
.adv-chip-success { background: rgb(var(--success-soft)); color: rgb(var(--success)); }
.adv-chip-warning { background: rgb(var(--warning-soft)); color: rgb(var(--warning)); }
.adv-chip-danger  { background: rgb(var(--destructive-soft)); color: rgb(var(--destructive)); }
.adv-chip-info    { background: rgb(var(--info-soft)); color: rgb(var(--info)); }
.adv-chip-muted   { background: rgb(var(--muted)); color: rgb(var(--muted-foreground)); }

.dark .adv-chip-accent { background: rgba(20,184,166,0.15); color: var(--adv-accent); }

/* Inputs */
.adv-input, .adv-select, .adv-textarea {
  display: block;
  width: 100%;
  font-family: var(--adv-font-sans);
  font-size: 14px;
  line-height: 1.5;
  color: rgb(var(--foreground));
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-md);
  padding: 9px 12px;
  transition: border-color var(--adv-duration-fast), box-shadow var(--adv-duration-fast);
}
.adv-input:focus, .adv-select:focus, .adv-textarea:focus {
  outline: none;
  border-color: var(--adv-primary);
  box-shadow: var(--adv-shadow-focus);
}
.adv-input::placeholder, .adv-textarea::placeholder { color: rgb(var(--muted-foreground)); }
.adv-input-mono { font-family: var(--adv-font-mono); letter-spacing: 0.02em; }

.adv-label {
  display: block;
  font-family: var(--adv-font-sans);
  font-size: 12px;
  font-weight: 600;
  color: rgb(var(--foreground));
  margin-bottom: 6px;
}
.adv-help {
  font-family: var(--adv-font-sans);
  font-size: 12px;
  color: rgb(var(--muted-foreground));
  margin-top: 6px;
}

/* Step / numbered card */
.adv-step {
  padding: 24px;
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-md);
  background: rgb(var(--card));
}
.adv-step-n {
  font-family: var(--adv-font-mono);
  font-size: 32px;
  font-weight: 600;
  color: var(--adv-accent);
  line-height: 1;
  margin-bottom: 14px;
}

/* Section dividers */
.adv-section { padding: clamp(48px, 8vw, 80px) 0; }
.adv-section-tight { padding: clamp(32px, 5vw, 48px) 0; }
.adv-divider { height: 1px; background: rgb(var(--adv-border)); border: 0; margin: 0; }

/* Trust row */
.adv-trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  font-family: var(--adv-font-mono);
  font-size: 11px;
  color: rgb(var(--muted-foreground));
}
.adv-trust-row > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.adv-trust-row i { color: var(--adv-accent); }

/* Reveal animations */
.adv-reveal {
  opacity: 0;
  transform: translateY(12px);
  animation: advFadeUp 540ms var(--adv-easing-standard) forwards;
}
.adv-d1 { animation-delay:  80ms; }
.adv-d2 { animation-delay: 160ms; }
.adv-d3 { animation-delay: 240ms; }
.adv-d4 { animation-delay: 320ms; }
.adv-d5 { animation-delay: 400ms; }

@keyframes advFadeUp {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .adv-reveal { animation: none !important; opacity: 1 !important; transform: none !important; }
}

/* Hardship off-ramp band — Principle 03: hardship is first-class */
.adv-hardship {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 24px;
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-lg);
  background: rgb(var(--card));
}
.adv-hardship-icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: var(--adv-accent-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--adv-primary);
}
.dark .adv-hardship-icon { background: rgba(20,184,166,0.14); color: var(--adv-accent); }

/* Whitelabel disclosure footer */
.adv-disclosure {
  font-family: var(--adv-font-mono);
  font-size: 11px;
  line-height: 1.6;
  color: rgb(var(--muted-foreground));
}

/* Logo wordmark */
.adv-wordmark {
  font-family: var(--adv-font-mono);
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: rgb(var(--foreground));
  text-decoration: none;
}
.adv-wordmark > span { color: var(--adv-primary); }
.dark .adv-wordmark > span { color: var(--adv-accent); }

/* ============================================================
   PART 2 — Extended component primitives
   Inputs, choices, feedback, navigation, data, money, display.
   Ported from design-system/components/* (handoff bundle).
   ============================================================ */

/* ─── Field wrapper (label + control + helper/error) ─────── */
.adv-field { display: flex; flex-direction: column; gap: 6px; }
.adv-field-label {
  font-family: var(--adv-font-sans);
  font-size: 12px;
  font-weight: 600;
  color: rgb(var(--foreground));
  display: flex; align-items: center; gap: 4px;
}
.adv-field-required { color: rgb(var(--destructive)); margin-left: 2px; font-weight: 700; }
.adv-field-helper {
  font-family: var(--adv-font-sans);
  font-size: 12px;
  color: rgb(var(--muted-foreground));
  line-height: 1.4;
}
.adv-field-error {
  font-family: var(--adv-font-sans);
  font-size: 12px;
  color: rgb(var(--destructive));
  line-height: 1.4;
  display: flex; align-items: center; gap: 4px;
}
.adv-field-success {
  font-family: var(--adv-font-sans);
  font-size: 12px;
  color: rgb(var(--success));
  line-height: 1.4;
  display: flex; align-items: center; gap: 4px;
}

/* ─── Input shell (with leading/trailing icons + prefix/suffix) ─── */
.adv-input-shell {
  display: flex; align-items: center; gap: 8px;
  height: 36px;
  padding: 0 12px;
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius);
  transition: border-color var(--adv-duration-fast), box-shadow var(--adv-duration-fast);
  font-family: var(--adv-font-sans);
  font-size: 14px;
  color: rgb(var(--foreground));
}
.adv-input-shell:focus-within {
  border-color: rgb(var(--ring));
  box-shadow: 0 0 0 2px rgb(var(--ring) / 0.30);
  outline: none;
}
.adv-input-shell.is-error { border-color: rgb(var(--destructive)); }
.adv-input-shell.is-error:focus-within {
  border-color: rgb(var(--destructive));
  box-shadow: 0 0 0 2px rgb(var(--destructive) / 0.30);
}
.adv-input-shell.is-success { border-color: rgb(var(--success)); }
.adv-input-shell.is-disabled { opacity: 0.5; pointer-events: none; background: rgb(var(--muted)); }
.adv-input-shell.is-readonly { background: rgb(var(--muted) / 0.5); cursor: default; }
.adv-input-shell.is-filled { background: rgb(var(--muted)); border-color: transparent; }
.adv-input-shell input.adv-input-bare,
.adv-input-shell textarea.adv-input-bare {
  flex: 1;
  background: transparent;
  border: 0;
  outline: 0;
  padding: 0;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  min-width: 0;
}
.adv-input-shell input.adv-input-bare::placeholder,
.adv-input-shell textarea.adv-input-bare::placeholder {
  color: rgb(var(--muted-foreground) / 0.7);
}
.adv-input-shell .adv-input-affix {
  font-family: var(--adv-font-sans);
  color: rgb(var(--muted-foreground));
  user-select: none;
  font-size: 14px;
  flex-shrink: 0;
}
.adv-input-shell .adv-input-icon {
  flex-shrink: 0;
  color: rgb(var(--muted-foreground));
  display: inline-flex; align-items: center;
}
.adv-input-shell.is-error .adv-input-state-icon { color: rgb(var(--destructive)); }
.adv-input-shell.is-success .adv-input-state-icon { color: rgb(var(--success)); }
.adv-input-sm { height: 32px; padding: 0 10px; font-size: 12px; }
.adv-input-lg { height: 44px; padding: 0 14px; font-size: 14px; }

/* ─── Textarea ─── */
.adv-textarea-shell {
  display: block;
  min-height: 80px;
  padding: 10px 12px;
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius);
  font-family: var(--adv-font-sans);
  font-size: 14px;
  line-height: 1.55;
  color: rgb(var(--foreground));
  width: 100%;
  resize: vertical;
  transition: border-color var(--adv-duration-fast), box-shadow var(--adv-duration-fast);
}
.adv-textarea-shell:focus {
  outline: none;
  border-color: rgb(var(--ring));
  box-shadow: 0 0 0 2px rgb(var(--ring) / 0.30);
}
.adv-textarea-shell.is-error { border-color: rgb(var(--destructive)); }
.adv-textarea-shell.is-error:focus {
  border-color: rgb(var(--destructive));
  box-shadow: 0 0 0 2px rgb(var(--destructive) / 0.30);
}
.adv-textarea-shell::placeholder { color: rgb(var(--muted-foreground) / 0.7); }

/* ─── Select trigger (native select styled as a control) ─── */
.adv-select-shell {
  display: flex; align-items: center; gap: 8px;
  height: 36px;
  padding: 0 36px 0 12px;
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius);
  font-family: var(--adv-font-sans);
  font-size: 14px;
  color: rgb(var(--foreground));
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  width: 100%;
  cursor: pointer;
  transition: border-color var(--adv-duration-fast), box-shadow var(--adv-duration-fast);
}
.adv-select-shell:hover { border-color: rgb(var(--foreground) / 0.2); }
.adv-select-shell:focus { outline: none; border-color: rgb(var(--ring)); box-shadow: 0 0 0 2px rgb(var(--ring) / 0.30); }
.adv-select-shell.is-error { border-color: rgb(var(--destructive)); }
.adv-select-sm { height: 32px; padding: 0 32px 0 10px; font-size: 12px; background-position: right 10px center; }
.adv-select-lg { height: 44px; padding: 0 36px 0 14px; }

/* ─── Checkbox ─── */
.adv-checkbox-row { display: inline-flex; align-items: flex-start; gap: 8px; cursor: pointer; }
.adv-checkbox-row input[type="checkbox"] { display: none; }
.adv-checkbox-box {
  flex-shrink: 0;
  width: 16px; height: 16px;
  border-radius: var(--adv-radius-sm);
  border: 1.5px solid rgb(var(--adv-border));
  background: rgb(var(--card));
  display: inline-flex; align-items: center; justify-content: center;
  margin-top: 2px;
  transition: background var(--adv-duration-fast), border-color var(--adv-duration-fast);
}
.adv-checkbox-box::after {
  content: "";
  width: 9px; height: 9px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 8 6 11 13 4'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat;
  opacity: 0; transform: scale(0.6);
  transition: opacity var(--adv-duration-fast), transform var(--adv-duration-fast);
}
.adv-checkbox-row input[type="checkbox"]:checked + .adv-checkbox-box {
  background: var(--adv-primary); border-color: var(--adv-primary);
}
.adv-checkbox-row input[type="checkbox"]:checked + .adv-checkbox-box::after { opacity: 1; transform: scale(1); }
.adv-checkbox-row input[type="checkbox"]:focus-visible + .adv-checkbox-box { box-shadow: var(--adv-shadow-focus); }
.adv-checkbox-row input[type="checkbox"]:disabled + .adv-checkbox-box { opacity: 0.5; pointer-events: none; }
.adv-checkbox-label { font-family: var(--adv-font-sans); font-size: 14px; line-height: 1.4; color: rgb(var(--foreground)); }
.adv-checkbox-label small { display: block; font-size: 12px; color: rgb(var(--muted-foreground)); margin-top: 2px; }
.adv-checkbox-row.is-error .adv-checkbox-box { border-color: rgb(var(--destructive)); }
.adv-checkbox-row.is-error input[type="checkbox"]:checked + .adv-checkbox-box {
  background: rgb(var(--destructive)); border-color: rgb(var(--destructive));
}

/* ─── Inline Radio (16px dot, dense forms) ─── */
.adv-radio-inline { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; }
.adv-radio-inline input[type="radio"] { display: none; }
.adv-radio-inline .adv-radio-circle-sm {
  width: 16px; height: 16px;
  border-radius: 999px;
  border: 1.5px solid rgb(var(--adv-border));
  background: rgb(var(--card));
  position: relative;
  flex-shrink: 0;
}
.adv-radio-inline input[type="radio"]:checked + .adv-radio-circle-sm { border-color: rgb(var(--primary)); }
.adv-radio-inline input[type="radio"]:checked + .adv-radio-circle-sm::after {
  content: "";
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 8px; height: 8px;
  border-radius: 999px;
  background: rgb(var(--primary));
}
.adv-radio-inline input[type="radio"]:focus-visible + .adv-radio-circle-sm { box-shadow: 0 0 0 2px rgb(var(--ring) / 0.30); }
.adv-radio-inline input[type="radio"]:disabled + .adv-radio-circle-sm { opacity: 0.5; pointer-events: none; }
.adv-radio-inline-label { font-family: var(--adv-font-sans); font-size: 14px; color: rgb(var(--foreground)); }

/* ─── Radio (large card-style for plan choices) ─── */
.adv-radio-row {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 16px;
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-md);
  background: rgb(var(--card));
  cursor: pointer;
  transition: border-color var(--adv-duration-fast), background var(--adv-duration-fast);
}
.adv-radio-row:hover { border-color: rgb(var(--foreground) / 0.2); }
.adv-radio-row.is-checked { border-color: var(--adv-primary); background: var(--adv-accent-soft); }
.dark .adv-radio-row.is-checked { background: rgba(20,184,166,0.07); border-color: var(--adv-accent); }
.adv-radio-row input[type="radio"] { display: none; }
.adv-radio-circle {
  flex-shrink: 0;
  width: 18px; height: 18px;
  border-radius: 999px;
  border: 1.5px solid rgb(var(--adv-border));
  background: rgb(var(--card));
  position: relative;
  margin-top: 1px;
}
.adv-radio-row.is-checked .adv-radio-circle { border-color: var(--adv-primary); }
.adv-radio-row.is-checked .adv-radio-circle::after {
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 8px; height: 8px;
  border-radius: 999px;
  background: var(--adv-primary);
}
.dark .adv-radio-row.is-checked .adv-radio-circle::after { background: var(--adv-accent); }
.adv-radio-body { flex: 1; min-width: 0; }
.adv-radio-title {
  font-family: var(--adv-font-sans);
  font-size: 14px; font-weight: 600;
  color: rgb(var(--foreground));
  display: flex; align-items: center; gap: 8px;
}
.adv-radio-sub {
  font-family: var(--adv-font-sans);
  font-size: 13px;
  color: rgb(var(--muted-foreground));
  margin-top: 2px;
}

/* ─── Switch ─── */
.adv-switch { position: relative; display: inline-block; width: 36px; height: 20px; flex-shrink: 0; }
.adv-switch input { opacity: 0; width: 0; height: 0; }
.adv-switch-track {
  position: absolute; cursor: pointer; inset: 0;
  background: rgb(var(--muted));
  border-radius: 999px;
  transition: background var(--adv-duration-fast);
}
.adv-switch-track::before {
  content: ""; position: absolute;
  width: 16px; height: 16px;
  left: 2px; top: 2px;
  background: rgb(var(--card));
  border-radius: 999px;
  box-shadow: var(--adv-shadow-xs);
  transition: transform var(--adv-duration-fast) var(--adv-easing-standard);
}
.adv-switch input:checked + .adv-switch-track { background: var(--adv-primary); }
.adv-switch input:checked + .adv-switch-track::before { transform: translateX(16px); }
.adv-switch input:focus-visible + .adv-switch-track { box-shadow: var(--adv-shadow-focus); }
.adv-switch input:disabled + .adv-switch-track { opacity: 0.5; pointer-events: none; }

/* ─── Banner / Alert ─── */
.adv-banner {
  display: flex; gap: 12px;
  padding: 16px;
  border: 1px solid;
  border-radius: var(--adv-radius);
  font-family: var(--adv-font-sans);
}
.adv-banner-icon { flex-shrink: 0; line-height: 1; padding-top: 2px; font-size: 18px; }
.adv-banner-body { flex: 1; min-width: 0; }
.adv-banner-title { font-size: 14px; font-weight: 600; color: inherit; margin: 0 0 2px; }
.adv-banner-desc { font-size: 14px; color: inherit; opacity: 0.8; line-height: 1.55; margin: 0; }
.adv-banner-action { flex-shrink: 0; }
.adv-banner-dismiss {
  flex-shrink: 0; background: transparent; border: 0;
  color: rgb(var(--muted-foreground)); cursor: pointer;
  padding: 2px; border-radius: var(--adv-radius-sm);
  font-size: 14px; line-height: 1;
}
.adv-banner-dismiss:hover { color: rgb(var(--foreground)); background: rgb(var(--muted)); }
.adv-banner.is-info     { background: rgb(var(--info-soft));        border-color: rgb(var(--info) / 0.2); }
.adv-banner.is-info     .adv-banner-icon { color: rgb(var(--info)); }
.adv-banner.is-success  { background: rgb(var(--success-soft));     border-color: rgb(var(--success) / 0.2); }
.adv-banner.is-success  .adv-banner-icon { color: rgb(var(--success)); }
.adv-banner.is-warning  { background: rgb(var(--warning-soft));     border-color: rgb(var(--warning) / 0.3); }
.adv-banner.is-warning  .adv-banner-icon { color: rgb(var(--warning)); }
.adv-banner.is-danger   { background: rgb(var(--destructive-soft)); border-color: rgb(var(--destructive) / 0.3); }
.adv-banner.is-danger   .adv-banner-icon { color: rgb(var(--destructive)); }

/* ─── Toast (matches catalogue Toast primitive) ─── */
.adv-toast {
  display: flex; gap: 12px;
  width: 320px;
  padding: 16px;
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius);
  box-shadow: var(--adv-shadow-md);
  font-family: var(--adv-font-sans);
  color: rgb(var(--foreground));
}
.adv-toast-icon { flex-shrink: 0; padding-top: 2px; font-size: 18px; }
.adv-toast-body { flex: 1; min-width: 0; }
.adv-toast-title { font-size: 14px; font-weight: 600; color: rgb(var(--foreground)); margin: 0; }
.adv-toast-desc  { font-size: 12px; color: rgb(var(--muted-foreground)); margin: 2px 0 0; line-height: 1.5; }
.adv-toast-action { margin-top: 8px; }
.adv-toast.is-info    .adv-toast-icon { color: rgb(var(--info)); }
.adv-toast.is-success .adv-toast-icon { color: rgb(var(--success)); }
.adv-toast.is-warning .adv-toast-icon { color: rgb(var(--warning)); }
.adv-toast.is-danger  .adv-toast-icon { color: rgb(var(--destructive)); }

/* ─── Modal / Dialog ─── */
.adv-modal-overlay {
  position: fixed; inset: 0;
  background: rgb(var(--foreground) / 0.4);
  backdrop-filter: blur(4px);
  z-index: 50;
  display: none; align-items: center; justify-content: center;
  padding: 24px;
}
.adv-modal-overlay.is-open { display: flex; }
.adv-modal {
  width: 100%;
  max-width: 520px;
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-lg);
  box-shadow: var(--adv-shadow-lg);
  overflow: hidden;
  position: relative;
  max-height: 90vh;
  display: flex; flex-direction: column;
}
.adv-modal-head {
  padding: 20px 24px;
  border-bottom: 1px solid rgb(var(--adv-border));
  display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
}
.adv-modal-title {
  font-family: var(--adv-font-serif);
  font-size: 20px; font-weight: 700;
  letter-spacing: -0.015em;
  color: rgb(var(--foreground));
  margin: 0;
}
.adv-modal-desc {
  font-family: var(--adv-font-sans);
  font-size: 13.5px;
  color: rgb(var(--muted-foreground));
  margin: 4px 0 0;
  line-height: 1.55;
}
.adv-modal-body {
  padding: 20px 24px;
  overflow-y: auto; flex: 1;
  font-family: var(--adv-font-sans);
  font-size: 14px; line-height: 1.6;
  color: rgb(var(--foreground));
}
.adv-modal-foot {
  padding: 16px 24px;
  border-top: 1px solid rgb(var(--adv-border));
  display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap;
}
.adv-modal-close {
  background: transparent; border: 0;
  color: rgb(var(--muted-foreground)); cursor: pointer;
  padding: 4px; border-radius: var(--adv-radius-sm);
  font-size: 18px; line-height: 1;
}
.adv-modal-close:hover { color: rgb(var(--foreground)); background: rgb(var(--muted)); }

/* ─── Empty / Error / Loading states ─── */
.adv-state {
  display: flex; flex-direction: column; align-items: center;
  text-align: center;
  padding: 48px 24px;
}
.adv-state-icon {
  width: 48px; height: 48px;
  border-radius: 999px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 12px;
  font-size: 20px;
}
.adv-state-icon.is-empty   { background: rgb(var(--muted));            color: rgb(var(--muted-foreground)); }
.adv-state-icon.is-error   { background: rgb(var(--destructive-soft)); color: rgb(var(--destructive)); }
.adv-state-icon.is-loading { background: rgb(var(--muted));            color: rgb(var(--muted-foreground)); }
.adv-state-title { font-family: var(--adv-font-sans); font-size: 15px; font-weight: 600; color: rgb(var(--foreground)); margin: 0; }
.adv-state-desc {
  font-family: var(--adv-font-sans);
  font-size: 14px; color: rgb(var(--muted-foreground));
  line-height: 1.55; max-width: 360px; margin: 6px 0 0;
}
.adv-state-action { margin-top: 18px; }

/* ─── Breadcrumb ─── */
.adv-breadcrumb {
  display: flex; align-items: center;
  gap: 6px;
  font-family: var(--adv-font-sans);
  font-size: 12px;
  flex-wrap: wrap;
}
.adv-breadcrumb a { color: rgb(var(--muted-foreground)); text-decoration: none; transition: color var(--adv-duration-fast); }
.adv-breadcrumb a:hover { color: rgb(var(--foreground)); }
.adv-breadcrumb .adv-breadcrumb-current { color: rgb(var(--foreground)); font-weight: 600; }
.adv-breadcrumb .adv-breadcrumb-sep { color: rgb(var(--muted-foreground) / 0.6); font-size: 10px; line-height: 1; }

/* ─── Tabs ─── */
.adv-tabs-list {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border-bottom: 1px solid rgb(var(--adv-border));
}
.adv-tabs-list.is-pill {
  border-bottom: 0;
  background: rgb(var(--muted));
  padding: 4px;
  border-radius: var(--adv-radius-md);
  gap: 4px;
}
.adv-tab {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 12px;
  margin-bottom: -1px;
  border-bottom: 2px solid transparent;
  font-family: var(--adv-font-sans);
  font-size: 14px; font-weight: 500;
  color: rgb(var(--muted-foreground));
  text-decoration: none;
  cursor: pointer;
  background: transparent;
  border-top: 0; border-left: 0; border-right: 0;
  transition: color var(--adv-duration-fast), border-color var(--adv-duration-fast);
  white-space: nowrap;
}
.adv-tab:hover { color: rgb(var(--foreground)); }
.adv-tab.is-active { color: rgb(var(--foreground)); border-bottom-color: var(--adv-primary); }
.dark .adv-tab.is-active { border-bottom-color: var(--adv-accent); }
.adv-tabs-list.is-pill .adv-tab {
  border-radius: var(--adv-radius-sm);
  padding: 6px 12px;
  border-bottom: 0;
}
.adv-tabs-list.is-pill .adv-tab.is-active {
  background: rgb(var(--card));
  color: rgb(var(--foreground));
  box-shadow: var(--adv-shadow-xs);
}

/* ─── Stepper (numbered circles + connector, matches catalogue Stepper) ─── */
.adv-stepper { display: flex; list-style: none; padding: 0; margin: 0; font-family: var(--adv-font-sans); }
.adv-stepper-item { display: flex; flex: 1; align-items: flex-start; gap: 12px; }
.adv-stepper-circle {
  flex-shrink: 0;
  width: 28px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  border: 2px solid rgb(var(--adv-border));
  background: rgb(var(--card));
  color: rgb(var(--muted-foreground));
  font-size: 12px; font-weight: 600;
}
.adv-stepper-item.is-done    .adv-stepper-circle { border-color: rgb(var(--primary)); background: rgb(var(--primary)); color: rgb(var(--primary-foreground)); }
.adv-stepper-item.is-current .adv-stepper-circle { border-color: rgb(var(--primary)); background: rgb(var(--card)); color: rgb(var(--primary)); }
.adv-stepper-body { padding-top: 2px; min-width: 0; flex: 1; }
.adv-stepper-label { font-size: 12px; font-weight: 600; color: rgb(var(--foreground)); }
.adv-stepper-item.is-todo .adv-stepper-label { color: rgb(var(--muted-foreground)); }
.adv-stepper-desc { margin-top: 2px; font-size: 10px; color: rgb(var(--muted-foreground)); }
.adv-stepper-connector { margin-top: 14px; height: 1px; flex: 1; background: rgb(var(--adv-border)); }
.adv-stepper-item.is-done .adv-stepper-connector { background: rgb(var(--primary)); }

/* ─── Pagination ─── */
.adv-pagination { display: flex; align-items: center; gap: 4px; }
.adv-page {
  min-width: 32px; height: 32px;
  padding: 0 8px;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--adv-font-sans);
  font-size: 12px; font-weight: 500;
  color: rgb(var(--muted-foreground));
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-md);
  text-decoration: none;
  cursor: pointer;
  transition: background var(--adv-duration-fast);
}
.adv-page:hover { background: rgb(var(--muted)); color: rgb(var(--foreground)); }
.adv-page.is-active {
  background: rgb(var(--foreground)); color: rgb(var(--background));
  border-color: rgb(var(--foreground));
}
.adv-page.is-disabled, .adv-page[aria-disabled="true"] { opacity: 0.4; pointer-events: none; }
.adv-page-ellipsis {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  color: rgb(var(--muted-foreground));
  font-family: var(--adv-font-sans);
}

/* ─── FilterBar ─── */
.adv-filter-bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  padding: 8px;
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-md);
}
.adv-filter-chips {
  display: inline-flex;
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-sm);
  overflow: hidden;
}
.adv-filter-chip {
  padding: 6px 12px;
  font-family: var(--adv-font-sans);
  font-size: 12px; font-weight: 600;
  color: rgb(var(--muted-foreground));
  background: rgb(var(--card));
  border: 0; border-left: 1px solid rgb(var(--adv-border));
  cursor: pointer;
  transition: background var(--adv-duration-fast);
  white-space: nowrap;
}
.adv-filter-chip:first-child { border-left: 0; }
.adv-filter-chip:hover { background: rgb(var(--muted)); color: rgb(var(--foreground)); }
.adv-filter-chip.is-active { background: rgb(var(--foreground)); color: rgb(var(--background)); }
.adv-filter-chip-count { opacity: 0.6; margin-left: 4px; }
.adv-filter-search { position: relative; flex: 1; min-width: 200px; }
.adv-filter-search input {
  height: 32px;
  padding: 0 12px 0 30px;
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-md);
  font-family: var(--adv-font-sans);
  font-size: 12px; color: rgb(var(--foreground));
  width: 100%;
}
.adv-filter-search input::placeholder { color: rgb(var(--muted-foreground)); }
.adv-filter-search input:focus { outline: none; border-color: var(--adv-primary); box-shadow: var(--adv-shadow-focus); }
.adv-filter-search-icon {
  position: absolute; left: 10px; top: 50%; transform: translateY(-50%);
  color: rgb(var(--muted-foreground));
  font-size: 12px;
  pointer-events: none;
}

/* ─── Badge / Tag / Avatar ─── */
.adv-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-family: var(--adv-font-sans);
  font-size: 12px; font-weight: 600;
  white-space: nowrap;
  line-height: 1.5;
}
.adv-badge-dot { width: 6px; height: 6px; border-radius: 999px; background: currentColor; }
.adv-badge.is-neutral { background: rgb(var(--muted));            color: rgb(var(--muted-foreground)); }
.adv-badge.is-info    { background: rgb(var(--info-soft));        color: rgb(var(--info)); }
.adv-badge.is-success { background: rgb(var(--success-soft));     color: rgb(var(--success)); }
.adv-badge.is-warning { background: rgb(var(--warning-soft));     color: rgb(var(--warning)); }
.adv-badge.is-danger  { background: rgb(var(--destructive-soft)); color: rgb(var(--destructive)); }
.adv-badge.is-primary { background: rgb(var(--accent));           color: rgb(var(--accent-foreground)); }

.adv-tag {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 2px 8px;
  border-radius: var(--adv-radius-sm);
  border: 1px solid rgb(var(--adv-border));
  background: rgb(var(--muted));
  font-family: var(--adv-font-sans);
  font-size: 12px; font-weight: 500;
  color: rgb(var(--foreground));
}
.adv-tag-remove {
  background: transparent; border: 0;
  padding: 2px;
  color: rgb(var(--muted-foreground));
  cursor: pointer;
  border-radius: var(--adv-radius-sm);
  font-size: 12px; line-height: 1; margin-right: -2px;
}
.adv-tag-remove:hover { color: rgb(var(--foreground)); background: rgb(var(--card)); }

.adv-avatar {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px;
  font-family: var(--adv-font-sans);
  font-weight: 600;
  color: #fff;
  flex-shrink: 0;
  overflow: hidden;
}
.adv-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.adv-avatar.size-xs { width: 24px; height: 24px; font-size: 10px; }
.adv-avatar.size-sm { width: 32px; height: 32px; font-size: 12px; }
.adv-avatar.size-md { width: 40px; height: 40px; font-size: 14px; }
.adv-avatar.size-lg { width: 48px; height: 48px; font-size: 16px; }
.adv-avatar.size-xl { width: 64px; height: 64px; font-size: 18px; }

/* ─── Progress / Skeleton ─── */
.adv-progress {
  position: relative;
  width: 100%;
  background: rgb(var(--muted));
  border-radius: 999px;
  overflow: hidden;
}
.adv-progress.size-sm { height: 4px; }
.adv-progress.size-md { height: 8px; }
.adv-progress.size-lg { height: 12px; }
.adv-progress-bar {
  height: 100%;
  border-radius: 999px;
  transition: width var(--adv-duration-slow) var(--adv-easing-emphasized);
}
.adv-progress-bar.tone-brand   { background: var(--adv-primary); }
.adv-progress-bar.tone-success { background: rgb(var(--success)); }
.adv-progress-bar.tone-warning { background: rgb(var(--warning)); }
.adv-progress-bar.tone-danger  { background: rgb(var(--destructive)); }

.adv-skeleton {
  position: relative;
  background: rgb(var(--muted));
  border-radius: var(--adv-radius);
  overflow: hidden;
}
.adv-skeleton::after {
  content: "";
  position: absolute; inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgb(255 255 255 / 0.10), transparent);
  animation: advShimmer 1.6s infinite;
}
@keyframes advShimmer { 100% { transform: translateX(100%); } }

/* ─── Tooltip ─── */
.adv-tooltip-wrap { position: relative; display: inline-block; }
.adv-tooltip-wrap > .adv-tooltip {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  background: rgb(var(--foreground));
  color: rgb(var(--background));
  font-family: var(--adv-font-sans);
  font-size: 12px;
  padding: 6px 10px;
  border-radius: var(--adv-radius-sm);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--adv-duration-fast), transform var(--adv-duration-fast);
  z-index: 30;
  box-shadow: var(--adv-shadow-md);
}
.adv-tooltip-wrap > .adv-tooltip::after {
  content: "";
  position: absolute;
  top: 100%; left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-top-color: rgb(var(--foreground));
}
.adv-tooltip-wrap:hover > .adv-tooltip,
.adv-tooltip-wrap:focus-within > .adv-tooltip {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ─── Table ─── */
.adv-table-wrap { width: 100%; overflow-x: auto; }
.adv-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--adv-font-sans);
  font-size: 14px;
}
.adv-table thead { background: rgb(var(--muted) / 0.5); }
.adv-table th {
  height: 36px;
  padding: 0 16px;
  text-align: left;
  font-family: var(--adv-font-mono);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: rgb(var(--muted-foreground));
  white-space: nowrap;
  border-bottom: 1px solid rgb(var(--adv-border));
}
.adv-table th.adv-table-num { text-align: right; }
.adv-table tbody tr {
  border-bottom: 1px solid rgb(var(--adv-border));
  transition: background var(--adv-duration-fast);
}
.adv-table tbody tr:last-child { border-bottom: 0; }
.adv-table tbody tr:hover { background: rgb(var(--muted) / 0.3); }
.adv-table td {
  padding: 12px 16px;
  vertical-align: middle;
  color: rgb(var(--foreground));
  line-height: 1.5;
}
.adv-table td.adv-table-num {
  text-align: right;
  font-family: var(--adv-font-mono);
  font-variant-numeric: tabular-nums;
}

/* ─── Stat card ─── */
.adv-stat-card {
  padding: 20px;
  background: rgb(var(--card));
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-lg);
}
.adv-stat-label {
  font-family: var(--adv-font-sans);
  font-size: 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: rgb(var(--muted-foreground));
}
.adv-stat-value {
  font-family: var(--adv-font-mono);
  font-size: 24px; font-weight: 700;
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
  color: rgb(var(--foreground));
  margin-top: 4px;
}
.adv-stat-meta {
  font-family: var(--adv-font-sans);
  font-size: 12px;
  margin-top: 4px;
}
.adv-stat-delta.is-good    { color: rgb(var(--success)); font-weight: 600; }
.adv-stat-delta.is-bad     { color: rgb(var(--destructive)); font-weight: 600; }
.adv-stat-delta.is-neutral { color: rgb(var(--muted-foreground)); font-weight: 600; }
.adv-stat-sub { color: rgb(var(--muted-foreground)); }

/* ─── Sidebar ─── */
.adv-sidebar {
  width: 240px; height: 100%;
  display: flex; flex-direction: column;
  background: rgb(var(--card));
  border-right: 1px solid rgb(var(--adv-border));
}
.adv-sidebar.is-compact { width: 64px; }
.adv-sidebar-brand {
  height: 56px;
  padding: 0 16px;
  display: flex; align-items: center;
  border-bottom: 1px solid rgb(var(--adv-border));
}
.adv-sidebar.is-compact .adv-sidebar-brand { padding: 0; justify-content: center; }
.adv-sidebar-nav {
  flex: 1; overflow-y: auto;
  padding: 8px;
  display: flex; flex-direction: column; gap: 16px;
}
.adv-sidebar-section-heading {
  padding: 4px 12px;
  font-family: var(--adv-font-mono);
  font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.14em;
  color: rgb(var(--muted-foreground));
}
.adv-sidebar-item {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 12px;
  border-radius: var(--adv-radius-md);
  font-family: var(--adv-font-sans);
  font-size: 14px; font-weight: 500;
  color: rgb(var(--muted-foreground));
  text-decoration: none;
  transition: background var(--adv-duration-fast), color var(--adv-duration-fast);
  cursor: pointer;
  background: transparent; border: 0; width: 100%;
  text-align: left;
}
.adv-sidebar-item:hover { background: rgb(var(--muted)); color: rgb(var(--foreground)); }
.adv-sidebar-item.is-active { background: rgb(var(--accent)); color: rgb(var(--accent-foreground)); }
.adv-sidebar-item-icon { flex-shrink: 0; width: 16px; line-height: 1; text-align: center; }
.adv-sidebar-item-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adv-sidebar.is-compact .adv-sidebar-item { justify-content: center; padding: 8px; }
.adv-sidebar.is-compact .adv-sidebar-item-label,
.adv-sidebar.is-compact .adv-sidebar-section-heading { display: none; }
.adv-sidebar-foot { border-top: 1px solid rgb(var(--adv-border)); padding: 12px; }

/* ─── Topbar ─── */
.adv-topbar {
  display: flex; align-items: center; gap: 16px;
  height: 56px;
  padding: 0 16px;
  background: rgb(var(--card));
  border-bottom: 1px solid rgb(var(--adv-border));
}
.adv-topbar-left   { display: flex; align-items: center; gap: 12px; }
.adv-topbar-center { flex: 1; min-width: 0; }
.adv-topbar-right  { display: flex; align-items: center; gap: 8px; }

/* ─── Receipt ─── */
.adv-receipt {
  border: 1px solid rgb(var(--adv-border));
  border-radius: var(--adv-radius-lg);
  background: rgb(var(--card));
  overflow: hidden;
  font-family: var(--adv-font-sans);
}
.adv-receipt-head {
  background: rgb(var(--muted));
  padding: 14px 20px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px;
}
.adv-receipt-ref {
  font-family: var(--adv-font-mono);
  font-size: 13px; font-weight: 600;
  color: rgb(var(--foreground));
  margin-top: 2px;
}
.adv-receipt-status {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-family: var(--adv-font-mono);
  font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.10em;
}
.adv-receipt-status.is-paid    { background: rgb(var(--success-soft));     color: rgb(var(--success)); }
.adv-receipt-status.is-failed  { background: rgb(var(--destructive-soft)); color: rgb(var(--destructive)); }
.adv-receipt-status.is-pending { background: rgb(var(--warning-soft));     color: rgb(var(--warning)); }
.adv-receipt-line {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 12px 20px;
  font-size: 14px;
  border-top: 1px solid rgb(var(--adv-border));
}
.adv-receipt-line:first-of-type { border-top: 0; }
.adv-receipt-line .label { color: rgb(var(--muted-foreground)); }
.adv-receipt-line .value { font-family: var(--adv-font-mono); font-variant-numeric: tabular-nums; color: rgb(var(--foreground)); }
.adv-receipt-line.is-emphasis .value { font-weight: 700; }
.adv-receipt-total {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 16px 20px;
  background: rgb(var(--muted) / 0.5);
  border-top: 1px solid rgb(var(--adv-border));
  font-weight: 700;
}
.adv-receipt-disclosure {
  padding: 12px 20px;
  border-top: 1px solid rgb(var(--adv-border));
  font-family: var(--adv-font-sans);
  font-size: 11px;
  color: rgb(var(--muted-foreground));
  line-height: 1.5;
}

/* ─── Aging bar ─── */
.adv-aging-bar {
  display: flex;
  height: 12px;
  width: 100%;
  background: rgb(var(--muted));
  border-radius: 999px;
  overflow: hidden;
}
.adv-aging-segment { height: 100%; }
.adv-aging-segment.tone-brand   { background: var(--adv-primary); }
.adv-aging-segment.tone-success { background: rgb(var(--success)); }
.adv-aging-segment.tone-warning { background: rgb(var(--warning)); }
.adv-aging-segment.tone-danger  { background: rgb(var(--destructive)); }
.adv-aging-segment.tone-purple  { background: #9333ea; }
.adv-aging-legend {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  font-size: 12px;
  margin-top: 12px;
}
@media (min-width: 640px) { .adv-aging-legend { grid-template-columns: repeat(5, 1fr); } }
.adv-aging-legend-item { display: flex; flex-direction: column; gap: 2px; }
.adv-aging-legend-row  { display: flex; align-items: center; gap: 6px; }
.adv-aging-swatch { width: 8px; height: 8px; border-radius: 2px; }
.adv-aging-amount {
  font-family: var(--adv-font-mono);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: rgb(var(--foreground));
}

/* ─── Payment method card ─── */
.adv-pmcard {
  display: flex; align-items: center; gap: 12px;
  width: 100%;
  padding: 16px;
  text-align: left;
  border: 1px solid rgb(var(--adv-border));
  background: rgb(var(--card));
  border-radius: var(--adv-radius-md);
  cursor: pointer;
  transition: border-color var(--adv-duration-fast), background var(--adv-duration-fast);
  font-family: var(--adv-font-sans);
}
.adv-pmcard:hover { border-color: rgb(var(--foreground) / 0.2); }
.adv-pmcard.is-selected { border-color: rgb(var(--primary)); background: rgb(var(--accent)); }
.adv-pmcard-mark {
  width: 48px; height: 32px;
  border-radius: var(--adv-radius-sm);
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  font-family: var(--adv-font-sans);
  font-size: 10px; font-weight: 700;
  text-transform: uppercase;
}
.adv-pmcard-mark.brand-visa       { background: #1A1F71; }
.adv-pmcard-mark.brand-mastercard { background: #EB001B; }
.adv-pmcard-mark.brand-amex       { background: #006FCF; }
.adv-pmcard-mark.brand-bank       { background: #111827; }
.adv-pmcard-mark.brand-bpay       { background: #003D87; }
.adv-pmcard-body { flex: 1; min-width: 0; }
.adv-pmcard-title {
  font-size: 14px; font-weight: 600;
  color: rgb(var(--foreground));
  display: flex; align-items: center; gap: 6px;
}
.adv-pmcard-title .last4 {
  font-family: var(--adv-font-mono);
  color: rgb(var(--muted-foreground));
  font-weight: 500;
}
.adv-pmcard-sub { font-size: 12px; color: rgb(var(--muted-foreground)); margin-top: 2px; }
.adv-pmcard-tick {
  flex-shrink: 0;
  width: 16px; height: 16px;
  border-radius: 999px;
  border: 2px solid rgb(var(--adv-border));
  position: relative;
}
.adv-pmcard.is-selected .adv-pmcard-tick {
  border-color: var(--adv-primary);
  background: var(--adv-primary);
}
.adv-pmcard.is-selected .adv-pmcard-tick::after {
  content: "";
  position: absolute;
  inset: 2px;
  border-radius: 999px;
  background: #fff;
}

/* ============================================================
   Adeva Pro — Base typography (the foundation rules every
   portal needs but no view ever set explicitly).

   Without these, the body inherited Bootstrap's system-ui
   default, and only inline-styled paragraphs ever saw Inter
   Tight. Money values rendered with proportional figures so
   columns of currency didn't line up.
   ============================================================ */

html, body {
  font-family: var(--adv-font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  /* Do NOT enable cv11/ss01 here — the Inter Tight weights served from
     Google Fonts don't carry those stylistic-alternate tables, and the
     browser renders "tofu" missing-glyph squares for affected digits
     and the dollar sign when those OpenType features are requested. */
}

body {
  color: rgb(var(--foreground));
  background: rgb(var(--background));
}

/* Display headings opt into the serif face — used by .adv-page-head h1,
   .adv-h1-page, and any explicit class="adv-h-serif" element. */
.adv-page-head h1,
.adv-h1-page,
.adv-h-serif,
h1.adv-display, h2.adv-display {
  font-family: var(--adv-font-serif);
  font-weight: 700;
  letter-spacing: -0.018em;
  color: rgb(var(--foreground));
}

/* Default numeric rendering for money + amount strings: tabular-nums so
   $1,234.56 lines up vertically in tables / lists. .adv-money already
   forces this, but plain inline numbers anywhere benefit. */
.adv-money,
.adv-table-num,
[class*="adv-stat-value"],
[class*="adv-kpi-value"] {
  font-variant-numeric: tabular-nums;
}

/* Codes (ABN, ACN, BSB, account no., debt reference) — when a value is
   technically alphanumeric but formatting matters, prefer mono. Most
   views set this inline; this rule guarantees the .adv-money-mono helper
   reads correctly when used standalone. */
.adv-money-mono,
.adv-code {
  font-family: var(--adv-font-mono);
  font-variant-numeric: tabular-nums;
}