/* Night Ledger design tokens
   One token set, two themes. Dark is the default.
   Switch with <html data-theme="light"> or data-theme="dark".
   Never hard-code a hex value in a page: use these variables. */

@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("./fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 500; font-display: swap; src: url("./fonts/ibm-plex-sans-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("./fonts/ibm-plex-sans-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("./fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("./fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2"); }

:root,
[data-theme="dark"] {
  color-scheme: dark;

  /* surfaces */
  --ground: #0F1113;       /* page background */
  --surface: #171A1D;      /* rail, tables, cards, inputs */
  --raised: #1E2226;       /* group rows, active and hovered items */
  --line: #2A2F35;         /* hairlines */
  --line-strong: #9AA3AD;  /* controls retain CAF's visible-boundary contrast */

  /* text */
  --ink: #E8EAED;
  --muted: #9AA3AD;

  /* meaning */
  --accent: #F2B13C;       /* amber: act or active. Primary fill, current item, in progress */
  --accent-text: #F2B13C;  /* amber used as text */
  --on-accent: #1A1300;    /* text on an amber fill */
  --info: #7CB7FF;         /* blue: link, focus, information, in review */
  --ok: #6FCF97;           /* done, success */
  --danger: #FF8A7A;       /* blocked, error, delete */

  /* code blocks stay dark in both themes */
  --code: #0A0B0D;
  --code-ink: #E8EAED;
  --code-muted: #9AA3AD;
  --code-line: #2A2F35;
  --code-border: #3A4048;
  --code-add: #6FCF97;
  --code-del: #FF8A7A;

  --overlay-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}

[data-theme="light"] {
  color-scheme: light;
  --ground: #F3F4F6;
  --surface: #FFFFFF;
  --raised: #ECEFF2;
  --line: #D9DDE3;
  --line-strong: #5A6470;
  --ink: #15181C;
  --muted: #5A6470;
  --accent: #F2B13C;
  --accent-text: #8A5A00;
  --on-accent: #1A1300;
  --info: #1D4ED8;
  --ok: #1F7A4D;
  --danger: #B4232A;
  --code: #15181C;
  --overlay-shadow: 0 8px 24px rgba(21, 24, 28, 0.16);
}

:root {
  /* type */
  --sans: "IBM Plex Sans", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, monospace;

  /* shape */
  --radius: 4px;
  --radius-sm: 3px;
  --marker-radius: 1px;
  --overlay-backdrop: rgba(0, 0, 0, 0.6);

  /* spacing, 4px grid */
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 24px;
  --s6: 32px;
  --s7: 40px;

  /* heights */
  --h-compact: 28px;
  --h-control: 36px;
  --h-group-row: 36px;
  --h-row: 44px;

  /* widths */
  --rail-width: 220px;
  --prose-width: 700px;
}

/* CAF issue types retain their established meaning; status colors use the kit. */
:root, [data-theme="dark"] {
  --epic-fg: #D0A5F5;
  --epic-bg: #30213E;
  --story-fg: var(--ok);
  --story-bg: var(--surface);
  --ok-text: var(--ok);
}
[data-theme="light"] {
  --epic-fg: #6B3296;
  --epic-bg: #F0E8FA;
  --ok-text: #185F3C;
}