/* Pie de página sobre fondo oscuro */
.wp-site-blocks footer.wp-block-group a {
	color: var(--wp--preset--color--superficie);
	text-decoration: none;
}

.wp-site-blocks footer.wp-block-group a:hover,
.wp-site-blocks footer.wp-block-group a:focus {
	text-decoration: underline;
}

/* Formulario de newsletter dentro del pie */
.wp-site-blocks footer .tnp-field label {
	font-size: var(--wp--preset--font-size--pequeno);
	color: var(--wp--preset--color--linea);
}

.wp-site-blocks footer .tnp-field input[type="text"],
.wp-site-blocks footer .tnp-field input[type="email"] {
	border: 1px solid var(--wp--preset--color--secundario);
	border-radius: 2px;
	padding: 0.6rem 0.75rem;
	font-family: var(--wp--preset--font-family--cuerpo);
	font-size: var(--wp--preset--font-size--base);
}

.wp-site-blocks footer .tnp-submit,
.wp-site-blocks footer input[type="submit"] {
	background-color: var(--wp--preset--color--accion);
	color: var(--wp--preset--color--superficie);
	border: none;
	border-radius: 2px;
	padding: 0.75rem var(--wp--preset--spacing--3);
	font-family: var(--wp--preset--font-family--cuerpo);
	font-weight: 600;
	cursor: pointer;
}

.wp-site-blocks footer .tnp-submit:hover {
	background-color: var(--wp--preset--color--lienzo);
	color: var(--wp--preset--color--primario);
}

/* Barra superior de la cabecera sobre fondo oscuro */
.wp-site-blocks header .has-secundario-background-color a {
	color: var(--wp--preset--color--superficie);
	text-decoration: none;
}

.wp-site-blocks header .has-secundario-background-color a:hover {
	text-decoration: underline;
}

/* Tarjetas de producto: zonas de altura fija */
.rp-rejilla-productos .wp-block-image {
	display: flex !important;
	align-items: center;
	justify-content: center;
	height: 180px;
	margin: 0;
}

.rp-rejilla-productos .wp-block-image img {
	max-height: 180px;
	width: auto;
	object-fit: contain;
}

/* Bloques editoriales: imagen de altura fija a sangre */
.rp-rejilla-propuestas .wp-block-image {
	margin: 0;
}

.rp-rejilla-propuestas .wp-block-image img {
	width: 100%;
	height: 220px;
	object-fit: cover;
	border-radius: 2px;
}

/* Tira de marcas: logotipos unificados */
.rp-tira-marcas .wp-block-image {
	display: flex !important;
	align-items: center;
	justify-content: center;
	height: 70px;
	margin: 0;
}

.rp-tira-marcas .wp-block-image img {
	max-height: 60px;
	width: auto;
	object-fit: contain;
	filter: grayscale(1);
	opacity: 0.65;
	transition: filter 0.2s ease, opacity 0.2s ease;
}

.rp-tira-marcas .wp-block-image a:hover img,
.rp-tira-marcas .wp-block-image a:focus img {
	filter: grayscale(0);
	opacity: 1;
}

/* Tarjetas de blog: imagen destacada de altura fija */
.rp-rejilla-blog .wp-block-post-featured-image {
	margin: 0;
}

.rp-rejilla-blog .wp-block-post-featured-image img {
	width: 100%;
	height: 180px;
	object-fit: cover;
	border-radius: 2px;
}

/* Tarjetas de blog: altura uniforme en la rejilla */
.rp-rejilla-blog .wp-block-post-template > li {
	display: flex !important;
}

.rp-rejilla-blog .wp-block-post-template > li > .wp-block-group {
	width: 100%;
}

/* Formulario de contacto CF7 */
.rp-contacto .wpcf7 label {
	display: block;
	font-size: var(--wp--preset--font-size--pequeno);
	color: var(--wp--preset--color--secundario);
	margin-bottom: 0.35rem;
}

.rp-contacto .wpcf7 input[type="text"],
.rp-contacto .wpcf7 input[type="email"],
.rp-contacto .wpcf7 input[type="tel"],
.rp-contacto .wpcf7 textarea {
	width: 100%;
	border: 1px solid var(--wp--preset--color--linea);
	border-radius: 2px;
	padding: 0.6rem 0.75rem;
	font-family: var(--wp--preset--font-family--cuerpo);
	font-size: var(--wp--preset--font-size--base);
	background: var(--wp--preset--color--superficie);
	color: var(--wp--preset--color--primario);
}

.rp-contacto .wpcf7 input:focus,
.rp-contacto .wpcf7 textarea:focus {
	outline: 2px solid var(--wp--preset--color--accion);
	outline-offset: 1px;
}

.rp-contacto .wpcf7 input[type="submit"] {
	background-color: var(--wp--preset--color--accion);
	color: var(--wp--preset--color--superficie);
	border: none;
	border-radius: 2px;
	padding: 0.75rem var(--wp--preset--spacing--3);
	font-weight: 600;
	cursor: pointer;
	width: auto;
}

.rp-contacto .wpcf7 input[type="submit"]:hover {
	background-color: var(--wp--preset--color--primario);
}

/* Cuerpo del artículo: lectura sostenida */
.single .wp-block-post-content p,
.single .wp-block-post-content li {
	line-height: 1.7;
}

/* Catálogo: imagen de altura fija */
.rp-rejilla-catalogo .wc-block-components-product-image {
	display: flex !important;
	align-items: center;
	justify-content: center;
	height: 180px;
	margin: 0;
}

.rp-rejilla-catalogo .wc-block-components-product-image img {
	max-height: 180px;
	width: auto;
	object-fit: contain;
}

/* Catálogo: altura uniforme de tarjetas */
.rp-rejilla-catalogo .wp-block-woocommerce-product-template > li {
	display: flex !important;
}

.rp-rejilla-catalogo .wp-block-woocommerce-product-template > li > .wp-block-group {
	width: 100%;
}

/* Páginas: lectura cómoda */
.page .wp-block-post-content p,
.page .wp-block-post-content li {
	line-height: 1.7;
}

/* Plantilla de documento: lectura legal */
.rp-documento .wp-block-table td {
	padding: 0.6rem;
	vertical-align: top;
}

/* Buscador del pie */
.rp-buscador-pie .wp-block-search__input {
	background: var(--wp--preset--color--superficie);
	border: 1px solid var(--wp--preset--color--secundario);
	border-radius: 2px;
	color: var(--wp--preset--color--primario);
	max-width: 420px;
}

.rp-buscador-pie .wp-block-search__button {
	background: var(--wp--preset--color--accion);
	color: var(--wp--preset--color--superficie);
	border: none;
}

.rp-buscador-pie .wp-block-search__inside-wrapper {
	border: none;
	padding: 0;
	max-width: 420px;
}

.rp-buscador-pie .wp-block-search__inside-wrapper {
	display: flex !important;
	align-items: stretch;
	gap: 0;
}

.rp-buscador-pie .wp-block-search__input {
	margin: 0;
	padding: 0.6rem 0.75rem;
	border-right: none;
	border-radius: 2px 0 0 2px;
}

.rp-buscador-pie .wp-block-search__button {
	margin: 0;
	padding: 0 1rem;
	border-radius: 0 2px 2px 0;
	display: flex !important;
	align-items: center;
}

.rp-buscador-pie .wp-block-search {
	max-width: 33%;
}

.rp-buscador-pie .wp-block-search__inside-wrapper {
	max-width: none;
	width: 100%;
}

.rp-buscador-pie .wp-block-search__input {
	flex: 1;
}

/* Menú móvil */
@media (max-width: 781px) {
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		align-items: stretch;
		width: 100%;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
		align-items: stretch;
		text-align: left;
		width: 100%;
	}
}

/* Buscador del pie: ancho completo en móvil */
@media (max-width: 781px) {
	.rp-buscador-pie .wp-block-search {
		max-width: 100%;
	}
}

@media (max-width: 781px) {
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.is-content-justification-right,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		justify-content: flex-start;
	}
}

@media (max-width: 781px) {
	.is-menu-open .wp-block-navigation__submenu-container {
		padding-left: 1.25rem;
	}

	.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		font-size: var(--wp--preset--font-size--pequeno);
		color: var(--wp--preset--color--secundario);
	}
}

/* Destacados dinámicos: imagen de altura fija */
.rp-rejilla-productos .wc-block-components-product-image {
	display: flex !important;
	align-items: center;
	justify-content: center;
	height: 180px;
	margin: 0;
}

.rp-rejilla-productos .wc-block-components-product-image img {
	max-height: 180px;
	width: auto;
	object-fit: contain;
}

.rp-rejilla-productos .wp-block-woocommerce-product-template > li {
	display: flex !important;
}

.rp-rejilla-productos .wp-block-woocommerce-product-template > li > .wp-block-group {
	width: 100%;
}

/* Campos del formulario CF7: borde visible (WCAG 1.4.11) */
.rp-contacto .wpcf7 input[type="text"],
.rp-contacto .wpcf7 input[type="email"],
.rp-contacto .wpcf7 input[type="tel"],
.rp-contacto .wpcf7 textarea {
	border-color: var(--wp--preset--color--tenue);
}

/* Rejilla de blog: reservar el alto cuando falta la imagen destacada */
.rp-rejilla-blog .wp-block-post-template > li > .wp-block-group:not(:has(.wp-block-post-featured-image))::before {
	content: "";
	display: block;
	height: 180px;
	border-radius: 2px;
	background: var(--wp--preset--color--lienzo);
}

/* Rejilla de blog: antetítulo de categoría discreto */
.rp-rejilla-blog .wp-block-post-terms a {
	color: var(--wp--preset--color--tenue);
	text-decoration: none;
}

.rp-rejilla-blog .wp-block-post-terms a:hover,
.rp-rejilla-blog .wp-block-post-terms a:focus {
	color: var(--wp--preset--color--accion);
	text-decoration: underline;
}

/* Menú móvil: submenús en acordeón */
@media (max-width: 781px) {
	.wp-block-navigation__responsive-container.is-menu-open
		li.wp-block-navigation-submenu:not(:has(> .wp-block-navigation-submenu__toggle[aria-expanded="true"]))
		> .wp-block-navigation__submenu-container {
		display: none;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle {
		display: flex;
		align-items: center;
		gap: 0.4rem;
	}

	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu__toggle svg {
		transition: transform 0.2s ease;
	}

	.wp-block-navigation__responsive-container.is-menu-open
		.wp-block-navigation-submenu__toggle[aria-expanded="true"] svg {
		transform: rotate(180deg);
	}
}

/* 404 en móvil: buscador apilado a lo ancho de la columna */
@media (max-width: 781px) {
	.error404 .wp-block-search {
		width: 100%;
		max-width: none;
		align-self: stretch;
	}

	.error404 .wp-block-search__inside-wrapper {
		flex-direction: column;
		align-items: stretch;
		gap: 0.5rem;
		max-width: none;
	}

	.error404 .wp-block-search__input {
		width: 100%;
		border-radius: 2px;
		padding: 0.7rem 0.75rem;
	}

	.error404 .wp-block-search__button {
		width: 100%;
		margin-left: 0;
		border-radius: 2px;
		justify-content: center;
	}
}

/* Estado de envío del formulario de cotización (solo lectores de pantalla) */
.rp-estado-envio {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Botón de envío bloqueado durante la solicitud de cotización */
#request_a_quote_form button:disabled {
	opacity: 1;
	background-color: var(--wp--preset--color--tenue) !important;
	border-color: var(--wp--preset--color--tenue) !important;
	color: var(--wp--preset--color--superficie) !important;
	cursor: wait;
}

/* Ver lista de cotizaciones: acción secundaria en la ficha de producto */
.wp-element-button.elex-raq-view-quote-list-open-btn,
.wp-element-button.elex-raq-view-quote-list-open-btn:hover {
	background-color: transparent !important;
	border: 1px solid var(--wp--preset--color--accion) !important;
	color: var(--wp--preset--color--accion) !important;
}

/* Jerarquía de acciones en la ficha de producto */
.raq_custom_css {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--1);
}


.raq_custom_css .wp-element-button.elex-raq-view-quote-list-open-btn,
.raq_custom_css .wp-element-button.elex-raq-view-quote-list-open-btn:hover {
	background-color: transparent !important;
	border: 1px solid var(--wp--preset--color--accion) !important;
	color: var(--wp--preset--color--accion) !important;
}

/* Corrección de orden: la acción principal va primero */
.raq_custom_css .add_to_quote { order: -1; }

/* Ver lista vuelve a sólido cuando es la única acción de la ficha */
.raq_custom_css:not(:has(.add_to_quote)) .wp-element-button.elex-raq-view-quote-list-open-btn,
.raq_custom_css:not(:has(.add_to_quote)) .wp-element-button.elex-raq-view-quote-list-open-btn:hover {
	background-color: var(--wp--preset--color--accion) !important;
	color: var(--wp--preset--color--superficie) !important;
}
/* Galería de producto: marco estable, imagen centrada, miniaturas uniformes */
.woocommerce-product-gallery .flex-viewport {
	aspect-ratio: 1;
	background: var(--wp--preset--color--superficie);
	margin-bottom: var(--wp--preset--spacing--2);
}

.woocommerce-product-gallery__wrapper {
	height: 100%;
	margin: 0;
}

.woocommerce-product-gallery__image {
	display: flex !important;
	align-items: center;
	justify-content: center;
	height: 512px;
}

.woocommerce-product-gallery__image > a {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

.woocommerce-product-gallery__image img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.woocommerce-product-gallery .flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 200px));
	justify-content: start;
	gap: var(--wp--preset--spacing--1);
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce-product-gallery .flex-control-thumbs li {
	width: auto;
	float: none;
	margin: 0;
}

.woocommerce-product-gallery .flex-control-thumbs img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: contain;
	background: var(--wp--preset--color--superficie);
	cursor: pointer;
}

/* Formulario de contacto: los campos deben respetar el ancho del contenedor */
.wpcf7 .wpcf7-form-control-wrap,
.wpcf7 input.wpcf7-form-control,
.wpcf7 textarea.wpcf7-form-control,
.wpcf7 select.wpcf7-form-control {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
}

/* Botón flotante: volver al inicio */
.rp-subir {
	position: fixed;
	left: var(--wp--preset--spacing--2);
	bottom: var(--wp--preset--spacing--2);
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--wp--preset--color--linea);
	border-radius: 2px;
	background: var(--wp--preset--color--superficie);
	color: var(--wp--preset--color--primario);
	cursor: pointer;
}

.rp-subir[hidden] { display: none; }

.rp-subir:hover {
	background: var(--wp--preset--color--accion);
	border-color: var(--wp--preset--color--accion);
	color: var(--wp--preset--color--superficie);
}

.rp-subir:focus-visible {
	outline: 2px solid var(--wp--preset--color--primario);
	outline-offset: 2px;
}

/* Botón flotante: volver al inicio */
.rp-subir {
	position: fixed;
	left: var(--wp--preset--spacing--2);
	bottom: var(--wp--preset--spacing--2);
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--wp--preset--color--linea);
	border-radius: 2px;
	background: var(--wp--preset--color--superficie);
	color: var(--wp--preset--color--primario);
	cursor: pointer;
}

.rp-subir[hidden] { display: none; }

.rp-subir:hover {
	background: var(--wp--preset--color--accion);
	border-color: var(--wp--preset--color--accion);
	color: var(--wp--preset--color--superficie);
}

.rp-subir:focus-visible {
	outline: 2px solid var(--wp--preset--color--primario);
	outline-offset: 2px;
}

/* Widget de cotización de ELEX: pegarlo a la esquina en pantallas chicas */
@media (max-width: 781px) {
	#elex-rqst-float-minicart-icon {
		right: var(--wp--preset--spacing--2) !important;
		bottom: var(--wp--preset--spacing--2) !important;
	}
}

/* Widget de cotización: oculto cuando la lista está vacía */
#elex-rqst-float-minicart-icon.rp-cotizacion-vacia { display: none; }

/* Buscador del catálogo: apilado en móvil */
@media (max-width: 781px) {
	.wp-block-search__button-outside .wp-block-search__inside-wrapper {
		display: flex !important;
		flex-direction: column;
		gap: var(--wp--preset--spacing--1);
	}

	.wp-block-search__button-outside .wp-block-search__input {
		width: 100%;
	}

	.wp-block-search__button-outside .wp-block-search__button {
		width: 100%;
		margin-left: 0;
	}
}

/* ==========================================================
   Modo oscuro — sigue la preferencia del sistema operativo.
   Redefine las variables de theme.json; todo lo que las use
   se adapta solo. Las excepciones están abajo.
   ========================================================== */
@media (prefers-color-scheme: dark) {

	:root {
		--wp--preset--color--lienzo: #0F1524;
		--wp--preset--color--superficie: #18203A;
		--wp--preset--color--linea: #2E3959;
		--wp--preset--color--tenue: #9AA5C4;
		--wp--preset--color--secundario: #B6C0DC;
		--wp--preset--color--primario: #E4E9F5;
		--wp--preset--color--accion: #7C9AFF;
	}

	/* Bandas que usan primario/secundario como FONDO, no como texto.
	   Al invertir la escala se volverían casi blancas: se fijan a mano. */
	.has-primario-background-color { background-color: #0A0F1C !important; }
	.has-secundario-background-color { background-color: #232C4A !important; }

	.has-primario-background-color.has-superficie-color,
	.has-secundario-background-color.has-superficie-color,
	.has-primario-background-color .has-superficie-color,
	.has-secundario-background-color .has-superficie-color {
		color: #E4E9F5 !important;
	}
}

/* Modo oscuro · pie: el plugin Newsletter trae colores propios */
@media (prefers-color-scheme: dark) {

	footer .tnp-field label,
	footer .tnp-field label span,
	footer label span {
		color: #9AA5C4 !important;
	}

	footer input[type="text"],
	footer input[type="email"],
	footer .tnp-field input {
		background-color: #232C4A !important;
		border: 1px solid #3A456A !important;
		color: #E4E9F5 !important;
	}

	footer input::placeholder {
		color: #7C87A8 !important;
	}
}

/* Modo oscuro · logo: el lockup usa tinta oscura, necesita fondo claro */
@media (prefers-color-scheme: dark) {
	.wp-block-site-logo img {
		background: #FFFFFF;
		padding: 8px 12px;
		border-radius: 2px;
	}
}

/* Modo oscuro · texto claro sobre bandas oscuras fijas.
   'superficie' se usa como color de texto dentro de las bandas de
   primario/secundario. Al invertir la escala queda oscuro sobre oscuro. */
@media (prefers-color-scheme: dark) {
	.has-primario-background-color .has-superficie-color,
	.has-secundario-background-color .has-superficie-color,
	.has-primario-background-color a,
	.has-secundario-background-color a {
		color: #E4E9F5 !important;
	}
}

/* Modo oscuro · campos de formulario en todo el sitio.
   Los controles nativos no heredan la paleta: el navegador les
   aplica negro sobre blanco por defecto. */
@media (prefers-color-scheme: dark) {

	input[type="text"],
	input[type="email"],
	input[type="tel"],
	input[type="url"],
	input[type="search"],
	input[type="number"],
	input[type="date"],
	input[type="password"],
	select,
	textarea {
		background-color: #232C4A;
		border: 1px solid #3A456A;
		color: #E4E9F5;
	}

	select option {
		background-color: #232C4A;
		color: #E4E9F5;
	}

	::placeholder {
		color: #7C87A8;
		opacity: 1;
	}

	input:focus,
	select:focus,
	textarea:focus {
		border-color: #7C9AFF;
		outline-color: #7C9AFF;
	}
}

/* Modo oscuro · tira de marcas: la placa toma el mismo gris que traen
   incrustado los PNG, para que el borde del archivo desaparezca. */
@media (prefers-color-scheme: dark) {
	.rp-tira-marcas .wp-block-image {
		background: #DADFE2;
		border-radius: 2px;
	}
}

/* Modo oscuro · tira de marcas: la opacidad deja pasar el fondo oscuro
   y ensucia el blanco de los PNG. Se atenúa con brillo y contraste
   dentro del propio filtro, que no afecta al fondo del elemento. */
@media (prefers-color-scheme: dark) {
	.rp-tira-marcas .wp-block-image {
		background: #FFFFFF;
		border-radius: 2px;
	}

	.rp-tira-marcas img {
		opacity: 1;
		filter: grayscale(1) contrast(0.65) brightness(1.15);
	}
}
