/* ============================================
   PLANE MAP – THEME TOGGLE + LIGHT/DARK PANELS
   (from injectThemeCss)
   ============================================ */

/* Toggle button */
.leaf-theme-toggle {
    position: absolute;
    top: 10px;
    right: 124px;
    z-index: 9999;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: none;
    display: grid;
    place-items: center;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
    transition: transform .12s ease, filter .12s ease;
}

    .leaf-theme-toggle svg {
        display: block;
    }

    .leaf-theme-toggle:hover {
        filter: brightness(1.08);
        transform: translateY(-1px);
    }

    .leaf-theme-toggle:active {
        transform: translateY(0);
    }

    .leaf-theme-toggle:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: 2px;
    }

/* Theme-aware colors */
.leaf-theme-dark .leaf-theme-toggle {
    background: #1f2937;
    color: #fff;
}

.leaf-theme-light .leaf-theme-toggle {
    background: #0ea5e9;
    color: #fff;
}

/* LIGHT panels */
.leaf-theme-light .plane-summary,
.leaf-theme-light .plane-schedule,
.leaf-theme-light .plane-settings {
    background: rgba(248,250,252,.95);
    color: #0f172a;
    box-shadow: 0 4px 14px rgba(0,0,0,.18);
}

.leaf-theme-light .sch-day {
    background: rgba(248,250,252,.95);
    color: #0f172a;
    border: 2px solid #cbd5e1;
}

.leaf-theme-light .sch-row {
    background: #eef2ff;
}

    .leaf-theme-light .sch-row.dep {
        background: #ecfeff;
    }

    .leaf-theme-light .sch-row.arr {
        background: #fef3c7;
    }

/* DARK panels */
.leaf-theme-dark .plane-summary,
.leaf-theme-dark .plane-schedule,
.leaf-theme-dark .plane-settings {
    background: #0f172acc;
    color: #e5e7eb;
    box-shadow: 0 4px 14px rgba(0,0,0,.25);
}

.leaf-theme-dark .sch-day {
    background: #0f172acc;
    color: #e5e7eb;
    border: 2px solid #2a3042;
}

.leaf-theme-dark .sch-row {
    background: #1f2937;
}

    .leaf-theme-dark .sch-row.dep {
        background: #0b3a46;
    }

    .leaf-theme-dark .sch-row.arr {
        background: #3a2e0b;
    }

/* schedule row text uses reg color if provided */
.sch-row {
    color: var(--reg-color, inherit);
}

.uk-board-hidden {
    display: none !important;
}



/* ==================================================
   PLANE MAP – CORE CSS (from injectOnce / v6→v8)
   ================================================== */

/* =========================
   BASICS / TOKENS
   ========================= */
:root {
    --badge-flash-duration: 6s;
    --accent: #2b7cff;
    /* Light theme = black halo */
    --plane-halo-rgb: 0,0,0;
}

.dark {
    /* Dark theme = white halo */
    --plane-halo-rgb: 255,255,255;
}

@media (prefers-color-scheme: dark) {
    :root {
        --plane-halo-rgb: 255,255,255;
    }
}

/* =========================
   PLANE BADGE + FLASH
   ========================= */
.plane-badge {
    padding: 3px 8px;
    border-radius: 10px;
    color: #fff;
    font: 600 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans;
    white-space: nowrap;
    box-shadow: 0 1px 3px rgba(0,0,0,.25);
    display: inline-flex;
    gap: 6px;
    align-items: center;
    will-change: opacity;
}

.badge-maint-icon svg {
    display: block;
}

.badge-text {
    display: inline-block;
}

.plane-badge.flash {
    animation: badgeFlash var(--badge-flash-duration) linear infinite;
    animation-delay: var(--flash-delay,0s);
}

.plane-flash {
    animation: planeFlash var(--badge-flash-duration) linear infinite;
    animation-delay: var(--flash-delay,0s);
}

@keyframes badgeFlash {
    0% {
        opacity: 1;
    }

    45% {
        opacity: .3;
    }

    55% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes planeFlash {
    0% {
        opacity: 1;
    }

    45% {
        opacity: .35;
    }

    55% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/* =========================
   FLOATING ACTION BUTTONS (FABs)
   ========================= */
.plane-info-toggle,
.plane-notam-toggle,
.plane-schedule-toggle,
.leaf-theme-toggle,
.plane-settings-toggle,
.plane-gantt-toggle,
.plane-defers-toggle,
.plane-demands-toggle {
    position: absolute;
    z-index: 9999;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    display: grid;
    place-items: center;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
    transition: transform .12s ease, filter .12s ease;
    font-weight: 700;
}

.plane-demands-toggle {
    top: 10px;
    right: 198px;
}
/* next to defers */
/* Positions */
.plane-settings-toggle {
    top: 10px;
    right: 10px;
}

.leaf-theme-toggle {
    top: 10px;
    right: 48px;
}

.plane-info-toggle {
    top: 10px;
    right: 86px;
}

.plane-gantt-toggle {
    top: 10px;
    right: 124px;
}

.plane-defers-toggle {
    top: 10px;
    right: 162px;
}

.plane-notam-toggle {
    top: 10px;
    right: 198px;
}

    /* Shared hover/active/focus */
    .plane-settings-toggle:hover,
    .plane-gantt-toggle:hover,
    .plane-notam-toggle:hover,
    .plane-info-toggle:hover,
    .leaf-theme-toggle:hover,
    .plane-schedule-toggle:hover,
    .plane-defers-toggle:hover {
        filter: brightness(1.05);
        transform: translateY(-1px);
    }

    .plane-settings-toggle:active,
    .plane-gantt-toggle:active,
    .plane-notam-toggle:active,
    .plane-info-toggle:active,
    .leaf-theme-toggle:active,
    .plane-schedule-toggle:active,
    .plane-defers-toggle:active {
        transform: translateY(0);
    }

    .plane-settings-toggle:focus-visible,
    .plane-gantt-toggle:focus-visible,
    .plane-notam-toggle:focus-visible,
    .plane-info-toggle:focus-visible,
    .leaf-theme-toggle:focus-visible,
    .plane-schedule-toggle:focus-visible,
    .plane-defers-toggle:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: 2px;
    }

/* Theme colors */
.leaf-theme-light .plane-settings-toggle {
    background: darkslategrey;
    color: #0b1b10;
}

.leaf-theme-dark .plane-settings-toggle {
    background: #1f2937;
    color: #e5e7eb;
}

.leaf-theme-light .plane-info-toggle,
.leaf-theme-light .plane-schedule-toggle,
.leaf-theme-light .leaf-theme-toggle {
    background: #0ea5e9;
    color: #fff;
}

.leaf-theme-dark .plane-info-toggle,
.leaf-theme-dark .plane-schedule-toggle,
.leaf-theme-dark .leaf-theme-toggle {
    background: #1f2937;
    color: #e5e7eb;
}

.leaf-theme-light .plane-gantt-toggle {
    background: #f59e0b;
    color: #0b1b10;
}

.leaf-theme-dark .plane-gantt-toggle {
    background: #1f2937;
    color: #e5e7eb;
}

/* NOTAM FAB */
.leaf-theme-light .plane-notam-toggle {
    background: salmon;
    color: #fff;
}

.leaf-theme-dark .plane-notam-toggle {
    background: #1f2937;
    color: #e5e7eb;
}

.plane-notam-toggle[aria-pressed="true"] {
    box-shadow: 0 0 0 3px rgba(124,58,237,.35), 0 2px 8px rgba(0,0,0,.35);
    filter: brightness(1.06);
}

.plane-notam-toggle:hover::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: radial-gradient(120% 120% at 30% 20%, rgba(255,255,255,.18), transparent 60%);
    pointer-events: none;
}

/* Deferred Items FAB */
.leaf-theme-light .plane-defers-toggle {
    background: #8b5cf6;
    color: #fff;
}

.leaf-theme-dark .plane-defers-toggle {
    background: #1f2937;
    color: #e5e7eb;
}

/* =========================
   MAP MARKER + PULSE
   ========================= */
.stack-dim .plane-svg,
.stack-dim .plane-badge {
    opacity: .52;
}

.stack-dim .pulse-ring {
    display: block !important;
}

.stack-active .plane-svg,
.stack-active .plane-badge {
    opacity: 1;
}

.leaflet-marker-icon.hover-force-badge .plane-badge {
    display: inline-flex !important;
}

.plane-svg {
    position: relative;
}

    .plane-svg svg {
        position: relative;
        z-index: 2;
        zoom: 1.2;
    }

.pulse-ring {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    box-sizing: border-box;
    z-index: 1;
    border: 2px solid var(--pulse-color,#ff9800);
    opacity: 0;
    transform: scale(.7);
    pointer-events: none;
}

    .pulse-ring.show {
        animation: ringPulse 1.8s ease-out infinite;
        opacity: 1;
    }

    .pulse-ring.static {
        animation: none;
        opacity: 1;
        transform: scale(1.4);
        box-shadow: 0 0 10px var(--pulse-color,#ff3b30);
    }

    .pulse-ring.halo {
        animation: ringPulse 3.2s ease-out infinite;
        opacity: .6;
        transform: scale(1.6);
        border-color: var(--pulse-color);
        box-shadow: 0 0 0 2px var(--pulse-color), 0 0 8px var(--pulse-color), 0 0 12px var(--pulse-color);
    }

@keyframes ringPulse {
    0% {
        transform: scale(1.2);
        opacity: .95;
    }

    70% {
        transform: scale(1.6);
        opacity: .15;
    }

    100% {
        transform: scale(2.3);
        opacity: .5;
    }
}

/* =========================
   DETAIL PANEL (LEFT) – FIRST VERSION
   ========================= */

.fr-next-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed #e5e7eb;
    font-size: 0.75rem;
    color: #4b5563;
}

.fr-next-title {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: blue;
}

.fr-next-leg {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: bold;
    font-size: 1.3rem;
}

.fr-next-code {
    letter-spacing: 0.08em;
}

.fr-next-arrow {
    font-size: 0.9rem;
}

.fr-next-times {
    display: flex;
    justify-content: space-between;
    margin-top: 2px;
    font-size: 1.35rem;
    color: black;
    font-weight: bold;
    background: darkseagreen;
}

/* Top bar */
.fr-top {
    position: relative;
    display: flex;
    align-items: center;
    padding: 6px 10px;
    border-bottom: 4px solid var(--accent, #2b7cff);
}

/* Left block (flight & airline) keeps its normal flow */
.fr-top-left {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* Centered ETA pill */
.fr-eta-pill {
    position: absolute;
    left: 72%;
    transform: translateX(-50%);
    display: inline-flex;
    flex-direction: column;
    align-items: center;
}

/* ETA label + time styling */
.fr-eta-label {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #0f172a;
}

.fr-eta-time {
    margin-top: 2px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #facc15;
    color: #111827;
    font-weight: 700;
    font-size: 0.95rem;
}

/* optional: on very small screens shrink ETA a bit */
@media (max-width: 480px) {
    .fr-eta-time {
        font-size: 1.1rem;
    }
}

/* CARD CONTAINER INSIDE plane-detail */
.fr-progress-inner {
    transition: width 0.3s ease;
}

/* flying → yellow */
.fr-progress-inner-live {
    background: #facc15;
}

/* landed → blue */
.fr-progress-inner-landed {
    background: #3b82f6;
}

/* maint (optional) → orange */
.fr-progress-inner-maint {
    background: #fb923c;
}

.fr-card {
    display: flex;
    flex-direction: column;
    background: #f9fafb;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.12);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.3);
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.fr-flight-line {
    display: flex;
    gap: 6px;
    align-items: center;
}

.fr-flightid {
    font-weight: 700;
    font-size: 1.2rem;
}

/* Base badge */
.fr-badge {
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border: 1px solid rgba(148, 163, 184, 0.55);
    color: #e5e7eb;
}

/* FLYING / LIVE → Yellow */
.fr-badge-live {
    background: #facc15;
    color: #111827;
    border-color: rgba(234, 179, 8, 0.8);
}

/* LANDED → Blue */
.fr-badge-landed {
    background: rgba(59, 130, 246, 0.35);
    border-color: rgba(37, 99, 235, 0.9);
    color: blue;
}

/* Optional: MAINT → Orange */
.fr-badge-maint {
    background: rgba(251, 146, 60, 0.35);
    border-color: rgba(234, 88, 12, 0.9);
    color: #fdba74;
}

.fr-airline {
    font-size: 0.75rem;
    opacity: 0.85;
}

.fr-reg-small {
    font-size: 0.75rem;
    font-weight: 600;
}

/* MAIN SECTION: left (LOS/CDG) + right stats */
.fr-main {
    display: flex;
    background: #ffffff;
    padding: 8px 10px;
    gap: 10px;
}

/* left side */
.fr-main-left {
    flex: 2;
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: aliceblue;
}

.fr-leg-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fr-leg {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.fr-code {
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.fr-city {
    font-size: 0.75rem;
    text-transform: uppercase;
    color: #6b7280;
}

.fr-plane-icon {
    padding: 4px 6px;
    border-radius: 999px;
    background: #f3f4f6;
    font-size: 0.8rem;
}

/* progress + times */
.fr-progress-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 4px;
}

.fr-progress {
    position: relative;
    height: 4px;
    border-radius: 999px;
    overflow: hidden;
}

.fr-progress-inner {
    position: absolute;
    inset: 0;
    width: 60%; /* you can later bind a real percent */
}

.fr-times {
    display: flex;
    justify-content: space-between;
    font-size: 0.7rem;
    color: #6b7280;
}

/* right side stats */
.fr-main-right {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-left: 6px;
    border-left: 1px solid #e5e7eb;
    background: aliceblue;
}

.fr-stat-block {
    display: flex;
    flex-direction: column;
}

.fr-stat-label {
    font-size: 0.7rem;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.fr-stat-value {
    font-size: 0.85rem;
    font-weight: 700;
}

/* AIRCRAFT / REG LINE */
.fr-midline {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: #f3f4f6;
    font-size: 0.75rem;
}

.fr-mid-aircraft {
    font-weight: 600;
}

.fr-mid-sep {
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.fr-mid-reg-label {
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.fr-mid-reg {
    Defferr
}

/* BOTTOM ACTION BAR */
.fr-bottom {
    display: flex;
    align-items: stretch;
    justify-content: space-around;
    background: linear-gradient( grey, transparent);
    color: black;
    padding: 4px 2px;
}

.fr-action {
    flex: 1;
    border: none;
    background: transparent;
    color: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 4px 0;
    font-size: 0.7rem;
    font-weight: 500;
    cursor: pointer;
}

.fr-action-icon {
    font-size: 1rem;
}

.fr-action[disabled] {
    opacity: 0.45;
    cursor: default;
}

/* MOBILE TWEAKS */
@media (max-width: 800px) {
    .fr-main {
        flex-direction: column;
    }

    .fr-main-right {
        flex-direction: row;
        justify-content: space-between;
        border-left: none;
        border-top: 1px solid #e5e7eb;
        padding-left: 0;
        padding-top: 6px;
    }

    .fr-stat-block {
        min-width: 0;
    }

    .fr-stat-value {
        font-size: 0.8rem;
    }
}

/* =========================
   DETAIL PANEL CONTAINER
   ========================= */
.plane-detail {
    position: absolute;
    z-index: 999998;
    left: 50%;
    top: 80px;
    transform: translate(-50%, -24px);
    opacity: 0;
    width: min(420px, calc(100vw - 24px));
    max-height: 70%;
    display: none;
    overflow: hidden;
    border-radius: 14px;
    box-shadow: 0 18px 60px rgba(0, 0, 0, 0.35);
    background: transparent;
    border: none;
    transition: transform 0.25s ease-out, opacity 0.2s ease-out;
}

    .plane-detail.open {
        display: block;
        transform: translate(-50%, 0);
        opacity: 1;
    }

.leaf-theme-light .plane-detail {
    background: rgba(248,250,252,.95);
    color: #0f172a;
}

.leaf-theme-dark .plane-detail {
    background: #0f172acc;
    color: #e5e7eb;
}

.plane-detail .det-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font: 700 14px/1 system-ui;
    margin-bottom: 6px;
}

.leaf-theme-light .plane-detail .det-close,
.leaf-theme-dark .plane-detail .det-close {
    appearance: none;
    border: 0;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    cursor: pointer;
}

.leaf-theme-dark .plane-detail .det-close {
    background: #334155;
    color: #e5e7eb;
}

.leaf-theme-light .plane-detail .det-close {
    background: #e2e8f0;
    color: #0f172a;
}

.plane-detail .det-body {
    max-height: calc(70vh - 40px);
    overflow-y: auto;
    padding: 8px 8px 10px;
    -webkit-overflow-scrolling: touch;
}

.plane-detail .det-empty {
    color: #94a3b8;
    font: 600 12px/1.1 system-ui;
}

/* Shared head row (detail + summary) */
.plane-detail .det-row.head,
.plane-summary .det-row.head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 8px;
    border-radius: 8px;
    background: rgba(148,163,184,.15);
    border-left: 4px solid var(--accent);
}

.plane-detail .det-reg,
.plane-summary .det-reg {
    font: 500 16px/1 system-ui;
    letter-spacing: .4px;
}

/* Status pills */
.plane-detail .det-status,
.plane-summary .det-status {
    font: 800 14px/1 system-ui;
    padding: 4px 6px;
    border-radius: 6px;
}

    .plane-detail .det-status.live,
    .plane-summary .det-status.live {
        background: #fde047;
        color: #3f2d00;
    }

    .plane-detail .det-status.landed,
    .plane-summary .det-status.landed {
        background: aliceblue;
        color: dodgerblue;
    }

    .plane-detail .det-status.maint,
    .plane-summary .det-status.maint {
        background: #fee2e2;
        color: #7f1d1d;
    }

/* Grid + actions inside detail */
.plane-detail .det-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 12px;
    font: 600 12px/1.2 system-ui;
}

    .plane-detail .det-grid label {
        opacity: .7;
        font-weight: 800;
        font-size: 11px;
        display: block;
    }

.plane-detail .det-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.plane-detail .btn {
    appearance: none;
    border: 0;
    border-radius: 8px;
    padding: 6px 10px;
    cursor: pointer;
    font: 700 12px/1 system-ui;
    background: #93c5fd;
    color: #0b1b10;
}

.leaf-theme-dark .plane-detail .btn {
    background: #1f2937;
    color: #e5e7eb;
}

.plane-detail a.btn {
    text-decoration: none;
    display: inline-block;
}

.plane-detail .btn[disabled] {
    opacity: .45;
    cursor: not-allowed;
    filter: saturate(.6);
}

.plane-detail-close {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 1;
    border: none;
    border-radius: 999px;
    width: 22px;
    height: 22px;
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
    background: rgba(15, 23, 42, 0.75);
    color: #f9fafb;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 768px) {
    .plane-detail {
        top: auto;
        bottom: 20px;
        left: 50%;
        width: 100vw;
        max-width: 100vw;
        max-height: 60vh;
        border-radius: 16px 16px 0 0;
        transform: translate(-50%, 110%);
    }

        .plane-detail.open {
            transform: translate(-50%, 0);
        }

        .plane-detail .det-body {
            max-height: calc(60vh - 40px);
        }
}

/* =========================
   SUMMARY PANEL (RIGHT)
   ========================= */
.plane-summary {
    position: absolute;
    top: 44px;
    right: 10px;
    z-index: 9998;
    max-height: 80vh;
    width: 340px;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    background: #0f172acc;
    border-radius: 10px;
    padding: 8px;
    box-shadow: 0 4px 14px rgba(0,0,0,0.25);
    display: none;
}

    .plane-summary.open {
        display: block;
    }



.sum-header {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: space-between;
    margin: 4px 0 8px;
}

    .sum-header span {
        flex: 1;
        text-align: center;
        font-size: 14px;
    }

.sum-overview {
    border: 0;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 700;
    cursor: pointer;
    background: #22c55e;
    color: #0b1b10;
}

.sum-sr-all {
    text-decoration: none;
    font-weight: 700;
    color: #0b1b10;
    background: #93c5fd;
    padding: 6px 10px;
    border-radius: 8px;
}

.sum-empty {
    color: #cbd5e1;
    font: 600 13px/1 system-ui;
    padding: 8px;
    text-align: center;
}

/* Live flash in summary header */
@keyframes liveSummaryFlash {
    0% {
        opacity: 1;
    }

    50% {
        opacity: .35;
    }

    100% {
        opacity: 1;
    }
}

.plane-summary .det-row.head.live.flash {
    animation: liveSummaryFlash 3.4s linear infinite;
}

/* SR pill */
.plane-summary .det-row.head {
    margin-bottom: 8px;
}

.plane-summary .det-sr-pill,
.plane-summary .sum-item .sum-sr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font: 800 11px/1 system-ui;
    padding: 2px 6px;
    border-radius: 6px;
    margin-left: 8px;
    background: #93c5fd;
    color: #0b1b10;
    border: 1px solid rgba(0,0,0,.15);
}

.leaf-theme-dark .plane-summary .det-sr-pill,
.leaf-theme-dark .plane-summary .sum-item .sum-sr {
    background: #60a5fa;
    color: #0b1b10;
    border-color: rgba(0,0,0,.35);
    box-shadow: 0 1px 2px rgba(0,0,0,.45);
}

/* Legacy list items styled as head rows */
.plane-summary .sum-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 8px;
    border-radius: 8px;
    background: rgba(148,163,184,.15);
    border-left: 4px solid var(--accent);
    margin-bottom: 8px;
}

    .plane-summary .sum-item .label {
        display: flex;
        align-items: center;
        gap: 8px;
    }

        .plane-summary .sum-item .label::after {
            font: 800 11px/1 system-ui;
            padding: 2px 6px;
            border-radius: 6px;
        }

    .plane-summary .sum-item.live .label::after {
        content: "LIVE";
        background: #fde047;
        color: #3f2d00;
    }

    .plane-summary .sum-item.landed .label::after {
        content: "LANDED";
        background: #e2e8f0;
        color: #0f172a;
    }

    .plane-summary .sum-item.maint .label::after {
        content: "MAINT";
        background: #fee2e2;
        color: #7f1d1d;
    }

/* Summary LIVE meta */
.plane-summary .det-row.head.live .sum-meta {
    background: #fde047 !important;
    color: #0b1b10;
    font-weight: 400;
    padding: 2px 6px;
    border-radius: 6px;
    letter-spacing: .4px;
}

.plane-summary .det-row.head.flash .sum-meta {
    font: 700 16px/1 system-ui;
    animation: sumMetaFlashYellow 1.8s ease-in-out infinite;
}

@keyframes sumMetaFlashYellow {
    0%, 100% {
        color: #f59e0b;
    }

    50% {
        color: #f59e0b;
        text-shadow: 0 0 2px rgba(245,158,11,.7);
    }
}

@media (prefers-reduced-motion: reduce) {
    .plane-summary .det-row.head.flash .sum-meta {
        animation: none;
        color: #22c55e;
        text-shadow: none;
    }
}

/* Summary row hover highlight (link to Gantt) */
.plane-summary .det-row.head {
    position: relative;
}

    .plane-summary .det-row.head.hovering {
        background: rgba(0,0,0,.06);
    }

.leaf-theme-dark .plane-summary .det-row.head.hovering {
    background: rgba(255,255,255,.06);
}

.plane-summary .det-row.head.hovering::before {
    content: "";
    position: absolute;
    left: -3px;
    right: -3px;
    top: -3px;
    bottom: -3px;
    border: 3px solid #ffc300;
    border-radius: 8px;
    pointer-events: none;
}

.plane-summary.has-row-hover .det-row.head:not(.hovering) {
    opacity: .2;
    transition: opacity .12s ease;
}

/* =========================
   SCHEDULE PANEL
   ========================= */
.plane-schedule {
    position: absolute;
    right: 10px;
    z-index: 9997;
    background: #0f172acc;
    border-radius: 10px;
    padding: 8px;
    box-shadow: 0 4px 14px rgba(0,0,0,.25);
    display: none;
    overflow: hidden;
    width: 340px;
    contain: layout paint;
}

    .plane-schedule.open {
        display: block;
    }

.sch-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: green;
    font: 700 14px/1 system-ui;
    margin: 2px 2px 8px;
}

.leaf-theme-light .sch-close,
.leaf-theme-dark .sch-close {
    appearance: none;
    border: 0;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    cursor: pointer;
}

.leaf-theme-dark .sch-close {
    background: #334155;
    color: #e5e7eb;
}

.sch-body {
    overflow-y: auto;
    max-height: inherit;
    padding-right: 6px;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.plane-schedule .sch-body {
    scrollbar-width: thin;
    scrollbar-color: rgba(148,163,184,.6) transparent;
}

    .plane-schedule .sch-body::-webkit-scrollbar {
        width: 8px;
    }

    .plane-schedule .sch-body::-webkit-scrollbar-track {
        background: transparent;
    }

    .plane-schedule .sch-body::-webkit-scrollbar-thumb {
        background: rgba(148,163,184,.6);
        border-radius: 8px;
    }

.sch-day {
    background: #f8fafc;
    color: #0f172a;
    border-radius: 8px;
    padding: 8px;
    margin: 6px 0;
    border: 2px solid #2a3042;
}

.sch-day-title {
    font: 700 14px/1.2 system-ui;
    margin-bottom: 6px;
}

.sch-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.sch-col-title {
    font: 700 12px/1 system-ui;
    color: #334155;
    margin-bottom: 4px;
}

.sch-row {
    font: 600 12px/1.1 system-ui;
    padding: 4px 6px;
    border-radius: 6px;
    background: #eef2ff;
    margin: 5px;
    display: inline-block;
}

    .sch-row.dep {
        background: #ecfeff;
    }

    .sch-row.arr {
        background: #fef3c7;
    }

    .sch-row.live {
        animation: liveSummaryFlash 3.4s linear infinite;
        border: 1px solid #60a5fa;
    }

.sch-empty {
    color: #cbd5e1;
    font: 600 13px/1 system-ui;
    padding: 8px;
    text-align: center;
}

.eta-chip {
    margin: 4px;
    font: 700 10px/1 system-ui;
    color: #0b7a22;
    padding: 2px 6px;
    border-radius: 6px;
    background: rgba(34,197,94,.12);
    border: 1px solid rgba(34,197,94,.45);
}

/* Today highlight (Schedule) */
.sch-day.today {
    box-shadow: inset 0 0 0 2px rgba(245,158,11,.45);
    background: linear-gradient(0deg, rgba(250,204,21,.10), rgba(250,204,21,.10));
    border-color: #f59e0b;
}

.leaf-theme-dark .sch-day.today {
    box-shadow: inset 0 0 0 1px rgba(234,179,8,.45);
    background: linear-gradient(0deg, rgba(234,179,8,.08), rgba(234,179,8,.08));
    border-color: #d97706;
}

.sch-day-title .today-chip {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 6px;
    border-radius: 999px;
    font: 800 10px/1 system-ui;
    background: #f59e0b;
    color: #0b1b10;
}

.leaf-theme-dark .sch-day-title .today-chip {
    background: #f59e0b;
    color: #0b1b10;
}

/* =========================
   TEMP CHIP (hover helper)
   ========================= */
.temp-chip {
    --temp-glow: rgba(255,255,255,.75);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) translate(var(--temp-dx,0px),var(--temp-dy,28px));
    background: rgba(20,20,20,.90);
    color: #fff;
    padding: 2px 6px;
    border-radius: 10px;
    font: 600 11px/1.2 system-ui;
    backdrop-filter: blur(2px);
    box-shadow: 0 0 0 1px rgba(255,255,255,.25), 0 2px 6px rgba(0,0,0,.35), 0 0 10px var(--temp-glow), 0 0 18px var(--temp-glow), 0 0 28px var(--temp-glow);
    opacity: 0;
    transition: opacity .2s ease, box-shadow .2s ease, transform .2s ease;
    pointer-events: none;
}

    .temp-chip.show {
        opacity: 1;
    }

.leaf-theme-light .temp-chip {
    background: rgba(255,255,255,.94);
    color: #0f172a;
    box-shadow: 0 0 0 1px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.15), 0 0 10px var(--temp-glow), 0 0 18px var(--temp-glow), 0 0 28px var(--temp-glow);
}

.stack-dim .temp-chip {
    display: none !important;
}

/* =========================
   DESTINATION PANEL + UK BOARD
   ========================= */
.dest-hidden,
.uk-board-hidden {
    display: none !important;
}

.dest-panel,
.uk-board {
    min-width: 200px;
    max-width: 260px;
    background: rgba(248,250,252,.95);
    color: #0f172a;
    border-radius: 10px;
    box-shadow: 0 4px 14px rgba(0,0,0,.18);
    border: 2px solid #cbd5e1;
    padding: 8px;
    user-select: none;
}

.leaf-theme-dark .dest-panel,
.leaf-theme-dark .uk-board {
    background: #0f172acc;
    color: #e5e7eb;
    border-color: #2a3042;
    box-shadow: 0 4px 14px rgba(0,0,0,.25);
}

.dest-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.dest-caption,
.uk-board-title {
    font: 800 14px/1.1 system-ui;
    letter-spacing: .4px;
}

.dest-body,
.uk-board-body {
    max-height: 250px;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(148,163,184,.6) transparent;
}

    .dest-body::-webkit-scrollbar,
    .uk-board-body::-webkit-scrollbar {
        width: 8px;
    }

    .dest-body::-webkit-scrollbar-thumb,
    .uk-board-body::-webkit-scrollbar-thumb {
        background: rgba(148,163,184,.6);
        border-radius: 8px;
    }

.dest-empty,
.uk-board-empty {
    font: 600 12px/1.1 system-ui;
    color: #94a3b8;
    padding: 2px 0 4px;
}

.dest-row,
.uk-board-row {
    display: flex;
    align-items: center;
    gap: 8px;
    font: 700 12px/1.1 system-ui;
    color: inherit;
    padding: 6px;
    border-radius: 8px;
    cursor: pointer;
}

    .dest-row:hover,
    .uk-board-row:hover {
        background: rgba(148,163,184,.15);
    }

    .dest-row .dot,
    .uk-board-row .dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        display: inline-block;
        background: var(--dest-color,#2b7cff);
        margin-right: 6px;
    }

    .dest-row .code {
        display: inline-flex;
        align-items: center;
        gap: 8px;
    }

    .dest-row .temp {
        font-weight: 800;
    }

    .uk-board-row .reg {
        letter-spacing: .3px;
    }

.dest-code {
    letter-spacing: .2px;
}

/* Drag handle (shared) */
.drag-handle {
    cursor: move;
    user-select: none;
    font-weight: 900;
    letter-spacing: 1px;
    padding: 0 4px;
    opacity: .6;
}

    .drag-handle:active {
        opacity: 1;
    }

/* Close buttons for generic panels */
.leaf-theme-light .panel-close,
.leaf-theme-light .dest-close {
    appearance: none;
    border: 0;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    cursor: pointer;
}

.leaf-theme-dark .panel-close,
.leaf-theme-dark .dest-close {
    appearance: none;
    border: 0;
    background: #334155;
    color: #e5e7eb;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    cursor: pointer;
}

/* Hide plane badge when in UK or special state */
.uk-hide-badge .plane-badge-wrap {
    display: none !important;
}

.leaflet-marker-icon.live-hide-badge .plane-badge {
    display: none;
}

/* =========================
   SETTINGS PANEL
   ========================= */
.plane-settings {
    position: absolute;
    top: 44px;
    right: 360px;
    z-index: 9998;
    width: 440px;
    border-radius: 10px;
    padding: 8px;
    display: none;
}

    .plane-settings.open {
        display: block;
    }

.set-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font: 700 18px/1 system-ui;
    margin: 2px 2px 8px;
}

.set-close {
    appearance: none;
    border: 0;
    background: #334155;
    color: #e5e7eb;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    cursor: pointer;
}

.set-body {
    max-height: 60vh;
    overflow: auto;
    padding-right: 6px;
}

.set-block {
    border: 1px solid rgba(148,163,184,.35);
    border-radius: 8px;
    padding: 8px;
    margin: 8px 0;
}

    .set-block > legend {
        padding: 0 6px;
        font: 800 12px/1 system-ui;
        opacity: .85;
    }

    .set-block label {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin: 4px 10px 4px 0;
        font: 600 12px/1.1 system-ui;
    }

.set-row {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-top: 6px;
}

.set-hint {
    font: 600 11px/1.2 system-ui;
    opacity: .7;
    margin-top: 4px;
}

/* =========================
   GANTT PANEL - CONTAINER
   ========================= */
.plane-gantt {
    position: absolute;
    left: 2px;
    right: 2px;
    bottom: 0;
    z-index: 9996;
    border-radius: 10px;
    padding: 8px;
    display: none;
    opacity: 0;
    transform: translateY(calc(100% + 12px));
    transition: transform .26s ease, opacity .26s ease;
    pointer-events: none;
}

    .plane-gantt.open {
        display: block;
        opacity: 1;
        transform: none;
        pointer-events: auto;
    }

.leaf-theme-light .plane-gantt {
    background: rgba(248,250,252,.95);
    color: #0f172a;
    box-shadow: 0 4px 14px rgba(0,0,0,.18);
}

.leaf-theme-dark .plane-gantt {
    background: #0f172acc;
    color: #e5e7eb;
    box-shadow: 0 4px 14px rgba(0,0,0,.25);
}

.gantt-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font: 700 14px/1 system-ui;
    margin-bottom: 6px;
}

.gantt-close {
    display: none !important;
}
/* single close via FAB */

.gantt-body {
    position: relative;
    overflow: auto;
    max-height: 480px;
    padding: 20px;
    touch-action: auto;
}

.gantt-empty {
    color: #94a3b8;
    font: 600 12px/1.1 system-ui;
}

/* controls row (can be hidden via .ctrls-hidden) */
.gantt-controls {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 6px;
}

.plane-gantt.ctrls-hidden .gantt-controls {
    display: none;
}

.gantt-ctrl-fab {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: none;
    display: grid;
    place-items: center;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
    transition: transform .12s ease, filter .12s ease;
}

    .gantt-ctrl-fab:hover {
        filter: brightness(1.06);
        transform: translateY(-1px);
    }

    .gantt-ctrl-fab:active {
        transform: translateY(0);
    }

    .gantt-ctrl-fab:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: 2px;
    }

.leaf-theme-light .gantt-ctrl-fab {
    background: #e2e8f0;
    color: #0f172a;
}

.leaf-theme-dark .gantt-ctrl-fab {
    background: #1f2937;
    color: #e5e7eb;
}

/* "Now" button */
.gantt-ctrl-wrap {
    display: flex;
    gap: 6px;
    align-items: center;
}

.gantt-now-btn {
    padding: 4px 8px;
    border: 0;
    border-radius: 8px;
    font: 700 12px/1 system-ui;
    cursor: pointer;
    background: #22c55e;
    color: #0b1b10;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
    transition: filter .12s ease, transform .12s ease;
    height: 28px;
}

    .gantt-now-btn:hover {
        filter: brightness(1.05);
        transform: translateY(-1px);
    }

    .gantt-now-btn:active {
        transform: translateY(0);
    }

    .gantt-now-btn:focus-visible {
        outline: 2px solid currentColor;
        outline-offset: 2px;
    }

.leaf-theme-dark .gantt-now-btn {
    background: #16a34a;
    color: #e5e7eb;
}

/* =========================
   GANTT LAYOUT & TRACKS
   ========================= */
.g-wrap {
    position: relative;
    min-width: 600px;
    transition: opacity var(--gwrap-fade-ms, 30ms) ease;
    will-change: opacity;
}

    .g-wrap.is-fading {
        opacity: .05;
    }

.g-row {
    display: flex;
    align-items: stretch;
    gap: 8px;
    margin: 6px 0;
}

.g-label {
    width: var(--label-w,100px);
    flex: 0 0 var(--label-w,100px);
    font: 800 12px/1 system-ui;
    padding: 2px 0;
    position: -webkit-sticky;
    position: sticky;
    left: -20px;
    z-index: 999;
    background: rgba(248,250,252,.95);
    box-shadow: 4px 0 6px -4px rgba(0,0,0,.25);
}

.leaf-theme-dark .g-label {
    background: #0f172acc;
    box-shadow: 4px 0 6px -4px rgba(0,0,0,.5);
}

.g-track {
    position: relative;
    flex: 1 1 auto;
    height: 24px;
    background: rgba(148,163,184,.15);
    border-radius: 6px;
    overflow: visible;
}

.g-label .reg-badge .leaf-theme-dark {
    background: #0f172acc;
    color: var(--reg-color,#60a5fa);
    padding: 0;
    box-shadow: none;
}

.g-label .reg-badge .leaf-theme-light {
    color: var(--reg-color,#60a5fa);
    padding: 0;
    box-shadow: none;
}

.g-label .reg-badge::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--reg-color,#60a5fa);
    display: inline-block;
    margin-right: 6px;
}

/* Bars */
.bar {
    position: absolute;
    top: 3px;
    height: 18px;
    border-radius: 4px;
    overflow: visible;
}

    .bar.flight {
        background: var(--bar-color,#60a5fa);
    }

    .bar.maint {
        background: #ef4444;
    }

    .bar.cancelled {
        background: #94a3b8;
    }

    /* Duration chip inside bar */
    .bar .dur {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        font: 800 10px/1 system-ui;
        padding: 1px 6px;
        border-radius: 6px;
        background: rgba(255,255,255,.9);
        color: #0f172a;
        white-space: nowrap;
        pointer-events: none;
    }

.leaf-theme-dark .bar .dur {
    background: rgba(15,23,42,.9);
    color: #e5e7eb;
}

/* Bar labels */
.bar .bar-label {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font: 500 10px/1 system-ui;
    color: #fff;
    pointer-events: none;
    white-space: nowrap;
}

    .bar .bar-label.dep {
        left: 6px;
    }

    .bar .bar-label.arr {
        right: 6px;
    }

    .bar .bar-label.mid {
        left: 50%;
        transform: translate(-50%,-50%);
    }

    .bar .bar-label .time {
        display: inline-block;
        font: 800 10px/1 system-ui;
        margin-left: 6px;
        padding: 1px 4px;
        border-radius: 4px;
        background: rgba(0,0,0,.065);
        color: inherit;
    }

.leaf-theme-dark .bar .bar-label .time {
    background: rgba(255,255,255,.15);
}

/* Live chips on bar */
.bar .live-chip {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font: 800 10px/1 system-ui;
    padding: 2px 6px;
    border-radius: 6px;
    background: rgba(253,224,71,.95);
    color: #3f2d00;
    pointer-events: none;
    box-shadow: 0 0 0 1px rgba(0,0,0,.12);
    white-space: nowrap;
}

.leaf-theme-dark .bar .live-chip {
    background: #fde047;
    color: #1a1300;
    box-shadow: 0 0 0 1px rgba(0,0,0,.35);
}

.bar.is-live {
    outline: 1px solid rgba(250,204,21,.7);
}

.bar .live-chip.flash {
    animation: liveSummaryFlash 3.4s linear infinite;
}

/* Center state chip */
.bar .center-chip.live {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font: 800 10px/1 system-ui;
    padding: 2px 6px;
    border-radius: 6px;
    background: rgba(255,255,255,.92);
    color: #111;
    white-space: nowrap;
    box-shadow: 0 0 0 1px rgba(0,0,0,.12);
    pointer-events: none;
}

.leaf-theme-dark .bar .center-chip {
    background: rgba(32,32,32,.92);
    color: #eee;
    box-shadow: 0 0 0 1px rgba(0,0,0,.5);
}

.bar .center-chip.live {
    background: rgba(253,224,71,.95);
    color: #3f2d00;
}

.leaf-theme-dark .bar .center-chip.live {
    background: #fde047;
    color: #1a1300;
}

.bar .center-chip.live.flash {
    animation: liveSummaryFlash 3.4s linear infinite;
}

/* Shift strip at bottom of top ruler */
.g-scale .shift-strip {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4px;
    border-radius: 0 0 6px 6px;
    overflow: hidden;
    z-index: 1;
    box-shadow: inset 0 1px 0 rgba(0,0,0,.06);
}

.g-scale .shift-seg {
    position: absolute;
    top: 0;
    bottom: 0;
}

    .g-scale .shift-seg.shift-yellow {
        background: #fffb63;
    }

    .g-scale .shift-seg.shift-blue {
        background: #4c86c4;
    }

.leaf-theme-dark .g-scale .shift-seg.shift-yellow {
    background: #fffb63;
}

.leaf-theme-dark .g-scale .shift-seg.shift-blue {
    background: #4c86c4;
}

/* Shift badges */
.bar .shift-badge {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font: 900 10px/1 system-ui;
    background: #ef4444;
    color: #fff;
    box-shadow: 0 0 0 2px rgba(255,255,255,.90);
    pointer-events: none;
    z-index: 3;
}

.leaf-theme-dark .bar .shift-badge {
    box-shadow: 0 0 0 2px rgba(15,23,42,.90);
}

.bar .shift-badge.dep {
    left: -10px;
}

.bar .shift-badge.arr {
    right: -18px;
}

.bar.cap .shift-badge.arr {
    right: -22px;
}

/* BOH tip when .cap */
.bar::after {
    content: none;
}

.bar.cap::after {
    content: "";
    position: absolute;
    right: -4px;
    top: 50%;
    width: 8px;
    height: 8px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #111;
    box-shadow: 0 0 0 2px rgba(255,255,255,.9);
}

.leaf-theme-dark .bar.cap::after {
    box-shadow: 0 0 0 2px rgba(15,23,42,.9);
}

/* Idle gaps */
.gap {
    position: absolute;
    top: 3px;
    height: 18px;
    border-radius: 4px;
    background: rgba(34,197,94,.10);
    border: 1px dashed rgba(34,197,94,.55);
}

.leaf-theme-dark .gap {
    background: rgba(34,197,94,.14);
    border-color: rgba(34,197,94,.6);
}

.gap .gap-badge {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    font: 800 10px/1 system-ui;
    padding: 1px 6px;
    border-radius: 6px;
    background: rgba(255,255,255,.9);
    color: #065f46;
    white-space: nowrap;
    pointer-events: none;
}

.leaf-theme-dark .gap .gap-badge {
    background: rgba(15,23,42,.9);
    color: #a7f3d0;
}

.gap.narrow .gap-badge {
    display: none;
}

/* Maint slice inside a gap */
.gap .maint-slice {
    position: absolute;
    top: -1px;
    bottom: -1px;
    border-radius: 4px;
    background: rgba(14,165,233,.20);
    border: 1px solid rgba(14,165,233,.55);
    pointer-events: none;
}

.leaf-theme-dark .gap .maint-slice {
    background: rgba(14,165,233,.16);
    border-color: rgba(14,165,233,.60);
}

/* “Now” line */
.now-line {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #22c55e;
    pointer-events: none;
    left: var(--label-w,100px);
    transform: translateX(var(--now-x,0px));
}

/* Custom horizontal scroll tracker */
.gantt-hscroll {
    position: relative;
    height: 14px;
    margin: 6px 6px 0;
    border-radius: 999px;
    background: linear-gradient(90deg,#3b82f6 0%,#60a5fa 100%);
    display: none;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);
    overflow: hidden;
    user-select: none;
    touch-action: none;
}

    .gantt-hscroll .thumb {
        position: absolute;
        top: 2px;
        bottom: 2px;
        left: 0;
        min-width: 24px;
        border-radius: 999px;
        background: rgba(255,255,255,.65);
        box-shadow: 0 0 0 1px rgba(0,0,0,.25);
        cursor: grab;
    }

        .gantt-hscroll .thumb.dragging {
            cursor: grabbing;
        }

/* Kill old grey tracker */
.gantt-tracker {
    display: none !important;
}

/* =========================
   GANTT SCALE / DAYS / HOURS
   ========================= */
.g-scale {
    position: relative;
    margin-left: var(--label-w,100px);
    height: 40px;
    user-select: none;
}

    .g-scale .days,
    .g-scale .hours {
        position: absolute;
        left: 0;
        right: 0;
    }

    .g-scale .days {
        top: 0;
        height: 20px;
    }

    .g-scale .day-range {
        position: absolute;
        top: 0;
        bottom: 0;
        border-bottom: 1px solid rgba(148,163,184,.45);
    }

        .g-scale .day-range span {
            position: absolute;
            left: 50%;
            top: -14px;
            transform: translateX(-50%);
            font: 600 16px/1 system-ui;
            letter-spacing: .2px;
        }

    .g-scale .hours {
        top: 20px;
        height: 20px;
    }

    .g-scale .tick {
        position: absolute;
        bottom: 0;
        width: 1px;
        height: 16px;
        background: rgba(148,163,184,.45);
    }

        .g-scale .tick.major {
            height: 20px;
            background: rgba(100,116,139,.9);
        }

        .g-scale .tick span {
            position: absolute;
            top: -14px;
            transform: translateX(-50%);
            font: 700 10px/1 system-ui;
        }

/* Top sticky ruler */
.g-ruler {
    position: sticky;
    top: 0;
    z-index: 2;
    height: 34px;
    border-bottom: 1px solid rgba(148,163,184,.35);
    background: inherit;
}

    .g-ruler .r-day {
        position: absolute;
        top: 0;
        bottom: 0;
    }

    .g-ruler .r-label {
        position: absolute;
        top: 2px;
        left: 6px;
        font: 700 12px/1 system-ui;
        opacity: .85;
    }

    .g-ruler .r-hour {
        position: absolute;
        top: 18px;
        bottom: 0;
        width: 1px;
        background: rgba(148,163,184,.4);
    }

        .g-ruler .r-hour span {
            position: absolute;
            top: -14px;
            transform: translateX(-50%);
            font: 700 10px/1 system-ui;
            opacity: .85;
        }

/* Day bands + splits */
.plane-gantt .day-band {
    position: absolute;
    top: 0;
    bottom: 0;
    pointer-events: none;
    background: rgba(100,116,139,.06);
    z-index: 0;
}

    .plane-gantt .day-band.alt {
        background: rgba(100,116,139,.10);
    }

.leaf-theme-dark .plane-gantt .day-band {
    background: rgba(148,163,184,.06);
}

    .leaf-theme-dark .plane-gantt .day-band.alt {
        background: rgba(148,163,184,.12);
    }

.plane-gantt .day-split {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 2px;
    background: rgba(100,116,139,.45);
    pointer-events: none;
    z-index: 1;
}

.leaf-theme-dark .plane-gantt .day-split {
    background: rgba(148,163,184,.35);
}

/* Weekend tint */
.plane-gantt .day-range.weekend::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: cadetblue;
    border-radius: 4px;
}

.leaf-theme-dark .plane-gantt .day-range.weekend::before {
    background: cadetblue;
}

.plane-gantt .day-range.weekend > span {
    color: black;
}

.leaf-theme-dark .plane-gantt .day-range.weekend > span {
    color: white;
}

/* Today highlight (Gantt) */
.g-wrap .day-band.today {
    background: rgba(243,240,118) !important;
}

.leaf-theme-dark .g-wrap .day-band.today {
    background: rgba(234,179,8,.14) !important;
}

.g-scale .day-range.today > span {
    background: rgba(250,204,21,.22);
    border-radius: 6px;
    padding: 2px 6px;
}

.leaf-theme-dark .g-scale .day-range.today > span {
    background: rgba(234,179,8,.18);
}

.g-wrap .day-band.today::before,
.g-wrap .day-band.today::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    height: 2px;
}

.g-wrap .day-band.today::before {
    top: -1px;
    background: rgba(250,204,21,.30);
}

.g-wrap .day-band.today::after {
    bottom: -1px;
    background: rgba(250,204,21,.22);
}

/* Hover highlight for Gantt bar + row */
.bar.hovering::after {
    content: "";
    position: absolute;
    inset: -3px;
    border: 3px solid #c1121f;
    border-radius: 6px;
    pointer-events: none;
}

.g-row.hovering .g-track {
    background: rgba(0,0,0,.06);
}

.leaf-theme-dark .g-row.hovering .g-track {
    background: rgba(255,255,255,.06);
}

.g-row.hovering .g-track::before {
    content: "";
    position: absolute;
    inset: -3px;
    border: 3px solid #ffc300;
    border-radius: 8px;
    pointer-events: none;
}

.gantt-body.has-row-hover .g-row:not(.hovering) {
    opacity: .2;
    transition: opacity .12s ease;
}

/* Dim mode for bars and footer pills */
.g-footer-row.dim .g-day-pill {
    opacity: .25;
    filter: grayscale(.4);
    transition: opacity .15s ease, filter .15s ease;
}

    .g-footer-row.dim .g-day-pill.is-hover {
        opacity: 1;
        filter: none;
    }

.g-wrap.dim .bar {
    opacity: .25;
    filter: grayscale(.5);
    transition: opacity .15s ease, filter .15s ease;
}

    .g-wrap.dim .bar.highlight {
        opacity: 1;
        filter: none;
    }

/* Crew trip overlay */
.bar.crew-trip {
    outline: 2px dashed currentColor;
    opacity: 1 !important;
    filter: none !important;
}

.crew-trip-link {
    opacity: .9;
}

.eng-code {
    font-weight: 700;
}

/* Lane container */
.lane {
    position: relative;
}

/* =========================
   GANTT BETA DIALOG (overlay)
   ========================= */
.plane-gantt .beta-dialog-host {
    position: absolute;
    inset: 0;
    z-index: 10000;
    display: grid;
    place-items: end center;
    pointer-events: none;
}

.plane-gantt .beta-dialog {
    pointer-events: none;
}

.plane-gantt .beta-card {
    pointer-events: auto;
    margin-bottom: 70px;
    max-width: 520px;
    width: calc(100% - 40px);
    border-radius: 12px;
    background: #fff;
    color: #0f172a;
    box-shadow: 0 20px 60px rgba(0,0,0,.35), 0 0 0 1px rgba(0,0,0,.12);
    padding: 16px 16px 12px;
    font: 600 14px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}

.leaf-theme-dark .plane-gantt .beta-card {
    background: #0f172a;
    color: #e5e7eb;
    box-shadow: 0 20px 60px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.08);
}

.beta-title {
    margin: 0 0 6px;
    font: 800 16px/1.2 system-ui;
}

.beta-msg {
    margin: 0 0 10px;
    font-weight: 600;
}

.beta-noshow {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 12px;
    font-weight: 600;
    opacity: .9;
}

.beta-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.beta-ok {
    padding: 6px 12px;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    background: #111;
    color: #fff;
    font: 800 13px/1 system-ui;
}

.leaf-theme-dark .beta-ok {
    background: #e5e7eb;
    color: #0f172a;
}

/* =========================
   GANTT FOOTER (BOH / day pills)
   ========================= */
.g-footer-row {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 6px;
    pointer-events: none;
}

.g-day-footer {
    position: absolute;
    height: 16px;
    display: flex;
    gap: 26px;
    align-items: center;
    justify-content: center;
    top: 8px;
}

    .g-day-footer .g-day-pill {
        pointer-events: auto;
        font: 800 11px/1 system-ui;
        padding: 2px 6px;
        border-radius: 10px;
        background: rgba(255,255,255,.9);
        color: #0f172a;
        box-shadow: 0 0 0 1px rgba(0,0,0,.08);
    }

.leaf-theme-dark .g-day-footer .g-day-pill {
    background: #0f172a;
    color: #e5e7eb;
    box-shadow: 0 0 0 1px rgba(255,255,255,.08);
}

.g-day-footer .g-day-pill.dep {
    outline: 2px solid #22c55e;
}

.g-day-footer .g-day-pill.arr {
    outline: 2px solid #3b82f6;
}

/* =========================
   CREW FOOTER (under Gantt)
   ========================= */
.gantt-crew-footer {
    position: relative;
    bottom: 0;
    left: 0;
    right: 0;
    margin-top: 8px;
    padding: 8px 12px 12px;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    font: 12px/1.4 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    max-height: 140px;
    overflow-y: auto;
    color: #111827;
    z-index: 50;
}

    .gantt-crew-footer .crew-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 4px;
    }

    .gantt-crew-footer .crew-title {
        font-weight: 700;
        font-size: .8rem;
        text-transform: uppercase;
        letter-spacing: .08em;
        color: #6b7280;
    }

    .gantt-crew-footer .crew-close {
        margin-left: auto;
        width: 22px;
        height: 22px;
        border-radius: 999px;
        border: none;
        background: transparent;
        color: #9ca3af;
        cursor: pointer;
        font-size: 14px;
        line-height: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        transition: background .15s ease, color .15s ease;
    }

        .gantt-crew-footer .crew-close:hover {
            background: rgba(15,23,42,.08);
            color: #4b5563;
        }

    .gantt-crew-footer .crew-body {
        white-space: pre-wrap;
        word-break: break-word;
    }

    .gantt-crew-footer .crew-empty {
        opacity: .7;
        font-style: italic;
    }

    .gantt-crew-footer .eng-code {
        font-weight: 700;
        text-decoration: underline;
    }

/* Dark theme overrides for crew footer */
.leaf-theme-dark .gantt-crew-footer {
    border-color: rgba(148,163,184,.6);
    background: #020617;
    color: #e5e7eb;
}

    .leaf-theme-dark .gantt-crew-footer .crew-title {
        color: #9ca3af;
    }

    .leaf-theme-dark .gantt-crew-footer .crew-close {
        color: #9ca3af;
    }

        .leaf-theme-dark .gantt-crew-footer .crew-close:hover {
            background: rgba(148,163,184,.18);
            color: #f9fafb;
        }

    .leaf-theme-dark .gantt-crew-footer .crew-body {
        color: #e5e7eb;
    }

    .leaf-theme-dark .gantt-crew-footer .eng-code {
        font-weight: 700;
    }

/* Selected bar (external gantt lib hook) */
.gantt-bar.gantt-bar-selected {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
    box-shadow: 0 0 0 1px rgba(37,99,235,.6);
    z-index: 5;
}

.leaf-theme-dark .gantt-bar.gantt-bar-selected {
    outline-color: #60a5fa;
    box-shadow: 0 0 0 1px rgba(96,165,250,.8);
}

/* =========================
   DEFERRED ITEMS PANEL
   ========================= */
.plane-defers {
    position: absolute;
    bottom: calc(var(--defers-bottom-pad,12px) + var(--gantt-offset,0px));
    width: var(--defers-width,740px);
    display: none;
    flex-direction: column;
    border-radius: 10px;
    overflow: hidden;
    z-index: 9998;
    box-shadow: 0 4px 14px rgba(0,0,0,.25);
}

    .plane-defers.open {
        display: flex;
    }

    /* Manual drag anchoring */
    .plane-defers.manual {
        left: var(--defers-left,2px);
        top: var(--defers-top,12px);
        right: auto;
        bottom: auto;
    }

/* Theme vars for defers */
.leaf-theme-light .plane-defers {
    --df-bg: #f8fafc;
    --df-fg: #0f172a;
    --df-border: #cbd5e1;
}

.leaf-theme-dark .plane-defers {
    --df-bg: #0f172a;
    --df-fg: #e5e7eb;
    --df-border: #2a3042;
}

/* Solid backgrounds + sticky header */
.plane-defers,
.plane-defers .df-header,
.plane-defers .df-body {
    background: var(--df-bg);
    color: var(--df-fg);
}

    .plane-defers .df-header {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 10px;
        font: 700 13px/1 system-ui;
        user-select: none;
    }

    .plane-defers .df-title {
        font: 700 14px/1 system-ui;
        letter-spacing: .2px;
    }

    /* drag handle icon in header (overrides generic) */
    .plane-defers .df-header .drag-handle {
        cursor: move;
        user-select: none;
        opacity: .6;
        width: 16px;
        height: 16px;
        border-radius: 3px;
        background: currentColor;
        mask: linear-gradient(#000 0 0) center/70% 3px no-repeat, linear-gradient(#000 0 0) center/3px 70% no-repeat;
    }

/* Close button for defers uses .panel-close theme */
.panel-close {
    appearance: none;
    border: 0;
    background: #334155;
    color: #e5e7eb;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    cursor: pointer;
}

.plane-defers .df-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    padding: 6px 8px;
    scrollbar-width: thin;
    scrollbar-color: rgba(148,163,184,.6) transparent;
}

    .plane-defers .df-body::-webkit-scrollbar {
        width: 8px;
    }

    .plane-defers .df-body::-webkit-scrollbar-track {
        background: transparent;
    }

    .plane-defers .df-body::-webkit-scrollbar-thumb {
        background: rgba(148,163,184,.6);
        border-radius: 8px;
    }

/* Table layout */
.df-table {
    display: block;
}

.plane-defers .df-thead,
.plane-defers .df-row {
    display: grid;
    grid-template-columns: 200px minmax(0,1fr) 140px 120px;
    gap: 10px;
    align-items: start;
}

.plane-defers .df-thead {
    font: 800 11px/1 system-ui;
    opacity: .8;
    padding: 4px 6px;
    border-bottom: 1px solid var(--df-border);
    position: sticky;
    top: -7px;
    background: var(--df-bg);
    z-index: 2;
}

.plane-defers .df-tbody {
    display: block;
}

.plane-defers .df-row {
    font: 600 12px/1.2 system-ui;
    padding: 6px;
    border-radius: 8px;
    margin: 6px 0;
    background: rgba(148,163,184,.12);
    cursor: pointer;
    position: relative;
    border-bottom: 1px solid var(--df-border);
}

    .plane-defers .df-row:hover {
        filter: brightness(1.14);
    }

    .plane-defers .df-row.warning {
        border-left: 4px solid #f59e0b;
        background: rgba(245,158,11,.12);
    }

    .plane-defers .df-row.overdue {
        border-left: 4px solid #ef4444;
        background: rgba(239,68,68,.12);
    }

/* Dark theme row overrides */
.leaf-theme-dark .df-row {
    background: rgba(255,255,255,.05);
}

    .leaf-theme-dark .df-row.warning {
        background: rgba(245,158,11,.18);
    }

    .leaf-theme-dark .df-row.overdue {
        background: rgba(239,68,68,.20);
    }

/* Default cell behavior: truncate */
.plane-defers .df-row span,
.plane-defers .df-thead span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

/* Allow wrapping for Location & Limitation */
.plane-defers .df-row .c-location,
.plane-defers .df-row .c-limit {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    display: inline-block;
    hyphens: auto;
}

/* Remaining chip */
.plane-defers .df-chip {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    border: 1px solid rgba(148,163,184,.35);
    font: 11px/1 system-ui;
    background: rgba(148,163,184,.08);
}

    .plane-defers .df-chip.warn {
        border-color: #f59e0b;
        background: rgba(245,158,11,.15);
        color: #3f2d00;
    }

    .plane-defers .df-chip.danger {
        border-color: #ef4444;
        background: rgba(239,68,68,.18);
        color: #7f1d1d;
    }

.leaf-theme-dark .plane-defers .df-chip.warn {
    border-color: #f59e0b;
    background: rgba(245,158,11,.15);
    color: white;
}

.leaf-theme-dark .plane-defers .df-chip.danger {
    border-color: #ef4444;
    background: rgba(239,68,68,.18);
    color: white;
}

.plane-defers .df-empty {
    color: #94a3b8;
    font: 600 14px/1.1 system-ui;
    padding: 2px 0 4px;
}

/* Search box inside defers */
.plane-defers .df-search {
    margin-left: auto;
    position: relative;
    display: inline-flex;
    align-items: center;
}

.plane-defers .df-search-input {
    width: 200px;
    max-width: 36vw;
    padding: 6px 26px 6px 8px;
    border-radius: 8px;
    border: 1px solid var(--df-si-border);
    background: var(--df-si-bg);
    color: inherit;
    outline: none;
}

.leaf-theme-light .plane-defers .df-search-input {
    --df-si-bg: #f8fafc;
    --df-si-border: #cbd5e1;
}

.leaf-theme-dark .plane-defers .df-search-input {
    --df-si-bg: #0b1222;
    --df-si-border: #2a3042;
}

.plane-defers .df-sclear {
    position: absolute;
    right: 4px;
    border: 0;
    background: transparent;
    width: 20px;
    height: 20px;
    line-height: 20px;
    border-radius: 6px;
    cursor: pointer;
    color: inherit;
    display: none;
}

/* Search highlight */
.plane-defers mark.df-hl {
    background: yellow;
    border-radius: 3px;
    padding: 0 2px;
}

/* =========================
   AIRPORT DOTS (MAP)
   ========================= */
.airport-dot {
    position: relative;
    width: 0;
    height: 0;
}

    .airport-dot .ap-anch {
        position: absolute;
        left: 0;
        top: 0;
        transform: translate(-50%,-50%);
        display: flex;
        align-items: center;
        pointer-events: none;
    }

    .airport-dot .dot {
        width: 0;
        height: 0;
        border-radius: 50%;
        background: currentColor;
    }

.leaf-theme-light .airport-dot .code {
    margin-left: 42px;
    color: blue;
    font: 800 13px/1 system-ui,-apple-system,Segoe UI,Roboto,Arial;
    white-space: nowrap;
}

.leaf-theme-dark .airport-dot .code {
    margin-left: 42px;
    color: gold;
    font: 800 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Arial;
    white-space: nowrap;
}

/* Detail row that acts as flight link */
.det-row.head[data-from][data-to] {
    cursor: pointer;
}

.det-row.head.hovering {
    outline: 1px dashed var(--accent);
}

/* =========================
   MOBILE RESPONSIVE
   ========================= */
@media (max-width: 800px), (max-height: 600px) {
    .plane-summary,
    .plane-schedule,
    .plane-sr,
    .plane-settings {
        width: 95vw;
    }

    .plane-summary {
        left: 8px;
        right: 8px;
        top: 56px;
        bottom: 8px;
        width: auto;
        max-height: calc(100vh - 64px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-y;
    }

    .plane-settings {
        right: 20px;
    }

    .pulse-ring {
        width: 22px;
        height: 22px;
    }

    .sch-row {
        font-size: 14px;
    }

    .eta-chip {
        font-size: 9px;
    }

    .sch-cols {
        grid-template-columns: 1fr;
    }

    .dest-panel,
    .uk-board {
        display: none !important;
    }

    /* On small screens, hide gantt in light theme by default */
    .leaf-theme-light .plane-gantt {
        display: none !important;
        background: rgba(248,250,252,.95);
        color: #0f172a;
        box-shadow: 0 4px 14px rgba(0,0,0,.18);
    }

    /* Hide settings FAB on mobile if needed */
    .leaf-theme-light .plane-settings-toggle {
        display: none;
    }

    /* Gantt open position on mobile */
    .plane-gantt.open {
        top: 8px;
        left: 0;
        right: 0;
        z-index: 10;
        opacity: 1;
        transform: none;
        pointer-events: auto;
        position: absolute;
    }

    /* Defer table stacks on mobile */
    .df-thead {
        display: none;
    }

    .df-row {
        grid-template-columns: 1fr;
        gap: 4px;
    }

        .df-row .c-rem {
            justify-self: start;
        }
}

.set-block legend {
    display: block;
    margin-bottom: 4px;
}

.set-block label {
    display: block;
    margin: 2px 0;
}

/* =========================
   GANTT CONTROLS – COMMON (desktop first)
   ========================= */
.plane-gantt .gantt-controls {
    padding: 6px 8px;
    box-sizing: border-box;
}

    /* card wrapper – acts like a row on desktop */
    .plane-gantt .gantt-controls .gc-card {
        display: flex;
        align-items: flex-start;
        gap: 16px;
        background: transparent;
        box-shadow: none;
        padding: 0;
        border-radius: 0;
    }

/* header hidden on desktop (only mobile shows title + X) */
.plane-gantt .gc-card-header {
    display: none;
}

/* sections */
.plane-gantt .gc-section {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.plane-gantt .gc-section-title {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #6b7280;
}

/* lists & rows on desktop */
.plane-gantt .gc-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 18px;
}

.plane-gantt .gc-row {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.plane-gantt .gc-row-range {
    min-width: 260px;
}

/* label + slider */
.plane-gantt .gc-label-main {
    font-size: 12px;
    font-weight: 500;
    margin-right: 8px;
}

.plane-gantt .gc-row-label {
    font-size: 13px;
}

/* keep nice gap between maint / crew / tooltip on desktop */
.plane-gantt .gc-list-extras .gc-row {
    margin-right: 12px;
}

/* range slider */
.plane-gantt .gc-range-wrap {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.plane-gantt .gc-days {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 4px;
    border-radius: 999px;
    background: linear-gradient(90deg, #22c55e, #0ea5e9);
    outline: none;
    margin: 0;
}

    .plane-gantt .gc-days::-webkit-slider-thumb {
        -webkit-appearance: none;
        appearance: none;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #ffffff;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.35);
        border: 1px solid rgba(148, 163, 184, 0.5);
        margin-top: -7px;
    }

    .plane-gantt .gc-days::-moz-range-track {
        height: 4px;
        border-radius: 999px;
        background: linear-gradient(90deg, #22c55e, #0ea5e9);
    }

    .plane-gantt .gc-days::-moz-range-thumb {
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: #ffffff;
        box-shadow: 0 2px 6px rgba(15, 23, 42, 0.35);
        border: 1px solid rgba(148, 163, 184, 0.5);
    }

.plane-gantt .gc-days-caption {
    font-size: 11px;
    color: #6b7280;
    margin-top: 2px;
}

/* iOS-style switches */
.plane-gantt .gc-item.gc-switch {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    user-select: none;
}

.plane-gantt .gc-switch-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.plane-gantt .gc-switch-track {
    position: relative;
    width: 42px;
    height: 24px;
    border-radius: 999px;
    background: #e5e7eb;
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.6);
    flex-shrink: 0;
    transition: background .18s ease, box-shadow .18s ease;
}

.plane-gantt .gc-switch-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 2px 4px rgba(15,23,42,.35);
    transition: transform .20s ease-out;
}

.plane-gantt .gc-switch-input:checked + .gc-switch-track {
    background: #22c55e;
    box-shadow: inset 0 0 0 0 rgba(34,197,94,.4);
}

    .plane-gantt .gc-switch-input:checked + .gc-switch-track .gc-switch-thumb {
        transform: translateX(18px);
    }

/* close button hidden on desktop */
.plane-gantt .gc-close {
    display: none;
}

/* =========================
   GANTT CONTROLS – MOBILE SHEET
   ========================= */
.plane-gantt.gantt-mobile .gantt-controls {
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(56px + env(safe-area-inset-bottom, 0));
    padding: 0 12px 12px;
    box-sizing: border-box;
    z-index: 99999;
    pointer-events: none;
    background: transparent;
}

    .plane-gantt.gantt-mobile .gantt-controls .gc-card {
        max-width: 420px;
        margin: 0 auto;
        background: #ffffff;
        color: #0f172a;
        border-radius: 20px;
        padding: 10px 14px 12px;
        box-shadow: 0 12px 30px rgba(15,23,42,.25);
        flex-direction: column;
        gap: 6px;
        pointer-events: auto;
        transform: translateY(120%);
        opacity: 0;
        transition: transform .2s ease-out, opacity .2s ease-out;
        width: 100%;
    }

    /* slide in when visible */
    .plane-gantt.gantt-mobile .gantt-controls[style*="display: none"] .gc-card {
        transform: translateY(120%);
        opacity: 0;
    }

    .plane-gantt.gantt-mobile .gantt-controls:not([style*="display: none"]) .gc-card {
        transform: translateY(0);
        opacity: 1;
    }

/* mobile header with title + X */
.plane-gantt.gantt-mobile .gc-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.plane-gantt.gantt-mobile .gc-title {
    font-size: 18px;
    font-weight: 600;
    border-bottom: 1px solid black;
}

.plane-gantt.gantt-mobile .gc-close {
    display: inline-flex;
    border: none;
    background: rgba(148,163,184,.2);
    border-radius: 999px;
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    color: #0f172a;
    right: 15px;
    position: absolute;
}

.plane-gantt.gantt-mobile .gc-section {
    width: 100%;
    border: 1px solid;
    padding: 15px;
    border-radius: inherit;
}

/* VISIBLE DAYS list: still uses generic block layout */
.plane-gantt.gantt-mobile .gc-list {
    display: block;
}

/* generic mobile row style */
.plane-gantt.gantt-mobile .gc-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 0;
    border-top: 1px solid rgba(148,163,184,.25);
}

    .plane-gantt.gantt-mobile .gc-row:first-child {
        border-top: none;
    }

.plane-gantt.gantt-mobile .gc-row-label {
    flex: 1;
    font-size: 14px;
}

/* switches hug right edge */
.plane-gantt.gantt-mobile .gc-item.gc-switch {
    margin-left: 12px;
}

/* range row on mobile: label above slider */
.plane-gantt.gantt-mobile .gc-row-range {
    flex-direction: column;
    align-items: stretch;
}

.plane-gantt.gantt-mobile .gc-label-main {
    margin-bottom: 4px;
}

/* EXTRAS list – ensure each extra is its own row */
.plane-gantt.gantt-mobile .gc-list-extras {
    display: block;
}

    .plane-gantt.gantt-mobile .gc-list-extras .gc-row {
        justify-content: space-between;
    }

/* =========================
   SETTINGS PANEL – iOS-LIKE ROWS (DESKTOP)
   ========================= */
@media (min-width: 801px) {
    .plane-settings .set-block-ios {
        border: 1px solid rgba(148,163,184,.35);
        border-radius: 10px;
        padding: 6px 0 4px;
        margin: 8px 0;
        background: #f9fafb;
    }

    .leaf-theme-dark .plane-settings .set-block-ios {
        background: #020617;
        border-color: rgba(148,163,184,.6);
    }

    .plane-settings .set-block-ios > legend {
        padding: 0 10px;
        font: 800 17px/1 system-ui;
        opacity: .8;
        margin-bottom: 4px;
    }

    .plane-settings .set-ios-list {
        display: flex;
        flex-direction: column;
    }

    .plane-settings .set-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 6px 12px;
        border-top: 1px solid rgba(148,163,184,.25);
    }

        .plane-settings .set-row:first-child {
            border-top: none;
        }

    .plane-settings .set-label {
        font-size: 16px;
        font-weight: 500;
        color: #0f172a;
        padding-right: 12px;
    }

    .leaf-theme-dark .plane-settings .set-label {
        color: #e5e7eb;
    }

    /* iOS switches for settings */
    .plane-settings .set-switch {
        display: inline-flex;
        align-items: center;
        cursor: pointer;
        user-select: none;
    }

    .plane-settings .set-switch-input {
        position: absolute;
        opacity: 0;
    }

    .plane-settings .set-switch-track {
        position: relative;
        width: 42px;
        height: 24px;
        border-radius: 999px;
        background: #e5e7eb;
        box-shadow: inset 0 0 0 1px rgba(148,163,184,0.6);
        flex-shrink: 0;
        transition: background .18s ease, box-shadow .18s ease;
    }

    .leaf-theme-dark .plane-settings .set-switch-track {
        background: #111827;
        box-shadow: inset 0 0 0 1px rgba(55,65,81,0.8);
    }

    .plane-settings .set-switch-thumb {
        position: absolute;
        top: 2px;
        left: 2px;
        width: 20px;
        height: 20px;
        border-radius: 999px;
        background: #ffffff;
        box-shadow: 0 2px 4px rgba(15,23,42,.35);
        transition: transform .20s ease-out;
    }

    .plane-settings .set-switch-input:checked + .set-switch-track {
        background: #22c55e;
        box-shadow: inset 0 0 0 0 rgba(34,197,94,.4);
    }

    .leaf-theme-dark .plane-settings .set-switch-input:checked + .set-switch-track {
        background: #22c55e;
    }

    .plane-settings .set-switch-input:checked + .set-switch-track .set-switch-thumb {
        transform: translateX(18px);
    }
}

@media (min-width: 801px) {
    /* numbers in deferred section */
    .plane-settings .set-ios-list .set-num {
        width: 90px;
        padding: 4px 6px;
        font-size: 12px;
        border-radius: 6px;
        border: 1px solid rgba(148,163,184,.55);
        background: #ffffff;
        color: #0f172a;
        text-align: right;
    }

    .leaf-theme-dark .plane-settings .set-ios-list .set-num {
        background: #020617;
        color: #e5e7eb;
        border-color: rgba(148,163,184,.7);
    }

    /* ruler spacing row: slider + output on the right */
    .plane-settings .set-row-range .set-range-wrap {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 160px;
    }

    .plane-settings .set-row-range input[type="range"] {
        flex: 1;
    }

    .plane-settings .set-row-range .out-gpph {
        font-size: 11px;
        color: #6b7280;
        white-space: nowrap;
    }

    .leaf-theme-dark .plane-settings .set-row-range .out-gpph {
        color: #9ca3af;
    }

    /* selects on the right – hour labels & mouse wheel */
    .plane-settings .set-select {
        min-width: 120px;
        padding: 4px 6px;
        font-size: 12px;
        border-radius: 6px;
        border: 1px solid rgba(148,163,184,.55);
        background: #ffffff;
        color: #0f172a;
    }

    .leaf-theme-dark .plane-settings .set-select {
        background: #020617;
        color: #e5e7eb;
        border-color: rgba(148,163,184,.7);
    }
}

/* === Settings: iOS-style info buttons === */
.plane-settings .set-ios-list .set-row {
    position: relative;
}

.plane-settings .set-info {
    width: 20px;
    height: 20px;
    border-radius: 999px;
    border: 0;
    margin: 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font: 700 11px/1 system-ui;
    cursor: pointer;
    background: #0ea5e9;
    color: #ffffff;
    flex-shrink: 0;
}

    .plane-settings .set-info::before {
        content: "i";
    }

/* same in dark theme */
.leaf-theme-dark .plane-settings .set-info {
    background: #38bdf8;
    color: #ffffff;
}

.plane-settings .set-info:hover {
    filter: brightness(1.05);
}

.plane-settings .set-info:focus-visible {
    outline: 2px solid #0ea5e9;
    outline-offset: 2px;
}

/* shared tooltip bubble */
.plane-settings .set-info-pop {
    position: absolute;
    max-width: 260px;
    padding: 6px 8px;
    border-radius: 10px;
    font: 600 11px/1.3 system-ui;
    background: rgba(15,23,42,.96);
    color: #f9fafb;
    box-shadow: 0 4px 16px rgba(15,23,42,.45), 0 0 0 1px rgba(15,23,42,.8);
    opacity: 0;
    transform: translateY(-4px) scale(.97);
    pointer-events: none;
    transition: opacity .14s ease, transform .14s ease;
    z-index: 20;
}

    .plane-settings .set-info-pop::before {
        content: "";
        position: absolute;
        left: 10px;
        top: 100%;
        border-width: 6px 6px 0 6px;
        border-style: solid;
        border-color: rgba(15,23,42,.96) transparent transparent transparent;
    }

/* light theme bubble */
.leaf-theme-light .plane-settings .set-info-pop {
    background: #ffffff;
    color: #0f172a;
    box-shadow: 0 4px 16px rgba(15,23,42,.18), 0 0 0 1px rgba(148,163,184,.45);
}

    .leaf-theme-light .plane-settings .set-info-pop::before {
        border-color: #ffffff transparent transparent transparent;
    }

/* visible state */
.plane-settings .set-info-pop.open {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

/* iOS row layout */
.plane-settings .set-ios-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .plane-settings .set-ios-list .set-row {
        position: relative;
        display: grid;
        grid-template-columns: auto 1fr auto;
        align-items: center;
        column-gap: 10px;
        padding: 6px 10px;
    }

/* label column – always left aligned, next to the info icon */
.plane-settings .set-label {
    font-size: 16px;
    text-align: left;
    justify-self: flex-start;
    white-space: normal;
}

/* right column: switches / inputs / selects hug the right edge */
.plane-settings .set-switch,
.plane-settings .set-num,
.plane-settings .set-select,
.plane-settings .set-range-wrap {
    justify-self: flex-end;
}

/* numeric inputs (deferred thresholds) */
.plane-settings .set-num {
    width: 90px;
    padding: 4px 6px;
    border-radius: 8px;
    border: 1px solid rgba(148,163,184,.7);
    font: 600 12px/1 system-ui;
}

/* selects (Gantt options) */
.plane-settings .set-select {
    min-width: 110px;
    max-width: 140px;
    padding: 4px 6px;
    border-radius: 8px;
    border: 1px solid rgba(148,163,184,.7);
    font: 600 12px/1 system-ui;
    background: #ffffff;
}

/* range row: keep range+output as a compact right block */
.plane-settings .set-row.set-row-range .set-range-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 170px;
}

/* reuse your existing range styling */
.plane-settings .set-range-wrap input[type="range"] {
    flex: 1;
}

/* =========================
   DETAIL PANEL (LEFT) – VARIANT WITH CSS VARS
   (this overrides some of the earlier .fr-* above)
   ========================= */

/* Next / last / upcoming rows */
.fr-next-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px dashed var(--fr-next-border, #e5e7eb);
    font-size: 0.75rem;
    color: var(--fr-text-muted, #4b5563);
}

.fr-next-title {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: var(--fr-next-title, blue);
}

.fr-next-leg {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: bold;
    font-size: 1.3rem;
    color: var(--fr-next-leg, #111827);
}

.fr-next-code {
    letter-spacing: 0.08em;
}

.fr-next-arrow {
    font-size: 0.9rem;
}

.fr-next-times {
    display: flex;
    justify-content: space-between;
    margin-top: 2px;
    font-size: 1.05rem;
    font-weight: 700;
    background: var(--fr-next-times-bg, darkseagreen);
    color: var(--fr-next-times-fg, #111827);
    padding: 3px 6px;
    border-radius: 6px;
}

/* Top bar */
.fr-top {
    position: relative;
    display: flex;
    align-items: center;
    padding: 6px 10px;
    border-bottom: 4px solid var(--accent, #2b7cff);
}

.fr-top-left {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* Centered ETA pill */
.fr-eta-pill {
    position: absolute;
    left: 72%;
    transform: translateX(-50%);
    display: inline-flex;
    flex-direction: column;
    align-items: center;
}

.fr-eta-label {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--fr-text-muted, #0f172a);
}

.fr-eta-time {
    margin-top: 2px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #facc15;
    color: #111827;
    font-weight: 700;
    font-size: 0.95rem;
}

@media (max-width: 480px) {
    .fr-eta-time {
        font-size: 1.1rem;
    }
}

/* Progress bar colours */
.fr-progress-inner {
    transition: width 0.3s ease;
}

.fr-progress-inner-live {
    background: #facc15;
}

.fr-progress-inner-landed {
    background: #3b82f6;
}

.fr-progress-inner-maint {
    background: #fb923c;
}

/* Card container */
.fr-card {
    display: flex;
    flex-direction: column;
    background: var(--fr-card-bg, #f9fafb);
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--fr-card-border, rgba(15,23,42,0.12));
    box-shadow: var(--fr-card-shadow, 0 10px 30px rgba(15,23,42,0.3));
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--fr-text-main, #0f172a);
}

.fr-flight-line {
    display: flex;
    gap: 6px;
    align-items: center;
}

.fr-flightid {
    font-weight: 700;
    font-size: 1.2rem;
}

/* Status badges */
.fr-badge {
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border: 1px solid rgba(148,163,184,0.55);
    color: #e5e7eb;
}

/* LIVE → yellow */
.fr-badge-live {
    background: #facc15;
    color: #111827;
    border-color: rgba(234,179,8,0.8);
}

/* LANDED → blue */
.fr-badge-landed {
    background: rgba(59,130,246,0.35);
    border-color: rgba(37,99,235,0.9);
    color: #1d4ed8;
}

/* MAINT → orange */
.fr-badge-maint {
    background: rgba(251,146,60,0.35);
    border-color: rgba(234,88,12,0.9);
    color: #fdba74;
}

.fr-airline {
    font-size: 0.75rem;
    opacity: 0.85;
}

/* MAIN SECTION */
.fr-main {
    display: flex;
    background: var(--fr-main-bg, #ffffff);
    padding: 8px 10px;
    gap: 10px;
}

/* left side */
.fr-main-left {
    flex: 2;
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: var(--fr-main-sub-bg, aliceblue);
}

.fr-leg-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fr-leg {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.fr-code {
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.fr-city {
    font-size: 0.75rem;
    text-transform: uppercase;
    color: var(--fr-text-muted, #6b7280);
}

.fr-progress-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 4px;
}

.fr-progress {
    position: relative;
    height: 4px;
    border-radius: 999px;
    overflow: hidden;
    background-color: grey;
}

.fr-progress-inner {
    position: absolute;
    inset: 0;
    width: 60%;
}

.fr-times {
    display: flex;
    justify-content: space-between;
    font-size: 0.7rem;
    color: var(--fr-text-muted, #6b7280);
}

/* right side stats */
.fr-main-right {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-left: 6px;
    border-left: 1px solid #e5e7eb;
    background: var(--fr-main-sub-bg, aliceblue);
}

.fr-stat-block {
    display: flex;
    flex-direction: column;
}

.fr-stat-label {
    font-size: 0.7rem;
    color: var(--fr-text-muted, #6b7280);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.fr-stat-value {
    font-size: 0.85rem;
    font-weight: 700;
}

/* AIRCRAFT / REG LINE */
.fr-midline {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: var(--fr-midline-bg, #f3f4f6);
    font-size: 0.75rem;
}

.fr-mid-aircraft {
    font-weight: 600;
}

.fr-mid-sep {
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.fr-mid-reg-label {
    color: var(--fr-text-muted, #6b7280);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.fr-mid-reg {
    font-weight: 700;
}

/* BOTTOM ACTION BAR */
.fr-bottom {
    display: flex;
    align-items: stretch;
    justify-content: space-around;
    background: linear-gradient(grey, transparent);
    color: var(--fr-text-main, #111827);
    padding: 4px 2px;
}

.fr-action {
    flex: 1;
    border: none;
    background: transparent;
    color: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 4px 0;
    font-size: 0.7rem;
    font-weight: 500;
    cursor: pointer;
}

.fr-action-icon {
    font-size: 1rem;
}

.fr-action[disabled] {
    opacity: 0.45;
    cursor: default;
}

/* MOBILE tweaks */
@media (max-width: 800px) {
    .fr-main {
        flex-direction: column;
    }

    .fr-main-right {
        flex-direction: row;
        justify-content: space-between;
        border-left: none;
        border-top: 1px solid #e5e7eb;
        padding-left: 0;
        padding-top: 6px;
    }

    .fr-stat-block {
        min-width: 0;
    }

    .fr-stat-value {
        font-size: 0.8rem;
    }
}

.g-day-pill.is-active {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}

.defers-panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
    width: 100%;
    border: 1px solid #dbe4ee;
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

.defers-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
    flex-wrap: wrap;
}

.defers-panel-title {
    font-weight: 700;
    color: #0f172a;
}

.defers-row-control {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 220px;
}

    .defers-row-control label {
        margin: 0;
        font-size: 13px;
        font-weight: 600;
        color: #334155;
        white-space: nowrap;
    }

    .defers-row-control input[type="range"] {
        flex: 1;
        cursor: pointer;
    }

.defers-grid-wrap {
    overflow: auto;
    transition: height 0.18s ease;
}

.defers-grid {
    width: 100%;
}

    /* optional row styling example */
    .defers-grid .defer-row {
        min-height: 42px;
        display: flex;
        align-items: center;
        padding: 0 12px;
        border-bottom: 1px solid #f1f5f9;
    }

.defers-panel {
    height: auto !important;
}

.bar .flight-no {
    margin-left: 4px;
    font-weight: 600;
    opacity: 1;
    font-size: 0.7rem;
}

.crew-flight {
    margin-bottom: 6px;
    font-weight: 700;
}

.crew-list {
    line-height: 1.4;
}

.lane,
.g-track {
    position: relative;
    height: 42px;
}

.row,
.g-row {
    min-height: 42px;
    align-items: center;
}

.bar {
    position: absolute;
    top: 18px;
    height: 18px;
    border-radius: 8px;
    overflow: visible;
}

.muted-time {
    margin-left: 8px;
    opacity: .65;
    font-weight: 500;
    font-size: .92em;
}

.crew-body {
    margin-bottom: 25px !important;
}
.ctp-crew-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ctp-crew-item {
    display: flex;
    gap: 6px;
    align-items: center;
    font: 600 12px/1.4 system-ui;
    padding: 2px 0;
}

.ctp-role {
    font-weight: 700;
    min-width: 42px;
    color: #94a3b8;
}

.ctp-name {
    flex: 1;
}

.ctp-code {
    opacity: 0.7;
    font-size: 11px;
}
.gantt-crew-footer {
    display: none !important;
}

.eng-context-menu {
    position: fixed;
    z-index: 10001;
    min-width: 190px;
    background: rgba(15,23,42,.98);
    color: #e5eefc;
    border: 1px solid rgba(148,163,184,.18);
    border-radius: 10px;
    box-shadow: 0 18px 40px rgba(0,0,0,.38);
    padding: 6px;
}

    .eng-context-menu .eng-menu-item {
        display: block;
        width: 100%;
        text-align: left;
        background: transparent;
        border: 0;
        color: inherit;
        padding: 8px 10px;
        border-radius: 8px;
        cursor: pointer;
        font: 600 12px/1.2 system-ui;
    }

        .eng-context-menu .eng-menu-item:hover {
            background: rgba(148,163,184,.12);
        }
.g-reg-label,
.g-row-label,
.g-label {
    position: sticky;
    z-index: 10000;
     background-color: #fff;
}

.leaf-theme-dark .g-reg-label,
.leaf-theme-dark .g-row-label,
.leaf-theme-dark .g-label {
    background: #0f172a;
}
.bar.selected {
    outline: 3px solid #fff;
    box-shadow: 0 0 0 3px rgba(59,130,246,0.6), 0 0 12px rgba(59,130,246,0.8);
    z-index: 50;
}
.bar.gantt-bar-selected {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
    box-shadow: 0 0 10px rgba(59,130,246,.45);
    z-index: 60;
}
.uk-board-group {
    margin-bottom: 8px;
}

.uk-board-group-title {
    font-size: 10px;
    font-weight: 600;
    color: #64748b;
    padding: 4px 6px;
    border-bottom: 1px solid rgba(148,163,184,0.35);
    letter-spacing: .08em;
}