/* ============================================ */
/* HL2 RP INTERACTIVE MAP - THEME STYLES */
/* ============================================ */
/* This file contains faction-specific color schemes */
/* Themes are switched by changing the body class: */
/* - .theme-combine (Combine/Overwatch - Blue/Cyan) */
/* - .theme-rebel (Resistance/Rebels - Orange/Amber) */
/* ============================================ */

/* ============================================ */
/* COMBINE THEME (Default) */
/* Digital, militaristic, oppressive aesthetic */
/* Primary Color: Blue/Cyan (#4a9eff) - Matches HL2 Combine HUD */
/* ============================================ */
body.theme-combine {
    --theme-primary: #4a9eff;
    --theme-secondary: #7ab8ff;
    --theme-tertiary: #a3d1ff;
    --theme-bg: #0a0e12;
    --theme-bg-light: #1a2228;
    --theme-text: #d0e8ff;
    --theme-text-dim: #8899aa;
    --theme-border: #4a9eff;
    --theme-shadow: rgba(74, 158, 255, 0.4);
    --polygon-color: #4a9eff;
    --polygon-pattern: url(#pattern-combine);
}

/* Combine-specific button styles */
body.theme-combine .btn:hover {
    box-shadow: 0 4px 12px rgba(74, 158, 255, 0.5);
}

body.theme-combine .btn.active {
    box-shadow: 0 0 15px rgba(74, 158, 255, 0.7);
}

/* Combine-specific marker glow */
body.theme-combine .custom-marker {
    filter: drop-shadow(0 0 4px rgba(74, 158, 255, 0.9));
}

/* Combine-specific info panel glow */
body.theme-combine #info-panel.open {
    box-shadow: -4px 0 20px rgba(74, 158, 255, 0.4);
}

/* Combine-specific scrollbar */
body.theme-combine ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #4a9eff 0%, #2266cc 100%);
}

/* Combine breadcrumb active color */
body.theme-combine .breadcrumb-item:hover,
body.theme-combine .breadcrumb-item.active {
    color: #4a9eff;
}

/* Combine stat values */
body.theme-combine .stat-value {
    color: #4a9eff;
    text-shadow: 0 0 8px rgba(74, 158, 255, 0.6);
}

/* Combine location name */
body.theme-combine #location-name {
    color: #4a9eff;
    text-shadow: 0 0 10px rgba(74, 158, 255, 0.7);
}

/* Combine controls bar */
body.theme-combine #controls-bar {
    border-bottom-color: #4a9eff;
    background: linear-gradient(180deg, rgba(10, 14, 18, 0.95) 0%, rgba(15, 20, 28, 0.95) 100%);
}

/* ============================================ */
/* REBEL THEME (Resistance) */
/* Hand-drawn, scrappy, underground aesthetic */
/* Primary Color: Orange/Amber (#ff8c1a) - Matches Lambda logo */
/* ============================================ */
body.theme-rebel {
    --theme-primary: #ff8c1a;
    --theme-secondary: #ffaa52;
    --theme-tertiary: #ffc785;
    --theme-bg: #12100a;
    --theme-bg-light: #221e16;
    --theme-text: #ffe8cc;
    --theme-text-dim: #aa9977;
    --theme-border: #ff8c1a;
    --theme-shadow: rgba(255, 140, 26, 0.4);
    --polygon-color: #ff8c1a;
    --polygon-pattern: url(#pattern-rebel);
}

/* Rebel-specific button styles */
body.theme-rebel .btn:hover {
    box-shadow: 0 4px 12px rgba(255, 140, 26, 0.5);
}

body.theme-rebel .btn.active {
    box-shadow: 0 0 15px rgba(255, 140, 26, 0.7);
}

/* Rebel-specific marker glow */
body.theme-rebel .custom-marker {
    filter: drop-shadow(0 0 4px rgba(255, 140, 26, 0.9));
}

/* Rebel-specific info panel glow */
body.theme-rebel #info-panel.open {
    box-shadow: -4px 0 20px rgba(255, 140, 26, 0.4);
}

/* Rebel-specific scrollbar */
body.theme-rebel ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #ff8c1a 0%, #cc6600 100%);
}

/* Rebel breadcrumb active color */
body.theme-rebel .breadcrumb-item:hover,
body.theme-rebel .breadcrumb-item.active {
    color: #ff8c1a;
}

/* Rebel stat values */
body.theme-rebel .stat-value {
    color: #ff8c1a;
    text-shadow: 0 0 8px rgba(255, 140, 26, 0.6);
}

/* Rebel location name */
body.theme-rebel #location-name {
    color: #ff8c1a;
    text-shadow: 0 0 10px rgba(255, 140, 26, 0.7);
}

/* Rebel controls bar */
body.theme-rebel #controls-bar {
    border-bottom-color: #ff8c1a;
    background: linear-gradient(180deg, rgba(18, 16, 10, 0.95) 0%, rgba(28, 24, 16, 0.95) 100%);
}

/* ============================================ */
/* POLYGON THEME STYLES */
/* Applied dynamically by polygons.js */
/* Note: stroke color is set by JavaScript to support custom polygon colors */
/* ============================================ */

/* Combine polygon styling */
body.theme-combine .leaflet-interactive.polygon-hover {
    /* stroke color inherited from JS (custom or theme) */
    stroke-width: 4;
    stroke-opacity: 0.9;
    fill: url(#pattern-combine);
    fill-opacity: 0.3;
}

body.theme-combine .leaflet-interactive.polygon-default {
    /* stroke color inherited from JS (custom or theme) */
    stroke-width: 2;
    stroke-opacity: 0.6;
    fill-opacity: 0.1;
}

/* Rebel polygon styling */
body.theme-rebel .leaflet-interactive.polygon-hover {
    /* stroke color inherited from JS (custom or theme) */
    stroke-width: 4;
    stroke-opacity: 0.9;
    fill: url(#pattern-rebel);
    fill-opacity: 0.3;
}

body.theme-rebel .leaflet-interactive.polygon-default {
    /* stroke color inherited from JS (custom or theme) */
    stroke-width: 2;
    stroke-opacity: 0.6;
    fill-opacity: 0.1;
}

/* ============================================ */
/* TOOLTIP THEME OVERRIDES */
/* ============================================ */
body.theme-combine .leaflet-tooltip {
    border-color: #4a9eff;
    box-shadow: 0 4px 12px rgba(74, 158, 255, 0.4);
}

body.theme-rebel .leaflet-tooltip {
    border-color: #ff8c1a;
    box-shadow: 0 4px 12px rgba(255, 140, 26, 0.4);
}

/* ============================================ */
/* FACTION DISPLAY BADGE */
/* ============================================ */
body.theme-combine #faction-display {
    border-left-color: #4a9eff;
    background: linear-gradient(90deg, rgba(74, 158, 255, 0.15) 0%, rgba(40, 40, 40, 0.6) 100%);
}

body.theme-rebel #faction-display {
    border-left-color: #ff8c1a;
    background: linear-gradient(90deg, rgba(255, 140, 26, 0.15) 0%, rgba(40, 40, 40, 0.6) 100%);
}

/* ============================================ */
/* STAT BOX THEME ACCENTS */
/* ============================================ */
body.theme-combine .stat-box {
    border-color: rgba(74, 158, 255, 0.2);
}

body.theme-combine .stat-box:hover {
    border-color: rgba(74, 158, 255, 0.5);
    background-color: rgba(20, 30, 40, 0.6);
}

body.theme-rebel .stat-box {
    border-color: rgba(255, 140, 26, 0.2);
}

body.theme-rebel .stat-box:hover {
    border-color: rgba(255, 140, 26, 0.5);
    background-color: rgba(40, 30, 20, 0.6);
}

/* ============================================ */
/* INFO SECTION HEADERS */
/* ============================================ */
body.theme-combine .info-section h3 {
    color: #7ab8ff;
}

body.theme-rebel .info-section h3 {
    color: #ffaa52;
}

/* ============================================ */
/* BUTTON FOCUS STATES */
/* ============================================ */
body.theme-combine .btn:focus,
body.theme-combine #language-selector:focus {
    box-shadow: 0 0 0 2px rgba(74, 158, 255, 0.3);
}

body.theme-rebel .btn:focus,
body.theme-rebel #language-selector:focus {
    box-shadow: 0 0 0 2px rgba(255, 140, 26, 0.3);
}

/* ============================================ */
/* LANGUAGE SELECTOR THEME */
/* ============================================ */
body.theme-combine #language-selector:hover {
    border-color: #7ab8ff;
}

body.theme-rebel #language-selector:hover {
    border-color: #ffaa52;
}

/* ============================================ */
/* INFO PANEL BORDER */
/* ============================================ */
body.theme-combine #info-panel {
    border-left-color: #4a9eff;
}

body.theme-rebel #info-panel {
    border-left-color: #ff8c1a;
}

/* Mobile view - top border instead of left */
@media screen and (max-width: 768px) {
    body.theme-combine #info-panel {
        border-left: none;
        border-top: 2px solid #4a9eff;
    }

    body.theme-rebel #info-panel {
        border-left: none;
        border-top: 2px solid #ff8c1a;
    }
}

/* ============================================ */
/* CLOSE BUTTON THEME */
/* ============================================ */
body.theme-combine #info-panel-close:hover {
    color: #4a9eff;
}

body.theme-rebel #info-panel-close:hover {
    color: #ff8c1a;
}

/* ============================================ */
/* DRILL-DOWN BUTTON THEME */
/* ============================================ */
body.theme-combine #btn-drill-down {
    background: linear-gradient(135deg, rgba(74, 158, 255, 0.2) 0%, rgba(40, 40, 40, 0.8) 100%);
    border-color: #4a9eff;
}

body.theme-combine #btn-drill-down:hover {
    background: linear-gradient(135deg, #4a9eff 0%, #2266cc 100%);
    box-shadow: 0 6px 20px rgba(74, 158, 255, 0.5);
}

body.theme-rebel #btn-drill-down {
    background: linear-gradient(135deg, rgba(255, 140, 26, 0.2) 0%, rgba(40, 40, 40, 0.8) 100%);
    border-color: #ff8c1a;
}

body.theme-rebel #btn-drill-down:hover {
    background: linear-gradient(135deg, #ff8c1a 0%, #cc6600 100%);
    box-shadow: 0 6px 20px rgba(255, 140, 26, 0.5);
}

/* ============================================ */
/* DEBUG CONSOLE THEME */
/* ============================================ */
body.theme-combine #debug-info {
    border-color: rgba(74, 158, 255, 0.3);
    color: #7ab8ff;
}

body.theme-rebel #debug-info {
    border-color: rgba(255, 140, 26, 0.3);
    color: #ffaa52;
}

/* ============================================ */
/* ANIMATION OVERRIDES */
/* ============================================ */

/* Combine marker pulse uses blue glow */
@keyframes combineMarkerPulse {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 0 3px #4a9eff);
    }
    50% {
        transform: scale(1.1);
        filter: drop-shadow(0 0 8px #4a9eff);
    }
}

body.theme-combine .custom-marker {
    animation: combineMarkerPulse 2s ease-in-out infinite;
}

/* Rebel marker pulse uses orange glow */
@keyframes rebelMarkerPulse {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 0 3px #ff8c1a);
    }
    50% {
        transform: scale(1.1);
        filter: drop-shadow(0 0 8px #ff8c1a);
    }
}

body.theme-rebel .custom-marker {
    animation: rebelMarkerPulse 2s ease-in-out infinite;
}



/* ============================================ */
/* REBEL THEME - WOOD TABLE BACKGROUND */
/* ============================================ */
body.theme-rebel #map-container {
    background-image: url('../../assets/textures/wood_table.jpg');
    background-size: auto;
    background-repeat: repeat;
    background-color: #3a2a1a;
}

body.theme-rebel .leaflet-container {
    background: transparent !important;
}

body.theme-rebel .leaflet-image-layer {
    filter: drop-shadow(0 4px 16px rgba(0, 0, 0, 0.7))
            drop-shadow(0 8px 40px rgba(0, 0, 0, 0.5));
}

/* ============================================ */
/* COMBINE THEME - CRT EFFECT */
/* ============================================ */
body.theme-combine #map-container::after {
    content: '';
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        to bottom,
        transparent 0px,
        transparent 2px,
        rgba(255, 255, 255, 0.04) 2px,
        rgba(255, 255, 255, 0.04) 4px
    );
    pointer-events: none;
    z-index: 1000;
}

@keyframes combine-crt-flicker {
    0%   { filter: brightness(1); }
    50%  { filter: brightness(0.92); }
    100% { filter: brightness(1); }
}

body.theme-combine .leaflet-image-layer {
    animation: combine-crt-flicker 6s ease-in-out infinite;
}

/* ============================================ */
/* FUTURE: ADMIN EDITOR THEME SUPPORT */
/* (Commented out - will be activated when editor.js is built) */
/* ============================================ */
/*
body.theme-combine .editor-panel {
    border-color: #4a9eff;
    background: rgba(10, 15, 20, 0.95);
}

body.theme-rebel .editor-panel {
    border-color: #ff8c1a;
    background: rgba(15, 12, 10, 0.95);
}
*/