/*
 * Formulare: „Meine Garage“ (Plugin uscd-garage, Klassen uscd-garage-…) und Ultimate Member
 * (Anmelden, Registrieren, Konto, Passwort, Profil bearbeiten; nur innerhalb von .um auf body.um-page)
 * und Forminator (Kontaktformular, Gestaltung „Keine“).
 *
 * Wie das Design-System: Feldnamen in Oswald-Versalien (man liest sie ab), Eingaben in Lato ab 17px
 * (kein Zoom auf iOS), 2px-Ränder, 4px Radius, Fokus 3px Orange mit 3px Abstand, Hinweise in Stahl,
 * Fehler in Rot dunkel, Bedienflächen mindestens 44px. UM setzt viele Werte mit !important, darum hier auch.
 */

/* ---------- Meine Garage ---------- */

.uscd-garage-pflege {
	--uscd-feld-rand: var(--uscd-stahl);
	display: grid;
	gap: clamp(2.5rem, 2rem + 2vw, 4rem);
}

.uscd-garage-pflege__bereich {
	display: grid;
	gap: 1.25rem;
	padding-top: 1.25rem;
	border-top: 2px solid var(--uscd-navy);
}

.uscd-garage-pflege__titel {
	margin: 0;
	font-size: var(--wp--preset--font-size--x-gross);
	text-transform: uppercase;
}

.uscd-garage-pflege__einleitung,
.uscd-garage-pflege__hinweis {
	margin: 0;
	max-width: 40em;
	color: var(--uscd-stahl);
}

.uscd-garage-pflege__einleitung {
	font-size: var(--wp--preset--font-size--gross);
	line-height: 1.55;
}

.uscd-garage-pflege__aktionen,
.uscd-garage-pflege__zurueck {
	margin: 0;
}

/* Meldungen nach dem Speichern und Fehlerübersicht */
.uscd-garage-meldung,
.uscd-garage-fehler {
	padding: 1rem 1.25rem;
	border-radius: 4px;
}

.uscd-garage-meldung p {
	margin: 0;
}

.uscd-garage-meldung--erfolg {
	background: var(--uscd-asphalt);
	border-top: 2px solid var(--uscd-navy);
}

.uscd-garage-meldung--fehler,
.uscd-garage-fehler {
	background: #fff;
	border: 2px solid var(--uscd-rot-dunkel);
	color: var(--uscd-rot-dunkel);
}

.uscd-garage-fehler__titel {
	margin: 0 0 0.5rem;
	font-size: 1.3rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.uscd-garage-fehler__liste {
	margin: 0;
	padding-left: 1.25rem;
}

.uscd-garage-fehler__liste a {
	color: var(--uscd-rot-dunkel);
}

/* Formular */
.uscd-garage-form {
	display: grid;
	gap: 1.5rem;
	max-width: 46rem;
}

.uscd-garage-gruppe {
	display: grid;
	gap: 1.5rem;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 0;
}

.uscd-garage-gruppe + .uscd-garage-gruppe {
	padding-top: 1.5rem;
	border-top: 1px solid var(--uscd-linie);
}

.uscd-garage-gruppe__titel {
	float: left; /* Legende als normale Zeile, nicht im Rahmen */
	width: 100%;
	margin: 0 0 0.25rem;
	padding: 0;
	font-family: var(--uscd-oswald);
	font-weight: 600;
	font-size: 1.3rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--uscd-navy);
}

.uscd-garage-gruppe__titel + * {
	clear: both;
}

.uscd-garage-reihe {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
	gap: 1.5rem;
}

.uscd-garage-feld {
	display: grid;
	gap: 0.4rem;
	align-content: start;
}

.uscd-garage-feld__label {
	font-family: var(--uscd-oswald);
	font-weight: 600;
	font-size: 1.125rem;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--uscd-navy);
}

.uscd-garage-feld__pflicht {
	font-family: var(--wp--preset--font-family--lato);
	font-weight: 400;
	font-size: 0.9375rem;
	letter-spacing: 0;
	text-transform: none;
	color: var(--uscd-stahl);
}

.uscd-garage-feld__hinweis,
.uscd-garage-feld__fehler {
	margin: 0;
	font-size: 1.0625rem;
	line-height: 1.45;
}

.uscd-garage-feld__hinweis {
	color: var(--uscd-stahl);
}

.uscd-garage-feld__fehler {
	font-weight: 700;
	color: var(--uscd-rot-dunkel);
}

.uscd-garage-feld__eingabe {
	box-sizing: border-box;
	width: 100%;
	min-height: 3rem;
	padding: 0.65rem 0.85rem;
	border: 2px solid var(--uscd-feld-rand);
	border-radius: 4px;
	background: #fff;
	color: var(--wp--preset--color--tinte);
	font: inherit;
	font-size: 1.125rem;
	line-height: 1.4;
}

.uscd-garage-feld__eingabe--kurz {
	max-width: 10rem;
}

select.uscd-garage-feld__eingabe {
	padding-right: 2.5rem;
	appearance: none;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230e2a47' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right 0.75rem center / 1.1rem no-repeat;
}

textarea.uscd-garage-feld__eingabe {
	min-height: 9rem;
	resize: vertical;
}

.uscd-garage-feld__eingabe:hover {
	border-color: var(--uscd-navy);
}

.uscd-garage-feld__eingabe:focus-visible,
.uscd-garage-feld__datei:focus-visible {
	border-color: var(--uscd-navy);
	outline: 3px solid var(--uscd-orange);
	outline-offset: 3px;
}

.uscd-garage-feld--fehler .uscd-garage-feld__eingabe,
.uscd-garage-feld__eingabe[aria-invalid="true"] {
	border-color: var(--uscd-rot-dunkel);
}

/* Datei-Auswahl: Knopf im Kontur-Stil */
.uscd-garage-feld__datei {
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	font-size: 1.125rem;
	color: var(--uscd-stahl);
}

.uscd-garage-feld__datei::file-selector-button {
	min-height: 3rem;
	margin-right: 1rem;
	padding: calc(0.85em - 2px) calc(1.6em - 2px);
	border: 2px solid var(--uscd-navy);
	border-radius: 4px;
	background: transparent;
	color: var(--uscd-navy);
	font-family: var(--uscd-oswald);
	font-weight: 600;
	font-size: 1.125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.2s ease-out, color 0.2s ease-out;
}

.uscd-garage-feld__datei:hover::file-selector-button {
	background: var(--uscd-navy);
	color: #fff;
}

/* Vorhandene Fotos mit Titelfoto und Entfernen */
.uscd-garage-fotos {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 11rem), 1fr));
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.uscd-garage-foto {
	display: grid;
	gap: 0.25rem;
	align-content: start;
}

.uscd-garage-foto__bild {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: 4px;
	background: var(--uscd-nacht);
}

.uscd-garage-foto__wahl {
	display: grid;
}

.uscd-garage-foto__notiz {
	padding: 0.6rem 0;
	font-size: 0.9375rem;
	color: var(--uscd-stahl);
}

.uscd-garage-wahl {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	min-height: 2.75rem;
	cursor: pointer;
}

.uscd-garage-wahl input {
	flex: none;
	width: 1.25rem;
	height: 1.25rem;
	margin: 0;
}

.uscd-garage-wahl input:focus-visible {
	outline: 3px solid var(--uscd-orange);
	outline-offset: 3px;
}

/* Fuß des Formulars */
.uscd-garage-form__fuss {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem 1.25rem;
	padding-top: 1.5rem;
	border-top: 2px solid var(--uscd-navy);
}

.uscd-garage-form--profil .uscd-garage-form__fuss {
	padding-top: 0;
	border-top: 0;
}

.uscd-garage-form__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	margin: 0;
}

.uscd-garage-form__status {
	flex-basis: 100%;
	margin: 0;
	color: var(--uscd-stahl);
}

.uscd-garage-form__status:empty {
	display: none;
}

.uscd-garage-form__status--fehler {
	font-weight: 700;
	color: var(--uscd-rot-dunkel);
}

/* Knöpfe wie im Theme: Rot, Kontur, leise (Löschen in der Liste) */
.uscd-garage-knopf {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 3rem;
	padding: 0.85em 1.6em;
	border: 0;
	border-radius: 4px;
	background: var(--uscd-rot);
	color: #fff;
	font-family: var(--uscd-oswald);
	font-weight: 600;
	font-size: 1.125rem;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.2s ease-out, color 0.2s ease-out, border-color 0.2s ease-out;
}

.uscd-garage-knopf:hover,
.uscd-garage-knopf:focus-visible {
	background: var(--uscd-nacht);
	color: #fff;
}

.uscd-garage-knopf:disabled {
	cursor: progress;
	opacity: 0.7;
}

.uscd-garage-knopf--kontur {
	padding: calc(0.85em - 2px) calc(1.6em - 2px);
	border: 2px solid var(--uscd-navy);
	background: transparent;
	color: var(--uscd-navy);
}

.uscd-garage-knopf--kontur:hover,
.uscd-garage-knopf--kontur:focus-visible {
	background: var(--uscd-navy);
	border-color: var(--uscd-navy);
}

.uscd-garage-knopf--leise {
	padding-inline: 0.75em;
	background: transparent;
	color: var(--uscd-rot-dunkel);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.3em;
}

.uscd-garage-knopf--leise:hover,
.uscd-garage-knopf--leise:focus-visible {
	background: transparent;
	color: var(--uscd-navy);
}

/* Pfeil-Link (Profilfoto ändern, Profil ansehen, zurück) */
.uscd-garage-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	min-height: 2.75rem;
	font-family: var(--uscd-oswald);
	font-weight: 500;
	font-size: 1.125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--uscd-navy);
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.35em;
}

.uscd-garage-link::after {
	content: "";
	width: 1.1em;
	height: 1.1em;
	background: var(--uscd-rot);
	-webkit-mask: var(--uscd-pfeil) center / contain no-repeat;
	mask: var(--uscd-pfeil) center / contain no-repeat;
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.uscd-garage-link:hover::after {
	transform: translateX(0.25em);
}

.uscd-garage-pflege__zurueck .uscd-garage-link::after {
	order: -1;
	transform: scaleX(-1);
}

/* Liste der eigenen Autos: Zeilen unter einer Navy-Linie */
.uscd-garage-autos {
	margin: 0;
	padding: 0;
	list-style: none;
}

.uscd-garage-auto {
	display: grid;
	grid-template-columns: 6rem minmax(0, 1fr) auto;
	align-items: center;
	gap: 1rem 1.25rem;
	padding: 1rem 0;
	border-bottom: 1px solid var(--uscd-linie);
}

.uscd-garage-auto__bild {
	display: block;
	width: 6rem;
	height: 4rem;
	object-fit: cover;
	border-radius: 4px;
	background: var(--uscd-nacht);
}

.uscd-garage-auto__titel {
	margin: 0;
	font-size: 1.3rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.uscd-garage-auto__titel a {
	color: var(--uscd-navy);
	text-decoration: none;
}

.uscd-garage-auto__titel a:hover {
	text-decoration: underline;
}

.uscd-garage-auto__status {
	margin: 0.2rem 0 0;
	font-size: 1.0625rem;
	color: var(--uscd-stahl);
}

.uscd-garage-auto__aktionen {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

@media (max-width: 600px) {
	.uscd-garage-auto {
		grid-template-columns: 5rem minmax(0, 1fr);
	}

	.uscd-garage-auto__bild {
		width: 5rem;
		height: 3.4rem;
	}

	.uscd-garage-auto__aktionen {
		grid-column: 1 / -1;
	}

	.uscd-garage-form__fuss .uscd-garage-knopf {
		width: 100%;
	}
}

/* Platzhalter im Block-Editor */
.uscd-garage-platzhalter {
	padding: 1.25rem 1.5rem;
	border: 2px dashed var(--uscd-navy);
	border-radius: 4px;
	background: var(--uscd-asphalt);
}

.uscd-garage-platzhalter p {
	margin: 0.4rem 0 0;
	color: var(--uscd-stahl);
}

/* ---------- Ultimate Member (nur Formulare) ---------- */

body.um-page .um {
	font-family: var(--wp--preset--font-family--lato);
	color: var(--wp--preset--color--tinte);
}

body.um-page .um .um-field {
	padding-top: 1.25rem;
}

body.um-page .um .um-field-label {
	margin-bottom: 0.4rem;
}

body.um-page .um .um-field-label label {
	font-family: var(--uscd-oswald);
	font-weight: 600;
	font-size: 1.125rem !important;
	line-height: 1.2 !important;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--uscd-navy);
}

body.um-page .um .um-req {
	color: var(--uscd-rot-dunkel);
}

body.um-page .um .um-form :is(input[type="text"], input[type="email"], input[type="password"], input[type="url"], input[type="tel"], input[type="number"], input[type="date"], input[type="search"]),
body.um-page .um .um-form textarea,
body.um-page .um .um-form select {
	box-sizing: border-box !important;
	width: 100%;
	height: auto !important;
	min-height: 3rem;
	padding: 0.65rem 0.85rem !important;
	border: 2px solid var(--uscd-stahl) !important;
	border-radius: 4px;
	background: #fff !important;
	color: var(--wp--preset--color--tinte) !important;
	font-family: inherit;
	font-size: 1.125rem !important;
	line-height: 1.4;
}

body.um-page .um .um-form .um-field-area-password input[type="password"] {
	padding-right: 3rem !important;
}

body.um-page .um .um-form :is(input, textarea, select):hover {
	border-color: var(--uscd-navy) !important;
}

body.um-page .um .um-form :is(input, textarea, select):focus-visible {
	border-color: var(--uscd-navy) !important;
	outline: 3px solid var(--uscd-orange) !important;
	outline-offset: 3px;
}

body.um-page .um .um-form :is(input, textarea).um-error {
	border-color: var(--uscd-rot-dunkel) !important;
}

/* Fehler unter dem Feld statt roter Sprechblase */
body.um-page .um .um-field-error {
	position: static;
	margin: 0.4rem 0 0;
	padding: 0;
	background: none;
	color: var(--uscd-rot-dunkel);
	font-size: 1.0625rem;
	font-weight: 700;
}

body.um-page .um .um-field-error .um-field-arrow {
	display: none;
}

body.um-page .um .um-field-checkbox,
body.um-page .um .um-field-radio {
	min-height: 2.75rem;
	align-items: center;
}

body.um-page .um .um-field-checkbox-option,
body.um-page .um .um-field-radio-option {
	font-size: 1.125rem;
	color: var(--wp--preset--color--tinte) !important; /* UM: #888, zu wenig Kontrast */
}

/* Knöpfe */
body.um-page .um :is(input[type="submit"].um-button, a.um-button, .um-button) {
	min-height: 3rem;
	padding: 0.85em 1.6em !important;
	border: 0 !important;
	border-radius: 4px !important;
	background: var(--uscd-rot) !important;
	box-shadow: none !important;
	color: #fff !important;
	font-family: var(--uscd-oswald) !important;
	font-weight: 600 !important;
	font-size: 1.125rem !important;
	line-height: 1.2 !important;
	letter-spacing: 0.06em;
	text-transform: uppercase !important;
	transition: background-color 0.2s ease-out, color 0.2s ease-out;
}

body.um-page .um :is(input[type="submit"].um-button, a.um-button, .um-button):is(:hover, :focus-visible) {
	background: var(--uscd-nacht) !important;
	color: #fff !important;
}

body.um-page .um :is(input[type="submit"].um-button, a.um-button, .um-button):focus-visible {
	outline: 3px solid var(--uscd-orange) !important;
	outline-offset: 3px;
}

/* Zweitknopf (z. B. „Anmelden“ unter „Registrieren“): Kontur. :is() übernimmt die Stärke des Rot-Selektors. */
body.um-page .um :is(input[type="submit"].um-button, a.um-button, .um-button).um-alt {
	padding: calc(0.85em - 2px) calc(1.6em - 2px) !important;
	border: 2px solid var(--uscd-navy) !important;
	background: transparent !important;
	color: var(--uscd-navy) !important;
}

body.um-page .um :is(input[type="submit"].um-button, a.um-button, .um-button).um-alt:is(:hover, :focus-visible) {
	background: var(--uscd-navy) !important;
	color: #fff !important;
}

body.um-page .um .um-col-alt .um-half {
	padding-top: 0.5rem;
}

body.um-page .um :is(.um-link-alt, .um-field a, .um-col-alt-b a) {
	color: var(--uscd-rot-dunkel) !important;
	text-decoration: underline !important;
}

body.um-page .um .um-col-alt-b {
	padding-top: 1rem;
	font-size: 1.125rem;
}

/* Hinweise von UM (Fehler oben, gespeichert …) */
body.um-page .um .um-notice {
	border-radius: 4px;
	font-size: 1.125rem;
	padding: 1rem 1.25rem !important;
}

body.um-page .um .um-notice.err {
	background: #fff !important;
	border: 2px solid var(--uscd-rot-dunkel);
	color: var(--uscd-rot-dunkel) !important;
}

body.um-page .um .um-notice.success {
	background: var(--uscd-asphalt) !important;
	border-top: 2px solid var(--uscd-navy);
	color: var(--wp--preset--color--tinte) !important;
}

/* Konto: Reiter als Liste mit klarer Auswahl */
body.um-page .um-account .um-account-side li {
	margin-bottom: 0.25rem;
}

body.um-page .um-account .um-account-side li a {
	display: flex;
	align-items: center;
	min-height: 2.75rem;
	border-radius: 4px;
	background: transparent !important;
	color: var(--uscd-navy) !important;
	font-family: var(--uscd-oswald);
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

body.um-page .um-account .um-account-side li a:hover,
body.um-page .um-account .um-account-side li a.current {
	background: var(--uscd-navy) !important;
	color: #fff !important;
}

body.um-page .um-account .um-account-side li a.current .um-account-icon,
body.um-page .um-account .um-account-side li a:hover .um-account-icon {
	color: #fff !important;
}

/* Konto: Kopf der Seitenleiste ohne UM-Optik (Profilfoto eckig, Name in Oswald, Link in Textrot) */
body.um-page .um-account .um-account-meta {
	padding: 0 0 1.25rem !important;
	background: transparent !important;
	text-align: left;
}

body.um-page .um-account .um-account-meta-img img {
	width: 5.5rem !important;
	height: 5.5rem !important;
	object-fit: cover;
	border-radius: 6px !important;
}

body.um-page .um-account .um-account-name a {
	font-family: var(--uscd-oswald);
	font-weight: 600;
	font-size: 1.3rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--uscd-navy) !important;
}

body.um-page .um-account .um-account-profile-link a {
	color: var(--uscd-rot-dunkel) !important;
	font-size: 1.0625rem;
	text-decoration: underline;
}

/* Reitertitel erben die Farbe des Reiters (UM färbt sie grau), Symbole und Pfeile entfallen */
body.um-page .um-account .um-account-side li a .um-account-title {
	padding-left: 1rem;
	color: inherit !important;
	font-size: 1.125rem;
}

body.um-page .um-account .um-account-side .um-account-icon,
body.um-page .um-account .um-account-side .um-account-arrow,
body.um-page .um-account .um-account-heading i,
body.um-page .um .um-field-label-icon {
	display: none !important;
}

body.um-page .um-account .um-account-heading {
	font-family: var(--uscd-oswald);
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--uscd-navy);
}

/* Auswahllisten (select2) im Konto und im Profil */
body.um-page .um .select2-container .select2-selection--single {
	min-height: 3rem;
	border: 2px solid var(--uscd-stahl) !important;
	border-radius: 4px !important;
}

body.um-page .um .select2-container .select2-selection--single .select2-selection__rendered {
	line-height: 2.75rem !important;
	font-size: 1.125rem;
	color: var(--wp--preset--color--tinte);
}

body.um-page .um .select2-container--focus .select2-selection--single,
body.um-page .um .select2-container--open .select2-selection--single {
	outline: 3px solid var(--uscd-orange);
	outline-offset: 3px;
}

/* Profil bearbeiten: Titelbilder zeigt die Seite nicht mehr, Autos kommen über „Meine Autos“.
   Profilfoto eckig wie im öffentlichen Profil, Speichern nur über den Knopf, keine Reiterleiste. */
body.um-page-user .um-profile.um-editing .um-cover,
body.um-page-user .um-profile.um-editing .um-profile-headericon,
body.um-page-user .um-profile.um-editing .um-profile-nav {
	display: none !important;
}

body.um-page-user .um-profile.um-editing .um-header {
	min-height: 0 !important;
	padding-top: 1rem !important;
	border-bottom: 2px solid var(--uscd-navy);
}

body.um-page-user .um-profile.um-editing .um-profile-photo {
	position: static !important;
	top: auto !important;
	margin: 0 1.5rem 1rem 0 !important;
}

body.um-page-user .um-profile.um-editing .um-profile-photo a.um-profile-photo-img,
body.um-page-user .um-profile.um-editing .um-profile-photo img {
	border-radius: 6px !important;
}

body.um-page-user .um-profile.um-editing .um-profile-meta {
	padding-left: 0 !important;
}

body.um-page-user .um-profile.um-editing .um-header {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 1rem 1.5rem;
}

body.um-page-user .um-profile.um-editing .um-header::after {
	content: none;
}

body.um-page-user .um-profile.um-editing .um-profile-photo {
	float: none !important;
	width: 7.5rem !important;
	height: 7.5rem !important;
	margin: 0 !important;
}

body.um-page-user .um-profile.um-editing .um-profile-photo :is(a, img, .um-profile-photo-overlay) {
	width: 7.5rem !important;
	height: 7.5rem !important;
	border-radius: 6px !important;
}

body.um-page-user .um-profile.um-editing .um-profile-meta {
	flex: 1 1 16rem;
	float: none !important;
	margin: 0 !important;
}

/* Konto: inaktive Reiter ohne grauen Grund */
body.um-page .um-account .um-account-side li {
	background: transparent !important;
}

body.um-page-user .um-profile.um-editing .um-profile-photo a.um-profile-photo-img {
	position: relative !important;
	top: auto !important;
	left: auto !important;
	display: block;
}

body.um-page-user .um-profile.um-editing .um-profile-photo a.um-profile-photo-img img {
	display: block;
}

body.um-page-user .um-profile.um-editing .um-profile-photo-overlay {
	position: absolute !important;
	inset: 0 !important;
}

/* Knöpfe unter den Formularen auf dem Handy untereinander, damit die Beschriftung nicht abgeschnitten wird */
@media (max-width: 600px) {
	body.um-page .um .um-col-alt .um-half {
		float: none !important;
		width: 100% !important;
		margin: 0 0 0.75rem !important;
	}
}

/* Konto auf dem Handy: Ultimate Member zeigt statt der Seitenleiste eine Klappliste. Gleiche Schrift wie die
   Reiter am Desktop, ohne Symbolschrift; der Winkel ist derselbe wie bei „Weitere Fotos“. */
body.um-page .um-account .um-account-nav a {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	min-height: 3rem;
	padding: 0.75rem 0 !important;
	border-bottom: 1px solid var(--uscd-linie);
	background: transparent !important;
	font-family: var(--uscd-oswald);
	font-weight: 500;
	font-size: 1.125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--uscd-navy) !important;
}

body.um-page .um-account .um-account-nav a.current {
	box-shadow: inset 0 -3px 0 var(--uscd-navy);
}

body.um-page .um-account .um-account-nav a .ico,
body.um-page .um-account .um-account-nav a .arr {
	display: none !important;
}

body.um-page .um-account .um-account-nav a::after {
	content: "";
	width: 1em;
	height: 1em;
	background: currentColor;
	-webkit-mask: var(--uscd-winkel) center / contain no-repeat;
	mask: var(--uscd-winkel) center / contain no-repeat;
}

/* Profil bearbeiten: Name und Textfeld auf derselben linken Kante wie das Foto */
body.um-page-user .um-profile.um-editing .um-profile-meta,
body.um-page-user .um-profile.um-editing .um-name {
	text-align: left !important;
}

@media (max-width: 600px) {
	body.um-page-user .um-profile.um-editing .um-header {
		flex-direction: column;
	}

	body.um-page-user .um-profile.um-editing .um-profile-meta {
		flex-basis: auto;
		width: 100%;
	}

	body.um-page-user .um-profile.um-editing .um-meta-text textarea {
		width: 100% !important;
	}
}

body.um-page-user .um-profile.um-editing :is(.um-main-meta, .um-meta-text) {
	padding: 0 !important;
}

body.um-page-user .um-profile.um-editing .um-name {
	margin: 0 0 0.5rem !important;
}

/* „Passwort vergessen?“ steht auf der linken Formularkante wie alles andere */
body.um-page .uscd-formular .um .um-col-alt-b {
	text-align: left !important;
}

/* ---------- Forminator (Kontaktformular, Gestaltung „Keine“: das Aussehen kommt von hier) ---------- */

.uscd-seite .forminator-ui.forminator-custom-form {
	display: grid;
	gap: 1.5rem;
	max-width: 40rem;
	margin: 0;
	font-size: 1.125rem;
}

.uscd-seite .forminator-ui .forminator-row {
	display: block;
	margin: 0 !important;
}

.uscd-seite .forminator-ui .forminator-col {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0 !important; /* das Raster von Forminator rückt Spalten ab 783px um 15px ein */
}

.uscd-seite .forminator-ui .forminator-field {
	display: grid;
	gap: 0.4rem;
}

.uscd-seite .forminator-ui .forminator-label {
	margin: 0;
	padding: 0;
	font-family: var(--uscd-oswald);
	font-weight: 600;
	font-size: 1.125rem;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--uscd-navy);
}

.uscd-seite .forminator-ui .forminator-required {
	margin-left: 0.15em;
	color: var(--uscd-rot-dunkel);
}

.uscd-seite .forminator-ui :is(.forminator-input, .forminator-textarea) {
	box-sizing: border-box;
	width: 100%;
	min-height: 3rem;
	margin: 0;
	padding: 0.65rem 0.85rem;
	border: 2px solid var(--uscd-stahl);
	border-radius: 4px;
	background: #fff;
	box-shadow: none;
	color: var(--wp--preset--color--tinte);
	font: inherit;
	font-size: 1.125rem;
	line-height: 1.4;
	transition: border-color 0.2s ease-out;
}

.uscd-seite .forminator-ui .forminator-textarea {
	min-height: 10rem;
	resize: vertical;
}

.uscd-seite .forminator-ui :is(.forminator-input, .forminator-textarea)::placeholder {
	color: var(--uscd-stahl);
	opacity: 1;
}

.uscd-seite .forminator-ui :is(.forminator-input, .forminator-textarea):hover {
	border-color: var(--uscd-navy);
}

.uscd-seite .forminator-ui :is(.forminator-input, .forminator-textarea):focus-visible {
	border-color: var(--uscd-navy);
	outline: 3px solid var(--uscd-orange);
	outline-offset: 3px;
}

/* Zeichenzähler unter der Nachricht */
.uscd-seite .forminator-ui .forminator-description {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--uscd-stahl);
	text-align: right;
	font-variant-numeric: tabular-nums;
}

/* Fehler direkt am Feld, fett in Rot dunkel, keine Sprechblase */
.uscd-seite .forminator-ui .forminator-has_error :is(.forminator-input, .forminator-textarea) {
	border-color: var(--uscd-rot-dunkel);
}

.uscd-seite .forminator-ui .forminator-error-message {
	display: block;
	margin: 0;
	padding: 0;
	background: none;
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.45;
	color: var(--uscd-rot-dunkel);
}

/* Fuß des Formulars unter einer 2px-Navy-Linie, Knopf wie alle Hauptknöpfe */
.uscd-seite .forminator-ui .forminator-row-last {
	padding-top: 1.5rem;
	border-top: 2px solid var(--uscd-navy);
}

.uscd-seite .forminator-ui .forminator-row-last .forminator-field {
	justify-items: start;
}

.uscd-seite .forminator-ui .forminator-button-submit {
	min-height: 3rem;
	margin: 0;
	padding: 0.85em 1.6em;
	border: 0;
	border-radius: 4px;
	background: var(--uscd-rot);
	color: #fff;
	font-family: var(--uscd-oswald);
	font-weight: 600;
	font-size: 1.125rem;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color 0.2s ease-out;
}

.uscd-seite .forminator-ui .forminator-button-submit:is(:hover, :focus-visible) {
	background: var(--uscd-nacht);
}

.uscd-seite .forminator-ui .forminator-button-submit:disabled {
	opacity: 0.6;
	cursor: wait;
}

/* Meldung nach dem Absenden: Erfolg als Asphalt-Fläche, Fehler als Box in Rot dunkel */
.uscd-seite .forminator-ui .forminator-response-message {
	margin: 0;
	padding: 1rem 1.25rem;
	border-radius: 4px;
}

.uscd-seite .forminator-ui .forminator-response-message:empty,
.uscd-seite .forminator-ui .forminator-response-message[aria-hidden="true"] {
	display: none;
}

.uscd-seite .forminator-ui .forminator-response-message p {
	margin: 0;
}

.uscd-seite .forminator-ui .forminator-response-message.forminator-success {
	background: var(--uscd-asphalt);
	border-top: 2px solid var(--uscd-navy);
	color: var(--wp--preset--color--tinte);
}

.uscd-seite .forminator-ui .forminator-response-message.forminator-error {
	background: #fff;
	border: 2px solid var(--uscd-rot-dunkel);
	color: var(--uscd-rot-dunkel);
	font-weight: 700;
}

/* Honeypot bleibt für Menschen unsichtbar */
.uscd-seite .forminator-ui .forminator-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

@media (max-width: 600px) {
	.uscd-seite .forminator-ui .forminator-row-last .forminator-field {
		justify-items: stretch;
	}
}
