/* ============================================================
   Fluent / Windows — Color tokens
   Exact values extracted from the Windows UI kit Figma variables
   (_primitive + Theme collections). Light is the :root default;
   dark overrides apply under [data-theme="dark"] or .dark.
   ============================================================ */

:root {
  /* --- Accent (Windows blue) --- */
  --accent-default: rgb(0, 95, 184);
  --accent-secondary: rgba(0, 95, 184, 0.9);
  --accent-tertiary: rgba(0, 95, 184, 0.8);
  --accent-disabled: rgba(0, 0, 0, 0.2169);

  /* --- Text --- */
  --text-primary: rgba(0, 0, 0, 0.8956);
  --text-secondary: rgba(0, 0, 0, 0.6063);
  --text-disabled: rgba(0, 0, 0, 0.3614);
  --text-on-accent-primary: rgb(255, 255, 255);
  --text-on-accent-secondary: rgba(255, 255, 255, 0.7);
  --text-on-accent-disabled: rgb(255, 255, 255);

  /* --- Control fills (buttons, inputs) --- */
  --fill-control-default: rgba(255, 255, 255, 0.7);
  --fill-control-secondary: rgba(249, 249, 249, 0.5);
  --fill-control-tertiary: rgba(249, 249, 249, 0.3);
  --fill-control-disabled: rgba(249, 249, 249, 0.3);

  /* --- Subtle fills (ghost buttons, list hover) --- */
  --fill-subtle-secondary: rgba(0, 0, 0, 0.0373);
  --fill-subtle-tertiary: rgba(0, 0, 0, 0.0241);
  --fill-subtle-disabled: rgba(0, 0, 0, 0);

  /* --- Strokes / borders --- */
  --stroke-control-default: rgba(0, 0, 0, 0.0578);
  --stroke-control-on-accent: rgba(255, 255, 255, 0.08);
  --stroke-divider: rgba(0, 0, 0, 0.0803);
  --stroke-surface: rgba(117, 117, 117, 0.4);

  /* --- Focus rings --- */
  --focus-stroke-outer: rgba(0, 0, 0, 0.8956);
  --focus-stroke-inner: rgb(255, 255, 255);

  /* --- Backgrounds / surfaces --- */
  --bg-solid-base: rgb(243, 243, 243);
  --bg-layer-alt: rgb(255, 255, 255);
  --bg-card: rgba(255, 255, 255, 0.7);
  --bg-card-secondary: rgba(246, 246, 246, 0.5);
  --bg-smoke: rgba(0, 0, 0, 0.3);
  --bg-mica: rgb(243, 243, 243);

  /* --- Neutral greys --- */
  --grey-black: rgb(0, 0, 0);
  --grey-14: rgb(36, 36, 36);
  --grey-44: rgb(112, 112, 112);
  --grey-86: rgb(219, 219, 219);
  --grey-white: rgb(255, 255, 255);

  /* --- Status / system colors (Fluent shared palette) --- */
  --status-success: rgb(15, 123, 15);
  --status-success-bg: rgb(223, 246, 221);
  --status-caution: rgb(157, 93, 0);
  --status-caution-bg: rgb(255, 244, 206);
  --status-critical: rgb(196, 43, 28);
  --status-critical-bg: rgb(253, 231, 233);
  --status-info: rgb(0, 95, 184);
  --status-info-bg: rgb(240, 246, 255);
}

:root[data-theme="dark"],
.dark {
  --accent-default: rgb(96, 205, 255);
  --accent-secondary: rgba(96, 205, 255, 0.9);
  --accent-tertiary: rgba(96, 205, 255, 0.8);
  --accent-disabled: rgba(255, 255, 255, 0.1581);

  --text-primary: rgb(255, 255, 255);
  --text-secondary: rgba(255, 255, 255, 0.786);
  --text-disabled: rgba(255, 255, 255, 0.3628);
  --text-on-accent-primary: rgb(0, 0, 0);
  --text-on-accent-secondary: rgba(0, 0, 0, 0.5);
  --text-on-accent-disabled: rgba(255, 255, 255, 0.5302);

  --fill-control-default: rgba(255, 255, 255, 0.0605);
  --fill-control-secondary: rgba(249, 249, 249, 0.0837);
  --fill-control-tertiary: rgba(249, 249, 249, 0.0326);
  --fill-control-disabled: rgba(30, 30, 30, 0.7);

  --fill-subtle-secondary: rgba(255, 255, 255, 0.0605);
  --fill-subtle-tertiary: rgba(255, 255, 255, 0.0419);
  --fill-subtle-disabled: rgba(255, 255, 255, 0);

  --stroke-control-default: rgba(255, 255, 255, 0.093);
  --stroke-control-on-accent: rgba(255, 255, 255, 0.08);
  --stroke-divider: rgba(255, 255, 255, 0.0837);
  --stroke-surface: rgba(117, 117, 117, 0.4);

  --focus-stroke-outer: rgb(255, 255, 255);
  --focus-stroke-inner: rgba(0, 0, 0, 0.7);

  --bg-solid-base: rgb(32, 32, 32);
  --bg-layer-alt: rgba(255, 255, 255, 0.0538);
  --bg-card: rgba(255, 255, 255, 0.0512);
  --bg-card-secondary: rgba(255, 255, 255, 0.0326);
  --bg-smoke: rgba(0, 0, 0, 0.3);
  --bg-mica: rgb(32, 32, 32);

  --status-success: rgb(108, 203, 95);
  --status-success-bg: rgb(57, 61, 27);
  --status-caution: rgb(252, 225, 148);
  --status-caution-bg: rgb(67, 53, 25);
  --status-critical: rgb(255, 153, 164);
  --status-critical-bg: rgb(68, 39, 38);
  --status-info: rgb(96, 205, 255);
  --status-info-bg: rgb(43, 49, 56);
}