/*
 * K19 Kontakt-Formular (build/sections/k19_contact_form.py) und Optik des Plugin-Formulars prixo/form
 * (Klassen-Vertrag: plugin/prixo-blocks/README.md; das Plugin liefert nur Struktur).
 * Live-Werte (Elementor-Formular bb955ea / efe863d, gemessen 24.09.): Beschriftung Outfit 16/30 400 Navy,
 * Pflicht-Stern rot (Abstand 0.2em), Felder weiss, Rand 1 px Navy, Radius 17, Padding 6/16, Höhe 47,
 * Text 16/30 500 Navy, Platzhalter Navy 60 %, Nachricht 4 Zeilen (134 px), Spalten 50 % mit 10 px Gasse,
 * Zeilenabstand 10, Zustimmung 16/30 mit unterstrichenem Link, Button «Senden» Navy/Lime, Radius 99,
 * 15/15 px, Padding 17/40, Chevron 15 px (5 px Abstand). Mobile: Felder 100 % (Plugin).
 * Nachmessung 24.09. (F1, live 1440/1024/390): Button-Hover Schrift + Chevron Lime → Weiss (0.3 s, Hintergrund
 * bleibt Navy, Cursor default); Auswahlfeld in Beschriftungsgrösse (16/30, T 15/28.125, M 14/26.25), Padding
 * rechts 20, Pfeile Elementor-«caret-down» + UiCore-Winkel (siehe Auswahlfeld); Checkbox 13 × 30
 * (Glyphe mittig) oben bündig zur ersten Textzeile; Zustimmung ohne Pflicht-Stern.
 */

/* ---- Abschnitt ---------------------------------------------------------------------------------- */

.prixo-sec--contact-form .prixo-contact-form__columns > .wp-block-column {
	align-self: flex-start;
}

.prixo-contact-form__address {
	width: 70%;
}

@media (max-width: 767px) {
	.prixo-contact-form__address {
		width: 100%;
	}
}

/* Tracker: Trennlinie volle Breite unter dem Formularblock (live Divider 18296bb, 1 px, Elementor-Standardfarbe) */
.prixo-sec--contact-form .prixo-contact-form__divider {
	height: 0;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--black);
	opacity: 1;
}

/* Mobile: live 20 px vom Bildschirmrand, unabhängig vom Seitenrand (Root-Padding) des Abschnitts */
@media (max-width: 767px) {
	.prixo-sec--contact-form .prixo-contact-form__divider.alignfull {
		margin-left: calc(20px - var(--wp--style--root--padding-left, 0px)) !important;
		margin-right: calc(20px - var(--wp--style--root--padding-right, 0px)) !important;
		width: auto;
	}
}

/* ---- Formular ----------------------------------------------------------------------------------- */

.prixo-form {
	font-family: var(--wp--preset--font-family--outfit);
	color: var(--wp--preset--color--navy);
}

/* Feldgruppe wie Elementor (.elementor-field-group: flex, umbrechend, mittig; Kinder 100 %): bricht eine
   Beschriftung um, verteilen sich Beschriftung und Feld in der Zeile wie live */
.prixo-form .prixo-field:not(.prixo-field--acceptance) {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
}

.prixo-form .prixo-field:not(.prixo-field--acceptance) > * {
	flex-basis: 100%;
	max-width: 100%;
}

.prixo-form .prixo-field__label {
	margin: 0;
	font-size: var(--prixo-body-size);
	font-weight: 400;
	line-height: 1.875;
	color: var(--wp--preset--color--navy);
}

.prixo-form .prixo-field__required {
	padding-left: 0.2em;
	color: var(--wp--preset--color--form-required);
}

/* live steht vor dem Stern ein Leerzeichen (Umbruchstelle wie Elementor) */
.prixo-form .prixo-field__required::before {
	content: " ";
}

.prixo-form .prixo-field__input {
	min-height: 47px;
	margin: 0;
	padding: 6px 16px;
	border: 1px solid var(--wp--preset--color--navy);
	border-radius: 17px;
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--navy);
	font-family: inherit;
	font-size: 16px;
	font-weight: 500;
	line-height: 30px;
	box-shadow: none;
	outline: 0;
	appearance: none;
	-webkit-appearance: none;
}

/* Auswahlfeld: Schrift wie die Beschriftung (live 16/30, T 15, M 14). Live liegen zwei Pfeile übereinander:
   Elementor-«caret-down» (Dreieck 11 × 6.2, 10 px vom rechten Rand, 23.4 px von oben, SVG ragt über seine viewBox
   hinaus) und der dünne UiCore-Winkel (Hintergrund der UiCore-Regel «select», 37 × 4 auf 50 px skaliert, rechts
   mittig, #343352). Beide hier als Hintergrundebenen. */
.prixo-form select.prixo-field__input {
	padding-right: 20px;
	font-size: var(--prixo-body-size);
	line-height: 1.875;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 357 571.4 322'%3E%3Cpath fill='%231B2944' d='M571 393Q571 407 561 418L311 668Q300 679 286 679T261 668L11 418Q0 407 0 393T11 368 36 357H536Q550 357 561 368T571 393Z'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37' height='4' viewBox='0 0 37 4'%3E%3Cpath fill='%23343352' transform='translate(15 0)' d='M3.80389222,3.872 L6.8742515,0.757333333 C7.04191617,0.576 7.04191617,0.298666667 6.8742515,0.128 C6.70658683,-0.0426666667 6.42365269,-0.0426666667 6.25598802,0.128 L3.5,2.93333333 L0.744011976,0.128 C0.565868263,-0.0426666667 0.293413174,-0.0426666667 0.125748503,0.128 C-0.0419161677,0.298666667 -0.0419161677,0.576 0.125748503,0.757333333 L3.18562874,3.872 C3.36377246,4.04266667 3.63622754,4.04266667 3.80389222,3.872 Z'/%3E%3C/svg%3E");
	background-position: right 10px top 23.4px, 100% 50%;
	background-repeat: no-repeat, no-repeat;
	background-size: 11px 6.2px, 50px auto;
}

.prixo-form textarea.prixo-field__input {
	display: block;
	resize: vertical;
}

.prixo-form .prixo-field__input::placeholder {
	color: var(--wp--preset--color--navy);
	opacity: 0.6;
}

/* Fokus wie Elementor: feiner innerer Schatten statt Umriss */
.prixo-form .prixo-field__input:focus {
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
	outline: 0;
}

.prixo-form .prixo-field__input:focus-visible {
	outline: 2px solid var(--wp--preset--color--navy);
	outline-offset: 2px;
}

/* Zustimmung */
.prixo-form .prixo-field--acceptance {
	min-height: 30px;
	justify-content: center;
}

.prixo-form .prixo-field__option {
	display: flex;
	align-items: flex-start;
	gap: 5px;
	font-size: var(--prixo-body-size);
	font-weight: 500;
	line-height: 1.875;
	color: var(--wp--preset--color--navy);
}

/* live: Checkbox-Box 13 × 30, Glyphe mittig → Mitte der ersten Textzeile (30 px Zeilenhöhe) */
.prixo-form .prixo-field__checkbox {
	width: 13px;
	height: 30px;
	margin: 0;
}

.prixo-form .prixo-field__acceptance-label a {
	color: inherit;
	text-decoration: underline;
}

/* Fehlerzustand (Elementor: Meldung #D9534F) */
.prixo-form .prixo-field.has-error .prixo-field__input {
	border-color: var(--wp--preset--color--form-error);
}

.prixo-form .prixo-field__error {
	margin: 10px 0 0;
	font-size: 1em;
	line-height: 1;
	color: var(--wp--preset--color--form-error);
}

/* Captcha (nur wenn in «prixo Formulare» aktiviert): reCAPTCHA-Badge inline 256 × 60; Turnstile «nur bei Bedarf»
   ohne eigene Höhe */
.prixo-form .prixo-field--captcha-recaptcha {
	min-height: 60px;
}

/* Knopf «Cookie-Einstellungen öffnen» in der Meldung, wenn das Captcha-Skript blockiert ist */
.prixo-form .prixo-form__consent {
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-decoration: underline;
	cursor: pointer;
}

/* Senden-Button (live Elementor-Button: Navy, Text Lime, Radius 99; Hover Text/Chevron weiss) */
.prixo-form .prixo-form__footer {
	margin-top: 10px;
}

.prixo-form .prixo-form__submit.wp-element-button {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 17px 40px;
	border: 0;
	border-radius: 99px;
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--lime);
	font-family: var(--wp--preset--font-family--outfit);
	font-size: 15px;
	font-weight: 500;
	line-height: 15px;
	cursor: default;
	transition: all 0.3s;
}

/* :focus nach Mausklick bleibt Lime (überstimmt die Theme-Regel für .wp-element-button:focus) */
.prixo-form .prixo-form__submit.wp-element-button:focus {
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--lime);
}

.prixo-form .prixo-form__submit.wp-element-button:hover,
.prixo-form .prixo-form__submit.wp-element-button:focus-visible {
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--white);
}

.prixo-form .prixo-form__submit::after {
	content: "";
	flex: none;
	width: 15px;
	height: 15px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.prixo-form.is-submitting .prixo-form__submit {
	opacity: 0.6;
}

/* Meldung unter dem Formular (Elementor .elementor-message: 1em, Zeilenhöhe 1, Abstand 10) */
.prixo-form .prixo-form__message {
	margin: 10px 0;
	font-size: 1em;
	line-height: 1;
}

.prixo-form .prixo-form__message--success {
	color: var(--wp--preset--color--form-success);
}

.prixo-form .prixo-form__message--success::before {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-inline-end: 5px;
	vertical-align: middle;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.prixo-form .prixo-form__message--error {
	color: var(--wp--preset--color--form-error);
}

@media (max-width: 767px) {
	.prixo-form .prixo-form__submit.wp-element-button {
		padding: 13px 35px;
		font-size: 14px;
		line-height: 14px;
	}

	.prixo-form .prixo-form__submit::after {
		width: 14px;
		height: 14px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.prixo-form .prixo-form__submit.wp-element-button {
		transition: none;
	}
}

/* ---- Datei-Feld (prixo/field type «file», seit prixo-blocks 1.2.0) -------------------------------- */

.prixo-form .prixo-field__file {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
}

/* Eigentliches Eingabefeld unsichtbar, aber fokussier- und vorlesbar; bedient wird es über das Label */
.prixo-form .prixo-field__file-input.prixo-field__input {
	position: absolute;
	width: 1px;
	height: 1px;
	min-height: 0;
	padding: 0;
	border: 0;
	opacity: 0;
	overflow: hidden;
	clip-path: inset(50%);
}

.prixo-form .prixo-field__file-button.wp-element-button {
	display: inline-flex;
	align-items: center;
	padding: 12px 26px;
	border: 1px solid var(--wp--preset--color--navy);
	border-radius: 99px;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--navy);
	font-family: var(--wp--preset--font-family--outfit);
	font-size: 14px;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	transition: all 0.3s;
}

.prixo-form .prixo-field__file-button.wp-element-button:hover,
.prixo-form .prixo-field__file-input:focus-visible + .prixo-field__file-button {
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--white);
}

.prixo-form .prixo-field__file-input:focus-visible + .prixo-field__file-button {
	outline: 2px solid var(--wp--preset--color--navy);
	outline-offset: 2px;
}

.prixo-form .prixo-field.has-error .prixo-field__file-button {
	border-color: var(--wp--preset--color--form-error);
}

.prixo-form .prixo-field__file-preview {
	width: 46px;
	height: 46px;
	object-fit: contain;
	border: 1px solid var(--wp--preset--color--card-border);
	border-radius: 8px;
	background: var(--wp--preset--color--white);
}

.prixo-form .prixo-field__file-preview[hidden] {
	display: none;
}

.prixo-form .prixo-field__file-name {
	font-size: 14px;
	color: var(--wp--preset--color--body);
	word-break: break-all;
}

.prixo-form .prixo-field__file-name[hidden] {
	display: none;
}

/* Gewählte Dateien: Vorschau, Name, Papierkorb zum Entfernen (seit prixo-blocks 1.3.1) */
.prixo-form .prixo-field__file-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.prixo-form .prixo-field__file-list[hidden] {
	display: none;
}

.prixo-form .prixo-field__file-item {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 6px 6px 6px 10px;
	border: 1px solid var(--wp--preset--color--card-border);
	border-radius: 12px;
	background: var(--wp--preset--color--white);
}

.prixo-form .prixo-field__file-item .prixo-field__file-preview {
	flex: none;
	width: 40px;
	height: 40px;
}

.prixo-form .prixo-field__file-item-name {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 14px;
	color: var(--wp--preset--color--navy);
	overflow-wrap: anywhere;
}

.prixo-form .prixo-field__file-remove {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--wp--preset--color--form-error);
	cursor: pointer;
}

.prixo-form .prixo-field__file-remove:hover {
	background: rgba(217, 83, 79, 0.1);
}

.prixo-form .prixo-field__file-remove:focus-visible {
	outline: 2px solid var(--wp--preset--color--form-error);
	outline-offset: 1px;
}

.prixo-form .prixo-field__file-remove svg {
	width: 20px;
	height: 20px;
}

.prixo-form .prixo-field__hint {
	margin: 6px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: var(--wp--preset--color--body);
}