/* ==========================================================================
   Ticket9ja Pay — Design Tokens
   A campus fee-collection ledger, styled like a trusted institutional
   receipt book: deep naira-green for money, indigo-night for structure,
   warm gold for a "paid" stamp. Amounts are always set in mono, tabular.
   ========================================================================== */

:root {
  /* ---- Brand palette (named, not generic) ---- */
  --ink-950:   #0B1120;   /* deep indigo-navy — dark surface base   */
  --ink-900:   #101827;
  --ink-800:   #17213A;
  --ink-700:   #212D4C;
  --ink-600:   #303F66;

  --paper-050: #F7F8FC;   /* cool paper white — light surface base */
  --paper-100: #EEF1F8;
  --paper-200: #E2E7F2;
  --paper-300: #C9D1E5;

  --naira-700: #1F5C40;   /* deep naira green — primary brand      */
  --naira-600: #2F6F4E;
  --naira-500: #3C8760;
  --naira-400: #57A87A;
  --naira-100: #DEF2E6;

  --gold-600:  #B5860B;   /* receipt-stamp gold — accent / paid    */
  --gold-500:  #E7B10A;
  --gold-100:  #FBF0CC;

  --indigo-600:#2E4FC7;   /* link / active / info                  */
  --indigo-500:#3E63DD;
  --indigo-100:#E3E9FD;

  --red-600:   #B23B3B;
  --red-500:   #D64545;
  --red-100:   #FBE4E4;

  --amber-500: #E0932B;
  --amber-100: #FBEBD4;

  /* ---- Typography ---- */
  --font-display: 'Sora', 'Segoe UI', sans-serif;
  --font-body:    'Inter', 'Segoe UI', sans-serif;
  --font-mono:    'IBM Plex Mono', 'SFMono-Regular', Menlo, monospace;

  --fs-xs: 0.75rem;
  --fs-sm: 0.8125rem;
  --fs-base: 0.9375rem;
  --fs-md: 1.0625rem;
  --fs-lg: 1.25rem;
  --fs-xl: 1.625rem;
  --fs-2xl: 2.0625rem;
  --fs-3xl: 2.75rem;

  /* ---- Spacing scale ---- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-7: 32px; --sp-8: 40px;
  --sp-9: 56px; --sp-10: 72px;

  /* ---- Radius / motion ---- */
  --r-sm: 8px; --r-md: 12px; --r-lg: 18px; --r-pill: 999px;
  --ease: cubic-bezier(.4,0,.2,1);
  --dur-fast: 140ms;
  --dur-med: 260ms;
  --dur-slow: 420ms;

  /* ---- Elevation ---- */
  --shadow-sm: 0 1px 2px rgba(16, 24, 39, .06), 0 1px 1px rgba(16,24,39,.04);
  --shadow-md: 0 8px 24px -8px rgba(16, 24, 39, .18);
  --shadow-lg: 0 24px 48px -16px rgba(16, 24, 39, .28);

  --sidebar-w: 264px;
  --sidebar-w-collapsed: 76px;
  --topbar-h: 68px;
}

/* ---------------------------------------------------------------------- */
/* LIGHT THEME (default)                                                  */
/* ---------------------------------------------------------------------- */
:root,
[data-theme="light"] {
  --bg: var(--paper-050);
  --bg-subtle: var(--paper-100);
  --surface: #FFFFFF;
  --surface-2: var(--paper-100);
  --border: var(--paper-300);
  --border-soft: var(--paper-200);

  --text-primary: #121826;
  --text-secondary: #4B5670;
  --text-muted: #8993AC;
  --text-on-brand: #FFFFFF;

  --brand: var(--naira-600);
  --brand-strong: var(--naira-700);
  --brand-soft: var(--naira-100);
  --accent: var(--gold-500);
  --accent-strong: var(--gold-600);
  --accent-soft: var(--gold-100);
  --link: var(--indigo-600);
  --link-soft: var(--indigo-100);

  --success: var(--naira-600);
  --success-soft: var(--naira-100);
  --danger: var(--red-600);
  --danger-soft: var(--red-100);
  --warning: var(--amber-500);
  --warning-soft: var(--amber-100);

  --glass-bg: rgba(255, 255, 255, 0.62);
  --glass-border: rgba(255, 255, 255, 0.5);
  --glass-blur: 18px;

  --scrollbar: var(--paper-300);
  color-scheme: light;
}

/* ---------------------------------------------------------------------- */
/* DARK THEME                                                             */
/* ---------------------------------------------------------------------- */
[data-theme="dark"] {
  --bg: var(--ink-950);
  --bg-subtle: var(--ink-900);
  --surface: var(--ink-900);
  --surface-2: var(--ink-800);
  --border: var(--ink-600);
  --border-soft: var(--ink-700);

  --text-primary: #EEF1F8;
  --text-secondary: #AAB4CE;
  --text-muted: #71799A;
  --text-on-brand: #FFFFFF;

  --brand: var(--naira-500);
  --brand-strong: var(--naira-400);
  --brand-soft: rgba(60, 135, 96, 0.18);
  --accent: var(--gold-500);
  --accent-strong: #F4C846;
  --accent-soft: rgba(231, 177, 10, 0.14);
  --link: #7B93F5;
  --link-soft: rgba(62, 99, 221, 0.18);

  --success: var(--naira-400);
  --success-soft: rgba(87, 168, 122, 0.16);
  --danger: #E57272;
  --danger-soft: rgba(214, 69, 69, 0.16);
  --warning: #F0AC55;
  --warning-soft: rgba(224, 147, 43, 0.16);

  --glass-bg: rgba(23, 33, 58, 0.55);
  --glass-border: rgba(255, 255, 255, 0.08);
  --glass-blur: 20px;

  --scrollbar: var(--ink-600);
  color-scheme: dark;
}