/* ==========================================================================
   Банер згоди на cookie (Complianz) у стилі сайту.
   Плагін віддає власні стилі з високою специфічністю та інлайновими
   значеннями з налаштувань, тому подекуди потрібен !important.
   Значення — з дизайн-системи: картка як Panel (22, e-03), кнопки як Button.
   ========================================================================== */

#cmplz-cookiebanner-container .cmplz-cookiebanner {
	max-width: 460px;
	padding: 28px !important;
	background: #FBF7EE !important;
	border: 0 !important;
	border-radius: 22px !important;
	box-shadow: inset 0 0 0 1px rgba(14, 31, 21, .15), var(--e-03) !important;
	font-family: var(--f-body) !important;
	color: var(--t-primary);
	/* Плагін відступає від краю 10px — тримаємо сітковий крок 24. */
	right: 24px !important;
	bottom: 24px !important;
}

/* --- Шапка ---------------------------------------------------------------- */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-header {
	margin-bottom: 0;
	padding: 0;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-title {
	font: var(--ty-h5) !important;
	letter-spacing: var(--tr-h5);
	color: #0E1F15 !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close {
	width: 32px; height: 32px;
	display: flex; align-items: center; justify-content: center;
	border-radius: var(--r-pill);
	color: #6E7F73;
	transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close:hover { background: #EAE2D2; color: #0E1F15; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close svg { width: 13px; height: 13px; }

/* Роздільники плагіна нам не потрібні — картка й так зібрана. */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-divider { display: none !important; }

/* --- Текст ---------------------------------------------------------------- */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-body { padding: 0; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-message {
	/* Complianz задає width: calc(--cmplz_banner_width - 42px); наш падінг інший — текст вилазив за картку. */
	width: 100%;
	margin-top: 12px;
	font: var(--ty-body-s) !important;
	letter-spacing: var(--tr-body-s);
	color: #3B4D42 !important;
}

/* --- Категорії ------------------------------------------------------------ */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-categories { width: 100%; margin-top: 18px; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category {
	padding: 12px 14px;
	background: #F4EDDF;
	border-radius: var(--r-md);
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category + .cmplz-category { margin-top: 8px; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category-title {
	font: var(--ty-label) !important;
	letter-spacing: var(--tr-label);
	color: #0E1F15 !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-always-active {
	font: var(--ty-caption) !important;
	color: #6E7F73 !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-description,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-description span {
	font: var(--ty-caption) !important;
	letter-spacing: var(--tr-caption);
	color: #4E5F54 !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-category-toggle { color: #3B4D42; }

/* Перемикач категорії у фірмовому зеленому */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-label::before,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-banner-checkbox .cmplz-label { border-color: var(--b-light-strong) !important; }
#cmplz-cookiebanner-container .cmplz-cookiebanner input[type="checkbox"]:checked + .cmplz-label::before,
#cmplz-cookiebanner-container .cmplz-cookiebanner input[type="checkbox"]:checked + .cmplz-label::after {
	background-color: var(--c-green-600) !important;
	border-color: var(--c-green-600) !important;
}

/* --- Кнопки --------------------------------------------------------------- */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 20px;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn {
	flex: 1 0 auto;
	min-width: 0;
	height: 48px;
	padding-inline: 22px !important;
	border-radius: var(--r-md) !important;
	font: var(--ty-btn) !important;
	letter-spacing: var(--tr-btn);
	border: 0 !important;
	transition: background-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-accept {
	background: var(--c-green-600) !important;
	color: #fff !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-accept:hover { background: var(--c-green-700) !important; }

/* «Прийняти» — єдина основна дія; решта кнопок вторинні. */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-deny,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences {
	background: transparent !important;
	color: var(--t-primary) !important;
	box-shadow: inset 0 0 0 1.5px var(--c-green-800) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-deny:hover,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences:hover { background: #E9E3D6 !important; }

#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences {
	flex: 1 0 100%;
	background: transparent !important;
	color: var(--c-green-700) !important;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences:hover {
	background: #E9E3D6 !important;
	color: var(--c-green-800) !important;
}

/* --- Посилання ------------------------------------------------------------ */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links { margin-top: 14px; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links a,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-link {
	font: var(--ty-caption) !important;
	letter-spacing: var(--tr-caption);
	color: var(--t-link) !important;
	text-decoration: underline;
	text-underline-offset: 2px;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links a:hover { color: var(--c-green-800) !important; }
/* Порожнє посилання на неіснуючий документ */
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links a:empty { display: none; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-links li:has(a:empty) { display: none; }

/* --- Кнопка повторного виклику -------------------------------------------- */
/*
 * Плагін ховає вкладку на 35px за край екрана і висуває її на hover.
 * Тримаємо її видимою повністю: закруглюємо лише верх — читається як вкладка.
 */
#cmplz-manage-consent .cmplz-btn.cmplz-manage-consent {
	height: auto !important;
	padding: 10px 18px !important;
	right: 24px !important;
	bottom: 0 !important;
	background: #FBF7EE !important;
	border-radius: var(--r-pill) var(--r-pill) 0 0 !important;
	box-shadow: inset 0 0 0 1px rgba(14, 31, 21, .15), var(--e-01) !important;
	font: var(--ty-label) !important;
	color: var(--t-primary) !important;
	border: 0 !important;
	animation: none !important;
}
#cmplz-manage-consent .cmplz-btn.cmplz-manage-consent:hover { background: #F4EDDF !important; }

@media (max-width: 767px) {
	#cmplz-cookiebanner-container .cmplz-cookiebanner {
		max-width: none;
		/* Плагін розтягує банер на всю ширину екрана — лишаємо поля. */
		left: 12px !important;
		right: 12px !important;
		bottom: 12px !important;
		width: auto !important;
		padding: 20px !important;
		border-radius: 18px !important;
	}
	/* Плагін ховає заголовок вужче за 425px — нам він потрібен завжди. */
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-title { display: block !important; }
	/*
	 * Під 768px плагін вмикає flex-direction: column. У колонці flex-basis
	 * рахується від висоти, тому «flex: 1 0 100%» робив кнопки на весь екран,
	 * а wrap розкладав їх у два стовпці. Тому тут — явний стовпчик.
	 */
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-buttons {
		flex-direction: column;
		flex-wrap: nowrap;
	}
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn,
	#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences {
		flex: 0 0 auto;
		width: 100%;
	}
}