/*
 * Tree Gaming Malta — Live Map theme
 * Loaded last so presentation changes cannot disturb existing map behaviour.
 */

:root {
  color-scheme: dark;
  --tree-ink: #f3efe7;
  --tree-muted: #aaa69d;
  --tree-panel: rgba(14, 17, 18, .975);
  --tree-panel-soft: #171b1c;
  --tree-line: rgba(218, 170, 73, .26);
  --tree-accent: #d9aa49;
  --tree-accent-strong: #f0c765;
  --tree-cyan: #d9aa49;
  --tree-shadow: 0 18px 48px rgba(0, 0, 0, .55);
  --tg-black: #050809;
  --tg-charcoal: #0d1112;
  --tg-surface: #141819;
  --tg-surface-raised: #1a1f20;
  --tg-gold: #d9aa49;
  --tg-gold-bright: #f3ce74;
  --tg-gold-deep: #875a17;
  --tg-cream: #f3efe7;
  --tg-muted: #aaa69d;
  --tg-border: rgba(218, 170, 73, .29);
}

html,
body {
  background: var(--tg-black);
  color: var(--tg-cream);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

body::before {
  background:
    linear-gradient(rgba(3, 6, 7, .88), rgba(3, 6, 7, .93)),
    url('../images/websitebackground.png') center / cover fixed no-repeat;
}

button,
a,
input,
select,
textarea,
[role="button"] {
  -webkit-tap-highlight-color: transparent;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid rgba(243, 206, 116, .48) !important;
  outline-offset: 2px;
}

/* Header and live status */
#topNavBar {
  min-height: 64px;
  background-image:
    linear-gradient(90deg, rgba(5, 8, 9, .97), rgba(18, 19, 17, .88), rgba(5, 8, 9, .97)),
    url('../images/livemap.png');
  background-position: center;
  border-top: 2px solid rgba(217, 170, 73, .72);
  border-bottom: 1px solid var(--tg-border);
  box-shadow: 0 8px 30px rgba(0, 0, 0, .58);
}

.navCenter {
  color: var(--tg-cream);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  letter-spacing: .045em;
  text-shadow: 0 2px 18px #000, 0 1px 0 #000;
}

#mainWebsiteButton,
#pollButton,
#supportButton,
#toolsButton,
#steamLogoutButton {
  border-color: var(--tg-border) !important;
  color: var(--tg-cream) !important;
  background: linear-gradient(180deg, rgba(35, 37, 35, .96), rgba(13, 16, 17, .98)) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .055), 0 5px 16px rgba(0, 0, 0, .34) !important;
}

#mainWebsiteButton:hover,
#pollButton:hover,
#supportButton:hover,
#toolsButton:hover,
#steamLogoutButton:hover {
  border-color: rgba(243, 206, 116, .7) !important;
  color: var(--tg-gold-bright) !important;
  background: linear-gradient(180deg, rgba(55, 48, 33, .98), rgba(20, 19, 16, .98)) !important;
}

#toolsButton {
  color: #181205 !important;
  border-color: #e6b74f !important;
  background: linear-gradient(135deg, #f0c965, #bd791b) !important;
}

#toolsButton:hover,
#toolsButton:focus-visible {
  color: var(--tg-cream) !important;
  border-color: #f4cf72 !important;
  background: linear-gradient(135deg, #b9781c, #70430f) !important;
}

#steamLoginButton {
  min-height: 42px;
  box-sizing: border-box;
  border: 1px solid var(--tg-border);
  color: var(--tg-cream);
  background: linear-gradient(180deg, #20282c, #101618);
  box-shadow: inset 0 1px rgba(255, 255, 255, .05), 0 5px 16px rgba(0, 0, 0, .32);
}

#steamLoginButton:hover {
  border-color: #6db6df;
  background: linear-gradient(180deg, #29383f, #151e22);
}

#steamUserBox {
  border-color: var(--tg-border);
  background: rgba(7, 10, 11, .94);
}

#steamUserAvatar { border-color: var(--tg-gold); }

#serverStatsBar {
  background: linear-gradient(90deg, #090d0e, #171914, #090d0e);
  border-bottom-color: var(--tg-border);
  color: #d8d3ca;
}

#serverStatsBar.online {
  background: linear-gradient(90deg, #090d0e, #172019, #090d0e);
  border-bottom-color: rgba(98, 175, 104, .38);
}

#serverStatsBar.offline {
  background: linear-gradient(90deg, #120a0b, #2c1013, #120a0b);
}

.server-stat-item { color: #d5d0c7; }
.server-stat-item strong { color: var(--tg-gold-bright); }
.server-stat-divider { color: rgba(217, 170, 73, .32); }

#hordeStatus {
  color: #ffd878;
  border-color: rgba(217, 170, 73, .3);
  background: rgba(151, 100, 19, .15);
}

/* Map tools and native Leaflet controls */
#tab_map {
  background:
    linear-gradient(rgba(3, 7, 8, .34), rgba(3, 7, 8, .5)),
    url('../images/websitebackground.png') center / cover fixed no-repeat;
}

#combinedSearchContainer {
  color: var(--tg-cream);
  background:
    radial-gradient(circle at 8% 0, rgba(217, 170, 73, .09), transparent 30%),
    linear-gradient(160deg, rgba(20, 24, 25, .99), rgba(8, 11, 12, .99));
  border-color: var(--tg-border);
  box-shadow: 0 22px 64px rgba(0, 0, 0, .68);
  scrollbar-color: #825e25 #0b0e0f;
}

#combinedSearchContainer h2 {
  color: var(--tg-cream);
  font-family: Georgia, "Times New Roman", serif;
}

#combinedSearchContainer h2::after { color: var(--tg-muted); }

#closeSearchContainer {
  border: 1px solid rgba(217, 170, 73, .24);
  color: #ded8ce;
  background: rgba(255, 255, 255, .045);
}

#closeSearchContainer:hover {
  color: var(--tg-gold-bright);
  background: rgba(217, 170, 73, .12);
}

#searchToggleBar {
  border-color: #e0af46;
  color: #181105;
  background: linear-gradient(135deg, #f0c863, #b97419);
  box-shadow: 0 9px 26px rgba(0, 0, 0, .48);
}

#searchToggleBar:hover { background: linear-gradient(135deg, #f6d67c, #cf8b24); }

.searchSection {
  border-color: rgba(217, 170, 73, .18);
  background: rgba(22, 26, 27, .94);
}

.sectionHeader { color: #eee9df; }
.sectionHeader:hover { background: rgba(217, 170, 73, .075); }
.sectionHeader .arrow { color: #c89b43; }
.sectionContent { color: var(--tg-muted); }
.searchSection label { color: #d8d4cc; }
.searchSection input[type="checkbox"] { accent-color: var(--tg-gold); }

.searchSection input[type="text"],
.searchSection input[type="search"],
.searchSection input[type="number"] {
  border-color: rgba(217, 170, 73, .2);
  color: #f4f0e8;
  background: #090c0d;
}

.searchSection input::placeholder { color: #77766f; }

.searchSection input:focus {
  border-color: #c9993b;
  box-shadow: 0 0 0 3px rgba(217, 170, 73, .12);
}

.searchSection button {
  border-color: rgba(217, 170, 73, .25);
  color: #eee9df;
  background: linear-gradient(180deg, #242728, #151819);
}

.searchSection button:hover {
  border-color: rgba(243, 206, 116, .55);
  color: var(--tg-gold-bright);
  background: #29271f;
}

#poiSuggestions,
#playerSuggestions,
#vehicleSuggestions,
#landClaimSuggestions,
#droneSuggestions,
#playerPathSuggestions,
#selectedRegionsList,
#claimRegionResults,
#shopItemSuggestions {
  border-color: rgba(217, 170, 73, .2) !important;
  color: #e6e0d6 !important;
  background: #090c0d !important;
}

.poiSuggestion:hover,
.playerSuggestion:hover,
.vehicleSuggestion:hover,
.landClaimSuggestion:hover,
.droneSuggestion:hover,
.playerPathSuggestion:hover {
  color: #fff !important;
  background: rgba(142, 95, 24, .3) !important;
}

#shopsSection .sectionContent > div[style*="color:#555"],
#regionSearchStatus { color: var(--tg-muted) !important; }

.shopSearchGlyph,
.shopResultIcon,
.shopResultDestination span,
.shopResultCount { color: var(--tg-gold-bright); }

#shopItemSearch:focus {
  border-color: #c9993b;
  box-shadow: 0 0 0 3px rgba(217, 170, 73, .13);
}

.shopItemSearchResult:hover,
.shopItemSearchResult:focus {
  background: linear-gradient(90deg, rgba(142, 95, 24, .34), rgba(142, 95, 24, .08)) !important;
}

.shopResultIcon { border-color: rgba(217, 170, 73, .25); }
.shopResultCount { background: rgba(142, 95, 24, .25); }

.leaflet-bar,
.leaflet-control-layers,
.leaflet-control-attribution {
  border-color: var(--tg-border) !important;
  color: #bbb5aa !important;
  background: rgba(9, 12, 13, .94) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .44) !important;
}

.leaflet-bar a,
.leaflet-bar a:hover {
  border-bottom-color: rgba(217, 170, 73, .2) !important;
  color: #eee8dd !important;
  background: #15191a !important;
}

.leaflet-bar a:hover { color: var(--tg-gold-bright) !important; background: #2a271f !important; }
.leaflet-control-attribution a { color: var(--tg-gold-bright) !important; }

.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
  color: #ddd7cc;
  background: #141819;
}

.leaflet-popup-content-wrapper {
  border: 1px solid var(--tg-border);
  box-shadow: 0 16px 45px rgba(0, 0, 0, .62);
}

.leaflet-popup-content,
.leaflet-popup-content div,
.leaflet-popup-content span { color: #ddd7cc; }
.leaflet-popup-content strong { color: var(--tg-gold-bright); }
.leaflet-popup-content a { color: #f0c765; }
.leaflet-popup-close-button { color: #c9c1b5 !important; }

.leaflet-popup-content button,
.copyCoordsBtn,
.viewVendingItemsBtn,
.vmTabBtn {
  border: 1px solid rgba(217, 170, 73, .32) !important;
  color: #f1ece3 !important;
  background: linear-gradient(180deg, #292b29, #151819) !important;
}

.leaflet-popup-content button:hover,
.copyCoordsBtn:hover,
.viewVendingItemsBtn:hover,
.vmTabBtn:hover,
.vmTabBtn.active {
  color: #1a1204 !important;
  background: linear-gradient(135deg, #f1ca66, #bb7719) !important;
}

/* Dialogs, polls and vending inventory */
#footerBar {
  border-color: var(--tg-border);
  color: #918e87;
  background: rgba(7, 10, 11, .92);
}

#footerMessage { color: var(--tg-gold-bright); }

#vendingModalOverlay,
#claimRemoveModal,
.tree-poll-overlay,
.tree-admin-overlay { background: rgba(2, 4, 5, .84); }

#vendingModal,
.claim-remove-dialog,
.tree-poll-dialog {
  border-color: rgba(217, 170, 73, .42);
  color: var(--tg-cream);
  background:
    radial-gradient(circle at 90% 0, rgba(217, 170, 73, .1), transparent 34%),
    linear-gradient(150deg, #171b1c, #090c0d);
}

#vendingModalHeader {
  border-bottom: 1px solid var(--tg-border);
  background: linear-gradient(135deg, #3a2c17, #171712);
}

#vendingModalBody {
  color: #dcd7cd;
  background: #0c1011;
}

.vendingSummaryCard,
.vendingItemsList,
.vendingEmptyState {
  border-color: rgba(217, 170, 73, .2);
  color: #dcd7cd;
  background: #171b1c;
}

.vendingSummaryCard strong,
.vendingItemRow .name { color: #f2ede4; }
.vendingSummaryLabel,
.vendingItemRow .meta { color: #96938c; }
.vendingTeleportCard { background: rgba(119, 78, 18, .18); }
.vendingTeleportCard strong { color: var(--tg-gold-bright); }
.vendingItemRow { border-bottom-color: rgba(217, 170, 73, .13); }
.vendingItemRow.searchMatch { background: rgba(119, 78, 18, .22); box-shadow: inset 3px 0 var(--tg-gold); }

.claim-remove-dialog-header,
.tree-poll-kicker { color: var(--tg-gold-bright); }
.tree-poll-header { border-bottom-color: rgba(217, 170, 73, .17); }
.tree-poll-time { border-color: rgba(217, 170, 73, .3); color: var(--tg-gold-bright); background: rgba(119, 78, 18, .18); }
.tree-poll-results { border-color: rgba(217, 170, 73, .17); background: rgba(0, 0, 0, .27); }

/* Full tools/admin experience */
.tree-admin {
  --admin-gold: #d9aa49;
  --admin-gold-soft: #f3ce74;
  --admin-teal: #ba8428;
  --admin-ink: #0d1011;
  --admin-panel: #15191a;
  --admin-panel-2: #1b2021;
  border-color: rgba(217, 170, 73, .46);
  color: #eee9df;
  background:
    radial-gradient(circle at 92% 3%, rgba(217, 170, 73, .13), transparent 34%),
    linear-gradient(145deg, #141819, #080b0c);
}

.tree-admin-header,
.tree-admin-nav {
  border-color: rgba(217, 170, 73, .14);
  background: rgba(7, 10, 11, .78);
}

.tree-admin-brand h2,
.tree-admin-panel-heading h3,
.tree-discord-feature-head h4,
.tree-player-login-card h3 {
  color: #f2ede3;
  font-family: Georgia, "Times New Roman", serif;
}

.tree-admin-brand-mark {
  color: #171004;
  background: linear-gradient(145deg, #f2cd70, #b97418);
}

.tree-admin-brand p,
.tree-admin-panel-heading p,
.tree-player-panel .tree-player-description { color: #9e9a92; }

.tree-admin-nav-label { color: #807c74; }
.tree-admin-nav button { color: #aaa69e; }
.tree-admin-nav button:hover { background: rgba(217, 170, 73, .07); }
.tree-admin-nav button.is-active {
  border-color: rgba(217, 170, 73, .34);
  background: linear-gradient(90deg, rgba(151, 100, 19, .3), rgba(151, 100, 19, .06));
}

.tree-admin-card,
.tree-player-login-card,
.tree-admin-action-dialog {
  border-color: rgba(217, 170, 73, .15);
  background: linear-gradient(145deg, rgba(27, 32, 33, .98), rgba(13, 17, 18, .98));
}

.tree-admin input[type="text"],
.tree-admin input[type="number"],
.tree-admin input[type="search"],
.tree-admin input[type="datetime-local"],
.tree-admin input[type="password"],
.tree-admin textarea,
.tree-admin select,
.tree-admin .tree-discord-field input {
  border-color: rgba(217, 170, 73, .2);
  color: #f0ece4;
  background: #090c0d;
}

.tree-admin input:focus,
.tree-admin textarea:focus,
.tree-admin select:focus {
  border-color: #c69538;
  box-shadow: 0 0 0 3px rgba(217, 170, 73, .11);
}

.tree-admin-btn.is-primary,
.tree-player-market-button {
  border-color: #edc45f;
  color: #181105;
  background: linear-gradient(135deg, #f2cc6b, #b87318);
}

.tree-admin-btn.is-teal {
  border-color: rgba(217, 170, 73, .55);
  color: #f7e6bb;
  background: rgba(128, 85, 21, .72);
}

.tree-admin-btn.is-quiet { color: #b9b4aa; background: rgba(255, 255, 255, .035); }
.tree-admin-switch input:checked + span { background: #b27a21; }
.tree-admin-countdown-tool,
.tree-admin-item-identity,
.tree-discord-toggle-row { border-color: rgba(217, 170, 73, .22); background: rgba(105, 70, 18, .16); }

.tree-discord-tabs {
  border-bottom-color: rgba(217, 170, 73, .17);
  background: rgba(9, 12, 13, .97);
}

.tree-discord-tabs button {
  border-color: #39362f;
  color: #aaa59b;
  background: #171a1a;
}

.tree-discord-tabs button:hover { border-color: #746344; color: #fff; }
.tree-discord-tabs button.is-active { border-color: #e9b94e; color: #171004; background: linear-gradient(135deg, #f1ca67, #b97418); }

.tree-discord-summary-card,
.tree-discord-geo-stats > div,
.tree-player-stat,
.tree-player-setting-badge {
  border-color: rgba(217, 170, 73, .13);
  background: linear-gradient(150deg, rgba(28, 32, 32, .96), rgba(12, 16, 17, .96));
}

.tree-discord-summary-card.is-ready { border-top-color: #72b679; }
.tree-discord-summary-card.is-warning { border-top-color: var(--tg-gold); }
.tree-discord-previews figure > div { border-color: rgba(217, 170, 73, .16); background: #080b0c; }
.tree-discord-previews .is-machine-locked {
  display: grid;
  min-height: 140px;
  place-content: center;
  gap: 7px;
  color: #8f8a80;
  text-align: center;
}
.tree-discord-previews .is-machine-locked > span { color: #bd8a31; font-size: 24px; }
.tree-discord-previews .is-machine-locked small { font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }

.tree-discord-machine-guard {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin: 0 0 13px;
  padding: 12px 14px;
  border: 1px solid;
  border-radius: 11px;
  line-height: 1.45;
}

.tree-discord-machine-icon {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  flex: 0 0 25px;
  border-radius: 50%;
  font-weight: 900;
}

.tree-discord-machine-guard > div > strong,
.tree-discord-machine-guard > div > span { display: block; }
.tree-discord-machine-guard > div > strong { margin-bottom: 2px; color: #f3eee5; }
.tree-discord-machine-guard > div > span { color: #aaa59c; font-size: 11px; }
.tree-discord-machine-guard code { color: #f2cb69; font-family: Consolas, monospace; }
.tree-discord-machine-guard.is-authorized { border-color: rgba(83, 170, 103, .34); background: rgba(37, 108, 54, .13); }
.tree-discord-machine-guard.is-authorized .tree-discord-machine-icon { color: #bde7c5; background: rgba(70, 157, 90, .25); }
.tree-discord-machine-guard.is-blocked { border-color: rgba(220, 79, 83, .4); background: rgba(137, 32, 38, .17); }
.tree-discord-machine-guard.is-blocked .tree-discord-machine-icon { color: #ffd1d2; background: rgba(202, 67, 73, .28); }
.tree-discord-machine-guard.is-pending { border-color: rgba(217, 170, 73, .42); background: rgba(119, 78, 18, .2); }
.tree-discord-machine-guard.is-pending .tree-discord-machine-icon { color: #ffe1a0; background: rgba(190, 129, 31, .3); }

.tree-discord-machine-values {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.tree-discord-machine-values > div,
.tree-discord-detected-macs {
  padding: 13px 14px;
  border: 1px solid rgba(217, 170, 73, .16);
  border-radius: 10px;
  background: rgba(7, 10, 11, .48);
}

.tree-discord-machine-values span,
.tree-discord-detected-macs > span {
  display: block;
  margin-bottom: 5px;
  color: #8f8b83;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.tree-discord-machine-values strong { color: #f1ca68; font-size: 13px; overflow-wrap: anywhere; }
.tree-discord-machine-values code,
.tree-discord-detected-macs code { font-family: Consolas, "Cascadia Mono", monospace; }
.tree-discord-detected-macs > div { display: flex; flex-wrap: wrap; gap: 7px; }
.tree-discord-detected-macs small { display: block; margin-top: 8px; color: #817d75; font-size: 10px; }
.tree-discord-detected-macs .tree-admin-btn { min-height: 38px; }

.tree-discord-runtime-detail { color: #918d85; background: rgba(0, 0, 0, .22); }
.tree-player-market-card { border-color: rgba(217, 170, 73, .3); }
.tree-player-profile-name,
.tree-player-rank-badge,
.tree-player-inventory h4 { color: var(--tg-gold-bright); }

/* Scrollbars */
#combinedSearchContainer,
.tree-admin-content,
.tree-admin-nav,
#vendingModalBody,
.tree-poll-dialog,
#shopItemSuggestions {
  scrollbar-width: thin;
  scrollbar-color: #815e26 #0a0d0e;
}

@media screen and (max-width: 860px) {
  #topNavBar { min-height: 60px; border-top-width: 1px; }
  #tab_map { height: calc(100dvh - 102px); }
  #mainWebsiteButton,
  #pollButton,
  #supportButton,
  #toolsButton { min-height: 44px; }
}

@media screen and (max-width: 600px) {
  #topNavBar {
    min-height: 62px;
    padding-right: max(9px, env(safe-area-inset-right));
    padding-left: max(9px, env(safe-area-inset-left));
  }

  #steamLoginButton { max-width: 116px; padding-inline: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #serverStatsBar { min-height: 44px; }
  #tab_map { height: calc(100dvh - 106px); }
  #combinedSearchContainer { border-color: rgba(217, 170, 73, .42); }
  #searchToggleBar { min-height: 46px; }
  .tree-discord-machine-guard { padding: 11px; }
  .tree-discord-machine-values { grid-template-columns: 1fr; }
  .tree-discord-detected-macs .tree-admin-btn { width: 100%; min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  #searchToggleBar,
  #topNavBar,
  .tree-admin,
  .tree-poll-dialog { scroll-behavior: auto; }
}