/*
 * Beam UI tokens — Stage 1.U S2.
 *
 * This file extracts the platform's existing styling into additive custom
 * properties, organized with EA3's token taxonomy. It is variables-only:
 * no selectors here render components or override existing pages.
 *
 * Styleguide-owned names are not redefined here. They remain owned by
 * resources/styleguide.css and the compiled Tailwind output:
 * --coredark-900, --corelight-100, --corelight-900, --coredark-500,
 * --coredark-100, --corelight-300, --corelight-500, --coredark-700,
 * --headings-large-h1-*, --headings-large-h2-*, --headings-large-h3-*,
 * --headings-large-h4-*, --headings-large-h5-*, --body-large-*,
 * --body-small-*, --load, --grid-supply-primary, --grid-supply-secondary,
 * --grid-est, --gas-supply, --gas-supply-est, --solar-consumed,
 * --solar-exported, --solar-consumed-est, --solar-exported-est,
 * --battery-discharged, --battery-charged, --battery-discharged-est,
 * --battery-charged-est, --ev, --ev-est, --generator, --generator-est,
 * --electrification, --electricfication-est, --energygrid-100.
 *
 * Font/style-drift inventory (updated 2026-07-27, CRM 56630):
 * - resources/styleguide.css now declares TWO families and only two:
 *   Fieldwork Geo for --headings-large-*, Arial for --body-*. Body was
 *   Fieldwork Geo until 2026-07-27; the style guide now matches extra.css's
 *   `body { font-family: 'Arial' }`.
 * - resources/public/css/new/site-setup.css:48-60 still has Chivo and Work Sans
 *   modal locals — a third and fourth family, and a live divergence.
 * - ~40 literal `font-family: 'Arial'` declarations remain in extra.css and
 *   feature stylesheets. These now name the RIGHT family but are still
 *   unmaintainable literals — they should reference the body token.
 * Where sources disagree, styleguide.css is canonical; the behavioural
 * contract is specs/presentation.allium (TypographyPresentation). This file
 * does not add font-face rules or redefine font-family tokens.
 *
 * SF8 no-platform-precedent index, grouped by component. Later chunks fill
 * placeholders and render each entry in /app2/admin/ui-gallery for Zac's
 * ratification:
 * - Workspace drawer: --drawer-w, --drawer-collapse-handle-w.
 * - Banners: --status-stale-*, --status-changed-*, --status-error-*.
 * - Heatmaps: --heatmap-low, --heatmap-mid, --heatmap-high.
 * - Tooltip: --tooltip-bg, --tooltip-text.
 * - Z-index: --z-dropdown, --z-sticky, --z-modal, --z-toast.
 * - Globals iframe/modal: --globals-w, --globals-modal-w.
 * - ag-Grid theme: --ag-beam-*. CONSUMED as of WP-06 by sites-grid.css and
 *   fst/energy-systems-grid.css (the six values both themes already agreed on).
 * - Charts: --chart-grid-line, --chart-axis, --chart-tooltip-*.
 * - Maps: --map-polygon-selected, --map-polygon-hover.
 * - File upload: --file-upload-progress, --file-upload-error-*.
 * - Tables: --table-status-*, --table-progress-*.
 */

:root {
  /* Surfaces and text. Values observed in styleguide.css and site-setup.css. */
  --surface-page: var(--corelight-100); /* styleguide.css --corelight-100 */
  --surface-canvas: #f7f8fb; /* site-setup.css .load-workspace background */
  --surface-panel: var(--corelight-100); /* styleguide.css --corelight-100 */
  --surface-muted: var(--corelight-300); /* styleguide.css --corelight-300 */
  --surface-divider: var(--corelight-500); /* styleguide.css --corelight-500 */
  --text-primary: var(--coredark-700); /* styleguide.css --coredark-700 */
  --text-secondary: #677489; /* site-setup.css modal descriptions */
  --text-inverse: var(--corelight-100); /* styleguide.css --corelight-100 */
  --text-link: #2a578d; /* site-setup.css modal active tab */
  --border-subtle: var(--corelight-500); /* styleguide.css --corelight-500 */
  --border-default: var(--corelight-900); /* styleguide.css --corelight-900 */
  --border-strong: #d8dee8; /* site-setup.css modal/sidebar dividers */

  /* Spacing. Values extracted from current Tailwind/page spacing in use. */
  --space-1: 4px; /* Tailwind gap-1 / .btn gap .25rem in output.css */
  --space-2: 8px; /* Tailwind gap-2 and px-2 family */
  --space-3: 12px; /* site-setup.css modal load row gap */
  --space-4: 16px; /* site-setup.css modal header padding */
  --space-5: 20px; /* full-systems-table.html px-5 button padding */
  --space-6: 24px; /* dashboard.html main px-6 */
  --space-7: 28px; /* site-setup.css modal sidebar top padding */
  --space-8: 32px; /* existing Tailwind spacing scale in output.css */

  /* Radii and controls. Values observed in site-setup.css and Tailwind markup. */
  --radius-xs: 2px; /* site-setup.css load-canvas legend swatch */
  --radius-sm: 4px; /* output.css .btn-* border-radius .25rem */
  --radius-md: 6px; /* site-setup.css segmented control and modal header */
  --radius-lg: 8px; /* site-setup.css map marker override */
  --radius-xl: 12px; /* platform idiom placeholder; no shared precedent */
  --radius-button: var(--radius-sm); /* output.css .btn-* */
  --radius-input: var(--radius-sm); /* full-systems-table.html rounded inputs/buttons */
  --radius-modal: var(--radius-md); /* site-setup.css modal header */
  --radius-tooltip: var(--radius-sm); /* new — no platform precedent */
  --control-height: 40px; /* output.css .btn-* height 2.5rem; FST buttons */
  --control-height-sm: 36px; /* site-setup.css segmented button min-height */
  --control-pad-x: 20px; /* output.css .btn-* px 1.25rem */
  --control-pad-y: 4px; /* output.css .btn-* py .25rem */
  --dropdown-menu-max-height: 320px; /* established energy-systems dropdown height */

  /* Semantic states. Existing warning chip extracted; other states are placeholders. */
  --status-warning-bg: #fff7d6; /* site-setup.css .modal-dirty-chip background */
  --status-warning-border: #d8a200; /* site-setup.css .modal-dirty-chip border */
  --status-warning-text: #6f5200; /* site-setup.css .modal-dirty-chip color */
  --status-error-bg: #fff1f1; /* new — no platform precedent */
  --status-error-border: var(--alert-700); /* = #c03838 */
  --status-error-text: var(--alert-900); /* = #912b2b */
  --status-success-bg: #eefaf6; /* new — no platform precedent */
  --status-success-border: var(--battery-charged); /* styleguide.css */
  --status-success-text: var(--battery-charged); /* styleguide.css */
  --status-stale-bg: #f7f8fb; /* site-setup.css .load-workspace background */
  --status-stale-border: var(--corelight-900); /* styleguide.css */
  --status-stale-text: var(--coredark-100); /* styleguide.css */
  --status-changed-bg: var(--status-warning-bg); /* current dirty-chip idiom */
  --status-changed-border: var(--status-warning-border); /* current dirty-chip idiom */
  --status-changed-text: var(--status-warning-text); /* current dirty-chip idiom */

  /* Layout. Drawer widths are new shared-system decisions in platform idiom. */
  --drawer-w: 320px; /* new — no platform precedent; between current 280px sidebar and EA3 drawer */
  --drawer-collapse-handle-w: 32px; /* new — no platform precedent */
  --globals-w: min(960px, 92vw); /* new — no platform precedent */
  --globals-modal-w: min(1180px, 96vw); /* new — no platform precedent */

  /* Chart aliases. Existing colors alias styleguide energy vars first. */
  --c-load: var(--load); /* styleguide.css */
  --c-grid: var(--grid-supply-primary); /* styleguide.css */
  --c-grid-secondary: var(--grid-supply-secondary); /* styleguide.css */
  --c-gas: var(--gas-supply); /* styleguide.css */
  --c-solar: var(--solar-consumed); /* styleguide.css */
  --c-solar-export: var(--solar-exported); /* styleguide.css */
  --c-battery-charge: var(--battery-charged); /* styleguide.css */
  --c-battery-discharge: var(--battery-discharged); /* styleguide.css */
  --c-ev: var(--ev); /* styleguide.css */
  --c-generator: var(--generator); /* styleguide.css */
  --c-electrification: var(--electrification); /* styleguide.css */
  --chart-grid-line: var(--corelight-500); /* dashboard.html chart grid #E8EAED */
  --chart-axis: var(--coredark-100); /* styleguide.css muted dark */
  --chart-tooltip-bg: var(--coredark-500); /* styleguide.css */
  --chart-tooltip-text: var(--corelight-100); /* styleguide.css */

  /* Component placeholders with no platform precedent yet. */
  --tooltip-bg: var(--coredark-500); /* new — no platform precedent */
  --tooltip-text: var(--corelight-100); /* new — no platform precedent */
  --heatmap-low: var(--corelight-300); /* new — no platform precedent */
  --heatmap-mid: var(--solar-consumed); /* new — no platform precedent */
  --heatmap-high: var(--solar-exported); /* new — no platform precedent */
  --map-polygon-selected: rgba(42, 87, 141, 0.28); /* new — no platform precedent */
  --map-polygon-hover: rgba(42, 87, 141, 0.16); /* new — no platform precedent */
  --file-upload-progress: var(--energygrid-100); /* new — no platform precedent */
  --file-upload-error-bg: var(--status-error-bg); /* new — no platform precedent */
  --file-upload-error-border: var(--status-error-border); /* new — no platform precedent */
  --table-status-bg: var(--surface-muted); /* new — no platform precedent */
  --table-status-text: var(--text-primary); /* new — no platform precedent */
  --table-progress-fill: var(--energygrid-100); /* new — no platform precedent */
  --table-header-bg: var(--corelight-100); /* shared server/ag-grid header treatment */
  --table-header-fg: var(--coredark-300); /* shared server/ag-grid header treatment */
  --table-header-font-size: var(--body-small-regular-font-size); /* 12px */
  --table-header-font-weight: 600;
  --ag-beam-background: var(--surface-panel); /* new — no platform precedent */
  --ag-beam-foreground: var(--text-primary); /* new — no platform precedent */
  --ag-beam-border: var(--border-strong); /* new — no platform precedent */
  /* Shared ag-grid theme (WP-06). The sites list and Compare Systems each carried their own
     ad-hoc `--ag-*` block; comparing them showed they ALREADY AGREE on these six values and were
     simply re-declaring them (with `#35475C` hardcoded in both, and the header background spelled
     `#fff` in one and `#FFFFFF` in the other). Extracted here so there is one place to change,
     with the tokenisable value tokenised. Values the two grids genuinely disagree on — row
     hover, selected-row tint, row borders, row height — stay local to each grid, because those
     are visual decisions owned by WP-07 and WP-09 respectively, not shared theme. */
  --ag-beam-header-height: 40px; /* sites-grid.css + energy-systems-grid.css agreed */
  --ag-beam-header-bg: #fff; /* both, spelled #fff / #FFFFFF */
  --ag-beam-header-fg: var(--coredark-300); /* both hardcoded #35475C */
  --ag-beam-header-hover-bg: transparent; /* both */
  --ag-beam-font-size: 12px; /* both */
  --ag-beam-grid-borders: none; /* both */
  /* Modal scrim (WP-04, I-08). Value taken from the shipped precedent: the dashboard's
     pv-table and site-total modals use Tailwind `bg-black/40` (dashboard.html:424).
     Added as a token because a scrim is a recurring need and the house rule prefers a token
     over scattering the literal. Before this, `.beam-modal` used `--map-polygon-hover`
     (rgba(42,87,141,.16)) as its backdrop — a 16% hover tint, which is why modals read as
     floating over a fully lit, still-interactive page (S-18). */
  --scrim: rgba(0, 0, 0, 0.4);
  --z-dropdown: 30; /* new — no platform precedent */
  --z-sticky: 40; /* new — no platform precedent */
  --z-modal: 70; /* new — no platform precedent */
  --z-toast: 80; /* admin-globals.css .admin-globals-toast */
}