#bs-schulfoto-wrap{
  max-width: 980px;
  margin: 0 auto;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
#bs-openBtn{
  width: 100%;
  padding: 26px 18px;
  border: 0;
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: clamp(18px, 2.1vw, 26px);
  background: #0b51ff;
  color: #fff;
  box-shadow: 0 18px 40px rgba(0,0,0,.18);
  cursor: pointer;
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;
}
#bs-openBtn:hover{ filter: brightness(1.08); }
#bs-openBtn:active{
  transform: translateY(2px) scale(.995);
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
}
#bs-formPanel{
  margin-top: 18px;
  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; }
label{
  display:block;
  font-weight: 650;
  color:#1b2a57;
  margin: 10px 0 12px;
}
input, textarea{
  width:100%;
  margin-top: 8px;
  padding: 14px 14px;
  border-radius: 999px;
  border: 2px solid #2a55ff;
  outline: none;
  font-size: 16px;
  background: #fff;
}
textarea{
  border-radius: 999px;
  resize: vertical;
  min-height: 230px;
}
.bs-row2{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.bs-selectBtn{
  width:100%;
  margin-top: 8px;
  padding: 14px 14px;
  border-radius: 999px;
  border: 2px solid #2a55ff;
  background: #fff;
  text-align: left;
  cursor: pointer;
  font-size: 16px;
}
.bs-placeholder{ color:#8a8a8a; }
.bs-req{ color:#d21d1d; margin-left:4px; }
.bs-invalid{
  border-color:#d21d1d !important;
  box-shadow: 0 0 0 3px rgba(210,29,29,.18);
}
#bs-sendBtn{
  width: min(360px, 100%);
  display:block;
  margin: 18px auto 0;
  padding: 16px 18px;
  border-radius: 999px;
  border: 0;
  background: #0b51ff;
  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.08); }
#bs-sendBtn:active{ transform: translateY(2px); }
#bs-sendBtn.bs-sending{ opacity:.92; }
#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; }

.bs-pop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 18px;
  z-index: 1000000;
}
.bs-popBox{
  width: min(520px, 100%);
  background:#fff;
  border-radius: 22px;
  border: 2px solid #d21d1d;
  box-shadow: 0 24px 60px rgba(0,0,0,.25);
  padding: 18px;
}
.bs-popTitle{ font-size: 20px; font-weight: 800; color:#1b2a57; margin-bottom: 10px; }
.bs-popText{ font-size: 16px; font-weight: 650; color:#1b2a57; margin-bottom: 14px; line-height:1.35; }
.bs-popActions{ display:flex; justify-content:flex-end; }
.bs-popOk{
  border:0;
  background:#d21d1d;
  color:#fff;
  padding: 12px 16px;
  border-radius: 999px;
  font-weight: 800;
  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 #2a55ff;
  box-shadow: 0 24px 60px rgba(0,0,0,.25);
  padding: 18px;
}
.bs-modalTitle{ font-size: 20px; font-weight: 800; color:#1b2a57; margin-bottom: 10px; }
.bs-modalSub{ font-size: 16px; font-weight: 650; color:#1b2a57; margin-bottom: 10px; }
.bs-radioList{ display:flex; flex-direction:column; gap: 10px; margin-top: 8px; }
.bs-radio{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 12px 12px;
  border-radius: 16px;
  border: 1px solid rgba(42,85,255,.25);
  cursor:pointer;
  user-select:none;
}
.bs-radio input{ width:18px; height:18px; margin:0; }
.bs-modalActions{ margin-top: 14px; display:flex; justify-content:flex-end; }
.bs-modalClose{
  border:0;
  background:#0b51ff;
  color:#fff;
  padding: 12px 14px;
  border-radius: 999px;
  font-weight: 750;
  cursor:pointer;
}
@media (max-width: 820px){
  .bs-grid{ grid-template-columns: 1fr; }
}


/* Pflichtfelder dauerhaft rot umrandet (statt Sternchen) */
.bs-required{ border-color:#d21d1d !important; }


/* --- v1.0.3 Overrides: klare Rahmen-Farben + einheitlicher Radius --- */
/* Einheitlicher Radius für ALLE Felder (Inputs, Textarea, Select-Buttons) */
#bs-schulfoto-wrap input,
#bs-schulfoto-wrap textarea,
#bs-schulfoto-wrap .bs-selectBtn{
  border-radius: 10px !important; /* einheitlich, nicht "pill", nicht extra groß */
}

/* Standard: alle normalen Felder blau umrandet */
#bs-schulfoto-wrap input,
#bs-schulfoto-wrap textarea,
#bs-schulfoto-wrap .bs-selectBtn{
  border: 2px solid #2a55ff !important;
  box-shadow: none !important;
}

/* Pflichtfelder (Vorname/Nachname/E-Mail) dauerhaft rot umrandet */
#bs-schulfoto-wrap input.bs-required{
  border: 2px solid #d21d1d !important;
}

/* Wenn Pflichtfeld leer/ungültig: zusätzlich roter Glow */
#bs-schulfoto-wrap input.bs-invalid{
  border: 2px solid #d21d1d !important;
  box-shadow: 0 0 0 3px rgba(210,29,29,.18) !important;
}


/* --- v1.0.4 Overrides: ZWINGEND rot/blau + einheitlicher Radius (per ID) --- */
#bs-schulfoto-wrap input,
#bs-schulfoto-wrap textarea,
#bs-schulfoto-wrap .bs-selectBtn{
  border-radius: 6px !important;
  border-width: 2px !important;
  box-shadow: none !important;
}

/* Standard blau für ALLE Felder */
#bs-schulfoto-wrap input,
#bs-schulfoto-wrap textarea,
#bs-schulfoto-wrap .bs-selectBtn{
  border-style: solid !important;
  border-color: #2a55ff !important;
}

/* Pflichtfelder: Vorname/Nachname/E-Mail IMMER rot */
#bs-schulfoto-wrap #bs-vorname,
#bs-schulfoto-wrap #bs-nachname,
#bs-schulfoto-wrap #bs-email{
  border-color: #d21d1d !important;
}

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