/* Consentimiento de cookies — Textilizate.
   Usa las variables de color del tema activo (theme.json) para adoptar la marca:
   --wp--preset--color--{ink,paper,cyan,magenta,line}. Con fallbacks neutros. */

.tzcc {
	--tzcc-ink: var(--wp--preset--color--ink, #0A0F1E);
	--tzcc-paper: var(--wp--preset--color--paper, #ffffff);
	--tzcc-accent: var(--wp--preset--color--magenta, #EC008C);
	--tzcc-accent2: var(--wp--preset--color--cyan, #00BCD4);
	--tzcc-line: rgba(255, 255, 255, 0.18);
	position: fixed;
	inset: 0;
	z-index: 99999;
	pointer-events: none;
	font-family: inherit;
}
.tzcc[hidden] { display: none; }

/* Barra inferior */
.tzcc__bar {
	pointer-events: auto;
	position: fixed;
	left: 1rem;
	right: 1rem;
	bottom: 1rem;
	margin: 0 auto;
	max-width: 1100px;
	display: flex;
	gap: 1.25rem;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	background: var(--tzcc-ink);
	color: var(--tzcc-paper);
	border: 1px solid var(--tzcc-line);
	border-radius: 16px;
	padding: 1rem 1.25rem;
	box-shadow: 0 18px 50px rgba(10, 15, 30, 0.35);
}
.tzcc__bar[hidden] { display: none; }
.tzcc__text { flex: 1 1 320px; min-width: 260px; }
.tzcc__title { margin: 0 0 0.25rem; font-weight: 800; font-size: 1rem; }
.tzcc__desc { margin: 0; font-size: 0.8125rem; line-height: 1.5; color: rgba(255, 255, 255, 0.75); }
.tzcc__desc a { color: var(--tzcc-accent2); text-decoration: underline; }

.tzcc__actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }

/* Botones */
.tzcc__btn {
	cursor: pointer;
	border-radius: 999px;
	padding: 0.6rem 1.15rem;
	font-weight: 700;
	font-size: 0.8125rem;
	line-height: 1;
	border: 1px solid var(--tzcc-line);
	background: transparent;
	color: var(--tzcc-paper);
	transition: background-color 0.15s ease, color 0.15s ease, transform 0.05s ease;
}
.tzcc__btn--ghost:hover { background: rgba(255, 255, 255, 0.1); }
.tzcc__btn--primary {
	background: var(--tzcc-accent);
	border-color: var(--tzcc-accent);
	color: var(--tzcc-paper);
}
.tzcc__btn--primary:hover { filter: brightness(1.08); }
.tzcc__btn:active { transform: translateY(1px); }

/* Scrim + panel de preferencias */
.tzcc__scrim {
	pointer-events: auto;
	position: fixed;
	inset: 0;
	background: rgba(10, 15, 30, 0.55);
	backdrop-filter: blur(2px);
}
.tzcc__scrim[hidden] { display: none; }

.tzcc__panel {
	pointer-events: auto;
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: min(540px, calc(100vw - 2rem));
	max-height: calc(100vh - 2rem);
	overflow-y: auto;
	background: var(--tzcc-ink);
	color: var(--tzcc-paper);
	border: 1px solid var(--tzcc-line);
	border-radius: 18px;
	padding: 1.5rem;
	box-shadow: 0 24px 70px rgba(10, 15, 30, 0.5);
}
.tzcc__panel[hidden] { display: none; }
.tzcc__panel-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.tzcc__close {
	cursor: pointer; background: none; border: 0; color: var(--tzcc-paper);
	font-size: 1.5rem; line-height: 1; padding: 0.25rem;
}

.tzcc__cat { padding: 0.85rem 0; border-top: 1px solid var(--tzcc-line); }
.tzcc__cat-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; }
.tzcc__cat-label { font-weight: 700; font-size: 0.9375rem; }
.tzcc__cat-desc { margin: 0.4rem 0 0; font-size: 0.8125rem; line-height: 1.5; color: rgba(255, 255, 255, 0.7); }
.tzcc__always { font-size: 0.6875rem; font-weight: 700; color: var(--tzcc-accent2); text-transform: uppercase; letter-spacing: 0.06em; }
.tzcc__toggle { width: 1.15rem; height: 1.15rem; accent-color: var(--tzcc-accent); cursor: pointer; }

.tzcc__panel-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 1.25rem; }
.tzcc__panel-actions .tzcc__btn { flex: 1 1 auto; text-align: center; }

@media (max-width: 600px) {
	.tzcc__bar { flex-direction: column; align-items: stretch; }
	.tzcc__actions .tzcc__btn { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
	.tzcc__btn { transition: none; }
}
