/* Flugplan-Baustein. Bewusst sparsam gehalten, damit er sich in das Design
   der phpwcms-Seite einfuegt statt es zu ueberschreiben. */

:root {
    --gcf-brand:      #cc6601;
    --gcf-brand-dark: #a85101;
}

/* Ueberschriften: die Seitenvorlage setzt h2 offenbar groesser als h1,
   deshalb hier eine eigene, klar untergeordnete Groesse. */
.gcf-heading {
    font-size: 1.3rem;
    line-height: 1.25;
    font-weight: 600;
    margin: 1.8em 0 .6em;
}

.gcf-to { color: var(--gcf-brand); }

.gcf-intro { margin-bottom: 1.2em; }

.gcf-facts {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: .3em 1.2em;
    margin: 0 0 1.8em;
}
.gcf-facts dt { font-weight: 600; }
.gcf-facts dd { margin: 0; }

.gcf-table { width: 100%; border-collapse: collapse; margin-bottom: 2em; }
.gcf-table caption { text-align: left; font-size: .85em; opacity: .7; padding-bottom: .5em; }
.gcf-table th,
.gcf-table td { padding: .5em .6em; text-align: left; border-bottom: 1px solid rgba(0,0,0,.12); }
.gcf-table th { font-size: .78em; text-transform: uppercase; letter-spacing: .08em; }
.gcf-table time { font-variant-numeric: tabular-nums; }

/* Zeit am Zielort der jeweiligen Richtung */
.gcf-key { font-weight: 700; }

/* Verkehrstage */
.gcf-days { display: inline-flex; gap: .2em; }
.gcf-day {
    font-size: .82em;
    line-height: 1;
    padding: .3em .38em;
    border-radius: 3px;
    opacity: .3;
}
.gcf-day--on {
    opacity: 1;
    font-weight: 600;
    background: var(--gcf-brand);
    color: #fff;
}
.gcf-days--all {
    font-weight: 700;
    color: var(--gcf-brand);
}

.gcf-note { font-size: .82em; opacity: .75; }
.gcf-empty, .gcf-error { font-style: italic; opacity: .8; }

@media (max-width: 700px) {
    .gcf-table { display: block; overflow-x: auto; }
}

/* Streckenuebersicht */
.gcf-table--routes td:nth-child(2) {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.gcf-table--routes .gcf-airlines {
    font-size: .88em;
    opacity: .8;
}
.gcf-table--routes td:first-child { padding-block: .35em; }

/* Flughafen als Schaltflaeche */
.gcf-table--routes a {
    display: inline-block;
    padding: .4em .7em;
    background: var(--gcf-brand);
    color: #fff;
    text-decoration: none;
    border: 0;
    border-radius: 3px;
    white-space: nowrap;
    transition: background-color .15s ease;
}
.gcf-table--routes a abbr {
    text-decoration: none;
    border: 0;
    opacity: .85;
    margin-left: .3em;
}
.gcf-table--routes a:hover,
.gcf-table--routes a:focus-visible {
    background: var(--gcf-brand-dark);
    color: #fff;
}
.gcf-table--routes a:focus-visible {
    outline: 2px solid var(--gcf-brand);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .gcf-table--routes a { transition: none; }
}


/* =======================================================================
   Ankunfts-/Abflugtafel (Board)
   Ergaenzt den Flugplan-Baustein. Die Tabelle traegt .gcf-table gcf-board
   und erbt damit die Basis oben; hier nur die board-spezifischen Zusaetze.
   Nutzt dieselben Marken-Variablen, oeffnet kein eigenes Farbsystem.
======================================================================= */

/* Zeit-Spalte kompakt, Gate betont, Check-in/Band dezent */
.gcf-board .c-time    { font-weight: 700; white-space: nowrap; }
.gcf-board .c-flight  { white-space: nowrap; font-variant-numeric: tabular-nums; }
.gcf-board .c-place   { font-weight: 600; }
.gcf-board .c-gate    { font-weight: 700; white-space: nowrap; }
.gcf-board .c-checkin,
.gcf-board .c-belt    { white-space: nowrap; opacity: .75; }
.gcf-board .c-status  { white-space: nowrap; }

/* revidierte (erwartete) Zeit bei Verspaetung */
.gcf-board .c-time .orig { opacity: .55; text-decoration: line-through; font-weight: 500; margin-right: .25em; }
.gcf-board .c-time .rev  { color: #b42318; }

/* Status – einziger farbiger Akzent in den Zeilen */
.gcf-board .s-bad     { color: #b42318; font-weight: 600; }
.gcf-board .s-warn    { color: #b7791f; font-weight: 600; }
.gcf-board .s-good    { color: #2f7d32; }
.gcf-board .s-neutral { opacity: .7; }

/* Anker-Ziel beim Blaettern: etwas Abstand nach oben, falls die Seite eine
   fixierte Kopfzeile hat. Bei Bedarf hoeher setzen. */
.gcf-board-section { scroll-margin-top: 1rem; }

/* Blaettern zwischen den Zeitfenstern */
.gcf-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6em;
    margin: .8em 0;
    font-size: .9em;
}
.gcf-nav a {
    color: var(--gcf-brand-dark);
    text-decoration: none;
    font-weight: 600;
}
.gcf-nav a:hover,
.gcf-nav a:focus-visible { text-decoration: underline; }
.gcf-nav a:focus-visible {
    outline: 2px solid var(--gcf-brand);
    outline-offset: 2px;
    border-radius: 3px;
}
.gcf-block { opacity: .7; font-variant-numeric: tabular-nums; }
.gcf-nav .is-off { opacity: .3; }


/* -----------------------------------------------------------------------
   Nur fuer die Einzelseiten (data.airport-arrivals.eu/arrivals.php …).
   Im phpwcms-Embed kommen diese Klassen nicht vor, dort wirkungslos.
----------------------------------------------------------------------- */
.gcf-page {
    margin: 0;
    color: #1c1917;
    background: #fff;
    font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    -webkit-text-size-adjust: 100%;
}
.gcf-page .gcf-main,
.gcf-page .gcf-head,
.gcf-page .gcf-foot { max-width: 820px; margin-inline: auto; padding-inline: 16px; }

.gcf-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 16px 12px;
    border-top: 4px solid var(--gcf-brand);
    flex-wrap: wrap;
}
.gcf-tabs { display: inline-flex; border: 1px solid rgba(0,0,0,.15); border-radius: 8px; overflow: hidden; }
.gcf-tab {
    padding: 8px 16px;
    font-weight: 600;
    text-decoration: none;
    color: var(--gcf-brand-dark);
    background: #fff;
}
.gcf-tab + .gcf-tab { border-left: 1px solid rgba(0,0,0,.15); }
.gcf-tab.is-active { background: var(--gcf-brand); color: #fff; }

.gcf-lang { display: inline-flex; gap: 4px; font-size: 13px; }
.gcf-l { padding: 4px 8px; text-decoration: none; opacity: .6; border-radius: 6px; }
.gcf-l.is-active { opacity: 1; color: #fff; background: var(--gcf-brand-dark); }

.gcf-foot { padding: 12px 16px 28px; opacity: .7; font-size: 13px; }
.gcf-asof { font-variant-numeric: tabular-nums; }

.gcf-tab:focus-visible,
.gcf-l:focus-visible {
    outline: 2px solid var(--gcf-brand);
    outline-offset: 2px;
    border-radius: 4px;
}