/* Meldeformular · Block „melde__*“ und „tafel__*“
   Eine Fläche (helles Grün) mit weißen Feldern, Schrift schwarz. Grund und Innenabstand lassen sich von außen
   setzen: --tafel-grund und --tafel-abstand (das Theme legt die Tafel damit in seine Karte). */
.tafel{
  --grund:#f6fff0; --hinterlegt:#dee5d9; --feld:#fff;
  --linie:#b5c2ae; --linie-stark:#657a63;
  --text-1:#000; --text-2:#000; --text-3:#000;
  --aktiv:#4a6e2f; --aktiv-dunkel:#3a5824; --pflicht:#c42700; --fokus:#c42700;
  --klaer:#836b2a; --klaer-hell:#f6efdc; --flaeche:#eef1ea;
  --radius:6px;
  container-type:inline-size;
  border-radius:var(--radius);background:var(--tafel-grund,var(--grund));
  color:var(--text-1);font-size:17px;line-height:1.5;
}
.tafel *{box-sizing:border-box}
.tafel__fahne{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  padding:var(--tafel-abstand,24px) var(--tafel-abstand,24px) 0;font-size:14px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.tafel__hinweis{font-weight:400;letter-spacing:0;text-transform:none;color:var(--text-3)}
.tafel__koerper{padding:var(--tafel-abstand,24px)}
.tafel__fahne + .tafel__koerper{padding-top:16px}

/* Gruppen: immer sechs Spalten. Schmal füllt eine Zeile alle sechs, breit die Hälfte (--halb) */
.melde__gruppe{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px 16px;margin:0 0 28px;padding:0;border:none}
.melde__gruppe:last-child{margin-bottom:0}
.melde__titel{grid-column:1 / -1;margin:0;padding:0 0 6px;border-bottom:1px solid var(--linie);
  font-family:inherit;font-size:14px;font-weight:700;line-height:1.3;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text-1)}
.melde__zeile{grid-column:1 / -1;min-width:0}
.melde__gruppe > .melde__notiz{grid-column:1 / -1;margin:-6px 0 0}
@container (min-width:540px){
  .melde__zeile{grid-column:span 3}
}
.melde__zeile--drittel{grid-column:span 2}
.melde__zeile--zweidrittel{grid-column:span 4}
.melde__zeile--voll{grid-column:1 / -1}
.melde__zeile--bedingt{padding:14px 16px;background:rgba(74,110,47,.1);border-left:4px solid var(--aktiv);
  border-radius:0 var(--radius) var(--radius) 0}
/* Zugang und Adresse erscheinen zusammen: eine durchgehende Fläche statt zweier Kästen */
.melde__zeile--bedingt:has(+ .melde__zeile--bedingt:not(.melde__zeile--aus)){border-bottom-right-radius:0;padding-bottom:6px}
.melde__zeile--bedingt:not(.melde__zeile--aus) + .melde__zeile--bedingt{margin-top:-14px;border-top-right-radius:0;padding-top:6px}
.melde__zeile--adresse{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.melde__zeile--adresse > .melde__zeile,
.melde__zeile--adresse > .melde__notiz{grid-column:1 / -1}
.melde__zeile--adresse > .melde__notiz{margin:-6px 0 0}
@container (min-width:540px){
  .melde__zeile--adresse > .melde__zeile--zweidrittel{grid-column:span 4}
  .melde__zeile--adresse > .melde__zeile--drittel{grid-column:span 2}
}
.melde__zeile--aus{display:none}

.melde__legende{margin:0 0 20px;font-size:15px;color:var(--text-2)}
.melde__stern{color:var(--pflicht);font-weight:700}
.melde__zeile--pflicht > .melde__label b::after,
.melde__haken--pflicht > span::after{content:" *";color:var(--pflicht);font-weight:700}

.melde__label{display:block;margin:0 0 6px;font-size:16px;font-weight:600;line-height:1.35;color:var(--text-1)}
.melde__label b{font-weight:600}
.melde__zusatz{display:block;font-size:14px;font-weight:400;line-height:1.35;color:var(--text-3)}
.melde__zeile--voll > .melde__label .melde__zusatz{display:inline;margin-left:.4em}

.melde__feld{display:block;width:100%;min-height:50px;padding:0 14px;border:1px solid var(--linie-stark);
  border-radius:var(--radius);background:var(--feld);font-family:inherit;font-size:17px;line-height:1.3;color:var(--text-1)}
.melde__feld::placeholder{color:#667469;opacity:1}
.melde__feld:hover{border-color:var(--text-1)}
.melde__feld:focus{outline:none;border-color:var(--fokus)}
.melde__feld:disabled{background:var(--flaeche);border-color:var(--linie);color:#6b776e;cursor:not-allowed}
select.melde__feld{padding-right:44px;cursor:pointer;appearance:none;
  background:var(--feld) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M2 2l6 6 6-6' fill='none' stroke='%2324382c' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 16px center}
select.melde__feld:disabled{background-color:var(--flaeche);cursor:not-allowed}
.melde__feld--gross{min-height:5.5rem;padding:12px 14px;resize:vertical}

/* Ja/Nein als zwei große Tasten */
.melde__wahl{display:flex;flex-wrap:wrap;gap:12px}
.melde__wahl label{display:flex;align-items:center;gap:10px;min-width:112px;min-height:50px;padding:0 18px;
  border:1px solid var(--linie-stark);border-radius:var(--radius);background:var(--feld);
  font-size:17px;font-weight:600;color:var(--text-1);cursor:pointer}
.melde__wahl label:has(input:checked){border-color:var(--aktiv-dunkel);background:var(--aktiv-dunkel);color:#fff}
.melde__wahl label:has(input:focus-visible),
.melde__haken:has(input:focus-visible){border-color:var(--fokus)}
.melde__wahl input,.melde__haken input{flex:0 0 auto;width:22px;height:22px;margin:0;accent-color:var(--aktiv)}
.melde__wahl label:has(input:checked) input{accent-color:#fff}

.melde__notiz{margin:5px 0 0;font-size:14px;line-height:1.45;color:var(--text-3)}
.melde__upload{padding:12px;border:1px dashed var(--linie-stark);border-radius:var(--radius);
  background:var(--feld);font-size:15px;color:var(--text-2)}
.melde__upload input{display:block;width:100%;font-family:inherit;font-size:14px}
.melde__upload input::file-selector-button{margin-right:10px;padding:9px 14px;border:1px solid var(--aktiv-dunkel);
  border-radius:var(--radius);background:var(--feld);font-family:inherit;font-size:14px;font-weight:600;
  color:var(--aktiv-dunkel);cursor:pointer}
.melde__upload input::file-selector-button:hover{background:var(--aktiv-dunkel);color:#fff}
.melde__dateien{list-style:none;margin:0;padding:0;color:var(--text-2)}
.melde__dateien:not(:empty){margin-top:10px}
.melde__dateien li{padding:6px 0;border-top:1px solid var(--linie);font-size:14px}

/* Freiwillige Angaben: farbig hinterlegt, damit sie vom Pflichtteil abgesetzt sind */
.melde__gruppe--frei{padding:16px;border-radius:var(--radius);background:var(--hinterlegt)}
.melde__gruppe--frei .melde__titel{border-bottom-color:var(--linie-stark)}

/* Abschluss: Einwilligungen als antippbare Kästen, darunter der Knopf */
.melde__gruppe--abschluss{gap:10px;margin-top:4px}
.melde__gruppe--abschluss > *{grid-column:1 / -1}
.melde__haken{display:flex;gap:14px;align-items:flex-start;padding:12px 14px;border:1px solid var(--linie-stark);
  border-radius:var(--radius);background:var(--feld);font-size:15px;line-height:1.45;color:var(--text-2);cursor:pointer}
.melde__haken input{margin-top:1px}
.melde__haken--aus{display:none}
/* Einklappbare Infotexte unter den Haken */
.melde__info{margin:-4px 0 4px;font-size:14px;line-height:1.5;color:var(--text-3)}
.melde__info summary{padding:4px 2px;font-weight:600;color:var(--text-2);cursor:pointer}
.melde__info-text{padding:8px 14px 2px;border-left:3px solid var(--linie-stark)}
.melde__info-text p{margin:0 0 10px}
.melde__haken--aus + .melde__info{display:none}
.melde__haken a{color:inherit;text-decoration:underline}
.melde__knopf{display:inline-block;min-height:54px;margin-top:6px;padding:0 32px;border:none;border-radius:var(--radius);
  background:var(--aktiv);box-shadow:0 3px 0 var(--aktiv-dunkel);font-family:inherit;font-size:18px;font-weight:600;
  color:#fff;cursor:pointer}
.melde__knopf:hover{background:var(--aktiv-dunkel);box-shadow:0 3px 0 #2f4a1c}
.melde__knopf:focus-visible{outline:1px solid var(--fokus);outline-offset:2px}
.melde__knopf:active{transform:translateY(2px);box-shadow:0 1px 0 var(--aktiv-dunkel)}
.melde__knopf:disabled{background:var(--linie-stark);box-shadow:none;cursor:wait}
form.melde .melde__knopf{width:100%}

.melde__fehler{margin:0 0 20px;padding:14px 16px;border:1px solid var(--pflicht);border-radius:var(--radius);
  background:#fff;font-size:16px;font-weight:600;color:#8a1f00}
.melde__fehler--aus{display:none}
.melde__falle{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.melde__erfolg{padding:16px 18px;border-left:4px solid var(--aktiv);background:rgba(255,255,255,.7);
  border-radius:0 var(--radius) var(--radius) 0;color:var(--text-2)}
.melde__erfolg b{display:block;margin-bottom:6px;font-size:19px;font-weight:600;color:var(--text-1)}
.melde__erfolg p{margin:0;font-size:16px}