/* ---- Plan (tab-plan.js) ---- */
#page-plan.active { display: flex; flex-direction: column; overflow: hidden; }
#planEndTime { margin-bottom: 8px; }
.slot-list-wrap { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; }
.slot-list { list-style: none; flex: 1; min-height: 0; overflow-y: auto; }
/* Unten rechts nebeneinander: "Zum Anfang" links (ab 200 px gescrollt), "Zur Zielrunde"/"Zum Ende" rechts (sobald scrollbar);
   links neben der 56-px-Spalte der Block-Buttons (X/+/−), damit sie diese nicht verdecken */
#planTopBtn, #planEndBtn { position: absolute; bottom: 8px; z-index: 4; opacity: 0; pointer-events: none; transition: opacity .2s; }
#planTopBtn { right: 112px; }
#planEndBtn { right: 64px; }
#planTopBtn.show, #planEndBtn.show { opacity: 1; pointer-events: auto; }
#planEndIcon svg { width: 22px; height: 22px; }
/* Kopfzeile "Fahrer anhängen" zum Ein-/Ausklappen */
#appendSection { margin-top: 8px; }
.append-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 48px;
                 padding: 0; background: none; border: none; color: var(--md-sys-color-on-surface-variant); cursor: pointer; font: inherit; }
.append-toggle .card-label { margin-bottom: 0; }
#appendBody .hint { margin-bottom: 8px; }
#appendSection.collapsed #appendBody { display: none; }
/* Chip beim Ziehen in den Plan: in der Liste als Einfüge-Markierung über die volle Breite */
#slotList .rider-chip.plan-insert-ghost { margin-bottom: 6px; border: 2px dashed var(--md-sys-color-primary);
                                          border-radius: 12px; justify-content: center; }
/* Zeilen (auch Ergebnisse): Position, Symbol, Info, Aktionen */
.slot-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px;
             background: var(--md-sys-color-surface-container-high);
             border-radius: 12px; margin-bottom: 6px;
             border: 1px solid var(--md-sys-color-outline-variant);
             position: relative; overflow: hidden; min-height: 58px; }
.slot-item.active { border-width: 2px; border-color: var(--md-sys-color-primary); }
.slot-item.done.unscored { opacity: .55; }  /* Ergebnisse: ungewertete Runden gedimmt */
.slot-item.is-after-end .slot-info > .slot-planned > :not(.after-end-badge, .lap-time-chip-divider), .slot-item.is-after-end .slot-pos { opacity: .5; }
/* Durchfahrt-Chip auf der Trennlinie muss die Linie verdecken: abdunkeln statt durchsichtig machen */
.slot-item.is-after-end .slot-planned > .lap-time-chip-divider { filter: brightness(.55); }
.slot-item.skipped { opacity: .4; text-decoration: line-through; }
.slot-item.planned { flex-wrap: wrap; cursor: pointer; }
.slot-pos { width: 28px; height: 28px; border-radius: 50%;
            background: var(--md-sys-color-surface-variant);
            display: flex; align-items: center; justify-content: center;
            font-size: 12px; font-weight: 700; flex-shrink: 0;
            color: var(--md-sys-color-on-surface-variant); }
.slot-pos.slot-pos-unscored { color: var(--md-sys-color-error); }
.slot-sym { width: 24px; display: flex; align-items: center; justify-content: center;
            flex-shrink: 0; cursor: default; color: var(--md-sys-color-on-surface-variant); }
.slot-sym .msym { width: 20px; height: 20px; }
.slot-info { flex: 1; min-width: 0; }
.slot-planned { font-weight: 600; font-size: 15px; }
/* Plan: Startnummer und Name etwas größer als in den übrigen Listen (Ergebnisse teilen .slot-planned) */
#slotList .slot-planned > .rider-tag { font-size: 18px; }
#slotList .slot-planned > .rider-tag .rider-num { min-width: 28px; height: 24px; padding: 0 6px; border-radius: 5px; font-size: 14px; }
.slot-duration { font-size: 13px; font-weight: 600; color: var(--md-sys-color-primary); white-space: nowrap; }
.slot-actions { display: flex; gap: 6px; flex-shrink: 0; }
/* Folgerunden desselben Fahrers: ohne Abstand aneinander, Name nur in der ersten */
.slot-item.grp-has-next { margin-bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; padding-bottom: 17px; }
.slot-item.grp-cont { border-top-left-radius: 0; border-top-right-radius: 0; border-top-width: 0; overflow: visible; padding-top: 17px; }
/* Geplanter Block: rechts abgetrennte Spalte (56 px, Fahrerfarbe) über alle Zeilen, oben der Lösch-Button.
   Die Trennlinie zwischen den Runden endet vor der Spalte (::after statt border-bottom). */
.slot-item.has-del-zone { padding-right: 68px; }
.slot-del-zone { position: absolute; top: 0; bottom: 0; right: 0; width: 56px; z-index: 1;
                 background: color-mix(in srgb, var(--rc) 31%, transparent); }
/* Ohne unteren Rand: die Trennlinie (::after) liegt bündig unten – sonst ragten Fortschritts-Hinterlegung
   der laufenden Runde und Spalte 1–2 px unter die Linie und der Durchfahrt-Chip säße nicht mittig darauf */
.slot-item.has-del-zone.grp-has-next { border-bottom-width: 0; }
.slot-item.has-del-zone.grp-has-next::after { content: ''; position: absolute; left: 0; right: 56px; bottom: 0; height: 1px; background: var(--rc); }
.slot-item.active.has-del-zone.grp-has-next::after { height: 2px; }  /* nach der laufenden Runde 2 px wie ihr Rand */
.slot-del-btn { position: absolute; top: 1px; left: 50%; transform: translateX(-50%); width: 44px; height: 44px; padding: 0;
                display: flex; align-items: center; justify-content: center; background: none; border: none; cursor: pointer; }
.slot-del-circle { width: 30px; height: 30px; border-radius: 50%; border: 2px solid var(--rc); background: #000; color: #fff;
                   display: flex; align-items: center; justify-content: center; }
.slot-del-circle svg { width: 16px; height: 16px; }
/* „+“ unter dem X: erste Zeile eines geplanten Blocks hoch genug für beide Tippflächen (2 × 44 px) */
.slot-del-btn.slot-add-btn { top: 45px; }
.slot-item.has-del-zone:not(.grp-cont):not(.zone-single) { min-height: 91px; box-sizing: border-box; }
/* Laufender Block: „+“ oben (kein X), „−“ darunter; ohne geplante Folgerunden nur „+“ (.zone-single) */
.slot-del-btn.slot-zone-top { top: 1px; }
.slot-del-btn.slot-zone-second { top: 45px; }
/* Chips in der Zeile */
.slot-planned .lights-badge, .slot-planned .start-lap-badge, .slot-planned .sun-chip, .slot-planned .after-end-badge { margin-left: 6px; margin-block: 2px; }
.slot-planned .race-end-chip { margin-left: 6px; }
/* Durchfahrt: Chip auf der Trennlinie zur vorigen Runde – absolut ohne left, bleibt so in der Chip-Spalte */
.slot-item .slot-planned .lap-time-chip-divider { position: absolute; top: 0; transform: translateY(-50%); margin-block: 0; z-index: 3; }
/* Blockstart/-ende, Rennende, Sonnenauf-/-untergang: Schrift 30 % größer als die übrigen Chips
   (13.5 px), Rahmen 2 px (Blockchips per Inline-Stil in Fahrerfarbe, Rennende weiß, Sonne in ihrer Farbe) */
.slot-item .slot-planned .lap-time-chip-block,
.slot-item .slot-planned .race-end-chip,
.slot-item .slot-planned .sun-chip-rise,
.slot-item .slot-planned .sun-chip-set { font-size: 17.5px; height: 30px; border-radius: 15px; padding: 0 9px 0 7px; }
.slot-item .slot-planned .lap-time-chip-block svg,
.slot-item .slot-planned .race-end-chip svg,
.slot-item .slot-planned .sun-chip-rise svg,
.slot-item .slot-planned .sun-chip-set svg { width: 19px; height: 19px; }
.slot-item .slot-planned .race-end-chip { border: 2px solid #fff; }
.slot-item .slot-planned .sun-chip-rise,
.slot-item .slot-planned .sun-chip-set { border: 2px solid currentColor; }
