/* ---- Theme toggle (restored 2026-10-07). Default is light; the visitor's choice is remembered in localStorage. ---- */
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 2.4rem; height: 2.4rem; padding: 0; border-radius: 999px; border: 1.5px solid var(--card-border); background: var(--surface); color: var(--heading); cursor: pointer; }
.theme-toggle:hover { border-color: var(--amber); color: var(--heading); }
.theme-toggle:focus-visible { outline: 2px solid var(--amber); outline-offset: 2px; }
.theme-toggle svg { width: 1.15rem; height: 1.15rem; display: block; }
.theme-toggle .icon-sun { display: none; }
.theme-toggle .icon-moon { display: block; }
html[data-theme="dark"] .theme-toggle .icon-sun { display: block; }
html[data-theme="dark"] .theme-toggle .icon-moon { display: none; }
@media (max-width: 860px) { .nav .theme-toggle { align-self: flex-start; } }
@media print { .theme-toggle { display: none !important; } }

/* ---- WPP dark theme: deep green + charcoal, cream text. Screen only, so printing always uses the light slip. ---- */
@media screen {
html[data-theme="dark"] {
  color-scheme: dark;
  --cream: #101a16;
  --white: #17241f;
  --sage: #1f2f28;
  --charcoal: #f3ecdf;
  --ivory: #f5f0e6;
  --on-forest: #f5f0e6;
  --muted: #ddd3c0;
  --forest: #a6d8bb;
  --forest-deep: #0b1f18;
  --amber: #d9b86c;
  --clay: #f2aaa0;
  --kicker-on-light: #e0c27f;
  --page-bg: var(--cream);
  --surface: var(--white);
  --text: var(--charcoal);
  --heading: #fbf5e9;
  --price: #b5e3c6;
  --card-border: rgba(243, 236, 223, 0.18);
  --shadow: 0 18px 40px -24px rgba(0, 0, 0, 0.7);
}
html[data-theme="dark"] body { background: var(--page-bg); color: var(--text); }
html[data-theme="dark"] .heading, html[data-theme="dark"] .brand, html[data-theme="dark"] .quote { color: var(--heading); }
html[data-theme="dark"] .site-header { background: rgba(16, 26, 22, 0.96); border-bottom-color: var(--card-border); }
html[data-theme="dark"] .band { background: var(--sage); }
html[data-theme="dark"] .btn { background: #2a6650; color: #fffaf0; }
html[data-theme="dark"] .btn:hover { background: #1d4d3c; color: #fffaf0; }
html[data-theme="dark"] .btn-amber { background: var(--amber); color: #0b1f18; }
html[data-theme="dark"] .btn-amber:hover { background: #e6c983; color: #0b1f18; }
html[data-theme="dark"] .btn-ghost { background: transparent; color: var(--ivory); }
html[data-theme="dark"] .btn-outline { background: transparent; color: var(--forest); border-color: var(--forest); }
html[data-theme="dark"] .btn-outline:hover { background: var(--forest-deep); color: var(--ivory); }
html[data-theme="dark"] .btn-print-add { background: transparent; color: var(--forest); border-color: var(--forest); }
html[data-theme="dark"] .btn-print-add:hover { background: #2a6650; border-color: #2a6650; color: #fffaf0; }
html[data-theme="dark"] .btn-print-add.is-in { background: var(--surface); color: var(--forest); border-color: var(--forest); }
html[data-theme="dark"] .event-banner { background: #1f4a3b; color: var(--ivory); }
html[data-theme="dark"] .size-select,
html[data-theme="dark"] .live-browse select,
html[data-theme="dark"] .filter-field select {
  background-color: var(--surface);
  color: var(--text);
  border-color: rgba(243, 236, 223, 0.28);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%23f3ecdf' d='M1 1l5 5 5-5'/></svg>");
}
html[data-theme="dark"] select option { background: #17241f; color: #f3ecdf; }
html[data-theme="dark"] input, html[data-theme="dark"] textarea { color: var(--text); background: var(--surface); border-color: rgba(243, 236, 223, 0.28); }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color: var(--muted); opacity: 1; }
html[data-theme="dark"] .print-cart-btn { background: var(--surface); color: var(--heading); border-color: var(--card-border); }
html[data-theme="dark"] .print-cart-btn:hover { color: var(--forest); border-color: var(--forest); }
html[data-theme="dark"] .print-drawer-explain { background: var(--sage); }
html[data-theme="dark"] .print-drawer-scrim { background: rgba(0, 0, 0, 0.6); }
html[data-theme="dark"] .live-tabs button.is-on { color: var(--forest); border-bottom-color: var(--forest); }
html[data-theme="dark"] .age-panel a.age-sister:hover { color: var(--heading); }
html[data-theme="dark"] .print-toast { background: #2a6650; color: #fffaf0; }
html[data-theme="dark"] .theme-toggle { background: var(--surface); color: var(--heading); border-color: rgba(243, 236, 223, 0.28); }
}

/* Shared AA fix (both themes): gold hero text on the green hero photo measured about 3.8:1 at the gradient's light end. */
.hero .kicker, .hero p[style*="--amber"] { color: #ecd49c !important; }
