/* WolfiePIMS warm theme + light/dark
   Tan is a highlight only. Never white text on tan/cream. */
:root {
  color-scheme: light;
  --teal-dark: #4A2214;
  --teal: #C24A1A;
  --teal-light: #F3E0C4;
  --gold: #E09B1A;
  --gold-light: #FFF3D0;
  --gold-pale: #FBE8B0;
  --red-pale: #FDE8DC;
  --red-border: #B8431A;
  --green-pale: #F8EBD4;
  --green-border: #C24A1A;
  --grey-bg: #F6EBD4;
  --border: #D4B896;
  --text-muted: #6B5344;
  --text: #2A1810;
  --muted: #6B5344;
  --bg: #FBF4E6;
  --card: #FFF8EC;
  --error: #B3261E;
  --wp-bg: #FBF4E6;
  --wp-text: #2A1810;
  --wp-ink: #2A1810;
  --wp-cream: #F5E6C8;
  --wp-bar: #4A2214;
  --wp-tan: #E8C9A0;
  --wp-nav: #4A2214;
  --wp-hero-2: #8B3A1F;
  --wp-toggle-bg: #FFF8EC;
  --wp-toggle-fg: #2A1810;
  --wp-toggle-border: #C24A1A;
  --shadow: 0 8px 32px rgba(74,34,20,.14), 0 2px 8px rgba(74,34,20,.10);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --teal-dark: #4A2214;
  --teal: #C24A1A;
  --teal-light: #3A2418;
  --gold: #E09B1A;
  --gold-light: #4A2214;
  --gold-pale: #3D2A12;
  --red-pale: #3A1C14;
  --red-border: #E07030;
  --green-pale: #2A1C14;
  --green-border: #C24A1A;
  --grey-bg: #2A1C16;
  --border: #6B4A32;
  --text-muted: #C4A882;
  --text: #F5E6C8;
  --muted: #C4A882;
  --bg: #1F1310;
  --card: #2A1C16;
  --error: #FF8A80;
  --wp-bg: #1F1310;
  --wp-text: #F5E6C8;
  --wp-ink: #F5E6C8;
  --wp-cream: #F5E6C8;
  --wp-bar: #140C0A;
  --wp-tan: #E8C9A0;
  --wp-nav: #140C0A;
  --wp-hero-2: #5C2A12;
  --wp-toggle-bg: #2A1C16;
  --wp-toggle-fg: #F5E6C8;
  --wp-toggle-border: #E09B1A;
  --shadow: 0 8px 32px rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.28);
}

html { background: var(--wp-bg); }
html, body { overflow-x: hidden; max-width: 100%; }
body {
  background-color: var(--wp-bg) !important;
  color: var(--wp-text);
}

/* Dark bars may use white/cream type. Tan/cream fills may not. */
.site-nav,
.topbar,
.hero,
.bg-dark,
header.page {
  color: #F5E6C8;
  background: var(--wp-bar) !important;
}
.site-nav {
  background: #4A2214 !important;
}
html[data-theme="dark"] .site-nav {
  background: #140C0A !important;
}
.hero, .topbar, header.page, .bg-dark, .cta-section {
  background: #4A2214 !important;
  color: #F5E6C8 !important;
}
html[data-theme="dark"] .hero,
html[data-theme="dark"] .topbar,
html[data-theme="dark"] header.page,
html[data-theme="dark"] .bg-dark,
html[data-theme="dark"] .cta-section {
  background: #140C0A !important;
  color: #F5E6C8 !important;
}

/* Site footer: dark bar + cream type (not a pale strip with white type) */
body > footer,
footer.site-footer,
.site-footer {
  background: #4A2214 !important;
  color: #F5E6C8 !important;
}
html[data-theme="dark"] body > footer,
html[data-theme="dark"] footer.site-footer {
  background: #140C0A !important;
  color: #F5E6C8 !important;
}
body > footer a,
.site-footer a { color: #E8C9A0; }

/* Callout boxes: dark brown body, tan only as a highlight edge */
.note, .highlight, .url-callout, .guide-toc, .warn,
.policy .callout, .policy .updated, .bg-teal-light, .bg-gold-light,
.bg-grey {
  background: #4A2214 !important;
  color: #F5E6C8 !important;
  border-color: #E8C9A0;
  border-left: 8px solid #E8C9A0 !important;
}
html[data-theme="dark"] .note,
html[data-theme="dark"] .highlight,
html[data-theme="dark"] .url-callout,
html[data-theme="dark"] .guide-toc,
html[data-theme="dark"] .warn,
html[data-theme="dark"] .policy .callout,
html[data-theme="dark"] .bg-teal-light,
html[data-theme="dark"] .bg-gold-light,
html[data-theme="dark"] .bg-grey {
  background: #140C0A !important;
  color: #F5E6C8 !important;
}
.note a, .highlight a, .url-callout a, .guide-toc a, .warn a,
.bg-teal-light a, .bg-gold-light a {
  color: #E8C9A0 !important;
}

/* Gold buttons: dark brown type, not white */
.nav-cta, .btn-primary, .btn-gold, .hero .primary {
  color: #2A1810 !important;
}

.wp-theme-toggle {
  position: fixed;
  z-index: 10000;
  right: max(12px, env(safe-area-inset-right));
  bottom: max(12px, env(safe-area-inset-bottom));
  min-width: 44px;
  min-height: 44px;
  padding: 8px 14px;
  border-radius: 22px;
  border: 2px solid var(--wp-toggle-border);
  background: var(--wp-toggle-bg);
  color: var(--wp-toggle-fg);
  font: 600 15px/1.2 -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
  cursor: pointer;
  box-shadow: var(--shadow);
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.wp-theme-toggle:focus-visible {
  outline: 3px solid var(--gold);
  outline-offset: 3px;
}

img, video, svg { max-width: 100%; height: auto; }
input, select, textarea, button { font-size: 16px; }

@media (max-width: 640px) {
  .wrap, .wrap-narrow { padding-left: 16px; padding-right: 16px; }
  .site-nav { padding: 10px 12px !important; }
  .nav-inner, .nav-links, .topbar .wrap {
    flex-wrap: wrap;
    gap: 10px;
  }
  .nav-links { justify-content: flex-start !important; gap: 12px !important; }
  .nav-link { margin-left: 0 !important; }
  .topbar nav { display: flex; flex-wrap: wrap; gap: 8px 14px; }
  .csv-options { grid-template-columns: 1fr !important; }
  .card, .pair-card, .status-card, .upload-card { padding: 18px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; }
}