/* =====================================================================
   FLIGHT DETAILS PAGE (/flights/<uuid>)
   =====================================================================
   Fully static: everything admin-tunable it touches (--appbar-height,
   --brand-primary, --brand-soft, --brand-ink) reaches it as a CSS custom
   property set elsewhere, so nothing here has to be generated per tenant.
   ===================================================================== */
.flightpage{max-width:920px;margin:24px auto 40px;padding:0 16px;background:transparent;border:none;border-radius:0;box-shadow:none;scroll-margin-top:calc(var(--appbar-height,68px) + 16px)}
.fcard{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:16px;box-shadow:0 6px 24px rgba(0,0,0,.06);overflow:hidden}
.fcard__head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid rgba(0,0,0,.06);background:var(--brand-soft,#eef1fb)}
.fcard__flightno{font-size:22px;font-weight:800;color:var(--brand-primary,#242c65);letter-spacing:.5px;margin-inline-end:auto}
.fpill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;border-radius:999px;padding:4px 12px;background:#e8eaf3;color:#333}
.fpill--arrival{background:#e6f0ff;color:#12509a}.fpill--departure{background:#eae6ff;color:#4a2fa0}
.fpill--delayed{background:#fff2e2;color:#9a5a12}.fpill--cancelled{background:#ffe3e3;color:#a01212}
.fpill--new-time{background:#f3e8ff;color:#6b21a8}
.fpill--boarding{background:#e6f0ff;color:#12509a}.fpill--arrived,.fpill--departed{background:#e7f6ec;color:#1a7a3d}
.froute{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:8px;padding:22px 18px}
.froute__end{display:flex;flex-direction:column;gap:6px;min-width:0}
.froute__label{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:#7a7f96}
.froute__name{font-size:17px;font-weight:800;color:#1c2140;line-height:1.25;overflow-wrap:anywhere}
.froute__city{font-size:14px;color:#444;line-height:1.3}
.froute__flag{width:22px;height:16px;object-fit:cover;border-radius:2px;vertical-align:-3px;margin-inline-start:6px;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.froute__code{font-size:30px;font-weight:900;color:var(--brand-primary,#242c65);letter-spacing:2px;text-align:start;unicode-bidi:isolate}
.froute__mid{display:flex;align-items:center;justify-content:center;color:#9aa0b5}
.froute__mid svg{width:34px;height:34px}
html[dir=rtl] .froute__mid svg{transform:scaleX(-1)}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:2px;margin:0;padding:0 6px 6px;background:rgba(0,0,0,.05)}
.fgrid>div{background:#fff;padding:12px 14px;margin:0}
.fgrid dt{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:#7a7f96;margin:0 0 4px}
.fgrid dd{margin:0;font-size:15px;font-weight:700;color:#1c2140;display:flex;align-items:center;gap:8px;overflow-wrap:anywhere}
.fgrid__logo{width:34px;height:24px;object-fit:contain;flex:0 0 auto}
.flightpage .page-back{display:inline-flex;align-items:center;gap:6px;margin:0 0 16px;padding:8px 16px;min-height:40px;background:#fff;color:var(--brand-ink,#242c65);border:1px solid var(--brand-line,rgba(36,44,101,.12));border-radius:999px;font-weight:700;text-decoration:none;box-shadow:0 2px 10px rgba(0,0,0,.16);transition:background .15s,box-shadow .15s}
.flightpage .page-back::before{content:'\2190';font-size:1.05em;line-height:1}
html[dir=rtl] .flightpage .page-back::before{content:'\2192'}
.flightpage .page-back:hover{background:#eef1f9;background:color-mix(in srgb,var(--brand-primary) 12%,#fff);border-color:var(--brand-primary);text-decoration:none;box-shadow:0 3px 14px rgba(0,0,0,.22)}
.flightpage .page-back:active{background:#e6eaf6;background:color-mix(in srgb,var(--brand-primary) 18%,#fff)}
.flightpage .page-back:focus-visible{outline:2px solid var(--brand-primary,#242c65);outline-offset:2px}
@media (max-width:560px){.flightpage{padding:0;margin:12px 0 28px}.fcard{border-radius:0;border-left:none;border-right:none}.flightpage .page-back{margin-inline:14px}.froute{grid-template-columns:1fr;gap:14px}.froute__mid{transform:rotate(90deg)}html[dir=rtl] .froute__mid svg{transform:none}}
@supports(padding:max(0px)){@media (max-width:560px){.fcard__head,.froute,.fgrid>div{padding-inline-start:max(14px,env(safe-area-inset-left));padding-inline-end:max(14px,env(safe-area-inset-right))}}}
