/**
 * PVD Flight Status - Frontend Styles (Updated)
 * 
 * A modern, responsive stylesheet for displaying airport flight information.
 * Uses highly specific selectors to avoid theme conflicts.
 */

/* ----------------------------------------
   Main Container Styles - Use !important to override theme styles
---------------------------------------- */
.pvd-flight-status-widget {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif !important;
    line-height: 1.5 !important;
    color: #333 !important;
    box-sizing: border-box !important;
}

.pvd-flight-status-widget *,
.pvd-flight-status-widget *:before,
.pvd-flight-status-widget *:after {
    box-sizing: border-box !important;
}

/* ----------------------------------------
   Search Bar Styles
---------------------------------------- */
.pvd-flight-status-widget .pvd-flight-search {
    background-color: #f9f9f9 !important;
    padding: 15px !important;
    margin-bottom: 20px !important;
    border: 1px solid #e0e0e0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 15px !important;
}

.pvd-flight-status-widget .pvd-search-input-wrapper {
    flex: 1 1 400px !important;
    position: relative !important;
}

.pvd-flight-status-widget .pvd-search-input-wrapper::before {
    content: "\f002" !important;
    font-family: 'Font Awesome 5 Free' !important;
    font-weight: 900 !important;
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #999 !important;
    z-index: 1 !important;
}

.pvd-flight-status-widget #pvd-flight-search-input {
    width: 100% !important;
    padding: 10px 10px 10px 40px !important;
    font-size: 16px !important; /* Increased text size */
    border: 1px solid #ddd !important;
    outline: none !important;
    transition: border-color 0.3s ease !important;
    height: auto !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    background-color: #fff !important;
}

.pvd-flight-status-widget #pvd-flight-search-input:focus {
    border-color: #cc212a !important;
    box-shadow: 0 0 0 2px rgba(204, 33, 42, 0.1) !important;
}

.pvd-flight-status-widget #pvd-flight-search-input::placeholder {
    color: #999 !important;
    font-size: 16px !important; /* Increased text size */
}

/* ----------------------------------------
   Navigation Styles - Improved visual separation
---------------------------------------- */
.pvd-flight-status-widget .pvd-flight-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 !important;
    margin-bottom: 0 !important;
    border-bottom: 3px solid #cc212a !important; /* Added separator between buttons and header */
}

.pvd-flight-status-widget .pvd-flight-type-nav {
    display: flex !important;
    flex: 1 1 100% !important;
    background-color: transparent !important;
    overflow: hidden !important;
    margin-bottom: 0 !important;
}

/* Button resets with squared corners */
.pvd-flight-status-widget .pvd-nav-button {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: #6c757d !important;
    color: white !important;
    border: none !important;
    box-shadow: none !important;
    padding: 12px 16px !important;
    font-size: 16px !important; /* Increased text size */
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    flex: 1 !important;
    margin: 0 !important;
    text-transform: none !important;
    height: auto !important;
    line-height: 1.5 !important;
    text-decoration: none !important;
    text-align: center !important;
    border-radius: 0 !important; /* Squared corners */
    width: auto !important;
}

.pvd-flight-status-widget .pvd-nav-button:hover {
    background-color: #5a6268 !important;
    color: white !important;
    text-decoration: none !important;
}

.pvd-flight-status-widget .pvd-nav-button.pvd-nav-selected {
    background-color: #cc212a !important;
    color: white !important;
    text-decoration: none !important;
}

.pvd-flight-status-widget .pvd-nav-button.pvd-nav-selected:hover {
    background-color: #b51d24 !important;
    color: white !important;
}

.pvd-flight-status-widget .pvd-nav-button i {
    font-size: 16px !important; /* Increased icon size */
}

/* Day selector buttons in search area - squared corners */
.pvd-flight-status-widget .pvd-day-selector {
    display: flex !important;
    background-color: transparent !important;
    overflow: hidden !important;
}

.pvd-flight-status-widget .pvd-day-button {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: #6c757d !important;
    color: white !important;
    border: none !important;
    outline: none !important;
    padding: 10px 16px !important;
    font-size: 16px !important; /* Increased text size */
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 !important;
    text-decoration: none !important;
    box-shadow: none !important;
    line-height: 1.5 !important;
    height: auto !important;
    border-radius: 0 !important; /* Squared corners */
}

.pvd-flight-status-widget .pvd-day-button:first-child {
    border-right: 1px solid rgba(255, 255, 255, 0.2) !important; /* Visual separator */
}

.pvd-flight-status-widget .pvd-day-button:hover {
    background-color: #5a6268 !important;
}

.pvd-flight-status-widget .pvd-day-button.pvd-day-selected {
    background-color: #333333 !important;
    color: white !important;
}

/* ----------------------------------------
   Table Styles with more specific selectors
---------------------------------------- */
.pvd-flight-status-widget .pvd-flight-table-container {
    width: 100% !important;
    overflow-x: auto !important;
    margin-bottom: 20px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

.pvd-flight-status-widget .pvd-flight-table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
    font-size: 15px !important; /* Increased text size */
    background-color: #fff !important;
    border: none !important;
}

.pvd-flight-status-widget .pvd-flight-table-header {
    background-color: #cc212a !important;
    color: white !important;
}

.pvd-flight-status-widget .pvd-flight-table th {
    padding: 10px 12px !important;
    text-align: left !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    background-color: #cc212a !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    color: white !important;
    font-size: 15px !important; /* Increased text size */
    line-height: 1.5 !important;
}

.pvd-flight-status-widget .pvd-flight-table tbody tr {
    transition: background-color 0.2s ease !important;
    border-top: none !important;
    border-bottom: 1px solid #f0f0f0 !important;
    border-left: none !important;
    border-right: none !important;
}

.pvd-flight-status-widget .pvd-flight-table tbody tr:nth-child(even) {
    background-color: #f5f5f5 !important;
}

.pvd-flight-status-widget .pvd-flight-table tbody tr:hover {
    background-color: #f9f9f9 !important;
}

.pvd-flight-status-widget .pvd-flight-table td {
    padding: 10px 12px !important;
    vertical-align: middle !important;
    border: none !important;
    color: #333 !important;
    font-size: 15px !important; /* Increased text size */
    line-height: 1.5 !important;
}

/* Airline Cell */
.pvd-flight-status-widget .pvd-flight-table .airline-cell {
    min-width: 100px !important;
    max-width: 140px !important;
}

.pvd-flight-status-widget .pvd-flight-table .airline-info {
    display: flex !important;
    align-items: center !important;
}

.pvd-flight-status-widget .pvd-flight-table .airline-logo {
    width: auto !important;
    height: 42px !important; /* Further increased logo size */
    max-width: 140px !important; /* Increased max width */
    object-fit: contain !important;
    object-position: left center !important;
}

.pvd-flight-status-widget .pvd-flight-table .airline-name {
    font-weight: 500 !important;
    font-size: 15px !important;
    display: none !important; /* Hide by default, show for screen readers */
}

/* Flight Number Cell */
.pvd-flight-status-widget .pvd-flight-table .flight-no-cell {
    white-space: nowrap !important;
    font-weight: 500 !important;
    color: #333 !important;
    font-size: 15px !important;
}

/* City Cell - Fixed vertical alignment */
.pvd-flight-status-widget .pvd-flight-table .city-cell {
    white-space: nowrap !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    height: 100% !important;
}

.pvd-flight-status-widget .pvd-flight-table .city-name {
    font-weight: 500 !important;
    color: #333 !important;
    display: inline !important;
}

.pvd-flight-status-widget .pvd-flight-table .airport-code {
    color: #666 !important;
    font-size: 14px !important;
    display: inline !important;
    margin-left: 3px !important;
}

/* Status and Time Cells - Simplified single-status layout */
.pvd-flight-status-widget .pvd-flight-table .status-cell, 
.pvd-flight-status-widget .pvd-flight-table .schedule-cell {
    white-space: nowrap !important;
    font-size: 15px !important;
    vertical-align: middle !important;
}

/* Container for status information */
.pvd-flight-status-widget .pvd-flight-table .status-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

/* Combined status label */
.pvd-flight-status-widget .pvd-flight-table .combined-status {
    font-weight: 600 !important;
    display: block !important;
    color: #333 !important;
    margin-bottom: 2px !important;
}

/* Status time display */
.pvd-flight-status-widget .pvd-flight-table .status-time {
    display: block !important;
    font-size: 14px !important;
    color: #666 !important;
    margin-top: 2px !important;
}

.pvd-flight-status-widget .pvd-flight-table .schedule-time {
    display: block !important;
    font-size: 14px !important;
    color: #666 !important;
}

/* All td elements vertically centered */
.pvd-flight-status-widget .pvd-flight-table td {
    padding: 10px 12px !important;
    vertical-align: middle !important;
    border: none !important;
    color: #333 !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
}

.pvd-flight-status-widget .pvd-flight-table .status-badge.on-time {
    background-color: #e8f5e9 !important;
    color: #2e7d32 !important;
    border: 1px solid rgba(46, 125, 50, 0.2) !important;
}

.pvd-flight-status-widget .pvd-flight-table .status-badge.early {
    background-color: #e8f5e9 !important; /* Green like on-time */
    color: #2e7d32 !important;
    border: 1px solid rgba(46, 125, 50, 0.2) !important;
}

.pvd-flight-status-widget .pvd-flight-table .status-badge.delayed {
    background-color: #fff8e1 !important;
    color: #a85400 !important;
    border: 1px solid rgba(245, 124, 0, 0.2) !important;
}

.pvd-flight-status-widget .pvd-flight-table .status-badge.late {
    background-color: #fff8e1 !important; /* Same as delayed */
    color: #a85400 !important;
    border: 1px solid rgba(245, 124, 0, 0.2) !important;
}

.pvd-flight-status-widget .pvd-flight-table .status-badge.canceled {
    background-color: #ffebee !important;
    color: #c62828 !important;
    border: 1px solid rgba(198, 40, 40, 0.2) !important;
}

.pvd-flight-status-widget .pvd-flight-table .status-badge.in-air {
    background-color: #e8eaf6 !important;
    color: #3949ab !important;
    border: 1px solid rgba(57, 73, 171, 0.2) !important;
}

.pvd-flight-status-widget .pvd-flight-table .status-badge.boarding {
    background-color: #e0f2f1 !important;
    color: #00897b !important;
    border: 1px solid rgba(0, 137, 123, 0.2) !important;
}

.pvd-flight-status-widget .pvd-flight-table .status-badge.arrived {
    background-color: #e3f2fd !important;
    color: #1565c0 !important;
    border: 1px solid rgba(25, 118, 210, 0.2) !important;
}

/* Gate and Claim Cells */
.pvd-flight-status-widget .pvd-flight-table .gate-cell,
.pvd-flight-status-widget .pvd-flight-table .claim-cell {
    text-align: center !important;
    font-weight: 500 !important;
    font-size: 15px !important;
}

/* No Data Message */
.pvd-flight-status-widget .pvd-flight-table .no-data-message {
    text-align: center !important;
    padding: 25px 15px !important;
    color: #666 !important;
    font-style: italic !important;
    font-size: 15px !important;
}

/* Hide "No matching flights" message when it appears erroneously */
.pvd-flight-status-widget .no-results-row.hidden {
    display: none !important;
}

/* ----------------------------------------
   Loading Styles - Fixed positioning and visibility
---------------------------------------- */
.pvd-flight-status-widget .pvd-flight-loading {
    display: none !important; /* Hidden by default */
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 15px 25px !important;
    background-color: rgba(255, 255, 255, 0.9) !important;
    border-radius: 4px !important;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15) !important;
    gap: 10px !important;
    z-index: 100 !important;
}

.pvd-flight-status-widget {
    position: relative !important;
    min-height: 200px !important;
}

.pvd-flight-status-widget .pvd-flight-loading-spinner {
    width: 20px !important;
    height: 20px !important;
    border: 3px solid #f3f3f3 !important;
    border-top: 3px solid #cc212a !important;
    border-radius: 50% !important;
    animation: pvd_spin 1s linear infinite !important;
}

@keyframes pvd_spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* ----------------------------------------
   Mobile Card View Styles
---------------------------------------- */
.pvd-flight-status-widget .pvd-flight-card {
    display: none !important;  /* Hidden by default, shown only on mobile */
    background-color: #fff !important;
    border: 1px solid #e0e0e0 !important;
    margin-bottom: 15px !important;
    padding: 15px !important;
}

.pvd-flight-status-widget .pvd-flight-card-header {
    display: flex !important;
    align-items: center !important;
    margin-bottom: 10px !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid #f0f0f0 !important;
}

.pvd-flight-status-widget .pvd-flight-card-airline {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.pvd-flight-status-widget .pvd-flight-card-airline img {
    height: 20px !important; /* Increased logo size */
    width: auto !important;
    max-width: 100px !important; /* Increased logo max-width */
}

.pvd-flight-status-widget .pvd-flight-card-number {
    font-weight: 600 !important;
    font-size: 16px !important; /* Increased text size */
}

.pvd-flight-status-widget .pvd-flight-card-body {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.pvd-flight-status-widget .pvd-flight-card-row {
    display: flex !important;
    justify-content: space-between !important;
    padding-bottom: 6px !important;
}

.pvd-flight-status-widget .pvd-flight-card-label {
    font-weight: 500 !important;
    color: #666 !important;
    font-size: 15px !important; /* Increased text size */
}

.pvd-flight-status-widget .pvd-flight-card-value {
    font-weight: 500 !important;
    text-align: right !important;
    font-size: 15px !important; /* Increased text size */
}

.pvd-flight-status-widget .pvd-flight-card-status {
    display: flex !important;
    justify-content: center !important;
    padding: 8px !important;
    margin-top: 8px !important;
    font-weight: 600 !important;
    font-size: 15px !important; /* Increased text size */
}

/* Status colors */
.pvd-flight-status-widget .status-on-time {
    color: #2e7d32 !important;
}

.pvd-flight-status-widget .status-early {
    color: #2e7d32 !important;
}

.pvd-flight-status-widget .status-departed {
    color: #1565c0 !important;
}

.pvd-flight-status-widget .status-arrived {
    color: #1565c0 !important;
}

.pvd-flight-status-widget .status-delayed {
    color: #a85400 !important;
}

.pvd-flight-status-widget .status-late {
    color: #a85400 !important;
}

.pvd-flight-status-widget .status-canceled {
    color: #c62828 !important;
}

.pvd-flight-status-widget .status-boarding {
    color: #2e7d32 !important;
}

.pvd-flight-status-widget .status-in-air {
    color: #3949ab !important;
}

/* ----------------------------------------
   Accessibility Enhancements
---------------------------------------- */
.pvd-flight-status-widget .sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border-width: 0 !important;
}

/* ----------------------------------------
   Responsive Design
---------------------------------------- */
@media (min-width: 768px) {
    .pvd-flight-status-widget .pvd-flight-card {
        display: none !important; /* Ensure cards never show on desktop */
    }
}

@media (max-width: 960px) {
    .pvd-flight-status-widget .pvd-nav-button {
        font-size: 15px !important;
        padding: 10px 14px !important;
    }

    .pvd-flight-status-widget .pvd-flight-table th, 
    .pvd-flight-status-widget .pvd-flight-table td {
        padding: 8px 10px !important;
    }
    
    .pvd-flight-status-widget .airline-logo {
        height: 20px !important;
    }
}

@media (max-width: 767px) {
    /* Hide table on mobile */
    .pvd-flight-status-widget .pvd-flight-table-container {
        display: none !important;
    }
    
    /* Show card view on mobile */
    .pvd-flight-status-widget .pvd-flight-card {
        display: block !important;
    }
    
    .pvd-flight-status-widget .pvd-flight-search {
        padding: 12px !important;
    }
    
    .pvd-flight-status-widget .pvd-nav-button {
        padding: 10px !important;
    }
}

/* Time zone display for clarity */
.pvd-flight-status-widget .time-zone-note {
    display: block;
    text-align: right;
    color: #666;
    font-size: 13px;
    margin-top: 5px;
    font-style: italic;
}

/* Fix for "No matching flights" message when it shouldn't show */
.pvd-flight-status-widget .no-results-row {
    display: none;
}

.pvd-flight-status-widget .no-results-row.visible {
    display: table-row;
}

.pvd-flight-status-widget .no-results-message {
    display: none;
}

.pvd-flight-status-widget .no-results-message.visible {
    display: block;
}
/* AVX 2026-08-04: hide pre-rendered empty state until JS shows it.
   No !important here on purpose — jQuery .show() sets an inline style
   and must be able to override this. */
.pvd-flight-status-widget .no-matching-container { display: none; }

/* AVX 2026-08-04: sanitize_title() on combined statuses yields compound
   classes ("Departed On Time" -> .status-departed-on-time) that had no rules,
   so those cells rendered unstyled. Coloured by TIMELINESS (the actionable
   signal) rather than by arrived/departed. Confirm this is the intent. */
.pvd-flight-status-widget .status-arrived-on-time,
.pvd-flight-status-widget .status-departed-on-time,
.pvd-flight-status-widget .status-arrived-early,
.pvd-flight-status-widget .status-departed-early {
    color: #2e7d32 !important;
}

.pvd-flight-status-widget .status-arrived-late,
.pvd-flight-status-widget .status-departed-late,
.pvd-flight-status-widget .status-arrived-delayed,
.pvd-flight-status-widget .status-departed-delayed {
    color: #a85400 !important;
}

/* AVX 2026-08-04 (b): the table-scoped .combined-status rule above is (0,3,0)
   with !important, so the (0,2,0) status colours never applied inside the table.
   These are (0,4,0) and win. */
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-on-time,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-early,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-boarding,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-arrived-on-time,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-departed-on-time,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-arrived-early,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-departed-early {
    color: #2e7d32 !important;
}

.pvd-flight-status-widget .pvd-flight-table .combined-status.status-delayed,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-late,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-arrived-late,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-departed-late,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-arrived-delayed,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-departed-delayed {
    color: #a85400 !important;
}

.pvd-flight-status-widget .pvd-flight-table .combined-status.status-canceled {
    color: #c62828 !important;
}

.pvd-flight-status-widget .pvd-flight-table .combined-status.status-departed,
.pvd-flight-status-widget .pvd-flight-table .combined-status.status-arrived {
    color: #1565c0 !important;
}

.pvd-flight-status-widget .pvd-flight-table .combined-status.status-in-air {
    color: #3949ab !important;
}


/* AVX 2026-08-04 (d): pvd-flight-sticky.css:616 has a GLOBAL, unscoped
   [class*="calendar"]:not(.pvd-service-btn) { position:fixed !important }.
   It catches fa-calendar-day / fa-calendar-plus here and rips the icon out of
   flow onto the button label. (0,2,1) beats its (0,2,0). The real fix is to
   scope that selector in the sticky plugin — this only shields this widget. */
#pvd-flight-status-widget .pvd-day-button i,
#pvd-flight-status-widget .pvd-nav-button i {
    position: static !important;
    z-index: auto !important;
    top: auto !important;
    left: auto !important;
}

/* AVX 2026-08-04 (e): UPDATE is now its own column, matching the approved
   legacy FIDS layout. Mirrors .schedule-cell so the two time columns match. */
.pvd-flight-status-widget .pvd-flight-table .update-cell {
    white-space: nowrap !important;
    font-size: 15px !important;
    vertical-align: middle !important;
}

/* AVX 2026-08-04 (f): restore the approved legacy FIDS pill styling.
   Geometry copied verbatim from flightsComplete.php (.status-cell span).
   Colours are the approved legacy values EXCEPT the two that fail WCAG AA on
   white - the legacy file labels the palette "AA compliant" but it is not:
     on-time / arrived  #4CAF50 = 2.78:1  ->  #2E7D32 = 5.13:1
     early              #2196F3 = 3.12:1  ->  #1565C0 = 5.75:1
   Change those two hexes back to restore the exact legacy palette.
   The .status-*-* compound rules further up are dead - get_status_class()
   now emits only the nine simple classes handled below. */
#pvd-flight-status-widget .pvd-flight-table .combined-status,
#pvd-flight-status-widget .pvd-flight-card-status {
    display: inline-block !important;
    border-radius: 4px !important;
    padding: 6px 10px !important;
    font-weight: 500 !important;
    font-size: 0.9em !important;
    min-width: 90px !important;
    text-align: center !important;
    background-color: #757575 !important;
    color: #ffffff !important;
}

#pvd-flight-status-widget .pvd-flight-table .combined-status.status-canceled,
#pvd-flight-status-widget .pvd-flight-card-status.status-canceled {
    background-color: #CC212A !important;
    color: #ffffff !important;
}

#pvd-flight-status-widget .pvd-flight-table .combined-status.status-delayed,
#pvd-flight-status-widget .pvd-flight-card-status.status-delayed {
    background-color: #F9A826 !important;
    color: #333333 !important;
}

#pvd-flight-status-widget .pvd-flight-table .combined-status.status-on-time,
#pvd-flight-status-widget .pvd-flight-card-status.status-on-time,
#pvd-flight-status-widget .pvd-flight-table .combined-status.status-arrived,
#pvd-flight-status-widget .pvd-flight-card-status.status-arrived {
    background-color: #2E7D32 !important;
    color: #ffffff !important;
}

#pvd-flight-status-widget .pvd-flight-table .combined-status.status-early,
#pvd-flight-status-widget .pvd-flight-card-status.status-early {
    background-color: #1565C0 !important;
    color: #ffffff !important;
}

#pvd-flight-status-widget .pvd-flight-table .combined-status.status-boarding,
#pvd-flight-status-widget .pvd-flight-card-status.status-boarding,
#pvd-flight-status-widget .pvd-flight-table .combined-status.status-in-air,
#pvd-flight-status-widget .pvd-flight-card-status.status-in-air,
#pvd-flight-status-widget .pvd-flight-table .combined-status.status-departed,
#pvd-flight-status-widget .pvd-flight-card-status.status-departed {
    background-color: #54595F !important;
    color: #ffffff !important;
}

@media (max-width: 700px) {
    #pvd-flight-status-widget .pvd-flight-table .combined-status,
    #pvd-flight-status-widget .pvd-flight-card-status {
        padding: 8px 14px !important;
        min-width: 120px !important;
        font-size: 0.95em !important;
        margin: 5px 0 !important;
    }
}

/* AVX 2026-08-04 (g): visible keyboard focus (WCAG 2.4.7).
   Two problems: Astra ships `button:focus { outline: 0 }` which killed the ring on
   the day/nav buttons, and the plugin only styled the search input - with
   `box-shadow: 0 0 0 2px rgba(204,33,42,.1)`, a 10%-alpha ring that is invisible in
   practice. Result: four of the five controls had no focus indicator at all.

   Rings are drawn INSET via a negative outline-offset. Several widget containers
   carry `overflow: hidden`, which would clip an outset outline or box-shadow. Inset
   also means the ring sits on the button's own fill, so the colour is predictable:
   white on #CC212A red = 5.5:1, on #54595F grey = 7.07:1, both clearing the 3:1
   that WCAG 2.4.11 asks of a focus indicator. */
#pvd-flight-status-widget .pvd-day-button:focus-visible,
#pvd-flight-status-widget .pvd-nav-button:focus-visible,
#pvd-flight-status-widget .pvd-refresh-button:focus-visible {
    outline: 3px solid #ffffff !important;
    outline-offset: -4px !important;
    box-shadow: none !important;
}

/* The search input is light-filled, so white would vanish - use brand red. */
#pvd-flight-status-widget #pvd-flight-search-input:focus-visible,
.pvd-flight-status-widget #pvd-flight-search-input:focus {
    outline: 3px solid #cc212a !important;
    outline-offset: -3px !important;
    border-color: #cc212a !important;
    box-shadow: none !important;
}

/* Engines without :focus-visible fall back to :focus so the ring is never missing. */
@supports not selector(:focus-visible) {
    #pvd-flight-status-widget .pvd-day-button:focus,
    #pvd-flight-status-widget .pvd-nav-button:focus,
    #pvd-flight-status-widget .pvd-refresh-button:focus {
        outline: 3px solid #ffffff !important;
        outline-offset: -4px !important;
    }
}

/* AVX 2026-08-04 (h): uniform pill sizing + supporting bits.
   Labels ranged 90px ("Canceled") to 143px ("Arrived (Early 16m)"), so the column
   read as ragged. The longest label the renderer can emit is
   "Departed (Late 3h 10m)" at roughly 162px including padding, so 170px covers
   every case with room to spare inside the ~210px STATUS column. */
#pvd-flight-status-widget .pvd-flight-table .combined-status {
    min-width: 170px !important;
    width: auto !important;
    box-sizing: border-box !important;
}

/* Cards have no column to align to - fill the width instead. */
#pvd-flight-status-widget .pvd-flight-card-status {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* Carrier name shown when no logo file exists for the IATA code. */
#pvd-flight-status-widget .airline-name-fallback {
    position: static !important;
    width: auto !important;
    height: auto !important;
    clip: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    white-space: normal !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #333 !important;
}

/* "No change" dash in the UPDATE column - present but visually quiet. */
#pvd-flight-status-widget .update-time.is-unchanged {
    color: #767676 !important;
}

@media (max-width: 700px) {
    #pvd-flight-status-widget .pvd-flight-table .combined-status {
        min-width: 0 !important;
        width: 100% !important;
    }
}

/* AVX 2026-08-04 (i): simplify the status palette to encode SEVERITY, not event type.
   Previously "Arrived (On Time)" was green but "Arrived (Early 17m)" was blue, so two
   equally good outcomes read as different states. Colour now answers one question -
   does this passenger need to do anything?

     green  = nothing to worry about   (on time, early, arrived, departed)
     amber  = pay attention            (late, delayed, diverted)
     red    = problem                  (cancelled)
     grey   = neutral / in progress    (boarding, in air, taxiing, unknown)

   To restore the legacy blue-for-early, move .status-early back to its own rule with
   background #1565C0. Legacy used #2196F3, which fails AA at 3.12:1 on white. */
#pvd-flight-status-widget .pvd-flight-table .combined-status.status-early,
#pvd-flight-status-widget .pvd-flight-card-status.status-early,
#pvd-flight-status-widget .pvd-flight-table .combined-status.status-arrived,
#pvd-flight-status-widget .pvd-flight-card-status.status-arrived,
#pvd-flight-status-widget .pvd-flight-table .combined-status.status-departed,
#pvd-flight-status-widget .pvd-flight-card-status.status-departed {
    background-color: #2E7D32 !important;
    color: #ffffff !important;
}

/* Boarding / in air / taxiing stay neutral - in progress, nothing to act on yet. */
#pvd-flight-status-widget .pvd-flight-table .combined-status.status-boarding,
#pvd-flight-status-widget .pvd-flight-card-status.status-boarding,
#pvd-flight-status-widget .pvd-flight-table .combined-status.status-in-air,
#pvd-flight-status-widget .pvd-flight-card-status.status-in-air {
    background-color: #54595F !important;
    color: #ffffff !important;
}

/* AVX 2026-08-04 (j): one consistent selected state across both button pairs.
   Both groups shared the same grey inactive (#6c757d) but disagreed on active:
   Today/Tomorrow used charcoal #333333, Arrivals/Departures used brand red #cc212a.
   Charcoal against grey is a weak signal, so the day pair read as ambiguous while the
   type pair read clearly. Now: red = selected, grey = not, in both places.

   Bold on the selected item as well, so the state is not conveyed by colour alone
   (WCAG 1.4.1). aria-pressed already carries it programmatically. */
#pvd-flight-status-widget .pvd-day-button.pvd-day-selected,
#pvd-flight-status-widget .pvd-nav-button.pvd-nav-selected {
    background-color: #cc212a !important;
    color: #ffffff !important;
    font-weight: 700 !important;
}

#pvd-flight-status-widget .pvd-day-button.pvd-day-selected:hover,
#pvd-flight-status-widget .pvd-nav-button.pvd-nav-selected:hover {
    background-color: #b51d24 !important;
    color: #ffffff !important;
}

/* Unselected stays grey and normal weight in both groups. */
#pvd-flight-status-widget .pvd-day-button:not(.pvd-day-selected),
#pvd-flight-status-widget .pvd-nav-button:not(.pvd-nav-selected) {
    background-color: #6c757d !important;
    color: #ffffff !important;
    font-weight: 400 !important;
}
