/* Institute dashboard tokens: a hand mirror of design/tokens.json (STANDARDS §12.2).
   tests/test_tokens.py fails the build when a value here drifts from tokens.json.
   Only names that exist in tokens.json; derived values live in dashboard.css. */

@font-face {
  font-family: "Inter";
  src: url("fonts/inter-variable.2bb4bc58e590.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("fonts/montserrat-variable.f60664bf6c67.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --bg: #FFFFFF;
  --canvas: #FBFBF6;
  --card: #FFFFFF;
  --field: #F6F7FB;
  --ink: #0F1222;
  --muted: #5A6072;
  --line: #E5E7EF;
  --fieldBorder: #868C9E;
  --link: #457B28;
  --linkSoft: #EDF5E6;
  --pill: #0F1222;
  --onPill: #FFFFFF;
  --accent: #4F46E5;
  --soft: #EEF0FF;
  --mesh1: #E0E7FF;
  --mesh2: #EDE9FE;
  --onAction: #1C2321;
  --action1: #BDEDFC;
  --action2: #C6ECE5;
  --action3: #D6E7CE;
  --action4: #ECE49F;
  --error: #C2312B;
  --errorBg: #FDECEC;
  --success: #12805C;
  --wash2: #F9F3D6;

  --space-xxs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;

  --radius-xs: 2px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  --opacity-disabled: 0.45;

  /* border in tokens.json (dp → px): only the widths the dashboard draws. */
  --border-hairline: 1px;
  --border-field: 1.2px;
  --border-emphasis: 1.5px;
  --border-selected: 2px;
  --border-fieldFocus: 2px;  /* a focused field's edge; the web sign-in's focus ring (TD-AUTH-01) */

  --font-ui: "Inter", "Noto Sans Devanagari", sans-serif;
  --font-heading: "Montserrat", "Noto Sans Devanagari", sans-serif;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-semibold: 600;

  --motion-dwell-notice: 2000ms;

  /* Type scale: font.style in tokens.json as font shorthands (sp → px), and tracking where a style sets it. */
  --text-display: 600 32px/40px var(--font-heading);
  --text-headline: 600 26px/34px var(--font-heading);
  --text-title: 700 18px/24px var(--font-ui);
  --text-titleSmall: 700 15px/20px var(--font-ui);
  --text-body: 400 15px/22px var(--font-ui);
  --text-bodySmall: 400 13px/19px var(--font-ui);
  --text-label: 700 15px/20px var(--font-ui);
  --text-caption: 500 12px/16px var(--font-ui);
  --text-pageTitle: 600 24px/30px var(--font-heading);
  --text-cardHeadline: 600 20px/26px var(--font-heading);
  --text-sectionTitle: 600 17px/22px var(--font-heading);
  --text-cardTitle: 600 15px/20px var(--font-ui);
  --text-button: 600 16px/20px var(--font-ui);
  --text-labelSmall: 600 13px/18px var(--font-ui);
  --text-chip: 400 14px/18px var(--font-ui);
  --text-statNumber: 300 17px/22px var(--font-ui);
  --text-overline: 700 11px/16px var(--font-ui);
  --text-headlineHi: 600 26px/38px var(--font-heading);
  --text-bodyHi: 400 15px/24px var(--font-ui);
  --tracking-title: -0.01em;
  --tracking-overline: 0.6px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0B0D17;
    --canvas: #0B0D17;
    --card: #121527;
    --field: #151829;
    --ink: #EEF0FA;
    --muted: #A1A7BD;
    --line: #262A3D;
    --fieldBorder: #6B7089;
    --link: #A5D67A;
    --linkSoft: #1E2A16;
    --pill: #EEF0FA;
    --onPill: #0F1222;
    --accent: #A5B4FC;
    --soft: #1E2140;
    --mesh1: #1E1B4B;
    --mesh2: #2A1458;
    --onAction: #1C2321;
    --action1: #BDEDFC;
    --action2: #C6ECE5;
    --action3: #D6E7CE;
    --action4: #ECE49F;
    --error: #FF8A80;
    --errorBg: #2A1517;
    --success: #6EE7B7;
    --wash2: #2A2614;
  }
}