/* Gemeinsame Zeilenstruktur.
   Nur Anordnung, keine Farben – die stehen in app.css und dürfen hier alles
   überschreiben, weil diese Datei vorher geladen wird. */

/*
 * Die Unterzeile einer Tabellenzeile.
 *
 * app.css gibt der Klasse Farbe und Schriftgröße, aber kein display. Ein
 * <small> bleibt damit im Textfluss und klebt an der Zeile darüber: aus
 * "BV Detmold" und "2026-0001" wurde "BV Detmold2026-0001".
 *
 * Bewusst hier und nicht in app.css: dort steht die Gestaltung, die neu
 * erzeugt wird. Eine Ergänzung darin wäre beim nächsten Durchgang wieder weg,
 * und der Fehler käme zurück. Da app.css für diese Klasse kein display setzt,
 * gibt es auch keinen Konflikt.
 */
.zeile-unterzeile {
    display: block;
    margin-top: 2px;
    line-height: 1.35;
}

/*
 * Firmenlogo in den Stammdaten.
 *
 * Steht im Kopf jedes Kontrollnachweises und wird deshalb sofort gespeichert,
 * nicht erst beim Absenden des Formulars. Hier nur die Anordnung: Vorschau
 * links, Knoepfe daneben. Groesse und Rahmen sind bewusst festgelegt, damit
 * ein hochkantes Logo die Zeile nicht auseinanderzieht.
 */
.firma-logo {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.firma-logo-titel { display: block; }

.firma-logo-feld {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.firma-logo-feld img {
    max-width: 180px;
    max-height: 70px;
    object-fit: contain;
}

.firma-logo-leer { margin: 0; }

/*
 * Karte fuer die Kontrollpunkte einer Strecke.
 *
 * Steht im Kontrollformular, nicht im Projekt: gesetzt werden die Punkte
 * draussen, von dem der aufbaut oder kontrolliert. Nur Anordnung und Masse.
 * Die Karte braucht eine feste Hoehe, sonst hat Leaflet keinen Platz zum
 * Zeichnen und bleibt leer.
 */
.strecke-karte {
    height: 320px;
    margin: 8px 0;
    border-radius: 10px;
    overflow: hidden;
}

@media (max-width: 700px) {
    .strecke-karte { height: 240px; }
}

/* ── Rechtliche Hinweise ───────────────────────────────── */

/* Impressum und Datenschutz müssen von jeder Seite aus erreichbar sein
 * (§ 5 DDG). In der Seitenleiste unten, und weil die auf schmalen Geräten
 * ausgeblendet wird, zusätzlich am Ende der Übersicht. */
.seiten-fuss-recht {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .75rem;
    margin: .5rem 0 0;
    font-size: .7rem;
}

.recht-zeile {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.25rem;
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid var(--line, rgba(255,255,255,.08));
    font-size: .75rem;
}

/* Auf breiten Geräten steht die Zeile schon in der Seitenleiste – zweimal
 * dasselbe untereinander wäre Wiederholung ohne Zweck. */
@media (min-width: 861px) {
    .recht-zeile { display: none; }
}

/* ── Übersicht ─────────────────────────────────────────── */

/* Zwei Tafeln nebeneinander: was heute aufgestellt und was abgebaut wird.
 * Untereinander wäre die zweite unter dem Falz - und dann sieht sie
 * niemand. */
.ue-spalten {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
    margin-top: 15px;
}

/* Der Aufmerksamkeitsblock steht zwischen Kacheln und Tagesgeschäft: er ist
 * das, was man zuerst liest, aber erst nach den Zahlen einen Sinn ergibt. */
.ue-achtung { margin-top: 15px; }

/* Eine Kachel kann ein Link sein – dann führt sie dorthin, wo die Zahl
 * herkommt. Der Verweis darf sie aber nicht anders aussehen lassen. */
.kacheln a.kachel { text-decoration: none; color: inherit; }

@media (max-width: 860px) {
    .ue-spalten { grid-template-columns: 1fr; }
}