/* Design tokens (docs/DESIGN.md). The only file with raw colour values. "--pn-" means "portal". */
:root {
  /* Brand */
  --pn-navy: #002D62;
  --pn-navy-deep: #00224A;
  --pn-red: #9B1E2D;
  --pn-charcoal: #373435;
  --pn-muted: #5A5F69;
  --pn-surface: #FFFFFF;
  --pn-canvas: #F4F5F8;
  --pn-border: #E3E6EC;
  --pn-on-navy-muted: #C9D3E3;
  --pn-scrim: rgba(0, 22, 48, .42);
  --pn-on-navy: #FFFFFF;
  --pn-grid-line: rgba(255, 255, 255, .05);

  /* UI */
  --pn-input-border: #C9CED8;
  --pn-input-border-hover: #8A909C;
  --pn-subtle: #FAFBFC;
  --pn-tint: #E9EEF6;
  --pn-success: #1E5E2B;
  --pn-error-bg: #FBEFF1;
  --pn-stalled-border: #E8C9CD;

  /* Status chips (config/statuses.php maps CRM values to these) */
  --pn-status-process-bg: #E3ECF8;   --pn-status-process-fg: #002D62;
  --pn-status-active-bg: #DDF0EC;    --pn-status-active-fg: #0E5C4F;
  --pn-status-design-bg: #EFEAF7;    --pn-status-design-fg: #4B2E83;
  --pn-status-req-bg: #FBEFD9;       --pn-status-req-fg: #7A4B00;
  --pn-status-eng-bg: #E8EAEE;       --pn-status-eng-fg: #373435;
  --pn-status-hold-bg: #ECEDEF;      --pn-status-hold-fg: #4A4F57;
  --pn-status-approved-bg: #DFF0E2;  --pn-status-approved-fg: #1E5E2B;
  --pn-status-other-bg: #ECEDEF;     --pn-status-other-fg: #4A4F57;

  /* Type */
  --pn-font: "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --pn-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --pn-fs-12: .75rem;
  --pn-fs-14: .875rem;
  --pn-fs-16: 1rem;
  --pn-fs-18: 1.125rem;
  --pn-fs-20: 1.25rem;
  --pn-fs-24: 1.5rem;
  --pn-fs-32: 2rem;
  --pn-fs-34: 2.125rem;
  --pn-fs-64: 4rem;

  /* Spacing (4 px base) */
  --pn-sp-1: 4px;
  --pn-sp-2: 8px;
  --pn-sp-3: 12px;
  --pn-sp-4: 16px;
  --pn-sp-6: 24px;
  --pn-sp-8: 32px;
  --pn-sp-10: 40px;
  --pn-sp-16: 64px;

  /* Shape */
  --pn-radius: 12px;
  --pn-radius-sm: 8px;
  --pn-shadow-menu: 0 12px 32px rgba(0, 22, 48, .18);

  /* Layout */
  --pn-max-width: 1360px;
  --pn-header-h: 72px;
  --pn-header-h-mobile: 60px;
  --pn-ribbon-h: 32px;
  --pn-target: 44px;
}
