/**
 * Cookiebot consent banner, styled to the Nuvu palette.
 *
 * Assumes the Multilevel banner template in the Overlay position (set under
 * Banner in the Cookiebot dashboard). That template supplies the Consent /
 * Details / About tabs and the Deny, Customize and Allow all buttons; the rules
 * below only restyle them.
 *
 * Cookiebot serves its own stylesheet from its CDN after the theme's, so every
 * rule here needs !important to take effect.
 *
 * Palette: forest green #132622, volt yellow #f2ff7a, cream #fffefb.
 */

#CybotCookiebotDialog {
	--nuvu-green: #132622;
	--nuvu-green-lift: #1b332e;
	--nuvu-volt: #f2ff7a;
	--nuvu-cream: #fffefb;
	--nuvu-line: rgba(255, 254, 251, .18);
}

/* -------------------------------------------------------------------------
 * Branding
 * ---------------------------------------------------------------------- */

#CybotCookiebotDialogPoweredbyCybot,
#CybotCookiebotDialogPoweredByText,
#CybotCookiebotDialogPoweredbyImage,
.CybotCookiebotDialogPoweredbyLink,
[id^="CybotCookiebotDialogPoweredby"],
.CookieDeclarationPoweredbyLink,
#CookiebotWidget {
	display: none !important;
}

/* -------------------------------------------------------------------------
 * Panel
 * ---------------------------------------------------------------------- */

#CybotCookiebotDialogBodyUnderlay {
	background: rgba(19, 38, 34, .72) !important;
	opacity: 1 !important;
}

#CybotCookiebotDialog {
	background: var(--nuvu-green) !important;
	color: var(--nuvu-cream) !important;
	font-family: "Alcyone", "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
	max-width: 1040px !important;
	width: calc(100% - 3rem) !important;
	max-height: 82vh !important;
	top: 50% !important;
	left: 50% !important;
	right: auto !important;
	bottom: auto !important;
	transform: translate(-50%, -50%) !important;
	border: 1px solid var(--nuvu-line) !important;
	border-radius: 4px !important;
	box-shadow: 0 24px 64px rgba(19, 38, 34, .45) !important;
	padding: 0 !important;
}

#CybotCookiebotDialogHeader {
	display: none !important;
}

#CybotCookiebotDialogBodyContent,
.CybotCookiebotDialogContentWrapper,
#CybotCookiebotDialogTabContent {
	background: transparent !important;
	padding: 2rem 2.5rem !important;
}

/* -------------------------------------------------------------------------
 * Tabs
 * ---------------------------------------------------------------------- */

#CybotCookiebotDialogNav,
#CybotCookiebotDialogTabContent {
	border-color: var(--nuvu-line) !important;
}

#CybotCookiebotDialogNav {
	background: transparent !important;
	border-bottom: 1px solid var(--nuvu-line) !important;
	padding: 0 2.5rem !important;
}

.CybotCookiebotDialogNavItemLink {
	color: rgba(255, 254, 251, .7) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	letter-spacing: .02em !important;
	padding: 1.25rem .5rem !important;
	border: 0 !important;
	border-bottom: 2px solid transparent !important;
	background: transparent !important;
}

.CybotCookiebotDialogNavItemLink:hover {
	color: var(--nuvu-cream) !important;
}

.CybotCookiebotDialogNavItemLink.CybotCookiebotDialogActive {
	color: var(--nuvu-volt) !important;
	border-bottom-color: var(--nuvu-volt) !important;
}

/* -------------------------------------------------------------------------
 * Type
 * ---------------------------------------------------------------------- */

#CybotCookiebotDialogBodyContentTitle,
#CybotCookiebotDialogDetailBodyContentTextAbout h2,
.CybotCookiebotDialogBodyLevelButtonDescription,
#CybotCookiebotDialogDetailBodyContentCookieContainerTypes .CybotCookiebotDialogDetailBodyContentCookieProvider {
	color: var(--nuvu-cream) !important;
}

#CybotCookiebotDialogBodyContentTitle {
	font-size: 18px !important;
	font-weight: 600 !important;
	letter-spacing: -.01em !important;
	margin-bottom: .75rem !important;
}

#CybotCookiebotDialogBodyContentText,
#CybotCookiebotDialogDetailBodyContentTextAbout,
#CybotCookiebotDialogDetailBodyContentTextAbout p,
.CybotCookiebotDialogDetailBodyContentCookieTypeTableContainer,
#CybotCookiebotDialogDetailBodyContentCookieContainerTypes {
	color: rgba(255, 254, 251, .82) !important;
	font-size: 15px !important;
	line-height: 1.6 !important;
}

#CybotCookiebotDialog a,
#CybotCookiebotDialogDetailBodyContentTextAbout a {
	color: var(--nuvu-volt) !important;
	text-decoration: underline !important;
	text-underline-offset: 3px !important;
}

/* Close control. */
#CybotCookiebotDialogBodyButtonDecline.CybotCookiebotDialogBodyButtonIcon,
.CybotCookiebotDialogClose,
#CybotCookiebotDialogHeaderClose,
#CybotCookiebotDialog .CybotCookiebotDialogBodyButtonIcon svg {
	color: var(--nuvu-volt) !important;
	fill: var(--nuvu-volt) !important;
	opacity: 1 !important;
}

/* -------------------------------------------------------------------------
 * Buttons
 * ---------------------------------------------------------------------- */

#CybotCookiebotDialogBodyButtonsWrapper,
#CybotCookiebotDialogBodyLevelButtonsSelectPane {
	display: flex !important;
	flex-direction: row !important;
	gap: 1rem !important;
	background: transparent !important;
	border: 0 !important;
	padding: 0 2.5rem 2rem !important;
	margin: 0 !important;
}

#CybotCookiebotDialogBodyButtonsWrapper a,
#CybotCookiebotDialogBodyButtonsWrapper button,
#CybotCookiebotDialogBodyLevelButtonCustomize {
	flex: 1 1 0 !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: .95rem 1.5rem !important;
	font-family: inherit !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	letter-spacing: .01em !important;
	border-radius: 2px !important;
	border: 1px solid var(--nuvu-volt) !important;
	background: transparent !important;
	color: var(--nuvu-cream) !important;
	text-decoration: none !important;
	transition: background-color .18s ease, color .18s ease !important;
}

#CybotCookiebotDialogBodyButtonsWrapper a:hover,
#CybotCookiebotDialogBodyButtonsWrapper button:hover,
#CybotCookiebotDialogBodyLevelButtonCustomize:hover {
	background: rgba(242, 255, 122, .12) !important;
}

/* Primary action. */
#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll,
#CybotCookiebotDialogBodyButtonAccept {
	background: var(--nuvu-volt) !important;
	color: var(--nuvu-green) !important;
	border-color: var(--nuvu-volt) !important;
}

#CybotCookiebotDialogBodyLevelButtonLevelOptinAllowAll:hover,
#CybotCookiebotDialogBodyButtonAccept:hover {
	background: #e6f75c !important;
	color: var(--nuvu-green) !important;
}

/* -------------------------------------------------------------------------
 * Details tab: category toggles and tables
 * ---------------------------------------------------------------------- */

#CybotCookiebotDialogDetailBody,
#CybotCookiebotDialogDetailBodyContent,
.CybotCookiebotDialogBodyLevelButtonWrapper,
#CybotCookiebotDialogBodyLevelWrapper,
.CybotCookiebotScrollContainer,
.CybotCookiebotDialogDetailBodyContentTab {
	background: transparent !important;
	border-color: var(--nuvu-line) !important;
	color: var(--nuvu-cream) !important;
}

.CybotCookiebotDialogBodyLevelButtonDescription,
.CybotCookiebotDialogDetailBodyContentCookieTypeTable th,
.CybotCookiebotDialogDetailBodyContentCookieTypeTable td {
	color: rgba(255, 254, 251, .82) !important;
	border-color: var(--nuvu-line) !important;
}

.CybotCookiebotDialogBodyLevelButtonSlider {
	background: rgba(255, 254, 251, .25) !important;
}

input:checked + .CybotCookiebotDialogBodyLevelButtonSlider {
	background: var(--nuvu-volt) !important;
}

.CybotCookiebotDialogBodyLevelButtonSlider:before {
	background: var(--nuvu-green) !important;
}

.CybotCookiebotDialogDetailBodyContentCookieContainerButton,
.CybotCookiebotDialogDetailBodyContentCookieProvider {
	color: var(--nuvu-cream) !important;
	background: transparent !important;
}

/* -------------------------------------------------------------------------
 * Small screens
 * ---------------------------------------------------------------------- */

@media (max-width: 700px) {
	#CybotCookiebotDialog {
		width: calc(100% - 1.5rem) !important;
		max-height: 88vh !important;
	}

	#CybotCookiebotDialogNav {
		padding: 0 1.25rem !important;
	}

	.CybotCookiebotDialogNavItemLink {
		font-size: 13px !important;
		padding: 1rem .4rem !important;
	}

	#CybotCookiebotDialogBodyContent,
	.CybotCookiebotDialogContentWrapper,
	#CybotCookiebotDialogTabContent {
		padding: 1.5rem 1.25rem !important;
	}

	#CybotCookiebotDialogBodyButtonsWrapper,
	#CybotCookiebotDialogBodyLevelButtonsSelectPane {
		flex-direction: column !important;
		gap: .625rem !important;
		padding: 0 1.25rem 1.5rem !important;
	}
}
