/* Digger's "Warm Earth" theme: the --pico-* token overrides that give the vendored classless Pico build its
   identity. Load order is pico -> theme -> site: framework defaults, then these tokens, then the component
   rules in site.css that consume them. This file sets tokens and fonts only; it styles no elements. */

/* Pico's palette lives in mode blocks selected by :host(:not([data-theme=dark])),:root:not([data-theme=dark]),
   [data-theme=light] and friends — specificity 0,2,0. Overrides written on a bare :root are 0,1,0 and silently
   lose the cascade, so the blocks below mirror Pico's selector text verbatim. Only mode-independent tokens
   (font stack, radius) belong on the base :host,:root block, because that is where Pico itself declares them.

   Verified against vendor/pico.classless.min.css v2.1.1: every colour token here is declared *only* in Pico's
   three mode blocks, never in its base block, so duplicating colours onto :host,:root would be dead weight
   that Pico's own 0,2,0 light block outranks anyway. */

@font-face {
  font-display: swap;
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400;
  src: url("/static/vendor/fonts/IBMPlexSans-Regular-Latin1.woff2") format("woff2");
}

@font-face {
  font-display: swap;
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 500;
  src: url("/static/vendor/fonts/IBMPlexSans-Medium-Latin1.woff2") format("woff2");
}

/* 600 is the heaviest weight vendored, so it is the bold weight everywhere (see site.css `strong`). */
@font-face {
  font-display: swap;
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 600;
  src: url("/static/vendor/fonts/IBMPlexSans-SemiBold-Latin1.woff2") format("woff2");
}

/* Mode-independent tokens, on the same selector Pico declares them with (0,1,0) so load order decides.
   --pico-font-family resolves to --pico-font-family-sans-serif, so overriding the sans-serif stack is enough. */
:host,
:root {
  --pico-border-radius: 0.375rem;
  --pico-font-family-sans-serif: "IBM Plex Sans", system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif,
    var(--pico-font-family-emoji);
}

/* Light mode: stone and sand paper. Terracotta accent, sage green reserved for the tracking signal. */
:host(:not([data-theme=dark])),
:root:not([data-theme=dark]),
[data-theme=light] {
  --pico-background-color: #FAF7F2;
  --pico-card-background-color: #FFFFFF;
  --pico-card-border-color: #E7E0D4;
  --pico-card-box-shadow: 0 1px 2px rgba(61, 51, 35, 0.05);
  --pico-card-sectioning-background-color: #FBF9F5;
  --pico-color: #3D3833;
  --pico-form-element-active-border-color: #9C4A24;
  --pico-form-element-background-color: #FFFFFF;
  --pico-form-element-border-color: #D9D0C1;
  --pico-form-element-focus-color: rgba(156, 74, 36, 0.3);
  --pico-form-element-placeholder-color: #9A9184;
  --pico-h1-color: #292420;
  --pico-h2-color: #292420;
  --pico-h3-color: #292420;
  --pico-h4-color: #3D3833;
  --pico-h5-color: #3D3833;
  --pico-h6-color: #3D3833;
  --pico-ins-color: #3E7A4E;
  --pico-muted-border-color: #EAE3D7;
  --pico-muted-color: #797063;
  --pico-primary: #9C4A24;
  --pico-primary-background: #9C4A24;
  --pico-primary-border: #9C4A24;
  --pico-primary-focus: rgba(156, 74, 36, 0.3);
  --pico-primary-hover: #7E3B1D;
  --pico-primary-hover-background: #7E3B1D;
  --pico-primary-hover-border: #7E3B1D;
  --pico-primary-inverse: #FFFFFF;
  --pico-primary-underline: rgba(156, 74, 36, 0.35);
  --pico-text-selection-color: rgba(156, 74, 36, 0.15);
}

/* Auto dark mode: warm charcoal. Mirrors Pico's own media query and selector text exactly.
   --pico-card-border-color needs an explicit hex: Pico's dark default resolves it to the card background,
   which would erase the card hairline. --pico-card-box-shadow goes to none — the border carries the edge.
   --pico-primary-background stays the dark terracotta so its white label text keeps contrast; the lighter
   --pico-primary is for accent *text* on the dark page background, where the reverse constraint applies. */
@media only screen and (prefers-color-scheme: dark) {
  :host(:not([data-theme])),
  :root:not([data-theme]) {
    --pico-background-color: #1E1B18;
    --pico-card-background-color: #26221E;
    --pico-card-border-color: #332E27;
    --pico-card-box-shadow: none;
    --pico-card-sectioning-background-color: #221E1B;
    --pico-color: #D8D2C9;
    --pico-form-element-active-border-color: #E29A6C;
    --pico-form-element-background-color: #26221E;
    --pico-form-element-border-color: #423B31;
    --pico-form-element-focus-color: rgba(226, 154, 108, 0.35);
    --pico-form-element-placeholder-color: #797063;
    --pico-h1-color: #EFEAE2;
    --pico-h2-color: #EFEAE2;
    --pico-h3-color: #EFEAE2;
    --pico-h4-color: #D8D2C9;
    --pico-h5-color: #D8D2C9;
    --pico-h6-color: #D8D2C9;
    --pico-ins-color: #6FAE7F;
    --pico-muted-border-color: #332E27;
    --pico-muted-color: #9A9184;
    --pico-primary: #E29A6C;
    --pico-primary-background: #9C4A24;
    --pico-primary-border: #9C4A24;
    --pico-primary-focus: rgba(226, 154, 108, 0.35);
    --pico-primary-hover: #EDB08A;
    --pico-primary-hover-background: #B85C33;
    --pico-primary-hover-border: #B85C33;
    --pico-primary-inverse: #FFFFFF;
    --pico-primary-underline: rgba(226, 154, 108, 0.4);
    --pico-text-selection-color: rgba(226, 154, 108, 0.19);
  }
}

/* Explicit dark opt-in. Digger exposes no theme toggle; this block exists only because Pico ships the
   [data-theme=dark] selector, and a theme that overrode two of Pico's three mode blocks would leave the
   third on stock Pico blue. Values are identical to the auto-dark block above. */
[data-theme=dark] {
  --pico-background-color: #1E1B18;
  --pico-card-background-color: #26221E;
  --pico-card-border-color: #332E27;
  --pico-card-box-shadow: none;
  --pico-card-sectioning-background-color: #221E1B;
  --pico-color: #D8D2C9;
  --pico-form-element-active-border-color: #E29A6C;
  --pico-form-element-background-color: #26221E;
  --pico-form-element-border-color: #423B31;
  --pico-form-element-focus-color: rgba(226, 154, 108, 0.35);
  --pico-form-element-placeholder-color: #797063;
  --pico-h1-color: #EFEAE2;
  --pico-h2-color: #EFEAE2;
  --pico-h3-color: #EFEAE2;
  --pico-h4-color: #D8D2C9;
  --pico-h5-color: #D8D2C9;
  --pico-h6-color: #D8D2C9;
  --pico-ins-color: #6FAE7F;
  --pico-muted-border-color: #332E27;
  --pico-muted-color: #9A9184;
  --pico-primary: #E29A6C;
  --pico-primary-background: #9C4A24;
  --pico-primary-border: #9C4A24;
  --pico-primary-focus: rgba(226, 154, 108, 0.35);
  --pico-primary-hover: #EDB08A;
  --pico-primary-hover-background: #B85C33;
  --pico-primary-hover-border: #B85C33;
  --pico-primary-inverse: #FFFFFF;
  --pico-primary-underline: rgba(226, 154, 108, 0.4);
  --pico-text-selection-color: rgba(226, 154, 108, 0.19);
}