/* EC Consent: Banner im elemente-clemente-Look (Farben wie bisher beim CCM19-Theme). */

.ec-consent[hidden] { display: none !important; }

.ec-consent {
	position: fixed;
	z-index: 2147483000;
	left: 24px;
	bottom: 24px;
	width: min(440px, calc(100vw - 48px));
	max-height: calc(100vh - 48px);
	overflow: auto;
	overscroll-behavior: contain;
	background: #f8f6f2;
	color: #1c1c1a;
	border: 1px solid #e5e0d8;
	box-shadow: 0 10px 40px rgba(28, 28, 26, 0.15);
	font-family: inherit;
	font-size: 13px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

.ec-consent--settings {
	width: min(560px, calc(100vw - 48px));
}

.ec-consent__box { padding: 22px 22px 16px; }

.ec-consent__title {
	margin: 0 0 10px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.02em;
	color: #1c1c1a;
	text-transform: none;
}

.ec-consent__text,
.ec-consent__cat p {
	margin: 0 0 16px;
	font-size: 12.5px;
	color: #1c1c1a;
}

/* Ablehnen und Akzeptieren sind bewusst gleich gestaltet (keine Hervorhebung einer Option).
   #ec-consent vor den Button-Regeln: das Theme setzt body :is(button) und Hello Elementor button:focus. */
.ec-consent__actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin: 0 0 12px;
}

#ec-consent .ec-consent__btn {
	white-space: normal;
	text-transform: none;
	appearance: none;
	margin: 0;
	padding: 10px 14px;
	min-height: 42px;
	font: inherit;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.03em;
	line-height: 1.2;
	cursor: pointer;
	background: #1c1c1a;
	color: #f8f6f2;
	border: 1px solid #1c1c1a;
	border-radius: 0;
	box-shadow: none;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

#ec-consent .ec-consent__btn:hover {
	background: #7a7570;
	border-color: #7a7570;
	color: #f8f6f2;
}

#ec-consent .ec-consent__btn:focus {
	color: #f8f6f2;
	background: #1c1c1a;
}

#ec-consent .ec-consent__btn--ghost,
#ec-consent .ec-consent__btn--ghost:focus {
	grid-column: 1 / -1;
	background: #f8f6f2;
	color: #1c1c1a;
}

#ec-consent .ec-consent__btn--ghost:hover {
	background: #1c1c1a;
	border-color: #1c1c1a;
	color: #f8f6f2;
}

.ec-consent__btn:focus-visible,
.ec-consent a:focus-visible,
.ec-consent summary:focus-visible,
.ec-consent__switch:focus-visible {
	outline: 2px solid #1c1c1a;
	outline-offset: 2px;
}

.ec-consent__links {
	display: flex;
	gap: 16px;
	margin: 0;
	font-size: 11.5px;
}

.ec-consent a {
	color: #1c1c1a;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.ec-consent a:hover { color: #6b665f; }

.ec-consent__meta {
	margin: 0 0 10px;
	font-size: 11px;
	color: #6b665f;
	word-break: break-all;
}

.ec-consent__meta code {
	font-size: 11px;
	background: none;
	padding: 0;
	color: inherit;
}

/* Kategorien */
.ec-consent__cats { margin: 0 0 16px; border-top: 1px solid #e5e0d8; }

.ec-consent__cat {
	padding: 14px 0 12px;
	border-bottom: 1px solid #e5e0d8;
}

.ec-consent__cat p { margin: 6px 0 8px; color: #3a3833; }

.ec-consent__cat-head {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ec-consent__cat-title {
	flex: 1;
	font-size: 13.5px;
	font-weight: 600;
	cursor: pointer;
	margin: 0;
}

.ec-consent__always {
	font-size: 11px;
	color: #6b665f;
}

/* Schalter */
.ec-consent__switch {
	appearance: none;
	-webkit-appearance: none;
	position: relative;
	flex: 0 0 auto;
	width: 40px;
	height: 22px;
	margin: 0;
	border-radius: 11px;
	background: #d9d3c9;
	border: 0;
	cursor: pointer;
	transition: background 0.2s ease;
}

.ec-consent__switch::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #fdfcf9;
	transition: transform 0.2s ease;
}

.ec-consent__switch:checked { background: #1c1c1a; }
.ec-consent__switch:checked::after { transform: translateX(18px); }
.ec-consent__switch:disabled { opacity: 0.45; cursor: not-allowed; }

.ec-consent__details summary {
	cursor: pointer;
	font-size: 11.5px;
	text-decoration: underline;
	text-underline-offset: 2px;
	color: #3a3833;
}

.ec-consent__services {
	list-style: none;
	margin: 10px 0 0;
	padding: 0;
}

.ec-consent__services li {
	margin: 0 0 10px;
	padding: 10px 12px;
	background: #fdfcf9;
	border: 1px solid #e5e0d8;
	font-size: 11.5px;
}

.ec-consent__services dl {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: 2px 10px;
	margin: 6px 0 0;
}

.ec-consent__services dt { color: #6b665f; }
.ec-consent__services dd { margin: 0; }

@media (max-width: 600px) {
	.ec-consent,
	.ec-consent--settings {
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		max-height: 85vh;
		border-left: 0;
		border-right: 0;
		border-bottom: 0;
	}
	.ec-consent__box { padding: 18px 16px calc(14px + env(safe-area-inset-bottom)); }
}

@media (prefers-reduced-motion: reduce) {
	.ec-consent * { transition: none !important; }
}

@media print {
	.ec-consent { display: none !important; }
}
