/*
 * The fix: WordPress's own components stylesheet (wp-components), which loads
 * on the front end only for logged-in users, sets [role="region"] to
 * position: relative. CookieYes marks its banner as a region, so for logged-in
 * users the banner dropped into the page at the top instead of staying fixed
 * where it's set in CookieYes. This restores fixed positioning for CookieYes's
 * fixed elements, with just enough specificity to beat that rule.
 */
:is(.cky-consent-container, .cky-btn-revisit-wrapper, .cky-overlay, .cky-modal)[role="region"] {
	position: fixed;
}

/*
 * CookieYes banner placement.
 *
 * Fallbacks use :where() (zero specificity) so CookieYes's own rules always
 * win; they only guarantee the banner stays fixed to the configured edge.
 * No colours are set here.
 */
:where(.cky-consent-container) {
	position: fixed;
	box-sizing: border-box;
	z-index: 9999999; /* Above the header, footer and the Darkify switch (99999). */
}

:where(.cky-banner-bottom, .cky-classic-bottom) {
	top: auto;
	bottom: 0;
	left: 0;
}

:where(.cky-banner-top, .cky-classic-top) {
	top: 0;
	bottom: auto;
	left: 0;
}

:where(.cky-box-bottom-left) {
	top: auto;
	bottom: 40px;
	left: 40px;
	right: auto;
}

:where(.cky-box-bottom-right) {
	top: auto;
	bottom: 40px;
	right: 40px;
	left: auto;
}

:where(.cky-box-top-left) {
	top: 40px;
	bottom: auto;
	left: 40px;
	right: auto;
}

:where(.cky-box-top-right) {
	top: 40px;
	bottom: auto;
	right: 40px;
	left: auto;
}

/* Top positions sit below the admin bar for logged-in users. */
.admin-bar .cky-banner-top,
.admin-bar .cky-classic-top {
	top: var(--wp-admin--admin-bar--height, 32px);
}

.admin-bar .cky-box-top-left,
.admin-bar .cky-box-top-right {
	top: calc(40px + var(--wp-admin--admin-bar--height, 32px));
}

/* Small screens: stay inside the viewport. */
@media (max-width: 782px) {
	:where(.cky-box-bottom-left, .cky-box-bottom-right) {
		bottom: 0;
	}

	.admin-bar .cky-banner-top,
	.admin-bar .cky-classic-top {
		top: var(--wp-admin--admin-bar--height, 46px);
	}
}

/* ==========================================================================
 * Dark mode (Darkify)
 * CookieYes colours are configured in the plugin, so in dark mode the banner,
 * preference centre and revisit button are given dark surfaces and the
 * theme's lighter purple for the primary action. Scoped under
 * html.darkify_dark_mode_enabled.
 * ========================================================================== */

html.darkify_dark_mode_enabled .cky-consent-container .cky-consent-bar,
html.darkify_dark_mode_enabled .cky-consent-container,
html.darkify_dark_mode_enabled .cky-modal .cky-preference-center,
html.darkify_dark_mode_enabled .cky-modal .cky-preference-content-wrapper,
html.darkify_dark_mode_enabled .cky-modal .cky-preference-header,
html.darkify_dark_mode_enabled .cky-modal .cky-footer-wrapper,
html.darkify_dark_mode_enabled .cky-modal .cky-prefrence-btn-wrapper {
	background-color: #1e1b18 !important;
	border-color: rgba(234, 223, 206, 0.18) !important;
	color: #eadfce !important;
}

html.darkify_dark_mode_enabled .cky-consent-container :is(.cky-title, .cky-notice-des, .cky-notice-des p, .cky-notice-des a, .cky-preference-title, .cky-preference-content-wrapper p, .cky-accordion-header-des p),
html.darkify_dark_mode_enabled .cky-modal :is(.cky-preference-title, .cky-preference-content-wrapper, .cky-preference-content-wrapper p, .cky-accordion-btn, .cky-always-active, .cky-show-desc-btn, .cky-accordion-header-des, .cky-cookie-des-table li) {
	color: #eadfce !important;
}

html.darkify_dark_mode_enabled .cky-consent-container .cky-notice-des a,
html.darkify_dark_mode_enabled .cky-modal a {
	color: #b48ad4 !important;
}

html.darkify_dark_mode_enabled .cky-modal .cky-accordion,
html.darkify_dark_mode_enabled .cky-modal .cky-accordion-item {
	border-color: rgba(234, 223, 206, 0.18) !important;
}

html.darkify_dark_mode_enabled .cky-consent-container .cky-btn-customize,
html.darkify_dark_mode_enabled .cky-consent-container .cky-btn-reject,
html.darkify_dark_mode_enabled .cky-modal .cky-btn-reject,
html.darkify_dark_mode_enabled .cky-modal .cky-btn-preferences {
	background-color: transparent !important;
	border: 1px solid #b48ad4 !important;
	color: #b48ad4 !important;
}

html.darkify_dark_mode_enabled .cky-consent-container .cky-btn-accept,
html.darkify_dark_mode_enabled .cky-modal .cky-btn-accept {
	background-color: #b48ad4 !important;
	border: 1px solid #b48ad4 !important;
	color: #1a1220 !important;
}

html.darkify_dark_mode_enabled .cky-consent-container .cky-btn:hover,
html.darkify_dark_mode_enabled .cky-modal .cky-btn:hover {
	opacity: 0.88;
}

html.darkify_dark_mode_enabled .cky-btn-revisit-wrapper {
	background-color: #b48ad4 !important;
}

html.darkify_dark_mode_enabled .cky-btn-revisit-wrapper img {
	filter: brightness(0);
}