/* Kotimber Kozijntechniek — colour tokens.
   Brand values taken verbatim from the brand sheet (assets/brand-sheet.png):
   #0D1E3A navy · #F26622 orange · #F2F2F2 light grey · #FFFFFF white.
   Every other value is a derived tint/shade of those four. */
:root{
  /* --- Brand primitives --- */
  --navy-900:#081426;
  --navy-800:#0D1E3A; /* BRAND NAVY */
  --navy-700:#16294a;
  --navy-600:#22375c;
  --navy-500:#3a4d70;
  --navy-300:#8b97ac;
  --navy-100:#d6dbe4;

  --orange-700:#b84614;
  --orange-600:#d9541a;
  --orange-500:#F26622; /* BRAND ORANGE */
  --orange-400:#ff8347;
  --orange-200:#fbc9ab;
  --orange-100:#fbe0cd; /* peach band used on print collateral */
  --orange-50:#fdf1e9;

  --grey-900:#2b3340;
  --grey-700:#5f6b7c;
  --grey-500:#8d97a5;
  --grey-300:#d9dde3;
  --grey-200:#e6e8ec;
  --grey-100:#F2F2F2; /* BRAND LIGHT GREY */
  --grey-50:#f9fafb;
  --white:#FFFFFF;

  /* --- Status (derived, print collateral has no status colours) --- */
  --green-600:#2e7d4f;
  --green-100:#e2f1e8;
  --amber-600:#c98a06;
  --amber-100:#fdf3dc;
  --red-600:#c7381f;
  --red-100:#fbe6e1;

  /* --- Semantic: text --- */
  --text-heading:var(--navy-800);
  --text-body:var(--navy-600);
  --text-muted:var(--grey-700);
  --text-accent:var(--orange-500);
  --text-inverse:var(--white);
  --text-inverse-muted:rgb(255 255 255 / .72);
  --text-on-accent:var(--white);

  /* --- Semantic: surface --- */
  --surface-page:var(--white);
  --surface-subtle:var(--grey-100);
  --surface-card:var(--white);
  --surface-card-subtle:var(--grey-50);
  --surface-invert:var(--navy-800);
  --surface-invert-raised:var(--navy-700);
  --surface-accent:var(--orange-500);
  --surface-accent-soft:var(--orange-100);
  --surface-accent-faint:var(--orange-50);

  /* --- Semantic: border --- */
  --border-subtle:var(--grey-200);
  --border-default:var(--grey-300);
  --border-strong:var(--navy-800);
  --border-accent:var(--orange-500);
  --border-inverse:rgb(255 255 255 / .18);

  /* --- Semantic: interactive --- */
  --action-primary:var(--orange-500);
  --action-primary-hover:var(--orange-600);
  --action-primary-active:var(--orange-700);
  --action-secondary:var(--navy-800);
  --action-secondary-hover:var(--navy-700);
  --action-secondary-active:var(--navy-900);
  --focus-ring:var(--orange-500);

  /* --- Semantic: feedback --- */
  --status-success-fg:var(--green-600);
  --status-success-bg:var(--green-100);
  --status-warning-fg:var(--amber-600);
  --status-warning-bg:var(--amber-100);
  --status-danger-fg:var(--red-600);
  --status-danger-bg:var(--red-100);
}