/* Banner de consentimiento de cookies (CMP). --fuente-ui en todo el bloque:
   es texto funcional/legal, el mismo criterio que excluye botones, formularios
   y textos profesionales de la tipografía condensada en el resto del sitio. */

.indf-cookies {
	position: fixed;
	left: 16px;
	right: 16px;
	/* PWA/standalone (sección 36): en un iPhone con home-indicator o un
	   Android con barra de gestos, un banner fijo al borde inferior puede
	   quedar debajo de esa zona del sistema -max() mantiene los 16px de
	   siempre en un navegador normal (donde env() no aplica) y añade el
	   hueco real del safe-area cuando sí existe. */
	bottom: max( 16px, env( safe-area-inset-bottom, 16px ) );
	z-index: 999;
	max-width: 620px;
	margin: 0 auto;
	background: var(--indf-negro);
	color: var(--indf-crema);
	border: 2px solid var(--indf-turquesa);
	border-radius: var(--radio);
	padding: 18px 20px;
	font-family: var(--fuente-ui);
	box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.25);
}

.indf-cookies__texto {
	font-size: 14px;
	line-height: 1.5;
	margin: 0 0 14px;
}

.indf-cookies__panel {
	margin: 0 0 14px;
	padding: 12px 0 0;
	border-top: 1px solid rgba(243, 233, 201, 0.2);
}

.indf-cookies__fila {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	margin: 0 0 8px;
	cursor: pointer;
}

.indf-cookies__necesarias {
	font-size: 12px;
	opacity: 0.7;
	margin: 0 0 10px;
}

.indf-cookies__botones {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.indf-cookies__boton {
	font-family: var(--fuente-ui);
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	padding: 10px 16px;
	border-radius: var(--radio);
	border: 2px solid var(--indf-crema);
	background: transparent;
	color: var(--indf-crema);
	cursor: pointer;
}

/* Hotfix Ronda 1 (secciones 20/21): Aceptar y Rechazar deben tener EXACTAMENTE
   el mismo peso visual -mismo tamaño, mismo grosor, misma jerarquía, ambos en
   primera capa. Antes "Aceptar todas" era un botón relleno (--primario) y
   "Rechazar todas" compartía el estilo discreto de "Configurar"
   (--secundario), dándole menos peso -exactamente el dark pattern que pide
   evitar. Ahora ambos son botones rellenos, mismo padding/tipografía/borde,
   solo con colores distintos; "Configurar" (--secundario) queda como la
   única opción con tratamiento más discreto, al ser una tercera acción
   distinta (expandir opciones), no una alternativa a aceptar/rechazar. */
.indf-cookies__boton--primario {
	background: var(--indf-turquesa);
	border-color: var(--indf-turquesa);
	color: var(--indf-negro);
}

.indf-cookies__boton--rechazar {
	background: var(--indf-crema);
	border-color: var(--indf-crema);
	color: var(--indf-negro);
}

.indf-cookies__boton:focus-visible {
	outline: 3px solid var(--indf-turquesa);
	outline-offset: 2px;
}

@media (max-width: 480px) {
	.indf-cookies {
		left: 10px;
		right: 10px;
		bottom: 10px;
		padding: 16px;
	}

	.indf-cookies__botones {
		flex-direction: column;
	}

	.indf-cookies__boton {
		width: 100%;
		text-align: center;
	}
}