/* PCG — Color tokens
   Brand source: uploads/PCG BRAND COLOURS.png (Pine Teal), sampled sage from logo assets.
   Neutrals + semantic status colors derived in oklch to harmonize with Pine Teal. */
:root {
  /* Brand */
  --pine-teal: #054B38;        /* primary brand color — rgb 5,75,56 */
  --sage: #E9F2E1;             /* secondary brand color — soft light green */
  --white: #FFFFFF;

  /* Pine scale (derived) */
  --pine-900: #033326;
  --pine-800: #054B38;         /* = brand pine teal */
  --pine-700: #0B5E47;
  --pine-600: #147257;
  --pine-500: #1F8A6B;
  --pine-100: #DCEAE3;
  --pine-50:  #EEF5F1;

  /* Sage scale (derived) */
  --sage-300: #C8DDB9;
  --sage-200: #DAE9CE;
  --sage-100: #E9F2E1;         /* = brand sage */
  --sage-50:  #F4F9EF;

  /* Neutrals (green-tinted greys) */
  --ink-900: #14231D;
  --ink-700: #33443C;
  --ink-500: #5C6E64;
  --ink-400: #85958B;
  --ink-300: #B4C1B9;
  --ink-200: #D6DFD9;
  --ink-100: #EAEFEC;
  --ink-50:  #F6F8F6;

  /* Semantic status (compliance) */
  --status-compliant: #1F8A6B;
  --status-compliant-bg: #E2F2EB;
  --status-expiring: #A66A00;
  --status-expiring-bg: #F8EED9;
  --status-overdue: #B3372B;
  --status-overdue-bg: #F9E7E3;
  --status-info: #2A5E75;
  --status-info-bg: #E4EEF3;

  /* Semantic aliases */
  --text-heading: var(--pine-800);
  --text-body: var(--ink-900);
  --text-muted: var(--ink-500);
  --text-on-pine: var(--sage);
  --text-inverse: var(--white);

  --surface-page: var(--white);
  --surface-subtle: var(--ink-50);
  --surface-card: var(--white);
  --surface-sage: var(--sage-100);
  --surface-brand: var(--pine-800);

  --border-default: var(--ink-200);
  --border-strong: var(--ink-300);
  --border-focus: var(--pine-600);

  --action-primary: var(--pine-800);
  --action-primary-hover: var(--pine-700);
  --action-primary-active: var(--pine-900);
  --link: var(--pine-700);
}