#bs-kita05-wrap{
  max-width: 980px;
  margin: 0 auto;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Button als Bild */
#bs-kita05-openBtn{
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
#bs-kita05-openBtn img{
  width: 100%;
  height: auto;
  display: block;
}

#bs-kita05-formPanel{
  margin-top: 16px;
  background: #f3f3f3;
  border-radius: 22px;
  padding: 22px;
  border: 1px solid rgba(0,0,0,.06);
}

.bs-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: stretch; }
.bs-col{ display:flex; flex-direction:column; min-height: 100%; }
.bs-grow{ flex: 1; }

label{
  display:block;
  font-weight: 650;
  color:#1b6b2e; /* grün */
  margin: 10px 0 12px;
}
.bs-label-req{ color:#9a0f0f; }

#bs-kita05-wrap input,
#bs-kita05-wrap textarea,
#bs-kita05-wrap .bs-selectBtn{
  width:100%;
  margin-top: 8px;
  padding: 14px 14px;
  border-radius: 999px; /* pill wie im Entwurf */
  border: 2px solid #1ea64a; /* grün */
  outline: none;
  font-size: 16px;
  background: #fff;
  box-shadow: none;
  box-sizing: border-box;
  color:#1b6b2e; /* Eingabetext grün */
  font-weight: 650;
}

/* Platzhalter neutral */
#bs-kita05-wrap input::placeholder,
#bs-kita05-wrap textarea::placeholder{ color:#8a8a8a; }

#bs-kita05-wrap textarea{
  resize: vertical;
  min-height: 230px;
  border-radius: 24px;
}

/* Termin gelb hinterlegt */
#bs-kita05-wrap #bs-termin{
  background: #ffe36a;
}

.bs-row2{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.bs-selectBtn{
  text-align: left;
  cursor: pointer;
}
.bs-placeholder{ color:#8a8a8a; }

/* Dropdown-Text: Platzhalter grau, Auswahl grün */
.bs-selectBtn span.bs-placeholder{ color:#8a8a8a; font-weight: 650; }
.bs-selectBtn span:not(.bs-placeholder){ color:#1b6b2e; font-weight: 750; }

/* Pflichtfelder IMMER rot */
#bs-kita05-wrap #bs-vorname,
#bs-kita05-wrap #bs-nachname,
#bs-kita05-wrap #bs-email{
  border-color: #d21d1d !important;
  color:#9a0f0f; /* Pflichtfeld-Eingabetext rot */
}

/* Wenn ungültig: roter Glow */
#bs-kita05-wrap #bs-vorname.bs-invalid,
#bs-kita05-wrap #bs-nachname.bs-invalid,
#bs-kita05-wrap #bs-email.bs-invalid{
  box-shadow: 0 0 0 3px rgba(210,29,29,.18) !important;
}

#bs-sendBtn{
  width: min(360px, 100%);
  display:block;
  margin: 18px auto 0;
  padding: 16px 18px;
  border-radius: 999px;
  border: 0;
  background: #1ea64a; /* grün */
  color:#fff;
  font-weight: 800;
  letter-spacing: .12em;
  cursor:pointer;
  transition: transform .12s ease, filter .12s ease, background .12s ease;
}
#bs-sendBtn:hover{ filter: brightness(1.06); }
#bs-sendBtn:active{ transform: translateY(2px); }
#bs-sendBtn.bs-sending{ background:#16833a; }
#bs-sendBtn.bs-sent{ background:#1ea64a; }

.bs-msg{
  margin-top: 8px;
  padding: 12px 14px;
  border-radius: 14px;
  display:none;
  font-size: 15px;
}
.bs-msg.ok{ display:block; background:#e9fff0; border:1px solid #a7f0bf; color:#0a6b2e; }
.bs-msg.err{ display:block; background:#fff0f0; border:1px solid #ffb6b6; color:#9a0f0f; }
.bs-hidden{ display:none !important; }

/* Popup: unten groß (nahe Send-Button) */
.bs-pop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.20);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding: 16px;
  z-index: 1000000;
}
.bs-popBox{
  width: min(640px, 100%);
  background:#fff;
  border-radius: 18px;
  border: 2px solid #1ea64a; /* default grün */
  box-shadow: 0 14px 38px rgba(0,0,0,.22);
  padding: 16px;
  margin-bottom: 8px;
}
.bs-popTitle{ font-size: 18px; font-weight: 900; color:#0a6b2e; margin-bottom: 8px; }
.bs-popText{ font-size: 16px; font-weight: 750; color:#1b2a57; margin-bottom: 12px; line-height:1.35; }

/* Pflichtfeld-POPUP: rot */
.bs-popBox.bs-popErr{ border-color:#d21d1d; }
.bs-popBox.bs-popErr .bs-popTitle,
.bs-popBox.bs-popErr .bs-popText{ color:#9a0f0f; }
.bs-popActions{ display:flex; justify-content:flex-end; }
.bs-popOk{
  border:0;
  background:#1ea64a;
  color:#fff;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 900;
  cursor:pointer;
}

/* Modals */
.bs-modal{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 18px;
  z-index: 999999;
}
.bs-modalBox{
  width: min(520px, 100%);
  background:#fff;
  border-radius: 22px;
  border: 2px solid #1ea64a;
  box-shadow: 0 24px 60px rgba(0,0,0,.25);
  padding: 18px;
}
.bs-modalTitle{ font-size: 20px; font-weight: 800; color:#0a6b2e; margin-bottom: 10px; }
.bs-modalSub{ font-size: 16px; font-weight: 650; color:#1b2a57; margin-bottom: 10px; }
.bs-radioList{ display:flex; flex-direction:column; gap: 18px; margin-top: 10px; }

/* Radio-Zeilen wie im Entwurf: Text links, Kringel rechts, alle Kringel exakt bündig */
.bs-radio{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 18px;
  padding: 6px 2px;
  border: 0;
  cursor:pointer;
  user-select:none;
  width:100%;
  margin:0; /* überschreibt Theme-Label-Margins */
  box-sizing:border-box;
}
.bs-radio span{
  color:#1b6b2e;
  font-weight: 750;
  font-size: 20px;
  line-height: 1.2;
  white-space: nowrap; /* kein zweizeiliges Wort wie Kindergartenleitung */
  flex: 1 1 auto;
}
.bs-radio input{
  width: 22px;
  height: 22px;
  margin: 0;
  accent-color: #1ea64a; /* Kringel grün + gefüllt grün */
  flex: 0 0 auto;
  margin-left:auto; /* garantiert rechtsbündig */
}

/* optische "Bitte auswählen"-Zeile in Modals */
.bs-radioHint{
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#8a8a8a;
  font-weight: 700;
  font-size: 18px;
  padding: 6px 2px;
  width:100%;
  margin:0;
  box-sizing:border-box;
}

/* Extra Spezifität gegen Theme-CSS (Elementor/Theme überschreibt gerne label/input) */
#bs-kita05-wrap .bs-radioList{ align-items:stretch; }
#bs-kita05-wrap .bs-radio{ display:flex; justify-content:space-between; width:100%; }
#bs-kita05-wrap .bs-radio span{ flex:1 1 auto; }
#bs-kita05-wrap .bs-radio input{ margin-left:auto; }
.bs-radioHintDot{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 2px solid #c8c8c8;
  display:flex;
  align-items:center;
  justify-content:center;
}
.bs-radioHintDot::after{
  content:"";
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background:#c8c8c8;
}
.bs-modalActions{ margin-top: 14px; display:flex; justify-content:flex-end; }
.bs-modalClose{
  border:0;
  background:#1ea64a;
  color:#fff;
  padding: 12px 14px;
  border-radius: 999px;
  font-weight: 750;
  cursor:pointer;
}

/* Smartphone: einspaltig, groß */
@media (max-width: 820px){
  .bs-grid{ grid-template-columns: 1fr; }
}



/* --- FIXES v05 --- */
/* Radio-Layout im Modal: Text links, Kringel hart rechts, immer bündig */
#bs-kita05-wrap .bs-radio{
  display:grid !important;
  grid-template-columns: 1fr 28px !important;
  align-items:center !important;
  column-gap: 12px !important;
}
#bs-kita05-wrap .bs-radio span{
  display:block !important;
  margin:0 !important;
}
#bs-kita05-wrap .bs-radio input[type="radio"]{
  justify-self: end !important;
  align-self: center !important;
  margin: 0 !important;
  position: static !important;
  float: none !important;
  transform: none !important;
  max-width: 22px !important;
  min-width: 22px !important;
  width: 22px !important;
  height: 22px !important;
  accent-color: #1ea64a !important;
}

/* --- FIXES v05 --- */
#bs-kita05-wrap .bs-radio{
  display:grid !important;
  grid-template-columns: 1fr 28px !important;
  align-items:center !important;
  column-gap: 12px !important;
}
#bs-kita05-wrap .bs-radio span{
  display:block !important;
  margin:0 !important;
}
#bs-kita05-wrap .bs-radio input[type="radio"]{
  justify-self: end !important;
  align-self: center !important;
  margin: 0 !important;
  position: static !important;
  float: none !important;
  transform: none !important;
  max-width: 22px !important;
  min-width: 22px !important;
  width: 22px !important;
  height: 22px !important;
  accent-color: #1ea64a !important;
}

/* Autofill-Farben erzwingen (Chrome/Android) */
#bs-kita05-wrap input:-webkit-autofill,
#bs-kita05-wrap textarea:-webkit-autofill{
  -webkit-text-fill-color: #1b6b2e !important;
  caret-color: #1b6b2e !important;
}
#bs-kita05-wrap #bs-vorname:-webkit-autofill,
#bs-kita05-wrap #bs-nachname:-webkit-autofill,
#bs-kita05-wrap #bs-email:-webkit-autofill{
  -webkit-text-fill-color: #b01616 !important;
  caret-color: #b01616 !important;
}

/* Autofill-Farben erzwingen (Chrome/Android) */
#bs-kita05-wrap input:-webkit-autofill,
#bs-kita05-wrap textarea:-webkit-autofill{
  -webkit-text-fill-color: #1b6b2e !important;
  caret-color: #1b6b2e !important;
}
#bs-kita05-wrap #bs-vorname:-webkit-autofill,
#bs-kita05-wrap #bs-nachname:-webkit-autofill,
#bs-kita05-wrap #bs-email:-webkit-autofill{
  -webkit-text-fill-color: #b01616 !important;
  caret-color: #b01616 !important;
}
