/**
 * Cookiebot consent dialog: compact, anchored bottom-right.
 *
 * Cookiebot's own dialog CSS comes from consent.cookiebot.com, is injected after
 * our stylesheet, and marks its declarations !important — so a plain
 * `#CybotCookiebotDialog` rule loses on source order. Every selector below adds
 * the `[data-template]` attribute so it outranks Cookiebot's on specificity
 * instead, which holds no matter when their stylesheet lands.
 */

#CybotCookiebotDialog[data-template] {
	inset: auto 20px 20px auto !important;
	transform: none !important;
	width: 340px !important;
	max-width: calc(100vw - 32px) !important;
	max-height: calc(100vh - 40px) !important;
	font-size: 0.8125rem !important;
	border-radius: 10px !important;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18) !important;
}

/* Header: "by Usercentrics" badge only, so it can be tight. */
#CybotCookiebotDialog[data-template] #CybotCookiebotDialogHeader {
	padding: 6px 12px !important;
}

#CybotCookiebotDialog[data-template] #CybotCookiebotDialogPoweredbyImage {
	max-height: 14px !important;
}

#CybotCookiebotDialog[data-template] #CybotCookiebotDialogNav a {
	padding: 7px 4px !important;
	font-size: 11px !important;
}

/* The details/about tabs are long; let them scroll inside the box. */
#CybotCookiebotDialog[data-template] #CybotCookiebotDialogTabContent {
	overflow-y: auto !important;
}

#CybotCookiebotDialog[data-template] #CybotCookiebotDialogBodyContent {
	padding: 10px 12px !important;
}

#CybotCookiebotDialog[data-template] #CybotCookiebotDialogBodyContentTitle {
	font-size: 13px !important;
	margin-bottom: 5px !important;
}

#CybotCookiebotDialog[data-template] #CybotCookiebotDialogBodyContentText {
	font-size: 11px !important;
	line-height: 1.45 !important;
	max-height: 104px !important;
	overflow-y: auto !important;
}

/*
 * Consent categories: Cookiebot lays the four out in a single row, which only
 * fits its 900px dialog. Wrap them into a 2x2 grid at our width.
 */
#CybotCookiebotDialog[data-template] #CybotCookiebotDialogBodyFieldsetInnerContainer {
	flex-wrap: wrap !important;
}

#CybotCookiebotDialog[data-template] #CybotCookiebotDialogBodyFieldsetInnerContainer > * {
	flex: 1 0 50% !important;
}

#CybotCookiebotDialog[data-template] .CybotCookiebotDialogBodyLevelButtonWrapper {
	padding: 8px 6px !important;
}

#CybotCookiebotDialog[data-template] .CybotCookiebotDialogBodyLevelButtonLabel {
	margin-bottom: 2px !important;
}

#CybotCookiebotDialog[data-template] .CybotCookiebotDialogBodyLevelButtonDescription {
	font-size: 10.5px !important;
}

#CybotCookiebotDialog[data-template] .CybotCookiebotDialogBodyLevelButtonSliderWrapper {
	transform: scale(0.85) !important;
	height: 27px !important;
}

/* Buttons: two per row; the odd one out grows to fill the last row. */
#CybotCookiebotDialog[data-template] #CybotCookiebotDialogFooter {
	padding: 8px 12px !important;
}

#CybotCookiebotDialog[data-template] #CybotCookiebotDialogBodyButtonsWrapper {
	flex-direction: row !important;
	flex-wrap: wrap !important;
	gap: 5px !important;
}

#CybotCookiebotDialog[data-template] .CybotCookiebotDialogBodyButton {
	flex: 1 0 calc(50% - 3px) !important;
	width: auto !important;
	margin: 0 !important;
	padding: 8px 6px !important;
	font-size: 11.5px !important;
}