/* =====================================================================
 * EL BANNER DE COOKIES, VESTIDO DE LA CASA
 *
 * La mecánica la hace WPConsent —bloquear los píxeles antes del sí, guardar
 * la prueba, recordar la elección— y eso no se reescribe: es la parte difícil
 * y delicada. Lo que no sirve es su ASPECTO: barra azul marino, botón amarillo,
 * esquinas redondeadas y su propia marca en un rincón. Nada de eso es Rhino.
 *
 * Aquí solo va la piel. Si mañana se cambia de plugin, se borra este archivo
 * y no se pierde nada más que el vestido.
 *
 * POR QUÉ LOS SELECTORES SON «RAROS»:
 * se cuelgan de `#wpconsent-root` —el único identificador que confirmé en vivo—
 * y de trozos de nombre de clase (`[class*="accept"]`). Escribir la clase
 * exacta sería más limpio de leer y se rompería el día que el plugin la
 * renombre en una actualización. Así aguanta.
 *
 * Y `!important` en casi todo, a propósito: la hoja del plugin carga después
 * y con más peso. Sin él, esto no pinta nada.
 * ===================================================================== */

#wpconsent-root{
	--rh-tinta:#15181c;
	--rh-rojo:#da1921;
	--rh-rojo-hondo:#b3141b;
	--rh-claro:#efece8;
	--rh-amarillo:#FFD21E;
	font-family:'Poppins','Century Gothic',system-ui,Arial,sans-serif !important;
}

/* ── LA BARRA ─────────────────────────────────────────────────────────
   Tinta sobre el sitio, nunca rojo: el rojo de la casa es para comprar.
   Un banner rojo competiría con «Añadir al carrito», que es lo que da de
   comer. */
#wpconsent-root [class*="banner"]{
	background:var(--rh-tinta) !important;
	color:#fff !important;
	border:0 !important;
	border-radius:0 !important;
	box-shadow:none !important;
}

/* La Forma: chaflán, nunca redondeo. Va en la barra interior y no en el
   contenedor fijo, porque recortar el que está pegado al borde de la
   ventana no se ve — el chaflán queda fuera de pantalla. */
#wpconsent-root [class*="banner-body"],
#wpconsent-root [class*="banner-content"],
#wpconsent-root [class*="banner-inner"]{
	clip-path:polygon(13px 0,100% 0,100% calc(100% - 13px),calc(100% - 13px) 100%,0 100%,0 13px);
	background:var(--rh-tinta) !important;
}

#wpconsent-root p,
#wpconsent-root [class*="message"],
#wpconsent-root [class*="description"]{
	color:rgba(255,255,255,.82) !important;
	font-size:12.6px !important;
	line-height:1.45 !important;
	margin:0 !important;
}
#wpconsent-root a:not([class*="button"]){
	color:var(--rh-amarillo) !important;
	font-weight:600 !important;
	text-decoration:underline !important;
}

/* ── LOS BOTONES ──────────────────────────────────────────────────────
   ACEPTAR y RECHAZAR pesan LO MISMO: mismo tamaño, misma tipografía, mismo
   relleno. Solo cambia el color. Un «rechazar» pequeño o en gris es lo que
   sanciona un regulador — y es mentirle al cliente. */
#wpconsent-root button,
#wpconsent-root [class*="button"]{
	font-family:'Oswald','Arial Narrow',sans-serif !important;
	font-weight:700 !important;
	font-size:12.5px !important;
	letter-spacing:.06em !important;
	text-transform:uppercase !important;
	padding:11px 20px !important;
	border:0 !important;
	border-radius:0 !important;
	box-shadow:none !important;
	cursor:pointer !important;
	white-space:nowrap !important;
	clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
}

/* Aceptar: rojo de relleno con letra blanca. */
#wpconsent-root [class*="accept"]{
	background:var(--rh-rojo) !important;
	color:#fff !important;
}
#wpconsent-root [class*="accept"]:hover{ background:var(--rh-rojo-hondo) !important; }

/* Rechazar: blanco con letra tinta. Mismo peso visual que aceptar. */
#wpconsent-root [class*="reject"],
#wpconsent-root [class*="deny"]{
	background:#fff !important;
	color:var(--rh-tinta) !important;
}
#wpconsent-root [class*="reject"]:hover,
#wpconsent-root [class*="deny"]:hover{ background:var(--rh-claro) !important; }

/* Preferencias: es un enlace, no un tercer botón que compita. */
#wpconsent-root [class*="preference"],
#wpconsent-root [class*="settings"]{
	background:transparent !important;
	color:#fff !important;
	text-decoration:underline !important;
	padding:11px 8px !important;
	clip-path:none !important;
}
#wpconsent-root [class*="preference"]:hover,
#wpconsent-root [class*="settings"]:hover{ color:var(--rh-amarillo) !important; }

/* El teclado tiene que verse. Sobre biselado el `outline` se corta, así que
   se marca con el amarillo de foco y separación. */
#wpconsent-root button:focus-visible,
#wpconsent-root a:focus-visible{
	outline:2px solid var(--rh-amarillo) !important;
	outline-offset:2px !important;
}

/* La marca del plugin fuera: en la tienda de un cliente no pinta nada. */
#wpconsent-root [class*="powered"],
#wpconsent-root [class*="branding"],
#wpconsent-root a[href*="wpconsent.com"]{ display:none !important; }

/* ── EL PANEL DE PREFERENCIAS ────────────────────────────────────────── */
#wpconsent-root [class*="preferences-panel"],
#wpconsent-root [class*="modal"]{
	background:#fff !important;
	color:var(--rh-tinta) !important;
	border-radius:0 !important;
	clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px);
}
#wpconsent-root [class*="preferences-panel"] p,
#wpconsent-root [class*="modal"] p{ color:#5f5a54 !important; }
#wpconsent-root [class*="preferences-panel"] h2,
#wpconsent-root [class*="preferences-panel"] h3,
#wpconsent-root [class*="modal"] h2,
#wpconsent-root [class*="modal"] h3{
	font-family:'Oswald','Arial Narrow',sans-serif !important;
	text-transform:uppercase !important;
	color:var(--rh-tinta) !important;
}

/* ── MÓVIL: NUNCA MÁS DEL 15% DE LA PANTALLA ──────────────────────────
   Apilando los tres botones se iba a un tercio del alto. Lado a lado caben,
   y de paso quedan del mismo ancho exacto — la mejor prueba de que pesan
   igual. «Preferencias» baja a su propio renglón para no robarles sitio. */
@media (max-width:782px){
	#wpconsent-root [class*="banner-body"],
	#wpconsent-root [class*="banner-content"],
	#wpconsent-root [class*="banner-inner"]{
		padding:12px 13px 13px !important;
		gap:10px !important;
	}
	#wpconsent-root p,
	#wpconsent-root [class*="message"]{ font-size:11.6px !important; line-height:1.35 !important; }
	#wpconsent-root [class*="buttons"]{
		display:grid !important;
		grid-template-columns:1fr 1fr !important;
		gap:8px !important;
		width:100% !important;
	}
	#wpconsent-root button,
	#wpconsent-root [class*="button"]{
		width:100% !important;
		padding:11px 8px !important;
		font-size:12.5px !important;
	}
	#wpconsent-root [class*="preference"],
	#wpconsent-root [class*="settings"]{
		grid-column:1 / -1 !important;
		padding:2px !important;
		font-size:11.5px !important;
	}
}