/* PrecisionAg Dash design tokens — the ONLY place colors are defined.
   2026-10-23 PAA brand scheme (/workspace/paa-strategy/brand/PAA-STYLE.md, Daniel): navy #191970 header band + theme-color,
   logo gray #6E6F73, black #151515 text, Afimilk-style blue accent #009CDA (stripe/highlights), buttons #007DB3 (white text),
   tint #E3F4FB. Navy is chrome only now; interactive accent moved from navy to blue. Status colors unchanged.
   Earlier sources (fetched 2026-10-17 from https://precisionagautomation.com, GoDaddy builder inline CSS; copies in ../../brand/):
     #191970  PAA navy (was the accent; now header band/theme-color only): `.x .c1-31{color:#191970}` on the "Precision Ag Automation" LogoHeading (Montserrat) —
              confirmed by Daniel as the letterhead blue (real, not a placeholder)
     #151515 / #1B1B1B / #161616  near-blacks (rgb(21,21,21), rgb(27,27,27), rgb(22,22,22))
     #FFFFFF, #F6F6F6, #FAFAFA  white / light grays     #5E5E5E, #474747  mid grays
     (Site teal #388C8C / theme-color #54A8A8 is a builder default and is intentionally NOT used.)
   Values marked "derived" are not on the site; they are tints/shades chosen for WCAG AA contrast.
   ISA-101 style: calm grays for normal data; saturated color is reserved for abnormal/alarm states. */
:root {
  color-scheme: light dark;
  /* brand */
  --brand-black: #151515;
  --brand-gray: #6E6F73;          /* logo gray */
  --brand-accent: #009CDA;          /* Afimilk blue: 4px header stripe, highlights */
  --brand-band: #191970;            /* navy header band, both modes (= theme-color) */
  --on-band: #FFFFFF;
  --on-band-muted: #D6D7D9;         /* derived light tint of logo gray (embroidery gray), 10.3:1 on navy */

  /* surfaces & text (light) */
  --bg: #F6F6F6;
  --surface: #FFFFFF;
  --surface-2: #FAFAFA;
  --surface-3: #ECECEC;             /* derived: pills, disabled fields */
  --text: #151515;
  --text-muted: #5E5E5E;
  --border: #D6D6D6;                /* derived: decorative hairlines */
  --border-strong: #767676;         /* derived: form controls, 4.5:1 on white */
  --accent: #007DB3;                /* interactive: buttons (white text 4.58:1), selected tabs, switches */
  --link: #0072A3;                  /* derived: text links, 4.9:1 on bg (#009CDA/#007DB3 are < 4.5:1 as small text on #F6F6F6) */
  --on-accent: #FFFFFF;
  --accent-soft: #E3F4FB;           /* brand tint: selected chip background */
  --focus: #007DB3;                 /* focus ring, >=3:1 on bg and surface (#009CDA is 2.9:1 on bg) */
  --shadow: rgba(0, 0, 0, .08);

  /* alarm / state colors — only for abnormal conditions */
  --critical: #B3261E;  --on-critical: #FFFFFF;
  --critical-soft: #FCE8E6;  --critical-text: #8C1D18;
  --warning: #F2B300;   --on-warning: #151515;
  --warning-soft: #FFF1CC;   --warning-text: #6E4700;
  --ok: #2E6B3F;                    /* muted; used only for the "no active alarms" check mark */
  --ok-soft: #E3F1E7;  --ok-text: #1E4D2B;   /* watchdog "data resumed" notice + healthy farm tile mark */
  --info: #007DB3;
  --stale: #2F3A45;     --on-stale: #FFFFFF;   /* slate: lost communication banner */
  --stale-stripe: #F2B300;
  --stale-value: #767676;           /* values shown while data is stale */

  /* chart series: Okabe–Ito-based colorblind-safe set (no red/amber, which mean alarm), plus dash patterns */
  --chart-1: #0072B2;
  --chart-2: #A8457E;
  --chart-3: #00785A;
  --chart-4: #474747;
  --chart-5: #6A4FA3;
  --chart-6: #7A5A2F;
  --chart-grid: #E4E4E4;
  --chart-axis: #5E5E5E;
  --spark: #007DB3;                 /* tile sparklines: brand blue, never a status color */
  --live: #2E6B3F;                  /* header "Live" dot (status) */

  /* 2026-10-28 type + spacing scale (4-pt grid). Components use these instead of ad-hoc sizes. */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;
  --fs-xs: 12px; --fs-sm: 13px; --fs-md: 15px; --fs-lg: 18px; --fs-xl: 24px; --fs-num: 30px;
  --radius: 14px; --radius-sm: 10px;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0C1222;                  /* 2026-10-28: navy-tinted dark surfaces (brand navy #191970 at low tone) */
    --surface: #151D30;
    --surface-2: #111829;
    --surface-3: #222C44;
    --text: #F2F4F8;
    --text-muted: #A9B1C2;          /* 7.4:1 on surface */
    --border: #2A3550;
    --border-strong: #8A8A8A;
    --accent: #40B5E3;              /* derived: #009CDA + 25% white, 6.9:1 on surface, 5.8:1 on surface-3 */
    --link: #40B5E3;
    --on-accent: #151515;
    --accent-soft: #12304A;         /* derived: #009CDA 22% on navy-dark bg */
    --focus: #7FD3F5;
    --shadow: rgba(0, 0, 0, .5);
    --on-band-muted: #D6D7D9;

    --critical: #B3261E;  --on-critical: #FFFFFF;
    --critical-soft: #3B1412;  --critical-text: #FFB4AB;
    --warning: #F2B300;   --on-warning: #151515;
    --warning-soft: #2E2410;   --warning-text: #FFD27A;
    --ok: #7FD49B;
    --ok-soft: #13301D;  --ok-text: #A6E6BA;
    --info: #40B5E3;
    --stale: #3A4652;     --on-stale: #FFFFFF;
    --stale-value: #8A8A8A;

    --chart-1: #56B4E9;
    --chart-2: #E08DC0;
    --chart-3: #3CC4A0;
    --chart-4: #C8C8C8;
    --chart-5: #B7A3F0;
    --chart-6: #CDB08A;
    --chart-grid: #263049;
    --spark: #56B4E9;
    --live: #7FD49B;
    --chart-axis: #B0B0B0;
  }
}