/* FlightRadar.world – flight status pages (/flight-status/ …). Loaded after site.css on those pages only. */

.fs-page, .fs-legend-list, .fs-recent {
  --ok: #138a4b; --ok-bg: #dcf5e6; --warn: #9a5b00; --warn-bg: #fff1cc; --bad: #b42318; --bad-bg: #ffe1dc;
  --live: #1d4ed8; --live-bg: #dde8ff; --info: #0e7490; --info-bg: #d7f3f8; --neutral: #475467; --neutral-bg: #eef0f4;
}
.fs-ic { width: 1.15em; height: 1.15em; vertical-align: -.2em; flex: 0 0 auto; }
.fs-ic-sm { width: .9em; height: .9em; }
.fs-lead { font-size: 1.1rem; color: var(--muted); margin: 0 0 1.25rem; }
.fs-h2 { font-size: 1.3rem; margin: 2rem 0 .85rem; }
.fs-section { margin-bottom: 1.5rem; }
.fs-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .02em; }
.fs-none { color: var(--muted); }
.btn-outline-brand { color: var(--brand-dark); border: 1px solid var(--brand); background: #fff; font-weight: 600; }
.btn-outline-brand:hover, .btn-outline-brand:focus { color: #fff; background: var(--brand); }

/* Navy stage (search form, empty day, check buttons) -------------------------------- */
.fs-stage {
  position: relative; color: #fff; border-radius: 14px; padding: 1.4rem 1.4rem 1rem; margin: 0 0 1.5rem;
  background:
    radial-gradient(circle at 88% 12%, rgba(247, 147, 30, .28) 0, rgba(247, 147, 30, 0) 45%),
    repeating-radial-gradient(circle at 88% 12%, rgba(255, 255, 255, .05) 0 1px, transparent 1px 56px),
    linear-gradient(160deg, #16294d 0%, var(--sky) 75%);
  box-shadow: 0 10px 30px rgba(15, 27, 51, .18);
  scroll-margin-top: 1rem;
}
.fs-stage-title { color: #fff; font-size: 1.3rem; margin: 0 0 .4rem; }
.fs-stage-lead { color: rgba(255, 255, 255, .85); font-size: 1rem; }
.fs-note { font-size: .85rem; color: var(--muted); margin: .6rem 0 0; }
.fs-stage .fs-note { color: rgba(255, 255, 255, .7); }
.fs-status { min-height: 1.4em; margin: .4rem 0 0; font-size: .95rem; font-weight: 500; }
.fs-stage .fs-status { color: #fff; }
.fs-status.is-error { color: #b42318; }
.fs-stage .fs-status.is-error { color: #ffc9bd; }
.fs-status.is-loading::before {
  content: ""; display: inline-block; width: .9em; height: .9em; margin-right: .45em; vertical-align: -.1em;
  border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: fs-spin .7s linear infinite;
}
@keyframes fs-spin { to { transform: rotate(360deg); } }
.btn.is-busy { opacity: .75; cursor: progress; }

/* Search form ------------------------------------------------------------------------ */
.fs-form { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr); gap: 1rem 1.25rem; align-items: start; }
.fs-field { border: 0; margin: 0; padding: 0; min-width: 0; }
.fs-field label, .fs-field legend {
  display: block; float: none; padding: 0; margin: 0 0 .4rem;
  font-size: .8rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: rgba(255, 255, 255, .8);
}
.fs-input { position: relative; }
.fs-input .fs-ic { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%) rotate(45deg); color: var(--brand); width: 1.3em; height: 1.3em; }
.fs-input input {
  padding-left: 2.8rem; height: 3.2rem; border: 0; border-radius: 10px;
  font-weight: 700; font-size: 1.35rem; letter-spacing: .06em; text-transform: uppercase;
}
.fs-input input::placeholder { font-weight: 400; letter-spacing: 0; text-transform: none; color: #98a2b3; }
.fs-input input.is-invalid { box-shadow: 0 0 0 3px rgba(255, 120, 90, .75); }
.fs-help { display: block; color: rgba(255, 255, 255, .65); font-size: .8rem; margin-top: .35rem; line-height: 1.4; }
.fs-daypick { display: flex; flex-wrap: wrap; gap: .5rem; }
.fs-chip {
  display: inline-flex; align-items: center; gap: .35rem; height: 3.2rem; padding: 0 1rem; margin: 0;
  border-radius: 10px; border: 1px solid rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .08);
  color: #fff; font-weight: 600; font-size: 1rem; cursor: pointer; transition: background .15s, border-color .15s;
}
.fs-chip:hover { background: rgba(255, 255, 255, .16); }
.fs-chip.is-on { background: #fff; color: var(--ink); border-color: #fff; }
.fs-chip:focus-visible, .fs-chip:focus-within { outline: 3px solid rgba(247, 147, 30, .8); outline-offset: 2px; }
.fs-field .fs-chip-date { padding: 0 .75rem; text-transform: none; letter-spacing: 0; font-size: 1rem; color: #fff; margin: 0; }
.fs-field .fs-chip-date.is-on { color: var(--ink); }
.fs-chip-date input { border: 0; background: transparent; color: inherit; font: inherit; font-weight: 600; width: 8.9rem; color-scheme: dark; }
.fs-chip-date.is-on input { color-scheme: light; }
.fs-chip-date input:focus { outline: none; }
.fs-submit {
  grid-column: 1 / -1; height: 3.4rem; font-size: 1.15rem; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
}
@media (max-width: 767.98px) {
  .fs-form { grid-template-columns: 1fr; }
  .fs-chip { flex: 1 1 auto; justify-content: center; padding: 0 .6rem; }
  .fs-field .fs-chip-date { flex: 1 1 100%; }
  .fs-chip-date input { width: 100%; }
}

/* Day strip -------------------------------------------------------------------------- */
.fs-days { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .4rem; margin: .5rem 0 1.25rem; }
.fs-day {
  display: flex; flex-direction: column; align-items: center; padding: .45rem .25rem; border-radius: 10px;
  border: 1px solid var(--line); text-decoration: none; color: var(--ink); line-height: 1.25; font-size: .95rem; background: #fff;
}
a.fs-day:hover { border-color: var(--brand); color: var(--ink); }
.fs-day.is-current { background: var(--sky); border-color: var(--sky); color: #fff; }
.fs-day.has-data::after { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--brand); margin-top: .25rem; }
.fs-day.is-off { visibility: hidden; }
.fs-day-w { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.fs-day-d { font-weight: 700; white-space: nowrap; }

/* Hero card of a flight ---------------------------------------------------------------- */
.fs-flight { margin-bottom: 1.5rem; }
.fs-hero {
  --tone: #8a96ad; position: relative; overflow: hidden; color: #fff; border-radius: 16px; padding: 1.25rem 1.4rem 1rem;
  background: linear-gradient(160deg, #1b315c 0%, var(--sky) 80%); box-shadow: 0 12px 32px rgba(15, 27, 51, .2);
}
.fs-hero::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--tone); }
.fs-hero-ok { --tone: #22c55e; }
.fs-hero-live { --tone: #60a5fa; }
.fs-hero-info { --tone: #22d3ee; }
.fs-hero-warn { --tone: #fbbf24; }
.fs-hero-bad { --tone: #f87171; }
.fs-hero-top { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.fs-hero-id { display: flex; flex-direction: column; line-height: 1.25; margin-right: auto; min-width: 0; }
.fs-hero-id strong { font-size: 1.1rem; }
.fs-hero-id span { color: rgba(255, 255, 255, .7); font-size: .9rem; }
.fs-mark {
  display: inline-grid; place-items: center; min-width: 2.6rem; height: 2.6rem; padding: 0 .35rem; border-radius: 10px;
  font-weight: 800; font-size: .95rem; letter-spacing: .02em; color: #fff; flex: 0 0 auto; line-height: 1;
  background: linear-gradient(135deg, hsl(var(--h), 62%, 46%), hsl(calc(var(--h) + 30), 70%, 34%));
}
.page-h1 .fs-mark { vertical-align: .2em; margin-right: .3rem; font-size: .9rem; }
.fs-pill {
  display: inline-block; padding: .2rem .65rem; border-radius: 999px; font-size: .8rem; font-weight: 700; white-space: nowrap; line-height: 1.5;
  color: var(--neutral); background: var(--neutral-bg);
}
.fs-pill-lg { font-size: .95rem; padding: .35rem .9rem; }
.fs-tone-ok { color: var(--ok); background: var(--ok-bg); }
.fs-tone-live { color: var(--live); background: var(--live-bg); }
.fs-tone-info { color: var(--info); background: var(--info-bg); }
.fs-tone-warn { color: var(--warn); background: var(--warn-bg); }
.fs-tone-bad { color: var(--bad); background: var(--bad-bg); }
.fs-tone-neutral { color: var(--neutral); background: var(--neutral-bg); }
.fs-route { display: grid; grid-template-columns: minmax(0, 1fr) minmax(5rem, 1.1fr) minmax(0, 1fr); gap: .75rem; align-items: center; margin: 1.25rem 0 .75rem; }
.fs-end { display: flex; flex-direction: column; min-width: 0; }
.fs-end-arr { text-align: right; align-items: flex-end; }
.fs-end-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: rgba(255, 255, 255, .6); display: inline-flex; gap: .3rem; align-items: center; }
.fs-code { font-size: 2.6rem; font-weight: 800; line-height: 1.05; letter-spacing: .02em; }
.fs-cityname { color: rgba(255, 255, 255, .8); font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.fs-bigtime { font-size: 1.7rem; font-weight: 700; margin-top: .35rem; line-height: 1.15; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fs-dayshift { font-size: .55em; margin-left: .15em; color: #fbbf24; font-weight: 700; }
.fs-sub { font-size: .85rem; color: rgba(255, 255, 255, .65); }
.fs-sub s { color: rgba(255, 255, 255, .55); }
.fs-hero .fs-delay { display: inline-block; margin-top: .3rem; font-size: .8rem; font-weight: 700; padding: .1rem .5rem; border-radius: 6px; }
.fs-hero .fs-delay-ok { background: rgba(34, 197, 94, .2); color: #86efac; }
.fs-hero .fs-delay-warn { background: rgba(251, 191, 36, .2); color: #fcd34d; }
.fs-hero .fs-delay-bad { background: rgba(248, 113, 113, .22); color: #fca5a5; }
.fs-track { display: flex; flex-direction: column; align-items: center; gap: .55rem; padding-top: 1.3rem; }
.fs-line { position: relative; width: 100%; height: 3px; border-radius: 3px; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .35) 0 6px, transparent 6px 11px); }
.fs-line::before, .fs-line::after { content: ""; position: absolute; top: 50%; width: 9px; height: 9px; margin-top: -4.5px; border-radius: 50%; border: 2px solid #fff; background: var(--sky); }
.fs-line::before { left: -4px; }
.fs-line::after { right: -4px; }
.fs-line-done { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; background: linear-gradient(90deg, var(--brand), var(--brand-2)); }
.fs-line-plane { position: absolute; top: 50%; transform: translate(-50%, -50%) rotate(90deg); color: #fff; line-height: 0; filter: drop-shadow(0 0 6px rgba(247, 147, 30, .8)); }
.fs-line-plane .fs-ic { width: 1.6rem; height: 1.6rem; }
.fs-track-meta { font-size: .8rem; color: rgba(255, 255, 255, .7); text-align: center; }
.fs-hint { display: flex; gap: .5rem; align-items: flex-start; background: rgba(255, 255, 255, .08); border-radius: 10px; padding: .6rem .8rem; font-size: .95rem; margin: .5rem 0 .75rem; color: rgba(255, 255, 255, .92); }
.fs-hint .fs-ic { margin-top: .2em; color: var(--tone); }
.fs-hero-foot { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; font-size: .9rem; color: rgba(255, 255, 255, .75); }
.fs-hero-foot .fs-gate { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.fs-hero-foot .fs-gate .fs-status { margin: 0; color: #fff; }
.fs-hero-foot .fs-gate .fs-status:empty { display: none; }
.fs-hero-foot .fs-gate .fs-status.is-error { color: #ffc9bd; }
.fs-gate-btn { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; }
.fs-refresh-note { margin: .5rem .25rem 0; }
@media (max-width: 575.98px) {
  .fs-hero { padding: 1rem 1rem .9rem; }
  .fs-code { font-size: 2rem; }
  .fs-bigtime { font-size: 1.3rem; }
  .fs-route { grid-template-columns: minmax(0, 1fr) 3rem minmax(0, 1fr); gap: .4rem; }
  .fs-track-meta { display: none; }
  .fs-hero-foot .fs-gate, .fs-hero-foot .fs-gate .btn { width: 100%; justify-content: center; }
}

/* Cards -------------------------------------------------------------------------------- */
.fs-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 1.15rem 1.25rem; margin: 1rem 0; box-shadow: 0 2px 10px rgba(15, 27, 51, .04); }
.fs-card-title { font-size: 1.1rem; margin: 0 0 .85rem; display: flex; align-items: center; gap: .45rem; }
.fs-card-title .fs-ic { color: var(--brand); }
.fs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.fs-grid .fs-card { margin: 0; }
@media (max-width: 767.98px) { .fs-grid { grid-template-columns: 1fr; } }
.fs-ap-name { font-weight: 700; font-size: 1.1rem; margin: 0; line-height: 1.3; }
.fs-ap-name a { color: var(--ink); text-decoration: none; }
.fs-ap-name a:hover { color: var(--brand-dark); text-decoration: underline; }
.fs-ap-meta { color: var(--muted); font-size: .9rem; margin: .15rem 0 .8rem; }
.fs-flag { font-size: 1.1em; }
.fs-codes { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85em; }
.fs-times { margin: 0 0 .85rem; }
.fs-times > div { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .35rem 0; border-bottom: 1px dashed var(--line); font-size: .95rem; }
.fs-times dt { font-weight: 400; color: var(--muted); }
.fs-times dd { margin: 0; font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; }
.fs-delay-ok { color: var(--ok); }
.fs-delay-warn { color: var(--warn); }
.fs-delay-bad { color: var(--bad); }
.fs-tip { border: 1px solid var(--line); background: #fff; border-radius: 50%; width: 1.25rem; height: 1.25rem; font-size: .75rem; line-height: 1; padding: 0; color: var(--muted); }
.fs-facts { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.fs-facts li { display: grid; grid-template-columns: auto 1fr; column-gap: .55rem; align-items: center; background: var(--soft); border-radius: 10px; padding: .55rem .7rem; }
.fs-facts .fs-ic { grid-row: 1 / 3; color: var(--brand); width: 1.4em; height: 1.4em; }
.fs-facts span { font-size: .72rem; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; line-height: 1.2; }
.fs-facts strong { font-size: 1.2rem; line-height: 1.2; overflow-wrap: anywhere; }
.fs-tz { font-size: .8rem; color: var(--muted); margin: .75rem 0 0; display: flex; flex-wrap: wrap; gap: .35rem .6rem; align-items: center; }
.fs-q { padding: .05rem .45rem; border-radius: 5px; font-size: .72rem; font-weight: 700; background: var(--neutral-bg); color: var(--neutral); }
.fs-q-live { background: var(--ok-bg); color: var(--ok); }
.fs-q-approximate { background: var(--warn-bg); color: var(--warn); }

/* Map ---------------------------------------------------------------------------------- */
.fs-mapwrap { border-radius: 12px; overflow: hidden; background: #c6dcf2; aspect-ratio: 2 / 1; }
.fs-map { display: block; width: 100%; height: 100%; }
.fs-map-sea { fill: #c6dcf2; }
.fs-map-route { fill: none; stroke: #1d3b72; stroke-dasharray: 1.5 1.2; stroke-linecap: round; opacity: .8; }
.fs-map-route.is-net { stroke: var(--brand-dark); stroke-dasharray: none; opacity: .55; }
.fs-map-route.is-cancelled { stroke: #b42318; }
.fs-map-flown { fill: none; stroke: var(--brand); stroke-linecap: round; }
.fs-map-dot { fill: #fff; stroke: var(--sky); }
.fs-map-dot.is-small { fill: var(--brand); stroke: #fff; }
.fs-map-label { fill: var(--sky); font-weight: 800; paint-order: stroke; stroke: #fff; stroke-linejoin: round; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; }
.fs-map-plane path { fill: var(--brand); stroke: #fff; stroke-width: 1.4; }
.fs-map-plane.is-estimated path { fill: #f7931e; }
.fs-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; font-size: .85rem; color: var(--muted); margin: .65rem 0 0; }
.fs-legend span { display: inline-flex; align-items: center; gap: .4rem; }
.fs-legend i { display: inline-block; width: 1.2rem; height: .55rem; border-radius: 3px; }
.fs-legend i.fs-lg-flown { background: var(--brand); height: 3px; }
.fs-legend i.fs-lg-route { border-top: 2px dashed #1d3b72; height: 0; border-radius: 0; }
.fs-legend i.fs-lg-plane { width: .7rem; height: .7rem; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 3px rgba(238, 90, 36, .25); }
.fs-legend i.fs-lg-ok { background: #22a35a; }
.fs-legend i.fs-lg-warn { background: #f0a400; }
.fs-legend i.fs-lg-bad { background: #d9412b; }
.fs-legend i.fs-lg-cx { background: #c3c8d2; }
.fs-mapnote { font-size: .85rem; color: var(--muted); margin: .5rem 0 0; }

/* Timeline ----------------------------------------------------------------------------- */
.fs-timeline { list-style: none; margin: 0; padding: 0 0 0 .3rem; }
.fs-timeline li { position: relative; display: grid; grid-template-columns: 5.5rem 1fr; gap: .75rem; padding: 0 0 .9rem 1.4rem; }
.fs-timeline li::before { content: ""; position: absolute; left: 0; top: .45rem; width: .8rem; height: .8rem; border-radius: 50%; border: 2px solid #c0c6d4; background: #fff; }
.fs-timeline li::after { content: ""; position: absolute; left: .34rem; top: 1.35rem; bottom: 0; width: 2px; background: #e3e6ee; }
.fs-timeline li:last-child { padding-bottom: 0; }
.fs-timeline li:last-child::after { display: none; }
.fs-timeline li.is-done::before { background: var(--brand); border-color: var(--brand); }
.fs-timeline li.is-done::after { background: var(--brand); opacity: .45; }
.fs-tl-time { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fs-tl-label small { color: var(--muted); margin-left: .35rem; }
.fs-timeline li.is-next .fs-tl-time, .fs-timeline li.is-next .fs-tl-label { color: var(--muted); }
.fs-durations { display: flex; gap: 1.25rem; flex-wrap: wrap; margin: .9rem 0 0; padding-top: .7rem; border-top: 1px solid var(--line); font-size: .95rem; color: var(--muted); }
.fs-durations strong { color: var(--ink); }

/* Aircraft, position, plan -------------------------------------------------------------- */
.fs-ac { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.fs-ac > dl:only-child { grid-column: 1 / -1; }
.fs-ac-photo { margin: 0; }
.fs-ac-photo img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 10px; background: var(--soft); }
.fs-ac-photo figcaption { font-size: .78rem; color: var(--muted); margin-top: .35rem; }
.fs-ac-photo figcaption a { color: var(--muted); }
.fs-ac-similar { background: var(--warn-bg); color: var(--warn); border-radius: 4px; padding: 0 .35rem; font-weight: 700; }
@media (max-width: 575.98px) { .fs-ac { grid-template-columns: 1fr; } }
.fs-kv { margin: 0; }
.fs-kv > div { display: flex; justify-content: space-between; gap: 1rem; padding: .4rem 0; border-bottom: 1px solid var(--line); font-size: .95rem; }
.fs-kv > div:last-child { border-bottom: 0; }
.fs-kv dt { font-weight: 400; color: var(--muted); }
.fs-kv dd { margin: 0; font-weight: 600; text-align: right; }
.fs-kv-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; }
@media (max-width: 575.98px) { .fs-kv-cols { grid-template-columns: 1fr; } }
.fs-tiles { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.fs-tiles li { display: grid; grid-template-columns: auto 1fr; column-gap: .6rem; align-items: center; background: var(--soft); border-radius: 12px; padding: .7rem .85rem; min-width: 0; }
.fs-tiles .fs-ic { grid-row: 1 / 3; color: var(--brand); width: 1.5em; height: 1.5em; }
.fs-tiles span { font-size: .72rem; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.fs-tiles strong { font-size: 1.02rem; line-height: 1.3; overflow-wrap: anywhere; }
.fs-compass { display: inline-block; transform: rotate(calc(var(--deg) - 90deg)); color: var(--brand); }
.fs-pos-meta { font-size: .85rem; color: var(--muted); margin: .65rem 0 0; }
.fs-fp-route { margin: .75rem 0 0; font-size: .85rem; }
.fs-fp-route span { display: block; color: var(--muted); margin-bottom: .25rem; }
.fs-fp-route code { display: block; white-space: pre-wrap; word-break: break-word; background: var(--soft); color: var(--ink); padding: .6rem .75rem; border-radius: 8px; font-size: .85rem; }

/* Statistics ---------------------------------------------------------------------------- */
.fs-stats { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.fs-stats li { background: var(--soft); border-radius: 12px; padding: .75rem .85rem; display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.fs-stats strong { font-size: 1.5rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.fs-stats span { font-size: .8rem; color: var(--muted); line-height: 1.3; }
.fs-stats .fs-stat-ok { color: var(--ok); }
.fs-stats .fs-stat-warn { color: var(--warn); }
.fs-stats .fs-stat-bad { color: var(--bad); }
.fs-stats .fs-stat-ok span, .fs-stats .fs-stat-warn span, .fs-stats .fs-stat-bad span { color: var(--muted); }
.fs-meter { display: block; height: 5px; border-radius: 5px; background: #dfe3ea; margin-top: .35rem; overflow: hidden; }
.fs-meter b { display: block; height: 100%; background: currentColor; }
@media (max-width: 575.98px) { .fs-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fs-stats strong { font-size: 1.25rem; } }
.fs-chartwrap { margin: .25rem 0 0; }
.fs-chart { display: block; width: 100%; height: auto; }
.fs-ch-grid { stroke: #e6e8ee; stroke-width: 1; }
.fs-ch-grid.is-zero { stroke: #98a2b3; }
.fs-ch-ontime { stroke: #22a35a; stroke-width: 1; stroke-dasharray: 4 4; opacity: .6; }
.fs-ch-ax { font-size: 11px; fill: #667085; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; }
.fs-ch-bar.is-ok { fill: #22a35a; }
.fs-ch-bar.is-warn { fill: #f0a400; }
.fs-ch-bar.is-bad { fill: #d9412b; }
.fs-ch-bar.is-cancelled, .fs-ch-bar.is-diverted { fill: #d0d5dd; }
.fs-ch-bar.is-open { opacity: .45; }
.fs-bars { list-style: none; padding: 0; margin: 0; }
.fs-bars li { display: grid; grid-template-columns: minmax(8rem, 1.2fr) 2fr auto; gap: .75rem; align-items: center; padding: .3rem 0; font-size: .95rem; }
.fs-bars i { height: 8px; border-radius: 8px; background: var(--soft); overflow: hidden; }
.fs-bars b { display: block; height: 100%; background: linear-gradient(90deg, var(--brand), var(--brand-2)); }
.fs-bars em { font-style: normal; color: var(--muted); font-variant-numeric: tabular-nums; }
.fs-table { width: 100%; font-size: .95rem; border-collapse: collapse; margin: .75rem 0 0; }
.fs-table th { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; border-bottom: 2px solid var(--line); padding: .45rem .5rem; text-align: left; white-space: nowrap; }
.fs-table td { border-bottom: 1px solid var(--line); padding: .5rem; vertical-align: top; }
.fs-table a { text-decoration: none; }
.fs-teaser .btn { margin-top: .25rem; }

/* Check buttons on a flight number page --------------------------------------------------- */
.fs-check-days { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin-top: .9rem; }
.fs-check-days .fs-gate .btn { width: 100%; justify-content: center; height: 3rem; font-weight: 700; }
.fs-check-days .fs-gate .fs-status { display: none; }
.fs-check-date { display: flex; align-items: center; gap: .6rem; margin-top: .75rem; flex-wrap: wrap; }
.fs-check-date label { font-size: .9rem; color: rgba(255, 255, 255, .8); }
.fs-check-date input { max-width: 11rem; }
@media (max-width: 575.98px) { .fs-check-days { grid-template-columns: 1fr; } }

/* Empty day / landing lists ----------------------------------------------------------------- */
.fs-empty-stage { text-align: center; padding: 2rem 1.25rem 1.25rem; }
.fs-empty-icon { width: 3.6rem; height: 3.6rem; margin: 0 auto .75rem; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .1); color: var(--brand-2); }
.fs-empty-icon .fs-ic { width: 1.9rem; height: 1.9rem; transform: rotate(45deg); }
.fs-empty-stage .fs-gate .btn { min-width: 16rem; justify-content: center; }
.fs-recent { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.fs-recent a {
  display: flex; flex-direction: column; gap: .2rem; height: 100%; border: 1px solid var(--line); border-radius: 12px; padding: .7rem .85rem;
  text-decoration: none; color: var(--ink); background: #fff; transition: border-color .15s, box-shadow .15s;
}
.fs-recent a:hover { border-color: var(--brand); box-shadow: 0 4px 14px rgba(15, 27, 51, .08); color: var(--ink); }
.fs-recent-top { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.fs-recent-route { font-weight: 700; font-size: 1.05rem; display: flex; align-items: center; gap: .35rem; }
.fs-recent-route .fs-ic { color: var(--brand); transform: rotate(90deg); }
.fs-recent-meta { font-size: .8rem; color: var(--muted); }
@media (max-width: 767.98px) { .fs-recent { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .fs-recent { grid-template-columns: 1fr; } }
.fs-chips { list-style: none; padding: 0; margin: 0 0 .75rem; display: flex; flex-wrap: wrap; gap: .45rem; }
.fs-chips a { display: inline-flex; align-items: center; gap: .45rem; border: 1px solid var(--line); border-radius: 999px; padding: .3rem .8rem .3rem .35rem; text-decoration: none; color: var(--ink); font-size: .9rem; background: #fff; }
.fs-chips a:hover { border-color: var(--brand); color: var(--ink); }
.fs-chips .fs-mark { min-width: 1.8rem; height: 1.8rem; font-size: .68rem; border-radius: 999px; }
.fs-chips a > strong:first-child { padding-left: .45rem; }
.fs-chips span { color: var(--muted); }
.fs-text { margin-top: 1.5rem; }
.fs-apcard .fs-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 767.98px) { .fs-apcard .fs-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Sidebar legend ------------------------------------------------------------------------- */
.fs-legend-list { list-style: none; padding: 0; margin: .5rem 0 0; font-size: .85rem; }
.fs-legend-list li { padding: .45rem 0; border-top: 1px solid var(--line); line-height: 1.4; }
.fs-legend-list .fs-pill { margin-bottom: .2rem; }
.fs-legend-list span:not(.fs-pill) { display: block; color: var(--muted); }

/* Local test helpers (php -S only) -------------------------------------------------------- */
.ad-local { min-height: 90px; border: 2px dashed #c9ced8; border-radius: 8px; background: repeating-linear-gradient(45deg, #fafbfc 0 10px, #f2f4f7 10px 20px); }
.ad-local::before { content: "Ad: " attr(data-ad); display: block; padding: .6rem; font-size: 12px; color: #98a2b3; font-family: monospace; }
.mock-ad { position: fixed; inset: 0; z-index: 3000; display: grid; place-items: center; background: rgba(5, 10, 22, .9); }
.mock-ad-card { text-align: center; color: #fff; padding: 2rem 2.5rem; border: 1px dashed rgba(255, 255, 255, .4); border-radius: 14px; }
.mock-ad-tag { font-size: 12px; letter-spacing: .1em; color: #fbbf24; margin: 0 0 .5rem; }
.mock-ad-title { font-size: 1.4rem; font-weight: 700; margin: 0; }
.mock-ad-count { font-size: 3rem; font-weight: 800; margin: .25rem 0 1rem; }
.ad-slot.ad-local { display: block; }
.fs-map-route.is-filed { stroke-dasharray: none; stroke-width: inherit; opacity: .55; }

/* AJAX result (no date pages) */
.fs-result:empty { display: none; }
.fs-result { scroll-margin-top: 1rem; margin: 0 0 1.5rem; }
.fs-result-head { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin: .5rem 0 .75rem; }
.fs-result-title { font-size: 1.35rem; margin: 0; }
.fs-recent-al { font-size: .8rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Airport pages (/airports/, /airport/IST/) -------------------------------------------- */
.ap-sub { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .6rem; color: var(--muted); margin: 0 0 .75rem; }
.ap-codes { list-style: none; padding: 0; margin: 0 0 1rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.ap-codes li { display: inline-flex; align-items: baseline; gap: .4rem; background: var(--sky); color: #fff; border-radius: 10px; padding: .35rem .75rem; }
.ap-codes span { font-size: .7rem; letter-spacing: .06em; opacity: .7; text-transform: uppercase; }
.ap-codes strong { font-size: 1.25rem; letter-spacing: .04em; }
.ap-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .ap-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); } .ap-tiles .ap-tile-wide { grid-column: span 2; } }
.ap-rwy-wrap { border-radius: 12px; overflow: hidden; margin-bottom: .75rem; }
.ap-rwy { display: block; width: 100%; height: auto; max-height: 460px; }
.ap-rwy-bg { fill: #e8efe3; }
.ap-rwy-strip.is-paved { fill: #3d4554; }
.ap-rwy-strip.is-soft { fill: #8fb36b; }
.ap-rwy-strip.is-water { fill: #7fb2e5; }
.ap-rwy-cl { stroke: #fff; opacity: .9; }
.ap-rwy-id { fill: var(--sky); font-weight: 800; font-family: system-ui, -apple-system, "Segoe UI", sans-serif; paint-order: stroke; stroke: #fff; }
.ap-rwy-north path { fill: var(--brand); }
.ap-rwy-north text, .ap-rwy-scale text { fill: var(--ink); font-family: system-ui, -apple-system, "Segoe UI", sans-serif; font-weight: 700; }
.ap-rwy-scale rect { fill: var(--ink); }
tr.ap-closed td { color: var(--muted); text-decoration: line-through; }
.ap-near { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem 1rem; }
.ap-near li { display: flex; flex-direction: column; border-bottom: 1px solid var(--line); padding: .4rem 0; min-width: 0; }
.ap-near a { text-decoration: none; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ap-near a strong { color: var(--brand-dark); margin-right: .3rem; }
.ap-near em { font-style: normal; font-size: .85rem; color: var(--muted); }
@media (max-width: 575.98px) { .ap-near { grid-template-columns: 1fr; } }
.ap-links { display: flex; gap: 1.25rem; flex-wrap: wrap; margin: 1rem 0; }
.ap-search-form { display: flex; gap: .6rem; flex-wrap: wrap; }
.ap-search-form .fs-input { flex: 1 1 18rem; }
.ap-search-form .fs-input input { text-transform: none; letter-spacing: 0; font-weight: 600; font-size: 1.1rem; }
.ap-search-form .fs-input .fs-ic { transform: translateY(-50%); }
.ap-search { padding-bottom: 1.4rem; }
.ap-countries { list-style: none; padding: 0; margin: 0; columns: 3 12rem; column-gap: 1.5rem; }
.ap-countries li { break-inside: avoid; padding: .15rem 0; font-size: .95rem; }
.ap-countries a { text-decoration: none; color: var(--ink); }
.ap-countries a:hover { color: var(--brand-dark); }
.ap-countries small { color: var(--muted); }
.ap-records { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.ap-records h3 { font-size: 1rem; margin: 0 0 .5rem; }
.ap-records ol { padding-left: 1.2rem; margin: 0; font-size: .9rem; }
.ap-records li { padding: .15rem 0; }
.ap-records em { font-style: normal; color: var(--muted); white-space: nowrap; }
@media (max-width: 767.98px) { .ap-records { grid-template-columns: 1fr; } }

/* Airlines hub */
.al-country { border-top: 1px solid var(--line); padding: .45rem 0; }
.al-country summary { cursor: pointer; font-weight: 600; }
.al-country summary small { color: var(--muted); font-weight: 400; }
.al-country .fs-chips { margin-top: .6rem; }

/* Airline icons and logos */
img.fs-mark-img { display: inline-block; width: 2.6rem; height: 2.6rem; min-width: 0; padding: 0; object-fit: contain; background: #fff; border-radius: 10px; }
.fs-chips img.fs-mark-img { width: 1.8rem; height: 1.8rem; border-radius: 999px; }
.page-h1 img.fs-mark-img { vertical-align: -.35em; width: 2.4rem; height: 2.4rem; box-shadow: 0 0 0 1px var(--line); }
.al-logo-wrap { margin: 1rem 0 0; }
.al-logo { display: block; width: auto; height: 34px; max-width: 100%; }
.al-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem 1.5rem; flex-wrap: wrap; }
.al-head .al-logo { height: 30px; margin-top: .75rem; }
@media (max-width: 575.98px) { .al-head .al-logo { order: -1; margin-top: 1rem; } }

/* Routes */
.rt-search-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: .6rem; }
.rt-search-form .fs-input input { text-transform: none; letter-spacing: 0; font-weight: 600; font-size: 1.05rem; }
.rt-search-form .fs-input .fs-ic { transform: translateY(-50%); }
@media (max-width: 767.98px) { .rt-search-form { grid-template-columns: 1fr; } }
.fs-chip-plain { display: inline-flex; align-items: center; gap: .45rem; border: 1px solid var(--line); border-radius: 999px; padding: .3rem .8rem .3rem .35rem; font-size: .9rem; background: #fff; }
.fs-usual { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; margin: -.5rem 0 1rem; }
.fs-usual a { text-decoration: none; }
.ap-dest { margin-top: .9rem; }
.rt-cs-title { font-size: 1rem; margin: 1.1rem 0 .3rem; }
.rt-cs { list-style: none; padding: 0; margin: .5rem 0 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.rt-cs li { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85rem; background: var(--soft); border-radius: 6px; padding: .15rem .5rem; }

/* Routes from an airport */
.fs-map-dot.is-hub { fill: var(--brand); stroke: #fff; }
.rt-bigmap { aspect-ratio: 16 / 9; }
.rt-filter .rt-chip { display: inline-flex; align-items: center; gap: .45rem; border: 1px solid var(--line); border-radius: 999px; padding: .3rem .8rem .3rem .35rem; font-size: .9rem; background: #fff; color: var(--ink); cursor: pointer; }
.rt-filter .rt-chip:hover { border-color: var(--brand); }
.rt-filter .rt-chip.is-on { background: var(--sky); border-color: var(--sky); color: #fff; }
.rt-filter .rt-chip small { opacity: .7; }
.rt-country { font-size: 1rem; margin: 1.25rem 0 .25rem; }
.rt-country small { color: var(--muted); font-weight: 400; }
.rt-destlist .fs-table { margin-top: .25rem; }
.rt-dest a { text-decoration: none; color: var(--ink); }
.rt-dest strong { color: var(--brand-dark); margin-right: .3rem; }
.rt-als { white-space: nowrap; }
.rt-als .fs-mark { min-width: 1.6rem; height: 1.6rem; font-size: .6rem; border-radius: 999px; margin-right: .15rem; }
.rt-als img.fs-mark-img { width: 1.6rem; height: 1.6rem; border-radius: 999px; box-shadow: 0 0 0 1px var(--line); }
.rt-als small { color: var(--muted); margin-left: .2rem; }
.rt-searchbox + .rt-searchbox { margin-top: 1.1rem; padding-top: 1.1rem; border-top: 1px solid rgba(255, 255, 255, .15); }
.rt-search-title { color: #fff; font-size: 1.05rem; margin: 0 0 .6rem; display: flex; align-items: center; gap: .45rem; }
.rt-search-title .fs-ic { color: var(--brand-2); }
.rt-search-one { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .6rem; }
.rt-search-one .fs-input input { text-transform: none; letter-spacing: 0; font-weight: 600; font-size: 1.05rem; }
.rt-search-one .fs-input .fs-ic { transform: translateY(-50%); }
@media (max-width: 575.98px) { .rt-search-one { grid-template-columns: 1fr; } }

/* Departures & arrivals board (#fids on airport pages) -------------------------------- */
.fids { scroll-margin-top: 1rem; }
.fids-board { position: relative; }
.fids.is-locked .fids-board { min-height: 21rem; overflow: hidden; border-radius: 10px; }
.fids-preview { filter: blur(5px); opacity: .7; pointer-events: none; user-select: none; }
.fids-lock {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  padding: 1.25rem; background: linear-gradient(180deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, .82) 45%, rgba(255, 255, 255, .9));
}
.fids-lock-title { font-weight: 800; font-size: 1.25rem; margin: 0 0 .3rem; color: var(--ink); }
.fids-lock-text { color: var(--muted); max-width: 30rem; margin: 0 0 1rem; }
.fids-lock .btn .fs-ic { transform: rotate(0); }
.fids-lock .fs-note { max-width: 28rem; }
.btn.is-pulse { animation: fids-pulse 1.6s ease-out 3; }
@keyframes fids-pulse { 0% { box-shadow: 0 0 0 0 rgba(247, 147, 30, .7); } 100% { box-shadow: 0 0 0 16px rgba(247, 147, 30, 0); } }
.fids-head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; flex-wrap: wrap; }
.fids-tabs { display: inline-flex; background: var(--neutral-bg); border-radius: 10px; padding: 3px; gap: 3px; }
.fids-tab {
  border: 0; background: transparent; border-radius: 8px; padding: .4rem .85rem; font-weight: 700; color: var(--neutral);
  display: inline-flex; align-items: center; gap: .4rem; cursor: pointer;
}
.fids-tab.is-on { background: #fff; color: var(--ink); box-shadow: 0 1px 4px rgba(15, 27, 51, .14); }
.fids-tab .fs-ic { color: var(--brand); }
.fids-count { font-size: .75rem; font-weight: 700; background: var(--neutral-bg); border-radius: 99px; padding: .05rem .45rem; color: var(--neutral); }
.fids-tab.is-on .fids-count { background: #fff3e3; color: var(--brand-dark); }
.fids-filter { position: relative; margin: 0; flex: 0 1 15rem; }
.fids-filter .fs-ic { position: absolute; left: .6rem; top: 50%; transform: translateY(-50%); color: var(--muted); }
.fids-filter input { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: .4rem .6rem .4rem 2rem; font-size: .92rem; }
.fids-earlier { margin: .75rem 0 0; }
.fids-table td { vertical-align: middle; }
.fids-table small { display: block; font-size: .78rem; color: var(--muted); line-height: 1.25; }
.fids-time { white-space: nowrap; font-weight: 700; font-variant-numeric: tabular-nums; }
.fids-new { display: block; font-size: .85rem; }
.fids-new.fs-delay-ok { color: var(--ok); }
.fids-new.fs-delay-warn { color: var(--warn); }
.fids-new.fs-delay-bad { color: var(--bad); }
.fids-flight a { display: inline-flex; align-items: center; gap: .45rem; color: var(--ink); white-space: nowrap; }
.fids-flight .fs-mark { min-width: 1.7rem; height: 1.7rem; font-size: .62rem; border-radius: 6px; }
.fids-flight .fs-mark-img { width: 1.7rem; height: 1.7rem; min-width: 0; padding: 0; }
.fids-shares { color: var(--neutral) !important; }
.fids-place a { color: var(--ink); font-weight: 600; }
.fids-tg { white-space: nowrap; }
.fids-st .fs-pill { white-space: nowrap; }
.fids-panel.show-past tr.is-past, .fids-table tr.is-past { opacity: .65; }
.fids-empty { color: var(--muted); margin: 1rem 0 .25rem; }
.fids-foot { display: flex; align-items: center; justify-content: space-between; gap: .6rem; flex-wrap: wrap; margin-top: .85rem; font-size: .88rem; color: var(--muted); }
.fids-foot-status:empty { display: none; }
@media (max-width: 575.98px) {
  .fids-filter { flex: 1 1 100%; }
  .fids-tabs { width: 100%; }
  .fids-tab { flex: 1 1 50%; justify-content: center; padding: .4rem .5rem; }
  .fids-table .fids-tg { display: none; }
  .fids-table th, .fids-table td { padding: .45rem .3rem; }
  .fids-flight small:not(.fids-shares) { display: none; }
  .fids.fs-card { padding: 1rem .7rem; }
  .fids-table { font-size: .86rem; }
  .fids-table th:last-child, .fids-st { text-align: right; }
  .fids-st .fs-pill { white-space: normal; font-size: .68rem; padding: .15rem .45rem; line-height: 1.2; text-align: center; max-width: 5.6rem; }
  .fids-flight a { gap: .3rem; }
  .fids-flight .fs-mark, .fids-flight .fs-mark-img { display: none; }
  .fids.is-locked .fids-board { min-height: 24rem; }
}

/* Departures & arrivals search page */
.da-points { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 1.4rem; }
.da-points li { display: flex; gap: .6rem; align-items: flex-start; }
.da-points .fs-ic { color: var(--brand); margin-top: .15rem; }
.da-points strong { display: block; }
.da-points span { color: var(--muted); font-size: .93rem; }
.da-points strong { color: var(--ink); }
@media (max-width: 575.98px) { .da-points { grid-template-columns: 1fr; } }
