/* Block 51 - der erste Abschnitt der Datenseite unter der Alternativ-Adresse.
 *
 * Angelegt 2026-08-10 nach IZ-Kompass/3_Architekturplan_Kaufstrecke.md,
 * Abschnitt 5a, Block 51. Markup: inc/kauf-daten-seite.php.
 *
 * KEIN HEX-LITERAL, KEINE PX-SCHRIFTGROESSE, KEIN !important, KEIN RADIUS
 * AUSSER 4px/3px/50%. Jeder Wert kommt aus css/iz-tokens.css
 * (Gestaltungskatalog, Regel 13).
 *
 * DIESE DATEI IST BEWUSST KLEIN. Sie wiederholt keine Eigenschaft, die
 * bereits in einem Bauteil steht:
 *   - Die Felder gestaltet Bauteil 01 (01-feld.css), einschliesslich des
 *     sichtbaren Fokus. Am 2026-08-10 auf /daten-neu/ nachgemessen:
 *     .iz-kauf-formular input:focus-visible traegt outline 2px in
 *     var(--iz-rot). Hier steht dazu NICHTS - eine zweite Fokusregel waere
 *     genau der Flicken, den Regel 1 verbietet.
 *   - Das Raster der Feldpaare kommt aus Bauteil 02 und dem Parent-Theme.
 *     Block 21 hat am 2026-08-09 gemessen und begruendet, warum hier KEIN
 *     zweites Raster daruebergelegt wird (css/kauf/21-daten.css, Dateikopf).
 *   - Die Schrittanzeige bringt ihre Gestaltung aus Bauteil 06 mit.
 *
 * ================================================================
 * 1. DER ABSTAND UEBER DER EIGENEN SCHRITTANZEIGE
 * ================================================================
 * ANLASS, gemessen am 2026-08-10 ueber die Regelherkunft im Browser:
 * .iz-kauf-schritte bekommt auf /daten-neu/ ein margin-top von 24px aus
 * css/kauf/11-warenkorb.css - dem Stylesheet des WARENKORB-Blocks 11. Alle
 * Bauteil-Stylesheets werden auf jeder Ausgabeort-Seite geliefert, also
 * auch hier. Der Dateikopf von 11-warenkorb.css sagt selbst, warum das so
 * nicht bleiben soll:
 *   "Hier steht nur der Abstand zwischen beiden - und der gehoert nicht in
 *    Bauteil 06, weil derselbe Abstand auf der Kasse anders ausfaellt."
 * Genau dieser Fall ist jetzt eingetreten. Der Wert wird hier fuer die
 * Kasse gesetzt, statt sich auf eine Warenkorb-Datei zu verlassen.
 *
 * WARUM 0 UND NICHT 24px: Auf dem Warenkorb steht die Anzeige unter der
 * <h1> und braucht Luft. Auf der Kasse steht sie unter den Meldungen bzw. -
 * in der Bauphase - unter der fremden Schrittleiste, die ihrerseits 20px
 * Abstand nach unten haelt (gemessen). Ein zweiter Abstand darueber
 * verdoppelt den Zwischenraum.
 *
 * WARUM DER SCHALTER .woocommerce-checkout UND KEINE SEITEN-ID:
 * 11_IZ_Umschaltliste.md, Punkt 2 der acht Orte - an einer im Code
 * verdrahteten Seiten-ID ist der Aboseiten-Umbau gescheitert. Die
 * Koerperklasse woocommerce-checkout setzt WooCommerce selbst
 * (wc_body_class an is_checkout()); sie steht auf /daten-neu/ heute und auf
 * /daten/ nach dem Livegang, auf dem Warenkorb dagegen nicht. Am
 * 2026-08-10 am gelieferten HTML gegengeprueft.
 */

.woocommerce-checkout .iz-kauf-schritte {
	margin-top: 0;
}

/*
 * ================================================================
 * 2. DER ANKER DES RUECKSPRUNGS - Paragraf 312i Abs. 1 Nr. 1 BGB
 * ================================================================
 * ANLASS, gemessen am 2026-08-10: Der Verweis "Bearbeiten" der
 * Angaben-Uebersicht und der zweite Eintrag der Schrittleiste zeigen beide
 * auf "#step-address". Ein Element mit dieser Kennung gab es auf der Seite
 * NICHT - ohne JavaScript sprang der Ruecksprung an den Seitenanfang.
 * inc/kauf-daten-seite.php setzt den Anker jetzt vor den Feldbereich.
 *
 * Er darf nichts an der Anordnung aendern. display:block mit Hoehe 0 statt
 * eines leeren inline-Elements: Ein inline-Element erzeugt in einer
 * Flex- oder Rasterhuelle ein eigenes Element und in einer Blockhuelle
 * gegebenenfalls eine Zeilenbox. Heute ist .iz-kauf-formular ein Block und
 * der Anker misst 0x0 (gemessen); diese Regel haelt das auch dann, wenn
 * ein spaeterer Block die Huelle umstellt.
 *
 * scroll-margin-top: Ohne ihn landet nach dem Sprung die Beschriftung des
 * ersten Feldes buendig an der Fensterkante.
 */
.iz-kauf-anker {
	display: block;
	width: 0;
	height: 0;
	overflow: hidden;
	scroll-margin-top: var(--sp-8);
}

/*
 * ================================================================
 * 3. DER EIGENE WEITER-KNOPF - gebaut, in dieser Bauphase AUS
 * ================================================================
 * Dieselbe Lage wie bei Bauteil 02 am 2026-08-09: Das Markup steht
 * (inc/kauf-daten-seite.php, iz_kauf_daten_eigener_weiter), ist aber ueber
 * den Filter iz_kauf_daten_eigener_weiter voreingestellt AUS. Begruendung
 * im Dateikopf jener Datei - kurz: Solange der Abschnittswechsel ueber
 * Germanized laeuft, waere ein zweiter Knopf im selben form.checkout
 * entweder wirkungslos oder ein zweiter Weg, eine echte Bestellung
 * auszuloesen. Er gehoert in Block 52.
 *
 * Die Gestaltung steht trotzdem hier, nach demselben Muster, mit dem
 * iz_kauf_bauteile() schon 01-feld.css und 02-formular.css ausliefert,
 * bevor ihre PHP-Seite eingeschaltet ist: damit der Knopf beim Einschalten
 * sofort richtig aussieht und niemand spaeter eine zweite Fassung baut.
 *
 * Die Knopfform selbst kommt aus Bauteil 07 (.iz-kauf-knopf); hier steht
 * nur die Anordnung im Abschnitt.
 */
.iz-kauf-daten-weiter {
	display: flex;
	justify-content: flex-end;
	margin: var(--sp-6) 0 0;
}

/* Auf schmalen Geraeten ueber die volle Breite, damit die Trefflaeche nicht
 * von der Textlaenge abhaengt (Gestaltungskatalog Abschnitt 6: mindestens
 * 44x44px).
 *
 * NICHT VERIFIZIERT: Der Testbrowser erzeugt in dieser Arbeitsumgebung
 * nachweislich keine Breiten unter etwa 825px. Diese Regel ist am Geraet zu
 * pruefen (Regel 14). Die Grenze ist dieselbe wie in Bauteil 06. */
@media (max-width: 600px) {
	.iz-kauf-daten-weiter {
		justify-content: stretch;
	}

	.iz-kauf-daten-weiter__knopf {
		width: 100%;
		min-height: var(--sp-12);
	}
}
