/* ============================================================================
   NOVA — Design Tokens (single source of truth for web)
   Consumed by web-customer and web-admin. Mirrored in mobile/lib/theme.
   Philosophy: premium, editorial, restrained. Warm neutrals + one ink-navy
   accent. No purple gradients. Money uses tabular figures. WCAG AA contrast.
   ========================================================================== */

:root {
  /* --- Brand & neutrals (light) ------------------------------------------ */
  --nova-paper:        #F6F4EF; /* app background — warm off-white */
  --nova-surface:      #FFFFFF; /* cards, sheets */
  --nova-surface-2:    #FBFAF7; /* subtle raised/alt surface */
  --nova-hairline:     #E5E2D9; /* dividers, borders */
  --nova-hairline-2:   #D8D4C8; /* stronger border */

  --nova-ink:          #16170F; /* primary text — warm near-black */
  --nova-ink-2:        #45463C; /* secondary text */
  --nova-ink-3:        #71726650; /* placeholder/disabled (with alpha via below) */
  --nova-ink-muted:    #6E6F63; /* muted labels/captions */

  --nova-primary:      #16233F; /* Nova Ink — brand & primary action (navy) */
  --nova-primary-ink:  #FFFFFF; /* text/icon on primary */
  --nova-primary-hover:#1E3155;
  --nova-primary-soft: #E9ECF3; /* primary tint bg (badges, focus rings bg) */

  /* --- Semantic (state) --------------------------------------------------- */
  --nova-success:      #0F7A55; /* credit / settled positive */
  --nova-success-soft: #E4F1EB;
  --nova-pending:      #9A6414; /* pending / processing (amber, AA on paper) */
  --nova-pending-soft: #F6ECD8;
  --nova-danger:       #B42318; /* failed / reversed-danger */
  --nova-danger-soft:  #FBE9E7;
  --nova-info:         #3E4C5E; /* neutral informational */
  --nova-info-soft:    #EAEDF1;

  /* Money direction (kept distinct from brand navy on purpose) */
  --nova-credit:       #0F7A55; /* + inflow */
  --nova-debit:        #16170F; /* − outflow uses ink, not red (red = failure) */

  --nova-focus:        #16233F; /* focus ring color */

  /* --- Typography --------------------------------------------------------- */
  /* Fonts are self-hosted later (Phase 14). Robust fallbacks render now. */
  --nova-font-display: "Space Grotesk", "Inter", system-ui, -apple-system,
                       "Segoe UI", Roboto, sans-serif;
  --nova-font-text:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
                       Helvetica, Arial, sans-serif;
  --nova-font-mono:    "IBM Plex Mono", ui-monospace, "SF Mono", Menlo,
                       Consolas, monospace;

  /* Type scale (1.20 minor-third-ish, tuned for finance legibility) */
  --nova-fs-display:   2.5rem;   /* 40px hero numbers/headlines */
  --nova-fs-h1:        1.75rem;  /* 28px */
  --nova-fs-h2:        1.375rem; /* 22px */
  --nova-fs-h3:        1.125rem; /* 18px */
  --nova-fs-body:      1rem;     /* 16px */
  --nova-fs-sm:        0.875rem; /* 14px */
  --nova-fs-xs:        0.75rem;  /* 12px labels/captions */

  --nova-lh-tight:     1.15;
  --nova-lh-snug:      1.3;
  --nova-lh-normal:    1.5;

  --nova-fw-regular:   400;
  --nova-fw-medium:    500;
  --nova-fw-semibold:  600;
  --nova-fw-bold:      700;

  --nova-tracking-tight: -0.02em; /* display/headlines */
  --nova-tracking-wide:  0.06em;  /* small caps labels */

  /* --- Spacing scale (4px base) ------------------------------------------ */
  --nova-space-0:  0;
  --nova-space-1:  4px;
  --nova-space-2:  8px;
  --nova-space-3:  12px;
  --nova-space-4:  16px;
  --nova-space-5:  20px;
  --nova-space-6:  24px;
  --nova-space-8:  32px;
  --nova-space-10: 40px;
  --nova-space-12: 48px;
  --nova-space-16: 64px;

  /* --- Radius (restrained) ------------------------------------------------ */
  --nova-radius-sm:   6px;
  --nova-radius-md:   10px;
  --nova-radius-lg:   14px;
  --nova-radius-pill: 999px;

  /* --- Elevation (subtle, editorial) ------------------------------------- */
  --nova-shadow-sm: 0 1px 2px rgba(22, 23, 15, 0.05);
  --nova-shadow-md: 0 4px 16px rgba(22, 23, 15, 0.07);
  --nova-shadow-lg: 0 12px 32px rgba(22, 23, 15, 0.10);

  /* --- Motion (purposeful only) ------------------------------------------ */
  --nova-ease:        cubic-bezier(0.2, 0.6, 0.2, 1);
  --nova-dur-fast:    120ms;
  --nova-dur-normal:  200ms;
  --nova-dur-slow:    320ms;

  /* --- Layout ------------------------------------------------------------- */
  --nova-container:   1120px; /* web dashboard max width */
  --nova-tap:         44px;   /* min touch target */
}

/* --- Dark theme: system preference + explicit override -------------------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --nova-paper:        #100F0C;
    --nova-surface:      #17160F;
    --nova-surface-2:    #1D1C14;
    --nova-hairline:     #2C2A20;
    --nova-hairline-2:   #3A382C;

    --nova-ink:          #F4F1E8;
    --nova-ink-2:        #C6C3B7;
    --nova-ink-muted:    #918E80;

    --nova-primary:      #93A7CE; /* lighter navy for contrast on dark */
    --nova-primary-ink:  #0C1220;
    --nova-primary-hover:#A9BADD;
    --nova-primary-soft: #1E2740;

    --nova-success:      #4FC28C;
    --nova-success-soft: #14281F;
    --nova-pending:      #E0B25A;
    --nova-pending-soft: #2A2213;
    --nova-danger:       #F08A7E;
    --nova-danger-soft:  #2C1613;
    --nova-info:         #A9B4C2;
    --nova-info-soft:    #1B2028;

    --nova-credit:       #4FC28C;
    --nova-debit:        #F4F1E8;
    --nova-focus:        #93A7CE;

    --nova-shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
    --nova-shadow-md: 0 4px 16px rgba(0,0,0,0.5);
    --nova-shadow-lg: 0 12px 32px rgba(0,0,0,0.6);
  }
}

/* Explicit dark (toggle sets data-theme="dark") */
:root[data-theme="dark"] {
  --nova-paper:        #100F0C;
  --nova-surface:      #17160F;
  --nova-surface-2:    #1D1C14;
  --nova-hairline:     #2C2A20;
  --nova-hairline-2:   #3A382C;
  --nova-ink:          #F4F1E8;
  --nova-ink-2:        #C6C3B7;
  --nova-ink-muted:    #918E80;
  --nova-primary:      #93A7CE;
  --nova-primary-ink:  #0C1220;
  --nova-primary-hover:#A9BADD;
  --nova-primary-soft: #1E2740;
  --nova-success:      #4FC28C;
  --nova-success-soft: #14281F;
  --nova-pending:      #E0B25A;
  --nova-pending-soft: #2A2213;
  --nova-danger:       #F08A7E;
  --nova-danger-soft:  #2C1613;
  --nova-info:         #A9B4C2;
  --nova-info-soft:    #1B2028;
  --nova-credit:       #4FC28C;
  --nova-debit:        #F4F1E8;
  --nova-focus:        #93A7CE;
  --nova-shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --nova-shadow-md: 0 4px 16px rgba(0,0,0,0.5);
  --nova-shadow-lg: 0 12px 32px rgba(0,0,0,0.6);
}
