/* Aviso de cookies (cookie-consent.php). Usa los tokens de style.css */

.cookieConsent,
.cookieConsent * {
	box-sizing: border-box;
}

.cookieConsent[hidden],
.cookieConsent [hidden] {
	display: none !important;
}

.cookieConsent {
	position: fixed;
	left: 2rem;
	bottom: 2rem;
	z-index: 10000;
	width: min(30rem, calc(100% - 4rem));
	max-height: calc(100svh - 4rem);
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 2rem;
	background-color: var(--borgoña, #4C191E);
	box-shadow: 0 8px 32px rgb(0 0 0 / .18);
	color: var(--white);
	animation: cookieConsentIn .4s var(--cubic-bezier);
}

@keyframes cookieConsentIn {
	from { opacity: 0; transform: translateY(20px); }
	to { opacity: 1; transform: none; }
}

.cookieConsent .cookieConsentTitle {
	margin-bottom: .75rem;
	font-size: 20px;
	font-weight: 400;
	font-variation-settings: 'wght' 400;
	line-height: 120%;
	text-transform: uppercase;
	text-wrap: balance;
}

.cookieConsent .cookieConsentText {
	font-size: 15px;
	line-height: 150%;
	text-wrap: pretty;
}

.cookieConsent a {
	display: inline;
	color: var(--white);
	text-decoration: underline;
	text-underline-offset: .16em;
}

.cookieConsent a::after {
	display: none;
}

.cookieConsent .cookieConsentOptions {
	display: grid;
	gap: 1.25rem;
	margin-top: 1.5rem;
}

.cookieConsent .cookieConsentOption {
	display: grid;
	grid-template-columns: 20px 1fr;
	gap: .9rem;
	align-items: start;
	font-size: 14px;
	line-height: 140%;
	cursor: pointer;
}

.cookieConsent .cookieConsentOption strong {
	display: block;
	margin-bottom: .2rem;
	font-size: 16px;
	font-weight: 600;
	font-variation-settings: 'wght' 600;
}

.cookieConsent .cookieConsentOption input {
	appearance: none;
	width: 20px;
	height: 20px;
	margin: 0;
	border: none;
	border-radius: 0;
	background-color: var(--white);
	cursor: pointer;
}

.cookieConsent .cookieConsentOption input:checked {
	background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234C191E' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M5 12l5 5L19 6'/%3E%3C/svg%3E") center / 14px no-repeat;
}

.cookieConsent .cookieConsentOption:has(input:disabled),
.cookieConsent .cookieConsentOption input:disabled {
	cursor: default;
}

.cookieConsent .cookieConsentOption input:disabled {
	opacity: .6;
}

.cookieConsent .cookieConsentActions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem 1.25rem;
	margin-top: 1.5rem;
}

/* Aceptar, Rechazar y Guardar comparten estilo: ninguna opción destaca sobre otra */
.cookieConsent .cookieConsentButton {
	flex: 1 1 8rem;
	padding: .7rem 1.25rem;
	border: 1px solid var(--white);
	border-radius: 30px;
	background-color: var(--white);
	color: var(--black);
	font: inherit;
	font-size: 15px;
	letter-spacing: inherit;
	cursor: pointer;
	touch-action: manipulation;
	transition: background-color .2s, color .2s, transform .2s var(--cubic-bezier);
}

.cookieConsent .cookieConsentLink {
	flex: 0 0 auto;
	padding: .7rem 0;
	border: none;
	background: none;
	color: var(--white);
	font: inherit;
	font-size: 15px;
	letter-spacing: inherit;
	text-decoration: underline;
	text-decoration-color: rgb(255 255 255 / .5);
	text-underline-offset: .2em;
	cursor: pointer;
	touch-action: manipulation;
	transition: text-decoration-color .2s;
}

.cookieConsent .cookieConsentButton:active {
	transform: scale(.97);
}

@media (min-width:900px) {
	.cookieConsent .cookieConsentButton:hover {
		background-color: transparent;
		color: var(--white);
	}

	.cookieConsent .cookieConsentLink:hover {
		text-decoration-color: var(--white);
	}
}

.cookieConsent :focus-visible {
	outline: 2px solid var(--white);
	outline-offset: 3px;
}

@media (max-width:600px) {
	.cookieConsent {
		left: 0;
		bottom: 0;
		width: 100%;
		max-height: 85svh;
		padding: 1.5rem 20px calc(1.5rem + env(safe-area-inset-bottom));
	}
}

@media (prefers-reduced-motion: reduce) {
	.cookieConsent {
		animation: none;
	}

	.cookieConsent .cookieConsentButton:active {
		transform: none;
	}
}

/* Enlace "Configurar cookies" del footer, igual que los enlaces legales */
footer .legal-pages .cookieSettingsLink {
	padding: 0;
	border: none;
	background: none;
	color: var(--new-green-50);
	font: inherit;
	font-size: 12px;
	letter-spacing: inherit;
	text-transform: uppercase;
	cursor: pointer;
	transition: color .2s;
}

footer .legal-pages .cookieSettingsLink:hover {
	color: var(--white);
}

/* Tabla de la política de cookies (legal.php) */
.legalText .cookies th,
.legalText .cookies td {
	padding: 1rem 1rem 1rem 0;
	text-align: left;
	vertical-align: top;
}

.legalText .cookies th:nth-child(1) { width: 24%; }
.legalText .cookies th:nth-child(2) { width: 14%; }
.legalText .cookies th:nth-child(3) { width: 34%; }
.legalText .cookies th:nth-child(4) { width: 14%; }
.legalText .cookies th:nth-child(5) { width: 14%; }

.legalText .cookieSettingsInline {
	padding: 0;
	border: none;
	background: none;
	color: inherit;
	font: inherit;
	letter-spacing: inherit;
	text-decoration: underline;
	cursor: pointer;
}

/* En móvil cada cookie es un bloque con sus etiquetas */
@media (max-width:700px) {
	.legalText .cookies thead {
		display: none;
	}

	.legalText .cookies table,
	.legalText .cookies tbody,
	.legalText .cookies tr,
	.legalText .cookies td {
		display: block;
		width: auto;
	}

	.legalText .cookies tr {
		padding: 1rem 0;
	}

	.legalText .cookies td {
		padding: .15rem 0;
	}

	.legalText .cookies td::before {
		content: attr(data-label) ": ";
		font-weight: 600;
		font-variation-settings: 'wght' 600;
	}
}
