/* Outer wrapper - inherits site font */
.hhh-compact-wrapper { font-family: inherit; }

/* Each flight row - card style with rounded corners and light background */
.hhh-compact-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
    background-color: #FAF8F5CC;
    padding: 10px;
    border-radius: 20px;      
    margin-bottom: 20px;
}

/* Remove bottom border on the last row to avoid double-border with container */
.hhh-compact-row:last-child { border-bottom: none; }

/* "NEXT DEPARTURE" / "NEXT ARRIVAL" label above the city */
.hhh-compact-label {
    font-size: 12px;
    font-weight: 600;
    color: #666666;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    min-width: 110px;
}

/* Middle section containing label, city, and flight detail */
.hhh-compact-main { flex: 1; padding: 0 12px; }

/* Large city/airport code display */
.hhh-compact-city { font-size: 18px; font-weight: 700; color: #006472; }

@media (max-width: 767px) {
    /* Large city/airport code display */
    .hhh-compact-city { font-size: 16px; font-weight: 500; color: #006472; }
}    

/* Smaller airline name + flight number below city */
.hhh-compact-detail { font-size: 12px; color: #666666; margin-top: 2px; }

/* Status badge (On Time, Early, Delayed, etc.) */
.hhh-compact-status {
    font-size: 12px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 12px;
    white-space: nowrap;
}

/* All status states use the same gold color in compact mode */
.hhh-compact-status.arrived  { color: #ffffff; background-color: #C9A961; }
.hhh-compact-status.departed { color: #ffffff; background-color: #C9A961; }
.hhh-compact-status.ontime   { color: #ffffff; background-color: #C9A961; }
.hhh-compact-status.early    { color: #ffffff; background-color: #C9A961; }
.hhh-compact-status.delayed  { color: #ffffff; background-color: #C9A961; }
.hhh-compact-status.cancelled{ color: #ffffff; background-color: #C9A961; }

/* Loading and error state text */
.hhh-compact-loading { color: #666666; font-size: 14px; padding: 10px 0; }
.hhh-compact-error   { color: #c62828; font-size: 14px; padding: 10px 0; }

/* Fixed-width column for airline logo - keeps layout stable when no image */
.hhh-compact-logo-col {
    width: 55px;
    min-width: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
}

/* Airline logo image constraints */
.hhh-compact-airline-logo {
    max-width: 55px;
    max-height: 55px;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* Scheduled time shown inline with the label in brand teal */
.hhh-schedule-time {
    color: #006472;
}

.hhh-mobile-break-hide {
    display: inline-block;
}

.hhh-mobile-break {
    display: none;
    height: 0px;
}

@media (max-width: 767px) {
    /* Mobile Break */
    .hhh-mobile-break {
        display: block;
    }
    
    .hhh-mobile-break-hide {
        display: none;
    }        
} 

@media (max-width: 1024px) {
    .hhh-compact-row {
        flex-wrap: wrap;
    }

    .hhh-compact-main {
        flex: 1;
    }

    .hhh-compact-status {
        width: fit-content;
        margin-top: 8px;
        margin-bottom: 4px;
        margin-left: calc(120px + 12px + 12px);
    }
}