/*
 * Moonshot brand theme, taken from the Moonshot design system (tokens.json).
 * Monochrome and square: white sections, carbon blocks, light Mulish text, wide-tracked
 * capitals. app.css only uses these variables.
 *
 * One deliberate addition to the system's greys: --danger, used only for error messages and
 * destructive actions (delete, reject), where a colour cue prevents mistakes.
 */

@font-face { font-family: "Mulish"; font-style: normal; font-weight: 300; font-display: swap; src: url("fonts/mulish-latin-300-normal.woff2") format("woff2"); }
@font-face { font-family: "Mulish"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/mulish-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Mulish"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/mulish-latin-700-normal.woff2") format("woff2"); }

:root {
  /* Type */
  --font-sans: Mulish, Muli, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Colour, light (the white page) */
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --ink: #000000;
  --ink-muted: #8b8b8b;      /* 3.4:1 on white: 24px+ or non-essential detail only */
  --ink-subtle: #656565;     /* 5.8:1 on white: small labels and secondary text */
  --label: var(--ink-subtle);
  --action: #1c1b1b;
  --action-hover: #6a6666;
  --line: #c6c6c6;
  --logo-ink: #1d1d1b;
  --wash: color-mix(in srgb, var(--carbon) 5%, var(--surface)); /* hover and selection fills */

  /* Fixed */
  --carbon: #1c1b1b;
  --night: #000000;
  --on-night: #ffffff;
  --paper: #ffffff;
  --danger: #b42318;

  /* Space (rem) */
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4rem;
  --space-button-x: 1.75rem;
  --space-button-small-y: 0.6rem;
  --space-button-small-x: 1.35rem;

  /* Shape: square, no shadows */
  --radius-0: 0;
  --hairline: 1px;
  --focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px #1c1b1b;
  --icon-button: 0.65rem;
  --logo-height: 2rem;
}

/* A carbon block: the whole token set switches, as in the design system's dark theme. */
[data-theme="dark"], .card-accent, .card-success {
  --surface: #1c1b1b;
  --surface-raised: #222222;
  --ink: #ffffff;
  --label: var(--ink-muted); /* ink-subtle is only 2.9:1 on carbon */
  --action: #8b8b8b;
  --action-hover: #a5a4a4;
  --line: #313131;
  --logo-ink: #ffffff;
  --wash: #222222;
  --danger: #f97066;
  --focus-ring: 0 0 0 2px #1c1b1b, 0 0 0 4px #ffffff;
  background: var(--surface);
  color: var(--ink);
}