/* Aptos is a Microsoft-licensed font (bundled with Microsoft 365 / Windows 11)
   and isn't distributable via a public CDN, so it can't be @import'ed here.
   It's referenced by name below — browsers on machines that have Aptos
   installed locally will render it; everyone else falls back to Calibri /
   Segoe UI / the platform's default sans-serif, which are visually close. */

:root{
  /* --- Palette: light cream sidebar + orange accent + near-black panel headers --- */
  --ink-950:#181818;
  --ink-800:#2B2B28;
  --ink-600:#5A5952;
  --ink-400:#8A8980;
  --ink-200:#D8D6CC;
  --surface-0:#F7F6F2;
  --surface-1:#FFFFFF;
  --surface-2:#F0EEE7;
  --line:#E7E5DC;

  --sidebar-bg:#F7F6F2;
  --sidebar-text:#2B2B28;
  --sidebar-text-muted:#8A8980;
  --sidebar-hover:#EFEDE4;
  --sidebar-line:#E7E5DC;
  --panel-dark:#161513;

  --indigo-600:#E68A1E;
  --indigo-700:#C6740F;
  --indigo-100:#FBEAD4;
  --violet-500:#EE9A2E;

  --amber-500:#F2A33D;
  --amber-600:#D98A1F;
  --amber-100:#FDEED9;
  --emerald-600:#0D9F6E;
  --emerald-100:#DCFAF0;
  --rose-600:#E11D48;
  --rose-100:#FEE2E8;
  --sky-600:#0284C7;
  --sky-100:#E0F4FF;

  --font-display:'Aptos', 'Aptos Display', 'Calibri', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body:'Aptos', 'Calibri', 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:'Aptos Mono', 'Consolas', ui-monospace, monospace;

  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:18px;
  --shadow-sm:0 1px 2px rgba(15,18,34,.06);
  --shadow-md:0 6px 20px -4px rgba(15,18,34,.12);
  --shadow-lg:0 20px 45px -12px rgba(15,18,34,.22);

  --sidebar-w:264px;
  --topbar-h:64px;
  /* Fixed regardless of theme — the amber accent stays the same
     brightness in both light and dark mode, so text sitting on it (the
     brand mark, primary buttons, the upload-button) needs to stay dark
     for contrast rather than following --ink-950's inversion, which is
     right for body text on the page background but wrong here. */
  --ink-on-amber:#181818;
}

/* Dark mode — same hues for brand/status accents (amber, indigo, emerald,
   rose, sky), re-tuned for legibility on a dark page: text/surface/line
   tokens invert, and each accent's pale "100" tint (a light background
   wash in the light theme, e.g. a KPI icon chip's backing) becomes a dark,
   desaturated wash instead of staying a near-white pastel that would sit
   oddly on a dark page. Toggled via [data-theme="dark"] on <html>. */
[data-theme="dark"]{
  --ink-950:#F3F1EA;
  --ink-800:#D6D3C8;
  --ink-600:#A8A499;
  --ink-400:#7C796E;
  --ink-200:#3A382F;
  --surface-0:#16150F;
  --surface-1:#1E1C15;
  --surface-2:#28261D;
  --line:#33301F;

  --sidebar-bg:#16150F;
  --sidebar-text:#D6D3C8;
  --sidebar-text-muted:#7C796E;
  --sidebar-hover:#211F17;
  --sidebar-line:#33301F;
  --panel-dark:#0E0D09;

  --indigo-600:#E68A1E;
  --indigo-700:#F2A03D;
  --indigo-100:#3D2C15;
  --violet-500:#EE9A2E;

  --amber-500:#F2A33D;
  --amber-600:#F6BE73;
  --amber-100:#3D2E14;
  --emerald-600:#34D399;
  --emerald-100:#0F3327;
  --rose-600:#FB7185;
  --rose-100:#3B141C;
  --sky-600:#38BDF8;
  --sky-100:#0F2B3B;

  --shadow-sm:0 1px 2px rgba(0,0,0,.35);
  --shadow-md:0 6px 20px -4px rgba(0,0,0,.5);
  --shadow-lg:0 20px 45px -12px rgba(0,0,0,.6);
}
