/**
 * CookieYes (cookie-law-info) huisstijl-skin voor Essence Pillar.
 *
 * De plugin bakt zijn kleuren in inline style=""-attributen op elk
 * bannerelement, dus we overschrijven met !important. Palet en radii
 * volgen de themavariabelen in style.css:
 *   groen #1f3b33, goud #b8874f, beige #f7f3ed, tekst #161e1b, wit.
 */

/* ---- Consentbalk + voorkeurenmodal: groen, witte tekst ---- */
.cky-consent-container .cky-consent-bar,
.cky-preference-center,
.cky-modal .cky-preference-center {
	background-color: #1f3b33 !important;
	border-color: rgba(255, 255, 255, 0.12) !important;
	border-radius: 16px !important;
	color: #ffffff !important;
	font-family: "PT Sans", system-ui, sans-serif !important;
	box-shadow: 0 24px 60px rgba(13, 26, 22, 0.45) !important;
}

/* De .cky-modal schil tekent zijn eigen witte 6px-box achter het
   voorkeurencentrum; herstijl zodat de hoeken kloppen. */
.cky-modal {
	background: #1f3b33 !important;
	border-radius: 16px !important;
	color: #ffffff !important;
	box-shadow: 0 24px 60px rgba(13, 26, 22, 0.45) !important;
}

.cky-title,
.cky-preference-title,
.cky-notice-des,
.cky-notice-des p,
.cky-preference-content-wrapper,
.cky-accordion-header,
.cky-accordion-header-des,
.cky-always-active {
	color: #ffffff !important;
	font-family: "PT Sans", system-ui, sans-serif !important;
}

/* Titels in de banner in de Poltawski-kop */
.cky-title,
.cky-preference-title {
	font-family: "Poltawski Nowy", Georgia, serif !important;
	font-weight: 400 !important;
}

.cky-notice-des,
.cky-notice-des p,
.cky-accordion-header-des,
.cky-preference-content-wrapper {
	color: rgba(255, 255, 255, 0.75) !important;
}

/* Links in de banner in het goud */
.cky-notice-des a,
.cky-preference-content-wrapper a {
	color: #d9b990 !important;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* ---- Knoppen: pill-vormig, on-brand ---- */
.cky-btn {
	border-radius: 100px !important;
	font-family: "Poltawski Nowy", Georgia, serif !important;
	font-weight: 700 !important;
	transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* Primaire actie: goud met witte tekst */
.cky-btn-accept {
	background-color: #b8874f !important;
	border-color: #b8874f !important;
	color: #ffffff !important;
}

/* In de banner staat "Alles accepteren" onder de ghost-knoppen: wat lucht
   erboven. (Niet in de modal, daar staan de knoppen naast elkaar.) */
.cky-consent-bar .cky-btn-accept {
	margin-top: 12px !important;
}
.cky-btn-accept:hover {
	background-color: #ffffff !important;
	border-color: #ffffff !important;
	color: #1f3b33 !important;
}

/* Secundaire acties: ghost (transparant, witte rand) */
.cky-btn-reject,
.cky-btn-customize,
.cky-btn-preferences {
	background-color: transparent !important;
	border-color: rgba(255, 255, 255, 0.5) !important;
	color: #ffffff !important;
}
.cky-btn-reject:hover,
.cky-btn-customize:hover,
.cky-btn-preferences:hover {
	border-color: #b8874f !important;
	color: #d9b990 !important;
}

.cky-btn:focus-visible {
	outline: 2px solid #b8874f !important;
	outline-offset: 2px;
}

/* ---- Voorkeurencentrum ---- */
.cky-preference-header,
.cky-footer-wrapper,
.cky-accordion-item,
.cky-preference-body-wrapper {
	border-color: rgba(255, 255, 255, 0.12) !important;
}

.cky-btn-close span {
	color: #ffffff !important;
}

.cky-accordion-header .cky-accordion-btn,
.cky-accordion-btn {
	color: #ffffff !important;
}

/* Fade boven de footerknoppen: de plugin zet inline een wit verloop,
   dus !important is nodig. */
.cky-footer-shadow {
	background: linear-gradient(180deg, rgba(31, 59, 51, 0) 0%, #1f3b33 100%) !important;
}

/* Categorieschakelaars: goud wanneer aan */
.cky-switch input[type="checkbox"]:checked + label,
.cky-switch input[type="checkbox"]:checked + .cky-switch-slider {
	background-color: #b8874f !important;
}
.cky-always-active {
	color: #d9b990 !important;
}

.cky-accordion-chevron i::before,
.cky-accordion-chevron .cky-chevron-right {
	border-color: rgba(255, 255, 255, 0.65) !important;
}

/* Audit-tabel binnen categorieën */
.cky-audit-table {
	background-color: rgba(255, 255, 255, 0.04) !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	border-radius: 12px !important;
}
.cky-audit-table .cky-empty-cookies-text {
	color: rgba(255, 255, 255, 0.6) !important;
}

/* ---- Zwevende revisit-badge: groene pill ---- */
.cky-btn-revisit-wrapper {
	background-color: #1f3b33 !important;
	box-shadow: 0 10px 24px rgba(13, 26, 22, 0.4) !important;
	transition: transform 0.5s var(--cubic-default, cubic-bezier(0.625, 0.05, 0, 1)) !important;
}
.cky-btn-revisit-wrapper:hover {
	background-color: #2c5045 !important;
}

/* Scroll-bewust: cookieyes-revisit.js voegt .cky-revisit-slide-out toe bij
   omlaag scrollen; de pill glijdt links het beeld uit en komt terug bij
   elke scroll omhoog. */
.cky-btn-revisit-wrapper.cky-revisit-slide-out {
	transform: translateX(calc(-100% - 48px)) !important;
}

@media (prefers-reduced-motion: reduce) {
	.cky-btn-revisit-wrapper {
		transition: none !important;
	}
}

/* ---- Overlay achter de voorkeurenmodal ---- */
.cky-overlay {
	background-color: rgba(13, 26, 22, 0.6) !important;
}
