/*
 * GENERATED FILE — do not edit.
 * Source: theme/tokens.mjs. Regenerate with `npm run build`.
 *
 * Every value here comes from an Iceland Eclipse implementation we already
 * ship (chi-web backstage + event-theme, chi-app eclipse white-label), and
 * every pair the UI renders is contrast-checked by test/contrast.test.mjs.
 */

:root {
  --radius: 12px;
}

/* Totality — the default. Both the brand's `modeClass` and backstage's
   `defaultMode` are dark, so an unknown or unset theme resolves here. */
:root, [data-theme="totality"] {
  color-scheme: dark;
  --page: #06060A;
  --surface: #0F102E;
  --card: #111237;
  --card-raised: #16183B;
  --card-glass: #101234;
  --text: #EBEDF4;
  --text-muted: #AEB0BF;
  --text-faint: #898A9F;
  --border: #292A4B;
  --border-strong: #41415F;
  --action: #FF9A4D;
  --action-to: #EE7717;
  --action-ink: #1A0E05;
  --action-quiet: #2A1B10;
  --accent: #0DFCD3;
  --accent-ink: #0A0B29;
  --info: #8A93FF;
  --success: #34D399;
  --warning: #FBBF24;
  --danger: #FF8080;
  --disabled: #1C1E45;
  --disabled-ink: #9EA2C4;
}

/* Iceland Daylight */
[data-theme="daylight"] {
  color-scheme: light;
  --page: #F8F9FC;
  --surface: #EAECF6;
  --card: #FFFFFF;
  --card-raised: #F1F3FA;
  --card-glass: #FBFCFE;
  --text: #111229;
  --text-muted: #4B5170;
  --text-faint: #585E7E;
  --border: #E1E2E7;
  --border-strong: #C9CBD6;
  --action: #037C6C;
  --action-to: #02614F;
  --action-ink: #FFFFFF;
  --action-quiet: #D4EDE9;
  --brand: #049582;
  --accent: #025A4E;
  --accent-ink: #FFFFFF;
  --info: #1C2BFF;
  --success: #047857;
  --warning: #92400E;
  --danger: #B91C1C;
  --disabled: #E7E9F3;
  --disabled-ink: #585E7E;
}

/* Selected pack size. Generated from the catalogue — see renderTierStateCss(). */
.card:has(#t-food-5:checked) .pill[for='t-food-5'],
.card:has(#t-food-10:checked) .pill[for='t-food-10'],
.card:has(#t-food-15:checked) .pill[for='t-food-15'],
.card:has(#t-food-20:checked) .pill[for='t-food-20'],
.card:has(#t-beer-wine-10:checked) .pill[for='t-beer-wine-10'],
.card:has(#t-beer-wine-20:checked) .pill[for='t-beer-wine-20'],
.card:has(#t-beer-wine-50:checked) .pill[for='t-beer-wine-50'],
.card:has(#t-cocktail-5:checked) .pill[for='t-cocktail-5'],
.card:has(#t-cocktail-10:checked) .pill[for='t-cocktail-10'],
.card:has(#t-cocktail-20:checked) .pill[for='t-cocktail-20'],
.card:has(#t-elixir-5:checked) .pill[for='t-elixir-5'],
.card:has(#t-elixir-10:checked) .pill[for='t-elixir-10'],
.card:has(#t-elixir-20:checked) .pill[for='t-elixir-20'],
.card:has(#t-wellness-1:checked) .pill[for='t-wellness-1'],
.card:has(#t-wellness-2:checked) .pill[for='t-wellness-2'],
.card:has(#t-wellness-5:checked) .pill[for='t-wellness-5'],
.card:has(#t-sauna-1:checked) .pill[for='t-sauna-1'],
.card:has(#t-sauna-2:checked) .pill[for='t-sauna-2'],
.card:has(#t-sauna-5:checked) .pill[for='t-sauna-5'],
.card:has(#t-shower-5:checked) .pill[for='t-shower-5'],
.card:has(#t-poster:checked) .pill[for='t-poster'],
.card:has(#t-payment-test:checked) .pill[for='t-payment-test'] {
  background: linear-gradient(140deg, var(--action), var(--action-to));
  border-color: transparent;
  color: var(--action-ink);
}

/* The radio is visually hidden, so its focus ring has to show on the label. */
.card:has(#t-food-5:focus-visible) .pill[for='t-food-5'],
.card:has(#t-food-10:focus-visible) .pill[for='t-food-10'],
.card:has(#t-food-15:focus-visible) .pill[for='t-food-15'],
.card:has(#t-food-20:focus-visible) .pill[for='t-food-20'],
.card:has(#t-beer-wine-10:focus-visible) .pill[for='t-beer-wine-10'],
.card:has(#t-beer-wine-20:focus-visible) .pill[for='t-beer-wine-20'],
.card:has(#t-beer-wine-50:focus-visible) .pill[for='t-beer-wine-50'],
.card:has(#t-cocktail-5:focus-visible) .pill[for='t-cocktail-5'],
.card:has(#t-cocktail-10:focus-visible) .pill[for='t-cocktail-10'],
.card:has(#t-cocktail-20:focus-visible) .pill[for='t-cocktail-20'],
.card:has(#t-elixir-5:focus-visible) .pill[for='t-elixir-5'],
.card:has(#t-elixir-10:focus-visible) .pill[for='t-elixir-10'],
.card:has(#t-elixir-20:focus-visible) .pill[for='t-elixir-20'],
.card:has(#t-wellness-1:focus-visible) .pill[for='t-wellness-1'],
.card:has(#t-wellness-2:focus-visible) .pill[for='t-wellness-2'],
.card:has(#t-wellness-5:focus-visible) .pill[for='t-wellness-5'],
.card:has(#t-sauna-1:focus-visible) .pill[for='t-sauna-1'],
.card:has(#t-sauna-2:focus-visible) .pill[for='t-sauna-2'],
.card:has(#t-sauna-5:focus-visible) .pill[for='t-sauna-5'],
.card:has(#t-shower-5:focus-visible) .pill[for='t-shower-5'],
.card:has(#t-poster:focus-visible) .pill[for='t-poster'],
.card:has(#t-payment-test:focus-visible) .pill[for='t-payment-test'] {
  outline: 3px solid var(--action);
  outline-offset: 2px;
}
