/* Repostle corner light/dark toggle + dark theme — Rob's standing
 * product standard (2026-10-18), matching the TradePrepNow reference.
 * The button is injected by /theme.js; the dark theme is a real theme
 * (light text on dark surfaces, keyed off [data-theme="dark"] on
 * <html>), never an inversion filter. This file loads AFTER each
 * surface's own stylesheet so its dark overrides win. */

/* ---- The corner toggle (reference spec, exact) ---- */
#repostle-theme-toggle {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 9999;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(128, 128, 128, 0.2);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(128, 128, 128, 0.3);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
  min-height: 0;
}
#repostle-theme-toggle:focus-visible { outline: 2px solid #7aa7ff; outline-offset: 2px; }
@media print { #repostle-theme-toggle { display: none !important; } }

/* ================================================================
   LANDING (body.rp-landing, /landing.css variables)
   ================================================================ */
html[data-theme="dark"] body.rp-landing {
  --paper: #171410;
  --paper-deep: #201b15;
  --card: #262119;
  --ink: #f0e9d8;
  --ink-soft: #c9bda1;
  --rule: #4c4331;
  --accent: #e08a4c;
  --accent-soft: #3d2716;
  --good: #82c98a;
}
html[data-theme="dark"] body.rp-landing .receipt {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
}
html[data-theme="dark"] body.rp-landing form.intake input[type="text"],
html[data-theme="dark"] body.rp-landing form.intake input[type="email"],
html[data-theme="dark"] body.rp-landing form.intake input[type="tel"],
html[data-theme="dark"] body.rp-landing form.intake select,
html[data-theme="dark"] body.rp-landing form.intake textarea {
  background: #1b1712;
  color: var(--ink);
  border-color: var(--rule);
}
html[data-theme="dark"] body.rp-landing .covenant {
  background: #0f0d09;
  border: 1px solid var(--rule);
  /* --paper flips dark with the theme; the covenant box stays dark in
     both themes, so its text must not follow the variable (the quote
     was dark-on-dark before this line — found in the 2026-10-19
     front-door proof, home-phone-dark). */
  color: #f0e9d8;
}
html[data-theme="dark"] body.rp-landing .covenant .small { color: #b3a888; }
html[data-theme="dark"] body.rp-landing .form-error {
  background: #3d1d13;
  border-color: #8a4b32;
  color: #f3c4ae;
}
html[data-theme="dark"] body.rp-landing .btn { background: var(--ink); color: #171410; border-color: var(--ink); }
html[data-theme="dark"] body.rp-landing .btn:hover { background: var(--accent); border-color: var(--accent); color: #171410; }
html[data-theme="dark"] body.rp-landing .btn.secondary { background: transparent; color: var(--ink); }
html[data-theme="dark"] body.rp-landing .btn.secondary:hover { color: var(--accent); border-color: var(--accent); }

/* ================================================================
   APP SHELL (body.rp-shell, public/index.html inline styles)
   ================================================================ */
html[data-theme="dark"] body.rp-shell {
  background: #14181f;
  color: #e9edf4;
}

/* ================================================================
   FRONT DOOR (body.rp-frontdoor, inline styles; contact line and
   header artwork untouched — only surface colours change)
   ================================================================ */
html[data-theme="dark"] body.rp-frontdoor {
  background: #14120d;
  color: #ece4cf;
}
html[data-theme="dark"] body.rp-frontdoor main p { color: #bdb198; }
html[data-theme="dark"] body.rp-frontdoor .status {
  background: #241f14;
  color: #ece4cf;
}
html[data-theme="dark"] body.rp-frontdoor footer {
  border-top-color: #2c2617;
  color: #bdb198;
}
html[data-theme="dark"] body.rp-frontdoor footer a { color: #d9a94a; }
html[data-theme="dark"] body.rp-frontdoor footer a:hover,
html[data-theme="dark"] body.rp-frontdoor footer a:focus { color: #eec27a; }

/* ================================================================
   CREATOR — ABOUT THE MAKER (body.rp-creator, inline styles in
   creator.html; the buried page carrying the medallion + profile)
   ================================================================ */
html[data-theme="dark"] body.rp-creator {
  background: #171410;
  color: #f0e9d8;
}
html[data-theme="dark"] body.rp-creator p { color: #c9bda1; }
html[data-theme="dark"] body.rp-creator .grace { border-left-color: #4c4331; }
html[data-theme="dark"] body.rp-creator a { color: #e08a4c; }

/* ================================================================
   CLIENT SURFACES — book / agree / rrb share one palette
   (#14213d on #f4f6fb, white cards, #b9c2d6 input borders)
   ================================================================ */
html[data-theme="dark"] body.rp-book,
html[data-theme="dark"] body.rp-agree,
html[data-theme="dark"] body.rp-rrb {
  background: #12161e;
  color: #e9edf4;
}
html[data-theme="dark"] body.rp-book .card,
html[data-theme="dark"] body.rp-agree .card,
html[data-theme="dark"] body.rp-rrb .card,
html[data-theme="dark"] body.rp-rrb .item {
  background: #1c232f;
  border-color: #39445a;
}
html[data-theme="dark"] body.rp-book .meta,
html[data-theme="dark"] body.rp-agree .meta,
html[data-theme="dark"] body.rp-rrb .meta,
html[data-theme="dark"] body.rp-rrb .finding .loc,
html[data-theme="dark"] body.rp-rrb .attr,
html[data-theme="dark"] body.rp-book .loading,
html[data-theme="dark"] body.rp-agree .loading,
html[data-theme="dark"] body.rp-rrb .loading,
html[data-theme="dark"] body.rp-agree .locked,
html[data-theme="dark"] body.rp-rrb .locked { color: #9aa6b8; }
html[data-theme="dark"] body.rp-book input,
html[data-theme="dark"] body.rp-book select,
html[data-theme="dark"] body.rp-agree input[type="text"],
html[data-theme="dark"] body.rp-agree input[type="email"],
html[data-theme="dark"] body.rp-rrb input[type="text"],
html[data-theme="dark"] body.rp-rrb textarea,
html[data-theme="dark"] body.rp-rrb select {
  background: #232b3a;
  color: #e9edf4;
  border-color: #4a5872;
}
html[data-theme="dark"] body.rp-book .btn,
html[data-theme="dark"] body.rp-agree .btn,
html[data-theme="dark"] body.rp-rrb .btn {
  background: #232b3a;
  color: #e9edf4;
  border-color: #4a5872;
}
html[data-theme="dark"] body.rp-book .btn.primary,
html[data-theme="dark"] body.rp-agree .btn.primary,
html[data-theme="dark"] body.rp-rrb .btn.primary {
  background: #e9edf4;
  color: #14213d;
  border-color: #e9edf4;
}
html[data-theme="dark"] body.rp-agree .step { background: #262e3d; color: #9aa6b8; }
html[data-theme="dark"] body.rp-agree .step.on { background: #e9edf4; color: #14213d; }
html[data-theme="dark"] body.rp-agree .step.done { background: #2e6b34; color: #fff; }
html[data-theme="dark"] body.rp-agree .seg { border-color: #4a5872; }
html[data-theme="dark"] body.rp-agree .seg button { background: #232b3a; color: #e9edf4; }
html[data-theme="dark"] body.rp-agree .seg button.on { background: #e9edf4; color: #14213d; }
html[data-theme="dark"] body.rp-agree canvas.pad { background: #232b3a; border-color: #4a5872; }
html[data-theme="dark"] body.rp-agree .finding,
html[data-theme="dark"] body.rp-rrb .finding { border-color: #39445a; }
html[data-theme="dark"] body.rp-agree .badge,
html[data-theme="dark"] body.rp-rrb .badge { background: #262e3d; color: #c3ccd9; }
html[data-theme="dark"] body.rp-rrb .askbox { background: #171c26; }
html[data-theme="dark"] body.rp-book .err,
html[data-theme="dark"] body.rp-agree .err,
html[data-theme="dark"] body.rp-rrb .err { background: #3d1d1a; color: #f0b3a9; }
html[data-theme="dark"] body.rp-book .notice,
html[data-theme="dark"] body.rp-agree .notice,
html[data-theme="dark"] body.rp-rrb .notice { background: #35300f; border-color: #6e6224; color: #ece4b8; }
html[data-theme="dark"] body.rp-book .good,
html[data-theme="dark"] body.rp-agree .good,
html[data-theme="dark"] body.rp-rrb .good { background: #1d3320; border-color: #38663f; color: #cdeeda; }

/* ================================================================
   REPORT (body.rp-report, /report.css variables)
   ================================================================ */
html[data-theme="dark"] body.rp-report {
  --ink: #e9edf4;
  --muted: #9aa6b8;
  --line: #39445a;
  --bg: #12161e;
  --card: #1c232f;
  --safety: #ff9d94;
  --safety-bg: #3d1d1a;
  --major: #f0b27a;
  --major-bg: #3a2712;
  --moderate: #e3cd6e;
  --moderate-bg: #35300f;
  --minor: #9db9dd;
  --minor-bg: #1d2b45;
  --info: #9aa6b8;
  --info-bg: #262e3d;
  --ok: #82c98a;
}
html[data-theme="dark"] body.rp-report .topbar { background: rgba(18, 22, 30, 0.94); }
html[data-theme="dark"] body.rp-report .btn { background: #232b3a; }
html[data-theme="dark"] body.rp-report .btn:hover { border-color: #5a6a88; }
html[data-theme="dark"] body.rp-report .btn.primary { background: #e9edf4; color: #14213d; border-color: #e9edf4; }
html[data-theme="dark"] body.rp-report .seg button { background: #232b3a; }
html[data-theme="dark"] body.rp-report .seg button.on { background: #e9edf4; color: #14213d; }
html[data-theme="dark"] body.rp-report .card,
html[data-theme="dark"] body.rp-report .finding { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4); }
html[data-theme="dark"] body.rp-report .ni-list { background: #2b2510; border-color: #6e6224; }
html[data-theme="dark"] body.rp-report .finding.notinspected { background: #26220f; }
html[data-theme="dark"] body.rp-report .edit-form input,
html[data-theme="dark"] body.rp-report .edit-form select,
html[data-theme="dark"] body.rp-report .edit-form textarea { background: #232b3a; color: var(--ink); }
html[data-theme="dark"] body.rp-report .notice.warn { background: #2b2510; border-color: #6e6224; }
html[data-theme="dark"] body.rp-report .notice.good { background: #1d3320; border-color: #38663f; }
html[data-theme="dark"] body.rp-report .chip.verified { background: #1d3320; }
html[data-theme="dark"] body.rp-report #toast { background: #e9edf4; color: #14213d; }
@media print {
  html[data-theme="dark"] body.rp-report { --ink: #14213d; --muted: #5b6478; --bg: #fff; --card: #fff; }
}

/* ================================================================
   FIELD (body.rp-field, field.html inline variables)
   ================================================================ */
html[data-theme="dark"] body.rp-field {
  --ink: #e9edf4;
  --mut: #9aa6b8;
  --line: #39445a;
  --bg: #12161e;
  --card: #1c232f;
  --accent: #5ea9ff;
  --good: #82c98a;
  --warn: #e3cd6e;
  --bad: #ff9d94;
  --na: #9aa6b8;
}
html[data-theme="dark"] body.rp-field .pill { background: #262e3d; }
html[data-theme="dark"] body.rp-field .pill.resume { background: #3a3212; border-color: #6e6224; color: var(--ink); }
html[data-theme="dark"] body.rp-field input,
html[data-theme="dark"] body.rp-field select,
html[data-theme="dark"] body.rp-field textarea { background: #232b3a; color: var(--ink); }
html[data-theme="dark"] body.rp-field .banner { background: #35300f; border-color: #6e6224; }
html[data-theme="dark"] body.rp-field .offline-note { background: #3d1d1a; border-color: #7a3a34; }
html[data-theme="dark"] body.rp-field .st-not_started { background: #262e3d; }
html[data-theme="dark"] body.rp-field .st-in_progress { background: #35300f; }
html[data-theme="dark"] body.rp-field .st-done { background: #1d3320; }
html[data-theme="dark"] body.rp-field .st-not_applicable { background: #262e3d; }
html[data-theme="dark"] body.rp-field .outcome-answered.sel { background: #3d1d1a; }
html[data-theme="dark"] body.rp-field .outcome-ok.sel { background: #1d3320; }
html[data-theme="dark"] body.rp-field .outcome-not_present.sel { background: #262e3d; }
html[data-theme="dark"] body.rp-field .outcome-not_inspected.sel { background: #35300f; }
html[data-theme="dark"] body.rp-field .modebar button.active,
html[data-theme="dark"] body.rp-field .tools button.active { background: #e9edf4; color: #14213d; border-color: #e9edf4; }
html[data-theme="dark"] body.rp-field button.primary { background: var(--accent); border-color: var(--accent); color: #0b1526; }

/* ================================================================
   OFFICE DESK (body.rp-desk, /desk.css variables) — the landing
   palette carried into the dark: warm paper becomes deep umber,
   ink becomes the light tone, the accent warms up.
   ================================================================ */
html[data-theme="dark"] body.rp-desk {
  --paper: #171410;
  --paper-deep: #201b15;
  --card: #262119;
  --ink: #f0e9d8;
  --ink-soft: #c9bda1;
  --rule: #4c4331;
  --accent: #e08a4c;
  --accent-ink: #241207;
  --accent-soft: #3d2716;
  --good: #82c98a;
  --good-soft: #1d3320;
  --warn: #e5c169;
  --warn-soft: #35300f;
  --bad: #f0937f;
  --bad-soft: #3d1d1a;
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 8px 24px rgba(0, 0, 0, 0.35);
}
html[data-theme="dark"] body.rp-desk .tab.active { background: var(--ink); color: #171410; }
html[data-theme="dark"] body.rp-desk .chip.active { background: var(--ink); border-color: var(--ink); color: #171410; }
html[data-theme="dark"] body.rp-desk .step.now { background: var(--ink); border-color: var(--ink); color: #171410; }
html[data-theme="dark"] body.rp-desk .status.booked { background: #262e3d; color: #a9c0e8; }
html[data-theme="dark"] body.rp-desk .status.in_field,
html[data-theme="dark"] body.rp-desk .status.field_complete,
html[data-theme="dark"] body.rp-desk .status.synced { background: #22314f; color: #a9c0e8; }
html[data-theme="dark"] body.rp-desk .toast { background: #f0e9d8; color: #171410; }
