/* Fabric Boutique styling for the Complianz consent interface. */

.cmplz-cookiebanner {
	--cmplz_banner_background_color: var(--fb-cream);
	--cmplz_banner_border_color: var(--fb-blush);
	--cmplz_banner_border_width: 3px 0 0;
	--cmplz_banner_border_radius: 0;
	--cmplz_text_color: var(--fb-text);
	--cmplz_hyperlink_color: var(--fb-charcoal);
	--cmplz_button_accept_background_color: var(--fb-charcoal);
	--cmplz_button_accept_border_color: var(--fb-charcoal);
	--cmplz_button_accept_text_color: var(--fb-white);
	--cmplz_button_deny_background_color: var(--fb-charcoal);
	--cmplz_button_deny_border_color: var(--fb-charcoal);
	--cmplz_button_deny_text_color: var(--fb-white);
	--cmplz_button_settings_background_color: transparent;
	--cmplz_button_settings_border_color: var(--fb-charcoal);
	--cmplz_button_settings_text_color: var(--fb-charcoal);
	--cmplz_button_border_radius: 0;
	--cmplz_slider_active_color: var(--fb-pink);
	--cmplz_slider_inactive_color: var(--fb-grey);

	position: fixed !important;
	inset: auto 0 0 !important;
	transform: none !important;
	width: 100% !important;
	max-width: none !important;
	max-height: min(90vh, 680px) !important;
	overflow-y: auto !important;
	overscroll-behavior: contain;
	margin: 0 !important;
	padding: 1.4rem max(1.25rem, calc((100vw - var(--fb-container)) / 2 + 1rem)) !important;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(420px, 560px);
	grid-template-rows: repeat(4, auto);
	column-gap: clamp(2rem, 6vw, 6rem);
	row-gap: 0.65rem;
	background: var(--fb-cream) !important;
	border: 0 !important;
	border-top: 3px solid var(--fb-blush) !important;
	border-radius: 0 !important;
	box-shadow: 0 -12px 35px rgba(85, 66, 61, 0.14) !important;
	font-family: var(--fb-font-body) !important;
	color: var(--fb-text) !important;
	z-index: 99999;
}

.cmplz-cookiebanner.cmplz-dismissed {
	display: none !important;
}

.cmplz-cookiebanner .cmplz-header {
	display: block !important;
	grid-column: 1;
	grid-row: 1;
}

.cmplz-cookiebanner .cmplz-logo,
.cmplz-cookiebanner .cmplz-close,
.cmplz-cookiebanner .cmplz-divider {
	display: none !important;
}

.cmplz-cookiebanner .cmplz-title {
	display: block !important;
	font-family: var(--fb-font-heading) !important;
	font-size: clamp(1.6rem, 2.2vw, 2rem) !important;
	font-weight: 500 !important;
	line-height: 1.1 !important;
	text-align: left !important;
	color: var(--fb-charcoal) !important;
}

.cmplz-cookiebanner .cmplz-message {
	max-width: 66ch;
	margin: 0 !important;
	font-family: var(--fb-font-body) !important;
	font-size: 0.86rem !important;
	font-weight: 300;
	line-height: 1.55 !important;
	color: var(--fb-text) !important;
}

.cmplz-cookiebanner .cmplz-body {
	grid-column: 1;
	grid-row: 2;
	min-width: 0;
}

.cmplz-cookiebanner .cmplz-buttons {
	grid-column: 2;
	grid-row: 1 / span 4;
	align-self: center;
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.65rem !important;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn {
	min-height: 46px !important;
	margin: 0 !important;
	padding: 0.75rem 1rem !important;
	border-radius: 0 !important;
	font-family: var(--fb-font-body) !important;
	font-size: 0.72rem !important;
	font-weight: 500 !important;
	line-height: 1.25 !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	box-shadow: none !important;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-accept,
.cmplz-cookiebanner .cmplz-buttons .cmplz-deny {
	background: var(--fb-charcoal) !important;
	border: 1px solid var(--fb-charcoal) !important;
	color: var(--fb-white) !important;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-view-preferences,
.cmplz-cookiebanner .cmplz-buttons .cmplz-save-preferences {
	grid-column: 1 / -1;
	background: transparent !important;
	border: 1px solid var(--fb-charcoal) !important;
	color: var(--fb-charcoal) !important;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn:hover {
	opacity: 0.82;
}

.cmplz-cookiebanner .cmplz-buttons .cmplz-btn:focus-visible,
.cmplz-cookiebanner .cmplz-link:focus-visible,
.fb-footer__cookie-settings:focus-visible {
	outline: 2px solid var(--fb-pink) !important;
	outline-offset: 3px;
}

.cmplz-cookiebanner .cmplz-categories {
	margin-top: 0.35rem;
}

.cmplz-cookiebanner .cmplz-categories .cmplz-category {
	margin: 0 0 0.45rem !important;
	background: var(--fb-white) !important;
	border: 1px solid var(--fb-border);
	border-radius: 0 !important;
}

.cmplz-cookiebanner .cmplz-category-title,
.cmplz-cookiebanner .cmplz-always-active,
.cmplz-cookiebanner .cmplz-description {
	font-family: var(--fb-font-body) !important;
	color: var(--fb-text) !important;
}

.cmplz-cookiebanner .cmplz-links {
	grid-column: 1;
	justify-content: flex-start !important;
}

.cmplz-cookiebanner .cmplz-link {
	font-family: var(--fb-font-body) !important;
	font-size: 0.76rem !important;
	color: var(--fb-charcoal) !important;
	text-underline-offset: 3px;
}

#cmplz-manage-consent {
	display: none !important;
}

.fb-footer__cookie-settings {
	appearance: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	font: inherit;
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.fb-footer__cookie-separator {
	margin: 0 0.55rem;
	color: var(--fb-border);
}

@media (max-width: 782px) {
	.cmplz-cookiebanner {
		grid-template-columns: minmax(0, 1fr);
		grid-template-rows: auto;
		gap: 0.8rem;
		padding: 1.2rem 1rem max(1.2rem, env(safe-area-inset-bottom)) !important;
	}

		.cmplz-cookiebanner .cmplz-header,
		.cmplz-cookiebanner .cmplz-body,
		.cmplz-cookiebanner .cmplz-message,
	.cmplz-cookiebanner .cmplz-categories,
	.cmplz-cookiebanner .cmplz-links,
	.cmplz-cookiebanner .cmplz-buttons {
		grid-column: 1;
		grid-row: auto;
		width: 100% !important;
	}

	.cmplz-cookiebanner .cmplz-buttons {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 430px) {
	.cmplz-cookiebanner .cmplz-title {
		font-size: 1.5rem !important;
	}

	.cmplz-cookiebanner .cmplz-message {
		font-size: 0.8rem !important;
	}
}
