/* Zug-Knopf in der Handy-Leiste und Schnell-Infos zum Ausklappen (seit 11.11.2026, inc/footer.php, schnellinfo.php) */
.si-blatt{display:none}
@media (max-width:1080px){
  /* Knopf: Uhrzeit der naechsten Abfahrt statt Beschriftung, gelb bei Bus statt Zug, rot bei Verspaetung */
  .mfn-zug{color:var(--gruen-dunkel,#2f4a3e)}
  .mfn-zug .mfn-zug-zeit{font-weight:800; font-variant-numeric:tabular-nums; letter-spacing:0}
  .mfn-zug.mfn-zug-spaet .mfn-zug-zeit{color:#c8473d}
  .mfn-zug.mfn-zug-bus .mfn-zug-zeit{background:#f4d27a; color:#3a2f00; border-radius:6px; padding:0 4px}
  .mfn-zug[aria-expanded="true"]{color:var(--gruen,#3d5a4b)}

  /* Blatt von unten */
  .si-blatt{display:block; position:fixed; inset:0; z-index:200}
  .si-blatt[hidden]{display:none}
  .si-hinter{position:absolute; inset:0; background:rgba(20,35,28,.38); opacity:0; transition:opacity .22s ease}
  .si-box{position:absolute; left:0; right:0; bottom:0; max-height:86vh; overflow-y:auto; overscroll-behavior:contain;
    background:#f6f7f3; border-radius:22px 22px 0 0; box-shadow:0 -10px 34px rgba(20,40,30,.22);
    padding:6px 16px calc(env(safe-area-inset-bottom) + 18px); transform:translateY(100%); transition:transform .24s cubic-bezier(.2,.8,.2,1)}
  .si-blatt.offen .si-hinter{opacity:1}
  .si-blatt.offen .si-box{transform:none}
  .si-griff{width:42px; height:5px; border-radius:3px; background:#c9d0c6; margin:4px auto 6px}
  .si-titelzeile{display:flex; align-items:center; justify-content:space-between; padding:2px 2px 8px;
    position:sticky; top:-6px; z-index:2; background:#f6f7f3}
  .si-titelzeile b{font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-size:1.05rem; color:var(--gruen-dunkel,#2f4a3e)}
  .si-zu{width:36px; height:36px; border:0; border-radius:50%; background:#e6eae3; color:#2f4a3e; font-size:1.5rem; line-height:1; cursor:pointer}
  html.si-offen, html.si-offen body{overflow:hidden}

  .si-block{background:#fff; border:1px solid var(--line,#dfe4dc); border-radius:16px; padding:14px 14px 12px; margin-bottom:10px}
  .si-eyebrow{display:block; font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--muted,#6b776f); margin-bottom:8px}
  .si-leer{margin:0; font-size:.92rem; color:var(--muted,#6b776f)}
  .si-laden{padding:30px 0; text-align:center; color:var(--muted,#6b776f); font-size:.9rem}

  /* Zug */
  .si-haupt{display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:6px 14px}
  .si-haupt > .si-bus{grid-column:1 / -1; justify-self:start}
  .si-uhr{font-family:'Encode Sans Condensed','Encode Sans',sans-serif; font-weight:800; font-size:2.6rem; line-height:1;
    color:var(--gruen-dunkel,#2f4a3e); font-variant-numeric:tabular-nums}
  .si-daten{display:flex; flex-direction:column; gap:2px; font-size:.9rem; line-height:1.3; min-width:0}
  .si-daten strong{font-size:1.05rem}
  .si-daten s{color:var(--muted,#6b776f); margin-left:4px}
  .si-spaet{color:#c8473d; font-weight:700}
  .si-puenktlich{color:#3f9a4d; font-weight:600}
  .si-bus{display:inline-block; background:#f4d27a; color:#3a2f00; font-weight:700; font-size:.78rem; border-radius:6px; padding:2px 7px; margin-right:6px}
  .si-haupt > .si-bus{font-size:.85rem; padding:4px 9px}
  .si-weitere{list-style:none; margin:12px 0 0; padding:0; border-top:1px solid var(--line,#dfe4dc)}
  .si-weitere li{display:grid; grid-template-columns:3.2em 1fr auto; align-items:center; gap:8px; padding:8px 0; border-bottom:1px solid #eef1ec; font-size:.9rem}
  .si-weitere time{font-weight:800; font-variant-numeric:tabular-nums}
  .si-w-wo{color:#3b4a41; min-width:0}
  .si-w-lage{text-align:right; white-space:nowrap}
  .si-quelle{margin:10px 0 0; font-size:.74rem; color:var(--muted,#6b776f); line-height:1.4}
  .si-quelle a{font-weight:700; white-space:nowrap}

  /* Winter: die Kacheln aus Winter heute, im Blatt etwas kompakter */
  .si-winter .wh-blick{grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px}
  .si-winter .wh-kachel{padding:11px 11px 10px 15px}
  .si-winter .wh-zeile{font-size:.8rem}
  .si-winter .wh-wert{font-size:.98rem}
  @media (max-width:380px){ .si-uhr{font-size:2.25rem} .si-haupt{gap:6px 11px} }
  .si-mehr{display:block; margin-top:10px; font-weight:700; font-size:.92rem}
}
@media (prefers-reduced-motion:reduce){ .si-hinter, .si-box{transition:none} }
/* Winter-Knopf als Blatt-Knopf (seit 11.11.2026, Variante A): offen wie aktiv gefuellt */
@media (max-width:1080px){
  .mfn-winter[aria-expanded="true"] .mfn-kapsel{background:#2f6fb0; color:#fff; box-shadow:0 3px 10px rgba(47,111,176,.35)}
}
