/* Professional Aircraft Marker Styles - ADSB Exchange Style */

/* Main aircraft marker containers */
.aircraft-marker,
.aircraft-marker-professional,
.aircraft-marker-pro {
    transition: none !important; /* Prevent blinking transitions */
    animation: none !important; /* Disable any animations */
    z-index: 1000 !important;
    cursor: pointer;
    position: relative;
}

/* Professional aircraft icon styling */
.aircraft-marker-pro {
    display: flex;
    align-items: center;
    justify-content: center;
    transform-origin: center center;
    will-change: transform;
    backface-visibility: hidden;
    transform-style: preserve-3d;
}

.aircraft-marker-pro svg {
    width: 100%;
    height: 100%;
    display: block;
    transform-origin: center center;
}

.aircraft-moving {
    /* Smooth position transitions only, not icon changes */
    transition: transform 1.5s linear !important;
}

/* Improve aircraft marker visibility and performance */
.aircraft-marker div,
.aircraft-marker-professional div,
.aircraft-marker-pro div {
    will-change: transform; /* Optimize for rotation changes */
    backface-visibility: hidden; /* Prevent flickering */
    transform-style: preserve-3d; /* Better 3D rendering */
}

/* Enhanced hover effects for professional aircraft markers */
.aircraft-marker:hover,
.aircraft-marker-professional:hover,
.aircraft-marker-pro:hover {
    transform: scale(1.15) !important;
    z-index: 1001 !important;
}

.aircraft-marker:hover div,
.aircraft-marker-professional:hover div,
.aircraft-marker-pro:hover div {
    filter: drop-shadow(4px 4px 8px rgba(0,0,0,0.7)) 
            drop-shadow(0px 0px 16px rgba(255,255,255,0.6)) !important;
}

/* Altitude-based aircraft sizing and opacity */
.aircraft-marker-pro[data-altitude="high"] {
    opacity: 0.95;
    transform-origin: center center;
}

.aircraft-marker-pro[data-altitude="medium"] {
    opacity: 0.90;
}

.aircraft-marker-pro[data-altitude="low"] {
    opacity: 0.85;
}

.aircraft-marker-pro[data-altitude="ground"] {
    opacity: 0.80;
}

/* Aircraft type specific styling */
.aircraft-marker-pro.widebody svg {
    filter: drop-shadow(3px 3px 6px rgba(0,0,0,0.5));
}

.aircraft-marker-pro.fighter svg {
    filter: drop-shadow(2px 2px 4px rgba(255,0,0,0.3));
}

.aircraft-marker-pro.helicopter svg {
    filter: drop-shadow(2px 2px 4px rgba(0,255,0,0.2));
}

/* Aircraft trail line styling */
.aircraft-trail-line {
    stroke-width: 2;
    stroke-opacity: 0.6;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Selected aircraft highlighting */
.aircraft-marker-selected {
    animation: aircraft-pulse 2s infinite ease-in-out;
}

@keyframes aircraft-pulse {
    0%, 100% {
        filter: drop-shadow(2px 2px 4px rgba(0,0,0,0.4)) 
                drop-shadow(0px 0px 8px rgba(255,255,255,0.3));
    }
    50% {
        filter: drop-shadow(4px 4px 8px rgba(0,0,0,0.6)) 
                drop-shadow(0px 0px 16px rgba(255,215,0,0.8));
    }
}

/* Ensure aircraft markers are above other elements */
.leaflet-marker-pane .aircraft-marker,
.leaflet-marker-pane .aircraft-marker-professional,
.leaflet-marker-pane .aircraft-marker-pro {
    z-index: 1000 !important;
}

/* Aircraft popup styling */
.aircraft-popup {
    max-width: 350px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.aircraft-popup h6 {
    margin-bottom: 8px;
    font-weight: bold;
}

.aircraft-popup .aircraft-info {
    margin-bottom: 10px;
}

.aircraft-popup .badge {
    color: white;
    font-size: 0.75em;
    padding: 2px 6px;
    border-radius: 3px;
    margin-right: 4px;
}

.aircraft-popup .badge-secondary {
    background-color: #6c757d;
}

.aircraft-popup .table-sm td {
    padding: 2px 4px;
    font-size: 0.85em;
}

.aircraft-popup .btn-sm {
    font-size: 0.75em;
    padding: 2px 8px;
}

.aircraft-popup .text-muted {
    font-size: 0.7em;
    margin-top: 5px;
    display: block;
}

/* OpenSky Network Style Aircraft Sidebar */
.aircraft-sidebar {
    position: fixed;
    top: 0;
    right: -420px; /* Hidden by default */
    width: 380px;
    height: 100vh;
    background: #ffffff;
    border-left: 1px solid #e0e0e0;
    z-index: 2000;
    transition: right 0.3s ease-in-out;
    overflow-y: auto;
    box-shadow: -2px 0 10px rgba(0,0,0,0.1);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.aircraft-sidebar.active {
    right: 0; /* Show sidebar */
}

/* OpenSky Header */
.opensky-sidebar-header {
    background: #f8f9fa;
    border-bottom: 1px solid #e0e0e0;
    padding: 16px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 2001;
}

.aircraft-callsign {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.aircraft-status {
    font-size: 12px;
    font-weight: 500;
    padding: 4px 8px;
    border-radius: 12px;
    margin-left: 8px;
}

.aircraft-status.airborne {
    background: #e8f5e8;
    color: #2e7d2e;
}

.aircraft-status.on-ground {
    background: #fff3cd;
    color: #856404;
}

.close-button {
    background: none;
    border: none;
    font-size: 24px;
    color: #666;
    cursor: pointer;
    padding: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background-color 0.2s;
}

.close-button:hover {
    background: #f0f0f0;
}

/* Aircraft Icon Section */
.opensky-aircraft-icon {
    text-align: center;
    padding: 20px;
    background: #f8f9fa;
    border-bottom: 1px solid #e0e0e0;
}

.opensky-aircraft-icon svg {
    width: 60px;
    height: 60px;
    color: #0066cc;
}

/* Basic Info Section */
.opensky-basic-info {
    padding: 20px;
    border-bottom: 1px solid #e0e0e0;
}

.info-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    font-size: 14px;
}

.info-row:last-child {
    margin-bottom: 0;
}

.info-row .label {
    color: #666;
    font-weight: 500;
}

.info-row .value {
    color: #333;
    font-weight: 400;
    text-align: right;
}

/* Flight Data Section */
.opensky-flight-data {
    padding: 20px;
}

.data-section {
    margin-bottom: 24px;
}

.data-section:last-child {
    margin-bottom: 0;
}

.section-title {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e0e0e0;
}

.data-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.data-item {
    display: flex;
    flex-direction: column;
}

.data-item.full-width {
    grid-column: 1 / -1;
}

.data-label {
    font-size: 12px;
    color: #666;
    font-weight: 500;
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.data-value {
    font-size: 16px;
    color: #333;
    font-weight: 600;
}

/* Actions Section */
.opensky-actions {
    padding: 20px;
    border-top: 1px solid #e0e0e0;
    background: #f8f9fa;
    display: flex;
    gap: 12px;
}

.action-btn {
    flex: 1;
    padding: 12px 16px;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.action-btn.primary {
    background: #0066cc;
    color: white;
}

.action-btn.primary:hover {
    background: #0052a3;
}

.action-btn.secondary {
    background: #6c757d;
    color: white;
}

.action-btn.secondary:hover {
    background: #5a6268;
}

/* Mobile responsive sidebar */
@media (max-width: 768px) {
    .aircraft-sidebar {
        width: 100vw;
        right: -100vw;
    }
    
    .aircraft-sidebar.active {
        right: 0;
    }
    
    .aircraft-sidebar .sidebar-content {
        padding: 15px;
    }
}

/* Scrollbar styling for sidebar */
.aircraft-sidebar::-webkit-scrollbar {
    width: 8px;
}

.aircraft-sidebar::-webkit-scrollbar-track {
    background: rgba(255,255,255,0.1);
}

.aircraft-sidebar::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.3);
    border-radius: 4px;
}

.aircraft-sidebar::-webkit-scrollbar-thumb:hover {
    background: rgba(255,255,255,0.5);
}