/* === NetRunner AR — Master HUD Layer (loaded LAST) === */

/* === MAP BACKGROUND (z-index 0) === */
#map-container {
    position:fixed !important;
    top:0 !important; left:0 !important; right:0 !important; bottom:0 !important;
    width:100vw !important; height:100vh !important;
    z-index:0 !important;
    border:none !important; border-radius:0 !important;
    background:#0d1117 !important;
    isolation:isolate !important;
}
#game-map { width:100% !important; height:100% !important; }
.leaflet-pane { z-index:2 !important; }
.leaflet-top, .leaflet-bottom { z-index:3 !important; }
.leaflet-control { z-index:4 !important; }
.map-label { display:none !important; }

/* === TOP BAR (z-index 10000) === */
.top-bar { z-index:10000 !important; position:relative !important; }
.coord-strip { z-index:10000 !important; position:relative !important; }

/* === BOTTOM HUD (z-index 10000) === */
#ingress-bottom-hud {
    position:fixed !important; bottom:0 !important; left:0 !important; right:0 !important;
    height:84px !important; z-index:10000 !important;
    display:flex !important; align-items:center !important; justify-content:space-between !important;
    padding:0 20px !important;
    background:linear-gradient(to top, rgba(0,0,0,0.97) 70%, transparent) !important;
    pointer-events:all !important;
}
.ihud-section { display:flex; flex-direction:column; align-items:center; gap:2px; min-width:80px; }
.ihud-label { font-size:9px; letter-spacing:3px; color:#00ffcc88; }
.ihud-value { font-size:22px; font-weight:bold; color:#00ffcc; font-family:'Share Tech Mono',monospace; line-height:1; }
.ihud-sub { font-size:9px; color:#00ffcc55; letter-spacing:1px; }
.ihud-xm-wrap { width:72px; height:5px; background:rgba(255,255,255,0.1); border-radius:3px; overflow:hidden; margin:2px 0; }
.ihud-xm-fill { height:100%; width:90%; background:linear-gradient(to right,#00cc88,#00ffcc); border-radius:3px; transition:width 0.5s; }
.ihud-center { flex-shrink:0; }

/* Scanner button */
#hud-scanner {
    width:72px; height:72px; border-radius:50%; cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    background:radial-gradient(circle, rgba(0,255,204,0.15) 0%, transparent 70%);
    border:2px solid rgba(0,255,204,0.5);
    transition:transform 0.15s;
    animation:scanner-breathe 2s ease-in-out infinite;
}
#hud-scanner:active { transform:scale(0.9); }
.scanner-triangle {
    width:0; height:0;
    border-left:9px solid transparent; border-right:9px solid transparent;
    border-bottom:18px solid #00ffcc;
    filter:drop-shadow(0 0 8px #00ffcc);
}
@keyframes scanner-breathe {
    0%,100% { border-color:rgba(0,255,204,0.3); }
    50% { border-color:rgba(0,255,204,0.7); }
}

/* === RADIAL MENU (z-index 100000) === */
#radial-overlay {
    position:fixed !important; inset:0 !important;
    z-index:100000 !important;
    background:rgba(0,0,0,0.65);
    align-items:center; justify-content:center;
    backdrop-filter:blur(3px);
}
#radial-menu { position:relative; width:280px; height:280px; }
.radial-item {
    position:absolute; top:50%; left:50%; width:66px; height:66px; margin:-33px;
    transform:translate(calc(cos(var(--angle))*115px),calc(sin(var(--angle))*115px));
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    background:rgba(0,10,20,0.9); border:1.5px solid #00ffcc44; border-radius:50%;
    cursor:pointer; transition:all 0.15s; animation:rad-pop 0.25s ease both;
}
.radial-item:hover {
    border-color:#00ffcc; background:rgba(0,255,204,0.1);
    transform:translate(calc(cos(var(--angle))*115px),calc(sin(var(--angle))*115px)) scale(1.15);
    box-shadow:0 0 20px rgba(0,255,204,0.35);
}
.rad-icon { font-size:22px; }
.rad-label { font-size:8px; letter-spacing:1px; color:#00ffccaa; font-family:'Share Tech Mono',monospace; margin-top:2px; }
#radial-close {
    position:absolute; top:50%; left:50%; width:50px; height:50px; margin:-25px;
    border-radius:50%; background:rgba(255,0,0,0.12); border:1.5px solid #ff4444;
    display:flex; align-items:center; justify-content:center;
    color:#ff4444; font-size:18px; cursor:pointer; transition:all 0.15s;
}
#radial-close:hover { background:rgba(255,0,0,0.28); }
@keyframes rad-pop {
    from{opacity:0;transform:translate(calc(cos(var(--angle))*40px),calc(sin(var(--angle))*40px)) scale(0.2)}
    to{opacity:1}
}

/* === ACTION BUTTONS (z-index 10000) === */
#ingress-action-btns {
    position:fixed !important; bottom:92px !important;
    left:50% !important; transform:translateX(-50%) !important;
    display:flex !important; gap:14px !important;
    z-index:10000 !important; pointer-events:all !important;
}
.ing-action-btn {
    display:flex; flex-direction:column; align-items:center;
    padding:10px 22px; border-radius:6px;
    font-family:'Share Tech Mono',monospace; cursor:pointer;
    border:none; gap:3px; transition:all 0.15s;
}
.ing-action-btn.primary { background:rgba(0,255,204,0.1); border:1.5px solid #00ffcc; color:#00ffcc; }
.ing-action-btn.alt { background:rgba(255,204,0,0.07); border:1.5px solid #ffcc00; color:#ffcc00; }
.ing-action-btn:active { transform:scale(0.93); }
.iab-icon { font-size:20px; }
.iab-label { font-size:9px; letter-spacing:2px; }

/* === ACTIVITY FEED (z-index 10000) === */
#activity-feed {
    position:fixed !important; top:80px !important; right:10px !important;
    width:200px; max-height:110px; overflow:hidden;
    z-index:10000 !important;
    display:flex; flex-direction:column; gap:3px; pointer-events:none;
}
.af-entry {
    font-family:'Share Tech Mono',monospace; font-size:10px; color:#ffffff77;
    background:rgba(0,0,0,0.65); padding:3px 8px; border-radius:3px;
    border-left:2px solid #00ffcc33; animation:af-in 0.3s ease;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.af-entry.capture { border-left-color:#00ffcc; color:#00ffcccc; }
.af-entry.attack { border-left-color:#ff4444; color:#ff4444aa; }
.af-entry.item { border-left-color:#ffcc00; color:#ffcc00aa; }
@keyframes af-in { from{opacity:0;transform:translateX(16px)} to{opacity:1} }

/* Scoreboard styles moved to style.css */

/* === INVENTORY PANEL (z-index 50000) === */
#inventory-panel {
    position:fixed !important;
    top:0 !important; right:-320px;
    width:300px; height:100%;
    background:rgba(5,10,20,0.97);
    border-left:1px solid #00ffcc33;
    z-index:50000 !important;
    transition:right 0.35s cubic-bezier(0.34,1.56,0.64,1);
    font-family:'Share Tech Mono',monospace;
    overflow-y:auto;
    padding:20px;
}
#inventory-panel.open { right:0 !important; }
.inv-header {
    display:flex; justify-content:space-between; align-items:center;
    margin-bottom:20px; padding-bottom:12px;
    border-bottom:1px solid #00ffcc22;
}
.inv-title { font-size:16px; color:#00ffcc; letter-spacing:3px; }
.inv-close {
    background:rgba(255,0,0,0.1); border:1px solid #ff4444;
    color:#ff4444; border-radius:4px; padding:4px 12px;
    cursor:pointer; font-size:14px; transition:all 0.15s;
}
.inv-close:hover { background:rgba(255,0,0,0.3); }
.inv-item {
    display:flex; justify-content:space-between; align-items:center;
    padding:10px 12px; margin-bottom:8px;
    background:rgba(0,255,204,0.04);
    border:1px solid #00ffcc22; border-radius:6px;
    transition:all 0.15s;
}
.inv-item:hover { background:rgba(0,255,204,0.08); border-color:#00ffcc44; }
.inv-item-name { color:#00ffcccc; font-size:12px; letter-spacing:1px; }
.inv-item-qty { color:#ffcc00; font-size:14px; font-weight:bold; }
.inv-empty { color:#ffffff33; font-size:11px; text-align:center; padding:40px 0; letter-spacing:2px; }
#inventory-backdrop {
    position:fixed; inset:0; z-index:49999;
    background:rgba(0,0,0,0.3); display:none;
}
#inventory-backdrop.open { display:block; }

/* === COMM PANEL (z-index 50000) === */
#comm-panel {
    position:fixed !important;
    bottom:-400px; left:0; right:0;
    height:350px;
    background:rgba(5,10,20,0.97);
    border-top:1px solid #00ffcc33;
    border-radius:20px 20px 0 0;
    z-index:50000 !important;
    transition:bottom 0.35s cubic-bezier(0.34,1.56,0.64,1);
    font-family:'Share Tech Mono',monospace;
    display:flex; flex-direction:column;
}
#comm-panel.open { bottom:0 !important; }
.comm-header {
    display:flex; justify-content:space-between; align-items:center;
    padding:14px 20px; border-bottom:1px solid #00ffcc22;
    flex-shrink:0;
}
.comm-title { font-size:14px; color:#00ffcc; letter-spacing:3px; }
.comm-close {
    background:rgba(255,0,0,0.1); border:1px solid #ff4444;
    color:#ff4444; border-radius:4px; padding:4px 12px;
    cursor:pointer; font-size:14px; transition:all 0.15s;
}
.comm-close:hover { background:rgba(255,0,0,0.3); }
.comm-tabs {
    display:flex; border-bottom:1px solid #00ffcc11; flex-shrink:0;
}
.comm-tab {
    flex:1; padding:10px 0; text-align:center;
    font-size:10px; letter-spacing:2px; color:#ffffff44;
    cursor:pointer; border-bottom:2px solid transparent;
    transition:all 0.15s; background:none; border-top:none; border-left:none; border-right:none;
}
.comm-tab.active { color:#00ffcc; border-bottom-color:#00ffcc; }
.comm-messages {
    flex:1; overflow-y:auto; padding:12px 16px;
}
.comm-msg {
    padding:6px 0; border-bottom:1px solid #ffffff08;
    font-size:11px;
}
.comm-msg-time { color:#ffffff33; font-size:9px; margin-right:8px; }
.comm-msg-user { color:#00ffcc88; margin-right:6px; }
.comm-msg-text { color:#ffffffaa; }
.comm-msg.system .comm-msg-text { color:#ffcc00aa; font-style:italic; }
.comm-input-row {
    display:flex; padding:10px 16px; border-top:1px solid #00ffcc22;
    gap:8px; flex-shrink:0;
}
.comm-input {
    flex:1; background:rgba(0,255,204,0.05);
    border:1px solid #00ffcc33; border-radius:4px;
    color:#00ffcc; padding:8px 12px; font-family:inherit;
    font-size:12px; outline:none;
}
.comm-input::placeholder { color:#00ffcc33; }
.comm-input:focus { border-color:#00ffcc66; }
.comm-send {
    background:rgba(0,255,204,0.1); border:1px solid #00ffcc;
    color:#00ffcc; border-radius:4px; padding:8px 16px;
    cursor:pointer; font-family:inherit; font-size:11px;
    letter-spacing:1px; transition:all 0.15s;
}
.comm-send:hover { background:rgba(0,255,204,0.2); }
#comm-backdrop {
    position:fixed; inset:0; z-index:49999;
    background:rgba(0,0,0,0.3); display:none;
}
#comm-backdrop.open { display:block; }

/* === PORTAL PANEL (z-index 50000) === */
#portal-panel {
    position:fixed !important; bottom:-300px; left:0; right:0;
    background:rgba(5,10,20,0.97); border-top:1px solid #00ffcc44;
    border-radius:20px 20px 0 0; padding:16px 20px 100px;
    z-index:50000 !important;
    transition:bottom 0.35s cubic-bezier(0.34,1.56,0.64,1);
    font-family:'Share Tech Mono',monospace;
}
#portal-panel.open { bottom:0; }
.pp-handle { width:40px; height:4px; background:#ffffff22; border-radius:2px; margin:0 auto 14px; }
.pp-header { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:12px; }
.pp-name { font-size:18px; color:#00ffcc; letter-spacing:2px; font-weight:bold; }
.pp-faction { font-size:11px; letter-spacing:2px; padding:3px 10px; border-radius:3px; margin-top:4px; }
.pp-faction.core { color:#4af; border:1px solid rgba(68,170,255,0.3); background:rgba(68,170,255,0.1); }
.pp-faction.void { color:#f4a; border:1px solid rgba(255,68,170,0.3); background:rgba(255,68,170,0.1); }
.pp-faction.neutral { color:#aaa; border:1px solid rgba(170,170,170,0.3); background:rgba(170,170,170,0.1); }
.pp-stats { display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; margin:14px 0; }
.pp-stat { text-align:center; }
.pp-stat-val { font-size:20px; color:#00ffcc; }
.pp-stat-lbl { font-size:9px; color:#ffffff44; letter-spacing:1px; }
.pp-health-bar { height:6px; background:rgba(255,255,255,0.08); border-radius:3px; margin:12px 0; overflow:hidden; }
.pp-health-fill { height:100%; background:linear-gradient(to right,#00cc88,#00ffcc); border-radius:3px; transition:width 0.5s; }
.pp-actions { display:flex; gap:10px; margin-top:14px; }
.pp-btn { flex:1; padding:12px; border-radius:6px; font-family:inherit; font-size:13px; letter-spacing:2px; cursor:pointer; border:none; transition:all 0.15s; }
.pp-btn.hack { background:rgba(0,255,204,0.12); border:1.5px solid #00ffcc; color:#00ffcc; }
.pp-btn.hack:active { background:rgba(0,255,204,0.25); transform:scale(0.97); }
.pp-btn.close-pp { flex:0; padding:8px 14px; background:transparent; border:1px solid #ffffff22; color:#ffffff44; }
#portal-panel-backdrop { position:fixed; inset:0; z-index:49999 !important; display:none; }
#portal-panel-backdrop.open { display:block; }

/* === SIM CONTROLS === */
#sim-controls { position:fixed !important; bottom:100px !important; right:16px !important; z-index:10000 !important; pointer-events:all !important; }

/* === OTHER OVERLAYS === */
#terminal-overlay { z-index:50000 !important; }
#scan-panel { z-index:50000 !important; }
#notifications { z-index:10000 !important; position:relative !important; }
#drop-node-modal { z-index:100000 !important; }

/* === HIDE OLD ELEMENTS === */
#btn-scan, #btn-create-node { display:none !important; }
.hud-icon-btn { display:none !important; }
#bottom-actions { display:none !important; }
#inventory-hud { display:none !important; }
#webcam-feed { display:none; }
#webcam-overlay { display:none; }
#ar-layer { display:none; }
#ar-scanlines { display:none; }
body.camera-mode #webcam-feed { display:block !important; z-index:2; }
body.camera-mode #map-container { display:none !important; }

/* Fix #hud z-index so overlays can escape */
#hud { z-index: 5 !important; }