/*
 * Design tokens. Per-site accents come from the generated site.css, loaded last.
 *
 * crates/sitegen/src/contrast.rs mirrors --ink, --ink-soft, --surface, the glass
 * opacity and the gradient strength (layout.css) to check each site's accent colors
 * against WCAG AA at build time. Change them together; a unit test keeps them in sync.
 */
:root {
  --accent:        #2F5D7C;
  --accent-alt:    #7C9BB5;
  --ink:           #14161a;
  --ink-soft:      #50555d;   /* only on glass panels, never directly on the gradient */
  --surface:       #f7f7f5;
  --link:          var(--accent);
  --glass-bg:      rgba(255, 255, 255, .55);
  --glass-solid:   rgba(255, 255, 255, .94);   /* fallback when blur is unavailable */
  --glass-border:  rgba(255, 255, 255, .65);
  --glass-rim:     rgba(255, 255, 255, .75);   /* the specular top edge */
  --glass-blur:    20px;
  --glass-sat:     180%;
  --radius-lg:     28px;
  --radius-md:     18px;
  --shadow-lift:   0 1px 2px rgba(0, 0, 0, .04), 0 12px 32px rgba(0, 0, 0, .10);
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --bg-image: none;   /* a site with a photo sets this in its generated site.css */
  --scrim-strength: 0%;
  --scrim: color-mix(in srgb, var(--surface) var(--scrim-strength), transparent);
}

/* Photo sites (site.toml [background], marked with data-bg on <html>): a scrim in the
   surface colour over the photo, and stronger glass. contrast.rs assumes the worst case
   under these values, a black (light) or white (dark) photo pixel, so any photo is safe. */
:root[data-bg="photo"] {
  --scrim-strength: 45%;
  --glass-bg:      rgba(255, 255, 255, .70);
}

/* Dark mode swaps tokens only. */
@media (prefers-color-scheme: dark) {
  :root {
    --ink:          #f2f3f5;
    --ink-soft:     #a4a9b2;
    --surface:      #0f1114;
    --link:         color-mix(in srgb, var(--accent-alt) 70%, white);
    --glass-bg:     rgba(28, 32, 39, .55);
    --glass-solid:  rgba(28, 32, 39, .94);
    --glass-border: rgba(255, 255, 255, .12);
    --glass-rim:    rgba(255, 255, 255, .14);
    --shadow-lift:  0 1px 2px rgba(0, 0, 0, .30), 0 12px 32px rgba(0, 0, 0, .45);
  }
  :root[data-bg="photo"] {
    --scrim-strength: 60%;
    --glass-bg:     rgba(28, 32, 39, .70);
  }
}