/*
 * Buchungsfrontend [cd_termine] im Corporate Design (Gold/Grau).
 * Monatskalender + Zeiten-Panel, zweisprachig (DE/EN), mobil-first.
 * Über CSS-Variablen anpassbar.
 */
.cdt {
	--cdt-accent: #b3a369;
	--cdt-accent-dark: #9a8c54;
	--cdt-accent-soft: #f3efe1;
	--cdt-accent-contrast: #222222;
	--cdt-heading: #707070;
	--cdt-text: #222222;
	--cdt-muted: #9a9a9a;
	--cdt-border: #e2e2e2;
	--cdt-hover: #faf7ee;
	--cdt-bg: #f5f6f7;
	--cdt-radius: 12px;
	--cdt-gap: 10px;
	--cdt-shadow: 0 1px 3px rgba( 0, 0, 0, 0.06 ), 0 10px 30px rgba( 0, 0, 0, 0.06 );
	font-family: 'Segoe UI', Arial, sans-serif;
	color: var(--cdt-text);
	max-width: 760px;
	margin: 0 auto;
	line-height: 1.5;
}

.cdt *,
.cdt *::before,
.cdt *::after {
	box-sizing: border-box;
}

/* Kopf: Titel + Sprachumschalter */
.cdt__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 18px;
}
.cdt__title {
	margin: 0;
	font-size: 1.4rem;
	font-weight: 700;
	color: var(--cdt-text);
}
.cdt__loading,
.cdt__empty {
	color: var(--cdt-muted);
	padding: 18px 0;
}

/* Picker: Kalender + Zeiten */
.cdt__picker {
	display: grid;
	/* minmax(0,1fr) statt 1fr: erlaubt der Spalte, unter die min-content-Breite
	   ihrer Kinder (Kalender/Uhrzeiten) zu schrumpfen. Sonst laufen die Grids
	   auf schmalen Viewports rechts aus der Box (SO-Spalte abgeschnitten). */
	grid-template-columns: minmax( 0, 1fr );
	gap: 22px;
	background: #fff;
	border: 1px solid var(--cdt-border);
	border-radius: var(--cdt-radius);
	box-shadow: var(--cdt-shadow);
	padding: 20px;
}
/* Ohne diese Regel würde das display:grid oben das hidden-Attribut
   überstimmen und die Kalenderbox bliebe sichtbar, wenn keine Termine
   verfügbar sind. */
.cdt__picker[hidden] {
	display: none;
}
/* Grid-Kinder duerfen unter ihre min-content-Breite schrumpfen, damit die
   inneren Raster nie breiter als der (mobile) Dialog werden. */
.cdt__calendar,
.cdt__slots-panel {
	min-width: 0;
}

/* Kalender */
.cdt__cal-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 14px;
}
.cdt__cal-month {
	font-weight: 700;
	font-size: 1.05rem;
	color: var(--cdt-text);
}
.cdt__cal-nav {
	appearance: none;
	border: 1px solid var(--cdt-border);
	background: #fff;
	color: var(--cdt-heading);
	width: 40px;
	height: 40px;
	border-radius: 50%;
	font-size: 1.3rem;
	line-height: 1;
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.cdt__cal-nav:hover:not(:disabled) {
	background: var(--cdt-hover);
	border-color: var(--cdt-accent);
	color: var(--cdt-text);
}
.cdt__cal-nav:disabled {
	opacity: 0.35;
	cursor: default;
}

.cdt__cal-weekdays,
.cdt__cal-grid {
	display: grid;
	grid-template-columns: repeat( 7, minmax( 0, 1fr ) );
	gap: 4px;
}
.cdt__cal-weekdays {
	margin-bottom: 6px;
}
.cdt__cal-wd {
	text-align: center;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--cdt-muted);
	padding: 4px 0;
}

.cdt__cal-cell {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	min-width: 0;
	font: inherit;
	font-size: 0.95rem;
	border-radius: 50%;
}
.cdt__cal-cell--empty {
	visibility: hidden;
}
.cdt__cal-cell--off {
	color: #cfcfcf;
}

/* Buchbarer Tag */
.cdt__cal-day {
	position: relative;
	appearance: none;
	border: none;
	background: var(--cdt-accent-soft);
	color: var(--cdt-text);
	font-weight: 700;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.cdt__cal-day::after {
	content: '';
	position: absolute;
	bottom: 6px;
	left: 50%;
	transform: translateX( -50% );
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--cdt-accent-dark);
}
.cdt__cal-day:hover {
	background: #e9e1c4;
}
.cdt__cal-day.is-selected {
	background: var(--cdt-accent);
	color: var(--cdt-accent-contrast);
	box-shadow: 0 0 0 3px rgba( 179, 163, 105, 0.28 );
}
.cdt__cal-day.is-selected::after {
	background: var(--cdt-accent-contrast);
}
.cdt__cal-day:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba( 179, 163, 105, 0.45 );
}

/* Zeiten-Panel */
.cdt__panel-date {
	margin: 0 0 14px;
	font-size: 1rem;
	font-weight: 700;
	color: var(--cdt-heading);
}
.cdt__times {
	display: grid;
	/* min( 84px, 100% ): auf sehr schmalen Viewports fuellt eine Kachel notfalls
	   die ganze Breite, statt rechts ueber den Rand zu laufen. */
	grid-template-columns: repeat( auto-fill, minmax( min( 84px, 100% ), 1fr ) );
	gap: var(--cdt-gap);
}
.cdt__time {
	border: 2px solid var(--cdt-border);
	background: #fff;
	color: var(--cdt-text);
	border-radius: var(--cdt-radius);
	padding: 12px 6px;
	cursor: pointer;
	font: inherit;
	font-weight: 700;
	min-height: 48px;
	transition: border-color 0.15s ease, background 0.15s ease, transform 0.05s ease;
}
.cdt__time:hover,
.cdt__time:focus-visible {
	background: var(--cdt-hover);
	border-color: var(--cdt-accent);
	outline: none;
}
.cdt__time:active {
	transform: translateY( 1px );
}
.cdt__no-times {
	color: var(--cdt-muted);
	margin: 4px 0 0;
}
.cdt__slots-hint {
	margin: 22px 0 0;
	padding: 16px 18px;
	border: 1px solid var(--cdt-border);
	border-left: 4px solid var(--cdt-accent);
	border-radius: var(--cdt-radius);
	background: var(--cdt-accent-soft);
	color: var(--cdt-text);
	font-size: 1.02rem;
	line-height: 1.55;
}
.cdt__slots-hint a {
	color: var(--cdt-accent-dark);
	font-weight: 700;
	text-decoration: underline;
}
.cdt__slots-hint a:hover {
	text-decoration: none;
}
/* Mobil: Hinweis über den Kalender ziehen (Desktop bleibt unten). */
@media ( max-width: 619px ) {
	.cdt__step[data-step="slots"] {
		display: flex;
		flex-direction: column;
	}
	.cdt__slots-hint {
		order: -1;
		margin: 0 0 18px;
	}
}

/* Desktop: zwei Spalten */
@media ( min-width: 620px ) {
	.cdt__picker {
		grid-template-columns: 300px minmax( 0, 1fr );
		gap: 28px;
		padding: 24px;
	}
	.cdt__slots-panel {
		border-left: 1px solid var(--cdt-border);
		padding-left: 28px;
	}
}

/* Formular-Schritt */
.cdt__step--form {
	background: #fff;
	border: 1px solid var(--cdt-border);
	border-radius: var(--cdt-radius);
	box-shadow: var(--cdt-shadow);
	padding: 24px;
}
.cdt__chosen {
	margin: 0 0 20px;
	padding: 12px 16px;
	background: var(--cdt-accent-soft);
	border-radius: var(--cdt-radius);
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px;
	color: var(--cdt-heading);
	font-size: 0.95rem;
}
.cdt__chosen-label {
	color: var(--cdt-text);
}
.cdt__back {
	background: none;
	border: none;
	color: var(--cdt-accent-dark);
	text-decoration: underline;
	cursor: pointer;
	font: inherit;
	font-weight: 700;
	padding: 4px 6px;
	min-height: 36px;
}
.cdt__field {
	display: block;
	margin-bottom: 16px;
}

/* Ort-Auswahl (Vor Ort / Online) */
.cdt__loc {
	display: flex;
	flex-wrap: wrap;
	gap: var(--cdt-gap);
}
.cdt__loc-btn {
	appearance: none;
	border: 2px solid var(--cdt-border);
	background: #fff;
	color: var(--cdt-text);
	border-radius: var(--cdt-radius);
	padding: 10px 20px;
	cursor: pointer;
	font: inherit;
	font-size: 0.95rem;
	font-weight: 700;
	min-height: 44px;
	transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}
.cdt__loc-btn:hover:not(.is-fixed) {
	border-color: var(--cdt-accent);
	background: var(--cdt-hover);
}
.cdt__loc-btn.is-active {
	border-color: var(--cdt-accent);
	background: var(--cdt-accent);
	color: var(--cdt-accent-contrast);
}
.cdt__loc-btn.is-fixed {
	cursor: default;
}
.cdt__loc-btn.is-disabled,
.cdt__loc-btn:disabled {
	cursor: not-allowed;
	border-color: var(--cdt-border);
	background: #f4f4f4;
	color: #9a9a9a;
	opacity: 1;
}
.cdt__loc-btn:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba( 179, 163, 105, 0.35 );
}
.cdt__loc.is-invalid .cdt__loc-btn {
	border-color: #b00020;
}
.cdt__loc.is-invalid .cdt__loc-btn.is-disabled {
	border-color: var(--cdt-border);
}
.cdt__loc-hint {
	flex-basis: 100%;
	margin: 2px 0 0;
	font-size: 0.8rem;
	line-height: 1.45;
	color: var(--cdt-heading);
	opacity: 0.85;
}
.cdt__label {
	display: block;
	margin-bottom: 6px;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--cdt-heading);
}
.cdt__field input,
.cdt__field textarea {
	width: 100%;
	border: 2px solid var(--cdt-border);
	border-radius: var(--cdt-radius);
	padding: 12px 14px;
	font: inherit;
	color: var(--cdt-text);
	background: #fff;
	min-height: 48px;
}
.cdt__field input::placeholder,
.cdt__field textarea::placeholder {
	color: #b6b6b6;
}
.cdt__field input:focus,
.cdt__field textarea:focus {
	outline: none;
	border-color: var(--cdt-accent);
	box-shadow: 0 0 0 3px rgba( 179, 163, 105, 0.22 );
}
.cdt__field input.is-invalid,
.cdt__field textarea.is-invalid {
	border-color: #b00020;
	background: #fdf3f4;
}
.cdt__field input.is-invalid:focus,
.cdt__field textarea.is-invalid:focus {
	border-color: #b00020;
	box-shadow: 0 0 0 3px rgba( 176, 0, 32, 0.18 );
}
.cdt__field-error {
	display: block;
	margin-top: 6px;
	font-size: 0.72rem;
	font-weight: 600;
	color: #b00020;
}
/* Honorar-Hinweis mit Pflicht-Bestätigung vor dem Buchen. */
.cdt__price {
	margin: 0 0 18px;
	padding: 14px 16px;
	background: var(--cdt-accent-soft);
	border: 1px solid var(--cdt-border);
	border-radius: var(--cdt-radius);
}
.cdt__price-text {
	margin: 0 0 14px;
	font-size: 0.95rem;
	line-height: 1.5;
	color: var(--cdt-text);
}
.cdt__price-total-amount {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--cdt-heading);
}
.cdt__price-total-note {
	white-space: nowrap;
}
.cdt__price-confirm {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
	font-size: 0.9rem;
	color: var(--cdt-text);
	line-height: 1.4;
}
.cdt__price-confirm[hidden] {
	display: none;
}
.cdt__price-confirm + .cdt__price-confirm {
	margin-top: 10px;
}
.cdt__price-confirm.is-invalid {
	color: #b00020;
	font-weight: 600;
}
.cdt__price-confirm.is-invalid .cdt__price-check,
.cdt__price-confirm.is-invalid .cdt__storno-check {
	outline: 2px solid #b00020;
	outline-offset: 2px;
}
.cdt__storno-check {
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	flex: 0 0 auto;
	accent-color: var(--cdt-accent);
	cursor: pointer;
}
.cdt__price-check {
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	flex: 0 0 auto;
	accent-color: var(--cdt-accent);
	cursor: pointer;
}
.cdt__consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	cursor: pointer;
	font-size: 0.9rem;
	color: var(--cdt-text);
	line-height: 1.4;
}
/* Sitzt die Datenschutz-Zeile unter dem Preisteil, grenzt eine Linie sie ab. */
.cdt__consent--sep {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--cdt-border);
}
.cdt__consent.is-invalid {
	color: #b00020;
	font-weight: 600;
}
.cdt__consent.is-invalid .cdt__privacy-check {
	outline: 2px solid #b00020;
	outline-offset: 2px;
}
.cdt__privacy-check {
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	flex: 0 0 auto;
	accent-color: var(--cdt-accent);
	cursor: pointer;
}
.cdt__privacy-text a {
	color: var(--cdt-accent-dark);
	text-decoration: underline;
}
.cdt__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.cdt__submit {
	background: var(--cdt-accent);
	color: var(--cdt-accent-contrast);
	border: none;
	border-radius: var(--cdt-radius);
	padding: 10px 20px;
	cursor: pointer;
	font: inherit;
	font-size: 0.95rem;
	font-weight: 700;
	margin-top: 6px;
	width: 100%;
	min-height: 44px;
	transition: background 0.15s ease;
}
.cdt__submit:hover {
	background: var(--cdt-accent-dark);
}
.cdt__submit:disabled {
	opacity: 0.6;
	cursor: default;
}
.cdt__error {
	color: #b00020;
	margin-top: 14px;
	font-size: 0.82rem;
	font-weight: 600;
}

/* Hinweise / Storno-Rückmeldung */
.cdt__notice,
.cdt-notice {
	padding: 14px 18px;
	border-radius: var(--cdt-radius);
	margin-bottom: 18px;
	font-weight: 600;
}
.cdt-notice--ok {
	background: #e7f5ec;
	color: #1c6b3c;
}
.cdt-notice--error {
	background: #fbe9e9;
	color: #b00020;
}
.cdt-notice__demo {
	margin: 0 0 10px;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	opacity: 0.75;
}
.cdt-notice__booking {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 4px 14px;
	margin: 0 0 12px;
	font-weight: 500;
}
.cdt-notice__booking dt {
	font-weight: 700;
}
.cdt-notice__booking dd {
	margin: 0;
}
/* Storno-Ansicht: der cd-termine-Block füllt in-flow volle 100vh (die Box wird
   darin zentriert). So liegt oberhalb der Falz nur die Storno-Ansicht; der
   Seiten-Footer folgt erst darunter beim Scrollen. */
.cdt-storno-overlay {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-sizing: border-box !important;
	padding: 20px !important;
	background: rgba(0, 0, 0, 0.5) !important;
	min-height: 100vh !important;
	min-height: 100dvh !important;
	/* Aus der (ggf. schmalen) Theme-Inhaltsspalte auf volle Fensterbreite
	   ausbrechen, damit die 100vh-Ansicht die ganze Breite füllt. */
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}
.cdt-storno-overlay .cdt-notice {
	width: 100% !important;
	max-width: 460px !important;
	margin: 0 !important;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3) !important;
}
/* Die Storno-Box liegt außerhalb von .cdt und würde sonst die Theme-Schrift
   erben, deren Metrik die Buchstaben abschneidet. Plugin-Schriftart erzwingen. */
.cdt-storno-overlay,
.cdt-storno-overlay *,
.cdt-notice,
.cdt-notice * {
	font-family: 'Segoe UI', Arial, sans-serif !important;
}
/* Meldungs-Boxen im Storno-Overlay sehen aus wie die übrigen Boxen (weiß mit
   Rahmen), nicht rot/grün eingefärbt. */
.cdt-storno-overlay .cdt-notice--ok,
.cdt-storno-overlay .cdt-notice--error {
	background: #fff !important;
	color: inherit !important;
	border: 1px solid var(--cdt-border, #d9d9d9) !important;
}
.cdt-notice--confirm {
	background: #fff !important;
	color: inherit !important;
	border: 1px solid var(--cdt-border, #d9d9d9) !important;
}
/* Innenabstand/Rundung der Box gegen Theme-Overrides absichern. */
.cdt-storno-overlay .cdt-notice,
.cdt-notice--confirm {
	padding: 20px 22px !important;
	border-radius: var(--cdt-radius, 12px) !important;
}
.cdt-notice__title {
	margin: 0 0 12px !important;
	font-size: 1.05rem !important;
	line-height: 1.5;
}
/* Manche Themes erzwingen per höherer Spezifität eine sehr enge Zeilenhöhe auf
   Absätze (z. B. line-height: 1), wodurch Ober-/Unterkanten der Buchstaben
   abgeschnitten werden. Hier gegen Theme-Overrides absichern. */
.cdt-storno-overlay .cdt-notice .cdt-notice__title,
.cdt-notice--confirm .cdt-notice__title {
	line-height: 1.5 !important;
}
.cdt-notice__form {
	margin: 0;
}
.cdt-notice__actions {
	display: flex !important;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 4px;
}
.cdt-notice__actions--center {
	justify-content: center !important;
}
.cdt-notice__actions--center .cdt-notice__btn {
	flex: 0 1 auto;
	min-width: 120px;
}
.cdt-notice__actions .cdt-notice__form {
	flex: 1 1 140px;
}
.cdt-notice__actions .cdt-notice__form .cdt-notice__btn {
	width: 100%;
}
.cdt-notice__btn {
	appearance: none;
	border: none;
	border-radius: var(--cdt-radius, 8px) !important;
	padding: 8px 16px !important;
	font: inherit;
	font-size: 0.9rem !important;
	font-weight: 700 !important;
	cursor: pointer;
}
.cdt-notice__btn--danger {
	background: #b00020 !important;
	color: #fff !important;
}
.cdt-notice__btn--danger:hover {
	background: #8f001a !important;
}
.cdt-notice__btn--ghost {
	flex: 1 1 140px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	text-decoration: none !important;
	background: transparent !important;
	color: var(--cdt-heading, #1a1a1a) !important;
	border: 1px solid var(--cdt-border, #d9d9d9) !important;
}
.cdt-notice__btn--ghost:hover {
	background: #f4f4f4;
}

/* Erfolg */
.cdt__step--done {
	background: #fff;
	border: 1px solid var(--cdt-border);
	border-radius: var(--cdt-radius);
	box-shadow: var(--cdt-shadow);
	padding: 28px 24px;
}
.cdt__success-box {
	display: flex;
	align-items: flex-start;
	gap: 16px;
}
.cdt__check {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: #e7f5ec;
	color: #1c6b3c;
	font-size: 1.4rem;
	font-weight: 700;
}
.cdt__success {
	font-size: 1.08rem;
	margin: 0;
	align-self: center;
	color: var(--cdt-text);
}

/* Desktop: Submit nicht über volle Breite strecken */
@media ( min-width: 560px ) {
	.cdt__submit {
		width: auto;
		min-width: 200px;
	}
}

/* Eigenständiger CTA-Button [cd_termine_button] – exakt wie der
   "absenden"-Button des Kontaktformulars auf ibesichstg: goldene Fläche
   (#ae9d51) mit dunklem 2px-Rahmen (#333023), dunkle Grossbuchstaben,
   quadratische Ecken. Kein Hover-Effekt (wie beim absenden-Button). */
.cdt-cta-wrap {
	display: flex;
	justify-content: center;
	margin: 24px 0;
}
.cdt-cta {
	display: inline-block;
	box-sizing: border-box;
	background-color: #ae9d51;
	color: #333023;
	border: 2px solid #333023;
	border-radius: 0;
	padding: 15px 30px;
	font-family: 'Roboto', 'Segoe UI', Arial, sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	text-transform: uppercase;
	text-decoration: none;
	text-align: center;
	cursor: pointer;
}
.cdt-cta-empty {
	text-align: center;
	color: #9a9a9a;
}

/* -------------------------------------------------------------------------
   Theme-Isolation (wie im Admin). Auf dem Live-Theme (Elementor) erzwingen
   fremde Regeln GROSSSCHREIBUNG, aufgeblaehte line-height und faerben
   button:hover/:focus/:active pink (#c36). Mit .cdt-Prefix (0,2,0) +
   !important je Button-Zustand zurueckgeholt, damit das CD erhalten bleibt.
   ------------------------------------------------------------------------- */
.cdt .cdt__submit,
.cdt .cdt__loc-btn,
.cdt .cdt__time,
.cdt .cdt__cal-nav,
.cdt .cdt__cal-day,
.cdt .cdt__back {
	text-transform: none !important;
	letter-spacing: normal !important;
	line-height: normal !important;
}
.cdt .cdt__submit,
.cdt .cdt__loc-btn {
	font-size: 0.95rem !important;
}
.cdt .cdt__cal-nav {
	font-size: 1.3rem !important;
	line-height: 1 !important;
}

/* Eigene Hintergruende in ALLEN Interaktionszustaenden erzwingen (gegen #c36). */
.cdt .cdt__submit,
.cdt .cdt__submit:focus,
.cdt .cdt__submit:focus-visible,
.cdt .cdt__submit:active {
	background-color: var(--cdt-accent) !important;
}
.cdt .cdt__submit:hover {
	background-color: var(--cdt-accent-dark) !important;
}

.cdt .cdt__loc-btn,
.cdt .cdt__loc-btn:focus,
.cdt .cdt__loc-btn:focus-visible,
.cdt .cdt__loc-btn:active {
	background-color: #fff !important;
}
.cdt .cdt__loc-btn:hover:not(.is-fixed):not(.is-disabled) {
	background-color: var(--cdt-hover) !important;
}
.cdt .cdt__loc-btn.is-active {
	background-color: var(--cdt-accent) !important;
}
.cdt .cdt__loc-btn.is-disabled,
.cdt .cdt__loc-btn.is-disabled:hover,
.cdt .cdt__loc-btn.is-disabled:focus,
.cdt .cdt__loc-btn:disabled {
	background-color: #f4f4f4 !important;
	color: #9a9a9a !important;
}

.cdt .cdt__time,
.cdt .cdt__time:focus,
.cdt .cdt__time:active {
	background-color: #fff !important;
}
.cdt .cdt__time:hover,
.cdt .cdt__time:focus-visible {
	background-color: var(--cdt-hover) !important;
}

.cdt .cdt__cal-nav,
.cdt .cdt__cal-nav:focus,
.cdt .cdt__cal-nav:active {
	background-color: #fff !important;
}
.cdt .cdt__cal-nav:hover:not(:disabled) {
	background-color: var(--cdt-hover) !important;
}

.cdt .cdt__cal-day,
.cdt .cdt__cal-day:focus,
.cdt .cdt__cal-day:active {
	background-color: var(--cdt-accent-soft) !important;
}
.cdt .cdt__cal-day:hover {
	background-color: #e9e1c4 !important;
}
.cdt .cdt__cal-day.is-selected,
.cdt .cdt__cal-day.is-selected:focus,
.cdt .cdt__cal-day.is-selected:active {
	background-color: var(--cdt-accent) !important;
}

.cdt .cdt__back,
.cdt .cdt__back:hover,
.cdt .cdt__back:focus,
.cdt .cdt__back:active {
	background: none !important;
}

/* Eigenstaendiger CTA-Button [cd_termine_button]: goldener "absenden"-Stil
   (wie das Kontaktformular auf ibesichstg) gegen fremde Theme-Regeln
   (pinker :active-Hintergrund, eigene Rahmen/Radien) durchsetzen. */
.cdt-cta {
	background-color: #ae9d51 !important;
	border: 2px solid #333023 !important;
	border-radius: 0 !important;
	color: #333023 !important;
	text-transform: uppercase !important;
	letter-spacing: normal !important;
}
.cdt-cta:hover,
.cdt-cta:focus,
.cdt-cta:active {
	background-color: #ae9d51 !important;
	color: #333023 !important;
}

/* -------------------------------------------------------------------------
   CTA-Overlay: [cd_termine_button] oeffnet die Buchung als Layer.
   Mobil = Vollbild, Desktop = zentrierte, schwebende Dialogbox.
   ------------------------------------------------------------------------- */
html.cdt-noscroll,
html.cdt-noscroll body {
	overflow: hidden !important;
}
.cdt-overlay {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: flex-start;
	justify-content: center;
}
.cdt-overlay[hidden] {
	display: none;
}
.cdt-overlay__backdrop {
	position: absolute;
	inset: 0;
	background: rgba( 20, 20, 20, 0.55 );
}
.cdt-overlay__dialog {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 820px;
	min-height: 100%;   /* Mobil: Vollbild-Layer (kein versehentliches Schliessen daneben). */
	max-height: 100%;
	background: #ffffff;
	box-shadow: 0 10px 40px rgba( 0, 0, 0, 0.3 );
}
.cdt-overlay__scroll {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	/* Oben extra Platz, damit der Inhalt nicht unter den Schliessen-Button (oben rechts) rutscht. */
	padding: 3rem 1.25rem 2rem;
}
/* Im Dialog nicht noch einmal zentrieren/breiten-begrenzen. */
.cdt-overlay__scroll .cdt {
	margin: 0;
	max-width: none;
}
/* Im Overlay keine Ueberschrift (der Schliessen-Button reicht als Kontext). */
.cdt-overlay__scroll .cdt__head {
	display: none;
}
.cdt-overlay .cdt-overlay__close {
	position: absolute;
	top: 0.35rem;
	right: 0.5rem;
	z-index: 2;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0;
	border: 0 !important;
	border-radius: 50%;
	background: none !important;
	color: #555555 !important;
	font-size: 1.9rem;
	line-height: 1 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	cursor: pointer;
}
.cdt-overlay .cdt-overlay__close:hover,
.cdt-overlay .cdt-overlay__close:focus,
.cdt-overlay .cdt-overlay__close:focus-visible,
.cdt-overlay .cdt-overlay__close:active {
	background-color: rgba( 0, 0, 0, 0.08 ) !important;
	color: #111111 !important;
}

@media ( min-width: 782px ) {
	.cdt-overlay {
		align-items: center;
		padding: 2rem;
	}
	.cdt-overlay__dialog {
		min-height: 0;   /* Desktop: schwebende Box, Hoehe nach Inhalt. */
		max-height: calc( 100% - 4rem );
		border-radius: 12px;
	}
}
