/* ===================================================================
   common/_tokens.css — the single source for values that are the same
   across every surface (admin dashboards + customer/tenant mobile app).

   Values here are pinned to docs/brand-palette.md (StateShield COLOR_001,
   the production-authority brand sheet) — don't hand-edit a hex without
   checking that sheet first. "-deep" variants aren't in the sheet (it
   defines no hover/pressed states); they're a uniform 80% darken of the
   base color, a shade rather than a new hue.

   Each family's own _layout.css still owns its own design-language
   tokens (radius scale, display font, sidebar sizing) — those are
   deliberately different between the admin dashboards and the customer
   mobile app, not duplication.
   Load this file first, before any family-specific stylesheet.
   =================================================================== */

:root {
  /* Primary brand */
  --teal:      #2CB1C1;
  --teal-deep: #238E9A;
  --teal-pale: #E6F7F8;

  /* Secondary brand — Secondary Teal isn't consumed by any component yet,
     kept available since the brand sheet defines it as part of the closed
     palette. Secondary Blue doubles as the sheet's "Information" accent. */
  --secondary-blue: #0E6E9D;
  --secondary-blue-deep: #0B587D;
  --secondary-teal: #61E5F0;

  /* Neutrals identical across every surface today */
  --ink:           #0E1F2D;
  --white:         #FFFFFF;
  --border:        #C9D1D8;
  --text-tertiary: #A8B0B7;
  --font-body:     "Inter", system-ui, -apple-system, sans-serif;

  /* Semantic state colors */
  --danger:       #EF4444;
  --danger-deep:  #BF3636;
  --success:      #2CB34A;
  --warning:      #FFB020;
  --warning-deep: #CC8D1A;
}
