/**
 * CCM19 – FF-Branding (Einstellfenster).
 * Widget + Summoner aus. Control Panel: kompakt, klickbar, FF-Typo.
 */

.ccm-root .ccm-widget,
.ccm-root .ccm-settings-summoner {
	display: none !important;
	visibility: hidden !important;
	pointer-events: none !important;
}

/* Nach „Cookie-Einstellungen“: verstecktes CCM19-UI wieder sichtbar (liegt oft in .ccm-widget) */
body.ff-ccm19-modal-active .ccm-root .ccm-widget,
body.ff-ccm19-modal-active .ccm-root .ccm-modal-overlay,
body.ff-ccm19-modal-active .ccm-root .ccm-modal,
body.ff-ccm19-modal-active .ccm-root .ccm-control-panel {
	display: block !important;
	visibility: visible !important;
	pointer-events: auto !important;
}

body.ff-ccm19-modal-active .ccm-root .ccm-modal-overlay,
body.ff-ccm19-modal-active .ccm-root .ccm-modal {
	display: flex !important;
}

body.ff-ccm19-modal-active .ccm-root .ccm-settings-summoner {
	display: none !important;
	visibility: hidden !important;
	pointer-events: none !important;
}

/* Overlay */
.ccm-root .ccm-modal-overlay {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 20px !important;
	background: rgba(17, 17, 17, 0.45) !important;
	-webkit-backdrop-filter: blur(6px) !important;
	backdrop-filter: blur(6px) !important;
	z-index: 100001 !important;
	pointer-events: auto !important;
}

/* Vollbild-Wrapper zentriert, Inhalt kompakt */
.ccm-root .ccm-modal {
	position: fixed !important;
	inset: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	padding: 20px !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	pointer-events: auto !important;
	z-index: 100002 !important;
	overflow: visible !important;
}

.ccm-root .ccm-modal-inner,
.ccm-root .ccm-control-panel {
	display: block !important;
	position: relative !important;
	inset: auto !important;
	transform: none !important;
	width: min(560px, calc(100vw - 40px)) !important;
	max-width: 560px !important;
	max-height: min(70vh, 520px) !important;
	margin: 0 auto !important;
	padding: 0 !important;
	background: #fff !important;
	color: #111 !important;
	border: 1px solid #e8e8e8 !important;
	border-radius: 12px !important;
	box-shadow: 0 12px 48px rgba(0, 0, 0, 0.18) !important;
	overflow: hidden !important;
	pointer-events: auto !important;
	font-family: 'Barlow Semi Condensed', sans-serif !important;
}

.ccm-root .ccm-modal-inner {
	overflow-y: auto !important;
	max-height: min(70vh, 520px) !important;
}

/* Zweck-Zeilen (CCM19: input + label) */
.ccm-root .ccm-control-panel--purpose {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 12px !important;
	padding: 10px 0 !important;
	margin: 0 !important;
	border: none !important;
	border-bottom: 1px solid #eee !important;
}

.ccm-root .ccm-control-panel--purpose:last-child {
	border-bottom: none !important;
}

.ccm-root .ccm-control-panel--purpose > input[type='checkbox'] {
	order: 2 !important;
	flex-shrink: 0 !important;
}

.ccm-root .ccm-control-panel--purpose > label {
	order: 1 !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
}

.ccm-root .ccm-modal h2,
.ccm-root .ccm-modal h3,
.ccm-root .ccm-modal h4,
.ccm-root .ccm-control-panel h2,
.ccm-root .ccm-control-panel h3,
.ccm-root .ccm-control-panel h4 {
	font-size: 15px !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	border: none !important;
	margin: 0 0 6px !important;
}

/* Typo – einheitlich, keine wilden Größen */
.ccm-root .ccm-modal--header,
.ccm-root .ccm-modal--title,
.ccm-root .ccm-widget--title,
.ccm-root .ccm-control-panel--title {
	font-family: 'Barlow Condensed', 'Barlow Semi Condensed', sans-serif !important;
	font-size: 17px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	color: #111 !important;
	text-decoration: none !important;
	border-bottom: 1px solid #e8e8e8 !important;
	padding: 14px 16px !important;
	margin: 0 !important;
}

.ccm-root .ccm-modal--body,
.ccm-root .ccm-control-panel--body {
	font-size: 14px !important;
	line-height: 1.45 !important;
	color: #333 !important;
	padding: 12px 16px !important;
}

.ccm-root .ccm-modal p,
.ccm-root .ccm-modal li,
.ccm-root .ccm-modal span,
.ccm-root .ccm-control-panel p,
.ccm-root .ccm-control-panel li,
.ccm-root .ccm-control-panel span {
	font-size: 14px !important;
	line-height: 1.45 !important;
	color: #333 !important;
}

/* Keine Unterstreichung überall – nur Footer-Links */
.ccm-root .ccm-modal a,
.ccm-root .ccm-control-panel a,
.ccm-root .ccm-modal label,
.ccm-root .ccm-control-panel label {
	text-decoration: none !important;
	color: #111 !important;
}

.ccm-root .ccm-modal--footer .ccm-link-container a,
.ccm-root .ccm-link-container a {
	text-decoration: underline !important;
	color: #b43526 !important;
}

/* === Toggles / Schalter – nur Slider stylen, Labels klickbar lassen === */
.ccm-root .ccm-modal input,
.ccm-root .ccm-modal label,
.ccm-root .ccm-modal button,
.ccm-root .ccm-control-panel input,
.ccm-root .ccm-control-panel label,
.ccm-root .ccm-control-panel button,
.ccm-root .ccm-switch,
.ccm-root .ccm-switch * {
	pointer-events: auto !important;
	cursor: pointer !important;
}

.ccm-root label.ccm-switch,
.ccm-root .ccm-switch {
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	flex-shrink: 0 !important;
}

.ccm-root .ccm-switch > input,
.ccm-root label.ccm-switch > input {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	opacity: 0 !important;
	z-index: 3 !important;
	cursor: pointer !important;
}

.ccm-root .ccm-switch--slider {
	display: inline-block !important;
	position: relative !important;
	width: 44px !important;
	height: 24px !important;
	min-width: 44px !important;
	background: #cbcbcb !important;
	border-radius: 999px !important;
	vertical-align: middle !important;
	flex-shrink: 0 !important;
}

.ccm-root .ccm-switch--slider::before {
	content: '' !important;
	position: absolute !important;
	top: 3px !important;
	left: 3px !important;
	width: 18px !important;
	height: 18px !important;
	background: #fff !important;
	border-radius: 50% !important;
	transition: transform 0.15s ease !important;
}

.ccm-root .ccm-switch input:checked + .ccm-switch--slider {
	background: #b43526 !important;
	background-color: #b43526 !important;
}

.ccm-root .ccm-switch input:checked + .ccm-switch--slider::before {
	transform: translateX(20px) !important;
}

/* Checkbox-Zwecke (falls Switch-Typ = Häkchen) */
.ccm-root .ccm-control-panel--purpose input[type='checkbox'],
.ccm-root [class*='purpose'] input[type='checkbox'] {
	position: relative !important;
	opacity: 1 !important;
	width: 18px !important;
	height: 18px !important;
	min-width: 18px !important;
	margin: 0 10px 0 0 !important;
	accent-color: #b43526 !important;
	cursor: pointer !important;
	flex-shrink: 0 !important;
}

.ccm-root .ccm-control-panel--purpose label,
.ccm-root [class*='ccm-control-panel'] label {
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 8px 0 !important;
	background: transparent !important;
	background-color: transparent !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	color: #111 !important;
	cursor: pointer !important;
}

/* Alte kaputte Regel explizit neutralisieren */
.ccm-root .ccm-switch input:checked + label,
.ccm-root .ccm-checkbox input:checked + span {
	background: transparent !important;
	background-color: transparent !important;
	color: #111 !important;
	border: none !important;
}

/* Footer */
.ccm-root .ccm-modal--footer {
	padding: 12px 16px 16px !important;
	border-top: 1px solid #e8e8e8 !important;
	background: #fafafa !important;
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	justify-content: center !important;
}

/* Buttons */
.ccm-root .ccm-modal button,
.ccm-root .ccm-control-panel button,
.ccm-root .ccm-modal--footer .button {
	font-family: 'Barlow Semi Condensed', sans-serif !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	border-radius: 999px !important;
	padding: 10px 18px !important;
	text-transform: none !important;
	text-shadow: none !important;
	box-shadow: none !important;
	cursor: pointer !important;
}

.ccm-root button.ccm--ctrl-primary,
.ccm-root .ccm--ctrl-accept-all,
.ccm-root .ccm--ctrl-save,
.ccm-root .ccm-modal--footer .ccm--ctrl-init {
	background: #b43526 !important;
	background-color: #b43526 !important;
	border: none !important;
	color: #fff !important;
}

.ccm-root button.ccm--ctrl-primary:hover,
.ccm-root .ccm--ctrl-accept-all:hover,
.ccm-root .ccm--ctrl-save:hover {
	background: #942c1f !important;
	background-color: #942c1f !important;
	color: #fff !important;
}

.ccm-root .ccm--ctrl-secondary,
.ccm-root .ccm--ctrl-decline,
.ccm-root .ccm--ctrl-cpanel {
	background: #f3f3f3 !important;
	background-color: #f3f3f3 !important;
	border: none !important;
	color: #111 !important;
}

.ccm-root .ccm-powered-by {
	opacity: 0.45 !important;
	font-size: 11px !important;
}
