/* CampZeit-Branding + Formular-Feinschliff fuer das Jazzmin-Admin-Theme.
 * Eingebunden ueber JAZZMIN_SETTINGS["custom_css"] (config/settings/base.py),
 * analog zum bestehenden custom_js (lucide_icons.js).
 *
 * Design-Tokens (konsistent mit frontend/(*)/src/components/Brand.jsx):
 *   "Camp" #27500A | "Zeit" #5C8A52 | Gold #BA7517 | "Admin"-Suffix #8A9186
 *
 * Grenze des Machbaren: der Sidebar-Brand ("site_brand") ist bei Jazzmin ein
 * REINER Textknoten -> eine echte Zweifarbigkeit Camp|Zeit ist dort ohne
 * Template-Override nicht moeglich. Kompromiss: Fraunces-Serife + je nach
 * Sidebar-Variante passender Gruenton; die zweifarbige Marke inkl. dezentem
 * "Admin"-Suffix liefert das login_logo (campzeit-brand-admin.svg) auf der
 * Anmeldeseite. */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,400;9..144,600&display=swap');

/* Sidebar-Brand: Serifen-Wortmarke statt AdminLTE-Standard. */
.brand-link .brand-text {
  font-family: 'Fraunces', Georgia, 'Times New Roman', serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
}

/* Dunkle Sidebar (Jazzmin-Default): helles Gruen, sonst unlesbar. */
[class*='sidebar-dark'] .brand-link .brand-text {
  color: #e6f0dc !important;
}

/* Helle Sidebar-Varianten: dunkles Marken-Waldgruen. */
[class*='sidebar-light'] .brand-link .brand-text {
  color: #27500a !important;
}

/* Zelt-Bildmarke im Sidebar-Header: eckig lassen (kein img-circle-Look),
 * site_logo_classes ist auf diese Klasse gesetzt. */
.brand-link .brand-image.campzeit-mark {
  border-radius: 0;
  box-shadow: none;
  opacity: 1;
}

/* Login-Seite: Wortmarken-SVG begrenzen + Untertitel (welcome_sign =
 * "Verwaltung für Campingplätze") als getrackte Gold-Versalien-Zeile -
 * der "edle" Kontrast Serife (gross) vs. Sans-Versalien (klein). */
.login-logo img {
  /* 290px Basisbreite des SVGs (inkl. "Admin"-Suffix) + etwas Luft. */
  max-width: 290px;
  height: auto;
}

.login-box-msg,
.register-box-msg {
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 700;
  font-size: 0.72rem;
  color: #ba7517 !important;
}


/* ==========================================================================
 * Formular-Feinschliff Campingplatz-Admin (Feedback-Runde 3)
 * ==========================================================================
 * Gilt NUR unter Jazzmin (diese Datei wird ueber JAZZMIN_SETTINGS
 * ["custom_css"] eingebunden, base.py). Unfold rendert eine voellig andere
 * DOM-Struktur - dort greifen die Selektoren schlicht nicht (kein Fehler,
 * nur wirkungslos).
 *
 * Jazzmin-DOM je Formularzeile (jazzmin/templates/admin/includes/fieldset.html):
 *   div.form-group.field-<n1>[.field-<n2>]
 *     > div.row
 *         > label.col-sm-3                  (erstes Feld der Zeile)
 *         > div.col-sm-9.field-<n1>         (Einzelfeld-Zeile)
 *       bzw. bei Tupel-Zeilen zusaetzlich:
 *         > label.col-auto                  (2. Feld - OHNE field-Klasse!)
 *         > div.col-auto.fieldBox.field-<n> (je Feld)
 * ========================================================================== */

/* --- 1) Abschnitts-Trenner (_div_*-Pseudofelder aus admin.py) ------------ */

/* Die (leere) Label-Spalte links wegnehmen ... */
.form-group[class*="field-_div_"] > .row > label {
  display: none;
}

/* ... und die Wertespalte auf die volle Zeilenbreite ziehen, damit der
 * Trenner auch ueber der Feldnamen-Spalte liegt und ganz links beginnt.
 * Bootstrap 5 arbeitet bei .col-sm-9 mit width (nicht flex-basis) -
 * deshalb beides setzen. */
.form-group[class*="field-_div_"] > .row > div[class*="field-_div_"] {
  flex: 0 0 100%;
  width: 100%;
  max-width: 100%;
}

/* Jazzmin rahmt JEDES readonly-Feld in eine graue Box (.readonly in
 * jazzmin/css/main.css) - beim Trenner stoert die. */
.form-group[class*="field-_div_"] .readonly {
  padding: 0;
  border: 0;
  background: none;
  border-radius: 0;
  color: inherit;
}

/* Die leeren Fehler-Platzhalter unter dem Trenner kosten Abstand. :empty
 * greift nicht - die Template-Divs enthalten Whitespace/Newlines. */
.form-group[class*="field-_div_"] .help-block {
  display: none;
}

/* Kein doppelter Abstand: der Abstand kommt aus der Margin von .cz-divider. */
.form-group[class*="field-_div_"] {
  margin-bottom: 0;
}

/* Erster Trenner eines Reiters braucht keinen Abstand nach oben (die Card
 * hat bereits p-5). !important, weil die Margin inline gesetzt ist. */
.card-body > .form-group[class*="field-_div_"]:first-child .cz-divider {
  margin-top: 0 !important;
}

/* Dark Mode: die Inline-Farben von _divider_html() sind fuer den hellen
 * Modus gewaehlt. !important ist hier unvermeidbar (Inline-Style). */
html[data-bs-theme="dark"] .cz-divider {
  color: #cfe3c3 !important;
  background: rgba(92, 138, 82, 0.22) !important;
}

/* --- 2) Check-in-/Check-out-Zeilen als sauberes 2x2-Raster --------------- */
/* Ursache der schiefen Optik: Jazzmin gibt beiden Feldern einer Tupel-Zeile
 * .col-auto (Breite = Inhalt). Feste Breiten machen daraus eine Matrix.
 * Spezifitaet .fieldBox.field-x (0,2,0) schlaegt .col-auto (0,1,0),
 * label[for=...] (0,1,1) ebenso - kein !important noetig. */
.fieldBox.field-checkin_time,
.fieldBox.field-checkin_until,
.fieldBox.field-checkout_from,
.fieldBox.field-checkout_time {
  flex: 0 0 auto;
  width: 200px;
  max-width: 200px;
}

/* Das jeweils ZWEITE Label einer Zeile ("... bis") ist col-auto und hat
 * keine field-Klasse - Zugriff nur ueber das for-Attribut.
 * 140px reicht fuer das laengste Label "Check-out bis". */
label[for="id_checkin_until"],
label[for="id_checkout_time"] {
  flex: 0 0 auto;
  width: 140px;
  max-width: 140px;
}

/* Beide Zeilen oben buendig, damit die Hilfetexte die Eingabefelder nicht
 * vertikal verschieben. */
.form-group.field-checkin_time > .row,
.form-group.field-checkout_from > .row {
  align-items: flex-start;
}

/* Die vier Zeitfelder selbst gleich breit. */
#id_checkin_time,
#id_checkin_until,
#id_checkout_from,
#id_checkout_time {
  width: 120px;
}

/* --- 3) Fahrzeugmasse: ungueltige Eingabe wenigstens sichtbar machen ----- */
/* Jazzmins change_form.html setzt novalidate auf das <form> - HTML5-Regeln
 * (step/min) blockieren also NICHT das Speichern. Die harte Pruefung macht
 * das Model (DecimalValidator + MinValueValidator); hier nur ein optischer
 * Hinweis. */
#id_max_vehicle_length:invalid,
#id_max_vehicle_width:invalid,
#id_max_vehicle_height:invalid {
  border-color: #b3261e;
  box-shadow: 0 0 0 0.15rem rgba(179, 38, 30, 0.2);
}