/* ============================================================
   WeVote Kit — Design Tokens
   The single source of truth for color, ink, accent, shadow.
   Light theme on :root, dark theme overrides on .dark.
   NEVER hard-code hex/rgb in a screen — reference these vars.
   ============================================================ */

:root {
  /* Match native controls (autofill, scrollbars) to the active theme. */
  color-scheme: light;
  /* surfaces — Pure Snow (cool neutral) */
  --paper:        #FCFCFD;
  --surface:      #FFFFFF;
  --sunken:       #F3F4F6;
  --hairline:     #EAEBEE;
  --hairline-strong: #DBDCE0;
  /* ink */
  --ink:          #0A0B0F;
  --muted:        #5C584F;
  --faint:        #7A766C;
  /* accent — civic emerald */
  --accent:       #047857;
  --accent-hover: #036249;
  --accent-soft:  #E7F3EC;
  --accent-ink:   #065F46;
  --ring:         rgba(4,120,87,0.45);
  /* secondary accent — companion to emerald, used only on the rail's
     legislative-code chips ("AB 250"). Orange in light, purple in dark. */
  --accent-2:      #E2654A;
  --accent-2-soft: color-mix(in srgb, #E2654A 14%, #fff);
  --accent-2-ink:  color-mix(in srgb, #E2654A 82%, #000);
  /* shadows */
  --shadow-soft:  0 1px 2px rgba(10,11,15,.05), 0 1px 3px rgba(10,11,15,.04);
  --shadow-card:  0 1px 2px rgba(10,11,15,.04), 0 4px 14px rgba(10,11,15,.06);
  --shadow-lift:  0 2px 4px rgba(10,11,15,.05), 0 14px 34px rgba(10,11,15,.10);
  --shadow-pop:   0 8px 28px rgba(10,11,15,.14), 0 2px 6px rgba(10,11,15,.08);
  /* status — soft tinted */
  --st-pending-bg:#FBF1D9;  --st-pending-fg:#876004;  --st-pending-dot:#C68A12;
  --st-open-bg:   #E7EFFB;  --st-open-fg:   #1F4FA0;  --st-open-dot:   #2F6FD6;
  --st-res-bg:    #E2F2E9;  --st-res-fg:    #0E6B43;  --st-res-dot:    #149056;
  --st-unres-bg:  #FAE7E5;  --st-unres-fg:  #AE3127;  --st-unres-dot:  #D14034;
  --st-arch-bg:   #EEEAE0;  --st-arch-fg:   #5C584F;  --st-arch-dot:   #908A7C;
  /* party — candidate identity (blue / red / indigo / neutral) */
  --party-dem:    #2F6FD6;  --party-dem-soft:#E7EFFB;
  --party-rep:    #C9352B;  --party-rep-soft:#FAE7E5;
  --party-ind:    #7A5AF0;  --party-ind-soft:#EDE9FC;
  --party-np:     #6F6A5E;  --party-np-soft: #EEEAE0;
  /* relevance marker — amber: "on your ballot" + winner */
  --mark:         #C68A12;  --mark-bg:       #FBF1D9;  --mark-fg:       #7A5604;
}

.dark {
  color-scheme: dark;
  /* Obsidian — default dark surfaces: deep near-black ground, richer lifted cards */
  --paper:        #070809;
  --surface:      #141619;
  --sunken:       #0C0D10;
  --hairline:     #22242A;
  --hairline-strong: #2E3138;
  --ink:          #F4F2EC;
  --muted:        #9A968E;
  --faint:        #74716A;
  --accent:       #0E9F6E;
  --accent-hover: #17B581;
  --accent-soft:  rgba(16,160,110,.16);
  --accent-ink:   #6EE7B7;
  --ring:         rgba(16,160,110,.48);
  --accent-2:      color-mix(in srgb, #5E5BE6 82%, #fff);
  --accent-2-soft: color-mix(in srgb, #5E5BE6 26%, transparent);
  --accent-2-ink:  color-mix(in srgb, #5E5BE6 74%, #fff);
  --shadow-soft:  0 1px 2px rgba(0,0,0,.40);
  --shadow-card:  0 1px 2px rgba(0,0,0,.40), 0 6px 18px rgba(0,0,0,.36);
  --shadow-lift:  0 2px 6px rgba(0,0,0,.45), 0 18px 40px rgba(0,0,0,.50);
  --shadow-pop:   0 10px 34px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.45);
  --st-pending-bg:rgba(214,156,40,.15); --st-pending-fg:#F0C173; --st-pending-dot:#E4AE55;
  --st-open-bg:   rgba(96,150,240,.16); --st-open-fg:   #9BBCF5; --st-open-dot:   #6F9BF0;
  --st-res-bg:    rgba(52,211,153,.15); --st-res-fg:    #6EE7B7; --st-res-dot:    #34D399;
  --st-unres-bg:  rgba(240,110,100,.17);--st-unres-fg:  #F2A39B; --st-unres-dot:  #ED7A70;
  --st-arch-bg:   rgba(154,150,142,.16);--st-arch-fg:   #C2BEB4; --st-arch-dot:   #9A968E;
  --party-dem:    #6F9BF0;  --party-dem-soft:rgba(96,150,240,.16);
  --party-rep:    #ED7A70;  --party-rep-soft:rgba(240,110,100,.17);
  --party-ind:    #A48BF7;  --party-ind-soft:rgba(122,90,240,.20);
  --party-np:     #B4AEA2;  --party-np-soft: rgba(154,150,142,.16);
  --mark:         #E4AE55;  --mark-bg:       rgba(214,156,40,.15); --mark-fg:       #F0C173;
}