/*
 * PMS design tokens.
 *
 * Every colour, radius and shadow in the application resolves to a variable declared here.
 * Swapping in a different corporate palette must be a change to this file alone — no other
 * stylesheet, view or chart may hard-code a colour.
 */

:root {
  /* Brand — deep navy structure, teal accent */
  --pms-navy-900: #071a2b;
  --pms-navy-800: #0b2338;
  --pms-navy-700: #0f2b46;
  --pms-navy-600: #163a5c;
  --pms-navy-500: #1f4c76;

  --pms-teal-700: #0a7d73;
  --pms-teal-600: #0f9b8e;
  --pms-teal-500: #14b8a6;
  --pms-teal-100: #d5f4f0;

  /* Surfaces */
  --pms-bg: #f5f7fa;
  --pms-surface: #ffffff;
  --pms-surface-2: #eef2f7;
  --pms-surface-3: #e2e8f0;
  --pms-border: #d8e0ea;
  --pms-border-strong: #b8c5d6;

  /* Text */
  --pms-text: #16222f;
  --pms-text-muted: #5b6b7c;
  --pms-text-inverse: #eef4fa;
  --pms-text-inverse-muted: #9fb3c8;

  /* Project health — used by badges, tiles and charts alike */
  --pms-ok: #16a34a;
  --pms-ok-bg: #dcfce7;
  --pms-warn: #d97706;
  --pms-warn-bg: #fef3c7;
  --pms-late: #dc2626;
  --pms-late-bg: #fee2e2;
  --pms-critical: #9f1239;
  --pms-critical-bg: #ffe4e6;
  --pms-idle: #64748b;
  --pms-idle-bg: #e2e8f0;

  /* Financial direction */
  --pms-inflow: #0f9b8e;
  --pms-outflow: #b45309;
  --pms-surplus: #16a34a;
  --pms-deficit: #dc2626;

  /* Categorical series for charts. Ordered for maximum separation at small sizes. */
  --pms-series-1: #0f9b8e;
  --pms-series-2: #2563eb;
  --pms-series-3: #d97706;
  --pms-series-4: #9333ea;
  --pms-series-5: #dc2626;
  --pms-series-6: #0891b2;
  --pms-series-7: #65a30d;
  --pms-series-8: #db2777;

  /* Geometry */
  --pms-radius-sm: 0.375rem;
  --pms-radius: 0.625rem;
  --pms-radius-lg: 1rem;

  --pms-shadow-sm: 0 1px 2px rgba(7, 26, 43, 0.06), 0 1px 3px rgba(7, 26, 43, 0.04);
  --pms-shadow: 0 2px 4px rgba(7, 26, 43, 0.06), 0 4px 12px rgba(7, 26, 43, 0.07);
  --pms-shadow-lg: 0 8px 24px rgba(7, 26, 43, 0.12);

  --pms-sidebar-width: 16rem;
  --pms-sidebar-width-collapsed: 4.25rem;
  --pms-topbar-height: 3.75rem;

  /* Map the tokens onto Bootstrap's own variables so components inherit the theme */
  --bs-primary: var(--pms-teal-600);
  --bs-primary-rgb: 15, 155, 142;
  --bs-body-bg: var(--pms-bg);
  --bs-body-color: var(--pms-text);
  --bs-border-color: var(--pms-border);
  --bs-border-radius: var(--pms-radius);
  --bs-link-color: var(--pms-teal-700);
  --bs-link-hover-color: var(--pms-teal-600);
  --bs-font-sans-serif: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
}

[data-bs-theme="dark"] {
  --pms-bg: #0a1520;
  --pms-surface: #10202f;
  --pms-surface-2: #16293b;
  --pms-surface-3: #1e3446;
  --pms-border: #24384c;
  --pms-border-strong: #33506b;

  --pms-text: #e6eef6;
  --pms-text-muted: #97aabd;

  --pms-ok-bg: #0d2f1c;
  --pms-warn-bg: #3a2a08;
  --pms-late-bg: #3d1417;
  --pms-critical-bg: #40101f;
  --pms-idle-bg: #1e2c3a;

  /* Lift the health colours so they stay legible on a dark surface */
  --pms-ok: #4ade80;
  --pms-warn: #fbbf24;
  --pms-late: #f87171;
  --pms-critical: #fb7185;
  --pms-surplus: #4ade80;
  --pms-deficit: #f87171;

  --bs-body-bg: var(--pms-bg);
  --bs-body-color: var(--pms-text);
  --bs-border-color: var(--pms-border);
}
