/* ==========================================================================
   Dashboard UI Guide — design tokens (single source of truth)
   Identity: violet → pink accent, ink black, soft off-white surfaces.
   Text colours are the darker "ink" variants so they pass WCAG AA (4.5:1).
   ========================================================================== */

@font-face{font-family:"Inter";font-weight:400;font-style:normal;font-display:swap;src:url("../assets/fonts/inter-Regular.woff") format("woff")}
@font-face{font-family:"Inter";font-weight:500;font-style:normal;font-display:swap;src:url("../assets/fonts/inter-Medium.woff") format("woff")}
@font-face{font-family:"Inter";font-weight:600;font-style:normal;font-display:swap;src:url("../assets/fonts/inter-SemiBold.woff") format("woff")}
@font-face{font-family:"Inter";font-weight:700;font-style:normal;font-display:swap;src:url("../assets/fonts/inter-Bold.woff") format("woff")}
@font-face{font-family:"Inter Display";font-weight:800;font-style:normal;font-display:swap;src:url("../assets/fonts/inter-display-ExtraBold.woff") format("woff")}

:root{
  color-scheme:light;

  /* colour — surfaces */
  --bg:#fbfbfa;
  --surface:#ffffff;
  --surface-2:#f5f4f7;
  --surface-3:#edebf2;
  --line:#e4e1ea;
  --line-strong:#cbc7d6;

  /* colour — text (all ≥ 4.5:1 on --bg and --surface) */
  --text:#0d0d10;
  --text-2:#3a3945;
  --muted:#5b5967;
  --subtle:#6f6d7c;

  /* colour — brand */
  --violet:#5b47d6;          /* text & UI accent, 6.2:1 on white */
  --violet-bright:#7b68ee;   /* decoration only */
  --violet-soft:#f0edff;
  --pink:#b72a8a;            /* text accent */
  --pink-bright:#e442b2;     /* decoration only */
  --pink-soft:#fdebf7;
  --grad:linear-gradient(135deg,#6a55e0 0%,#c93a9f 100%);   /* white text ≥ 4.6:1 */
  --grad-soft:linear-gradient(135deg,var(--violet-soft),var(--pink-soft));

  /* colour — status */
  --danger:#c0233b;   --danger-soft:#fdecef;
  --success:#17714a;  --success-soft:#e7f6ee;
  --warning:#9a5800;  --warning-soft:#fff4df;
  --info:var(--violet); --info-soft:var(--violet-soft);

  /* chart palette — distinguishable by hue AND lightness (colour-blind safe order) */
  --c1:#5b47d6; --c2:#e07a1f; --c3:#1d8a99; --c4:#c93a9f; --c5:#6d8f1f; --c6:#8a5a44;
  --c-grid:var(--line); --c-axis:var(--muted);

  /* type */
  --font:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-display:"Inter Display","Inter",ui-sans-serif,system-ui,sans-serif;
  --font-ar:"IBM Plex Sans Arabic","Segoe UI","Noto Sans Arabic","Geeza Pro",Tahoma,"Noto Naskh Arabic",system-ui,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --fs-xs:.75rem;     /* 12 — minimum, labels only */
  --fs-sm:.875rem;    /* 14 */
  --fs-md:1rem;       /* 16 — body */
  --fs-lg:1.125rem;   /* 18 */
  --fs-xl:1.25rem;    /* 20 */
  --fs-h2:clamp(1.5rem,1.2rem + 1.1vw,2rem);
  --fs-h1:clamp(2rem,1.4rem + 2.6vw,3.5rem);
  --fs-hero:clamp(2.5rem,1.2rem + 5vw,4.9rem);

  /* space (4px grid) */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;--s12:48px;--s16:64px;--s20:80px;

  /* shape & depth */
  --r-sm:8px;--r:14px;--r-lg:22px;--r-pill:999px;
  --shadow-sm:0 1px 2px rgba(13,13,16,.05);
  --shadow:0 1px 2px rgba(13,13,16,.04),0 14px 40px rgba(13,13,16,.07);
  --shadow-lg:0 30px 80px rgba(13,13,16,.14);

  /* layout */
  --header:64px;
  --sidebar:264px;
  --toc:196px;
  --content-max:1080px;

  /* motion */
  --ease:cubic-bezier(.2,.7,.2,1);
  --ease-spring:cubic-bezier(.34,1.4,.5,1);
  --dur-1:.16s;--dur-2:.28s;--dur-3:.7s;
}

html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0e0e12;--surface:#16161c;--surface-2:#1d1d25;--surface-3:#272732;
  --line:#2b2b37;--line-strong:#3e3e4e;
  --text:#f4f3f7;--text-2:#d3d1de;--muted:#aeacbc;--subtle:#9593a6;
  --violet:#ab9dff;--violet-bright:#8e7cff;--violet-soft:#241f4a;
  --pink:#ff86d3;--pink-bright:#ff5cc3;--pink-soft:#3b1a31;
  --grad:linear-gradient(135deg,#6a55e0 0%,#c93a9f 100%);
  --danger:#ff8c9b;--danger-soft:#3a1820;
  --success:#62d79d;--success-soft:#143324;
  --warning:#ffc266;--warning-soft:#392a0c;
  --c1:#9a8aff;--c2:#ff9c4a;--c3:#4fc3d2;--c4:#ff7ccf;--c5:#9bc646;--c6:#d49b83;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow:0 1px 2px rgba(0,0,0,.3),0 18px 50px rgba(0,0,0,.4);
  --shadow-lg:0 30px 90px rgba(0,0,0,.55);
}

/* Arabic: no negative tracking (it breaks letter joining), more generous leading */
html[lang="ar"]{--font:var(--font-ar);--font-display:var(--font-ar)}
html[lang="ar"] *{letter-spacing:0 !important}