/**
 * ZZ Cookie Consent — неутрален функционален CSS (двуслоен, D-7/P-7).
 *
 * Слой 1: функционален скелет (layout, позициониране, достъпност).
 * Слой 2: override-ваеми CSS vars с ПРИЛИЧНИ НЕУТРАЛНИ default-и → банерът
 *         изглежда добре БЕЗ тема стилизация. Брандът override-ва vars-овете
 *         в темата (scope .zz-cookie*), без да пипа този файл.
 *
 * P-4: [hidden]{display:none!important}. P-10: нула чужди ресурси/шрифтове.
 * Нула CLS: banner-ът е fixed overlay (не е в потока, не размества съдържание).
 *
 * v1.3.3: добавен .zz-cookie-revoke--mini (кръгло 44px SVG копче след
 *   consent; mask-image cookie иконка през currentColor; bottom чете
 *   var(--zzc-dock-offset,12px) за бъдещ dock offset).
 * v1.3.5: dock променливата преименувана --lare-dock-bottom → --zzc-dock-offset (неутралност, P-13).
 */

/* --------------------------------------------------------------------- *
 *  Слой 2 — override-ваеми vars (неутрални default-и; брандът ги сменя)
 * --------------------------------------------------------------------- */
.zz-cookie-banner,
.zz-cookie-revoke {
	--zzc-bg: #ffffff;
	--zzc-fg: #1a1a1a;            /* контраст спрямо #fff ≈ 17:1 (≥4.5:1) */
	--zzc-muted: #4a4a4a;         /* контраст спрямо #fff ≈ 8.9:1 */
	--zzc-border: #d6d6d6;
	--zzc-accent: #1a1a1a;        /* near-black CTA — неутрален, без бранд */
	--zzc-accent-fg: #ffffff;     /* текст върху accent — контраст ≈ 17:1 */
	--zzc-btn-bg: #f2f2f2;        /* вторичен бутон фон */
	--zzc-btn-fg: #1a1a1a;
	--zzc-focus: #1a5fd0;         /* видим фокус — контраст спрямо #fff ≈ 4.9:1 */
	--zzc-radius: 6px;
	--zzc-gap: 12px;
	--zzc-maxw: 920px;
	--zzc-shadow: 0 -2px 16px rgba( 0, 0, 0, 0.12 );
	--zzc-z: 99999;
}

/* --------------------------------------------------------------------- *
 *  Визуално скрито, но достъпно за screen reader (име на dialog-а)
 * --------------------------------------------------------------------- */
.zz-cookie-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
	border: 0;
}

/* --------------------------------------------------------------------- *
 *  P-4 — скрит елемент наистина скрит (наследен инвариант)
 * --------------------------------------------------------------------- */
.zz-cookie-banner[hidden],
.zz-cookie-panel[hidden],
.zz-cookie-revoke[hidden] {
	display: none !important;
}

/* --------------------------------------------------------------------- *
 *  Banner — fixed долна лента (нула CLS: извън потока, overlay)
 * --------------------------------------------------------------------- */
.zz-cookie-banner {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: var( --zzc-z );
	box-sizing: border-box;
	background: var( --zzc-bg );
	color: var( --zzc-fg );
	border-top: 1px solid var( --zzc-border );
	box-shadow: var( --zzc-shadow );
	padding: 16px;
	font-size: 15px;
	line-height: 1.5;
}

.zz-cookie__inner {
	box-sizing: border-box;
	max-width: var( --zzc-maxw );
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: var( --zzc-gap );
}

.zz-cookie__title {
	margin: 0;
	font-size: 1.1em;
	font-weight: 700;
	color: var( --zzc-fg );
}

.zz-cookie__text {
	margin: 0;
	color: var( --zzc-muted );
}

.zz-cookie__policy {
	color: var( --zzc-fg );
	text-decoration: underline;
}

/* --------------------------------------------------------------------- *
 *  Бутони — D-симетрия: Приеми/Откажи равни (еднакъв размер/тегло)
 * --------------------------------------------------------------------- */
.zz-cookie__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var( --zzc-gap );
}

.zz-cookie__btn {
	box-sizing: border-box;
	min-height: 44px;          /* target size ≥24px (с запас за докосване) */
	min-width: 120px;
	padding: 10px 18px;
	border: 1px solid var( --zzc-border );
	border-radius: var( --zzc-radius );
	background: var( --zzc-btn-bg );
	color: var( --zzc-btn-fg );
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

/* Приеми и Откажи са РАВНИ — нарочно еднакъв стил (анти dark pattern). */
.zz-cookie__btn--accept,
.zz-cookie__btn--reject {
	background: var( --zzc-accent );
	color: var( --zzc-accent-fg );
	border-color: var( --zzc-accent );
}

/* Настройки = вторичен (по-дискретен, но не скрит). */
.zz-cookie__btn--settings {
	background: var( --zzc-btn-bg );
	color: var( --zzc-btn-fg );
}

.zz-cookie__btn:hover {
	opacity: 0.92;
}

/* --------------------------------------------------------------------- *
 *  Preference center (втори слой)
 * --------------------------------------------------------------------- */
.zz-cookie-panel {
	margin-top: 4px;
	padding-top: var( --zzc-gap );
	border-top: 1px solid var( --zzc-border );
	display: flex;
	flex-direction: column;
	gap: var( --zzc-gap );
}

.zz-cookie__cat {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.zz-cookie__toggle {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
	cursor: pointer;
}

.zz-cookie__check {
	width: 20px;
	height: 20px;
	flex: 0 0 auto;
}

.zz-cookie__check:disabled {
	cursor: not-allowed;
}

.zz-cookie__cat-desc {
	margin: 0;
	padding-left: 28px;
	color: var( --zzc-muted );
	font-size: 0.92em;
}

.zz-cookie__panel-actions {
	display: flex;
}

/* --------------------------------------------------------------------- *
 *  Footer revoke линк — дискретен, но видим (механизъм за оттегляне)
 * --------------------------------------------------------------------- */
.zz-cookie-revoke {
	position: fixed;
	left: 12px;
	bottom: 12px;
	z-index: calc( var( --zzc-z ) - 1 );
	min-height: 32px;
	padding: 6px 12px;
	border: 1px solid var( --zzc-border );
	border-radius: var( --zzc-radius );
	background: var( --zzc-bg );
	color: var( --zzc-muted );
	font: inherit;
	font-size: 13px;
	cursor: pointer;
	opacity: 0.85;
}

.zz-cookie-revoke:hover {
	opacity: 1;
}

/* --------------------------------------------------------------------- *
 *  Mini режим — кръгло SVG копче (само след валиден consent; класът се
 *  добавя от JS). Решава покриването на landing CTA текста от широката
 *  лента. Иконата е inline mask-image (cookie мотив) през currentColor →
 *  нула външни заявки (P-10), нула emoji (I-19). Видимият текст се скрива
 *  (font-size:0); достъпното име идва от aria-label (JS).
 * --------------------------------------------------------------------- */
.zz-cookie-revoke--mini {
	width: 44px;
	height: 44px;
	min-height: 44px;
	padding: 0;
	border-radius: 50%;
	font-size: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	bottom: var( --zzc-dock-offset, 12px );
}

.zz-cookie-revoke--mini::before {
	content: "";
	width: 22px;
	height: 22px;
	background-color: var( --zzc-muted );
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5a9.5 9.5 0 1 0 9.5 9.5 4 4 0 0 1-5-5 4 4 0 0 1-4.5-4.5z'/%3E%3Cpath d='M9 9h.01M14.5 13.5h.01M9.5 15.5h.01M15 9.5h.01'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.5a9.5 9.5 0 1 0 9.5 9.5 4 4 0 0 1-5-5 4 4 0 0 1-4.5-4.5z'/%3E%3Cpath d='M9 9h.01M14.5 13.5h.01M9.5 15.5h.01M15 9.5h.01'/%3E%3C/svg%3E");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

/* --------------------------------------------------------------------- *
 *  Видим фокус индикатор (P-12 — контраст ≥3:1)
 * --------------------------------------------------------------------- */
.zz-cookie-banner :focus-visible,
.zz-cookie-revoke:focus-visible,
.zz-cookie__check:focus-visible {
	outline: 3px solid var( --zzc-focus );
	outline-offset: 2px;
}

/* Fallback за браузъри без :focus-visible. */
.zz-cookie-banner :focus,
.zz-cookie-revoke:focus {
	outline: 3px solid var( --zzc-focus );
	outline-offset: 2px;
}

/* --------------------------------------------------------------------- *
 *  Mobile-first: на тесни екрани бутоните на пълна ширина (лесни за палец)
 * --------------------------------------------------------------------- */
@media ( max-width: 600px ) {
	.zz-cookie__btn {
		flex: 1 1 100%;
	}
}

/* По-широки екрани: бутоните в ред, подравнени вдясно. */
@media ( min-width: 601px ) {
	.zz-cookie__actions {
		justify-content: flex-end;
	}
}

/* --------------------------------------------------------------------- *
 *  prefers-reduced-motion — без насилствена анимация (P-12)
 * --------------------------------------------------------------------- */
@media ( prefers-reduced-motion: reduce ) {
	.zz-cookie-banner,
	.zz-cookie-revoke {
		transition: none !important;
		animation: none !important;
	}
}
