/* AquaCrews Design System — token layer used by the officials home dashboard (views/site/main.php).
   Colors, typography, spacing, and radii tokens from the "Officials Home Redesign" design handoff. */
:root {
  /* ---- Brand / primary ---- */
  --ac-primary:          #0d6efd;
  --ac-primary-hover:    #0b5ed7;
  --ac-primary-strong:   #084298;
  --ac-primary-tint:     #eef5ff;
  --ac-primary-tint-hover: #f4f8ff;
  --ac-primary-border:   #9ec5fe;

  /* ---- Surfaces ---- */
  --ac-page:             #f1f3f5;
  --ac-surface:          #ffffff;
  --ac-surface-alt:      #f8f9fa;
  --ac-surface-zebra:    #fbfcfd;

  /* ---- Text ---- */
  --ac-text:             #212529;
  --ac-text-strong:      #343a40;
  --ac-text-secondary:   #495057;
  --ac-text-muted:       #6c757d;
  --ac-text-label:       #868e96;
  --ac-text-subtle:      #adb5bd;
  --ac-text-faint:       #c0c6cd;

  /* ---- Borders / hairlines ---- */
  --ac-border:           #dee2e6;
  --ac-border-input:     #ced4da;
  --ac-hairline:         #e9ecef;
  --ac-hairline-soft:    #f1f3f5;
  --ac-border-drag:      #e3e6ea;

  /* ---- Semantic ---- */
  --ac-success:          #198754;
  --ac-danger:           #dc3545;
  --ac-warning:          #ffc107;

  /* ---- Chart ramp (LSC Statistics) ---- */
  --ac-chart-2: #5b8def;
  --ac-chart-3: #3d5fa8;

  /* ---- Status pills (bg / fg pairs) ---- */
  --ac-status-confirmed-bg: #d1e7dd;  --ac-status-confirmed-fg: #0f5132;
  --ac-status-waitlist-bg:  #fff3cd;  --ac-status-waitlist-fg:  #664d03;
  --ac-status-declined-bg:  #f8d7da;  --ac-status-declined-fg:  #842029;
  --ac-status-new-bg:       #cfe2ff;  --ac-status-new-fg:       #084298;
  --ac-status-none-bg:      #f8f9fa;  --ac-status-none-fg:      #adb5bd;

  /* ---- Alert banners ---- */
  --ac-alert-error-bg:      #fde8e8;  --ac-alert-error-border:   #f1aeb5;
  --ac-alert-warning-bg:    #fff8e1;  --ac-alert-warning-border: #ffe49c;

  /* ---- Track / meter ---- */
  --ac-track:            #eef0f2;

  /* ---- Typography ---- */
  --ac-font-sans: system-ui, Arial, sans-serif;
  --ac-fw-medium:   500;
  --ac-fw-semibold: 600;
  --ac-fw-bold:     700;

  /* ---- Radius & elevation ---- */
  --ac-radius-card:  10px;
  --ac-radius-md:    8px;
  --ac-radius-btn:   7px;
  --ac-radius-pill:  6px;
  --ac-radius-sm:    5px;
  --ac-radius-chip:  16px;
  --ac-radius-round: 20px;
  --ac-radius-full:  50%;

  --ac-shadow-card:     0 1px 3px rgba(0,0,0,.04);
  --ac-shadow-dropdown: 0 6px 20px rgba(0,0,0,.14);
  --ac-ring-staged: 0 0 0 2px #0d6efd;

  /* ---- Typography sizes (px) / labels / line-heights ---- */
  --ac-fs-stat:   28px;
  --ac-fs-title:  17px;
  --ac-fs-h:      16px;
  --ac-fs-body:   14px;
  --ac-fs-sm:     13px;
  --ac-fs-xs:     12px;
  --ac-fs-label:  11px;
  --ac-fs-micro:  10px;
  --ac-label-spacing: 0.04em;
  --ac-label-transform: uppercase;
  --ac-lh-tight: 1.1;
  --ac-lh-base:  1.5;

  /* ---- Spacing scale / composite padding ---- */
  --ac-space-1:  2px;
  --ac-space-2:  4px;
  --ac-space-3:  6px;
  --ac-space-4:  8px;
  --ac-space-5:  10px;
  --ac-space-6:  12px;
  --ac-space-7:  14px;
  --ac-space-8:  16px;
  --ac-space-9:  18px;
  --ac-space-10: 20px;
  --ac-space-11: 22px;
  --ac-space-12: 24px;
  --ac-card-pad:      20px 22px;
  --ac-card-pad-sm:   16px 18px;
  --ac-btn-pad:       8px 14px;
  --ac-input-pad:     9px 11px;
  --ac-content-max:   1200px;
  --ac-name-col:      260px;
}