/* Fussleiste: Werkzeugleiste am unteren Rand
   Teil 4 von 6 der Betriebsansicht. Bis zum
   06.09.2026 stand das alles in laserdance-betrieb.css (2.519
   Zeilen). Der Schnitt hat KEINE Regel geaendert: die Bloecke
   stehen in derselben Folge wie vorher, und die sechs Dateien
   werden in der Reihenfolge geladen, in der ihre Regeln vorher
   in der einen Datei standen (laserdance-betrieb.css).
   Wer hier etwas aendert: docs/DESIGN.md lesen, danach
   python tools\css-referenz.py nachher. */
.ld .zoomreg svg { width: 15px; height: 15px; fill: none; stroke: var(--muted); stroke-width: 1.6 }
.ld .zoomreg span { font: 700 var(--fs-11) var(--font); color: var(--muted); min-width: 16px; text-align: right }
@media (max-width: 700px) {
    .ld .zoomreg { flex: 1 1 auto; min-width: 0 }
    .ld .zoomreg input { min-width: 0; flex: 1 1 auto }
}
/* Schieberegler für die Auflösung der Zeitachse */


/* Zoomregler: rund statt eckig */
.ld .zoomreg {
    display: flex;
    align-items: center;
    gap: 7px;
    background: var(--field);
    border: 1px solid var(--line);
    /* Kein 999px: das Stylesheet baut auf eckigen Ecken (4/6/8 px),
       eine Pille bricht das System (docs/DESIGN.md). */
    border-radius: var(--r-ctl);
    padding: 4px 12px;
}

.ld .zoomreg input[type=range] {
    width: 110px;
    accent-color: var(--acc);
    cursor: pointer;
    height: 3px;
    border-radius: 2px;
}

/* ---- Werkzeugleiste unten im Betrieb ---- */
.ld .fussleiste {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
    display: flex; align-items: center; gap: 18px;
    background: rgba(10, 10, 15, .97); border-top: 1px solid var(--line);
    padding: 9px 16px calc(9px + env(safe-area-inset-bottom));
    font: 600 var(--fs-12) var(--font)
}
/* Nur mit Maus: die Leiste taucht nach unten weg und kommt hoch, sobald der
   Zeiger den unteren Rand beruehrt (Pauls Wunsch). Am Touch-Geraet (iPad, kein
   Hover) bleibt sie sichtbar, damit die Werkzeuge erreichbar bleiben. Der
   sichtbare Streifen oben ist der "Anfasser". */
@media (hover: hover) {
    .ld .fussleiste {
        transform: translateY(calc(100% - 15px)); transition: transform .2s ease;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, .35);
    }
    /* Sichtbarer Anfass-Griff LINKS (Pauls Wunsch), als kleine Lasche mit
       Akzentkante - damit man weiss, dass hier die Werkzeugleiste sitzt. */
    .ld .fussleiste::before {
        content: "Werkzeuge"; position: absolute; top: 0; left: 14px;
        font: 800 var(--fs-10) var(--font); letter-spacing: .14em; text-transform: uppercase;
        color: var(--cyan); line-height: 15px; padding: 0 10px;
        border-left: 2px solid var(--cyan); background: rgba(2, 255, 255, .07);
        pointer-events: none;
    }
    /* Solange das Werkzeugfenster offen ist, bleibt die Leiste oben: sonst
       taucht sie weg, sobald der Zeiger ins Fenster wandert, und das Fenster
       schwebt ueber einer leeren Kante. */
    .ld .fussleiste:hover, .ld .fussleiste:focus-within,
    .ld .fussleiste:has(.fl-keys.on) { transform: translateY(0); }
    .ld .fussleiste:hover::before, .ld .fussleiste:focus-within::before,
    .ld .fussleiste:has(.fl-keys.on)::before { opacity: 0 }
}
@media (prefers-reduced-motion: reduce) { .ld .fussleiste { transition: none } }
.ld .fussleiste .fl-links { display: flex; gap: 4px; flex-wrap: wrap; min-width: 0 }
.ld .fussleiste .fl-links a.leer { color: var(--muted2); font-style: italic }
.ld .fussleiste .fl-zahlen { display: flex; gap: 14px; margin-left: auto; color: var(--muted); white-space: nowrap }
.ld .fussleiste .fl-zahlen b { color: var(--text) }
.ld .fussleiste .fl-zahlen .warnz b { color: var(--red) }
.ld .fussleiste .fl-keys:hover, .ld .fussleiste .fl-keys.on { color: var(--text); border-color: var(--acc) }
.ld .fl-keypanel .fk { font: 500 var(--fs-12) var(--font); color: var(--muted) }
.ld .fl-keypanel .fk i {
    font-style: normal; font-weight: 800; color: var(--text);
    background: rgba(255, 255, 255, .07); border: 1px solid var(--line);
    padding: 1px 7px; margin-right: 8px; display: inline-block; min-width: 52px; text-align: center
}

/* Platz fuer die Leiste nur, wenn sie AUF ist. Zugeklappt nutzt die
   Uebersicht die volle Hoehe (Pauls Wunsch), die anderen Seiten scrollen. */
html.fussoffen .ld .pg:has(.fussleiste) .wrap:not(.ovfull) { padding-bottom: 58px }
.ld .pg:has(.fussleiste) .wrap:not(.ovfull) { padding-bottom: 12px }

@media (max-width: 700px) {
    .ld .fussleiste { flex-wrap: wrap; gap: 6px 12px }
    .ld .fussleiste .fl-zahlen { margin-left: 0; gap: 10px; font-size: var(--fs-11) }
}
.ld .fussleiste .fl-links a.plus:hover { color: var(--acc); border-color: var(--acc) }

/* Fussleiste klappt per Knopf auf und zu (Pauls Wunsch: nicht mehr beim
   Hovern). Zu = ganz unten weg, nur der Griff bleibt; auf = sichtbar. */
.ld .fussleiste { transition: transform .18s ease }
/* entfernt: Zuklappen der Werkzeugleiste (Paul, 27.08.) */
/* entfernt: Zuklappen der Werkzeugleiste (Paul, 27.08.) */

/* Griff/Umschalter: immer sichtbar am unteren Rand, auch bei zugeklappter
   Leiste. Klick schaltet um. */
.ld .fussgriff {
    position: fixed; left: 50%; bottom: 0; transform: translateX(-50%); z-index: 56;
    display: flex; align-items: center; gap: 7px;
    background: rgba(10, 10, 15, .97); border: 1px solid var(--line); border-bottom: 0;
    color: var(--muted); font: 700 var(--fs-11) var(--font); letter-spacing: .04em;
    padding: 4px 16px; cursor: pointer
}
/* Offen: der Griff sitzt rechts oben ueber der Leiste, nicht mittig (dort
   liegen die Werkzeuge) - so ueberlappt er nichts. */
html.fussoffen .ld .fussgriff { left: auto; right: 12px; bottom: 44px; transform: none; z-index: 60 }

/* Uebersichts-Werkzeuge in der Leiste */
.ld .fussleiste .fl-ovwerk { display: flex; align-items: center; gap: 10px; min-width: 0 }
.ld .fussleiste .fl-ovwerk .stdsprung { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none }
.ld .fussleiste .fl-ovwerk .zoomreg { padding: 2px 10px }
.ld .fussleiste .fl-ovwerk .zoomreg input[type=range] { width: 90px }

/* --- Vorschau-Werkzeug: Uhrzeit simulieren (Ticket) --- */
.ld .fl-vorschau { display: flex; align-items: center; gap: 8px; flex-wrap: wrap }
/* Erklaerzeile und Knopfzeile im Werkzeugfenster */
.ld .fl-keypanel .fl-werkzeug { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; max-width: 260px }
.ld .fl-keypanel .fl-werkzeug small { font: 500 var(--fs-11) var(--font); color: var(--muted2); line-height: 1.35 }
.ld .fl-keypanel .fkt { font: 800 var(--fs-10) var(--font); letter-spacing: .12em; text-transform: uppercase; color: var(--muted2); margin: 2px 0 }
.ld .fl-keypanel .fktrenn { height: 1px; background: var(--line); margin: 6px 0 }
.ld .fl-vorschau input[type=time] {
    width: 96px; padding: 3px 7px; font-size: var(--fs-12);
    background: var(--field); border: 1px solid var(--line); color: var(--text);
}
/* Vorschau: seit 19.09.2026 eine Marke in der Tagesleiste (Betrieb.razor,
   .urbox.vorschau), kein Streifen mehr ueber dem Plan (Inventar, Stufe 0.12). */
.ld .mast2 .urbox.vorschau { border-color: var(--cyan); color: var(--cyan); display: inline-flex; align-items: center; gap: 8px }
.ld .mast2 .urbox.vorschau .minibtn { padding: 2px 8px; font-size: var(--fs-11); border-color: rgba(2, 255, 255, .5); color: var(--cyan) }
.ld .mast2 .urbox.vorschau .minibtn:hover { border-color: var(--cyan) }
/* Bis 08.09.2026 war die Vorschau unter 900 px ausgeblendet - am iPad, wo sie
   am ehesten gebraucht wird, gab es sie also gar nicht. Sie steht jetzt in
   einem eigenen Fenster und hat dort Platz; nur das Zeitfeld wird schmaler. */
@media (max-width: 900px) { .ld .fl-vorschau input[type=time] { width: 88px } }

/* --- Fussleiste: flach, Hairline, Text-Links */
.ld .fussleiste { background: var(--p1); border-top: 1px solid var(--line); backdrop-filter: none; box-shadow: none }

.ld .fussleiste .fl-links a {
    color: var(--muted);
    text-decoration: none;
    border: 1px solid transparent;
    white-space: nowrap;
    border-radius: var(--r-chip);
    border-color: transparent;
    background: none;
    padding: 6px 9px;
}

.ld .fussleiste .fl-links a:hover {
    border-color: var(--line);
    color: var(--text);
}

/* Fussleiste: kleines Plus zum Nachpflegen der Links */

.ld .fussleiste .fl-links a.plus {
    font-weight: 800;
    padding: 4px 8px;
    color: var(--muted2);
    border: 1px dashed var(--line);
    border-radius: var(--r-chip);
}

.ld .fussleiste .fl-keys {
    background: none;
    border: 1px solid var(--line);
    color: var(--muted);
    font: 700 var(--fs-12) var(--font);
    padding: 7px 13px;
    cursor: pointer;
    margin-left: auto;
    border-radius: var(--r-ctl);
}
.ld .fussleiste .fl-ovwerk .stdsprung button { border-radius: var(--r-chip) }
.ld .fussleiste .zoomreg { border-radius: var(--r-ctl) }

.ld .fl-keypanel {
    position: fixed;
    right: 12px;
    bottom: 52px;
    /* MUSS ueber dem Aussenklick-Faenger .qovl (94) liegen. Bis 08.09.2026 stand
       hier 80: der Faenger lag damit UEBER dem Fenster und schluckte jeden Klick
       darin - die Vorschau liess sich nicht bedienen und das Fenster ging beim
       ersten Tippen sofort wieder zu (Pauls Ticket: "vorschau kann ich nicht
       clicken das kuerzel menu schliesst sich direkt wieder"). Dieselbe Falle
       steht in brain/muster.md unter position:fixed und Faenger. */
    z-index: 95;
    /* ueber dem Ticket-Knopf */
    max-height: calc(100vh - 96px);
    overflow-y: auto;
    overscroll-behavior: contain;
    background: var(--p1);
    border: 1px solid var(--acc);
    box-shadow: 0 14px 40px rgba(0, 0, 0, .5);
    padding: 10px 14px;
    display: grid;
    gap: 6px;
    border-radius: var(--r-card);
    border-color: var(--line);
}
@media (prefers-reduced-motion: no-preference) {
    /* Fenster, die aufklappen */
    .ld .mast .kontomenue, .ld .fl-keypanel { animation: ld-auf .18s cubic-bezier(.2, .7, .2, 1) both }
}

/* ---- Aus laserdance-system.css hierher geholt (06.09.2026) ----
   .ld .fussleiste .fl-links a hatte SECHS Definitionen ueber zwei Dateien
   (Befund G3-b). Radius und Hoehe der Fussleiste gehoeren zur Fussleiste.
   In dieser Zeile lagen einmal 0, 4, 6 und 999 als Radius und 26, 27, 30
   und 33 als Hoehe nebeneinander; 30 ist die Fussleistenhoehe aus
   docs/DESIGN.md. */
.ld .fussleiste .fl-links a,
.ld .fussleiste .fl-keys,
.ld .zoomreg { border-radius: var(--r-ctl) }
.ld .fussleiste .fl-links a,
.ld .fussleiste .fl-keys,
.ld .fussleiste .minibtn,
.ld .fussleiste .stdsprung button {
    min-height: 30px; display: inline-flex; align-items: center; justify-content: center;
}
.ld .fussleiste input[type=time],
.ld .fussleiste .zoomreg { min-height: 30px }