/* Kundenkonto. Farben und Formen aus seite.css (docs/gestaltung.md), Felder wie beim Kündigungsformular. */

.konto-form { display: grid; gap: 22px; }
.konto-form .feld { display: grid; gap: 8px; font-weight: 700; }
.konto-form input[type=text], .konto-form input[type=email], .konto-form input[type=password], .konto-form input[type=tel] {
  font: inherit; font-weight: 400; color: var(--dunkel); width: 100%;
  min-height: 56px; padding: 12px 16px;
  border: 1.5px solid #bfa996; border-radius: 16px; background: #fff;
}
.konto-form textarea { font: inherit; font-weight: 400; color: var(--dunkel); width: 100%; min-height: 130px; padding: 12px 16px;
  border: 1.5px solid #bfa996; border-radius: 16px; background: #fff; resize: vertical; }
.konto-form textarea:focus { outline: 3px solid var(--leuchten); outline-offset: 1px; }
.leise-zusatz { font-weight: 400; }
.konto-form input:focus { outline: 3px solid var(--leuchten); outline-offset: 1px; }
.konto-form [aria-invalid="true"] { border-color: #a8321f; }
.konto-form .knopf { width: 100%; font: inherit; font-weight: 700; cursor: pointer; }
.konto-form .anzeigen { margin-top: -12px; }

.fehler-kasten { padding: 14px 16px; border-radius: 18px; border: 2px solid #a8321f; color: #a8321f; font-weight: 700; margin-bottom: 20px; }
.abschnitt > .hinweis { margin-bottom: 20px; }
.nach-form { margin-top: 18px; }
.gross-text { font-size: 20px; line-height: 1.4; }
.abstand-oben { margin-top: 12px; }
.abstand-gross { margin-top: 36px; }
.breit { width: 100%; font: inherit; font-weight: 700; cursor: pointer; }
button.knopf.umriss { background: none; }

/* Mehr Luft zwischen den Teilen der Kontoseite (Termine, Telefonnummer, Mitschriften), statt 48 px aus seite.css */
.abschnitt + .abschnitt { padding-top: 60px; }

.termin-liste { list-style: none; padding: 0; display: grid; gap: 14px; }
.termin-zeit { font-family: var(--titel); font-weight: 800; font-size: 22px; line-height: 1.2; margin-bottom: 4px; }
.leise-liste { gap: 10px; font-size: 17px; }

/* Telefonnummer und Mitschriften */
/* Seite „Telefonnummer bestätigen“: mehr Luft zwischen Hinweis, Feld, Knopf und Link */
.telefon-seite .konto-form { gap: 28px; }
.telefon-seite .nach-form { margin-top: 28px; }
.vor-form { margin-bottom: 28px; }
.code-feld { font-size: 28px !important; letter-spacing: .3em; text-align: center; }
.mitschrift summary { cursor: pointer; font-weight: 700; min-height: 44px; display: flex; align-items: center; }
.mitschrift-text { white-space: pre-line; margin-top: 8px; font-size: 17px; }

/* Gutschein-Bestellung: Geschenkbox. Die Adressfelder erscheinen erst mit dem Haken. */
.box-teil { display: grid; gap: 18px; padding: 18px; border-radius: 18px; background: var(--flaeche); }
.box-teil .wahl { font-weight: 700; }
.box-teil fieldset .wahl { font-weight: 400; }
.nur-box { display: grid; gap: 18px; }
.konto-form:not(:has([name=geschenkbox]:checked)) .nur-box { display: none; }
.box-teil fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: 6px; }
.box-teil legend { font-weight: 700; margin-bottom: 6px; padding: 0; }
.plz-ort { display: grid; grid-template-columns: 7.5em 1fr; gap: 12px; }

/* Enkel-Telefon im Konto und beim Bestellen */
.enkel-karte { display: grid; gap: 4px; }
.minuten-balken { height: 10px; border-radius: 999px; background: var(--flaeche); overflow: hidden; margin: 6px 0 14px; }
.minuten-balken span { display: block; height: 100%; background: var(--leuchten); border-radius: 999px; }
.enkel-titel { font-weight: 700; margin-top: 8px; }
.enkel-nummern { list-style: none; padding: 0; display: grid; gap: 8px; }
.enkel-nummern li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1.5px solid var(--linie); }
.text-knopf { font: inherit; font-size: 17px; color: var(--dunkel); background: none; border: 0; padding: 6px 0; text-decoration: underline; cursor: pointer; }
.nummer-neu summary { cursor: pointer; font-weight: 700; padding: 10px 0; }
.nummer-block { border: 0; padding: 0; margin: 0; display: grid; gap: 17px; }
.nummer-block legend { font-family: var(--titel); font-weight: 800; font-size: 21px; margin-bottom: 8px; padding: 0; }
.nummer-block.weitere { padding-top: 28px; border-top: 1.5px solid var(--linie); }
/* Enkel-Telefon bestellen: mehr Luft als auf den Kontoseiten (Kolja, 20.10.2026) */
.enkel-form { gap: 22px; }
.enkel-form > button[type=submit] { margin-top: 16px; }  /* „Weiter zur Kasse“ abgesetzt */
.nummer-block[hidden] { display: none; }
/* „Weitere Nummer hinzufügen“ als Textlink, damit „Weiter zur Kasse“ der eine große Knopf bleibt (Kolja, 20.10.2026) */
.weitere-nummer { justify-self: start; font: inherit; font-weight: 700; color: var(--dunkel); cursor: pointer;
  background: none; border: 0; padding: 6px 0; text-decoration: underline; text-underline-offset: 3px; }
.weitere-nummer span { font-size: 1.25em; margin-right: 4px; }
.konto-form select { font: inherit; font-weight: 400; color: var(--dunkel); width: 100%; min-height: 56px; padding: 12px 16px;
  border: 1.5px solid #bfa996; border-radius: 16px; background: #fff; }

/* Anmelden: „Konto anlegen“ als großer Knopf, abgesetzt unter dem Formular */
.neu-hier { margin-top: 36px; padding-top: 28px; border-top: 1.5px solid var(--linie); display: grid; gap: 12px; }
.neu-frage { font-family: var(--titel); font-weight: 800; font-size: 22px; }
.weitere-nummer[hidden] { display: none; }