/* Temas byor-sec. O escuro e o padrao da marca; o claro e a variante.
   Trocar de tema = trocar a classe no <html>. Nenhuma classe de componente muda. */

/* ── ESCURO (padrao da marca) ── */
:root,
html.dark {
  --c-surface-container-highest: 32 38 50;
  --c-on-secondary: 0 93 74;
  --c-tertiary-dim: 0 205 235;
  --c-on-error: 73 0 6;
  --c-surface-container: 21 26 36;
  --c-primary-fixed-dim: 88 231 171;
  --c-surface-container-low: 15 19 28;
  --c-primary-fixed: 105 246 184;
  --c-on-tertiary: 0 83 96;
  --c-error-container: 159 5 25;
  --c-on-secondary-container: 222 255 242;
  --c-tertiary-fixed: 0 220 253;
  --c-on-secondary-fixed-variant: 0 104 83;
  --c-on-error-container: 255 168 163;
  --c-tertiary: 119 230 255;
  --c-inverse-surface: 249 249 255;
  --c-secondary-fixed: 90 252 210;
  --c-outline: 114 117 128;
  --c-error: 255 113 108;
  --c-primary-container: 6 183 127;
  --c-on-surface: 235 237 250;
  --c-on-tertiary-fixed-variant: 0 83 96;
  --c-on-primary-fixed: 0 69 45;
  --c-on-secondary-fixed: 0 73 57;
  --c-secondary-fixed-dim: 71 237 196;
  --c-tertiary-fixed-dim: 0 205 235;
  --c-surface-dim: 10 14 22;
  --c-surface-variant: 32 38 50;
  --c-surface: 10 14 22;
  --c-inverse-primary: 0 109 74;
  --c-on-primary-fixed-variant: 0 101 68;
  --c-error-dim: 215 56 59;
  --c-on-surface-variant: 167 171 182;
  --c-on-tertiary-container: 0 73 85;
  --c-on-primary-container: 0 41 25;
  --c-inverse-on-surface: 81 85 95;
  --c-on-primary: 0 90 60;
  --c-outline-variant: 68 72 82;
  --c-surface-container-high: 26 32 43;
  --c-primary-dim: 88 231 171;
  --c-background: 10 14 22;
  --c-secondary: 90 252 210;
  --c-tertiary-container: 0 220 253;
  --c-on-background: 235 237 250;
  --c-surface-container-lowest: 5 7 11;
  --c-surface-bright: 38 44 57;
  --c-secondary-dim: 71 237 196;
  --c-on-tertiary-fixed: 0 52 60;
  --c-surface-tint: 105 246 184;
  --c-primary: 105 246 184;
  --c-secondary-container: 0 107 86;

  --hero-scrim: linear-gradient(90deg, rgb(10 14 22) 0%, rgb(10 14 22 / .86) 40%, rgb(10 14 22 / .25) 78%);
  --lift-hover: #202632;
  --net-edge: rgba(105, 246, 184, .13);
  --net-node: #69f6b8;
  --net-node-dim: #77e6ff;
  --shot-ring: rgb(235 237 250 / .10);
  --shot-shadow: 0 25px 50px -12px rgb(0 0 0 / .6);
}

/* ── CLARO ── */
html.light {
  --c-surface-container-highest: 238 242 246;
  --c-on-secondary: 0 93 74;
  --c-tertiary-dim: 0 205 235;
  --c-on-error: 73 0 6;
  --c-surface-container: 241 244 248;
  --c-primary-fixed-dim: 5 148 101;
  --c-surface-container-low: 248 250 252;
  --c-primary-fixed: 3 106 72;
  --c-on-tertiary: 0 83 96;
  --c-error-container: 159 5 25;
  --c-on-secondary-container: 222 255 242;
  --c-tertiary-fixed: 0 220 253;
  --c-on-secondary-fixed-variant: 0 104 83;
  --c-on-error-container: 255 168 163;
  --c-tertiary: 10 111 136;
  --c-inverse-surface: 16 20 28;
  --c-secondary-fixed: 90 252 210;
  --c-outline: 139 144 155;
  --c-error: 192 38 38;
  --c-primary-container: 4 115 79;
  --c-on-surface: 16 20 28;
  --c-on-tertiary-fixed-variant: 0 83 96;
  --c-on-primary-fixed: 255 255 255;
  --c-on-secondary-fixed: 0 73 57;
  --c-secondary-fixed-dim: 71 237 196;
  --c-tertiary-fixed-dim: 0 205 235;
  --c-surface-dim: 242 245 248;
  --c-surface-variant: 232 236 241;
  --c-surface: 255 255 255;
  --c-inverse-primary: 0 109 74;
  --c-on-primary-fixed-variant: 0 101 68;
  --c-error-dim: 168 31 31;
  --c-on-surface-variant: 85 92 105;
  --c-on-tertiary-container: 0 73 85;
  --c-on-primary-container: 255 255 255;
  --c-inverse-on-surface: 235 237 250;
  --c-on-primary: 255 255 255;
  --c-outline-variant: 219 224 232;
  --c-surface-container-high: 255 255 255;
  --c-primary-dim: 4 115 79;
  --c-background: 255 255 255;
  --c-secondary: 4 122 99;
  --c-tertiary-container: 0 220 253;
  --c-on-background: 16 20 28;
  --c-surface-container-lowest: 226 232 240;
  --c-surface-bright: 228 233 239;
  --c-secondary-dim: 71 237 196;
  --c-on-tertiary-fixed: 0 52 60;
  --c-surface-tint: 3 106 72;
  --c-primary: 3 106 72;
  --c-secondary-container: 0 107 86;

  --hero-scrim: linear-gradient(90deg, rgb(255 255 255) 0%, rgb(255 255 255 / .86) 40%, rgb(255 255 255 / .25) 78%);
  --lift-hover: #eef2f6;
  --net-edge: rgba(4, 131, 90, .16);
  --net-node: #04835a;
  --net-node-dim: #0a6f88;
  --shot-ring: rgb(16 20 28 / .12);
  --shot-shadow: 0 25px 50px -12px rgb(16 20 28 / .18);
}