/* ── Generic responsive overrides ──────────────────────── */
.home-layer{
    min-width:400px;
}

@media (max-width: 768px) {
    .alt-criteria-box {
        padding: 8px;
    }
    .panel-header {
        font-size: 0.7rem;
        padding: 10px 12px;
    }
    .panel-body {
        padding: 12px 0px;
    }
}


@media(max-width:670px){
    .notam-filter-row{flex-direction: column; justify-content: flex-start;justify-content: center;align-items: flex-start;}
    .notam-search{width: 100%;}
}

@media (max-width: 600px) {
    html { font-size: 14px; }
    .header { padding: 24px 0 16px; }
    .header h1 { font-size: 1.5rem; }
    .header .subtitle { font-size: 0.8rem; }
    .header .subtitle-detail { font-size: 0.65rem; }
    .feature-badge { font-size: 0.6rem; padding: 2px 7px; }
    .route-bar { min-height: 42px; }
    .route-input { font-size: 0.9rem; padding: 6px 8px; }
    .route-badge { font-size: 0.7rem; padding: 3px 6px; }
    .badge { font-size: 0.6rem; padding: 3px 4px; }
    .metar-strip { font-size: 0.7rem; }
    .metar-strip-row { flex-wrap: wrap; }
    .grid-cell-metar .metar-raw-text { font-size: 0.65rem; white-space: normal; word-break: normal; overflow-wrap: break-word; }
    .metar-lt { display: none; }
    .metar-utc-full { display: none; }
    .metar-utc-compact { display: inline; }
    .metar-adv-token { min-width: 60px; }
    .metar-adv-row { flex-direction: column; gap: 1px; }
    .alt-overall { flex-direction: column; gap: 6px; }
    .alt-criteria-content { font-size: 0.6rem; }
    .compliance-v2 { font-size: 0.65rem; }
    .compliance-v2 th, .compliance-v2 td { padding: 2px 4px; }
    .cv { font-size: 0.65rem; padding: 1px 5px; }
    .cv-limit { font-size: 0.6rem; }
    .taf-period { flex-direction: column; align-items: flex-start; gap: 2px; }
    .notam-item .notam-text { font-size: 0.65rem; }
    .settings-modal { width: 95%; max-height: 90vh; }
    .custom-aircraft-form { grid-template-columns: 1fr; }
    .meteo-placeholders { font-size: 0.6rem; }
    .footer { font-size: 0.62rem; padding: 12px 0; margin-top: 40px; }
}

/* ── Large screen scaling ──────────────────────────────── */

@media (min-width: 1200px) {
    html { font-size: 16px; }
    .container { max-width: 1100px; }

    /* Bump sub-0.65rem sizes that stay too small after root scaling */
    .compliance-param-name { font-size: 0.65rem; }
    .compliance-subcat-limit { font-size: 0.6rem; }
    .cv-limit { font-size: 0.6rem; }

    .compliance-subcat-label,
    .alt-row-sep,
    .alt-row-reqd,
    .rwy-badge { font-size: 0.7rem; }

    .compliance-rows .cv,
    .alt-rows .cv { font-size: 0.76rem; }

    /* Font bumps only — column layouts moved to container queries below */
}

@media (min-width: 1440px) {
    html { font-size: 17px; }
    .container { max-width: 1200px; }

    .compliance-param-name { font-size: 0.68rem; }
    .compliance-subcat-limit { font-size: 0.63rem; }
    .cv-limit { font-size: 0.63rem; }

    .compliance-subcat-label,
    .alt-row-sep,
    .alt-row-reqd { font-size: 0.72rem; }
}

/* ── Short-screen height breakpoints ───────────────────── */

@media (max-height: 750px) {
    .header { padding: 16px 0 12px; }
    .header h1 { font-size: 2.2rem; }
    .header .subtitle { margin-top: 4px; }
    .header .feature-badges { margin-top: 12px; }
    .mode-cards { gap: 20px; }
    .mode-card-title { font-size: 1rem; letter-spacing: 1.5px; }
    .mode-card-desc { font-size: 0.74rem; }
}

@media (max-width: 500px) {
    .fb-smallhide{
        display:none;
    }
}

/* ── Placeholder size — small screens ──────────────────── */

@media (max-width: 640px) {
    .route-input::placeholder       { font-size: 0.78rem; }
    .pdf-airport-input::placeholder { font-size: 0.68rem; }
}

@media (max-width: 430px) {
    .route-input::placeholder       { font-size: 0.65rem; }
    .pdf-airport-input::placeholder { font-size: 0.58rem; }
}

@media (max-height: 620px) {
    .header { padding: 8px 0 8px; }
    .header h1 { font-size: 1.8rem; letter-spacing: 3px; }
    .header .subtitle-detail { margin-top: 2px; }
    .header .feature-badges { margin-top: 8px; gap: 4px; }
    .mode-cards { gap: 14px; }
    .mode-card-title { font-size: 0.9rem; letter-spacing: 1px; margin-bottom: 6px; }
    .mode-card-desc { font-size: 0.7rem; line-height: 1.4; }
}

@media (max-height: 800px) {
    .home-layer .hero-spacer,
    .mode-layer .hero-spacer {
        flex-grow: 1;
    }
}
