/* ==========================================================================
   HUMAN IN BUSINESS Forms
   Formular-CSS, 1:1 aus messe-landingpage.html übernommen.

   Alle Regeln hängen an .hibm bzw. .hibm__* und sind identisch mit denen der
   Landingpage. Sind beide geladen (Codeblock + Plugin), überschreiben sie sich
   gegenseitig mit demselben Wert — es ändert sich nichts.

   Neu hinzugekommen sind nur die Zustände, die es im statischen HTML noch nicht
   gab: Fehlermeldung, Feldmarkierung, Ladezustand, Erfolgs-Panel.
   ========================================================================== */

.hibm {
  --gruen:#004225;
  --gruen-2:#0F5A4B;
  --gruen-tief:#00301B;
  --gold:#D6A629;
  --gold-dunkel:#B88C18;
  --beige:#C0B393;
  --beige-hell:#EFE9DC;
  --offwhite:#FBFAF7;
  --weiss:#fff;
  --text:#303030;
  --leise:#5E5E5E;
  --linie:#E2DED4;
  --rot:#8A1C1C;
  --rot-hell:#FBF3F3;
  --r:4px;

  font-family:inherit;
  color:var(--text);
  line-height:1.65;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
}
.hibm *,.hibm *::before,.hibm *::after{box-sizing:border-box}
.hibm h3{margin:0 0 .7em;line-height:1.15;letter-spacing:-.02em;font-weight:400;font-style:normal;color:var(--gruen);font-size:1.15rem}
.hibm p{margin:0 0 1rem}
.hibm p:last-child{margin-bottom:0}
.hibm a:not(.hibm__btn){color:var(--gruen)}

/* --- Buttons -------------------------------------------------------------
   Button-Farben mit !important — bewusst. Avada setzt Linkfarben über
   hochspezifische Selektoren (teils mit ID, z. B. #main a), die jede
   Klassenregel schlagen. Ohne !important wäre die Schrift auf dem grünen
   Button grün auf grün, also unsichtbar. Betrifft nur color und background. */
.hibm__btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:15px 28px;border-radius:var(--r);font-weight:650;font-size:.97rem;
  text-decoration:none;border:2px solid transparent;cursor:pointer;
  transition:background .15s,color .15s,border-color .15s;line-height:1.2;
}
.hibm .hibm__btn--gruen,
.hibm a.hibm__btn--gruen,
.hibm button.hibm__btn--gruen{background:var(--gruen) !important;color:#fff !important}
.hibm .hibm__btn--gruen:hover,
.hibm a.hibm__btn--gruen:hover,
.hibm button.hibm__btn--gruen:hover{background:var(--gruen-tief) !important;color:#fff !important}
.hibm__btnzeile{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

/* --- Formular ------------------------------------------------------------ */
.hibm__form-karte{
  background:var(--weiss);border:1px solid var(--linie);border-radius:var(--r);
  padding:32px;box-shadow:0 2px 18px rgba(0,66,37,.06);
}
@media(min-width:900px){.hibm__form-karte{padding:44px}}
.hibm__feldgrid{display:grid;gap:18px}
@media(min-width:640px){.hibm__feldgrid--2{grid-template-columns:repeat(2,1fr)}}
.hibm__feld{display:flex;flex-direction:column;gap:7px}
.hibm__feld label{font-size:.85rem;font-weight:650;color:var(--gruen)}
.hibm__feld label .hibm__opt{font-weight:400;color:var(--leise)}
.hibm__feld input[type=text],
.hibm__feld input[type=email],
.hibm__feld input[type=tel],
.hibm__feld select,
.hibm__feld textarea{
  width:100%;padding:12px 14px;border:1px solid var(--linie);border-radius:var(--r);
  font-size:.97rem;font-family:inherit;color:var(--text);background:var(--offwhite);
  transition:border-color .15s,background .15s;
}
.hibm__feld input:focus,.hibm__feld select:focus,.hibm__feld textarea:focus{
  outline:0;border-color:var(--gruen);background:#fff;
}
.hibm__feld textarea{resize:vertical;min-height:110px}

.hibm__tagwahl{display:grid;gap:10px}
@media(min-width:640px){.hibm__tagwahl{grid-template-columns:repeat(3,1fr)}}
.hibm__tagwahl label{
  display:block;border:1.5px solid var(--linie);border-radius:var(--r);
  padding:14px;cursor:pointer;background:var(--offwhite);transition:all .15s;font-weight:600;
}
.hibm__tagwahl label:hover{border-color:var(--beige)}
.hibm__tagwahl input{position:absolute;opacity:0;width:0;height:0}
.hibm__tagwahl input:checked + .hibm__tagwahl-inner{color:var(--gruen)}
.hibm__tagwahl label:has(input:checked){border-color:var(--gruen);background:#fff;box-shadow:inset 0 0 0 1px var(--gruen)}
/* Fallback für Browser ohne :has() — die Klasse setzt das JS. */
.hibm__tagwahl label.is-gewaehlt{border-color:var(--gruen);background:#fff;box-shadow:inset 0 0 0 1px var(--gruen)}
.hibm__tagwahl input:focus-visible + .hibm__tagwahl-inner{outline:2px solid var(--gruen);outline-offset:4px}
.hibm__tagwahl-tag{font-size:.7rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--gold-dunkel);display:block;margin-bottom:3px}
.hibm__tagwahl-datum{font-size:1rem;font-weight:650;color:var(--gruen);display:block}

.hibm__checkzeile{display:flex;gap:11px;align-items:flex-start;font-size:.9rem;color:var(--leise);line-height:1.5}
.hibm__checkzeile input{margin-top:4px;flex:none;width:17px;height:17px;accent-color:var(--gruen)}
.hibm__checkzeile--hebel{
  background:var(--beige-hell);border-radius:var(--r);padding:16px 18px;
  color:var(--text);font-weight:600;font-size:.95rem;
}
.hibm__trenner{height:1px;background:var(--linie);margin:28px 0}
.hibm__pflicht{font-size:.8rem;color:var(--leise);margin-top:16px}

/* --- Zustände (neu) ------------------------------------------------------ */
.hibm__fehler{
  margin-top:18px;padding:13px 16px;border-radius:var(--r);
  background:var(--rot-hell);border:1px solid #E7C9C9;color:var(--rot);
  font-size:.9rem;line-height:1.5;
}
.hibm__feld--fehler input,
.hibm__feld--fehler select,
.hibm__feld--fehler textarea{border-color:var(--rot);background:var(--rot-hell)}
.hibm__feld-hinweis{font-size:.78rem;color:var(--rot)}
.hibm__checkzeile.hibm__checkzeile--fehler{color:var(--rot)}
.hibm__checkzeile.hibm__checkzeile--fehler input{outline:2px solid var(--rot);outline-offset:2px}

.hibm [data-hibf-form].is-sendet{opacity:.6;pointer-events:none}
.hibm [data-hibf-submit][disabled]{cursor:progress;opacity:.75}

.hibm__erfolg{
  border-left:3px solid var(--gold);padding:6px 0 6px 20px;
}
.hibm__erfolg h3{margin-bottom:8px}
.hibm__erfolg p{font-size:.96rem;color:var(--leise)}