/* ==========================================
   COCKPIT VISUAL OVERLAY SYSTEM v1.9.16
   STRIPPED VERSION - BARE COCKPIT IMAGE ONLY
   v1.9.16: Andrew's request - "use just the cockpit image"
   NO yoke, NO view, NO overlays - just Cockpit.png
   ========================================== */

/* Ensure content sits above cockpit background image */
.cockpit-header,
.ticker-bar,
.cockpit-main,
.cockpit-footer {
    position: relative;
    z-index: 1;
}

/* ==========================================
   ENHANCED PANEL STYLING
   Glass-morphism effect for panels
   ========================================== */

.panel {
    background: rgba(10, 10, 20, 0.85);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 255, 136, 0.2);
    box-shadow: 
        0 4px 30px rgba(0, 0, 0, 0.3),
        inset 0 0 20px rgba(0, 0, 0, 0.2);
}

.panel:hover {
    border-color: rgba(0, 255, 136, 0.3);
}

/* ==========================================
   COMPACT GAUGE ROW
   Smaller gauges that fit better
   ========================================== */

.gauges-primary .gauge-container {
    transform: scale(0.85);
}

.gauges-commodities .mini-gauge-container {
    padding: 8px;
    min-width: 70px;
}

/* ==========================================
   RESPONSIVE COCKPIT
   Scales down for smaller screens
   v1.9.17: REMOVED horizon-display references
   ========================================== */

@media (max-height: 800px) {
    .gauges-primary .gauge-container {
        transform: scale(0.75);
    }
    
    .cockpit-header {
        padding: 5px 15px;
    }
    
    .ticker-bar {
        height: 28px;
    }
}

@media (max-height: 700px) {
    .gauges-primary .gauge-container {
        transform: scale(0.65);
    }
    
    .panel-right > div {
        padding: 8px;
    }
}