
/* Basiswerte, Theme-Farbe wird per addStyleDeclaration gesetzt (siehe bewerbung.php) */
:root { --c: #2E75B6; }

/* Vor JS-Initialisierung: Alles, was eine Sichtbarkeitsregel hat, sicher verstecken */
body:not(.js-enabled) .section[data-visible-if],
body:not(.js-enabled) .form-group[data-visible-if] {
  display: none !important;
}

/* Hilfsklasse, die wir per JS toggeln */
.hidden { display: none !important; }

/* Reset & Typografie */
* { box-sizing: border-box; }
body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background:#f7f9fc; padding:20px; margin:0; color:#333;
}

/* Container (du hast "container" verwendet; belassen, oder Klassen angleichen) */
.container {
  max-width: 900px; margin: 0 auto; background: #fff; padding: 30px;
  border-radius: 10px; box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* Standard: alles, was Sichtbarkeitsregeln hat, ist zunächst unsichtbar,
   BIS das JS evaluiert hat und die Klasse .js-enabled setzt */
body:not(.js-enabled) .section[data-visible-if],
body:not(.js-enabled) .form-group[data-visible-if] {
  display: none !important;
}

/* von JS verwendete Utility-Klasse */
.hidden { display: none !important; }


/* Überschriften */
h1 { color: var(--c); border-bottom: 3px solid var(--c); padding-bottom: 10px; margin-top: 0; }
.section { margin: 25px 0; padding: 15px; border: 1px dashed #bcd; border-radius: 8px; }
.section h3 { margin: 0 0 10px; color: #1a5a9c; }

/* Info-Box */
.info-box {
  background: #e8f4fc; border-left: 4px solid var(--c); padding: 15px; margin: 20px 0; border-radius: 4px;
}

/* Formular-Gruppen */
.form-group {
  margin-bottom: 18px; padding: 15px;
  border: 1px solid #e8ecf1; border-radius: 6px; background-color: #fdfdfd;
}

label { display:block; font-weight:600; margin-bottom:8px; color:#555; }

/* Eingaben */
input[type="text"], input[type="email"], input[type="number"], input[type="date"],
input[type="tel"], input[type="url"], input[type="password"], input[type="color"],
input[type="time"], input[type="datetime-local"], input[type="month"], input[type="week"],
select, textarea {
  width:100%; padding:12px 15px; border:2px solid #ddd; border-radius:6px; font-size:16px; transition:border 0.3s;
}
textarea { min-height: 100px; resize: vertical; }
input:focus, select:focus, textarea:focus {
  border-color: var(--c); outline:none; box-shadow:0 0 0 3px rgba(46,117,182,0.1);
}

.required { color:#e74c3c; }

/* Button */
.btn-submit,
.btn.btn-primary {
  background: linear-gradient(135deg, var(--c), #1a5a9c);
  color:#fff; padding:15px 30px; border:none; border-radius:6px;
  font-size:18px; font-weight:600; cursor:pointer; width:100%;
  transition: transform .2s, box-shadow .2s;
}
.btn-submit:hover,
.btn.btn-primary:hover {
  transform: translateY(-2px); box-shadow: 0 5px 15px rgba(46,117,182,.3);
}

/* Footer */
.footer { text-align:center; margin-top:40px; padding-top:20px; border-top:1px solid #eee; color:#777; font-size:14px; }

.hidden { display:none; }

/* Choices (Radio/Tag-ähnliche Optionen) */
.choices { display:flex; flex-wrap: wrap; gap: 8px 16px; }
.choices .choice-item {
  display:flex; align-items:center; gap:6px; padding: 8px 12px;
  border: 1px solid #e0e0e0; border-radius: 4px; background: #f8f9fa;
}

/* Zustimmungs-/Hilfetexte */
.agreement-text {
  margin-bottom: 20px; padding: 15px;
  border: 1px solid #e8ecf1; border-radius: 6px; background-color: #f8fafd;
}
.agreement-text p { margin: 10px 0; }
.select-search { margin-bottom: 8px; }
.help-text a { color: var(--c); text-decoration: underline; }
.help-text a:hover { text-decoration: none; }

/* (Optional) Spezifische Wrapper-Klassen deiner Views angleichen */
.com-bewerbung-form h2,
.com-bewerbung-vorabfrage h2 { margin-bottom: 1rem; }
