/* ==========================================================================
   WPForms – Cathrin Müller Personal Training
   Passend zum Onepager (shortcodes/shortcodes.css): Creme/Anthrazit/Gold,
   Divi-Standardschrift, eckige Felder (2px), Versal-Labels.
   Grundlage: WPForms „modern“ Rendering → Styling über CSS-Variablen,
   Details über gezielte Regeln. Alte Datei: forms.css.bak
   ========================================================================== */

/* ---------- 1. WPForms-Variablen ---------- */
div.wpforms-container-full {
	/* Felder */
	--wpforms-field-border-radius: 2px;
	--wpforms-field-border-style: solid;
	--wpforms-field-border-size: 1px;
	--wpforms-field-background-color: #FFFFFF;
	--wpforms-field-border-color: var(--cm-border-strong, #8C8276);
	--wpforms-field-border-color-spare: var(--cm-border-strong, #8C8276);
	--wpforms-field-text-color: var(--cm-anthrazit, #2A2826);
	--wpforms-field-menu-color: #FFFFFF;
	--wpforms-field-size-input-height: 48px;
	--wpforms-field-size-input-spacing: 20px;
	--wpforms-field-size-font-size: 16px;
	--wpforms-field-size-line-height: 1.5;
	--wpforms-field-size-padding-h: 16px;
	--wpforms-field-size-checkbox-size: 20px;
	--wpforms-field-size-sublabel-spacing: 6px;
	/* Labels */
	--wpforms-label-color: var(--cm-anthrazit, #2A2826);
	--wpforms-label-sublabel-color: var(--cm-muted, #5E5953);
	--wpforms-label-error-color: #A8412F;
	--wpforms-label-size-font-size: 12px;
	--wpforms-label-size-line-height: 1.4;
	--wpforms-label-size-sublabel-font-size: 13px;
	/* Button (auch Farbe für angehakte Checkboxen) */
	--wpforms-button-border-radius: 2px;
	--wpforms-button-border-style: solid;
	--wpforms-button-border-size: 1px;
	--wpforms-button-background-color: var(--cm-gold-button, #8C6A32);
	--wpforms-button-border-color: var(--cm-gold-button, #8C6A32);
	--wpforms-button-text-color: #FFFFFF;
	--wpforms-button-size-font-size: 14px;
	--wpforms-button-size-height: 52px;
	--wpforms-button-size-padding-h: 24px;
	--wpforms-button-size-margin-top: 8px;
	--wpforms-page-break-color: var(--cm-gold-button, #8C6A32);
}

/* ---------- 2. Layout ---------- */
div.wpforms-container-full { margin: 0 !important; }
div.wpforms-container-full .wpforms-form .wpforms-field { padding: 10px 0 !important; }
div.wpforms-container-full .wpforms-form .wpforms-field-container { margin: 0; }

/* ---------- 3. Labels ---------- */
div.wpforms-container-full .wpforms-form .wpforms-field-label {
	margin: 0 0 8px !important;
	font-size: 12px !important; font-weight: 600 !important; line-height: 1.4 !important;
	letter-spacing: .12em; text-transform: uppercase;
	color: var(--cm-anthrazit, #2A2826) !important;
}
div.wpforms-container-full .wpforms-form .wpforms-required-label { color: var(--cm-gold-text, #85632D) !important; font-weight: 600; }

/* ---------- 4. Eingabefelder ---------- */
div.wpforms-container-full .wpforms-form input[type=date],
div.wpforms-container-full .wpforms-form input[type=datetime],
div.wpforms-container-full .wpforms-form input[type=datetime-local],
div.wpforms-container-full .wpforms-form input[type=email],
div.wpforms-container-full .wpforms-form input[type=month],
div.wpforms-container-full .wpforms-form input[type=number],
div.wpforms-container-full .wpforms-form input[type=password],
div.wpforms-container-full .wpforms-form input[type=search],
div.wpforms-container-full .wpforms-form input[type=tel],
div.wpforms-container-full .wpforms-form input[type=text],
div.wpforms-container-full .wpforms-form input[type=time],
div.wpforms-container-full .wpforms-form input[type=url],
div.wpforms-container-full .wpforms-form input[type=week],
div.wpforms-container-full .wpforms-form select,
div.wpforms-container-full .wpforms-form textarea {
	width: 100% !important; max-width: 100% !important;
	min-height: 48px;
	padding: 12px 16px !important;
	font-size: 16px !important; line-height: 1.5 !important;
	color: var(--cm-anthrazit, #2A2826) !important;
	background-color: #FFFFFF !important;
	border: 1px solid var(--cm-border-strong, #8C8276) !important;
	border-radius: 2px !important;
	box-shadow: none !important;
	transition: border-color .15s ease, box-shadow .15s ease;
}
div.wpforms-container-full .wpforms-form textarea { min-height: 140px; height: 140px; resize: vertical; }
div.wpforms-container-full .wpforms-form input::placeholder,
div.wpforms-container-full .wpforms-form textarea::placeholder { color: var(--cm-muted, #5E5953); opacity: .7; }

/* Fokus: Goldrahmen + weicher Ring */
div.wpforms-container-full .wpforms-form input:focus,
div.wpforms-container-full .wpforms-form select:focus,
div.wpforms-container-full .wpforms-form textarea:focus,
.et-db #et-boc .et-l .et_pb_module div.wpforms-container-full input:focus,
.et-db #et-boc .et-l .et_pb_module div.wpforms-container-full select:focus,
.et-db #et-boc .et-l .et_pb_module div.wpforms-container-full textarea:focus {
	outline: none !important;
	border-color: var(--cm-gold-button, #8C6A32) !important;
	box-shadow: 0 0 0 3px rgba(176, 138, 78, .25) !important;
}

/* Auswahlliste */
div.wpforms-container-full select > option:not(.placeholder):checked,
div.wpforms-container-full select > option:hover { background: var(--cm-gold-hell, #F3ECDF) !important; color: var(--cm-anthrazit, #2A2826) !important; }

/* ---------- 5. Checkboxen / DSGVO ---------- */
div.wpforms-container-full .wpforms-form .wpforms-field-gdpr-checkbox .wpforms-field-label { margin-bottom: 10px !important; }
div.wpforms-container-full .wpforms-form ul { margin: 0 !important; padding: 0 !important; list-style: none !important; }
div.wpforms-container-full .wpforms-form ul li { display: flex; align-items: flex-start; gap: 12px; margin: 0 !important; padding: 0 !important; }
div.wpforms-container-full .wpforms-form input[type=checkbox],
div.wpforms-container-full .wpforms-form input[type=radio] {
	flex: none; width: 20px; height: 20px; margin: 2px 0 0 !important;
	accent-color: var(--cm-gold-button, #8C6A32);
}
div.wpforms-container-full .wpforms-form input[type=checkbox]:focus-visible,
div.wpforms-container-full .wpforms-form input[type=radio]:focus-visible { outline: 2px solid var(--cm-gold-button, #8C6A32); outline-offset: 2px; }
div.wpforms-container-full .wpforms-form .wpforms-field-label-inline {
	margin: 0 !important;
	font-size: 14px !important; line-height: 1.6 !important; font-weight: 400 !important;
	letter-spacing: 0; text-transform: none;
	color: var(--cm-muted, #5E5953) !important;
}
div.wpforms-container-full .wpforms-form .wpforms-field-label-inline a,
div.wpforms-container-full .wpforms-form .wpforms-field-description a {
	color: var(--cm-gold-text, #85632D) !important; text-decoration: underline; text-underline-offset: 3px;
}
div.wpforms-container-full .wpforms-form .wpforms-field-description {
	font-size: 13px !important; line-height: 1.5; color: var(--cm-muted, #5E5953) !important;
}

/* ---------- 6. Absenden-Button (wie .cm-btn--primary) ---------- */
div.wpforms-container-full .wpforms-form .wpforms-submit-container { padding: 16px 0 0 !important; margin: 0 !important; }
div.wpforms-container-full .wpforms-form button[type=submit],
div.wpforms-container-full .wpforms-form input[type=submit] {
	float: none !important;
	display: inline-flex !important; align-items: center; justify-content: center;
	width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 52px;
	padding: 0 24px !important;
	font-size: 14px !important; font-weight: 600 !important; line-height: 1 !important;
	letter-spacing: .14em !important; text-transform: uppercase;
	color: #FFFFFF !important;
	background: var(--cm-gold-button, #8C6A32) !important;
	border: 1px solid var(--cm-gold-button, #8C6A32) !important;
	border-radius: 2px !important;
	box-shadow: none !important; opacity: 1 !important;
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease;
}
div.wpforms-container-full .wpforms-form button[type=submit]:hover,
div.wpforms-container-full .wpforms-form input[type=submit]:hover,
div.wpforms-container-full .wpforms-form button[type=submit]:active {
	background: var(--cm-gold-hover, #75582A) !important;
	border-color: var(--cm-gold-hover, #75582A) !important;
	color: #FFFFFF !important;
}
div.wpforms-container-full .wpforms-form button[type=submit]:focus-visible {
	outline: 2px solid var(--cm-gold, #B08A4E) !important; outline-offset: 3px;
}
div.wpforms-container-full .wpforms-form button[type=submit]:disabled { opacity: .7 !important; cursor: wait; }
div.wpforms-container-full .wpforms-form .wpforms-submit-spinner { margin-left: 12px; vertical-align: middle; }

/* ---------- 7. Fehler ---------- */
div.wpforms-container-full .wpforms-form label.wpforms-error,
div.wpforms-container-full .wpforms-form em.wpforms-error {
	display: block; margin-top: 6px !important; padding: 0 !important;
	font-size: 13px !important; font-style: normal; font-weight: 400 !important;
	letter-spacing: 0; text-transform: none;
	color: #A8412F !important;
}
div.wpforms-container-full .wpforms-form .wpforms-field input.wpforms-error,
div.wpforms-container-full .wpforms-form .wpforms-field textarea.wpforms-error,
div.wpforms-container-full .wpforms-form .wpforms-field select.wpforms-error,
div.wpforms-container-full .wpforms-form .wpforms-field input.user-invalid,
div.wpforms-container-full .wpforms-form .wpforms-field textarea.user-invalid {
	border-color: #A8412F !important;
}
div.wpforms-container-full .wpforms-error-container,
div.wpforms-container-full noscript.wpforms-error-noscript {
	color: #A8412F !important; font-size: 14px;
}

/* ---------- 8. Bestätigung nach dem Absenden ---------- */
div.wpforms-confirmation-container-full,
div[submit-success] > .wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
	margin: 0 0 24px !important; padding: 20px 24px !important;
	background: var(--cm-gold-hell, #F3ECDF) !important;
	border: 1px solid var(--cm-gold, #B08A4E) !important;
	border-radius: 2px !important;
	color: var(--cm-anthrazit, #2A2826) !important;
	font-size: 16px; line-height: 1.6;
}
div.wpforms-confirmation-container-full p:last-of-type { margin: 0; padding: 0; }

/* ---------- 9. Datum / Uhrzeit (Flatpickr, Timepicker) ---------- */
.flatpickr-calendar {
	background: #FFFFFF;
	border-radius: 2px;
	box-shadow: 0 0 0 1px var(--cm-border, #E0D8CB), 0 12px 32px -12px rgba(42, 40, 38, .25);
	font-size: 14px;
}
.flatpickr-day.today { border-color: var(--cm-gold, #B08A4E); }
.flatpickr-day:hover,
.flatpickr-day:focus { background: var(--cm-gold-hell, #F3ECDF) !important; border-color: var(--cm-gold-hell, #F3ECDF) !important; color: var(--cm-anthrazit, #2A2826) !important; }
.flatpickr-day.selected,
.flatpickr-day.selected:hover {
	background: var(--cm-gold-button, #8C6A32) !important;
	border-color: var(--cm-gold-button, #8C6A32) !important;
	color: #FFFFFF !important;
}
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay { color: rgba(42, 40, 38, .3); background: transparent; border-color: transparent; }

.ui-timepicker-wrapper {
	overflow-y: auto; height: 160px; min-width: 300px; max-width: 100%;
	margin: 0; background: #FFFFFF;
	border: 1px solid var(--cm-border, #E0D8CB); border-radius: 2px;
	box-shadow: 0 12px 32px -12px rgba(42, 40, 38, .25);
	outline: none; z-index: 10001;
}
.ui-timepicker-list li:hover { background: var(--cm-gold-hell, #F3ECDF) !important; color: var(--cm-anthrazit, #2A2826) !important; }
li.ui-timepicker-selected,
.ui-timepicker-list li.ui-timepicker-selected:hover {
	background: var(--cm-gold-button, #8C6A32) !important;
	color: #FFFFFF !important;
	border: 0 !important;
}
