/* The Essence — "Sunset Noir" theme.
   Scoped under body.theme-sunset so pages opt in. Homepage never opts in.
   Colour and background only: text, boxes, layout and the white public nav are unchanged.
   British English, no em-dash, no serial comma. */

.theme-sunset {
  /* Safe, consistently-used variables remapped once; the rest handled explicitly below. */
  --ivory-deep: #120c12;   /* deep sections */
  --blush: #241826;        /* soft surface (team code, section--blush) */
  --rose: #e0568b;         /* magenta accent (numbers, focus, totals) */
  --rose-deep: #ff8a5c;    /* coral accent (kickers, labels, table heads, tags) */
  --ink-soft: #bda6aa;     /* secondary text */
  --line: rgba(255, 150, 110, 0.16);   /* hairlines */
}

/* ---------- Base ---------- */
body.theme-sunset { background: #160f16; color: #f3e9e6; }
.theme-sunset h1, .theme-sunset h2, .theme-sunset h3 { color: #faf1ee; }
.theme-sunset a { color: inherit; }

/* ---------- Page hero band (non-image pages) ---------- */
.theme-sunset .page-hero {
  background: linear-gradient(160deg, #2c1224, #160f16 72%);
  position: relative;
}
.theme-sunset .page-hero p { color: #bda6aa; }

/* ---------- Kickers / lede ---------- */
.theme-sunset .kicker { color: #ff8a5c; }
.theme-sunset .lede { color: #bda6aa; }

/* ---------- Deep section ---------- */
.theme-sunset .section--deep { background: #120c12; }
.theme-sunset .section--blush { background: #1d1522; }

/* ---------- Fact boxes (Las Adventuras) ---------- */
.theme-sunset .fact {
  background: #211624;
  border-color: rgba(255, 138, 92, 0.26);
  position: relative;
  overflow: hidden;
}
.theme-sunset .fact::before {
  content: "";
  position: absolute;
  left: 0; top: 0; height: 100%; width: 3px;
  background: linear-gradient(180deg, #ff7a59, #e0568b);
}
.theme-sunset .fact .fact-label { color: #ff8a5c; }
.theme-sunset .fact .fact-value { color: #faf1ee; }

/* ---------- Steps ---------- */
.theme-sunset .steps li {
  color: #bda6aa;
  border-bottom-color: rgba(255, 138, 92, 0.16);
}
.theme-sunset .steps li strong { color: #f3e9e6; }
.theme-sunset .steps li::before { color: #e0568b; }

/* ---------- Game cards ---------- */
.theme-sunset .card {
  background: #211624;
  border-color: rgba(255, 138, 92, 0.2);
}
.theme-sunset .card:hover { box-shadow: 0 18px 40px -24px rgba(0, 0, 0, 0.6); }
.theme-sunset .card p { color: #bda6aa; }
.theme-sunset .card .card-meta { color: #ff8a5c; }

/* ---------- Buttons (sunset gradient) ---------- */
.theme-sunset .btn {
  background: linear-gradient(90deg, #ff7a59, #e0568b);
  color: #1a0f16;
  border-color: transparent;
}
.theme-sunset .btn:hover {
  background: linear-gradient(90deg, #ff8a5c, #e669a0);
  color: #1a0f16;
}
.theme-sunset .btn--ghost {
  background: transparent;
  color: #f3e9e6;
  border: 1px solid rgba(255, 150, 110, 0.5);
}
.theme-sunset .btn--ghost:hover {
  background: linear-gradient(90deg, #ff7a59, #e0568b);
  color: #1a0f16;
  border-color: transparent;
}
/* Keep the white public nav's pill exactly as-is (dark ink), not gradient */
.theme-sunset .nav nav a.btn { background: #17140f; color: #fbf8f5; border-color: #17140f; }
.theme-sunset .nav nav a.btn:hover { background: transparent; color: #17140f; }

/* ---------- Forms ---------- */
.theme-sunset .form-card { background: #211624; border-color: rgba(255, 138, 92, 0.22); }
.theme-sunset .field .hint { color: #bda6aa; }
.theme-sunset .field input,
.theme-sunset .field select,
.theme-sunset .field textarea,
.theme-sunset .ledger-input,
.theme-sunset .copy-row input {
  background: #1b121d;
  color: #f3e9e6;
  border-color: rgba(255, 150, 110, 0.22);
}
.theme-sunset .field input::placeholder,
.theme-sunset .field textarea::placeholder { color: #8f7c80; }
.theme-sunset .field input:focus,
.theme-sunset .field select:focus,
.theme-sunset .field textarea:focus,
.theme-sunset .ledger-input:focus {
  outline-color: #e0568b;
  border-color: #e0568b;
}
.theme-sunset .field select option { background: #211624; color: #f3e9e6; }

/* ---------- Form messages / status colours ---------- */
.theme-sunset .form-msg.ok { background: rgba(60, 140, 80, 0.18); color: #a7e0b0; }
.theme-sunset .form-msg.err { background: rgba(200, 70, 70, 0.2); color: #f0b3b3; }

/* ---------- Coming soon ---------- */
.theme-sunset .soon p { color: #bda6aa; }

/* ---------- Footer ---------- */
.theme-sunset footer {
  background: #120c12;
  border-top-color: rgba(255, 138, 92, 0.16);
}
.theme-sunset footer .wrap { color: #bda6aa; }
.theme-sunset footer .wordmark { color: #faf1ee; }
.theme-sunset footer .wordmark img { filter: brightness(0) invert(1); opacity: 0.9; }

/* ---------- Teams (player) ---------- */
.theme-sunset .team-code { color: #faf1ee; }   /* bg comes from --blush remap */
.theme-sunset .qr-box { background: #ffffff; padding: 0.7rem; border-radius: 12px; }  /* keep QR scannable */
.theme-sunset .member-list li { border-bottom-color: rgba(255, 150, 110, 0.16); }
.theme-sunset .badge { background: #3a2230; color: #ffc9ad; }
.theme-sunset .team-total { color: #e0568b; }

/* ---------- Admin: tiles ---------- */
.theme-sunset .admin-tile { background: #211624; border-color: rgba(255, 138, 92, 0.2); }
.theme-sunset .admin-tile:hover { border-color: #ff8a5c; }
.theme-sunset .admin-tile p { color: #bda6aa; }

/* ---------- Admin: tables ---------- */
.theme-sunset .admin-tablewrap { background: #211624; border-color: rgba(255, 138, 92, 0.2); }
.theme-sunset .admin-table th { color: #ff8a5c; }
.theme-sunset .admin-table th,
.theme-sunset .admin-table td { border-bottom-color: rgba(255, 150, 110, 0.16); }

/* ---------- Admin: pills ---------- */
.theme-sunset .pill--admin { background: #ff8a5c; color: #1a0f16; }
.theme-sunset .pill--paid { background: rgba(60, 140, 80, 0.24); color: #a7e0b0; }
.theme-sunset .pill--unpaid { background: rgba(200, 70, 70, 0.24); color: #f0b3b3; }

/* ---------- Admin: leaderboard / team cards ---------- */
.theme-sunset .rank { color: #ff8a5c; }
.theme-sunset .team-members { color: #bda6aa; }
.theme-sunset .ledger-wrap,
.theme-sunset .ledger-row { border-color: rgba(255, 150, 110, 0.16); border-bottom-color: rgba(255, 150, 110, 0.16); }
.theme-sunset .ledger-was,
.theme-sunset .ledger-meta,
.theme-sunset .ledger-hist { color: #bda6aa; }
.theme-sunset .comms-send { border-top-color: rgba(255, 150, 110, 0.16); }

/* ---------- Admin sidebar (kept in layout, recoloured dark) ---------- */
.theme-sunset .admin-nav {
  background: #1c1220;
  border-right-color: rgba(255, 150, 110, 0.16);
}
.theme-sunset .admin-nav__head .wordmark { color: #faf1ee; }
.theme-sunset .admin-nav__head .wordmark img { filter: brightness(0) invert(1); opacity: 0.92; }
.theme-sunset .admin-nav__tag { color: #ff8a5c; }
.theme-sunset .admin-nav__links a { color: #e9ded9; }
.theme-sunset .admin-nav__links a:hover { background: rgba(255, 255, 255, 0.06); }
.theme-sunset .admin-nav__links a.active { background: #ff8a5c; color: #1a0f16; }
.theme-sunset .admin-nav__foot { border-top-color: rgba(255, 150, 110, 0.16); }
.theme-sunset .admin-nav__foot a,
.theme-sunset .admin-nav__foot .nav-logout button { color: #cdbfc2; }
.theme-sunset .admin-nav__toggle { background: #ff8a5c; color: #1a0f16; }

/* ---------- Public top-nav dropdown: keep it light (nav stays white) ---------- */
.theme-sunset .nav-acct__menu a:hover,
.theme-sunset .nav-acct__menu button:hover { background: #f7e8e6; }

/* Keep the account/login pill in the white public nav dark (nav stays as-is) */
.theme-sunset .nav-acct__btn { background:#17140f; color:#fbf8f5; border-color:#17140f; }
.theme-sunset .nav-acct__btn:hover { background:#2a2118; color:#fbf8f5; }