/* Phase 34J.3 — Admin theme-aware page backgrounds.
   Loaded after the selected theme stylesheet so admin background chrome wins
   without changing the shared scoreboard/player theme files. */

html[data-admin-theme],
body[data-admin-theme] {
  min-height: 100%;
  background-color: #070606 !important;
  background-attachment: fixed !important;
}

html[data-admin-theme="default"],
body[data-admin-theme="default"] {
  background:
    radial-gradient(circle at 14% 8%, rgba(255, 209, 102, 0.18), transparent 30%),
    radial-gradient(circle at 86% 12%, rgba(255, 59, 48, 0.18), transparent 27%),
    linear-gradient(135deg, #070606, #19100d 52%, #100907) !important;
}

html[data-admin-theme="neon-80s"],
html[data-admin-theme="retro-arcade"],
html[data-admin-theme="cartoon-chaos"],
body[data-admin-theme="neon-80s"],
body[data-admin-theme="retro-arcade"],
body[data-admin-theme="cartoon-chaos"] {
  background:
    radial-gradient(circle at 18% 8%, rgba(255, 79, 216, 0.22), transparent 28%),
    radial-gradient(circle at 86% 16%, rgba(0, 229, 255, 0.20), transparent 25%),
    linear-gradient(135deg, #10021e, #180c33 52%, #050616) !important;
}

html[data-admin-theme="tron-sci-fi"],
html[data-admin-theme="laser-tag-arena"],
html[data-admin-theme="alien-invasion"],
body[data-admin-theme="tron-sci-fi"],
body[data-admin-theme="laser-tag-arena"],
body[data-admin-theme="alien-invasion"] {
  background:
    radial-gradient(circle at 18% 10%, rgba(55, 248, 255, 0.18), transparent 28%),
    radial-gradient(circle at 86% 15%, rgba(138, 92, 255, 0.22), transparent 28%),
    linear-gradient(135deg, #020814, #07182b 52%, #02030a) !important;
}

html[data-admin-theme="zombie-tag"],
html[data-admin-theme="toxic-slime-lab"],
body[data-admin-theme="zombie-tag"],
body[data-admin-theme="toxic-slime-lab"] {
  background:
    radial-gradient(circle at 16% 8%, rgba(168, 255, 62, 0.20), transparent 28%),
    radial-gradient(circle at 82% 12%, rgba(255, 74, 51, 0.18), transparent 27%),
    linear-gradient(135deg, #071108, #18220c 54%, #050806) !important;
}

html[data-admin-theme="tactical-camo"],
body[data-admin-theme="tactical-camo"] {
  background:
    radial-gradient(circle at 20% 8%, rgba(215, 196, 106, 0.18), transparent 30%),
    radial-gradient(circle at 82% 16%, rgba(127, 176, 105, 0.16), transparent 28%),
    linear-gradient(135deg, #0d110a, #26301a 50%, #0b0d08) !important;
}

html[data-admin-theme="candy-apocalypse"],
html[data-admin-theme="superhero-city"],
body[data-admin-theme="candy-apocalypse"],
body[data-admin-theme="superhero-city"] {
  background:
    radial-gradient(circle at 15% 9%, rgba(255, 111, 183, 0.20), transparent 28%),
    radial-gradient(circle at 86% 14%, rgba(100, 216, 255, 0.18), transparent 27%),
    linear-gradient(135deg, #190615, #22204a 54%, #090811) !important;
}

html[data-admin-theme="pirate-treasure"],
body[data-admin-theme="pirate-treasure"] {
  background:
    radial-gradient(circle at 20% 9%, rgba(242, 193, 78, 0.20), transparent 30%),
    radial-gradient(circle at 78% 18%, rgba(199, 125, 42, 0.16), transparent 28%),
    linear-gradient(135deg, #100806, #231307 52%, #07100d) !important;
}

body[data-admin-theme]::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    repeating-linear-gradient(180deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 5px),
    radial-gradient(circle at 10% 28%, color-mix(in srgb, var(--admin-accent, #ff9f1c) 12%, transparent), transparent 21%),
    radial-gradient(circle at 86% 72%, color-mix(in srgb, var(--admin-accent-2, #ffd166) 10%, transparent), transparent 20%);
  opacity: 0.72;
}

body[data-admin-theme] > .admin-page {
  position: relative;
  z-index: 1;
  background: transparent !important;
}

/* Phase 35D.7 — Haunted uses real artwork, not the generic admin scanline/dot overlay. */
html[data-admin-theme="haunted"],
body[data-admin-theme="haunted"] {
  background:
    linear-gradient(180deg, rgba(5, 5, 7, 0.18), rgba(5, 5, 7, 0.84)),
    url("/assets/themes/haunted/haunted_desktop_background.png?v=35D8") center center / cover fixed no-repeat,
    #050507 !important;
}

body[data-admin-theme="haunted"]::before {
  display: none !important;
  content: none !important;
}

body[data-admin-theme="haunted"] .card,
body[data-admin-theme="haunted"] .wide-card,
body[data-admin-theme="haunted"] .admin-card,
body[data-admin-theme="haunted"] .admin-section,
body[data-admin-theme="haunted"] .nested-admin-section,
body[data-admin-theme="haunted"] .admin-status-card,
body[data-admin-theme="haunted"] .profile-modal,
body[data-admin-theme="haunted"] .join-qr-card,
body[data-admin-theme="haunted"] .join-player-card,
body[data-admin-theme="haunted"] .admin-panel,
body[data-admin-theme="haunted"] .modal-backdrop .card {
  color: #f0edf4 !important;
  background:
    linear-gradient(180deg, rgba(36, 33, 43, 0.96), rgba(10, 9, 13, 0.97)) !important;
  border-color: rgba(201, 194, 215, 0.54) !important;
  box-shadow: 7px 7px 0 rgba(5, 5, 7, 0.82), 0 0 34px rgba(142, 99, 199, 0.20) !important;
}

/* Phase 35D.7 — Haunted admin token lock.
   The base Windows admin chrome uses --admin-* variables for cards/buttons.
   Set those variables directly for Haunted so the old brown/default palette cannot win. */
html[data-admin-theme="haunted"],
body[data-admin-theme="haunted"] {
  --admin-ink: #050507;
  --admin-paper: #f0edf4;
  --admin-text: #f0edf4;
  --admin-muted: rgba(185, 177, 195, 0.90);
  --admin-panel: rgba(16, 15, 21, 0.96) !important;
  --admin-panel-2: rgba(34, 31, 42, 0.94) !important;
  --admin-panel-3: rgba(48, 43, 59, 0.90) !important;
  --admin-card-wash: rgba(142, 99, 199, 0.14) !important;
  --admin-card-wash-2: rgba(205, 183, 232, 0.09) !important;
  --admin-card-border: rgba(201, 194, 215, 0.58) !important;
  --admin-card-shadow: rgba(5, 5, 7, 0.78) !important;
  --admin-accent: #8e63c7 !important;
  --admin-accent-2: #cdb7e8;
  --admin-danger: #9e4a64;
  --admin-good: #afc8b1;
  --admin-shadow: rgba(5, 5, 7, 0.88);
  --admin-page-bg:
    linear-gradient(180deg, rgba(5, 5, 7, 0.18), rgba(5, 5, 7, 0.84)),
    url("/assets/themes/haunted/haunted_desktop_background.png?v=35D8") center center / cover fixed no-repeat,
    #050507;
}

body[data-admin-theme="haunted"] {
  color: var(--admin-text) !important;
  background: var(--admin-page-bg) !important;
}

body[data-admin-theme="haunted"] .admin-page .card,
body[data-admin-theme="haunted"] .admin-page .wide-card,
body[data-admin-theme="haunted"] .admin-page .admin-card,
body[data-admin-theme="haunted"] .admin-page .admin-section,
body[data-admin-theme="haunted"] .admin-page .nested-admin-section,
body[data-admin-theme="haunted"] .admin-page .admin-status-card,
body[data-admin-theme="haunted"] .admin-page .admin-item,
body[data-admin-theme="haunted"] .admin-page .team-admin-item,
body[data-admin-theme="haunted"] .admin-page .ctf-setup-card,
body[data-admin-theme="haunted"] .admin-page .ctf-setup-panel,
body[data-admin-theme="haunted"] .admin-page .game-mode-settings-group,
body[data-admin-theme="haunted"] .admin-page .map-panel,
body[data-admin-theme="haunted"] .admin-page .map-status,
body[data-admin-theme="haunted"] .admin-page .ready-requirements,
body[data-admin-theme="haunted"] .admin-page .ready-requirements-panel,
body[data-admin-theme="haunted"] .admin-page .join-qr-card,
body[data-admin-theme="haunted"] .admin-page .join-player-card,
body[data-admin-theme="haunted"] .admin-page .profile-modal,
body[data-admin-theme="haunted"] .admin-page .profile-avatar-current-row,
body[data-admin-theme="haunted"] .admin-page .profile-avatar-grid,
body[data-admin-theme="haunted"] .admin-page .admin-panel,
body[data-admin-theme="haunted"] .modal-backdrop .card {
  position: relative;
  overflow: hidden;
  color: var(--admin-text) !important;
  border-color: rgba(201, 194, 215, 0.58) !important;
  background:
    linear-gradient(180deg, rgba(40, 37, 48, 0.96), rgba(12, 11, 16, 0.97)) !important;
  box-shadow: 7px 7px 0 rgba(5, 5, 7, 0.84), 0 0 34px rgba(142, 99, 199, 0.22) !important;
}

body[data-admin-theme="haunted"] .admin-page .card::before,
body[data-admin-theme="haunted"] .admin-page .wide-card::before,
body[data-admin-theme="haunted"] .admin-page .admin-card::before,
body[data-admin-theme="haunted"] .admin-page .admin-section::before,
body[data-admin-theme="haunted"] .admin-page .nested-admin-section::before,
body[data-admin-theme="haunted"] .admin-page .admin-status-card::before,
body[data-admin-theme="haunted"] .admin-page .admin-item::before,
body[data-admin-theme="haunted"] .admin-page .team-admin-item::before,
body[data-admin-theme="haunted"] .admin-page .ctf-setup-card::before,
body[data-admin-theme="haunted"] .admin-page .map-panel::before,
body[data-admin-theme="haunted"] .admin-page .ready-requirements::before,
body[data-admin-theme="haunted"] .admin-page .join-qr-card::before,
body[data-admin-theme="haunted"] .admin-page .join-player-card::before,
body[data-admin-theme="haunted"] .admin-page .profile-modal::before {
  content: "";
  position: absolute;
  inset: auto 10px 8px 10px;
  height: 42%;
  pointer-events: none;
  opacity: 0.10;
  background: url("/assets/themes/haunted/haunted_card_graveyard_silhouette.png?v=35D8") center bottom / 100% 100% no-repeat;
  z-index: 0;
}

body[data-admin-theme="haunted"] .admin-page .card > *,
body[data-admin-theme="haunted"] .admin-page .wide-card > *,
body[data-admin-theme="haunted"] .admin-page .admin-card > *,
body[data-admin-theme="haunted"] .admin-page .admin-section > *,
body[data-admin-theme="haunted"] .admin-page .nested-admin-section > *,
body[data-admin-theme="haunted"] .admin-page .admin-status-card > *,
body[data-admin-theme="haunted"] .admin-page .admin-item > *,
body[data-admin-theme="haunted"] .admin-page .team-admin-item > *,
body[data-admin-theme="haunted"] .admin-page .ctf-setup-card > *,
body[data-admin-theme="haunted"] .admin-page .map-panel > *,
body[data-admin-theme="haunted"] .admin-page .ready-requirements > *,
body[data-admin-theme="haunted"] .admin-page .join-qr-card > *,
body[data-admin-theme="haunted"] .admin-page .join-player-card > *,
body[data-admin-theme="haunted"] .admin-page .profile-modal > * {
  position: relative;
  z-index: 1;
}

body[data-admin-theme="haunted"] .admin-page h1,
body[data-admin-theme="haunted"] .admin-page h2,
body[data-admin-theme="haunted"] .admin-page h3,
body[data-admin-theme="haunted"] .admin-page a,
body[data-admin-theme="haunted"] .admin-page .big-link {
  color: #cdb7e8 !important;
}

body[data-admin-theme="haunted"] .admin-page .admin-section h2,
body[data-admin-theme="haunted"] .admin-page .admin-section h3,
body[data-admin-theme="haunted"] .admin-page .nested-admin-section h3,
body[data-admin-theme="haunted"] .admin-page .join-qr-card h3,
body[data-admin-theme="haunted"] .admin-page .join-player-card h3 {
  background: linear-gradient(180deg, #cdb7e8, #8e63c7) !important;
  color: #050507 !important;
  box-shadow: 4px 4px 0 rgba(5, 5, 7, 0.88), 0 0 18px rgba(142, 99, 199, 0.24) !important;
}

body[data-admin-theme="haunted"] .admin-page button:not(.profile-icon-button):not(.profile-avatar-option),
body[data-admin-theme="haunted"] .admin-page .button-link,
body[data-admin-theme="haunted"] .admin-page .admin-tab-button,
body[data-admin-theme="haunted"] .admin-page .sub-tab-button,
body[data-admin-theme="haunted"] .admin-page .mini-button,
body[data-admin-theme="haunted"] .admin-page .team-edit-button,
body[data-admin-theme="haunted"] .admin-page .team-save-button,
body[data-admin-theme="haunted"] .admin-page .team-cancel-button {
  border-color: #050507 !important;
  background:
    linear-gradient(180deg, rgba(240, 237, 244, 0.18), transparent 42%),
    linear-gradient(180deg, #8e63c7, #3a244f) !important;
  color: #f7f3fb !important;
  text-shadow: none !important;
  box-shadow: 5px 5px 0 #050507, 0 0 22px rgba(142, 99, 199, 0.24) !important;
}

body[data-admin-theme="haunted"] .admin-page button:not(.profile-icon-button):not(.profile-avatar-option):hover,
body[data-admin-theme="haunted"] .admin-page .button-link:hover,
body[data-admin-theme="haunted"] .admin-page .admin-tab-button:hover,
body[data-admin-theme="haunted"] .admin-page .sub-tab-button:hover,
body[data-admin-theme="haunted"] .admin-page .mini-button:hover {
  background:
    linear-gradient(180deg, rgba(240, 237, 244, 0.28), transparent 42%),
    linear-gradient(180deg, #a37ada, #432b5c) !important;
  box-shadow: 7px 7px 0 #050507, 0 0 28px rgba(142, 99, 199, 0.30) !important;
}

body[data-admin-theme="haunted"] .admin-page .secondary,
body[data-admin-theme="haunted"] .admin-page .secondary-link,
body[data-admin-theme="haunted"] .admin-page .danger-outline-button,
body[data-admin-theme="haunted"] .admin-page .admin-tab-button:not(.active),
body[data-admin-theme="haunted"] .admin-page .sub-tab-button:not(.active) {
  background:
    linear-gradient(180deg, rgba(48, 43, 59, 0.98), rgba(17, 15, 22, 0.98)) !important;
  color: #f0edf4 !important;
  border-color: rgba(201, 194, 215, 0.58) !important;
}

body[data-admin-theme="haunted"] .admin-page .admin-tab-button.active,
body[data-admin-theme="haunted"] .admin-page .sub-tab-button.active,
body[data-admin-theme="haunted"] .admin-page button.primary,
body[data-admin-theme="haunted"] .admin-page .ready-button,
body[data-admin-theme="haunted"] .admin-page button.primary-button {
  background: linear-gradient(180deg, #cdb7e8, #8e63c7) !important;
  color: #050507 !important;
  border-color: #050507 !important;
}

body[data-admin-theme="haunted"] .admin-page .danger-button,
body[data-admin-theme="haunted"] .admin-page .danger-outline-button {
  background: linear-gradient(180deg, #9e4a64, #4f1f31) !important;
  color: #f7f3fb !important;
}

body[data-admin-theme="haunted"] .admin-page input,
body[data-admin-theme="haunted"] .admin-page select,
body[data-admin-theme="haunted"] .admin-page textarea {
  background: rgba(10, 9, 13, 0.94) !important;
  border-color: rgba(201, 194, 215, 0.58) !important;
  color: #f0edf4 !important;
}

body[data-admin-theme="haunted"] .admin-page .muted,
body[data-admin-theme="haunted"] .admin-page .field-help,
body[data-admin-theme="haunted"] .admin-page .input-help,
body[data-admin-theme="haunted"] .admin-page .map-help {
  color: rgba(185, 177, 195, 0.92) !important;
}



/* Phase 35D.7 — Haunted no-brown sweep.
   Some Windows host controls still inherited the old sepia/brown base CSS from
   styles.css through less-common container classes. Haunted must be grayscale,
   black, bone, and purple only, so this final pass pins all visible host cards,
   panels, tabs, pills, fields, and buttons back to Haunted colors. */
body[data-admin-theme="haunted"] .admin-page :is(
  .card,
  .wide-card,
  .admin-card,
  .admin-section,
  .nested-admin-section,
  .admin-panel,
  .admin-tabs,
  .admin-tab-panel,
  .sub-tab-bar,
  .sub-tab-panel,
  .status,
  .status-pill,
  .admin-status-card,
  .platform-status-panel,
  .platform-status-banner,
  .admin-item,
  .team-admin-item,
  .game-mode-settings-section,
  .game-mode-settings-group,
  .game-mode-setting-field,
  .ctf-setup-card,
  .ctf-setup-panel,
  .ctf-objective-item,
  .ready-requirements,
  .ready-requirements-panel,
  .map-panel,
  .map-status,
  .map-loading-message,
  .join-qr-card,
  .join-player-card,
  .join-player-row,
  .profile-modal,
  .profile-showcase-card,
  .profile-stat-card,
  .profile-avatar-current-row,
  .profile-avatar-grid,
  .team-edit-fields,
  .objective-location-grid,
  .objective-location-actions
) {
  color: #f0edf4 !important;
  border-color: rgba(201, 194, 215, 0.58) !important;
  background:
    linear-gradient(180deg, rgba(40, 37, 48, 0.96), rgba(12, 11, 16, 0.97)) !important;
  box-shadow: 5px 5px 0 rgba(5, 5, 7, 0.76), 0 0 22px rgba(142, 99, 199, 0.16) !important;
}

body[data-admin-theme="haunted"] .admin-page :is(
  .admin-tabs,
  .sub-tab-bar,
  .admin-tab-panel .admin-section + .admin-section,
  .nested-admin-section,
  hr
) {
  border-color: rgba(201, 194, 215, 0.34) !important;
  border-top-color: rgba(201, 194, 215, 0.34) !important;
}

body[data-admin-theme="haunted"] .admin-page :is(
  h1,
  h2,
  h3,
  .score,
  .admin-status-title,
  .scoreboard-section-title,
  .big-link,
  a
) {
  color: #cdb7e8 !important;
  text-shadow: 0 0 16px rgba(142, 99, 199, 0.28) !important;
}

body[data-admin-theme="haunted"] .admin-page :is(
  .muted,
  .field-help,
  .input-help,
  .map-help,
  .admin-item span,
  .tag-card span,
  .event-card span,
  .objective-card span,
  .capture-progress,
  .admin-status-label
) {
  color: rgba(185, 177, 195, 0.94) !important;
}

body[data-admin-theme="haunted"] .admin-page :is(
  button,
  .button-link,
  .secondary,
  .secondary-link,
  .mini-button,
  .small-button,
  .primary-button,
  .ready-button,
  .admin-tab-button,
  .sub-tab-button,
  .team-edit-button,
  .team-save-button,
  .team-cancel-button
):not(.profile-icon-button):not(.profile-avatar-option) {
  color: #f7f3fb !important;
  border: 2px solid #050507 !important;
  background:
    linear-gradient(180deg, rgba(240, 237, 244, 0.18), transparent 42%),
    linear-gradient(180deg, #8e63c7, #3a244f) !important;
  box-shadow: 5px 5px 0 rgba(5, 5, 7, 0.88), 0 0 22px rgba(142, 99, 199, 0.24) !important;
  text-shadow: none !important;
}

body[data-admin-theme="haunted"] .admin-page :is(
  button,
  .button-link,
  .secondary,
  .secondary-link,
  .mini-button,
  .small-button,
  .primary-button,
  .ready-button,
  .admin-tab-button,
  .sub-tab-button,
  .team-edit-button,
  .team-save-button,
  .team-cancel-button
):not(.profile-icon-button):not(.profile-avatar-option):hover {
  background:
    linear-gradient(180deg, rgba(240, 237, 244, 0.28), transparent 42%),
    linear-gradient(180deg, #a37ada, #432b5c) !important;
}

body[data-admin-theme="haunted"] .admin-page :is(
  .admin-tab-button:not(.active),
  .sub-tab-button:not(.active),
  .secondary,
  .secondary-link
) {
  color: #f0edf4 !important;
  border-color: rgba(201, 194, 215, 0.58) !important;
  background: linear-gradient(180deg, rgba(48, 43, 59, 0.98), rgba(17, 15, 22, 0.98)) !important;
}

body[data-admin-theme="haunted"] .admin-page :is(
  .admin-tab-button.active,
  .sub-tab-button.active,
  .primary-button,
  .ready-button,
  button.primary
) {
  color: #050507 !important;
  border-color: #050507 !important;
  background: linear-gradient(180deg, #cdb7e8, #8e63c7) !important;
}

body[data-admin-theme="haunted"] .admin-page :is(
  .danger-button,
  .danger-outline-button,
  .scoreboard-control-button.stop,
  .scoreboard-control-button.warning
) {
  color: #f7f3fb !important;
  background: linear-gradient(180deg, #9e4a64, #4f1f31) !important;
  border-color: #050507 !important;
}

body[data-admin-theme="haunted"] .admin-page :is(input, select, textarea, .readonly-input) {
  color: #f0edf4 !important;
  background: rgba(10, 9, 13, 0.94) !important;
  border-color: rgba(201, 194, 215, 0.58) !important;
}

body[data-admin-theme="haunted"] .admin-page :is(.success, .ready-requirements-ok, .requirement-met) {
  color: #d8eadb !important;
  background: rgba(80, 104, 84, 0.28) !important;
  border-color: rgba(175, 200, 177, 0.58) !important;
}

body[data-admin-theme="haunted"] .admin-page :is(.error, .ready-requirements-locked, .ready-requirements-warning, .requirement-missing) {
  color: #f2d6df !important;
  background: rgba(100, 42, 62, 0.30) !important;
  border-color: rgba(158, 74, 100, 0.62) !important;
}


/* Phase 35D.8 — final explicit Haunted nested-card cleanup. */
body[data-admin-theme="haunted"] .admin-page .game-mode-settings-fields,
body[data-admin-theme="haunted"] .admin-page .game-mode-setting-field,
body[data-admin-theme="haunted"] .admin-page .ready-requirements li,
body[data-admin-theme="haunted"] .admin-page .admin-list,
body[data-admin-theme="haunted"] .admin-page .join-player-row,
body.theme-haunted .admin-page .game-mode-settings-fields,
body.theme-haunted .admin-page .game-mode-setting-field,
body.theme-haunted .admin-page .ready-requirements li,
body.theme-haunted .admin-page .admin-list,
body.theme-haunted .admin-page .join-player-row {
  color: #f0edf4 !important;
  border-color: rgba(201, 194, 215, 0.58) !important;
  background: linear-gradient(180deg, rgba(48, 43, 59, 0.96), rgba(16, 15, 21, 0.97)) !important;
  box-shadow: 4px 4px 0 rgba(5, 5, 7, 0.72), 0 0 18px rgba(142, 99, 199, 0.14) !important;
}

body[data-admin-theme="haunted"] .admin-page .requirement-met .requirement-icon,
body.theme-haunted .admin-page .requirement-met .requirement-icon {
  background: #afc8b1 !important;
  color: #050507 !important;
  border-color: #050507 !important;
}

body[data-admin-theme="haunted"] .admin-page .requirement-missing .requirement-icon,
body.theme-haunted .admin-page .requirement-missing .requirement-icon {
  background: #cdb7e8 !important;
  color: #050507 !important;
  border-color: #050507 !important;
}
