/* =========================================================
   Schwabenmühle Buchung Demo – v2.0.12
   Stabilitäts-Fix: Theme/CSS darf Selects nicht zusammenstauchen
   ========================================================= */

/* Wrapper muss echte Breite bekommen (gegen "shrink-to-fit" Regeln) */
.smb-wrap,
.smb-wrap .smb-form,
.smb-wrap .smb-grid,
.smb-wrap .smb-field{
  width: 100% !important;
  max-width: 100% !important;
}

/* Grid-Feld darf nicht durch Fremd-CSS schmal werden */
.smb-wrap .smb-grid{
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}

.smb-wrap .smb-grid > .smb-field{
  min-width: 0 !important;
}

/* Hilfsklasse: erzwingt einen neuen Grid-Row-Start */
.smb-wrap .smb-grid > .smb-field.smb-newrow{
  grid-column-start: 1 !important;
}

/* GANZ WICHTIG: Selects immer vollflächig (Theme überschreibt das gern) */
.smb-wrap .smb-field select{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Auch Inputs/Textareas zur Sicherheit */
.smb-wrap .smb-field input,
.smb-wrap .smb-field textarea{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Die alte "min(520px,100%)"-Begrenzung neutralisieren */
.smb-wrap .smb-field.smb-compact select,
.smb-wrap .smb-field.smb-accommodation select,
.smb-wrap .smb-field.smb-komfort-only select{
  width: 100% !important;
  max-width: 100% !important;
}

/* Optional: Hilfetext soll nicht die Spaltenbreite beeinflussen */
.smb-wrap .smb-field small,
.smb-wrap .smb-field .description,
.smb-wrap .smb-field .smb-help{
  display: block;
  max-width: 100%;
}


/* === v2.0.6: Stretch-Fix gegen shrink-to-fit (Theme-Overrides) === */
.smb-wrap .smb-grid{
  justify-items: stretch !important;
  align-items: start !important;
}
.smb-wrap .smb-grid > .smb-field{
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
}
.smb-wrap .smb-field select,
.smb-wrap .smb-field input,
.smb-wrap .smb-field textarea{
  width: 100% !important;
  max-width: none !important;
}

/* === v2.0.8: Spaltenbreiten stabil machen (Theme/Plugin hat .smb-col-* gekillt) === */

/* Wrapper wieder angenehm breit + zentriert */
.smb-wrap{
  width: 100% !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  padding: 0 10px !important;
}

/* Default: volle Zeile */
.smb-wrap .smb-grid > .smb-field{
  grid-column: span 12 !important;
}

/* Spaltenklassen (1–12) */
.smb-wrap .smb-grid > .smb-field.smb-col-1{ grid-column: span 1 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-2{ grid-column: span 2 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-3{ grid-column: span 3 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-4{ grid-column: span 4 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-5{ grid-column: span 5 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-6{ grid-column: span 6 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-7{ grid-column: span 7 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-8{ grid-column: span 8 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-9{ grid-column: span 9 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-10{ grid-column: span 10 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-11{ grid-column: span 11 !important; }
.smb-wrap .smb-grid > .smb-field.smb-col-12{ grid-column: span 12 !important; }

/* Mobile: alles untereinander */
@media (max-width: 780px){
  .smb-wrap .smb-grid > .smb-field{
    grid-column: span 12 !important;
  }
}


/* =========================================================
   v2.0.8 – Reihenfolge/Spalten + kompakte Felder
   - smb-compact: etwas kleinere Labels + geringere Feldhöhe
========================================================= */
.smb-wrap .smb-field.smb-compact label{
  font-size: 12px;
  opacity: .85;
}
/* =========================================================
   Kompakter Look: alle Felder gleich klein (wie PLZ)
   ========================================================= */
.smb-wrap .smb-field input,
.smb-wrap .smb-field select,
.smb-wrap .smb-field textarea{
  height: 32px !important;
  padding: 5px 10px !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  border-radius: 6px !important;
  box-sizing: border-box !important;
}
.smb-wrap .smb-field textarea{
  height: auto !important;
  min-height: 64px !important;
}
.smb-wrap .smb-field label{
  font-size: 12px !important;
  opacity: .85 !important;
}

/* Datum / Unterkunft / Anreiseart bewusst etwas kompakter */
.smb-wrap .smb-field.smb-compact input,
.smb-wrap .smb-field.smb-compact select{
  height: 32px !important;
  padding: 5px 10px !important;
  font-size: 14px !important;
}


.smb-wrap .smb-field.smb-compact input,
.smb-wrap .smb-field.smb-compact select{
  height: 34px;
  padding: 6px 10px;
  font-size: 14px;
  line-height: 1.2;
}


/* =========================================================
   v2.0.12 – gewünschte Reihenfolge + Spaltenanpassungen
   - Anrede eigene Zeile (Feld bleibt schlank)
   - Vorname/Nachname 7/5
   - Land/PLZ/Ort 4/1/7 (PLZ schmaler)
========================================================= */

/* Anrede: Feld belegt eine ganze Zeile, Select bleibt optisch klein */
.smb-wrap #smb_anrede{
  width: 260px !important;
  max-width: 100% !important;
}
@media (max-width: 780px){
  .smb-wrap #smb_anrede{ width: 100% !important; }
}


/* =========================================================
   v2.0.11 – Reihenfolge/Platzierung nach 12er Raster (fix)
   Wunsch:
   1 Anrede (2)
   2 Vorname (4) + Nachname (4) + 4 leer
   3 Adresse (8)
   4 Land (2) + PLZ (2) + Ort (4) + 4 leer
   5 E-Mail (4) + Telefon (4) + 4 leer
   6 Unterkunft (3)
   7 Anreiseart (3)
   8 Anreise/Abreise unterhalb Unterkunft/Anreiseart
   SAT unter Hund bleibt (keine Änderung hier)
   ========================================================= */

/* Sicherheit: Default alle Felder volle Breite, dann gezielt platzieren */
.smb-wrap .smb-grid > .smb-field{
  grid-column: span 12 !important;
  grid-row: auto !important;
}

/* Die ersten Felder fest platzieren (DOM-Reihenfolge) */
.smb-wrap .smb-grid > .smb-field:nth-child(1){ /* Anrede */
  grid-column: 1 / span 2 !important;
  grid-row: 1 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(2){ /* Vorname */
  grid-column: 1 / span 4 !important;
  grid-row: 2 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(3){ /* Nachname */
  grid-column: 5 / span 4 !important;
  grid-row: 2 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(4){ /* Adresse */
  grid-column: 1 / span 8 !important;
  grid-row: 3 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(5){ /* Land */
  grid-column: 1 / span 2 !important;
  grid-row: 4 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(6){ /* PLZ */
  grid-column: 3 / span 2 !important;
  grid-row: 4 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(7){ /* Ort */
  grid-column: 5 / span 4 !important;
  grid-row: 4 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(8){ /* E-Mail */
  grid-column: 1 / span 4 !important;
  grid-row: 5 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(9){ /* Telefon */
  grid-column: 5 / span 4 !important;
  grid-row: 5 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(10){ /* Unterkunft */
  grid-column: 1 / span 2 !important;
  grid-row: 6 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(11){ /* Anreiseart */
  grid-column: 1 / span 2 !important;
  grid-row: 7 !important;
}

/* Standard (Zelt/Campingfass): Anreise/Abreise direkt nach Unterkunft */
.smb-wrap .smb-grid > .smb-field:nth-child(12){ /* Anreise */
  grid-column: 1 / span 2 !important;
  grid-row: 7 !important;
}

.smb-wrap .smb-grid > .smb-field:nth-child(13){ /* Abreise */
  grid-column: 3 / span 2 !important; /* gleiche Breite wie Anreise */
  grid-row: 7 !important;
}

/* Komfortstellplatz: wenn Anreiseart sichtbar ist, rutschen Anreise/Abreise eine Zeile nach unten */
.smb-wrap form.smb-form.smb-has-arrivaltype .smb-grid > .smb-field:nth-child(12){
  grid-row: 8 !important;
}
.smb-wrap form.smb-form.smb-has-arrivaltype .smb-grid > .smb-field:nth-child(13){
  grid-row: 8 !important;
}

/* Mobile: alles untereinander und Reihen-/Spalten-Fixes zurücknehmen */
@media (max-width: 780px){
  .smb-wrap .smb-grid > .smb-field{
    grid-column: span 12 !important;
  }
}

/* SAT-Empfang: Breite wie Mengenfelder (Erwachsene/Hund etc.) */
.smb-booking-split .smb-satonly{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}
.smb-booking-split .smb-satonly select{
  width: 86px;
  max-width: 100%;
}

.smb-booking-split .smb-satonly label{ margin: 0; }
.smb-booking-split .smb-satonly .smb-satquestion{
  font-size: 12px;
  opacity: .85;
  margin: 0;
}

/* Campingfass: Bettwäsche-Checkbox sauber ausrichten */
.smb-booking-split label.smb-checkline{
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.smb-booking-split .smb-checkline input[type="checkbox"]{
  width: 18px;
  height: 18px;
  margin: 0;
}
.smb-booking-split .smb-checkline{
  align-items: flex-start;
}

/* =============================
   2.0.17 – Layout-Fixes
   - Anrede eigene Zeile
   - SAT: Label als Frage (2 Zeilen) + Feld kompakter
   - Bettwäsche-Checkbox sauber ausrichten
   ============================= */

/* Anrede eigene Zeile, aber Select nicht riesig */
.smb-wrap .smb-grid > .smb-anredeonly{ grid-column: 1 / span 12 !important; }
.smb-wrap .smb-grid > .smb-anredeonly select{ max-width: 260px; }

/* SAT kompakter + Frage als Label */
.smb-wrap .smb-satonly{ max-width: 420px; }
.smb-wrap .smb-satonly .smb-satlabel{
  font-size: 12px;
  opacity: .85;
  margin: 10px 0 6px;
  line-height: 1.25;
}
.smb-wrap .smb-satonly select{ max-width: 320px; }

/* Bettwäsche-Checkbox (Campingfass) korrekt linksbündig */
.smb-wrap .smb-bettwaesche .smb-checkline{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
}
.smb-wrap .smb-bettwaesche .smb-checkline input[type="checkbox"]{ margin: 0; }