/* ===========================================================================
   Termine (Spiele, Spieltage, Turniere, Sonstiges)
   ---------------------------------------------------------------------------
   Spezifikation: docs/specs/termine.md

   Nur .ter-*-Klassen: keine :root-Variablen, keine nackten Element-Regeln.
   Damit darf die Datei fuer index.html und register.html wegfallen
   (ti_css_ohne in kopf-css.php). Dialog, Felder und Knoepfe kommen aus
   08-spielerorganisation-mannschaften.css (.so-dlg, .so-inp, .so-btn).
   =========================================================================== */

.ter-neu { margin-left: auto; }

.ter-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }

.ter-eintrag { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 14px; align-items: start;
    padding: 12px 14px; border: 1px solid var(--glass-22); border-radius: 12px; background: var(--glass-06); }

.ter-datum { display: flex; flex-direction: column; align-items: center; line-height: 1.15;
    padding: 6px 0; border-radius: 10px; background: var(--tigers-yellow-06); border: 1px solid var(--tigers-yellow-35); }
.ter-datum span { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; color: var(--glass-60); }
.ter-datum b { font-size: 1.05rem; font-weight: 900; }
.ter-datum small { font-size: 0.66rem; color: var(--glass-60); }

.ter-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 4px; }
.ter-art { font-size: 0.66rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em;
    padding: 2px 8px; border-radius: 999px; background: var(--glass-08); border: 1px solid var(--glass-22); }
.ter-titel { font-size: 0.95rem; font-weight: 800; }
.ter-zeile { font-size: 0.82rem; margin-top: 3px; overflow-wrap: anywhere; }
.ter-zeile a { font-size: inherit; }
.ter-zeile i { width: 1.1em; text-align: center; color: var(--glass-60); }
.ter-notiz { font-size: 0.8rem; margin-top: 6px; color: var(--glass-60); overflow-wrap: anywhere; }

.ter-marke { display: inline-block; font-size: 0.72rem; font-weight: 700; padding: 2px 8px; border-radius: 8px; }
.ter-marke-verlegt { background: var(--warn-bg); color: var(--warn-text); border: 1px solid var(--warn-border); }
.ter-marke-abgesagt { background: var(--err-bg); color: var(--err-text); border: 1px solid var(--err-border); margin: 2px 0 4px; }

/* Abgesagt: bleibt stehen, durchgestrichen (AK14). */
.ter-abgesagt { opacity: 0.75; }
.ter-abgesagt .ter-titel,
.ter-abgesagt .ter-zeile { text-decoration: line-through; }

.ter-aktionen { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }

.ter-vergangen { margin-top: 18px; }
.ter-vergangen > summary { cursor: pointer; font-weight: 700; font-size: 0.85rem; margin-bottom: 10px; }

/* hidden muss gegen .so-grid2 { display: grid } gewinnen (Art-abhaengige Felder). */
.ter-dlg .so-grid2[hidden],
.ter-dlg .so-fld[hidden],
.ter-dlg .so-btn[hidden] { display: none; }

/* Termin-Hallenzeit in der Hallenbelegung: statt Bearbeiten nur der Weg zum Termin (AK11). */
.ter-hb-link { margin-top: 4px; font-size: 0.72rem; }
.ter-hb-link a { color: inherit; font-weight: 700; text-decoration: underline; }
.ter-dlg .so-grid2 + .so-grid2,
.ter-notiz-fld { margin-top: 12px; }
.ter-notiz-fld textarea { resize: vertical; min-height: var(--feld-hoehe); }

/* Spielplan des Verbands (BWHV): Karte unter der Terminliste. */
.ter-bwhv { margin-top: 18px; }
.ter-bwhv-kopf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; }
.ter-bwhv-kopf .ad-lead { margin: 0; }
.ter-bwhv-h { font-size: 0.85rem; font-weight: 800; margin: 18px 0 8px; }
.ter-bwhv-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ter-bwhv-liste > li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px;
    padding: 10px 12px; border: 1px solid var(--glass-22); border-radius: 10px; background: var(--glass-06); }
.ter-bwhv-text { font-size: 0.85rem; overflow-wrap: anywhere; min-width: 0; flex: 1 1 260px; }
.ter-bwhv-text small { color: var(--glass-60); margin-left: 6px; }
.ter-bwhv-zuordnung { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ter-bwhv-hallen { margin-top: 16px; }
.ter-bwhv-hallen > summary { cursor: pointer; font-weight: 700; font-size: 0.85rem; margin-bottom: 8px; }
/* Abgleich laeuft: Drehzeichen und Balken ohne Prozentangabe (die Dauer haengt am Verband). */
.ter-lauf { margin: 0 0 14px; padding: 12px 14px; border: 1px solid var(--tigers-yellow-35); border-radius: 10px; background: var(--tigers-yellow-06); }
.ter-lauf[hidden] { display: none; }
.ter-lauf-kopf { display: flex; align-items: center; gap: 10px; font-size: 0.88rem; font-weight: 700; }
.ter-spinner { flex: 0 0 auto; width: 18px; height: 18px; border-radius: 50%; border: 3px solid var(--glass-22); border-top-color: currentColor; animation: ter-dreh 0.9s linear infinite; }
.ter-balken { display: block; height: 6px; margin-top: 10px; border-radius: 999px; background: var(--glass-22); overflow: hidden; }
.ter-balken i { display: block; height: 100%; width: 35%; border-radius: 999px; background: currentColor; animation: ter-balken 1.4s ease-in-out infinite; }
@keyframes ter-dreh { to { transform: rotate(360deg); } }
@keyframes ter-balken { 0% { transform: translateX(-100%); } 100% { transform: translateX(300%); } }
@media (prefers-reduced-motion: reduce) { .ter-spinner, .ter-balken i { animation-duration: 3s; } }
.ter-bwhv button:disabled { opacity: 0.55; cursor: progress; }
.ter-bwhv-meldung.ok { color: var(--ok-text); }
.ter-bwhv-meldung.err { color: var(--err-text); }

/* Hallendienst: ein Eintrag je Heimspiel, darunter die Plaetze. */
.hd-spiel { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 14px; align-items: start;
    padding: 12px 14px; border: 1px solid var(--glass-22); border-radius: 12px; background: var(--glass-06); }
.hd-plaetze { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.hd-platz { display: grid; grid-template-columns: 110px minmax(0, 150px) minmax(0, 1fr) auto; gap: 6px 12px; align-items: center;
    padding: 6px 10px; border: 1px solid var(--glass-22); border-radius: 8px; font-size: 0.85rem; }
.hd-platz.hd-frei { border-style: dashed; }
.hd-aufgabe { font-weight: 800; }
.hd-dienst { color: var(--glass-60); font-size: 0.78rem; overflow-wrap: anywhere; }
.hd-person em { color: var(--glass-60); }
.hd-aktion form { display: flex; gap: 6px; align-items: center; margin: 0; }
.hd-hinweis { color: var(--glass-60); font-size: 0.72rem; }
.hd-offen { display: inline-flex; align-items: center; gap: 6px; font-size: 0.85rem; }
.hd-form-zeile { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; width: 100%; }
.hd-form-zeile .so-inp { flex: 1 1 180px; }
.hd-form-zeile .hd-klein, .hd-klein { flex: 0 0 90px; width: 90px; }

@media (max-width: 700px) {
    .ter-eintrag { grid-template-columns: 52px minmax(0, 1fr); gap: 10px; }
    .ter-aktionen { grid-column: 1 / -1; justify-content: flex-start; }
    .ter-aktionen .so-btn span { display: none; }
    .ter-neu { margin-left: 0; }
    .hd-spiel { grid-template-columns: 52px minmax(0, 1fr); gap: 10px; }
    .hd-platz { grid-template-columns: minmax(0, 1fr) auto; }
    .hd-aufgabe, .hd-dienst, .hd-person { grid-column: 1; }
    .hd-aktion { grid-column: 2; grid-row: 1 / span 3; }
}