/*
  SFS tokens: variables only.
  Do not add component selectors here.
  Docs: _deploy/css-compartmentalisation-readable-map-20260704.md
  Related: _deploy/css-compartmentalisation-worklog-20260704.md; _deploy/css-compartmentalisation-verification-20260704.md
*/

:root {
  --bg: #f6f7f8;
  --surface: #ffffff;
  --surface-soft: #fafafa;
  --text: #24282d;
  --muted: #66707a;
  --line: #d9dee3;
  --line-soft: #e8ecef;

  --brand: #345f7d;
  --brand-soft: #eef5f9;
  --brand-line: #c9dce8;

  --danger: #8f3f3f;
  --danger-soft: #fff5f5;
  --danger-line: #e5c2c2;

  --success: #3b7454;
  --success-soft: #f1f8f4;
  --success-line: #c8dfd1;

  --warning: #8a6418;
  --warning-soft: #fff9ec;
  --warning-line: #ead9ad;

  --radius: 8px;
  --shadow-soft: 0 1px 2px rgba(20, 30, 40, 0.05);
  --content-width: 1180px;
}

/* style-pass-2c: restrained CFTS brand integration.
   Brand is identity and accent, not decoration. */

:root {
  --brand: #0077a8;
  --brand-strong: #005f85;
  --brand-soft: #e4f5fb;
  --brand-line: #c4dde8;
  --accent-warm: #c96500;
}

/* Respect browser dark mode without adding application behaviour. */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #111312;
    --surface: #181a18;
    --surface-soft: #20231f;
    --text: #f2f1eb;
    --muted: #a6aaa4;
    --line: #30342f;
    --line-soft: #252a25;

    --brand: #0093d1;
    --brand-strong: #8bd7f4;
    --brand-soft: #082536;
    --brand-line: #16455b;
    --accent-warm: #f78f1e;

    --danger: #ff8f8f;
    --danger-soft: #351a1a;
    --danger-line: #633030;

    --success: #8bd7a1;
    --success-soft: #183222;
    --success-line: #315a3d;

    --warning: #f78f1e;
    --warning-soft: #362711;
    --warning-line: #694514;

    --shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.28);
  }
}