/* style.css */
/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/
/* acceso.css */
/*
 * Ventana de acceso (inc/acceso.php): el acceso de Mi cuenta en una ventana de Bricks.
 *
 * Mismas medidas que «Acceso» en cuenta.css: dos columnas cortadas con línea fina, campos
 * grises de 44 px, etiquetas pequeñas en mayúsculas y botones de radio suave. Solo cambia
 * el marco: la ventana, el velo y la equis. El formulario es el de Bricks (sus estilos van
 * con :where, así que aquí basta con dos clases).
 */

/* ── Ventana ─────────────────────────────────────────────────────────────── */

html .brx-popup.sils-acceso-ventana {
	box-sizing: border-box;
	padding: var(--sils-margen-seguridad);
}

html .brx-popup.sils-acceso-ventana .brx-popup-backdrop {
	background-color: var(--sils-texto);
	transition: opacity 0.2s ease, visibility 0.2s ease;
}

html .brx-popup.sils-acceso-ventana:not(.hide) .brx-popup-backdrop {
	opacity: 0.5;
}

.sils-acceso-ventana .brx-popup-content.brxe-container {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	max-width: 96rem;
	max-height: 100%;
	margin: 0;
	padding: 0;
	border-radius: 0;
	background-color: var(--sils-blanco);
}

.sils-acceso-ventana:not(.hide) .brx-popup-content {
	animation: sils-acceso-entra 0.2s ease-out;
}

@keyframes sils-acceso-entra {
	from {
		opacity: 0;
		transform: translateY(0.8rem);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sils-acceso-ventana:not(.hide) .brx-popup-content {
		animation: none;
	}
}

/* La equis (la pone acceso.js). */
.sils-acceso-ventana .sils-acceso__cerrar,
.sils-acceso-ventana .sils-acceso__cerrar:focus {
	position: absolute;
	top: 0.8rem;
	right: 0.8rem;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 4.4rem;
	height: 4.4rem;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-s, 1.6rem);
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
	transition: color 0.15s ease;
}

.sils-acceso-ventana .sils-acceso__cerrar:hover,
.sils-acceso-ventana .sils-acceso__cerrar:focus-visible {
	background: transparent;
	color: var(--sils-texto);
}

/* En escritorio cae sobre la banda negra de «¿No tienes cuenta?». */
@media (min-width: 768px) {
	.sils-acceso-ventana .sils-acceso__cerrar,
	.sils-acceso-ventana .sils-acceso__cerrar:focus {
		color: color-mix(in srgb, var(--sils-blanco) 70%, transparent);
	}

	.sils-acceso-ventana .sils-acceso__cerrar:hover,
	.sils-acceso-ventana .sils-acceso__cerrar:focus-visible {
		color: var(--sils-blanco);
	}
}

/* ── Columnas ────────────────────────────────────────────────────────────── */

.sils-acceso-ventana .sils-acceso {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	width: 100%;
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs, 1.5rem);
	font-weight: 300;
	line-height: 1.5;
	letter-spacing: var(--sils-ls-texto, .12rem);
}

.sils-acceso-ventana .sils-acceso__col {
	padding: clamp(2.4rem, 4vw, 4.8rem);
}

/* ── «¿No tienes cuenta?»: la misma en la ventana y en Mi cuenta ─────────────
 * La pinta sils_acceso_alta() (inc/acceso.php). Banda negra como la de Profesionales en
 * Conócenos. Sin depender de la ventana: en Mi cuenta manda cuenta.css, así que aquí va
 * todo (tipografía incluida) y se anulan sus líneas de columna. */

.sils-acceso .sils-acceso__col--alta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	border: 0;
	background-color: var(--sils-principal);
	color: var(--sils-blanco);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs, 1.5rem);
	font-weight: 300;
	line-height: 1.5;
	letter-spacing: var(--sils-ls-texto, .12rem);
}

/* En la ventana, Bricks envuelve el atajo: que no cuente. */
.sils-acceso .sils-acceso__col--alta > .brxe-shortcode {
	display: contents;
}

.sils-acceso .sils-acceso__etiqueta {
	display: block;
	margin: 0 0 var(--sils-esp-xs, 1.2rem);
	color: color-mix(in srgb, var(--sils-blanco) 70%, transparent);
	font-size: var(--sils-txt-3xs);
	font-weight: 300;
	line-height: 1.2rem;
	letter-spacing: 0.18rem;
	text-transform: uppercase;
}

.sils-acceso .sils-acceso__col--alta .sils-acceso__titulo {
	margin: 0 0 2rem;
	color: var(--sils-blanco);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-l);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
}

.sils-acceso .sils-acceso__col--alta .sils-acceso__texto {
	margin: 0 0 var(--sils-esp-s, 1.6rem);
	color: color-mix(in srgb, var(--sils-blanco) 80%, transparent);
	font-size: var(--sils-txt-2xs, 1.4rem);
}

/* Las ventajas de la página de Profesionales: filas con línea fina. */
.sils-acceso .sils-acceso__ventajas {
	align-self: stretch;
	margin: var(--sils-esp-2xs, 0.8rem) 0 2.4rem;
	padding: 0;
	border-top: 1px solid color-mix(in srgb, var(--sils-blanco) 20%, transparent);
	list-style: none;
}

.sils-acceso .sils-acceso__ventaja {
	display: flex;
	align-items: center;
	gap: var(--sils-esp-xs, 1.2rem);
	margin: 0;
	padding: var(--sils-esp-xs, 1.2rem) 0;
	border-bottom: 1px solid color-mix(in srgb, var(--sils-blanco) 20%, transparent);
	color: var(--sils-blanco);
	font-size: var(--sils-txt-2xs, 1.4rem);
	line-height: 1.4;
	letter-spacing: var(--sils-ls-texto, .12rem);
}

.sils-acceso .sils-acceso__ventaja i {
	flex: none;
	width: 2rem;
	color: var(--sils-blanco);
	font-size: var(--sils-txt-s, 1.6rem);
	text-align: center;
}

/* Botón blanco (como el de Conócenos); al pasar, de línea. */
.sils-acceso .sils-acceso__boton-linea,
.sils-acceso .sils-acceso__boton-linea:focus {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 4.4rem;
	margin: 0;
	padding: 0 2.4rem;
	border: 1px solid var(--sils-blanco);
	border-radius: var(--sils-radio, 0.4rem);
	background: var(--sils-blanco);
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-boton);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	box-shadow: none;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.sils-acceso .sils-acceso__boton-linea:hover,
.sils-acceso .sils-acceso__boton-linea:focus-visible {
	border-color: var(--sils-blanco);
	background: transparent;
	color: var(--sils-blanco);
}

@media (max-width: 767px) {
	/* Una columna debajo de la otra: sin líneas de columna; las ventajas, en dos. */
	.sils-acceso .sils-acceso__col--alta {
		border: 0;
	}

	.sils-acceso .sils-acceso__ventajas {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: var(--sils-esp-s, 1.6rem);
	}

	.sils-acceso .sils-acceso__ventaja {
		align-items: flex-start;
		gap: var(--sils-esp-2xs, 0.8rem);
		font-size: var(--sils-txt-2xs, 1.4rem);
	}
}

.sils-acceso-ventana .sils-acceso__titulo {
	margin: 0 0 2rem;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-l);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
}

.sils-acceso-ventana .sils-acceso__texto {
	margin: 0 0 var(--sils-esp-s, 1.6rem);
	color: var(--sils-secundario);
	font-size: var(--sils-txt-2xs, 1.4rem);
}

/* ── Formulario ──────────────────────────────────────────────────────────── */

.sils-acceso-ventana .brxe-form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0 var(--sils-esp-s, 1.6rem);
	width: 100%;
}

.sils-acceso-ventana .brxe-form .form-group {
	width: 100%;
	margin: 0 0 var(--sils-esp-s, 1.6rem);
	padding: 0;
}

/* «Recordarme» y «¿Has olvidado la contraseña?», en la misma fila. */
.sils-acceso-ventana .brxe-form .form-group:has(.options-wrapper),
.sils-acceso-ventana .brxe-form .form-group:has(.sils-acceso__olvido) {
	width: auto;
	margin-bottom: 2.4rem;
}

.sils-acceso-ventana .brxe-form .form-group > label {
	display: block;
	margin: 0 0 0.6rem;
	padding: 0;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.1rem;
	text-transform: uppercase;
}

.sils-acceso-ventana .brxe-form .required::after {
	content: "\00a0*";
	padding: 0;
	top: 0;
}

.sils-acceso-ventana .brxe-form input[type="text"],
.sils-acceso-ventana .brxe-form input[type="email"],
.sils-acceso-ventana .brxe-form input[type="password"] {
	box-sizing: border-box;
	width: 100%;
	height: 4.4rem;
	margin: 0;
	padding: 0 var(--sils-esp-xs, 1.2rem);
	border: 0;
	border-radius: 0.5rem;
	background: var(--sils-fondo-imagenes);
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs, 1.5rem);
	font-weight: 300;
	line-height: 1.2;
	letter-spacing: 0.1rem;
	box-shadow: none;
	outline: none;
	transition: box-shadow 0.15s ease;
}

.sils-acceso-ventana .brxe-form input[type="text"]:focus,
.sils-acceso-ventana .brxe-form input[type="email"]:focus,
.sils-acceso-ventana .brxe-form input[type="password"]:focus {
	box-shadow: inset 0 0 0 1px var(--sils-principal);
}

.sils-acceso-ventana .brxe-form .options-wrapper li {
	align-items: center;
	gap: 0;
}

.sils-acceso-ventana .brxe-form .options-wrapper input[type="checkbox"] {
	width: 1.6rem;
	height: 1.6rem;
	margin: 0 var(--sils-esp-2xs, 0.8rem) 0 0;
	top: 0;
	accent-color: var(--sils-principal);
}

.sils-acceso-ventana .brxe-form .options-wrapper label {
	margin: 0;
	color: var(--sils-texto);
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-weight: 300;
	letter-spacing: var(--sils-ls-texto, .12rem);
	text-transform: none;
}

.sils-acceso-ventana .sils-acceso__olvido {
	color: var(--sils-principal);
	font-size: var(--sils-txt-2xs, 1.4rem);
	text-underline-offset: 0.3rem;
}

/* ── Botón: como el «Acceder» de Mi cuenta ───────────────────────────────── */

.sils-acceso-ventana .brxe-form .submit-button-wrapper {
	width: 100%;
	margin: 0;
}

.sils-acceso-ventana .brxe-form button[type="submit"],
.sils-acceso-ventana .brxe-form button[type="submit"]:focus {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--sils-esp-2xs, 0.8rem);
	min-height: 4.4rem;
	margin: 0;
	padding: 0 2.4rem;
	border: 1px solid var(--sils-principal);
	border-radius: var(--sils-radio, 0.4rem);
	background: var(--sils-principal);
	color: var(--sils-blanco);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-boton);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	box-shadow: none;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.sils-acceso-ventana .brxe-form button[type="submit"] {
	width: 100%;
}

.sils-acceso-ventana .brxe-form button[type="submit"]:hover,
.sils-acceso-ventana .brxe-form button[type="submit"]:focus-visible {
	border-color: var(--sils-texto);
	background: var(--sils-texto);
	color: var(--sils-blanco);
}

/* ── Avisos: como los de Mi cuenta ───────────────────────────────────────── */

.sils-acceso-ventana .brxe-form .message {
	order: -1;
	width: 100%;
	margin: 0 0 2.4rem;
	padding: 0;
	border-left: 2px solid var(--sils-principal);
	background: var(--sils-blanco);
	color: var(--sils-texto);
	font-size: var(--sils-txt-2xs, 1.4rem);
	line-height: 1.5;
}

.sils-acceso-ventana .brxe-form .message.error {
	border-left-color: var(--bricks-text-danger);
	background: var(--sils-blanco);
	color: var(--sils-texto);
}

.sils-acceso-ventana .brxe-form .message .text {
	padding: var(--sils-esp-xs, 1.2rem) var(--sils-esp-s, 1.6rem);
}

.sils-acceso-ventana .brxe-form .message .text a {
	color: var(--sils-principal);
}

/* El «bien» no hace falta: la ventana se cierra o la página se recarga. */
.sils-acceso-ventana .brxe-form .message.success {
	display: none;
}

/* ── Bienvenida: al entrar, en lugar del formulario (acceso.js pone las clases) ── */

.sils-acceso-ventana .sils-acceso__bienvenida {
	display: none;
}

.sils-acceso-ventana.is-bienvenida .sils-acceso,
.sils-acceso-ventana.is-bienvenida .sils-acceso__cerrar {
	display: none;
}

.sils-acceso-ventana.is-bienvenida .brx-popup-content.brxe-container {
	max-width: 48rem;
}

.sils-acceso-ventana.is-bienvenida .sils-acceso__bienvenida {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	padding: clamp(4rem, 7vw, 6.4rem) clamp(2.4rem, 5vw, 4.8rem);
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs, 1.5rem);
	font-weight: 300;
	line-height: 1.5;
	letter-spacing: var(--sils-ls-texto, .12rem);
	text-align: center;
	animation: sils-acceso-entra 0.2s ease-out;
}

.sils-acceso-ventana .sils-acceso__bienvenida .brxe-icon {
	display: grid;
	place-items: center;
	width: 5.6rem;
	height: 5.6rem;
	margin: 0 0 2.4rem;
	border: 1px solid var(--sils-principal);
	border-radius: 50%;
	color: var(--sils-principal);
	font-size: var(--sils-txt-l, 2rem);
}

.sils-acceso-ventana .sils-acceso__bienvenida .sils-acceso__titulo {
	margin-bottom: var(--sils-esp-2xs, 0.8rem);
}

.sils-acceso-ventana .sils-acceso__bienvenida .sils-acceso__texto {
	margin: 0;
}

/* Lo que está pasando: una frase según de dónde venía, y debajo, la línea que avanza. */
.sils-acceso-ventana .sils-acceso__estado {
	display: none;
	margin: 2.4rem 0 0;
	color: var(--sils-texto);
	font-size: var(--sils-txt-2xs, 1.4rem);
}

.sils-acceso-ventana.is-compra .sils-acceso__estado--compra,
.sils-acceso-ventana.is-pagina .sils-acceso__estado--pagina {
	display: block;
}

.sils-acceso-ventana .sils-acceso__pulso {
	position: relative;
	width: 12rem;
	height: 2px;
	margin: var(--sils-esp-xs, 1.2rem) 0 0;
	overflow: hidden;
	background: var(--sils-linea);
}

.sils-acceso-ventana .sils-acceso__pulso::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 40%;
	background: var(--sils-principal);
	animation: sils-acceso-pulso 1.1s ease-in-out infinite;
}

@keyframes sils-acceso-pulso {
	from {
		transform: translateX(-100%);
	}

	to {
		transform: translateX(250%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.sils-acceso-ventana.is-bienvenida .sils-acceso__bienvenida,
	.sils-acceso-ventana .sils-acceso__pulso::after {
		animation: none;
	}
}

/* ── Móvil ───────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
	.sils-acceso-ventana .sils-acceso {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* idiomas.css */
/*
 * Desplegable de idioma ([sils_idiomas], inc/idiomas.php y assets/idiomas.js): barra superior
 * (#brxe-cabsup > #brxe-cabidi) y pie (#brxe-pieidi). Botón con bandera, código y flecha. La
 * lista es negra con filetes finos: en la barra cuelga de su borde inferior y llega al borde
 * derecho de la pantalla; en el pie se abre hacia arriba. El idioma actual, en blanco; los
 * demás, atenuados (sin punto ni marca: el usuario lo descartó el 21-oct-2026).
 */

.sils-idiomas {
	position: relative;
	display: inline-flex;
	align-items: center;
	color: var(--sils-blanco);
}

/* El kit pinta todos los <button>: aquí, solo el contenido. */
.sils-idiomas button.sils-idiomas__boton,
.sils-idiomas button.sils-idiomas__boton:focus {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: var(--sils-esp-3xs);
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: inherit;
	font: inherit;
	text-transform: inherit;
	letter-spacing: inherit;
	line-height: 1;
	cursor: pointer;
}

/* Zona de toque mayor que el botón, sin cambiar el alto de la barra. */
.sils-idiomas button.sils-idiomas__boton::before {
	content: "";
	position: absolute;
	inset: -1rem -0.8rem;
}

.sils-idiomas button.sils-idiomas__boton:hover {
	background: none;
	color: inherit;
}

.sils-idiomas button.sils-idiomas__boton:focus-visible {
	outline: 1px solid currentColor;
	outline-offset: 3px;
}

.sils-idiomas__bandera {
	display: block;
	flex: none;
	width: 1.6rem;
	height: 1.2rem;
	object-fit: cover;
}

.sils-idiomas__flecha {
	font-size: var(--sils-txt-4xs);
	transition: transform 200ms ease;
}

.sils-idiomas.esta-abierto .sils-idiomas__flecha {
	transform: rotate(180deg);
}

.sils-idiomas__oculto {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.sils-idiomas .sils-idiomas__lista {
	position: absolute;
	z-index: 10000;
	bottom: calc(100% + var(--sils-esp-2xs));
	left: calc(-1 * var(--sils-esp-s));
	min-width: 18rem;
	margin: 0;
	padding: 0;
	list-style: none;
	background: var(--sils-principal);
	border: 1px solid color-mix(in srgb, var(--sils-blanco) 22%, transparent);
	opacity: 0;
	visibility: hidden;
	transform: translateY(0.4rem);
	transition: opacity 180ms ease, transform 180ms ease, visibility 0s linear 180ms;
}

.sils-idiomas.esta-abierto .sils-idiomas__lista {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity 180ms ease, transform 180ms ease, visibility 0s;
}

.sils-idiomas .sils-idiomas__lista li {
	margin: 0;
	padding: 0;
}

.sils-idiomas .sils-idiomas__lista li + li {
	border-top: 1px solid color-mix(in srgb, var(--sils-blanco) 14%, transparent);
}

.sils-idiomas a.sils-idiomas__op {
	display: flex;
	align-items: center;
	gap: var(--sils-esp-xs);
	min-height: 4.4rem;
	padding: 0 var(--sils-esp-s);
	color: color-mix(in srgb, var(--sils-blanco) 55%, transparent);
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 150ms ease, color 150ms ease;
}

.sils-idiomas a.sils-idiomas__op:hover,
.sils-idiomas a.sils-idiomas__op:focus-visible {
	color: var(--sils-blanco);
	background: color-mix(in srgb, var(--sils-blanco) 8%, transparent);
}

.sils-idiomas a.sils-idiomas__op.es-actual {
	color: var(--sils-blanco);
}

/* Barra superior: el menú y los idiomas juntos a la derecha, separados por un filete. La
   lista se coloca respecto a la barra (todo el ancho): cuelga de su borde y llega a la derecha. */
#brxe-cabsup {
	position: relative;
}

#brxe-cabsup > #brxe-cabmen {
	margin-left: auto;
}

#brxe-cabidi .sils-idiomas {
	position: static;
}

#brxe-cabidi .sils-idiomas .sils-idiomas__lista {
	top: 100%;
	right: 0;
	bottom: auto;
	left: auto;
	transform: translateY(-0.4rem);
}

#brxe-cabidi .sils-idiomas.esta-abierto .sils-idiomas__lista {
	transform: none;
}

/* El elemento de Bricks ocupa todo el ancho por defecto: aquí, solo lo que mide. */
#brxe-cabidi,
#brxe-pieidi {
	width: auto;
	flex: none;
}

#brxe-cabidi {
	display: flex;
	align-items: center;
	margin-left: var(--sils-esp-s);
	padding-left: var(--sils-esp-s);
	border-left: 1px solid color-mix(in srgb, var(--sils-blanco) 30%, transparent);
}

/* Móvil: en la barra superior, bandera y flecha (el nombre sigue para lectores de pantalla) y
   menos aire que en escritorio, para que la frase quepa en una línea también a 360 px. Hasta el
   30-oct-2026 eran 0,4 rem y el filete quedaba pegado a la bandera; el sitio lo ocupaba la
   hamburguesa invisible del menú superior, que Bricks pintaba en el móvil (ya oculta en la
   plantilla). Con 0,8 rem a cada lado la frase sigue en una línea a 360 px (sobran ~16 px). */
@media (max-width: 767px) {
	#brxe-cabidi {
		margin-left: var(--sils-esp-2xs);
		padding-left: var(--sils-esp-2xs);
	}

	#brxe-cabidi .sils-idiomas__codigo {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sils-idiomas .sils-idiomas__lista,
	.sils-idiomas__flecha {
		transition: none;
	}
}

/*
 * Aviso de idioma (assets/aviso-idioma.js): franja clara encima de la barra negra con
 * bandera, frase, enlace y cierre. Entra y sale deslizando (de 0 a su alto). En el móvil,
 * sin la frase: bandera, enlace y cierre.
 */
.sils-aviso-idioma {
	display: grid;
	grid-template-rows: 0fr;
	opacity: 0;
	background: var(--sils-piedra);
	transition: grid-template-rows 350ms ease, opacity 350ms ease;
}

.sils-aviso-idioma.es-visible {
	grid-template-rows: 1fr;
	opacity: 1;
}

.sils-aviso-idioma__dentro {
	overflow: hidden;
	min-height: 0;
}

.sils-aviso-idioma__fila {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--sils-esp-s);
	min-height: 4.4rem;
	padding: var(--sils-esp-3xs) calc(var(--sils-margen-seguridad) + 4.4rem);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-2xs);
	font-weight: 300;
	letter-spacing: var(--sils-ls-texto, 0.12rem);
	line-height: 1.4;
	color: var(--sils-texto);
}

.sils-aviso-idioma__bandera {
	display: block;
	flex: none;
	width: 2rem;
	height: 1.5rem;
}

.sils-aviso-idioma .sils-aviso-idioma__texto {
	margin: 0;
}

.sils-aviso-idioma a.sils-aviso-idioma__accion {
	font-weight: 500;
	color: var(--sils-principal);
	text-decoration: underline;
	text-underline-offset: 0.3em;
	white-space: nowrap;
}

.sils-aviso-idioma a.sils-aviso-idioma__accion:hover {
	color: var(--sils-principal);
	text-decoration-thickness: 2px;
}

.sils-aviso-idioma button.sils-aviso-idioma__cerrar,
.sils-aviso-idioma button.sils-aviso-idioma__cerrar:focus {
	position: absolute;
	top: 50%;
	right: var(--sils-margen-seguridad);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 4.4rem;
	height: 4.4rem;
	margin: 0 -1.2rem 0 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: var(--sils-texto);
	font-size: var(--sils-txt-2xs, 1.4rem);
	cursor: pointer;
	transform: translateY(-50%);
}

.sils-aviso-idioma button.sils-aviso-idioma__cerrar:hover {
	background: none;
	color: var(--sils-principal);
}

@media (max-width: 600px) {
	.sils-aviso-idioma__fila {
		justify-content: flex-start;
		padding-left: var(--sils-margen-seguridad);
	}

	.sils-aviso-idioma .sils-aviso-idioma__texto {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}
}

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

/* drag-scroll.css */
/* ==========================================================================
   drag-scroll — JetEngine Listing Grid → carrusel de scroll libre
   Comportamiento + controles. La maquetación de las cards es tuya.

   Tokens (Advanced → Custom CSS del widget → selector { ... }):
     --ds-arrow-size / --ds-arrow-inset / --ds-arrow-top
     --ds-arrow-bg / --ds-arrow-color / --ds-arrow-bg-hover / --ds-arrow-color-hover
     --ds-rail-color / --ds-thumb-color / --ds-rail-gap
     --ds-fade
     --ds-cursor-size / --ds-cursor-bg / --ds-cursor-color / --ds-cursor-blend
   ========================================================================== */
.drag-scroll {
  position: relative;

  --ds-inset-start: 0px;
  --ds-inset-end: 0px;
  --ds-arrow-size: 3.2rem;
  --ds-arrow-inset: 1.6rem;
  --ds-arrow-top: calc(var(--ds-track-h, 100%) / 2);
  --ds-arrow-bg: #fff;
  --ds-arrow-color: #111;
  --ds-arrow-bg-hover: #111;
  --ds-arrow-color-hover: #fff;
  --ds-rail-color: rgba(0, 0, 0, .12);
  --ds-thumb-color: currentColor;
  --ds-rail-gap: 2.4rem;
  --ds-rail-width: min(32rem, 30%);
  --ds-fade: 0px;
  --ds-cursor-size: 7.2rem;
  --ds-cursor-bg: #fff;
  --ds-cursor-color: #111;
  --ds-cursor-blend: normal;
}/* ---------- El track ---------- */
.drag-scroll .jet-listing-grid__items,
/* ---------- El track ---------- */
.drag-scroll .ds-track {
  flex-wrap: nowrap !important;
  /* Alineación a sangre: la primera card respeta el padding del sitio, el
     resto del track sangra. Pon el contenedor a 0 y controla aquí el inicio. */
  padding-inline-start: var(--ds-inset-start, 0);
  padding-inline-end: var(--ds-inset-end, 0);
  scroll-padding-inline-start: var(--ds-inset-start, 0);
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-behavior: auto;               /* la inercia la controla el JS */
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
  align-items: strecht;
}.drag-scroll .jet-listing-grid__items::-webkit-scrollbar,
.drag-scroll .ds-track::-webkit-scrollbar { display: none; }.drag-scroll .jet-listing-grid__items:focus-visible,
.drag-scroll .ds-track:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* Card "Ver más": mismo ancho que las demás, contenido centrado */
.drag-scroll .ds-more-item {
  display: flex;
  align-items: stretch;
  align-self: stretch !important;
  height: auto !important;
}
.drag-scroll .ds-more-item > .ds-more {
  display: flex;
  width: 100%;
  height: 100%;
}
.drag-scroll .ds-more-item .elementor-widget-heading,
.drag-scroll .ds-more-item .elementor-heading-title {
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0;
}
.drag-scroll .ds-more-item .elementor-heading-title a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  cursor: pointer;
}/* Sin wrap,
las cards no deben encogerse: conservan el ancho del widget */
.drag-scroll .jet-listing-grid__item,
las cards no deben encogerse: conservan el ancho del widget */
.drag-scroll .ds-item { flex-shrink: 0 !important; }/* El drag nativo del navegador (imagen fantasma al arrastrar un img/enlace)
   nos roba el puntero: sin esto,
arrastrar desde una foto "coge" la foto y
   acaba disparando un click. */
.drag-scroll .jet-listing-grid__items,
arrastrar desde una foto "coge" la foto y
   acaba disparando un click. */
.drag-scroll .ds-track,
.drag-scroll .jet-listing-grid__items *,
.drag-scroll .ds-track * {
  -webkit-user-drag: none;
  user-select: none;
  -webkit-user-select: none;
}.drag-scroll .jet-listing-grid__items img,
.drag-scroll .ds-track img { -webkit-touch-callout: none; }

.drag-scroll.is-dragging { user-select: none; }.drag-scroll.is-dragging .jet-listing-grid__items,
.drag-scroll.is-dragging .ds-track { cursor: grabbing; }.drag-scroll.is-dragging .jet-listing-grid__item *,
.drag-scroll.is-dragging .ds-item * { pointer-events: none; }

/* ---------- Flechas: persistentes, con estado deshabilitado --------------
   Si maquetas las tuyas con [data-ds-prev] / [data-ds-next], estas no salen. */
.drag-scroll .ds-arrow {
  position: absolute;
  top: var(--ds-arrow-top);
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--ds-arrow-size);
  height: var(--ds-arrow-size);
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: var(--ds-arrow-bg);
  color: var(--ds-arrow-color);
  box-shadow: 0 2px 14px rgba(0, 0, 0, .14);
  cursor: pointer;
  /* Ocultas hasta que el puntero entra en el carrusel */
  opacity: 0;
  pointer-events: none;
  transform: translateY(-50%) translateX(var(--ds-arrow-slide, 0)) scale(.9);
  transition: opacity .25s ease, transform .3s cubic-bezier(.22, 1, .36, 1),
              background .25s ease, color .25s ease;
}
.drag-scroll .ds-arrow--prev { left: var(--ds-arrow-inset); --ds-arrow-slide: -.8rem; }
.drag-scroll .ds-arrow--next { right: var(--ds-arrow-inset); --ds-arrow-slide: .8rem; }

/* Aparecen al pasar por encima… y también con teclado (Tab), que si no
   las flechas dejarían de existir para quien no usa ratón. */
.drag-scroll:hover .ds-arrow,
.drag-scroll:focus-within .ds-arrow {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(-50%) translateX(0) scale(1);
}
.drag-scroll .ds-arrow i { font-size: calc(var(--ds-arrow-size) * .4); line-height: 1; }
.drag-scroll .ds-arrow:hover { background: var(--ds-arrow-bg-hover); color: var(--ds-arrow-color-hover); }
.drag-scroll .ds-arrow:focus-visible { opacity: 1; pointer-events: auto; outline: 2px solid currentColor; outline-offset: 3px; }

/* Estado deshabilitado (también para tus botones externos) */
.drag-scroll:hover .ds-arrow[disabled],
.drag-scroll:focus-within .ds-arrow[disabled],
.drag-scroll .ds-arrow[disabled],
[data-ds-prev][disabled],
[data-ds-next][disabled] {
  opacity: 0;
  pointer-events: none;
}
/* Mientras arrastras, las flechas se apartan */
.drag-scroll.is-dragging .ds-arrow { opacity: 0; pointer-events: none; }

/* Vertical (el JS pone .ds-vertical cuando el carril va en columna): el carril se
   desplaza hacia abajo y las flechas van arriba y abajo, centradas. */
.drag-scroll.ds-vertical .jet-listing-grid__items,
.drag-scroll.ds-vertical .ds-track {
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-x: auto;
  overscroll-behavior-y: contain;
}
.drag-scroll.ds-vertical .ds-arrow {
  top: auto;
  right: auto;
  left: 50%;
  transform: translateX(-50%) translateY(var(--ds-arrow-slide, 0)) scale(.9);
}
.drag-scroll.ds-vertical .ds-arrow--prev { top: var(--ds-arrow-inset); }
.drag-scroll.ds-vertical .ds-arrow--next { bottom: var(--ds-arrow-inset); }
.drag-scroll.ds-vertical:hover .ds-arrow,
.drag-scroll.ds-vertical:focus-within .ds-arrow {
  transform: translateX(-50%) translateY(0) scale(1);
}

/* Si todo cabe, no hay nada que deslizar: fuera controles */
.drag-scroll.no-overflow .ds-arrow,
.drag-scroll.no-overflow .ds-rail { display: none; }.drag-scroll.no-overflow .jet-listing-grid__items,
.drag-scroll.no-overflow .ds-track { cursor: auto; }

/* Táctil: se desliza con el dedo, las flechas sobran */
@media (pointer: coarse) {
  .drag-scroll .ds-arrow { display: none; }.drag-scroll .jet-listing-grid__items,
.drag-scroll .ds-track { cursor: auto; }
}

/* ---------- Barra de progreso: sutil, centrada, solo al pasar por encima --
   A sangre cortaría la página en dos. Centrada y corta, es un detalle. ----- */
.drag-scroll .ds-rail {
  position: relative;
  width: var(--ds-rail-width, min(32rem, 30%));
  height: 1px;
  margin: var(--ds-rail-gap) auto 0;
  background: var(--ds-rail-color);
  border-radius: 999px;
  touch-action: none;
  opacity: 0;
  transform: translateY(.56rem);
  transition: opacity .3s ease, transform .3s cubic-bezier(.22, 1, .36, 1);
}
.drag-scroll:hover .ds-rail,
.drag-scroll:focus-within .ds-rail,
.drag-scroll.is-dragging .ds-rail {
  opacity: 1;
  transform: translateY(0);
}
.drag-scroll .ds-rail__thumb {
  position: absolute;
  inset-block: -6px;                    /* zona de agarre más alta que la línea */
  left: 0;
  width: var(--ds-thumb-w, 20%);
  transform: translateX(var(--ds-thumb-x, 0px));
  cursor: grab;
}
.drag-scroll .ds-rail__thumb::after {
  content: "";
  position: absolute;
  inset: 6px 0;
  border-radius: 999px;
  background: var(--ds-thumb-color);
}/* ---------- Máscara de bordes (opcional) -------------------------------- */
.drag-scroll[data-ds-fade] .jet-listing-grid__items,
/* ---------- Máscara de bordes (opcional) -------------------------------- */
.drag-scroll[data-ds-fade] .ds-track {
  --l: var(--ds-fade);
  --r: var(--ds-fade);
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--l), #000 calc(100% - var(--r)), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 var(--l), #000 calc(100% - var(--r)), transparent 100%);
}.drag-scroll.at-start .jet-listing-grid__items,
.drag-scroll.at-start .ds-track { --l: 0px; }.drag-scroll.at-end   .jet-listing-grid__items,
.drag-scroll.at-end .ds-track { --r: 0px; }

/* ---------- Cursor personalizado: OPT-IN (data-ds-cursor|1) --------------
   Para heroes / colecciones editoriales. No lo uses en listados de producto. */
@media (hover: hover) and (pointer: fine) {.drag-scroll.has-ds-cursor .jet-listing-grid__items,
.drag-scroll.has-ds-cursor .ds-track,
.drag-scroll.has-ds-cursor .jet-listing-grid__items *,
.drag-scroll.has-ds-cursor .ds-track * { cursor: none; }
  .drag-scroll.has-ds-cursor .ds-native,
  .drag-scroll.has-ds-cursor .ds-native * { cursor: pointer; }
}
.ds-cursor {
  position: fixed;
  top: 0; left: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .45em;
  min-width: var(--ds-cursor-size, 7.2rem);
  height: var(--ds-cursor-size, 7.2rem);
  padding-inline: 1.1em;
  border-radius: 999px;
  background: var(--ds-cursor-bg, #fff);
  color: var(--ds-cursor-color, #111);
  mix-blend-mode: var(--ds-cursor-blend, normal);
  font-size: var(--sils-txt-3xs, 1.2rem);
  letter-spacing: .04em;
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transform: translate3d(-50%, -50%, 0) scale(.4);
  transition: opacity .2s ease, transform .28s cubic-bezier(.22, 1, .36, 1);
  will-change: transform, opacity;
}
.ds-cursor.is-visible  { opacity: 1; transform: translate3d(-50%, -50%, 0) scale(1); }
.ds-cursor.is-grabbing { transform: translate3d(-50%, -50%, 0) scale(.82); }
.ds-cursor i { font-size: 1.1em; line-height: 1; flex: 0 0 auto; }
.ds-cursor .ds-cursor__prev,
.ds-cursor .ds-cursor__next { display: none; }
.ds-cursor.is-prev .ds-cursor__prev,
.ds-cursor.is-next .ds-cursor__next,
.ds-cursor.is-grabbing .ds-cursor__prev,
.ds-cursor.is-grabbing .ds-cursor__next { display: block; }

@media (prefers-reduced-motion: reduce) {
  .ds-cursor { transition: opacity .15s linear; }
}

@media (pointer: coarse) {
  .drag-scroll .ds-rail { display: none; }
}

@media (max-width: 767px) {
  .drag-scroll {
    --ds-inset-start: 1.6rem;
    --ds-inset-end: 1.6rem;
    --ds-peek: 2.8rem;   /* cuánto asoma la tercera */
  }.drag-scroll .jet-listing-grid__item,
.drag-scroll .ds-item {
    flex-basis: calc((100% - var(--ds-peek)) / 2) !important;
    width: calc((100% - var(--ds-peek)) / 2) !important;
    max-width: none !important;
  }
}

/* ==========================================================================
   MARCADO DE BRICKS
   --------------------------------------------------------------------------
   Con Elementor el raíl es .jet-listing-grid__items y las tarjetas
   .jet-listing-grid__item, y JetEngine reparte el ancho con --columns.
   Con Bricks el carril es un bloque hijo con la clase .ds-track y las tarjetas
   llevan .ds-item; el envoltorio .drag-scroll no se desplaza, y sobre él se
   colocan las flechas y la barra de progreso.
   ========================================================================== */
.drag-scroll .ds-track {
	display: flex;
	/* Los bloques de Bricks vienen en columna por defecto: sin esto, las tarjetas se apilan. */
	flex-direction: row;
	flex-wrap: nowrap;
	gap: var(--ds-gap, 1rem);
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.drag-scroll .ds-track::-webkit-scrollbar { display: none; }

.drag-scroll .ds-track > .ds-item {
	flex: 0 0 calc((100% - (var(--ds-gap, 1rem) * (var(--columns, 4) - 1))) / var(--columns, 4));
	max-width: none;
}

/* cabecera.css */
/*
 * Cabecera fija.
 *
 * Réplica del código personalizado de Elementor «Sticky header» (id 189365):
 * cuando la barra principal llega arriba, se fija con una entrada suave y la
 * barra superior se va con el scroll. Se añade el hueco de la barra de
 * administración, que en Elementor la tapaba.
 *
 * Los selectores llevan #brx-header para ganar a la copia de Elementor, que se
 * sigue imprimiendo mientras Elementor Pro esté activo.
 */
body.sils-fixed #brx-header .fixed-header {
	position: fixed;
	top: var(--wp-admin--admin-bar--height, 0px);
	left: 0;
	right: 0;
	z-index: 500;
	animation: sils-drop .35s cubic-bezier(.22, .61, .36, 1);
	border-bottom: 0 !important;
}

@keyframes sils-drop {
	from { transform: translateY(-8px); opacity: .6; }
	to   { transform: translateY(0);    opacity: 1;  }
}

.sils-header-spacer {
	width: 100%;
}

/*
 * En toda la web, home incluida, la cabecera va en su sitio y en negro. Hasta el
 * 29-sep-2026 flotaba transparente sobre el slider de la home; el slider nuevo
 * (banners cs-*) tiene un slide de fondo claro donde el menú blanco no se leía.
 */

@media (prefers-reduced-motion: reduce) {
	body.sils-fixed #brx-header .fixed-header { animation: none; }
}

/* La transición al esconderse/aparecer la daba la hoja de la antigua sección «Inspírate»
   (sils-puente-bricks/assets/inspo.css), que ya no se carga: se trae aquí. */
.fixed-header {
	transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1), opacity 0.3s ease;
}

/* filtros.css */
/*
 * Barra de filtros de los archivos (JetSmartFilters en Bricks).
 *
 * Réplica de la de Elementor: plantilla de filtros 156319, barra de la plantilla de
 * archivo 155990, widget global de orden 173266 y las reglas «FILTROS DE CATEGORÍA»
 * del Personalizador. Todo cuelga de `.sils-filtros` (el contenedor de la barra), así
 * que no toca los filtros de la home. Colores y tipos con las variables del sistema.
 *
 * Tipos: etiqueta del desplegable = Indicativo; opciones = Texto pequeño; contadores,
 * orden y opción elegida = Tags listing.
 */

.sils-filtros {
	--filtros-flecha: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M0.256 8.606c0-0.269 0.106-0.544 0.313-0.75 0.412-0.412 1.087-0.412 1.5 0l14.119 14.119 13.913-13.912c0.413-0.412 1.087-0.412 1.5 0s0.413 1.088 0 1.5l-14.663 14.669c-0.413 0.413-1.088 0.413-1.5 0l-14.869-14.869c-0.213-0.213-0.313-0.481-0.313-0.756z'/%3E%3C/svg%3E");
	color: var(--sils-principal);
}

/* ── Los filtros, en fila y separados por una línea ───────────────────── */
.sils-filtros__lista > * {
	border-right: 1px solid var(--sils-principal);
}

/* Filtro sin opciones: JetSmartFilters lo oculta (style="display: none") pero su
 * contenedor de Bricks quedaba con 1 px y su línea; varios juntos hacían un trazo grueso. */
.sils-filtros__lista > :has(> .jet-filter[style*="display: none"]) {
	display: none;
}

/* Los elementos de Bricks que envuelven cada filtro son flex: así el hueco del texto
   suelto que traen dentro no suma altura (la barra medía 72 px en vez de 48). */
.sils-filtros [class*="brxe-jet-smart-filters-"] {
	display: flex;
	align-items: stretch;
}

.sils-filtros [class*="brxe-jet-smart-filters-"] > * {
	flex: 1 1 auto;
}

.sils-filtros .brxe-jet-smart-filters-remove-filters {
	align-items: center;
}

/* Cada desplegable se abre bajo su propia etiqueta (JetSmartFilters lo posiciona
 * respecto a sí mismo, como en Elementor). */
.sils-filtros .jet-filter-items-dropdown {
	max-width: 100%;
	height: 100%;
}

.sils-filtros .jet-filter-items-dropdown__label {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--sils-esp-3xs);
	height: 100%;
	padding: 1.5rem 4rem 1.5rem 2rem;
	border: 0;
	border-radius: 0;
	background-color: var(--sils-blanco);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs);
	font-weight: 400;
	line-height: 1.2em;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
	cursor: pointer;
}

/* Flecha: la del Personalizador, girada al abrir. */
.sils-filtros .jet-filter-items-dropdown__label::after,
.sils-filtros .jet-sorting::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 1rem;
	width: 2rem;
	height: 2rem;
	border: 0;
	background-color: currentColor;
	-webkit-mask: var(--filtros-flecha) center / 1rem no-repeat;
	mask: var(--filtros-flecha) center / 1rem no-repeat;
	transform: translateY(-50%);
	transition: transform .2s ease;
	pointer-events: none;
}

.sils-filtros .jet-filter-items-dropdown.jet-dropdown-open .jet-filter-items-dropdown__label::after {
	transform: translateY(-50%) rotate(180deg);
}

/* Lo elegido, dentro de la propia etiqueta. */
.sils-filtros .jet-filter-items-dropdown__active__item {
	font-size: var(--sils-txt-3xs);
	line-height: 1.8rem;
	letter-spacing: 0.025rem;
}

/* ── El desplegable ────────────────────────────────────────────────────── */
.sils-filtros .jet-filter-items-dropdown__body {
	left: 1.6rem;
	right: auto;
	width: 45rem;
	margin-top: 0.9rem;
	border: 0;
	border-radius: 1rem;
	background-color: var(--sils-blanco);
	box-shadow: 0 0.4rem 1.6rem color-mix(in srgb, var(--sils-principal) 12%, transparent);
}

.sils-filtros .jet-filter-items-dropdown__footer {
	justify-content: flex-end;
	background-color: var(--sils-gris-claro);
}

.sils-filtros .jet-filter-items-dropdown .jet-filter-items-search__input:focus {
	outline: none;
	box-shadow: none;
}

/* Casillas, en dos columnas. Con !important, como hacía el Personalizador: JetSmartFilters
   pone las filas en línea con reglas propias. */
.sils-filtros .jet-checkboxes-list-wrapper {
	display: block !important;
	column-count: 2 !important;
	margin: -0.5rem -0.25rem;
	padding: 1rem;
	text-align: left;
}

.sils-filtros .jet-checkboxes-list__row {
	display: block !important;
	margin: 0 0.25rem 0.5rem;
	padding-top: 0.5rem;
	break-inside: avoid;
}

.sils-filtros .jet-filter-row-hide {
	display: none !important;
}

.sils-filtros .jet-checkboxes-list__button {
	padding: 0.5rem 1.5rem 0.5rem 1rem;
	border: 0;
	border-radius: 0.5rem;
	transition: background-color .15s ease;
}

.sils-filtros .jet-checkboxes-list__button:hover,
.sils-filtros .jet-checkboxes-list__input:checked ~ .jet-checkboxes-list__button {
	background-color: var(--sils-gris-claro);
}

.sils-filtros .jet-checkboxes-list__label,
.sils-filtros .jet-color-image-list__label {
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-2xs);
	font-weight: 300;
	line-height: 1.2em;
	letter-spacing: var(--sils-ls-texto, 0.12rem);
}

.sils-filtros .jet-checkboxes-list__decorator {
	width: 1.4rem;
	height: 1.4rem;
	min-width: 1.4rem;
	min-height: 1.4rem;
	margin: 0.1rem 0.5rem 0 0;
	border-radius: 0.1rem;
	overflow: hidden;
}

/* Marcada: negra con la marca en blanco. JetSmartFilters la pinta gris (#ccc) con una
 * regla de seis clases (.jet-checkboxes-list .…__item .…__input:checked + …); aquí, siete. */
.sils-filtros .jet-checkboxes-list .jet-checkboxes-list__item .jet-checkboxes-list__input:checked ~ .jet-checkboxes-list__button .jet-checkboxes-list__decorator {
	background-color: var(--sils-principal);
	border-color: var(--sils-principal);
}

.sils-filtros .jet-checkboxes-list__checked-icon svg {
	fill: var(--sils-blanco);
}

.sils-filtros .jet-checkboxes-list__checked-icon {
	font-size: var(--sils-txt-3xs, 1.2rem);
}

.sils-filtros .jet-filters-counter {
	margin-left: initial;
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	font-weight: 400;
	letter-spacing: 0.025rem;
	text-transform: uppercase;
}

/* Colores: muestras redondas, en dos columnas. */
.sils-filtros .jet-color-image-list-wrapper {
	padding: var(--sils-esp-s, 1.6rem);
	text-align: left;
}

.sils-filtros .jet-color-image-list-wrapper fieldset {
	display: block !important;
	column-count: 2 !important;
}

.sils-filtros .jet-color-image-list__row {
	display: block !important;
	margin-bottom: 1rem;
	break-inside: avoid;
}

/* Los colores sin obras también se esconden: la regla de arriba ganaba a la de
 * .jet-filter-row-hide (mismo peso, va después) y salían con «(0)» (15-oct-2026). */
.sils-filtros .jet-color-image-list__row.jet-filter-row-hide {
	display: none !important;
}

.sils-filtros .jet-color-image-list__button {
	padding: 0.5rem;
	border: 0;
	transition: background-color .15s ease;
}

.sils-filtros .jet-color-image-list__button:hover,
.sils-filtros .jet-color-image-list__input:checked ~ .jet-color-image-list__button {
	background-color: var(--sils-gris-claro);
}

.sils-filtros .jet-color-image-list__decorator {
	margin: 0 0.5rem 0 0;
}

.sils-filtros .jet-color-image-list__decorator > * {
	border: 1px solid var(--sils-gris-claro);
	border-radius: 50%;
	overflow: hidden;
}

.sils-filtros .jet-color-image-list__decorator .jet-color-image-list__color {
	width: 2rem;
	height: 2rem;
}

.sils-filtros .jet-color-image-list__decorator .jet-color-image-list__image {
	width: 2rem;
}

.sils-filtros .jet-color-image-list__input:checked ~ .jet-color-image-list__button .jet-color-image-list__decorator > * {
	border-color: var(--sils-principal);
}

/* «Multicolor»: degradado de arcoíris (dato de la muestra, no un color de marca). */
.sils-filtros .jet-color-image-list__item input[data-url-value="multicolor"] ~ .jet-color-image-list__button .jet-color-image-list__color {
	background: conic-gradient(red, orange, yellow, green, blue, violet, red);
}

/* ── Parte derecha: nº de obras, quitar filtros y orden ───────────────── */
/* El número lo pone assets/archivos.js; entra suave en vez de aparecer de golpe. */
.sils-filtros__cuenta.es-listo {
	opacity: 1;
}

.sils-filtros__cuenta {
	align-self: center;
	min-width: 7rem;
	text-align: right;
	opacity: 0;
	transition: opacity .25s ease;
	padding: 0 var(--sils-esp-s, 1.6rem);
	color: var(--sils-secundario);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	letter-spacing: 0.025rem;
	text-transform: uppercase;
	white-space: nowrap;
}

.sils-filtros .jet-remove-all-filters__button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	margin-right: var(--sils-esp-s, 1.6rem);
	padding: 0;
	border: 1px solid var(--sils-principal);
	border-radius: 50%;
	background-color: var(--sils-blanco);
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	letter-spacing: 0.025rem;
	text-transform: uppercase;
	transition: color .15s ease, border-color .15s ease;
}

.sils-filtros .jet-remove-all-filters {
	align-self: center;
}

.sils-filtros .jet-remove-all-filters__button:hover {
	background-color: var(--sils-blanco);
	border-color: var(--sils-secundario);
	color: var(--sils-secundario);
}

.sils-filtros .jet-sorting {
	position: relative;
	height: 100%;
}

.sils-filtros .jet-sorting-select {
	height: 100%;
	min-width: 12.8rem;
	max-width: 100%;
	padding: 1.5rem 4rem 1.5rem 1rem;
	border: 0;
	border-left: 1px solid var(--sils-principal);
	border-radius: 0;
	background: var(--sils-gris-claro);
	background-image: none !important;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	font-weight: 400;
	line-height: 1.8rem;
	letter-spacing: 0.025rem;
	text-transform: uppercase;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
	.sils-filtros .jet-filter-items-dropdown__label::after,
	.sils-filtros .jet-checkboxes-list__button,
	.sils-filtros .jet-color-image-list__button { transition: none; }
}

/* ── «Ver más» (paginación de JetSmartFilters) y carga ───────────────────
 * Se usa la de JetSmartFilters, no la de Bricks, porque pide la página siguiente con
 * los filtros puestos. Solo se carga al pulsar (sin carga automática, por SEO);
 * assets/archivos.js pone `.es-cargando` mientras llega.
 * Solo se ve «Ver más» (5-oct-2026, petición del usuario). Los números y
 * anterior/siguiente siguen en la página como enlaces de verdad
 * (`?jsf=bricks-query-loop:cuadros&pagenum=N`, rel=prev/next), ocultos: Google los
 * sigue y cada página sigue existiendo. Por eso se ocultan aquí y no con el ajuste
 * `enable_items` (apagado, desaparecen los enlaces). La paginación va en modo «ajax»:
 * al pulsar «Ver más» la barra de direcciones no cambia (en «mixed» pasaba a
 * `pagenum=2` y al recargar solo se veía esa página).
 */
.sils-ver-mas {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--sils-esp-s, 1.6rem);
}

.sils-ver-mas .jet-filters-pagination {
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.6rem;
	border: 0;
}

/* Números, puntos y anterior/siguiente: en la página, pero no se ven. */
.sils-ver-mas .jet-filters-pagination__item {
	display: none;
}

.sils-ver-mas .jet-filters-pagination__link {
	padding: 1rem;
	border: 0;
	background: none;
	color: var(--sils-secundario);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs);
	font-weight: 400;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
	cursor: pointer;
	transition: color .15s ease;
}

/* «Ver más»: botón con borde. */
.sils-ver-mas .jet-filters-pagination__load-more {
	flex-basis: 100%;
	display: flex;
	justify-content: center;
}

.sils-ver-mas .jet-filters-pagination__load-more .jet-filters-pagination__link {
	border: 1px solid var(--sils-principal);
	background-color: var(--sils-blanco);
	color: var(--sils-principal);
	font-size: var(--sils-txt-2xs);
	font-weight: 300;
	letter-spacing: var(--sils-ls-texto, 0.12rem);
	text-transform: none;
	transition: color .15s ease, border-color .15s ease;
}

/* Sin el azul de fábrica de JetSmartFilters (#5fb5ff al pasar el ratón): como en
   Elementor, fondo blanco y texto y borde en el color del texto. */
.sils-ver-mas .jet-filters-pagination__load-more .jet-filters-pagination__link:hover,
.sils-ver-mas .jet-filters-pagination__load-more .jet-filters-pagination__link:focus,
.sils-ver-mas .jet-filters-pagination__load-more .jet-filters-pagination__link:active {
	background-color: var(--sils-blanco);
	border-color: var(--sils-texto);
	color: var(--sils-texto);
}

.sils-ver-mas .jet-filters-pagination__load-more .jet-filters-pagination__link:focus-visible {
	outline: 1px solid var(--sils-principal);
	outline-offset: 0.2rem;
}

/* Mientras carga: anillo y «Cargando más obras» en lugar del botón. */
.sils-ver-mas::before {
	content: '';
	display: none;
	width: 1.6rem;
	height: 1.6rem;
	border: 0.2rem solid var(--sils-principal);
	border-right-color: transparent;
	border-radius: 50%;
	animation: sils-gira .8s linear infinite;
}

.sils-ver-mas::after {
	content: var(--sils-css-texto-cargando-obras, "Cargando más obras");
	display: none;
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs);
	font-weight: 300;
}

.sils-ver-mas.es-cargando::before,
.sils-ver-mas.es-cargando::after {
	display: block;
}

.sils-ver-mas.es-cargando .jet-filters-pagination {
	display: none;
}

@keyframes sils-gira {
	to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
	.sils-ver-mas::before { animation-duration: 2s; }
}

/* ── «Cargar más» de Bricks (listados sin filtros: Obras similares) ──────
 * Botón de Bricks con la interacción «Cargar más» de su bucle. Mismo aspecto que el
 * «Ver más» de arriba. Bricks le pone `.is-loading` mientras llega la página siguiente
 * (aquí: anillo y «Cargando más obras», como en los archivos) y `.brx-load-more-hidden`
 * cuando ya no quedan.
 */
.sils-cargar-mas.brxe-button {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: var(--sils-esp-s, 1.6rem);
	padding: 1rem;
	border: 1px solid var(--sils-principal);
	border-radius: 0;
	background-color: var(--sils-blanco);
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-2xs);
	font-weight: 300;
	line-height: 1.2;
	letter-spacing: var(--sils-ls-texto, 0.12rem);
	text-transform: none;
	cursor: pointer;
	transition: color .15s ease, border-color .15s ease;
}

.sils-cargar-mas.brxe-button:focus,
.sils-cargar-mas.brxe-button:hover {
	background-color: var(--sils-blanco);
	border-color: var(--sils-texto);
	color: var(--sils-texto);
}

.sils-cargar-mas.brxe-button:focus-visible {
	outline: 1px solid var(--sils-principal);
	outline-offset: 0.2rem;
}

.sils-cargar-mas.brxe-button.is-loading {
	border-color: transparent;
	font-size: 0;
	letter-spacing: 0;
	cursor: default;
}

.sils-cargar-mas.brxe-button.is-loading::before {
	content: '';
	width: 1.6rem;
	height: 1.6rem;
	border: 0.2rem solid var(--sils-principal);
	border-right-color: transparent;
	border-radius: 50%;
	animation: sils-gira .8s linear infinite;
}

.sils-cargar-mas.brxe-button.is-loading::after {
	content: var(--sils-css-texto-cargando-obras, "Cargando más obras");
	color: var(--sils-texto);
	font-size: var(--sils-txt-xs);
	font-weight: 300;
}

@media (prefers-reduced-motion: reduce) {
	.sils-cargar-mas.brxe-button.is-loading::before { animation-duration: 2s; }
}

/* ── Cargador de JetSmartFilters al filtrar ──────────────────────────────
 * assets/archivos.js lo saca de la primera tarjeta al contenedor de las tarjetas y lo
 * coloca (fijo en el centro de la pantalla o arriba/abajo del listado). El contenedor es
 * su referencia cuando no va fijo; por encima de las tarjetas atenuadas.
 */
:has(> .jsf_provider-preloader) {
	position: relative;
}

.jsf_provider-preloader {
	z-index: 2;
}

/* ── Franja de logos de Inspiración (filtro 188413, «Acabados (visual)») ──
 * Una fila de logos (solo imagen, elección única) centrada y con desplazamiento horizontal
 * si no cabe. Estados con el lenguaje de «Crea tu pared» (sils-crea-tu-pared, wall.css,
 * «Tarjetas: un solo lenguaje de estado»): encima, filo negro de 1,5 px separado 2 px;
 * elegido, filo negro y check negro arriba a la derecha. Con uno elegido, los demás se
 * apagan (45 %, como las miniaturas de «Paredes que inspiran»). Volver a pulsar el elegido
 * lo quita (ajuste «can deselect» del filtro): al pasar por encima, el check pasa a ✕.
 * La colección elegida sale también en la barra y en el panel de filtros
 * (bricks-child/assets/filtros-panel.js).
 */
.sils-logos {
	width: 100%;
	--logos-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
	--logos-quitar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");
}

/* Aire alrededor para que el filo (fuera de la caja) no se corte con el desplazamiento. */
.sils-logos .jet-color-image-list-wrapper {
	overflow-x: auto;
	padding: 0.6rem var(--sils-esp-3xs, 0.4rem);
	scrollbar-width: none;
}

.sils-logos .jet-color-image-list-wrapper::-webkit-scrollbar {
	display: none;
}

/* La hoja de JetSmartFilters para Bricks pesa más (.brxe-… .wrapper > fieldset): se sube
 * aquí la especificidad. La fila la pone el ajuste «Filters position: row» del filtro. */
.brxe-jet-smart-filters-color-image.sils-logos .jet-color-image-list-wrapper > fieldset {
	flex-wrap: nowrap;
	justify-content: safe center;
	gap: var(--sils-esp-xs);
	margin: 0;
	padding: 0;
	border: 0;
	min-inline-size: 0;
}

.sils-logos .jet-color-image-list__row {
	display: block;
	flex-shrink: 0;
	margin: 0;
}

.sils-logos .jet-color-image-list__button {
	position: relative;
	padding: 1rem;
	background-color: var(--sils-blanco);
	border: 1px solid var(--sils-linea);
	border-radius: var(--sils-radio, 0.4rem);
	box-shadow: none;
	outline: 1.5px solid transparent;
	outline-offset: 2px;
	transition: outline-color .2s ease, opacity .2s ease;
}

/* El check: círculo negro (::after) con la marca en blanco encima (::before). */
.sils-logos .jet-color-image-list__button::before,
.sils-logos .jet-color-image-list__button::after {
	content: '';
	position: absolute;
	top: 0.8rem;
	right: 0.8rem;
	width: 2rem;
	height: 2rem;
	opacity: 0;
	transform: scale(.6);
	transition: opacity .2s ease, transform .24s cubic-bezier(.22, .61, .36, 1);
	pointer-events: none;
}

.sils-logos .jet-color-image-list__button::after {
	z-index: 1;
	border-radius: 50%;
	background-color: var(--sils-principal);
}

.sils-logos .jet-color-image-list__button::before {
	z-index: 2;
	background-color: var(--sils-blanco);
	-webkit-mask: var(--logos-check) center / 1rem no-repeat;
	mask: var(--logos-check) center / 1rem no-repeat;
}

.sils-logos .jet-color-image-list__button:hover,
.sils-logos .jet-color-image-list__input:checked ~ .jet-color-image-list__button {
	outline-color: var(--sils-principal);
}

.sils-logos .jet-color-image-list__input:checked ~ .jet-color-image-list__button::before,
.sils-logos .jet-color-image-list__input:checked ~ .jet-color-image-list__button::after {
	opacity: 1;
	transform: none;
}

/* Con uno elegido, los demás apagados; al pasar por encima vuelven. */
.sils-logos:has(.jet-color-image-list__input:checked) .jet-color-image-list__input:not(:checked) ~ .jet-color-image-list__button {
	opacity: .45;
}

.sils-logos:has(.jet-color-image-list__input:checked) .jet-color-image-list__input:not(:checked) ~ .jet-color-image-list__button:hover {
	opacity: 1;
}

/* Encima del elegido: el check pasa a ✕ (pulsar lo quita). Solo con ratón. */
@media (hover: hover) {
	.sils-logos .jet-color-image-list__input:checked ~ .jet-color-image-list__button:hover::before {
		-webkit-mask-image: var(--logos-quitar);
		mask-image: var(--logos-quitar);
	}
}

.sils-logos .jet-color-image-list__decorator > * {
	border: 0;
}

.sils-logos .jet-color-image-list__image {
	width: 16.5rem;
}

.sils-logos .jet-color-image-list__image img {
	display: block;
	width: 100%;
	height: 7.5rem;
	object-fit: contain;
}

/* Sin logo (una selección sin «Logo» en su ficha, inc/catalogo.php): en vez de la imagen
 * de relleno de JetSmartFilters sale el nombre, en la caja de un logo. La etiqueta existe
 * porque el filtro tiene «Show items label»; con logo no se ve. */
.sils-logos .jet-color-image-list__label {
	display: none;
}

.sils-logos .jet-color-image-list__button:has(img[src$="/placeholder.png"]) .jet-color-image-list__decorator {
	display: none;
}

.sils-logos .jet-color-image-list__button:has(img[src$="/placeholder.png"]) .jet-color-image-list__label {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 16.5rem;
	height: 7.5rem;
	margin: 0;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-m);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.12rem;
	text-align: center;
	text-transform: uppercase;
}

/* En el móvil, logos más pequeños: caben tres y se ve que la fila sigue. */
@media (max-width: 767px) {
	.sils-logos .jet-color-image-list__button {
		padding: 0.6rem;
	}

	.sils-logos .jet-color-image-list__image {
		width: 10rem;
	}

	.sils-logos .jet-color-image-list__image img {
		height: 4.6rem;
	}

	.sils-logos .jet-color-image-list__button:has(img[src$="/placeholder.png"]) .jet-color-image-list__label {
		width: 10rem;
		height: 4.6rem;
		font-size: var(--sils-txt-xs);
	}

	.sils-logos .jet-color-image-list__button::before,
	.sils-logos .jet-color-image-list__button::after {
		top: 0.4rem;
		right: 0.4rem;
		width: 1.6rem;
		height: 1.6rem;
	}

	.sils-logos .jet-color-image-list__button::before {
		-webkit-mask-size: 0.8rem;
		mask-size: 0.8rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sils-logos .jet-color-image-list__button,
	.sils-logos .jet-color-image-list__button::before,
	.sils-logos .jet-color-image-list__button::after { transition: none; }
}

/* cuenta.css */
/*
 * Páginas de Woo con el sistema de Cuadros Sils: Mi cuenta (acceso, contraseña, resumen,
 * pedidos, direcciones y datos), el registro de profesionales y el carrito.
 *
 * Todo cuelga de .sils-woo (la clase del bloque de Bricks que lleva el atajo de Woo, o del
 * propio [sils_registro]). Campos y botones como el formulario de Contacto; cajas «cortadas»
 * (sin radio, con líneas finas). Se carga desde inc/cuenta.php.
 */

.sils-woo {
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs, 1.5rem);
	font-weight: 300;
	line-height: 1.5;
	letter-spacing: 0.1rem;
}

.sils-woo a {
	color: var(--sils-principal);
	text-underline-offset: 0.3rem;
}

.sils-woo p {
	margin: 0 0 var(--sils-esp-s, 1.6rem);
}

.sils-woo strong,
.sils-woo b {
	font-weight: 500;
}

/* ── Títulos ─────────────────────────────────────────────────────────────── */

.sils-woo .sils-woo__titulo,
.sils-woo .woocommerce-MyAccount-content h2,
.sils-woo .woocommerce-MyAccount-content h3,
.sils-woo .woocommerce-ResetPassword h2,
.sils-woo .cart_totals h2 {
	margin: 0 0 2rem;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-l);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
}

.sils-woo .sils-woo__texto,
.sils-woo .sils-woo__nota,
.sils-woo .woocommerce-privacy-policy-text p {
	color: var(--sils-secundario);
	font-size: var(--sils-txt-2xs, 1.4rem);
}

/* ── Campos ──────────────────────────────────────────────────────────────── */

/* Woo y Bricks enmarcan y centran los formularios de acceso y registro: fuera. */
.sils-woo form.login,
.sils-woo form.register {
	display: block;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	text-align: left;
}

.sils-woo .form-row {
	margin: 0 0 var(--sils-esp-s, 1.6rem);
	padding: 0;
}

.sils-woo .form-row > label:not(.woocommerce-form__label-for-checkbox),
.sils-woo fieldset > legend {
	display: block;
	margin: 0 0 0.6rem;
	padding: 0;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.1rem;
	text-transform: uppercase;
}

.sils-woo .required {
	border: 0;
	color: var(--sils-secundario);
	text-decoration: none;
}

.sils-woo .optional {
	text-transform: none;
}

.sils-woo input.input-text:not(.sils-listas-pagina *),
.sils-woo input[type="text"]:not(.sils-listas-pagina *),
.sils-woo input[type="email"]:not(.sils-listas-pagina *),
.sils-woo input[type="tel"]:not(.sils-listas-pagina *),
.sils-woo input[type="password"]:not(.sils-listas-pagina *),
.sils-woo input[type="number"]:not(.sils-listas-pagina *),
.sils-woo textarea:not(.sils-listas-pagina *),
.sils-woo select:not(.sils-listas-pagina *) {
	box-sizing: border-box;
	width: 100%;
	height: 4.4rem;
	margin: 0;
	padding: 0 var(--sils-esp-xs, 1.2rem);
	border: 0;
	border-radius: 0.5rem;
	background: var(--sils-fondo-imagenes);
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs, 1.5rem);
	font-weight: 300;
	line-height: 1.2;
	letter-spacing: 0.1rem;
	box-shadow: none;
	outline: none;
	transition: box-shadow 0.15s ease;
}

.sils-woo textarea:not(.sils-listas-pagina *) {
	height: auto;
	min-height: 12rem;
	padding: var(--sils-esp-xs, 1.2rem);
}

.sils-woo input.input-text:focus:not(.sils-listas-pagina *),
.sils-woo input[type="text"]:focus:not(.sils-listas-pagina *),
.sils-woo input[type="email"]:focus:not(.sils-listas-pagina *),
.sils-woo input[type="tel"]:focus:not(.sils-listas-pagina *),
.sils-woo input[type="password"]:focus:not(.sils-listas-pagina *),
.sils-woo input[type="number"]:focus:not(.sils-listas-pagina *),
.sils-woo textarea:focus:not(.sils-listas-pagina *),
.sils-woo select:focus:not(.sils-listas-pagina *) {
	box-shadow: inset 0 0 0 1px var(--sils-principal);
}

.sils-woo :not(.sils-listas-pagina *)::placeholder {
	color: var(--sils-secundario);
	opacity: 1;
}

.sils-woo .woocommerce-invalid input.input-text,
.sils-woo .woocommerce-invalid select {
	box-shadow: inset 0 0 0 1px var(--bricks-text-danger, #b3261e);
}

/* Muestra la contraseña: el ojo de Woo, dentro del campo. */
.sils-woo .password-input {
	position: relative;
	display: block;
}

.sils-woo .show-password-input {
	position: absolute;
	top: 0;
	right: 0;
	width: 4.4rem;
	height: 4.4rem;
	padding: 0;
	border: 0;
	background: none;
	color: var(--sils-secundario);
}

/* Desplegables sin select2 (país del registro): el kit les quita la flecha; se pone la
   flecha fina de los filtros (assets/filtros.css). Con select2, la suya. */
.sils-woo .woocommerce-input-wrapper:has(> select:not(.select2-hidden-accessible)) {
	position: relative;
	display: block;
}

.sils-woo .woocommerce-input-wrapper:has(> select:not(.select2-hidden-accessible))::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 1.2rem;
	width: 2rem;
	height: 2rem;
	background-color: var(--sils-texto);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M0.256 8.606c0-0.269 0.106-0.544 0.313-0.75 0.412-0.412 1.087-0.412 1.5 0l14.119 14.119 13.913-13.912c0.413-0.412 1.087-0.412 1.5 0s0.413 1.088 0 1.5l-14.663 14.669c-0.413 0.413-1.088 0.413-1.5 0l-14.869-14.869c-0.213-0.213-0.313-0.481-0.313-0.756z'/%3E%3C/svg%3E") center / 1rem no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M0.256 8.606c0-0.269 0.106-0.544 0.313-0.75 0.412-0.412 1.087-0.412 1.5 0l14.119 14.119 13.913-13.912c0.413-0.412 1.087-0.412 1.5 0s0.413 1.088 0 1.5l-14.663 14.669c-0.413 0.413-1.088 0.413-1.5 0l-14.869-14.869c-0.213-0.213-0.313-0.481-0.313-0.756z'/%3E%3C/svg%3E") center / 1rem no-repeat;
	transform: translateY(-50%);
	pointer-events: none;
}

.sils-woo select:not(.sils-listas-pagina *) {
	padding-right: 4rem;
	cursor: pointer;
}

/* Desplegables de país y provincia (select2 de Woo). */
.sils-woo .select2-container .select2-selection--single {
	height: 4.4rem;
	border: 0;
	border-radius: 0.5rem;
	background: var(--sils-fondo-imagenes);
}

.sils-woo .select2-container .select2-selection--single .select2-selection__rendered {
	padding-left: var(--sils-esp-xs, 1.2rem);
	color: var(--sils-texto);
	line-height: 4.4rem;
}

.sils-woo .select2-container .select2-selection--single .select2-selection__arrow {
	height: 4.4rem;
}

/* Dos campos por fila (nombre y apellidos). */
.sils-woo .form-row-first,
.sils-woo .form-row-last {
	float: left;
	width: calc(50% - 0.8rem);
}

.sils-woo .form-row-last {
	float: right;
}

.sils-woo .form-row-wide,
.sils-woo .clear {
	clear: both;
}

/* Alta: la provincia solo con España (inc/cuenta.php); al aparecer, con un fundido. */
.sils-registro .sils-oculto {
	display: none;
}

.sils-registro .sils-aparece {
	animation: sils-cuenta-aparece 0.25s ease;
}

@keyframes sils-cuenta-aparece {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

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

.sils-woo .form-row em,
.sils-woo #account_display_name_description {
	display: block;
	margin-top: 0.6rem;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	font-style: normal;
}

.sils-woo fieldset {
	clear: both;
	margin: 3.2rem 0 0;
	padding: 2.4rem 0 0;
	border: 0;
	border-top: 1px solid var(--sils-linea);
}

.sils-woo fieldset > legend {
	float: left;
	width: 100%;
	margin-bottom: var(--sils-esp-s, 1.6rem);
}

.sils-woo fieldset > legend + * {
	clear: both;
}

/* Casillas. */
.sils-woo input[type="checkbox"]:not(.sils-listas-pagina *) {
	width: 1.6rem;
	height: 1.6rem;
	margin: 0 var(--sils-esp-2xs, 0.8rem) 0 0;
	accent-color: var(--sils-principal);
	vertical-align: middle;
}

.sils-woo .woocommerce-form__label-for-checkbox {
	display: inline-flex;
	align-items: center;
	margin: 0;
	color: var(--sils-texto);
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-weight: 300;
	text-transform: none;
}

/* Publicidad (inc/publicidad.php): como el texto de privacidad que va debajo, y la casilla
   de 13 px de los formularios de Contacto, centrada en la primera línea (21 px). */
.sils-woo .sils-publicidad .woocommerce-form__label-for-checkbox {
	align-items: flex-start;
	color: var(--sils-secundario);
}

.sils-woo .sils-publicidad input[type="checkbox"] {
	flex: none;
	width: 1.3rem;
	height: 1.3rem;
	margin-top: var(--sils-esp-3xs, 0.4rem);
}

/* ── Botones: como el «Añadir» de la ficha y el «Finalizar compra» del lateral ── */

.sils-woo .button:not(.sils-listas-pagina *),
.sils-woo .button:focus:not(.sils-listas-pagina *),
.sils-woo button[type="submit"]:not(.sils-listas-pagina *),
.sils-woo button[type="submit"]:focus:not(.sils-listas-pagina *) {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--sils-esp-2xs, 0.8rem);
	min-height: 4.4rem;
	margin: 0;
	padding: 0 2.4rem;
	border: 1px solid var(--sils-principal);
	border-radius: var(--sils-radio, 0.4rem);
	background: var(--sils-principal);
	color: var(--sils-blanco);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-boton);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	box-shadow: none;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.sils-woo .button:hover:not(.sils-listas-pagina *),
.sils-woo .button:focus-visible:not(.sils-listas-pagina *),
.sils-woo button[type="submit"]:hover:not(.sils-listas-pagina *),
.sils-woo button[type="submit"]:focus-visible:not(.sils-listas-pagina *) {
	border-color: var(--sils-texto);
	background: var(--sils-texto);
	color: var(--sils-blanco);
}

.sils-woo .button:disabled:not(.sils-listas-pagina *),
.sils-woo .button.disabled:not(.sils-listas-pagina *),
.sils-woo button[type="submit"]:disabled:not(.sils-listas-pagina *) {
	opacity: 0.4;
	cursor: default;
}

/* Botón de línea (secundario). */
.sils-woo .button.sils-woo__boton-linea,
.sils-woo .button.sils-woo__boton-linea:focus {
	background: transparent;
	color: var(--sils-principal);
}

.sils-woo .button.sils-woo__boton-linea:hover,
.sils-woo .button.sils-woo__boton-linea:focus-visible {
	border-color: var(--sils-principal);
	background: var(--sils-principal);
	color: var(--sils-blanco);
}

/* El botón de enviar de cada formulario, a lo ancho. */
.sils-woo form.login .form-row > button[type="submit"],
.sils-woo form.register .form-row > button[type="submit"],
.sils-woo form.lost_reset_password .form-row > button[type="submit"] {
	width: 100%;
}

/* ── Avisos ──────────────────────────────────────────────────────────────── */

.sils-woo .woocommerce-notices-wrapper:empty {
	display: none;
}

.sils-woo .woocommerce-message,
.sils-woo .woocommerce-info,
.sils-woo .woocommerce-error {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sils-esp-2xs, 0.8rem) var(--sils-esp-s, 1.6rem);
	margin: 0 0 2.4rem;
	padding: var(--sils-esp-s, 1.6rem) 2rem;
	border: 0;
	border-left: 2px solid var(--sils-principal);
	border-radius: 0;
	background: var(--sils-blanco);
	color: var(--sils-texto);
	font-size: var(--sils-txt-2xs, 1.4rem);
	line-height: 1.5;
	list-style: none;
}

.sils-woo .woocommerce-error {
	flex-direction: column;
	align-items: flex-start;
	border-left-color: var(--bricks-text-danger, #b3261e);
}

.sils-woo .woocommerce-error li {
	margin: 0;
}

.sils-woo .woocommerce-message::before,
.sils-woo .woocommerce-info::before,
.sils-woo .woocommerce-error::before {
	display: none;
}

.sils-woo .woocommerce-message .button,
.sils-woo .woocommerce-info .button {
	order: 2;
	min-height: 0;
	padding: var(--sils-esp-2xs, 0.8rem) var(--sils-esp-s, 1.6rem);
	background: transparent;
	color: var(--sils-principal);
	font-size: var(--sils-txt-3xs, 1.2rem);
}

.sils-woo .woocommerce-message .button:hover,
.sils-woo .woocommerce-info .button:hover {
	background: var(--sils-principal);
	color: var(--sils-blanco);
}

/* ── Acceso (Mi cuenta sin sesión) ───────────────────────────────────────── */

.sils-acceso {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	border: 1px solid var(--sils-linea);
	background: var(--sils-blanco);
}

.sils-acceso__col {
	padding: clamp(2.4rem, 4vw, 4.8rem);
}

.sils-acceso__col--alta {
	border-left: 1px solid var(--sils-linea);
}

.sils-woo .sils-acceso__fila {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--sils-esp-xs, 1.2rem) var(--sils-esp-s, 1.6rem);
	margin-bottom: 2.4rem;
}

.sils-acceso__olvido {
	font-size: var(--sils-txt-2xs, 1.4rem);
}

@media (max-width: 767px) {
	.sils-acceso {
		grid-template-columns: minmax(0, 1fr);
	}

	.sils-acceso__col--alta {
		border-top: 1px solid var(--sils-linea);
		border-left: 0;
	}
}

/* Recuperar y cambiar la contraseña. */
.sils-woo form.lost_reset_password {
	max-width: 48rem;
	margin: 0 auto;
	padding: clamp(2.4rem, 4vw, 4.8rem);
	border: 1px solid var(--sils-linea);
	background: var(--sils-blanco);
}

/* ── Mi cuenta: página ancha ─────────────────────────────────────────────── */

/* La cuenta es una página más: cabecera gris con el saludo y «Cerrar sesión»
   ([sils_cuenta_cabecera]), pestañas a todo el ancho que acompañan al bajar y el
   contenido con los márgenes de la web. El bloque de Bricks lleva «sils-woo sils-cuenta».
   Bricks pone menú y contenido en dos columnas (flex) y el menú con fondo y filas de
   60 px: aquí van uno encima del otro. */
.sils-woo .woocommerce {
	display: block;
}

/* Cabecera. */
.sils-cuenta-cab {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--sils-esp-s, 1.6rem) 3.2rem;
	width: 100%;
}

.sils-cuenta-cab__txt {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	min-width: 0;
}

.sils-cuenta-cab .sils-cuenta-cab__titulo {
	margin: 0;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xl);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-transform: none;
}

.sils-cuenta-cab__meta {
	margin: 0;
	color: var(--sils-secundario);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-weight: 300;
	letter-spacing: 0.1rem;
}

.sils-cuenta-cab .sils-cuenta-cab__salir {
	display: inline-flex;
	align-items: center;
	gap: var(--sils-esp-2xs, 0.8rem);
	min-height: 4.4rem;
	padding: 0 2.4rem;
	border: 1px solid var(--sils-principal);
	border-radius: var(--sils-radio, 0.4rem);
	background: var(--sils-blanco);
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-boton);
	font-weight: 500;
	letter-spacing: 0.05rem;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.sils-cuenta-cab .sils-cuenta-cab__salir .ti-power-off {
	font-size: var(--sils-txt-xs, 1.5rem);
}

.sils-cuenta-cab .sils-cuenta-cab__salir:hover,
.sils-cuenta-cab .sils-cuenta-cab__salir:focus-visible {
	background: var(--sils-principal);
	color: var(--sils-blanco);
}

/* Pestañas. */
.sils-cuenta .woocommerce-MyAccount-navigation {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--sils-alto-cabecera, 6rem));
	z-index: 5;
	float: none;
	width: 100%;
	min-width: 0;
	margin: 0;
	padding: 0 var(--sils-margen-seguridad);
	border-bottom: 1px solid var(--sils-linea);
	background: var(--sils-blanco);
}

.sils-cuenta .woocommerce-MyAccount-navigation ul {
	display: flex;
	gap: clamp(2.4rem, 3.5vw, 4.8rem);
	margin: 0;
	padding: 0;
	overflow-x: auto;
	list-style: none;
	scrollbar-width: none;
}

.sils-cuenta .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
	display: none;
}

.sils-cuenta .woocommerce-MyAccount-navigation li {
	flex: none;
	margin: 0;
	padding: 0;
	border: 0;
}

.sils-cuenta .woocommerce-MyAccount-navigation a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 2.2rem 0 2rem;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-s, 1.6rem);
	font-weight: 400;
	line-height: 1.2;
	white-space: nowrap;
	text-decoration: none;
	transition: color 160ms ease;
}

/* Icono de cada pestaña (Themify). */
.sils-cuenta .woocommerce-MyAccount-navigation a::before {
	font-family: themify;
	font-size: var(--sils-txt-m, 1.8rem);
	font-style: normal;
	font-weight: 400;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
}

.sils-cuenta .woocommerce-MyAccount-navigation-link--dashboard a::before { content: "\e6aa"; }
.sils-cuenta .woocommerce-MyAccount-navigation-link--orders a::before { content: "\e687"; }
.sils-cuenta .woocommerce-MyAccount-navigation-link--mis-listas a::before { content: "\e617"; }
.sils-cuenta .woocommerce-MyAccount-navigation-link--edit-address a::before { content: "\e693"; }
.sils-cuenta .woocommerce-MyAccount-navigation-link--edit-account a::before { content: "\e602"; }

.sils-cuenta .woocommerce-MyAccount-navigation a::after {
	content: "";
	position: absolute;
	right: 0;
	bottom: -1px;
	left: 0;
	height: 2px;
	background: var(--sils-principal);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 240ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.sils-cuenta .woocommerce-MyAccount-navigation a:hover,
.sils-cuenta .woocommerce-MyAccount-navigation .is-active a {
	color: var(--sils-principal);
}

.sils-cuenta .woocommerce-MyAccount-navigation .is-active a::after {
	transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
	.sils-cuenta .woocommerce-MyAccount-navigation a,
	.sils-cuenta .woocommerce-MyAccount-navigation a::after {
		transition: none;
	}
}

/* Contenido, con los márgenes de la web. */
.sils-cuenta .woocommerce-MyAccount-content {
	float: none;
	width: 100%;
	padding: 4.8rem var(--sils-margen-seguridad) 8rem;
	box-sizing: border-box;
}

/* Sin sesión (acceso, recuperar contraseña): el mismo aire. */
.sils-cuenta > .woocommerce:not(:has(.woocommerce-MyAccount-navigation)) {
	padding: 4.8rem var(--sils-margen-seguridad) 8rem;
}

.sils-cuenta .sils-acceso {
	max-width: 110rem;
	margin: 0 auto;
}

.sils-woo .woocommerce-MyAccount-content form.edit-account,
.sils-woo .woocommerce-MyAccount-content form:has(.woocommerce-address-fields) {
	max-width: 64rem;
}

@media (max-width: 767px) {
	.sils-cuenta .woocommerce-MyAccount-navigation a {
		padding: 1.8rem 0 var(--sils-esp-s, 1.6rem);
		font-size: var(--sils-txt-xs, 1.5rem);
	}

	.sils-cuenta .woocommerce-MyAccount-content,
	.sils-cuenta > .woocommerce:not(:has(.woocommerce-MyAccount-navigation)) {
		padding-top: 3.2rem;
		padding-bottom: 6.4rem;
	}

	.sils-cuenta-cab .sils-cuenta-cab__salir {
		min-height: 4rem;
		padding: 0 1.8rem;
	}
}

/* Resumen: último pedido. */
.sils-ultimo {
	margin: 0 0 4.8rem;
}

.sils-woo .sils-ultimo__et {
	margin: 0 0 var(--sils-esp-xs, 1.2rem);
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	font-weight: 400;
	letter-spacing: 0.1rem;
	text-transform: uppercase;
}

.sils-woo .sils-ultimo__fila {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
	align-items: center;
	gap: var(--sils-esp-s, 1.6rem) 3.2rem;
	padding: 2.4rem;
	border: 1px solid var(--sils-linea);
	background: var(--sils-blanco);
	color: var(--sils-principal);
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.sils-woo .sils-ultimo__fila:hover {
	background: var(--sils-gris-claro);
}

.sils-ultimo__dato {
	display: flex;
	flex-direction: column;
	gap: var(--sils-esp-3xs, 0.4rem);
	font-size: var(--sils-txt-xs, 1.5rem);
}

.sils-ultimo__dato > span {
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	letter-spacing: 0.1rem;
	text-transform: uppercase;
}

.sils-ultimo__ver {
	display: inline-flex;
	align-items: center;
	gap: var(--sils-esp-2xs, 0.8rem);
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-weight: 500;
	letter-spacing: 0.15rem;
	text-transform: uppercase;
}

@media (max-width: 767px) {
	.sils-woo .sils-ultimo__fila {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Resumen: rejilla de apartados. */
.sils-accesos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(26rem, 1fr));
	border-top: 1px solid var(--sils-linea);
	border-left: 1px solid var(--sils-linea);
}

.sils-woo .sils-accesos__item {
	display: flex;
	align-items: center;
	gap: var(--sils-esp-s, 1.6rem);
	padding: 3.2rem 2.4rem;
	border-right: 1px solid var(--sils-linea);
	border-bottom: 1px solid var(--sils-linea);
	background: var(--sils-blanco);
	color: var(--sils-principal);
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.sils-woo .sils-accesos__item:hover {
	background: var(--sils-gris-claro);
}

.sils-accesos__icono {
	flex: none;
	font-size: var(--sils-txt-xl, 2.4rem);
}

.sils-accesos__txt {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--sils-esp-3xs, 0.4rem);
	min-width: 0;
}

.sils-accesos__nombre {
	font-size: var(--sils-txt-s, 1.6rem);
	font-weight: 400;
}

.sils-accesos__desc {
	color: var(--sils-secundario);
	font-size: var(--sils-txt-2xs, 1.4rem);
}

.sils-accesos__flecha {
	flex: none;
	font-size: var(--sils-txt-2xs, 1.4rem);
}

/* ── Tablas (pedidos, detalle del pedido, carrito) ───────────────────────── */

.sils-woo table.shop_table {
	width: 100%;
	margin: 0 0 2.4rem;
	border: 0;
	border-collapse: collapse;
	border-radius: 0;
	font-size: var(--sils-txt-2xs, 1.4rem);
}

.sils-woo table.shop_table th {
	padding: var(--sils-esp-xs, 1.2rem) var(--sils-esp-xs, 1.2rem) var(--sils-esp-xs, 1.2rem) 0;
	border: 0;
	border-bottom: 1px solid var(--sils-principal);
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	font-weight: 400;
	letter-spacing: 0.1rem;
	text-align: left;
	text-transform: uppercase;
}

.sils-woo table.shop_table td,
.sils-woo table.shop_table tbody th,
.sils-woo table.shop_table tfoot th {
	padding: var(--sils-esp-s, 1.6rem) var(--sils-esp-xs, 1.2rem) var(--sils-esp-s, 1.6rem) 0;
	border: 0;
	border-bottom: 1px solid var(--sils-linea);
	vertical-align: middle;
}

.sils-woo table.shop_table tfoot th {
	color: var(--sils-texto);
	font-size: var(--sils-txt-2xs, 1.4rem);
	text-transform: none;
}

.sils-woo table.shop_table .button {
	min-height: 0;
	padding: var(--sils-esp-2xs, 0.8rem) var(--sils-esp-s, 1.6rem);
	background: transparent;
	color: var(--sils-principal);
	font-size: var(--sils-txt-3xs, 1.2rem);
}

.sils-woo table.shop_table .button:hover {
	background: var(--sils-principal);
	color: var(--sils-blanco);
}

.sils-woo table.shop_table .button + .button {
	margin-left: 0.6rem;
}

.sils-woo mark {
	background: none;
	color: var(--sils-principal);
	font-weight: 500;
}

/* ── Direcciones ─────────────────────────────────────────────────────────── */

.sils-woo .woocommerce-Addresses {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: 2.4rem;
	border: 1px solid var(--sils-linea);
	background: var(--sils-blanco);
}

.sils-woo .woocommerce-Addresses::before,
.sils-woo .woocommerce-Addresses::after {
	display: none;
}

.sils-woo .woocommerce-Addresses > .woocommerce-Address {
	float: none;
	width: auto;
	max-width: none;
	padding: 2.4rem;
}

.sils-woo .woocommerce-Addresses > .woocommerce-Address + .woocommerce-Address {
	border-left: 1px solid var(--sils-linea);
}

.sils-woo .woocommerce-Address-title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--sils-esp-s, 1.6rem);
	margin-bottom: var(--sils-esp-xs, 1.2rem);
}

.sils-woo .woocommerce-Address-title h2 {
	margin: 0;
	font-size: var(--sils-txt-s, 1.6rem);
}

.sils-woo .woocommerce-Address-title a {
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-weight: 400;
	text-decoration: underline;
}

.sils-woo address {
	font-style: normal;
	line-height: 1.6;
}

@media (max-width: 767px) {
	.sils-woo .woocommerce-Addresses {
		grid-template-columns: minmax(0, 1fr);
	}

	.sils-woo .woocommerce-Addresses > .woocommerce-Address + .woocommerce-Address {
		border-top: 1px solid var(--sils-linea);
		border-left: 0;
	}

	.sils-woo .form-row-first,
	.sils-woo .form-row-last {
		float: none;
		width: 100%;
	}
}

/* ── Carrito ─────────────────────────────────────────────────────────────── */

/* Obras a la izquierda y totales a la derecha, en un panel blanco que acompaña al bajar. */
.woocommerce-cart .sils-woo .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 40rem);
	gap: 4.8rem;
	align-items: start;
}

.woocommerce-cart .sils-woo .woocommerce > * {
	grid-column: 1 / -1;
}

.woocommerce-cart .sils-woo .woocommerce > .woocommerce-cart-form {
	grid-column: 1;
}

.woocommerce-cart .sils-woo .woocommerce > .cart-collaterals {
	grid-column: 2;
	width: auto;
	margin: 0;
	float: none;
}

.woocommerce-cart .sils-woo .before-cart:not(:has(.woocommerce-notices-wrapper > *)) {
	display: none;
}

.sils-woo .cart-collaterals .cart_totals {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + var(--sils-alto-cabecera, 6rem) + 3.2rem);
	float: none;
	width: 100%;
	padding: 3.2rem;
	border: 1px solid var(--sils-linea);
	background: var(--sils-blanco);
}

.sils-woo .cart_totals table.shop_table th {
	width: 40%;
	border-bottom-color: var(--sils-linea);
}

.sils-woo .cart_totals .order-total td,
.sils-woo .cart_totals .order-total th {
	border-bottom: 0;
	color: var(--sils-principal);
	font-size: var(--sils-txt-s, 1.6rem);
	font-weight: 500;
}

.sils-woo .wc-proceed-to-checkout {
	padding: var(--sils-esp-s, 1.6rem) 0 0;
}

.sils-woo .wc-proceed-to-checkout .checkout-button {
	width: 100%;
}

/* Tabla de obras. */
.sils-woo table.cart img {
	width: 8rem;
	max-width: none;
	height: auto;
}

.sils-woo table.cart .product-name a {
	color: var(--sils-principal);
	font-weight: 400;
	text-decoration: none;
}

.sils-woo table.cart .product-remove a {
	color: var(--sils-secundario);
	font-size: var(--sils-txt-l, 2rem);
	text-decoration: none;
}

.sils-woo table.cart .product-remove a:hover {
	color: var(--sils-principal);
}

.sils-woo dl.variation {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.2rem var(--sils-esp-2xs, 0.8rem);
	margin: var(--sils-esp-2xs, 0.8rem) 0 0;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
}

.sils-woo dl.variation dt,
.sils-woo dl.variation dd,
.sils-woo dl.variation p {
	margin: 0;
	font-weight: 300;
}

/* Cantidad: el selector de Bricks (− n +) en gris, sin cajas. */
.sils-woo .quantity {
	display: inline-flex;
	align-items: stretch;
	border-radius: 0.5rem;
	background: var(--sils-fondo-imagenes);
}

.sils-woo .quantity .action,
.sils-woo .quantity input.qty {
	height: 4rem;
	border: 0;
	background: transparent;
	color: var(--sils-principal);
}

.sils-woo .quantity .action {
	width: 3.6rem;
	cursor: pointer;
}

.sils-woo .quantity input.qty {
	width: 4.4rem;
	padding: 0;
	text-align: center;
}

/* Botón «Actualizar carrito»: de línea y pequeño. */
.sils-woo table.cart td.actions .button {
	min-height: 0;
	padding: var(--sils-esp-2xs, 0.8rem) var(--sils-esp-s, 1.6rem);
	background: transparent;
	color: var(--sils-principal);
	font-size: var(--sils-txt-3xs, 1.2rem);
}

.sils-woo table.cart td.actions .button:not(:disabled):hover {
	background: var(--sils-principal);
	color: var(--sils-blanco);
}

.sils-woo table.cart td.actions {
	padding-right: 0;
	text-align: right;
}

.sils-woo input[type="radio"]:not(.sils-listas-pagina *) {
	accent-color: var(--sils-principal);
}

.sils-woo #shipping_method {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sils-woo #shipping_method li {
	margin: 0 0 0.6rem;
}

/* Carrito vacío: frase y botón centrados. */
.woocommerce-cart .sils-woo #cfw_empty_side_cart_message,
.woocommerce-cart .sils-woo .cart-empty,
.woocommerce-cart .sils-woo .return-to-shop {
	margin: 0;
	text-align: center;
}

.woocommerce-cart .sils-woo #cfw_empty_side_cart_message,
.woocommerce-cart .sils-woo .cart-empty {
	padding: 4.8rem 0 2.4rem;
	color: var(--sils-principal);
	font-size: var(--sils-txt-l);
	font-weight: 400;
}

@media (max-width: 991px) {
	.woocommerce-cart .sils-woo .woocommerce {
		grid-template-columns: minmax(0, 1fr);
	}

	.woocommerce-cart .sils-woo .woocommerce > .cart-collaterals {
		grid-column: 1;
	}

	.sils-woo .cart-collaterals .cart_totals {
		position: static;
		padding: 2.4rem;
	}
}

.woocommerce-cart .sils-woo .woocommerce:has(.return-to-shop) {
	gap: 0;
}

/* Tablas en móvil (Woo las apila con el nombre de cada columna delante). */
.sils-woo table.shop_table_responsive tr td::before {
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	font-weight: 400;
	letter-spacing: 0.1rem;
	text-transform: uppercase;
}

/* ── Pedido recibido (Finalizar compra › order-received) y detalle de pedido ── */

.sils-woo .woocommerce-order {
	max-width: 96rem;
	margin: 0 auto;
}

.sils-woo .woocommerce-thankyou-order-received {
	margin: 0 0 3.2rem;
	color: var(--sils-principal);
	font-size: var(--sils-txt-l);
	font-weight: 400;
	text-align: center;
}

.sils-woo ul.woocommerce-order-overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
	margin: 0 0 4.8rem;
	padding: 0;
	border-top: 1px solid var(--sils-linea);
	border-left: 1px solid var(--sils-linea);
	background: var(--sils-blanco);
	list-style: none;
}

.sils-woo ul.woocommerce-order-overview::before,
.sils-woo ul.woocommerce-order-overview::after {
	display: none;
}

.sils-woo ul.woocommerce-order-overview li {
	float: none;
	margin: 0;
	padding: 2rem 2.4rem;
	border: 0;
	border-right: 1px solid var(--sils-linea);
	border-bottom: 1px solid var(--sils-linea);
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	letter-spacing: 0.1rem;
	text-transform: uppercase;
}

.sils-woo ul.woocommerce-order-overview li strong {
	display: block;
	margin-top: 0.6rem;
	color: var(--sils-principal);
	font-size: var(--sils-txt-xs, 1.5rem);
	font-weight: 400;
	text-transform: none;
}

.sils-woo .woocommerce-order-details,
.sils-woo .woocommerce-customer-details {
	margin-top: 4.8rem;
}

.sils-woo .woocommerce-order h2,
.sils-woo .woocommerce-customer-details h2 {
	margin: 0 0 var(--sils-esp-s, 1.6rem);
	color: var(--sils-principal);
	font-size: var(--sils-txt-s, 1.6rem);
	font-weight: 400;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
}

.sils-woo .woocommerce-customer-details .col2-set {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2.4rem;
}

.sils-woo .woocommerce-customer-details .col2-set::before,
.sils-woo .woocommerce-customer-details .col2-set::after {
	display: none;
}

.sils-woo .woocommerce-customer-details .col2-set > .col-1,
.sils-woo .woocommerce-customer-details .col2-set > .col-2 {
	float: none;
	width: auto;
	max-width: none;
}

.sils-woo .woocommerce-customer-details address {
	padding: 2.4rem;
	border: 1px solid var(--sils-linea);
	border-radius: 0;
	background: var(--sils-blanco);
}

@media (max-width: 767px) {
	.sils-woo .woocommerce-customer-details .col2-set {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ── Ver pedido (Mi cuenta › view-order) ─────────────────────────────────── */

/* El diseño de la página de pedido recibido (checkout-wc/sils.css, «Pedido recibido»)
   dentro de la cuenta (woocommerce/myaccount/view-order.php). Medidas copiadas de allí (en el
   pago 1 em = 16 px; aquí 1 rem = 10 px). A la izquierda el pedido; a la derecha, tras una
   línea fina, «Tu pedido» en gris. */
.sils-pedido {
	--sils-pedido-linea: color-mix(in srgb, var(--sils-secundario) 30%, var(--sils-blanco));
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	align-items: start;
}

.sils-pedido__principal {
	padding-right: 2rem;
}

.sils-pedido__resumen {
	align-self: stretch;
	padding-left: 2rem;
	border-left: 1px solid var(--sils-linea);
}

.sils-pedido__panel {
	padding: 2.4rem;
	background: var(--sils-gris-claro);
}

/* Número de pedido en Crista y la fecha como etiqueta. */
.sils-pedido__cab {
	display: flex;
	flex-direction: column;
	gap: var(--sils-esp-xs, 1.2rem);
	margin: 0 0 4rem;
}

.sils-woo .sils-pedido .sils-pedido__titulo {
	margin: 0;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-crista);
	font-size: var(--sils-txt-2xl, 4rem);
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: 0;
	text-transform: uppercase;
	text-wrap: balance;
}

.sils-woo .sils-pedido .sils-pedido__fecha,
.sils-woo .sils-pedido .sils-pedido__et {
	display: block;
	margin: 0;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	font-weight: 300;
	line-height: 1.2;
	letter-spacing: var(--sils-ls-etiqueta, 0.15em);
	text-transform: uppercase;
}

.sils-woo .sils-pedido .sils-pedido__fecha {
	letter-spacing: 0.18em;
}

.sils-woo .sils-pedido .sils-pedido__et {
	margin-bottom: 0.6rem;
}

/* Secciones sin cajas: línea fina encima; la del estado, negra. */
.sils-pedido__sec {
	padding: 2.8rem 0;
	border-top: 1px solid var(--sils-linea);
}

.sils-pedido__estado {
	border-top-color: var(--sils-principal);
}

.sils-woo .sils-pedido .sils-pedido__sub {
	margin: 0 0 var(--sils-esp-s, 1.6rem);
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-s, 1.6rem);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.sils-woo .sils-pedido__sec p,
.sils-woo .sils-pedido__sec address {
	margin: 0;
	color: var(--sils-texto);
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-style: normal;
	line-height: 1.6;
	letter-spacing: 0.03rem;
}

/* Estado: una línea con un punto por paso; el actual, negro. */
.sils-pedido__pasos {
	display: grid;
	grid-auto-columns: minmax(0, 1fr);
	grid-auto-flow: column;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sils-pedido__paso {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--sils-esp-3xs, 0.4rem);
	margin: 0;
	padding: 2.4rem var(--sils-esp-s, 1.6rem) 0 0;
	color: var(--sils-secundario);
}

.sils-pedido__paso::before,
.sils-pedido__paso::after {
	content: "";
	position: absolute;
	left: 0;
}

.sils-pedido__paso::before {
	top: 0.5rem;
	right: 0;
	height: 1px;
	background: var(--sils-linea);
}

.sils-pedido__paso::after {
	top: 0;
	box-sizing: border-box;
	width: 1.1rem;
	height: 1.1rem;
	border: 1px solid var(--sils-linea);
	border-radius: 50%;
	background: var(--sils-blanco);
}

.sils-pedido__paso-nombre {
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.sils-pedido__paso-fecha {
	font-size: var(--sils-txt-2xs, 1.4rem);
	line-height: 1;
	letter-spacing: 0.03rem;
}

.sils-pedido__paso.is-actual {
	color: var(--sils-principal);
}

.sils-pedido__paso.is-actual::after {
	border-color: var(--sils-principal);
	background: var(--sils-principal);
}

.sils-pedido__paso.is-actual .sils-pedido__paso-nombre {
	font-weight: 500;
}

/* Seguimiento: las notas de la tienda, con su fecha. */
.sils-pedido__notas {
	display: flex;
	flex-direction: column;
	gap: var(--sils-esp-s, 1.6rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.sils-pedido__notas li {
	margin: 0;
}

/* Datos del pedido, de dos en dos. */
.sils-pedido__datos {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 3.2rem 2rem;
}

/* Botones: «Mis pedidos» (línea) y, si falta el pago, «Pagar», a la derecha. */
.sils-pedido__botones {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: var(--sils-esp-xs, 1.2rem);
	padding: 2.8rem 0 0;
	border-top: 1px solid var(--sils-linea);
}

/* «Tu pedido»: cada obra con su foto, línea gris entre obras, importe a la derecha. */
.sils-woo .sils-pedido .sils-pedido__resumen-titulo {
	margin: 0;
	padding: 0 0 2rem;
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-l);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.sils-pedido__obras {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sils-pedido__obra {
	display: grid;
	grid-template-columns: 6.4rem minmax(0, 1fr) auto;
	align-items: center;
	column-gap: var(--sils-esp-s, 1.6rem);
	margin: 0;
	padding: var(--sils-esp-s, 1.6rem) 0;
	border-top: 1px solid var(--sils-pedido-linea);
	letter-spacing: var(--sils-ls-texto, 0.12rem);
}

.sils-pedido__foto {
	position: relative;
	align-self: start;
}

.sils-pedido__foto img {
	display: block;
	width: 6.4rem;
	max-width: none;
	height: auto;
}

.sils-pedido__foto-pared {
	border: 1px solid var(--sils-linea);
}

.sils-pedido__cantidad {
	position: absolute;
	top: -1rem;
	right: -0.6rem;
	box-sizing: border-box;
	min-width: 2.2rem;
	height: 2.2rem;
	padding: 0 0.7rem;
	border-radius: 1.1rem;
	background: var(--sils-principal);
	color: var(--sils-blanco);
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-weight: 500;
	line-height: 2.2rem;
	letter-spacing: 0;
	text-align: center;
}

.sils-woo .sils-pedido .sils-pedido__nombre {
	margin: 0;
	color: var(--sils-texto);
	font-size: var(--sils-txt-s, 1.6rem);
	font-weight: 400;
	line-height: 1.25;
}

.sils-woo .sils-pedido .sils-pedido__nombre a {
	color: inherit;
	text-decoration: none;
}

.sils-woo .sils-pedido .sils-pedido__nombre a:hover {
	text-decoration: underline;
}

.sils-pedido__importe {
	color: var(--sils-texto);
	font-size: var(--sils-txt-s, 1.6rem);
	font-weight: 500;
	text-align: right;
	white-space: nowrap;
}

/* Datos de cada obra en una línea (etiqueta en gris). */
.sils-woo .sils-pedido .wc-item-meta {
	margin: 0.3rem 0 0;
	padding: 0;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-weight: 400;
	line-height: 1.5;
	list-style: none;
}

.sils-woo .sils-pedido .wc-item-meta li {
	display: inline;
	margin: 0;
	padding: 0;
}

.sils-woo .sils-pedido .wc-item-meta li + li::before {
	content: " · ";
}

.sils-woo .sils-pedido .wc-item-meta .wc-item-meta-label {
	font-weight: 300;
}

.sils-woo .sils-pedido .wc-item-meta p {
	display: inline;
	margin: 0;
	font-size: inherit;
}

/* «Obra adaptada: Ver imagen» (Sils Addons), en su propia línea. */
.sils-woo .sils-pedido .wc-item-meta li:has(.sils-vista-enlace) {
	display: block;
	margin-top: var(--sils-esp-3xs, 0.4rem);
}

.sils-woo .sils-pedido .wc-item-meta li:has(.sils-vista-enlace)::before {
	content: none;
}

/* Composición: su línea arriba y sus obras debajo, sangradas, con la foto pequeña, sin
   cantidad ni precio (lo lleva la composición), sin línea entre ellas y con una guía. */
.sils-pedido__obra--hijo {
	padding: var(--sils-esp-3xs, 0.4rem) 0;
	border-top: 0;
}

.sils-pedido__obra--hijo:not(:has(+ .sils-pedido__obra--hijo)) {
	padding-bottom: var(--sils-esp-s, 1.6rem);
}

.sils-pedido__obra--hijo .sils-pedido__foto {
	justify-self: end;
}

.sils-pedido__obra--hijo .sils-pedido__foto img {
	width: 3.2rem;
}

.sils-pedido__obra--hijo .sils-pedido__desc {
	position: relative;
	align-self: stretch;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-left: 2.8rem;
}

.sils-pedido__obra--hijo .sils-pedido__desc::before {
	content: "";
	position: absolute;
	top: -0.4rem;
	bottom: -0.4rem;
	left: 1.2rem;
	width: 1px;
	background: var(--sils-pedido-linea);
}

.sils-woo .sils-pedido .sils-pedido__obra--hijo .sils-pedido__nombre {
	font-size: var(--sils-txt-2xs, 1.4rem);
}

/* Totales: etiqueta pequeña en mayúsculas y gris, importe a la derecha; el total, más grande
   y con línea encima. */
.sils-pedido__totales {
	margin: 0;
	padding: var(--sils-esp-s, 1.6rem) 0 0;
	border-top: 1px solid var(--sils-pedido-linea);
}

.sils-pedido__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--sils-esp-s, 1.6rem);
	padding: var(--sils-esp-2xs, 0.8rem) 0;
}

.sils-pedido__total dt {
	margin: 0;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	font-weight: 300;
	letter-spacing: var(--sils-ls-etiqueta, 0.15em);
	text-transform: uppercase;
}

.sils-pedido__total dd {
	margin: 0;
	color: var(--sils-texto);
	font-size: var(--sils-txt-2xs, 1.4rem);
	font-weight: 500;
	letter-spacing: 0.035em;
	text-align: right;
}

.sils-pedido__total dd small {
	display: block;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-3xs, 1.2rem);
	font-weight: 300;
}

.sils-pedido__total--final {
	margin-top: var(--sils-esp-2xs, 0.8rem);
	padding-top: 1.4rem;
	border-top: 1px solid var(--sils-pedido-linea);
}

.sils-pedido__total--final dt,
.sils-pedido__total--final dd {
	color: var(--sils-texto);
	font-size: var(--sils-txt-m, 1.9rem);
	font-weight: 500;
	letter-spacing: 0.03em;
	text-transform: none;
}

/* Tableta y móvil: una columna. El resumen, a sangre y justo después del estado (las obras
   son lo importante); después, el seguimiento, los datos y los botones a lo ancho. */
@media (max-width: 991px) {
	.sils-pedido {
		display: flex;
		flex-direction: column;
		align-items: stretch;
	}

	.sils-pedido__principal {
		display: contents;
	}

	.sils-pedido__principal > * {
		order: 5;
	}

	.sils-pedido__cab {
		order: 1;
	}

	.sils-pedido__estado {
		order: 2;
	}

	.sils-pedido__resumen {
		order: 3;
		margin: 0 calc(-1 * var(--sils-margen-seguridad)) 1.6rem;
		padding: 0;
		border-left: 0;
	}

	.sils-pedido__panel {
		padding: 2.4rem var(--sils-margen-seguridad);
	}

	.sils-pedido__seguimiento {
		order: 4;
	}

	.sils-pedido__botones {
		order: 6;
		flex-direction: column;
		align-items: stretch;
	}
}

@media (max-width: 767px) {
	.sils-woo .sils-pedido .sils-pedido__titulo {
		font-size: var(--sils-txt-2xl, 3rem);
	}

	.sils-pedido__datos {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 2.4rem;
	}
}

/* portes.css */
/*
 * Portes no incluidos (inc/portes.php): el aviso y su ventana.
 *
 * - El aviso es un enlace de texto pequeño, sin caja: gris, subrayado fino y el icono «i» de
 *   Themify detrás, como «Guardar en una lista» de la ficha. El icono va fuera del flujo para
 *   que el subrayado se quede en el texto. Es un <button>: el kit del tema pisa todos los
 *   botones (píldora, texto blanco, rosa al foco) y Sils Addons los reinicia dentro del
 *   resumen de la ficha con peso 0,2,1; por eso sus estados van aquí con peso 0,3,0.
 * - La ventana: velo, caja blanca de esquinas rectas con línea fina, título, texto y la equis.
 *   Entra y sale con un fundido de 0,2 s.
 * - Las medidas van con las variables del sistema también en las páginas de CheckoutWC: allí
 *   quita las hojas de Bricks, pero no su estilo en línea, que trae las variables y deja la
 *   raíz a 10 px como en el resto de la web (medido el 19-oct-2026 en el pago).
 */

/* ── El aviso ────────────────────────────────────────────────────────────── */

.sils-portes.sils-portes[data-sils-portes],
.sils-portes.sils-portes[data-sils-portes]:focus,
.sils-portes.sils-portes[data-sils-portes]:active {
	position: relative;
	display: inline-block;
	width: auto;
	min-width: 0;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0 1.45em 0 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--sils-secundario);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	font-weight: 300;
	line-height: 1.4;
	letter-spacing: 0.1em;
	text-align: inherit;
	text-transform: none;
	white-space: nowrap;
	cursor: pointer;
	transition: color 0.2s ease;
	-webkit-tap-highlight-color: transparent;
}

.sils-portes.sils-portes[data-sils-portes]:hover,
.sils-portes.sils-portes[data-sils-portes]:focus-visible {
	background: transparent;
	color: var(--sils-texto);
}

.sils-portes.sils-portes[data-sils-portes]:focus:not(:focus-visible) {
	outline: none;
}

.sils-portes.sils-portes[data-sils-portes]:focus-visible {
	outline: 1px solid var(--sils-texto);
	outline-offset: 0.2em;
}

/* El subrayado, solo en el texto: el icono va fuera del flujo, a la derecha. */
.sils-portes.sils-portes[data-sils-portes] {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.25em;
}

.sils-portes .ti-info-alt {
	position: absolute;
	top: 50%;
	right: 0;
	font-size: 1.05em;
	line-height: 1;
	transform: translateY(-50%);
}

/* Carrito de WooCommerce: la línea de envío solo lleva el aviso (sin «Enviando a…»). */
.woocommerce-shipping-totals .woocommerce-shipping-destination {
	display: none;
}

/* ── La ventana ──────────────────────────────────────────────────────────── */

html.sils-portes-abierta {
	overflow: hidden;
}

.sils-portes-ventana {
	position: fixed;
	inset: 0;
	z-index: 1000000; /* sobre el carrito lateral de CheckoutWC (999999) */
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	padding: var(--sils-margen-seguridad);
	opacity: 0;
	transition: opacity 0.2s ease;
}

.sils-portes-ventana[hidden] {
	display: none;
}

.sils-portes-ventana.is-abierta {
	opacity: 1;
}

.sils-portes-ventana__velo {
	position: absolute;
	inset: 0;
	background-color: color-mix(in srgb, var(--sils-texto) 50%, transparent);
}

.sils-portes-ventana__caja {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	max-width: 44rem;
	max-height: 100%;
	overflow-y: auto;
	padding: var(--sils-esp-l) var(--sils-esp-m) var(--sils-esp-m);
	border: 1px solid var(--sils-linea);
	border-radius: 0;
	background-color: var(--sils-blanco);
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	text-align: left;
	transform: translateY(0.8rem);
	transition: transform 0.2s ease-out;
}

.sils-portes-ventana.is-abierta .sils-portes-ventana__caja {
	transform: none;
}

.sils-portes-ventana__caja:focus {
	outline: none;
}

.sils-portes-ventana .sils-portes-ventana__titulo {
	margin: 0 0 var(--sils-esp-xs);
	padding: 0 var(--sils-esp-l) 0 0;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-l);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
}

.sils-portes-ventana .sils-portes-ventana__texto {
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-2xs);
	font-weight: 300;
	line-height: 1.6;
	letter-spacing: var(--sils-ls-texto, 0.12rem);
}

.sils-portes-ventana .sils-portes-ventana__texto p {
	margin: 0 0 var(--sils-esp-2xs);
	color: inherit;
	font: inherit;
	letter-spacing: inherit;
}

.sils-portes-ventana .sils-portes-ventana__texto p:last-child {
	margin-bottom: 0;
}

.sils-portes-ventana .sils-portes-ventana__texto a {
	color: var(--sils-principal);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.25em;
}

/* La equis: sin caja, gris, a 44 px de lado para el dedo. */
.sils-portes-ventana .sils-portes-ventana__cerrar,
.sils-portes-ventana .sils-portes-ventana__cerrar:focus,
.sils-portes-ventana .sils-portes-ventana__cerrar:active {
	position: absolute;
	top: 0.8rem;
	right: 0.8rem;
	display: grid;
	place-items: center;
	width: 4.4rem;
	height: 4.4rem;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--sils-secundario);
	font-size: var(--sils-txt-2xs, 1.4rem);
	line-height: 1;
	cursor: pointer;
	transition: color 0.2s ease;
}

.sils-portes-ventana .sils-portes-ventana__cerrar:hover,
.sils-portes-ventana .sils-portes-ventana__cerrar:focus-visible {
	background: transparent;
	color: var(--sils-texto);
}

.sils-portes-ventana .sils-portes-ventana__cerrar:focus:not(:focus-visible) {
	outline: none;
}

.sils-portes-ventana .sils-portes-ventana__cerrar:focus-visible {
	outline: 1px solid var(--sils-texto);
	outline-offset: -0.4rem;
}

@media (prefers-reduced-motion: reduce) {
	.sils-portes-ventana,
	.sils-portes-ventana__caja,
	.sils-portes.sils-portes[data-sils-portes] {
		transition: none;
	}
}

/* ── Totales del pago (CheckoutWC) ────────────────────────────────────────
   CheckoutWC da a los botones de sus totales el color de sus botones secundarios con
   !important: el aviso, con el suyo. */

.cfw-totals-list .sils-portes.sils-portes[data-sils-portes] {
	color: var(--sils-secundario) !important;
}

.cfw-totals-list .sils-portes.sils-portes[data-sils-portes]:hover,
.cfw-totals-list .sils-portes.sils-portes[data-sils-portes]:focus-visible {
	color: var(--sils-texto) !important;
}

/* sils-bricks.css */
/**
 * Estilos heredados del «CSS adicional» del personalizador (handle `sils-heredado`).
 * ---------------------------------------------------------------------------
 * Vivía en el plugin sils-puente-bricks; pasa al tema al disolverlo (30-sep-2026).
 * Son las reglas que apuntan a marcado de plugins y de WooCommerce (buscador,
 * carrito lateral de CheckoutWC, filtros de JetSmartFilters, megamenú, menú de
 * taxonomías) y a estilos base, con las variables del sistema (--sils-*).
 *
 * Al pasar al tema se quitaron las reglas de plugins ya borrados (WCPA, XT Swatches,
 * YITH Bundles, CF7, JetWoo Gallery) y las de clases de Elementor que nadie emite, y
 * las direcciones absolutas a /NEW pasaron a relativas.
 *
 * Se carga después de la hoja del tema (prioridad 30, depende de `bricks-frontend`).
 */

.grecaptcha-badge {
	display: none !important;
	visibility: hidden !important;
}

:root {
	--swatch-size: 45px;
	--swatch-label-size: 1.12rem;
	--product-card-height: 380px;
	--gallery-offset: 75px; 
	--selection-shadow: 1px 2px 8px 1px var(--wcpaimageselectionshadow);

	
	--icon-arrow-down: url('https://cuadrossils.de/wp-content/uploads/2026/04/arrow-down-svgrepo-com.svg');
}

:focus-visible {
	outline: none !important;
}

.added_to_cart.wc-forward {
	display: none !important;
	visibility: hidden;
}

table tbody > tr:nth-child(odd) > td,
table tbody > tr:nth-child(odd) > th {
	background-color: transparent;
}

.sils-tax-menu {
	display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.sils-tax-menu__item {
	display: flex;
    align-items: center;
    gap: var(--sils-esp-2xs, 8px);
    text-decoration: none;
    color: inherit;
    width: calc(50% - 5px);
}

.sils-tax-menu__swatch {
	display: block;
    width: 20px;
    height: 20px;
    border-style: solid;
    border-width: 1px;
    border-color: var(--sils-gris-claro);
    border-radius: 50px;
    overflow: hidden;
    flex-shrink: 0;
}

.sils-tax-menu__swatch--multicolor {
	background: conic-gradient(red, orange, yellow, green, blue, violet, red);
}

.sils-tax-menu__label {
	font-family: var(--sils-fuente-thoren), Sans-serif;
    font-size: var(--sils-txt-2xs, 1.4rem);
    font-weight: 300;
    text-transform: none;
    line-height: 1.2em;
	color: var(--sils-principal);
}

.sils-tax-menu__label:hover {
	color: var(--sils-secundario)
}

.dgwt-wcas-sf-wrapp {
	width: 70dvw;
    left: 50%;
    transform: translateX(-50%);
}

html:not(.dgwt-wcas-overlay-mobile-on) .dgwt-wcas-search-wrapp.dgwt-wcas-layout-icon .dgwt-wcas-search-form {
	position: fixed;
	top: 20dvh;
	left: 0 !important;
	width: 100%;
}

html:not(.dgwt-wcas-overlay-mobile-on) .dgwt-wcas-style-pirx.dgwt-wcas-style-pirx-compact.dgwt-wcas-search-focused .dgwt-wcas-sf-wrapp input[type=search].dgwt-wcas-search-input {
	border-color: transparent;
}

svg.dgwt-wcas-ico-magnifier-handler path {
	fill: #fff;
}

.js-dgwt-wcas-initialized {
	font-family: var(--sils-fuente-crista);
}

.dgwt-wcas-st {
	flex-direction: row !important;
	align-items: baseline;
	font-weight: 300 !important
}

.dgwt-wcas-st strong {
	font-weight: 300 !important
}

.dgwt-wcas-has-headings .dgwt-wcas-suggestion-headline .dgwt-wcas-st {
	font-family: var(--sils-fuente-thoren), Sans-serif;
    font-size: var(--sils-txt-xs, 1.5rem);
    font-weight: 400 !important;
    text-transform: uppercase;
    line-height: 1.2em;
    letter-spacing: 0.05rem;
    color: var(--sils-secundario);
}

.dgwt-wcas-suggestions-wrapp {
	font-family: var(--sils-fuente-thoren) !important;
	width: 70dvw !important;
	max-height: 60dvh !important;
	left: 50% !important;
	transform: translatex(-50%)
}

.dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp, .dgwt-wcas-details-left .dgwt-wcas-details-wrapp {
	border-radius: 0px !important;
}

.dgwt-wcas-open-pirx .dgwt-wcas-open .dgwt-wcas-suggestions-wrapp, .dgwt-wcas-open-pirx .dgwt-wcas-open.dgwt-wcas-nores .dgwt-wcas-suggestions-wrapp {
	border-radius: 0;
}

.dgwt-wcas-datails-title,
.dgwt-wcas-pd-title {
	border-bottom: none;
}

.dgwt-wcas-pd-addtc.js-dgwt-wcas-pd-addtc,
.dgwt-wcas-details-hr {
	display: none;
}

.dgwt-wcas-details-product-title {
	font-size: var(--sils-txt-l, 2rem);
	color: var(--sils-principal) !important;
}

a.dgwt-wcas-details-product-title:hover {
	text-decoration: none;
}

.dgwt-wcas-pd-price,
.dgwt-wcas-tpd-price {
	color: var(--sils-principal);
	font-size: var(--sils-txt-s, 1.6rem);
	order: 1;
	display: none;
}

.dgwt-wcas-suggestion.dgwt-wcas-suggestion-tax {
	padding: 0.2em 1em !important;
}

.dgwt-wcas-sku {
	color: var(--sils-secundario);
}

.dgwt-wcas-is-details .dgwt-wcas-si, .dgwt-wcas-si img {
	width: 100% !important;    max-height: 100%;
    object-fit: contain;
    object-position: bottom;
    background: transparent;
    margin-bottom: var(--sils-esp-2xs, 8px);
}

.dgwt-wcas-has-img .dgwt-wcas-suggestion.dgwt-wcas-suggestion-product {
	flex: 25%;
	display: flex;
  flex-direction: column;
	justify-content: flex-end;
	max-width: 25%;
	padding: 1em !important;
}

.dgwt-wcas-suggestions-wrapp {
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.dgwt-wcas-suggestion {
	align-items: flex-start;
}

.dgwt-wcas-content-wrapp {
	flex-direction: column;
	align-items: flex-start;
	height: auto;
	padding: 0;
}

.dgwt-wcas-si img,
.dgwt-wcas-details-main-image img {
	border: none;
	padding: 0;
	border-radius: 0 !important;
  filter: drop-shadow(-5px 5px 5px rgba(0, 0, 0, 0.3));
}

.dgwt-wcas-si {
	width: 100%;
	display: flex;
}

.dgwt-wcas-content-wrapp .dgwt-wcas-st {
	display: flex;
    flex-direction: column !important;
}

.dgwt-wcas-sp {
	padding-left: 0;
	display: flex !important;
	flex-direction: row !important;
	align-items: baseline;
}

.dgwt-wcas-st-title {
	font-size: var(--sils-txt-s, 1.6rem);
}

.dgwt-wcas-sku {
	/* \1: la tipografía 37374fc ya no existe en el kit; hoy tampoco se aplica. */
}

.dgwt-wcas-meta {
	display:none;
}

/* (29-sep) Quitada la regla `.dgwt-wcas-meta span` (negro, !important, negrita) que venía del
   Personalizador: pisaba la colección y la referencia de las obras del buscador, que ahora
   dibuja Sils · Menús (assets/buscador.css). */

.dgwt-wcas-tpd-image {
	border: none;
	padding: 0;
}

.dgwt-wcas-tax-product-details {
	align-items: flex-start !important;
}

.dgwt-wcas-details-main-image img {
	width: 100%;
    height: 100%;
    object-fit: contain;
    max-height: 100%;
}

.dgwt-wcas-pd-price .ayudawp-lowest-price {
	display: none;
}

.dgwt-wcas-pd-price::after {
	content: var(--sils-css-texto-ver-opciones, "+ Ver opciones");
	font-family: var(--sils-fuente-thoren), Sans-serif;
    font-size: var(--sils-txt-2xs, 1.4rem);
    font-weight: 300;
    text-transform: none;
    line-height: 1.2em;
    letter-spacing: var(--sils-ls-texto, 0.12rem);
    word-spacing: normal;
	color: var(--sils-principal);
	order: 1;
}

.dgwt-wcas-search-wrapp {
	max-width: 100%
}

.dgwt-wcas-open-pirx .dgwt-wcas-full-width .dgwt-wcas-suggestions-wrapp>.dgwt-wcas-suggestion {
	border: none;
}

.dgwt-wcas-open-pirx .dgwt-wcas-details-inner, .dgwt-wcas-open-pirx .dgwt-wcas-suggestions-wrapp>.dgwt-wcas-suggestion {
	padding: 1em;
}

.dgwt-wcas-has-sku .dgwt-wcas-st-title {
	font-family: var(--sils-fuente-thoren), Sans-serif;
    font-size: var(--sils-txt-2xs, 14px);
    font-weight: 400;
    text-transform: uppercase;
    line-height: 1.2em;
    letter-spacing: 0.05rem;
    color: var(--sils-principal);
}

.dgwt-wcas-sku {
	font-family: var(--sils-fuente-thoren), Sans-serif;
    font-size: var(--sils-txt-3xs, 1.2rem) !important;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 1.1rem;
    letter-spacing: 0.025rem;
    word-spacing: normal;
    color: var(--sils-secundario);
}

.dgwt-wcas-details-space {
	padding: 0;
	display: flex;
  flex-direction: column;
}

.jet-filters-pagination__dots {
	border: none !important;
}

.jet-color-image-list__item input[data-url-value="multicolor"] ~ .jet-color-image-list__button .jet-color-image-list__color {
	background: conic-gradient(red, orange, yellow, green, blue, violet, red);
}

.jet-filter-items-dropdown .jet-color-image-list-wrapper {
	padding: 1em !important;
}

.jet-filter-items-dropdown .jet-filter-items-dropdown__label::after {
	content: '' !important;
	background: var(--icon-arrow-down);
	background-position: center;
	background-size: 10px;
	background-repeat: no-repeat;
	right: 0.5em !important;
	width: 20px !important;
	height: 20px !important;
	border: none !important;
}

.jet-filter-items-dropdown.jet-dropdown-open .jet-filter-items-dropdown__label::after {
	transform: rotate(180deg) translateY(50%);
	transform-origin: center center;
}

.jet-sorting.jet-sorting--flex-column::after {
	content: '' !important;
	background: var(--icon-arrow-down);
	background-position: center;
	background-size: 10px;
	background-repeat: no-repeat;
	right: 0.5em !important;
	width: 20px !important;
	height: 20px !important;
	border: none !important;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.jet-filter-items-dropdown .jet-filter-items-search__input:focus {
	outline: none;
	-webkit-box-shadow: none !important;
	box-shadow: none !important;
}

.jet-active-filters__list {
	flex-wrap: nowrap !important;
    overflow-x: auto;
}

.jet-active-filters__list .jet-active-filter {
	flex: none !important;
}

.jet-active-filters__list::-webkit-scrollbar {
	display: none;
}

.jet-gallery-swiper-slider {
	max-width: 100% !important;
}

.jet-gallery-swiper-thumb {
	position: absolute;
	right: 0;
	height: calc(100dvh - var(--gallery-offset));
}

#capa-marco-personalizada {
	position: absolute;
	top: 0;
	left: 10px !important;
	width: calc(100% - 10px);
	height: 100%;
	z-index: 20;
	pointer-events: none;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center center;
	transition: all 0.3s ease;
}

.woocommerce div.product form.cart .variations {
	margin-bottom: 0;
}

.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th {
	padding: 0;
}

table.variations td.label {
	padding: 0;
}

.variations_form table tbody tr:hover > td,
.variations_form table tbody tr:hover > th {
	background-color: transparent !important;
}

table.variations td.label label {
	font-family: var(--sils-fuente-thoren), Sans-serif !important;
    font-size: var(--sils-txt-3xs, 1.2rem) !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    line-height: 1.1rem !important;
    letter-spacing: 0.025rem !important;
	color: var(--sils-secundario) !important;
}

.woocommerce-variation.single_variation {
	display: none !important;
}

.swatch-inner.swatch-image-inner {
	box-shadow: none !important;
}

.swatch-image figcaption {
	font-size: var(--swatch-label-size) !important;
	font-style: normal;
	padding: 0;
	padding-top: 5px;
	text-align: center;
}

.wpca-marco-option span {
	font-size: var(--swatch-label-size) !important;
	font-style: normal !important;
	padding: 0;
	padding-top: 5px;
	text-align: center;
}

button.flecha-carrusel {
	background-color: #000;
	color: #fff;
	border: none;
	border-radius: 50px !important;
	height: 32px;
	width: 32px;
	padding: 0;
	font-size: var(--sils-txt-3xs, 1.2rem);
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	position: static;            
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
}

.flecha-carrusel:hover {
	background-color: var(--sils-texto) !important;
}

.carrusel-listo .flecha-carrusel:not(:disabled) {
	opacity: 1;
	pointer-events: auto;
}

.carrusel-listo .flecha-carrusel:disabled {
	opacity: 0.25;               
	pointer-events: none;
	cursor: default;
}

.single_add_to_cart_button {
	flex-basis: auto !important;
	flex-grow: 1 !important;
}

.woocommerce .add_to_cart_button {
	background-color: var(--sils-principal) !important;
	color: var(--sils-secundario) !important;
}

#cfw-side-cart {
	font-family: var(--sils-fuente-thoren);
}

#cfw-side-cart .cfw-side-cart-contents,
#cfw-side-cart .cfw-side-cart-contents-footer {
	padding: 0;
	margin: 0;
}

#cfw-side-cart #cfw-side-cart-form {
	padding: 0;
}

#cfw-side-cart .cfw-module {
	margin: 0 !important;
}

#cfw-side-cart .cfw-coupon-wrap {
	padding: 1em;
}

.cfw-side-cart-contents {
	overflow-y: auto;
	background: var(--sils-gris-claro);
}

#cfw_empty_side_cart_message {
	font-family: var(--sils-fuente-thoren), Sans-serif;
	font-size: var(--sils-txt-l, 2rem);
	font-weight: 400;
	line-height: 1em;
	letter-spacing: 0.05rem;
	text-align: center;
	margin-top: 2em;
}

.cfw-side-cart-contents-header {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 1em;
	width: 100%;
	margin: 0 !important;
}

#cfw-side-cart .cfw-side-cart-contents-header {
	justify-content: flex-start;
}

.cfw-side-cart-icon-solid {
	display: none;
}

.cfw-side-cart-contents-header:before {
	content: var(--sils-css-texto-carrito, "Carrito");
	order: 0;
}

.cfw-side-cart-close-btn {
	top: 1em !important;
	right: 1em !important;
}

#cfw-side-cart .cfw-side-cart-contents-header .cfw-side-cart-close-btn svg {
	height: 20px;
	width: 20px;
}

.cfw-side-cart-quantity {
	color: #fff
}

.cfw-side-cart-quantity-wrap .cfw-side-cart-quantity {
	padding-inline-start: 0;
	font-size: 0.8em;
}

.cfw-side-cart-quantity-wrap svg {
	width: auto;
	height: 24px;
}

.cfw-xtra-small {
	/* \1: la tipografía 37374fc ya no existe en el kit; hoy tampoco se aplica. */
}

#cfw-side-cart .cfw-cart-table .cart-item-row {
	display: flex;
	padding: 1em;
	border-top: 1px solid #d3d4d5 !important;
}

#cfw-side-cart .cfw-cart-table .cart-item-row td,
#cfw-side-cart .cfw-cart-table .cart-item-row > th {
	padding: 0;
	background: transparent !important;
}

#cfw-side-cart .cart-item-row:not(:only-child):not(:last-child) > * {
	border-bottom: none;
}

.cfw-cart-item-subtotal {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

#cfw-side-cart .cfw-remove-item-button {
	position: relative;
	top: 0;
}

#cfw-side-cart .amount {
	font-weight: 500;
}

#cfw-side-cart a:not(.cfw-primary-btn):not(.cfw-secondary-btn) {
	font-weight: 500;
}

#cfw-side-cart .cfw-cart-table .cart-item-row .cfw-cart-item-description .cfw-cart-item-data,
#cfw-side-cart .cfw-cart-table .cart-item-row .cfw-cart-item-image .cfw-cart-item-quantity-bubble {
	font-size: 0.8em;
}

#cfw-side-cart .cfw-quantity-stepper .cfw-quantity-stepper-btn-minus,
#cfw-side-cart .cfw-quantity-stepper .cfw-quantity-stepper-btn-plus {
	min-height: 20px;
}

#cfw-side-cart .cfw-quantity-stepper .cfw-quantity-stepper-btn-minus {
	border-right: none;
}

#cfw-side-cart .cfw-quantity-stepper .cfw-quantity-stepper-btn-plus {
	border-left: none;
}

#cfw-side-cart .cfw-quantity-stepper .cfw-quantity-stepper-btn-minus:hover,
#cfw-side-cart .cfw-quantity-stepper .cfw-quantity-stepper-btn-plus:hover {
	background: transparent;
}

#cfw-side-cart .cfw-quantity-stepper .cfw-quantity-stepper-btn-minus:hover svg,
#cfw-side-cart .cfw-quantity-stepper .cfw-quantity-stepper-btn-plus:hover svg {
	fill: var(--sils-texto);
}

#cfw-side-cart .cfw-cart-table .cart-item-row .cfw-cart-item-image,
#cfw-side-cart .cfw-cart-table .cart-item-row .cfw-cart-item-image img {
	width: 4em !important;
	object-fit: fill;
	height: 100%;
}

#cfw-side-cart .cfw-cart-table .cart-item-row .cfw-cart-item-image img {
	border: none;
}

#cfw-side-cart .cfw-cart-item-image-wrap {
	margin-top: 0;
}

#cfw-side-cart table td,
#cfw-side-cart table th {
	background: transparent;
}

/* ── Alto del carrito lateral: cabecera arriba, pie abajo y SOLO la lista se desplaza ──
   En pantallas de menos de 768 px CheckoutWC desplazaba el carrito entero (el pie no
   quedaba fijo) y lo medía con el alto de la ventana, que en el móvil no es el visible:
   al acabar la lista se podía seguir bajando. Ahora, en todas las pantallas, el carrito
   mide lo visible (dvh), el formulario no se desplaza y la lista ocupa lo que dejan la
   cabecera y el pie. Tras «Finalizar compra» no hay nada más. */
#cfw-side-cart {
	height: 100dvh;
}
#cfw-side-cart #cfw-side-cart-form {
	overflow: hidden;
}
#cfw-side-cart .cfw-side-cart-contents {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
}

/* ── Pie del carrito lateral: subtotal, envío, total y «Finalizar compra» ──────
   Rehecho el 28-sep-2026 con la pauta del resumen de compra de la ficha: datos en
   letra pequeña, en mayúsculas y gris; líneas finas; el total, un paso mayor; y el
   botón negro de la web (4 px de radio, letra de botón). Lo heredado no encajaba:
   etiquetas de 19 px en mayúsculas, raya negra de 2 px (de CheckoutWC), botón de
   60 px sin radio a sangre y el anillo doble de foco que se veía al abrir. */
#cfw-side-cart .cfw-side-cart-contents-footer .cfw-side-cart-contents-footer-border-shim {
	border-top-color: var(--sils-linea);
	padding-top: 0;
}
#cfw-side-cart .cfw-side-cart-totals {
	padding: var(--sils-esp-s) var(--sils-esp-s) var(--sils-esp-xs);
}
/* El contenedor de avisos de CheckoutWC deja 30 px de margen aunque esté vacío. */
#cfw-side-cart #cfw-alert-container:not(:has(*)) {
	margin: 0;
}
#cfw-side-cart .cfw-side-cart-totals table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}
/* CheckoutWC obliga a las celdas a heredar el color de su fila (`color: inherit
   !important`): por eso el color va en la fila (etiqueta en gris) y en el importe. */
#cfw-side-cart .cfw-side-cart-totals table tr {
	padding: 0;
	color: var(--sils-secundario);
}
#cfw-side-cart .cfw-side-cart-totals table th,
#cfw-side-cart .cfw-side-cart-totals table td {
	padding: var(--sils-esp-3xs, 0.4rem) 0;
	vertical-align: baseline;
}
/* Subtotal y envío: la etiqueta, como las del resumen (pequeña, en mayúsculas y gris);
   el importe, a la derecha. */
#cfw-side-cart .cfw-side-cart-totals table th {
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	font-weight: 300;
	text-transform: uppercase;
	letter-spacing: 0.18rem;
	text-align: left;
}
#cfw-side-cart .cfw-side-cart-totals table td,
#cfw-side-cart .cfw-side-cart-totals table td .amount {
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-2xs);
	font-weight: 500;
	letter-spacing: 0.05rem;
	text-align: right;
	white-space: nowrap;
}
#cfw-side-cart .cfw-side-cart-totals table td .amount {
	color: var(--sils-texto);
}
/* Total: una línea fina encima y un paso mayor, sin mayúsculas, como en la ficha. */
#cfw-side-cart .cfw-side-cart-totals table tr.order-total {
	border-top: 1px solid var(--sils-linea);
	color: var(--sils-texto);
}
#cfw-side-cart .cfw-side-cart-totals table tr.order-total th,
#cfw-side-cart .cfw-side-cart-totals table tr.order-total td {
	padding-top: var(--sils-esp-xs);
}
#cfw-side-cart .cfw-side-cart-totals table tr.order-total th,
#cfw-side-cart .cfw-side-cart-totals table tr.order-total td,
#cfw-side-cart .cfw-side-cart-totals table tr.order-total td .amount {
	font-size: var(--sils-txt-m);
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0.05rem;
}
/* «Finalizar compra»: el botón negro de la web, con aire alrededor; no una franja. */
#cfw-side-cart .wc-proceed-to-checkout {
	padding: 0 var(--sils-esp-s) var(--sils-esp-s);
}
#cfw-side-cart .cfw-primary-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 4.4rem;
	padding: 0 var(--sils-esp-s);
	border: 0;
	border-radius: var(--sils-radio, 0.4rem);
	background: var(--sils-principal);
	color: var(--sils-blanco);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-boton);
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.05rem;
	box-shadow: none;
	transition: background-color .2s ease;
}
#cfw-side-cart .cfw-primary-btn:focus,
#cfw-side-cart .cfw-primary-btn:focus-visible {
	box-shadow: none;
	color: var(--sils-blanco);
}
#cfw-side-cart .cfw-primary-btn:hover {
	background: color-mix(in srgb, var(--sils-principal) 86%, var(--sils-blanco));
	color: var(--sils-blanco);
}

.cfw-tw .max-w-28 {
	max-width: 4.8rem;
}

.cfw-grid .mb-2 {
	margin-bottom: 0 !important;
}

.woocommerce-order-details table th {
	text-align: left
}

input[type=file]::file-selector-button {
	display: none;
}

body ::placeholder {
	opacity: 1;
}

input:focus-visible, textarea:focus-visible {
	outline: none;
}

@media ( min-width: 767px ) {
	.cf-col-1 {
		-ms-flex: 0 0 8.333333%;
		flex: 0 0 8.333333%;
		max-width: 8.333333%;
	}
	.cf-col-2 {
		-ms-flex: 0 0 16.66667%;
		flex: 0 0 16.66667%;
		max-width: 16.66667%;
	}
	.cf-col-3 {
		-ms-flex: 0 0 25%;
		flex: 0 0 25%;
		max-width: 25%;
	}
	.cf-col-4 {
		-ms-flex: 0 0 33.33333%;
		flex: 0 0 33.33333%;
		max-width: 33.33333%;
	}
	.cf-col-5 {
		-ms-flex: 0 0 41.66667%;
		flex: 0 0 41.66667%;
		max-width: 41.66667%;
	}
	.cf-col-6 {
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		max-width: 50%;
	}
	.cf-col-7 {
		-ms-flex: 0 0 58.33333%;
		flex: 0 0 58.33333%;
		max-width: 58.33333%;
	}
	.cf-col-8 {
		-ms-flex: 0 0 66.66667%;
		flex: 0 0 66.66667%;
		max-width: 66.66667%;
	}
	.cf-col-9 {
		-ms-flex: 0 0 75%;
		flex: 0 0 75%;
		max-width: 75%;
	}
	.cf-col-10 {
		-ms-flex: 0 0 83.33333%;
		flex: 0 0 83.33333%;
		max-width: 83.33333%;
	}
	.cf-col-11 {
		-ms-flex: 0 0 91.66667%;
		flex: 0 0 91.66667%;
		max-width: 91.66667%;
	}
	.cf-col-12 {
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100%;
	}
}

@media (max-width: 1024px) {
	.filters-wrapper .jet-filter-items-dropdown__body {
		left: 0;
		width: 100vw;
		position: relative;
	}
	.xt_woovs-swatches {
		flex-wrap: nowrap !important;
		overflow-x: auto;
		padding: 5px !important;
	}
	.wcpa_wrap .wcpa_group_field {
		padding: 5px
	}
	.xt_woovs-swatches::-webkit-scrollbar {
		display: none;
	}
	#cfw-side-cart .cfw-cart-table .cart-item-row .cfw-cart-item-subtotal {
		padding-left: 0.5em;
	}
	#cfw-side-cart .cfw-cart-table .cart-item-row .cfw-cart-item-description {
		width: calc(100% - 4em);
		display: flex;
		flex-wrap: wrap;
		flex-direction: column-reverse;
	}
	#cfw-side-cart .cfw_side_cart_item_after_data {
		justify-content: flex-end;
	}
	#cfw-side-cart .cfw-cart-table .cart-item-row .cfw-cart-item-description .cfw-cart-item-title {
		font-size: var(--sils-txt-2xs, 14px);
		margin-left: -5em;
	}
	.cfw-items-summary-item-discount {
		margin-left: -4.5em;
		margin-top: 0.5em;
	}
	.cfw-cart-item-description {
		width: calc(100% - 5em);
	}
	.cart-item-row {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}
	#checkout .cart-item-row {
		flex-wrap: nowrap;
	}
	.cfw-cart-item-subtotal {
		width: 100%;
		display: flex;
		flex-direction: row-reverse;
	}
	#checkout .cfw-cart-item-subtotal {
		width: auto;
	}
}

@media (max-width: 768px) {
	.flecha-carrusel {
		display: none;
	}
}

@media (min-width: 768px) {
	.yith-wcpb-product-bundled-items::after {
		content: "";
		display: block;
		flex: 0 0 calc(100% - 6.4rem);
	}
}

@media (min-width: 1025px) {
	.filters-wrapper .jet-filter-items-dropdown__body {
		left: 1em;
		width: 450px;
	}
}

/* El buscador ya no se estiliza aquí: su hoja vive en «Sils · Menús»
   (assets/buscador.css) y se carga en las dos webs. */

/* Etiquetas sobre la foto de las tarjetas (15-oct-2026, petición del usuario): «Novedad»,
   «Composición · N obras» (componentes Bricks 7cc1fc y 7ffe42) y las de afinidad de las
   páginas de parecidas ([sils_afinidad], plugin sils-recomendaciones) son la misma
   etiqueta: un paso por debajo del texto pequeño, algo transparente. «Novedad» solo
   invierte los colores. Una sola definición para que no se separen. */
.sils-etiqueta-foto {
	display: block;
	margin: 0;
	padding: 0.3rem 0.6rem 0.1rem;
	background: var(--sils-blanco);
	color: var(--sils-texto);
	font-family: var(--sils-fuente-thoren), sans-serif;
	font-size: var(--sils-txt-4xs);
	font-weight: 400;
	line-height: 1.6rem;
	letter-spacing: 0.025rem;
	text-transform: uppercase;
	opacity: 0.85;
}

.sils-etiqueta-foto--invertida {
	background: var(--sils-principal);
	color: var(--sils-blanco);
}

/* tarjeta-inspiracion.css */
/*
 * Tarjeta de inspiración (componente de Bricks 7ffe42): propuesta «velo», EN PRUEBA.
 *
 * Hasta ahora, al pasar el ratón, una franja gris claro crecía de 0 a 5,6 rem sobre el pie
 * de la foto. Aquí, en su lugar, un velo oscuro en degradado desde abajo con el título y
 * guardar en blanco: entra con un fundido, sin ampliar ni mover nada (13-oct-2026: ningún
 * hover de tarjeta amplía ni mueve). En pantallas táctiles (sin ratón) el velo está
 * siempre, porque no hay «encima» y si no, no se podía guardar desde la tarjeta.
 *
 * Solo actúa con la clase `sils-tarjeta-velo` en el <body> (bricks-child/inc/catalogo.php).
 * Para ver la tarjeta de antes: `?sils_tarjeta=0` en la dirección. Si se aprueba, esto
 * pasa al CSS del componente y se borran este archivo y el interruptor.
 */

body.sils-tarjeta-velo .inspo-card .titulo-inspiracion,
body.sils-tarjeta-velo .inspo-card:hover .titulo-inspiracion {
	flex-wrap: nowrap;
	align-items: flex-end;
	height: auto;
	padding: 8rem var(--sils-esp-s) var(--sils-esp-s);
	background: linear-gradient(
		to top,
		color-mix(in srgb, var(--sils-principal) 72%, transparent),
		color-mix(in srgb, var(--sils-principal) 40%, transparent) 45%,
		transparent
	);
	transform: none;
	opacity: 0;
	pointer-events: none;
	transition: opacity .35s ease;
}

body.sils-tarjeta-velo .inspo-card:hover .titulo-inspiracion,
body.sils-tarjeta-velo .inspo-card:focus-within .titulo-inspiracion {
	opacity: 1;
}

/* El velo deja pasar el clic a la foto (enlace a la composición); el título y guardar, no. */
body.sils-tarjeta-velo .inspo-card .titulo-inspiracion > * {
	pointer-events: auto;
}

/* El título ocupa lo que sobra y guardar se queda a su derecha, abajo. */
body.sils-tarjeta-velo .inspo-card .titulo-inspiracion > p {
	flex: 1 1 auto;
	min-width: 0;
}

body.sils-tarjeta-velo .inspo-card .titulo-inspiracion p,
body.sils-tarjeta-velo .inspo-card .titulo-inspiracion p a {
	margin: 0;
	color: var(--sils-blanco);
	text-shadow: 0 1px 2px color-mix(in srgb, var(--sils-principal) 35%, transparent);
}

/* Guardar: el marcador en blanco; guardado, relleno en blanco. */
body.sils-tarjeta-velo .inspo-card .titulo-inspiracion .sils-listas-marcador,
body.sils-tarjeta-velo .inspo-card .titulo-inspiracion .sils-listas-marcador:hover,
body.sils-tarjeta-velo .inspo-card .titulo-inspiracion .sils-listas-marcador.es-guardada::before {
	color: var(--sils-blanco);
}

body.sils-tarjeta-velo .inspo-card .titulo-inspiracion .sils-listas-marcador {
	opacity: .85;
	transition: opacity .15s ease;
}

body.sils-tarjeta-velo .inspo-card .titulo-inspiracion .sils-listas-marcador:hover,
body.sils-tarjeta-velo .inspo-card .titulo-inspiracion .sils-listas-marcador.es-guardada {
	opacity: 1;
}

/* Táctil: el velo siempre visible. */
@media (hover: none) {
	body.sils-tarjeta-velo .inspo-card .titulo-inspiracion {
		opacity: 1;
	}
}

/* Móvil en horizontal: dos columnas estrechas, velo más bajo. En vertical va a una columna
 * (ajuste del mosaico de la plantilla 196494) y lleva el velo normal. */
@media (hover: none) and (min-width: 479px) and (max-width: 767px) {
	body.sils-tarjeta-velo .inspo-card .titulo-inspiracion,
	body.sils-tarjeta-velo .inspo-card:hover .titulo-inspiracion {
		padding: 5.6rem var(--sils-esp-xs) var(--sils-esp-xs);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.sils-tarjeta-velo .inspo-card .titulo-inspiracion {
		transition: none;
	}
}

/* filtros-panel.css */
/*
 * Barra de filtros de los archivos: panel lateral cuando no cabe (ver filtros-panel.js).
 *
 * Va después de la hoja de la barra (sils-filtros) y cuelga del id del panel
 * (#sils-panel-filtros; con dos barras en la página, como en las pestañas de una selección,
 * también #sils-panel-filtros-2) para ganar a los estilos por id que Bricks pone a la lista de
 * filtros (#brxe-acflis: fila con salto de línea).
 *
 * Estilo «cortado»: filas a todo el ancho separadas por líneas finas, sin cajas ni radios;
 * botones del pie con radio suave (4 px), como «Añadir» de la ficha. Estados de elección
 * con el check negro de «Crea tu pared».
 */

/* ── Colección elegida en la barra (escritorio, Inspiración) ─────────────── */
.sils-filtros__coleccion {
	display: none;
	align-items: center;
	padding: 1.5rem 2rem;
}

.sils-filtros__coleccion.es-visible {
	display: flex;
	animation: sils-panel-aparece .2s ease;
}

/* Como lo elegido dentro de cada desplegable (jet-filter-items-dropdown__active__item). */
.sils-filtros .sils-filtros__etiqueta,
.sils-filtros .sils-filtros__etiqueta:focus {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding: 0.1rem 0.6rem;
	border: 0;
	border-radius: 0.3rem;
	background-color: var(--sils-fondo-imagenes);
	box-shadow: none;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	font-weight: 400;
	line-height: 1.8rem;
	letter-spacing: 0.025rem;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color .15s ease;
}

.sils-filtros .sils-filtros__etiqueta:hover {
	background-color: var(--sils-linea);
}

.sils-filtros .sils-filtros__etiqueta:focus-visible {
	outline: 1px solid var(--sils-principal);
	outline-offset: 0.2rem;
}

/* ── La barra en tableta y móvil (hasta 1279 px) ─────────────────────────
 * El corte lo pone el CSS desde el primer pintado (el guion usa el mismo): la fila de
 * filtros, el ✕ y el orden no llegan a verse, y el guion los lleva al panel. Si esto lo
 * decidiera el guion, la fila se vería aparecer y desaparecer al cargar.
 * `!important` para ganar al CSS por id de Bricks (#brxe-acflis lleva display: flex).
 * `.brxe-container` distingue la barra del panel, que también lleva `sils-filtros`.
 */
.sils-filtros__abrir,
.sils-panel__cabeza {
	display: none;
}

.sils-filtros__abrir i {
	font-size: var(--sils-txt-2xs, 1.4rem);
}

@media (max-width: 1279px) {
	.brxe-container.sils-filtros > .sils-filtros__lista,
	.brxe-container.sils-filtros .brxe-jet-smart-filters-sorting,
	.brxe-container.sils-filtros .brxe-jet-smart-filters-remove-filters {
		display: none !important;
	}

	.brxe-container.sils-filtros {
		min-height: 5rem;
	}

	.brxe-container.sils-filtros > :has(> .sils-filtros__cuenta) {
		flex-grow: 1;
	}

	.brxe-container.sils-filtros .sils-filtros__cuenta {
		min-width: 0;
		margin-right: auto;
		padding: 0 var(--sils-margen-seguridad);
		text-align: left;
	}

	.brxe-container.sils-filtros .sils-filtros__abrir,
	.brxe-container.sils-filtros .sils-filtros__abrir:focus {
		display: flex;
		align-items: center;
		gap: var(--sils-esp-2xs, 0.8rem);
		min-height: 4.8rem;
		margin: 0;
		padding: 0 var(--sils-margen-seguridad) 0 1.6rem;
		border: 0;
		border-left: 1px solid var(--sils-principal);
		border-radius: 0;
		background: none;
		box-shadow: none;
		color: var(--sils-principal);
		font-family: var(--sils-fuente-thoren);
		font-size: var(--sils-txt-xs);
		font-weight: 400;
		line-height: 1.2;
		letter-spacing: 0.05rem;
		text-transform: uppercase;
		white-space: nowrap;
		cursor: pointer;
		animation: sils-panel-aparece .2s ease;
	}

	.brxe-container.sils-filtros .sils-filtros__abrir:hover {
		background-color: color-mix(in srgb, var(--sils-principal) 4%, transparent);
	}

	.brxe-container.sils-filtros .sils-filtros__abrir:focus-visible {
		outline: 1px solid var(--sils-principal);
		outline-offset: -0.4rem;
	}
}

/* Nº de filtros puestos: el contador de la cabecera, en negro. */
.sils-filtros__num {
	display: none;
	align-items: center;
	justify-content: center;
	min-width: 1.6rem;
	height: 1.6rem;
	padding: 0 var(--sils-esp-3xs, 0.4rem);
	border-radius: 0.8rem;
	background-color: var(--sils-principal);
	color: var(--sils-blanco);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-4xs, 1.1rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0;
}

.sils-filtros__num:not(:empty) {
	display: inline-flex;
}

/* ── El panel ───────────────────────────────────────────────────────────── */
html.sils-panel-abierto,
html.sils-panel-abierto body {
	overflow: hidden;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) {
	position: fixed;
	inset: 0;
	z-index: 100000;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2)[hidden] {
	display: none;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__velo {
	position: absolute;
	inset: 0;
	background-color: color-mix(in srgb, var(--sils-principal) 40%, transparent);
	opacity: 0;
	transition: opacity .32s ease;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__hoja {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	display: flex;
	flex-direction: column;
	width: min(100%, 44rem);
	background-color: var(--sils-blanco);
	color: var(--sils-principal);
	transform: translateX(100%);
	transition: transform .32s cubic-bezier(.22, .61, .36, 1);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2).es-abierto .sils-panel__velo {
	opacity: 1;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2).es-abierto .sils-panel__hoja {
	transform: none;
}

/* Cabecera: título y cerrar, con línea negra como la barra. */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__barra {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	flex-shrink: 0;
	min-height: 5.6rem;
	border-bottom: 1px solid var(--sils-principal);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__titulo {
	display: flex;
	align-items: center;
	gap: var(--sils-esp-2xs, 0.8rem);
	margin: 0;
	padding: 0 var(--sils-margen-seguridad);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cerrar,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cerrar:focus {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 5.6rem;
	margin: 0;
	padding: 0;
	border: 0;
	border-left: 1px solid var(--sils-principal);
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: var(--sils-principal);
	font-size: var(--sils-txt-s, 1.6rem);
	cursor: pointer;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cerrar:hover {
	background-color: var(--sils-gris-claro);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cerrar:focus-visible {
	outline: 1px solid var(--sils-principal);
	outline-offset: -0.4rem;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__contenido {
	flex: 1 1 auto;
	overflow-y: auto;
	overscroll-behavior: contain;
}

/* ── Filas: Ordenar, Colección y cada filtro ─────────────────────────────── */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-filtros__lista {
	display: block;
	width: 100%;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__orden,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__seccion,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-filtros__lista > [data-sils-nombre] {
	display: block;
	border: 0;
	border-bottom: 1px solid var(--sils-linea);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-filtros__coleccion {
	display: none;
}

/* Filtro sin opciones: JetSmartFilters lo oculta (style="display: none"); su sección, también. */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-filtros__lista > [data-sils-nombre]:has(> .jet-filter[style*="display: none"]) {
	display: none;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__nombre {
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-xs);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
}

/* Ordenar: el nombre a la izquierda y el selector de JetSmartFilters a la derecha. */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__orden {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sils-esp-s, 1.6rem);
	min-height: 5.6rem;
	padding-left: var(--sils-margen-seguridad);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__orden .brxe-jet-smart-filters-sorting {
	align-self: stretch;
	display: flex;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__orden .jet-sorting-select {
	height: 100%;
	min-width: 0;
	padding: 0 calc(var(--sils-margen-seguridad) + 2.4rem) 0 1.6rem;
	border: 0;
	background: none;
	color: var(--sils-principal);
	font-size: var(--sils-txt-xs);
	text-align: right;
	text-align-last: right;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__orden .jet-sorting::after {
	right: calc(var(--sils-margen-seguridad) - 0.4rem);
}

/* Cabecera desplegable de cada sección. */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cabeza,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cabeza:focus {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sils-esp-s, 1.6rem);
	width: 100%;
	min-height: 5.6rem;
	margin: 0;
	padding: 1.2rem var(--sils-margen-seguridad);
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: var(--sils-principal);
	text-align: left;
	text-transform: none;
	letter-spacing: normal;
	cursor: pointer;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cabeza:hover {
	background-color: var(--sils-gris-claro);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cabeza:focus-visible {
	outline: 1px solid var(--sils-principal);
	outline-offset: -0.4rem;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__rotulo {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	min-width: 0;
}

/* Lo elegido, bajo el nombre y en una línea. */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__elegidos {
	overflow: hidden;
	color: var(--sils-secundario);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	font-weight: 300;
	line-height: 1.3;
	letter-spacing: 0.025rem;
	text-overflow: ellipsis;
	white-space: nowrap;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__elegidos:empty {
	display: none;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cabeza i {
	flex-shrink: 0;
	font-size: var(--sils-txt-3xs, 1.2rem);
	transition: transform .32s cubic-bezier(.22, .61, .36, 1);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .es-abierta > .sils-panel__cabeza i {
	transform: rotate(180deg);
}

/* El filtro de JetSmartFilters dentro de su sección: sin su etiqueta de desplegable y con
 * el cuerpo en su sitio, que se abre animando el alto. */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-filtros__lista > [data-sils-nombre] > * {
	flex: none;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .jet-filter-items-dropdown {
	height: auto;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .jet-filter-items-dropdown__label {
	display: none;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .jet-filter-items-dropdown__body,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opciones {
	display: block;
	position: static;
	width: auto;
	height: 0;
	margin: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	overflow: hidden;
	visibility: hidden;
	transition: height .32s cubic-bezier(.22, .61, .36, 1), visibility 0s linear .32s;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .es-abierta .jet-filter-items-dropdown__body,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .es-abierta > .sils-panel__opciones {
	visibility: visible;
	transition: height .32s cubic-bezier(.22, .61, .36, 1), visibility 0s;
}

/* Casillas y colores: dos columnas, con más aire para el dedo. */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .jet-checkboxes-list-wrapper,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .jet-color-image-list-wrapper {
	margin: 0;
	padding: 0 var(--sils-margen-seguridad) 1.6rem;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .jet-checkboxes-list__row {
	margin: 0 0 0.2rem;
	padding-top: 0;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .jet-checkboxes-list__button {
	padding: 1rem var(--sils-esp-2xs, 0.8rem);
}

/* Colección: una fila por logo con el check negro de «Crea tu pared». */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opcion,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opcion:focus {
	position: relative;
	display: grid;
	grid-template-columns: 1fr 2rem;
	align-items: center;
	gap: var(--sils-esp-s, 1.6rem);
	width: 100%;
	min-height: 5.6rem;
	margin: 0;
	padding: 1rem var(--sils-margen-seguridad);
	border: 0;
	border-top: 1px solid var(--sils-linea);
	border-radius: 0;
	background: none;
	box-shadow: none;
	cursor: pointer;
	transition: background-color .16s ease, opacity .2s ease;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opcion:hover,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opcion.is-activa {
	background-color: var(--sils-gris-claro);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opcion.is-activa {
	box-shadow: inset 2px 0 0 var(--sils-principal);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opcion:disabled {
	opacity: .35;
	cursor: default;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opcion:focus-visible {
	outline: 1px solid var(--sils-principal);
	outline-offset: -0.4rem;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__logo img {
	display: block;
	width: auto;
	max-width: 18rem;
	height: 4.4rem;
	object-fit: contain;
	object-position: left center;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__check {
	position: relative;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background-color: var(--sils-principal);
	opacity: 0;
	transform: scale(.6);
	transition: opacity .2s ease, transform .24s cubic-bezier(.22, .61, .36, 1);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__check::before {
	content: '';
	position: absolute;
	inset: 0;
	background-color: var(--sils-blanco);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 1rem no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 1rem no-repeat;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opcion.is-activa .sils-panel__check {
	opacity: 1;
	transform: none;
}

/* ── Pie: Limpiar y Ver N obras ──────────────────────────────────────────── */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__pie {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--sils-esp-xs, 1.2rem);
	flex-shrink: 0;
	padding: 1.2rem var(--sils-margen-seguridad) calc(1.2rem + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--sils-principal);
	background-color: var(--sils-blanco);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__limpiar,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__ver {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--sils-esp-2xs, 0.8rem);
	height: 4.4rem;
	margin: 0;
	padding: 0 2rem;
	border: 1px solid var(--sils-principal);
	border-radius: var(--sils-radio, 0.4rem);
	box-shadow: none;
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-boton);
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .15s ease, color .15s ease, opacity .2s ease;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__limpiar,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__limpiar:focus {
	background-color: var(--sils-blanco);
	color: var(--sils-principal);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__limpiar:hover {
	background-color: var(--sils-gris-claro);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__ver,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__ver:focus {
	background-color: var(--sils-principal);
	color: var(--sils-blanco);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__ver:hover {
	background-color: var(--sils-texto);
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__limpiar:focus-visible,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__ver:focus-visible {
	outline: 1px solid var(--sils-principal);
	outline-offset: 0.2rem;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__limpiar:disabled,
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__ver:disabled {
	opacity: .35;
	cursor: default;
}

/* Mientras llega el listado: anillo de 12 px y «Actualizando». */
:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__giro {
	display: none;
	width: 1.2rem;
	height: 1.2rem;
	border: 0.15rem solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: sils-gira .8s linear infinite;
}

:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__ver.es-cargando .sils-panel__giro {
	display: block;
}

/* ── Rejilla del móvil: 1 o 2 obras por fila ─────────────────────────────
 * Dos botones en la barra (filtros-panel.js), siempre a la vista: el de la rejilla que se ve,
 * en negro; el otro, en gris. Solo hasta 767 px: la rejilla de Bricks pasa ahí a
 * 2 columnas (`mobile_landscape`). La elección cuelga de <html>: `sils-rejilla` (interruptor,
 * inc/catalogo.php) y `sils-rejilla-1|2` (lo elegido; sin elección, cada archivo sale como
 * siempre: obras de 2 en 2, Inspiración de 1 en 1 en todo el móvil, también en horizontal
 * desde el 30-oct-2026, ajuste del mosaico de la plantilla 196494). Inspiración guarda su
 * elección aparte (`sils-rejilla-inspo`, ver inc/catalogo.php).
 * A una por fila, la imagen de la tarjeta pasa de 22,5 rem a 1,25 veces el ancho (tope 80 %
 * del alto de la pantalla), que es para lo que se elige: ver la obra más grande.
 * `!important` para ganar al CSS por id de Bricks (#brxe-acrgrd).
 */
.sils-filtros__rejilla {
	display: none;
}

@media (max-width: 767px) {
	html.sils-rejilla .brxe-container.sils-filtros .sils-filtros__rejilla {
		display: flex;
		flex: 0 0 auto;
		align-items: stretch;
		border-left: 1px solid var(--sils-principal);
		animation: sils-panel-aparece .2s ease;
	}

	html.sils-rejilla .brxe-container.sils-filtros .sils-filtros__rejilla > button,
	html.sils-rejilla .brxe-container.sils-filtros .sils-filtros__rejilla > button:focus {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 4.4rem;
		min-height: 4.8rem;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: none;
		box-shadow: none;
		color: var(--sils-secundario);
		cursor: pointer;
		transition: color .2s ease;
	}

	html.sils-rejilla .brxe-container.sils-filtros .sils-filtros__rejilla > button[aria-pressed="true"] {
		color: var(--sils-principal);
		cursor: default;
	}

	/* Solo con ratón: en el móvil el «encima» se queda pegado tras tocar. */
	@media (hover: hover) {
		html.sils-rejilla .brxe-container.sils-filtros .sils-filtros__rejilla > button:hover {
			color: var(--sils-principal);
		}
	}

	/* Con el botón, la barra no se parte: si no cabe (Inspiración a 360 px, «733
	 * composiciones»), el nº de obras pasa a dos líneas dentro de su celda. */
	html.sils-rejilla .brxe-container.sils-filtros .sils-filtros__derecha {
		flex-wrap: nowrap !important;
	}

	html.sils-rejilla .brxe-container.sils-filtros .sils-filtros__cuenta {
		flex: 1 1 0;
		min-width: 0;
		padding-right: var(--sils-esp-2xs, 0.8rem);
		line-height: 1.25;
		white-space: normal;
		overflow-wrap: anywhere;
	}

	html.sils-rejilla .brxe-container.sils-filtros .sils-filtros__rejilla > button:focus-visible {
		outline: 1px solid var(--sils-principal);
		outline-offset: -0.4rem;
	}

	.sils-filtros__rejilla i {
		font-size: var(--sils-txt-s, 1.6rem);
	}

	/* Obras (rejilla de Bricks). */
	html.sils-rejilla-1 .brx-grid:has(> .jsfb-query--cuadros) {
		grid-template-columns: minmax(0, 1fr) !important;
		--sils-alto-tarjeta: min(calc((100vw - 2 * var(--sils-margen-seguridad)) * 1.25), 80svh);
	}

	/* Inspiración (mosaico de Bricks). */
	html.sils-rejilla-1 .bricks-masonry:has(> .jsfb-query--cuadros) {
		--columns: 1 !important;
	}

	html.sils-rejilla-2 .bricks-masonry:has(> .jsfb-query--cuadros) {
		--columns: 2 !important;
	}

	/* El cambio se funde: sale en 0,16 s y entra en 0,2 s, sin saltos. */
	html.sils-rejilla :is(.brx-grid, .bricks-masonry):has(> .jsfb-query--cuadros) {
		transition: opacity .2s ease;
	}

	html.sils-rejilla :is(.brx-grid, .bricks-masonry).sils-rejilla-cambia:has(> .jsfb-query--cuadros) {
		opacity: 0;
		transition-duration: .16s;
	}
}

@keyframes sils-panel-aparece {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes sils-gira {
	to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
	:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__velo,
	:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__hoja,
	:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__cabeza i,
	:is(#sils-panel-filtros, #sils-panel-filtros-2) .jet-filter-items-dropdown__body,
	:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__opciones,
	:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__check,
	html.sils-rejilla :is(.brx-grid, .bricks-masonry):has(> .jsfb-query--cuadros) { transition: none; }

	:is(#sils-panel-filtros, #sils-panel-filtros-2) .sils-panel__giro { animation-duration: 2s; }
}

/* sils.css */
/*
 * Pago (CheckoutWC, plantilla «futurist») con el sistema de Cuadros Sils.
 * Colores, fuentes y logo van por el filtro de inc/pago.php; aquí, la forma:
 * - Pasos como pestañas con línea inferior.
 * - Campos como el formulario de Contacto (gris, sin borde).
 * - Botones como el «Añadir» de la ficha y el «Finalizar compra» del carrito lateral:
 *   negros, radio suave (4 px), 44 px de alto.
 * - El resumen del carrito (el de escritorio y el de móvil), igual que el carrito lateral
 *   (sus reglas están en bricks-child/assets/sils-bricks.css y sils-addons/.../carrito.css;
 *   las de los datos de cada obra y las composiciones, compartidas en carrito.css).
 * - Pedido recibido (página de gracias de CheckoutWC, ver inc/gracias.php): el mismo
 *   resumen con fotos y las composiciones como un bloque, como en el carrito.
 * El carrito lateral NO se toca desde aquí: vive en sils-bricks.css.
 *
 * OJO: en el pago CheckoutWC quita las hojas de Bricks. Allí 1rem son 16 px (no 10 px como
 * en el resto de la web) y la fuente no llega: se declara aquí. Por eso las medidas de este
 * archivo van en em sobre 16 px (1em = 16 px), salvo las del botón (px).
 * Tiene que vivir en una carpeta «checkout-wc» para que CheckoutWC no la quite.
 */

@font-face {
	font-family: "Thoren Sans";
	font-weight: 300;
	font-display: swap;
	src: url("https://cuadrossils.de/wp-content/uploads/2026/09/thorensans_light-webfont.woff2") format("woff2");
}

@font-face {
	font-family: "Thoren Sans";
	font-weight: 500;
	font-display: swap;
	src: url("https://cuadrossils.de/wp-content/uploads/2026/09/thorensans_medium-webfont.woff2") format("woff2");
}

@font-face {
	font-family: "Crista";
	font-weight: 400;
	font-display: swap;
	src: url("https://cuadrossils.de/wp-content/uploads/2026/09/CristaRegular.woff2") format("woff2");
}

/* ── General ──────────────────────────────────────────────────────────────── */

body.checkout-wc {
	font-weight: 300;
	letter-spacing: 0.075em;
}

/* CheckoutWC fija .3px en todo el formulario (main.checkoutwc) y el texto se veía apretado:
   el espaciado del sistema (1,2 px, el de --sils-ls-texto en la web). */
body.checkout-wc main.checkoutwc {
	letter-spacing: 0.075em;
}

body.checkout-wc strong,
body.checkout-wc b {
	font-weight: 500;
}

/* Cabecera: la misma altura que la de la web (70 px) y su logo. */
body.checkout-wc #cfw-header {
	padding: 0;
}

/* Su fila trae márgenes negativos y en móvil ensanchaba la página 5 px. */
body.checkout-wc #cfw-header .row {
	margin-right: 0;
	margin-left: 0;
}

body.checkout-wc #cfw-logo-container .cfw-logo .logo {
	height: 1.75em;
	margin: 1.3em auto;
	background-repeat: no-repeat;
	background-size: contain;
}

/* Títulos: Thoren normal, en mayúsculas, como los de la web. */
body.checkout-wc h1,
body.checkout-wc h2,
body.checkout-wc h3,
body.checkout-wc .cfw-panel-heading {
	color: var(--sils-principal);
	font-weight: 400;
	letter-spacing: 0.03em;
}

body.futurist.checkout-wc h3 {
	margin-bottom: 1.25em;
	font-size: 1.25em;
	font-weight: 400;
}

/* ── Pasos: pestañas con línea inferior ───────────────────────────────────── */
/* Como las pestañas de la web (portada: Vanguard · Obra Gráfica · Obra Original): texto
   normal, sin mayúsculas; la activa en negro con su raya y las demás en gris (21-oct). */

body.futurist.checkout-wc #cfw-breadcrumb {
	justify-content: flex-start;
	gap: 1.75em;
	max-width: none;
	margin: 0 0 2.5em;
	border-bottom: 1px solid var(--sils-linea);
	counter-reset: sils-paso;
}

body.futurist.checkout-wc #cfw-breadcrumb::after,
body.futurist.checkout-wc #cfw-breadcrumb li::before,
body.futurist.checkout-wc #cfw-breadcrumb li:not(:last-child)::after {
	display: none;
}

body.futurist.checkout-wc #cfw-breadcrumb li {
	flex: none;
	width: auto;
	margin: 0;
	background: none;
	font-size: 1em;
	counter-increment: sils-paso;
}

body.futurist.checkout-wc #cfw-breadcrumb li > a {
	position: relative;
	padding: 1em 0 0.9em;
	color: var(--sils-secundario);
	font-size: 1em;
	font-weight: 400;
	letter-spacing: 0.075em;
	text-align: left;
	text-transform: none;
	transition: color 0.2s ease;
}

body.futurist.checkout-wc #cfw-breadcrumb li > a:hover {
	color: var(--sils-principal);
}

body.futurist.checkout-wc #cfw-breadcrumb li > a::before {
	content: counter(sils-paso) ". ";
}

/* La raya de la pestaña activa, sobre la línea de abajo. */
body.futurist.checkout-wc #cfw-breadcrumb li > a::after {
	top: auto;
	bottom: -1px;
	height: 2px;
	background: transparent;
	transition: background-color 0.2s ease;
}

body.futurist.checkout-wc #cfw-breadcrumb li.tab.active > a {
	color: var(--sils-principal);
}

body.futurist.checkout-wc #cfw-breadcrumb li.tab.active > a::after {
	background: var(--sils-principal);
}

@media (max-width: 767.98px) {
	/* En móvil el contenedor deja 5 px y las columnas 20: las pestañas, a 20 como lo demás. */
	body.futurist.checkout-wc #cfw-breadcrumb {
		justify-content: space-between;
		gap: 1em;
		width: auto;
		margin-right: 15px;
		margin-left: 15px;
	}
}

/* ── Campos: gris, sin borde, radio pequeño (como Contacto) ───────────────── */

body.checkout-wc .checkoutwc .form-row input[type="email"],
body.checkout-wc .checkoutwc .form-row input[type="number"],
body.checkout-wc .checkoutwc .form-row input[type="password"],
body.checkout-wc .checkoutwc .form-row input[type="tel"],
body.checkout-wc .checkoutwc .form-row input[type="text"],
body.checkout-wc .checkoutwc .form-row select,
body.checkout-wc .checkoutwc .form-row textarea,
body.checkout-wc #cfw-cart-summary input[type="text"] {
	border: 1px solid var(--sils-fondo-imagenes) !important;
	border-radius: 0.3125em !important;
	background: var(--sils-fondo-imagenes);
	color: var(--sils-texto);
	font-family: "Thoren Sans", sans-serif;
	font-weight: 300;
	letter-spacing: 0.06em;
}

/* Sin las casillas ni los radios: su «marcado» de CheckoutWC es una sombra interior, y al
   quitarla con el foco, la casilla de los términos se quedaba en blanco tras pulsarla. */
body.checkout-wc .checkoutwc .form-row input:not([type="checkbox"]):not([type="radio"]):focus,
body.checkout-wc .checkoutwc .form-row select:focus,
body.checkout-wc .checkoutwc .form-row textarea:focus,
body.checkout-wc #cfw-cart-summary input[type="text"]:focus {
	border-color: var(--sils-principal) !important;
	box-shadow: none !important;
}

body.checkout-wc .checkoutwc .form-row input::placeholder,
body.checkout-wc .checkoutwc .form-row textarea::placeholder {
	color: var(--sils-secundario);
}

body.checkout-wc .checkoutwc .form-row label.cfw-floatable-label {
	color: var(--sils-secundario);
}

body.checkout-wc .select2-container--default .select2-selection--single {
	border: 1px solid var(--sils-fondo-imagenes) !important;
	border-radius: 0.3125em !important;
	background: var(--sils-fondo-imagenes);
}

/* ── Casillas y radios: como los de la web (acceso, Mi cuenta) ────────────── */
/* 16 px, borde gris; marcados, en negro (la casilla, cuadrada y con su marca blanca; el
   radio, con el punto blanco). CheckoutWC los pinta a 18 px, con borde casi blanco y la
   casilla redondeada; su tamaño va con !important. */

body.checkout-wc main.checkoutwc input[type="checkbox"],
body.checkout-wc main.checkoutwc input[type="radio"] {
	width: 16px !important;
	height: 16px !important;
	min-width: 16px !important;
	margin-inline-end: 8px !important;
	border: 1px solid var(--sils-secundario);
	vertical-align: -3px;
}

body.checkout-wc main.checkoutwc input[type="checkbox"] {
	border-radius: 0;
}

body.checkout-wc main.checkoutwc input[type="checkbox"]:checked,
body.checkout-wc main.checkoutwc input[type="radio"]:checked {
	border: 0;
	box-shadow: inset 0 0 0 10px var(--sils-principal);
}

body.checkout-wc main.checkoutwc input[type="checkbox"]:focus-visible,
body.checkout-wc main.checkoutwc input[type="radio"]:focus-visible {
	outline: 1px solid var(--sils-principal);
	outline-offset: 2px;
}

/* ── Botones: como el «Añadir» de la ficha ────────────────────────────────── */

body.checkout-wc .cfw-primary-btn,
body.checkout-wc #place_order {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px; /* Medidas del botón en px: su letra es de 14 px y en em saldrían torcidas. */
	padding: 0 32px;
	border: 0;
	border-radius: 4px;
	background: var(--sils-principal);
	color: var(--sils-blanco);
	font-family: "Thoren Sans", sans-serif;
	font-size: 0.875em;
	font-weight: 500;
	letter-spacing: 0.035em;
	text-transform: uppercase;
	box-shadow: none;
	transition: background-color 0.2s ease;
}

body.checkout-wc .cfw-primary-btn:hover,
body.checkout-wc #place_order:hover {
	border: 0;
	background: color-mix(in srgb, var(--sils-principal) 86%, var(--sils-blanco));
	color: var(--sils-blanco);
}

/* «Finalizar compra» salía de 58 px y letra de 16: CheckoutWC le pone relleno y tamaño con
   un selector más fuerte (#cfw-place-order button…). El mismo botón que los demás. */
body.checkout-wc #cfw-place-order #place_order {
	min-height: 44px;
	padding: 0 32px;
	border: 0;
	border-radius: 4px;
	font-size: 0.875em;
	font-weight: 500;
	letter-spacing: 0.035em;
}

/* Botón del primer paso: como el paso «Envío» está oculto, CheckoutWC lo enseña con
   display:block !important (.cfw-hide-shipping …) y el texto se quedaba arriba. */
body.checkout-wc.cfw-hide-shipping #cfw-customer-info .cfw-continue-to-payment-btn {
	display: inline-flex !important;
}

body.checkout-wc .cfw-primary-btn:focus-visible,
body.checkout-wc #place_order:focus-visible {
	box-shadow: 0 0 0 2px var(--sils-blanco), 0 0 0 3px var(--sils-principal);
}

body.checkout-wc .cfw-secondary-btn {
	border: 1px solid var(--sils-principal);
	border-radius: 4px;
	font-weight: 500;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

/* ── Avisos: línea a la izquierda, sin cajas de color ─────────────────────── */

body.checkout-wc .cfw-alert {
	border: 0;
	border-left: 2px solid var(--sils-principal);
	border-radius: 0;
	background: var(--sils-gris-claro);
	color: var(--sils-texto);
}

body.checkout-wc .cfw-alert-error {
	border-left-color: var(--bricks-text-danger, #b3261e);
}

/* ── Pasos: filas cortadas, no cajas ──────────────────────────────────────── */
/* El resumen de datos (Contacto · Enviar a · Método), los métodos de envío y de pago y la
   dirección de facturación iban en cajas con borde y esquinas redondeadas: ahora, filas
   separadas por la línea fina de la web, a sangre y sin radio (21-oct). */

body.checkout-wc .cfw-review-pane,
body.checkout-wc ul.cfw-shipping-methods-list,
body.checkout-wc .cfw-accordion .cfw-radio-reveal-group {
	border: 0;
	border-top: 1px solid var(--sils-linea);
	border-bottom: 1px solid var(--sils-linea);
	border-radius: 0;
}

body.checkout-wc .cfw-review-pane li:not(:first-child) > div,
body.checkout-wc ul.cfw-shipping-methods-list li,
body.checkout-wc .cfw-accordion .cfw-radio-reveal-li,
body.checkout-wc .cfw-accordion .cfw-radio-reveal-content {
	border-color: var(--sils-linea);
}

body.checkout-wc .cfw-review-pane li {
	padding: 0;
}

body.checkout-wc .cfw-review-pane li .cfw-review-pane-label {
	color: var(--sils-secundario);
	font-weight: 300;
}

body.checkout-wc .cfw-review-pane li .cfw-review-pane-content {
	color: var(--sils-texto);
}

body.checkout-wc .cfw-review-pane li .cfw-review-pane-link a {
	color: var(--sils-secundario);
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: color 0.2s ease;
}

body.checkout-wc .cfw-review-pane li .cfw-review-pane-link a:hover {
	color: var(--sils-principal);
}

body.checkout-wc ul.cfw-shipping-methods-list li {
	padding: 1em 0;
	border-radius: 0;
}

body.checkout-wc .cfw-accordion .cfw-radio-reveal-li,
body.checkout-wc .cfw-accordion .cfw-radio-reveal-title-wrap,
body.checkout-wc .cfw-accordion .cfw-radio-reveal-content {
	border-radius: 0 !important;
}

body.checkout-wc .cfw-accordion .cfw-radio-reveal-title-wrap {
	padding: 1em 0;
	background: transparent;
}

/* Lo que se abre bajo la opción (el texto del pago, el formulario de facturación): sin el
   panel gris con borde, debajo de su fila. */
body.checkout-wc .cfw-accordion .cfw-radio-reveal-content {
	padding: 0 0 1em;
	border-top: 0;
	background: transparent;
}

body.checkout-wc .cfw-accordion .cfw-radio-reveal-content p,
body.checkout-wc .cfw-accordion .cfw-radio-reveal-content label {
	color: var(--sils-texto);
	font-weight: 300;
	line-height: 1.5;
}

body.checkout-wc .cfw-accordion .cfw-radio-reveal-content p {
	font-size: 0.875em;
}

/* ── Pasos: textos pequeños ───────────────────────────────────────────────── */

/* «Todas las transacciones son seguras…» y «Seleccione la dirección…»: ayudas en gris, no
   rótulos en mayúsculas. */
body.checkout-wc .secure-notice,
body.checkout-wc .cfw-billing-address-description {
	color: var(--sils-secundario);
	text-transform: none;
}

/* Privacidad y términos: «Texto pequeño», como las casillas del resto de la web (iban a
   16 px y los términos, más gruesos). Los enlaces, subrayados. */
body.checkout-wc .woocommerce-privacy-policy-text p,
body.checkout-wc .woocommerce-terms-and-conditions-checkbox-text,
body.checkout-wc .sils-publicidad__texto {
	font-size: 0.875em;
	font-weight: 300;
	line-height: 1.5;
}

body.checkout-wc :is(.woocommerce-privacy-policy-text, .woocommerce-terms-and-conditions-checkbox-text) a {
	font-weight: inherit;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* La casilla, arriba a la izquierda aunque el texto ocupe dos líneas (móvil). También la de
   publicidad (inc/publicidad.php), que va debajo de la de condiciones. */
body.checkout-wc :is(.woocommerce-terms-and-conditions-wrapper, .sils-publicidad) .woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: flex-start;
}

body.checkout-wc :is(.woocommerce-terms-and-conditions-wrapper, .sils-publicidad) .woocommerce-form__label-for-checkbox input {
	flex: none;
	margin-top: 2px;
	vertical-align: 0;
}

/* Esas dos casillas, a la medida del texto pequeño: 13 px, como las de los formularios de
   Contacto, centradas en la primera línea (21 px). */
body.checkout-wc main.checkoutwc :is(.woocommerce-terms-and-conditions-wrapper, .sils-publicidad) .woocommerce-form__label-for-checkbox input[type="checkbox"] {
	width: 13px !important;
	height: 13px !important;
	min-width: 13px !important;
	margin-top: 4px;
}

/* «« Volver a…»: enlace de texto pequeño subrayado, como los secundarios de la web. */
body.checkout-wc .cfw-bottom-controls .previous-button a {
	color: var(--sils-texto);
	font-size: 0.875em;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ── Resumen del carrito: igual que el carrito lateral ────────────────────── */

body.futurist.checkout-wc #cfw-cart-summary #cfw-cart-summary-content > h3 {
	margin-bottom: 0;
	padding-bottom: 1em;
	border-bottom: 0;
}

/* Cada obra: 16 px de aire, línea gris encima (la de las filas del lateral). */
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-cart-table .cart-item-row {
	letter-spacing: 0.075em;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-cart-table .cart-item-row > td,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-cart-table .cart-item-row > th {
	padding-top: 1em;
	padding-bottom: 1em;
	border-top: 1px solid #d3d4d5;
	background: transparent;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-cart-table .cart-item-row .cfw-cart-item-image img {
	width: 4em !important;
	border: 0;
	object-fit: fill;
}

/* En el pago, cada obra en flex como en el lateral (foto | texto | precio), no en tabla: la
   columna del precio quitaba ancho también a las obras de una composición, que no tienen
   precio, y sus datos se partían en cuatro o cinco líneas (21-oct). La línea y el aire pasan
   de las celdas a la fila. La fila va sin «body.checkout-wc» a propósito: las reglas de la
   composición (sils-addons, carrito.css) tienen que poder ganarle. La página de gracias
   sigue en tabla (ver «Pedido recibido»). */
#cfw.context-checkout .cfw-cart-table .cart-item-row {
	display: flex;
	align-items: center;
	padding: 1em 0;
	border-top: 1px solid #d3d4d5;
}

body.checkout-wc #cfw.context-checkout .cfw-cart-table .cart-item-row > td,
body.checkout-wc #cfw.context-checkout .cfw-cart-table .cart-item-row > th {
	padding-top: 0;
	padding-bottom: 0;
	border-top: 0;
}

body.checkout-wc #cfw.context-checkout .cfw-cart-table .cart-item-row .cfw-cart-item-image {
	flex: none;
	width: 4em;
}

body.checkout-wc #cfw.context-checkout .cfw-cart-table .cart-item-row .cfw-cart-item-description {
	flex: 1 1 0;
	min-width: 0;
}

body.checkout-wc #cfw.context-checkout .cfw-cart-table .cart-item-row .cfw-cart-item-subtotal {
	flex: none;
	padding-left: 1em;
	text-align: right;
}

body.checkout-wc #cfw.context-checkout .cfw-cart-table .cart-item-row .cfw-cart-item-subtotal:empty {
	padding-left: 0;
}

/* En escritorio, el resumen cabe en la pantalla, como el carrito lateral: «Tu carrito» arriba,
   los totales abajo y SOLO la lista de obras se desplaza (21-oct). Con muchas obras, la
   columna crecía hasta 2.000 px y había que bajar mucho junto a un formulario vacío.
   - Alto máximo: la ventana menos lo que queda encima de la caja al cargar (cabecera y pasos,
     182 px) y un poco de aire (13em = 208 px); así se ve entera sin bajar. Nunca menos de
     25em. Si el formulario es más alto (paso de pago), la caja se queda fija al bajar
     (CheckoutWC ya la marca como «sticky»).
   - CheckoutWC fuerza la caja como bloque con !important (para su desplegable de móvil): en
     escritorio hay que ganarle igual para ponerla en columna.
   - La lista es la referencia de las celdas ocultas de CheckoutWC (la cantidad, solo para
     lectores de pantalla): si no, se colocaban respecto a la columna, se salían del recorte
     y alargaban la página por debajo del pie.
   - La línea bajo «Tu carrito» pasa de la primera obra al título, para que no se vaya al
     desplazar la lista; y los totales llevan una línea encima, como el pie del lateral. */
@media (min-width: 992px) {
	body.checkout-wc #cfw.context-checkout #cfw-cart-summary-content {
		display: flex !important;
		flex-direction: column;
		top: 1.5em;
		max-height: max(calc(100dvh - 13em), 25em);
	}

	body.checkout-wc #cfw.context-checkout #cfw-cart-summary-content > * {
		flex: none;
	}

	body.checkout-wc #cfw.context-checkout #cfw-cart {
		position: relative;
		flex: 1 1 auto;
		min-height: 0;
		overflow-y: auto;
		overscroll-behavior: contain;
	}

	body.futurist.checkout-wc #cfw.context-checkout #cfw-cart-summary #cfw-cart-summary-content > h3 {
		border-bottom: 1px solid #d3d4d5;
	}

	#cfw.context-checkout #cfw-cart .cfw-cart-table .cart-item-row:first-child {
		border-top: 0;
	}

	body.checkout-wc #cfw.context-checkout #cfw-cart .cfw-cart-table {
		margin-bottom: 0;
	}

	body.checkout-wc #cfw.context-checkout #cfw-cart-summary-totals {
		border-top: 1px solid var(--sils-linea);
	}
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-cart-item-title {
	font-weight: 400;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-cart-table .cart-item-row .cfw-cart-item-description .cfw-cart-item-data,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-cart-table .cart-item-row .cfw-cart-item-image .cfw-cart-item-quantity-bubble {
	font-size: 0.8em;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-cart-item-subtotal .amount {
	font-weight: 500;
	white-space: nowrap;
}

/* El contador de cantidad, bajo como en el lateral. */
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-quantity-stepper {
	height: auto;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-quantity-stepper .cfw-quantity-stepper-btn-minus,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-quantity-stepper .cfw-quantity-stepper-btn-plus {
	min-height: 20px;
	height: 20px;
	background: transparent;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-quantity-stepper .cfw-quantity-stepper-btn-minus {
	border-right: none;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-quantity-stepper .cfw-quantity-stepper-btn-plus {
	border-left: none;
}

/* Totales: etiqueta pequeña en mayúsculas y gris, importe a la derecha; el total, un
   paso mayor con una línea fina encima (no la raya negra de 2 px de CheckoutWC). */
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table tr {
	border: 0;
	color: var(--sils-secundario);
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table th,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table td {
	padding: 0.25em 0;
	vertical-align: baseline;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table th {
	font-size: 0.75em;
	font-weight: 300;
	letter-spacing: 0.15em;
	text-align: left;
	text-transform: uppercase;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table td,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table td .amount {
	color: var(--sils-texto);
	font-size: 0.875em;
	font-weight: 500;
	letter-spacing: 0.035em;
	text-align: right;
	white-space: nowrap;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table td .amount {
	font-size: 1em;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table tr.order-total {
	padding: 0;
	border-top: 1px solid var(--sils-linea);
	color: var(--sils-texto);
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table tr.order-total th,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table tr.order-total td,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table tr.order-total td .amount {
	padding-top: 0.75em;
	color: var(--sils-texto);
	font-size: 1.1875em;
	font-weight: 500;
	letter-spacing: 0.03em;
	text-transform: none;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table tr.order-total td .amount {
	padding-top: 0;
	font-size: 1em;
}

body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) .cfw-totals-list table tr.order-total strong {
	font-weight: 500;
}

/* Tablas del resumen y totales: Woo y el kit les ponen otra fuente. El resumen de móvil
   va dentro de un envoltorio de CheckoutWC (.cfw-tw) que pone la fuente del sistema. */
body.checkout-wc #cfw-mobile-cart-summary,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) table,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) th,
body.checkout-wc :is(#cfw-cart-summary, #cfw-mobile-cart-summary) td,
body.checkout-wc #cfw-mobile-cart-header {
	font-family: "Thoren Sans", sans-serif;
}

body.checkout-wc #cfw-mobile-cart-header .cfw-arrow {
	fill: var(--sils-principal);
}

/* ── Pedido recibido ──────────────────────────────────────────────────────── */
/* Página de gracias de CheckoutWC. Nada de cajas: secciones separadas por una línea fina,
   como las páginas «Editorial» de la web. */

body.checkout-wc #cfw.context-thank-you #order_review {
	padding-top: 2.5em;
}

/* El resumen puede ser muy largo (una composición son muchas obras): en escritorio, la
   columna del agradecimiento se queda a la vista al bajar. */
@media (min-width: 992px) {
	body.checkout-wc #cfw.context-thank-you #order_review {
		position: sticky;
		top: 0;
		align-self: flex-start;
	}
}

/* Número de pedido como etiqueta y el agradecimiento como título de página (Crista). */
body.checkout-wc #cfw.context-thank-you #order_review > .title {
	display: flex;
	flex-direction: column-reverse;
	align-items: flex-start;
	gap: 0.75em;
	margin-bottom: 2.5em;
	padding: 0;
}

body.checkout-wc #cfw.context-thank-you #order_review > .title .cfw-checkmark {
	display: none;
}

body.checkout-wc #cfw.context-thank-you #order_review > .title h4 {
	margin: 0;
	color: var(--sils-principal);
	font-family: "Crista", serif;
	font-size: 2.5em;
	font-weight: 400;
	line-height: 1.15;
	letter-spacing: 0;
	text-transform: uppercase;
	text-wrap: balance;
}

body.checkout-wc #cfw.context-thank-you #order_review > .title h5 {
	margin: 0;
	color: var(--sils-secundario);
	font-size: 0.75em;
	font-weight: 300;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

/* Secciones: línea fina arriba, sin marco. */
body.checkout-wc #cfw.context-thank-you #order_review > section {
	margin-top: 0;
	margin-bottom: 0;
	padding: 1.75em 0;
	border: 0;
	border-top: 1px solid var(--sils-linea);
	border-radius: 0;
	background: transparent;
}

body.checkout-wc #cfw.context-thank-you #order_review > section .inner {
	padding: 0;
	border: 0;
}

body.checkout-wc #cfw.context-thank-you #order_review > section:first-of-type {
	border-top-color: var(--sils-principal);
}

body.checkout-wc #cfw.context-thank-you #order_review section h3 {
	margin: 0 0 1em;
	font-size: 1em;
	font-weight: 400;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

body.checkout-wc #cfw.context-thank-you #order_review section h6 {
	margin: 0 0 0.5em;
	color: var(--sils-secundario);
	font-size: 0.75em;
	font-weight: 300;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}

body.checkout-wc #cfw.context-thank-you #order_review section p,
body.checkout-wc #cfw.context-thank-you #order_review section address {
	margin: 0 0 1.5em;
	color: var(--sils-texto);
	font-size: 0.875em;
	font-style: normal;
	line-height: 1.6;
}

body.checkout-wc #cfw.context-thank-you #order_review section .row:last-of-type p,
body.checkout-wc #cfw.context-thank-you .cfw-order-updates p {
	margin-bottom: 0;
}

/* Estado del pedido: una línea con un punto por paso; el actual, negro. */
body.checkout-wc #cfw.context-thank-you .status-row {
	padding: 0;
}

body.checkout-wc #cfw.context-thank-you .status-steps {
	display: grid;
	grid-auto-columns: minmax(0, 1fr);
	grid-auto-flow: column;
	margin: 0;
	padding: 0;
	list-style: none;
}

body.checkout-wc #cfw.context-thank-you .status-steps .status-step {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.25em;
	align-items: flex-start;
	justify-content: flex-start;
	max-width: none;
	margin: 0;
	padding: 1.5em 1em 0 0;
	color: var(--sils-secundario);
	text-align: left;
}

body.checkout-wc #cfw.context-thank-you .status-steps .status-step::before,
body.checkout-wc #cfw.context-thank-you .status-steps .status-step::after {
	content: "";
	position: absolute;
	top: 0.3125em;
	left: 0;
	right: 0;
	width: auto;
	height: 1px;
	margin: 0;
	border: 0;
	background: var(--sils-linea);
}

body.checkout-wc #cfw.context-thank-you .status-steps .status-step::after {
	top: 0;
	right: auto;
	width: 0.6875em;
	height: 0.6875em;
	border: 1px solid var(--sils-linea);
	border-radius: 50%;
	background: var(--sils-blanco);
}

body.checkout-wc #cfw.context-thank-you .status-steps .status-step i {
	display: none;
}

body.checkout-wc #cfw.context-thank-you .status-steps .status-step .title {
	margin: 0;
	color: inherit;
	font-size: 0.8125em;
	line-height: 1.4;
	font-weight: 400;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

body.checkout-wc #cfw.context-thank-you .status-steps .status-step .date {
	padding: 0;
	color: var(--sils-secundario);
	font-size: 0.8125em;
}

body.checkout-wc #cfw.context-thank-you .status-steps .status-step-selected {
	color: var(--sils-principal);
}

body.checkout-wc #cfw.context-thank-you .status-steps .status-step-selected::after {
	border-color: var(--sils-principal);
	background: var(--sils-principal);
}

body.checkout-wc #cfw.context-thank-you .status-steps .status-step-selected .title {
	font-weight: 500;
}

/* Botones: «Ver mis pedidos» (línea) y «Seguir comprando» (negro), a la derecha. */
body.checkout-wc #cfw.context-thank-you .sils-gracias-botones {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 12px;
	margin-top: 0;
	margin-bottom: 0;
	padding: 1.75em 0 2.5em;
	border-top: 1px solid var(--sils-linea);
}

body.checkout-wc #cfw.context-thank-you .sils-gracias-botones a {
	flex: 0 0 auto;
	width: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin: 0;
	padding: 0 32px;
	border-radius: 4px;
	font-size: 0.875em;
	font-weight: 500;
	letter-spacing: 0.035em;
	text-decoration: none;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background-color 0.2s ease, color 0.2s ease;
}

body.checkout-wc #cfw.context-thank-you .sils-gracias-botones .cfw-secondary-btn {
	border: 1px solid var(--sils-principal);
	background: var(--sils-blanco);
	color: var(--sils-principal);
}

body.checkout-wc #cfw.context-thank-you .sils-gracias-botones .cfw-secondary-btn:hover {
	background: var(--sils-principal);
	color: var(--sils-blanco);
}

/* Móvil y tableta: el resumen, desplegado y justo después del estado (las obras son lo
   importante); después, el seguimiento, los datos y los botones, a lo ancho. */
@media (max-width: 991.98px) {
	body.checkout-wc #cfw.context-thank-you > .row {
		flex-direction: column;
	}

	body.checkout-wc #cfw.context-thank-you #order_review {
		display: contents;
	}

	body.checkout-wc #cfw.context-thank-you #order_review > * {
		order: 5;
		margin-right: 20px;
		margin-left: 20px;
	}

	body.checkout-wc #cfw.context-thank-you #order_review > .title {
		order: 1;
		margin-top: 2em;
	}

	body.checkout-wc #cfw.context-thank-you #order_review > .cfw-order-status {
		order: 2;
	}

	body.checkout-wc #cfw.context-thank-you #cfw-cart-summary {
		order: 3;
		margin: 0 0 1em;
		padding: 0;
	}

	body.checkout-wc #cfw.context-thank-you #cfw-mobile-cart-header {
		display: none !important;
	}

	body.checkout-wc #cfw.context-thank-you #cfw-cart-summary #cfw-cart-summary-content {
		display: block !important;
		padding: 1.5em 20px;
		background: var(--sils-gris-claro);
	}

	body.checkout-wc #cfw.context-thank-you #order_review > .cfw-order-updates {
		order: 4;
	}

	body.checkout-wc #cfw.context-thank-you #order_review > .sils-gracias-botones {
		order: 6;
		flex-direction: column;
		align-items: stretch;
	}

	body.checkout-wc #cfw.context-thank-you .sils-gracias-botones a {
		width: 100%;
	}
}

@media (max-width: 767.98px) {
	body.checkout-wc #cfw.context-thank-you #order_review > .title h4 {
		font-size: 1.875em;
	}
}

/* Resumen del pedido: los datos de cada obra en una línea (etiqueta en gris). */
body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .wc-item-meta {
	margin: 0.25em 0 0;
	padding: 0;
	list-style: none;
	line-height: 1.5;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .wc-item-meta li {
	display: inline;
	margin: 0;
	padding: 0;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .wc-item-meta li + li::before {
	content: " · ";
	color: var(--sils-secundario);
}

/* «Obra adaptada: Ver imagen» (Sils Addons), en su propia línea: la etiqueta con su enlace. */
body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .wc-item-meta li:has(.sils-vista-enlace) {
	display: block;
	margin-top: 0.25em;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .wc-item-meta li:has(.sils-vista-enlace)::before {
	content: none;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .wc-item-meta .wc-item-meta-label {
	color: var(--sils-secundario);
	font-weight: 300;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .wc-item-meta p {
	display: inline;
	margin: 0;
	font-weight: 400;
}

/* Composición: su línea arriba y sus obras debajo, sangradas, con la foto pequeña, sin
   cantidad ni precio (lo lleva la composición) y sin línea entre ellas. */
body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo > td,
body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo > th {
	padding-top: 0.375em;
	padding-bottom: 0.375em;
	border-top: 0;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo:not(:has(+ .sils-compo-hijo)) > * {
	padding-bottom: 1em;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo .cfw-cart-item-image {
	text-align: right;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo .cfw-cart-item-image img {
	width: 2em !important;
	max-width: 2em !important;
	height: auto !important;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo .cfw-cart-item-quantity-bubble,
body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo .cfw-cart-item-subtotal > * {
	display: none;
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo .cfw-cart-item-description {
	position: relative;
	padding-left: 1.75em;
}

/* La guía vertical que une las obras con su composición. */
body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo .cfw-cart-item-description::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0.75em;
	width: 1px;
	background: var(--sils-linea);
}

body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .cart-item-row.sils-compo-hijo .cfw-cart-item-title {
	font-size: 0.875em;
}

/* La pared de «Crea tu pared»: su foto, del ancho de las demás. */
body.checkout-wc #cfw.context-thank-you #cfw-cart-summary .sils-conjunto__foto {
	width: 4em !important;
	height: auto;
	border: 1px solid var(--sils-linea);
}

/* ── Pie ──────────────────────────────────────────────────────────────────── */

body.checkout-wc #cfw-footer {
	font-size: 0.75em;
	letter-spacing: 0.08em;
}

body.checkout-wc #cfw-footer a {
	color: var(--sils-blanco);
	opacity: 0.7;
}

body.checkout-wc #cfw-footer a:hover {
	opacity: 1;
}

/* filtros-botones.css */
/*
 * Barra de filtros con botones (15-oct-2026). Elegida por el usuario en /NEW/prueba-filtros.html
 * («F2 con resalte gris»): la anterior era casi igual que la de Artesta (banda con línea negra,
 * separadores verticales, desplegables con flecha).
 *
 * PUNTO DE CONTROL: todo cuelga de la clase `sils-fb` en <html>, que solo se pone con el
 * interruptor encendido (opción `sils_filtros_botones`; `?sils_filtros=0|1` para comparar, ver
 * inc/recursos.php). Apagado, esta hoja y filtros-botones.js no se cargan y la barra es la de
 * siempre: no se ha tocado filtros.css, filtros-panel.* ni las plantillas.
 *
 * Qué cambia (solo escritorio; en el móvil, la fila de «Filtrar y ordenar» sin marco):
 * - barra blanca, sin marco negro, con una línea fina debajo; «Filtrar» delante;
 * - cada filtro es un botón con borde fino y el radio de 4 px de la web; con algo elegido, se
 *   rellena de gris claro y lleva el número: «Tonalidades (2)»;
 * - el desplegable sale pegado al botón, recto y con línea fina, con las opciones en 2 o 3
 *   columnas (--sils-fb-cols, lo pone el guion) y un pie «Borrar · Ver N obras»;
 * - lo elegido aparece debajo como etiquetas que se quitan con ×;
 * - «Orden» y «Quitar filtros» en texto.
 * Los textos que pinta el CSS («Filtrar», «Orden», «Quitar filtros») llegan traducidos en
 * variables desde inc/recursos.php.
 *
 * Trampas: Bricks pone por id (#brxe-acbarr, acflis, acfder) bordes negros, fondo, relleno 0 y
 * column-gap 0; sils-bricks.css fija la flecha con !important; JetSmartFilters cambia el texto
 * de la etiqueta por lo elegido (por eso el nombre lo pinta ::before desde data-nombre).
 */

/* ── La barra ─────────────────────────────────────────────────────────────── */
html.sils-fb .brxe-container.sils-filtros {
	min-height: 5.6rem;
	padding-inline: var(--sils-margen-seguridad) !important;
	border-top: 0 !important;
	border-bottom: 1px solid var(--sils-linea) !important;
	background: var(--sils-blanco) !important;
	align-items: flex-start !important;
	column-gap: var(--sils-esp-l) !important;
}

html.sils-fb .brxe-container.sils-filtros .sils-filtros__lista {
	align-items: center !important;
	column-gap: var(--sils-esp-2xs, 0.8rem) !important;
	row-gap: 0 !important;
	padding-block: 1rem !important;
}

html.sils-fb .brxe-container.sils-filtros .sils-filtros__lista > * {
	border-right: 0 !important;
}

html.sils-fb .brxe-container.sils-filtros .sils-filtros__lista::before {
	content: var(--sils-fb-filtrar, "Filtrar");
	margin-right: var(--sils-esp-2xs, 0.8rem);
	color: var(--sils-secundario);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	line-height: 1.8rem;
	letter-spacing: 0.025rem;
	text-transform: uppercase;
}

/* El desplegable se coloca respecto a su botón, no a los envoltorios de Bricks. */
html.sils-fb .brxe-container.sils-filtros [class*="brxe-jet-smart-filters-"],
html.sils-fb .brxe-container.sils-filtros .jet-filter {
	position: static !important;
}

html.sils-fb .brxe-container.sils-filtros .jet-filter-items-dropdown {
	position: relative !important;
}

/* ── Los botones ──────────────────────────────────────────────────────────── */
html.sils-fb .brxe-container.sils-filtros .jet-filter-items-dropdown__label {
	position: relative;
	height: 3.6rem;
	padding: 0 3.2rem 0 1.4rem;
	border: 1px solid color-mix(in srgb, var(--sils-principal) 22%, transparent);
	border-radius: var(--sils-radio, 0.4rem);
	background: var(--sils-blanco);
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-2xs);
	font-weight: 300;
	letter-spacing: var(--sils-ls-texto, 0.12rem);
	text-transform: none;
	transition: border-color .16s ease, background-color .16s ease;
}

/* Con el nombre ya puesto por el guion, el texto de JetSmartFilters se esconde y lo pinta ::before
   (mismo texto y letra: no salta). */
html.sils-fb .brxe-container.sils-filtros .jet-filter-items-dropdown__label[data-nombre] {
	font-size: 0 !important;
	letter-spacing: 0 !important;
}

html.sils-fb .brxe-container.sils-filtros .jet-filter-items-dropdown__label[data-nombre]::before {
	content: attr(data-nombre) attr(data-n);
	color: inherit;
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-2xs);
	font-weight: 300;
	line-height: 1.2;
	letter-spacing: var(--sils-ls-texto, 0.12rem);
	text-transform: none;
	white-space: nowrap;
}

html.sils-fb .brxe-container.sils-filtros .jet-filter-items-dropdown__active {
	display: none;
}

/* Flecha: solo la máscara de filtros.css (sils-bricks.css le pone además un icono de fondo). */
html.sils-fb .brxe-container.sils-filtros .jet-filter-items-dropdown__label::after {
	right: 1.2rem !important;
	width: 1rem !important;
	height: 1rem !important;
	background: currentColor !important;
	-webkit-mask-size: 0.9rem;
	mask-size: 0.9rem;
}

html.sils-fb .brxe-container.sils-filtros .jet-filter-items-dropdown.jet-dropdown-open .jet-filter-items-dropdown__label::after {
	transform: translateY(-50%) rotate(180deg);
}

html.sils-fb .brxe-container.sils-filtros .jet-filter-items-dropdown__label:hover,
html.sils-fb .brxe-container.sils-filtros .jet-dropdown-open .jet-filter-items-dropdown__label {
	border-color: var(--sils-principal);
}

/* Con algo elegido: relleno gris claro (el de las tarjetas); borde negro al señalar o abierto. */
html.sils-fb .brxe-container.sils-filtros .tiene-elegidos .jet-filter-items-dropdown__label {
	border-color: var(--sils-fondo-imagenes);
	background: var(--sils-fondo-imagenes);
}

html.sils-fb .brxe-container.sils-filtros .tiene-elegidos .jet-filter-items-dropdown__label:hover,
html.sils-fb .brxe-container.sils-filtros .tiene-elegidos .jet-dropdown-open .jet-filter-items-dropdown__label {
	border-color: var(--sils-principal);
}

/* ── El desplegable: pegado al botón, del tamaño de sus opciones ───────────── */
html.sils-fb .brxe-container.sils-filtros .jet-filter-items-dropdown__body {
	top: calc(100% + 0.8rem) !important;
	right: auto;
	left: 0;
	width: calc(var(--sils-fb-cols, 3) * 19rem + 4.8rem) !important;
	max-width: calc(100vw - 2 * var(--sils-margen-seguridad));
	margin: 0;
	padding: 2.4rem 2.4rem 0;
	border: 1px solid color-mix(in srgb, var(--sils-principal) 22%, transparent);
	border-radius: 0;
	background: var(--sils-blanco);
	box-shadow: none;
}

/* Si no cabe a la derecha del botón, se alinea por su borde derecho (lo decide el guion). */
html.sils-fb .brxe-container.sils-filtros .sils-fb-a-la-derecha > .jet-filter-items-dropdown__body {
	right: 0;
	left: auto;
}

html.sils-fb .brxe-container.sils-filtros .jet-dropdown-open > .jet-filter-items-dropdown__body {
	animation: sils-fb-entra .2s ease;
}

@keyframes sils-fb-entra {
	from { opacity: 0; transform: translateY(-0.4rem); }
	to { opacity: 1; transform: none; }
}

/* Opciones en columnas con una línea fina entre ellas */
html.sils-fb .brxe-container.sils-filtros .jet-checkboxes-list-wrapper,
html.sils-fb .brxe-container.sils-filtros .jet-color-image-list-wrapper fieldset {
	column-count: var(--sils-fb-cols, 3) !important;
	column-gap: 2.4rem;
	column-rule: 1px solid var(--sils-linea);
	margin: 0;
	padding: 0;
}

html.sils-fb .brxe-container.sils-filtros .jet-color-image-list-wrapper {
	padding: 0 !important;
}

html.sils-fb .brxe-container.sils-filtros .jet-checkboxes-list__row,
html.sils-fb .brxe-container.sils-filtros .jet-color-image-list__row {
	margin: 0 0 var(--sils-esp-3xs, 0.4rem);
	padding: 0;
}

html.sils-fb .brxe-container.sils-filtros .jet-checkboxes-list__button,
html.sils-fb .brxe-container.sils-filtros .jet-color-image-list__button {
	padding: 0.6rem 0;
	border-radius: 0;
	background: transparent !important;
}

html.sils-fb .brxe-container.sils-filtros .jet-checkboxes-list__button:hover .jet-checkboxes-list__label,
html.sils-fb .brxe-container.sils-filtros .jet-color-image-list__button:hover .jet-color-image-list__label {
	color: var(--sils-principal);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.4rem;
}

/* ── Pie del desplegable: Borrar · Ver N obras ─────────────────────────────── */
.sils-fb-pie {
	display: none;
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-pie {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 2.4rem;
	margin-top: 2rem;
	padding: var(--sils-esp-s, 1.6rem) 0;
	border-top: 1px solid var(--sils-linea);
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-borrar,
html.sils-fb .brxe-container.sils-filtros .sils-fb-borrar:focus {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	line-height: 1.8rem;
	letter-spacing: 0.025rem;
	text-transform: uppercase;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.4rem;
	cursor: pointer;
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-borrar:hover {
	background: transparent;
	color: var(--sils-secundario);
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-borrar[disabled] {
	opacity: 0.35;
	text-decoration: none;
	cursor: default;
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-ver,
html.sils-fb .brxe-container.sils-filtros .sils-fb-ver:focus {
	display: inline-flex;
	align-items: center;
	gap: var(--sils-esp-2xs, 0.8rem);
	height: 4.4rem;
	margin: 0;
	padding: 0 2.4rem;
	border: 0;
	border-radius: var(--sils-radio, 0.4rem);
	background: var(--sils-principal);
	box-shadow: none;
	color: var(--sils-blanco);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-boton);
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.05rem;
	text-transform: uppercase;
	cursor: pointer;
	transition: opacity .2s ease;
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-ver:hover {
	background: var(--sils-principal);
	color: var(--sils-blanco);
	opacity: 0.85;
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-ver[disabled] {
	opacity: 0.35;
	cursor: default;
}

/* Mientras JetSmartFilters recalcula: «Actualizando» con un giro de 12 px. */
html.sils-fb .brxe-container.sils-filtros .sils-fb-ver.es-cargando::before {
	content: "";
	width: 1.2rem;
	height: 1.2rem;
	border: 1.5px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: sils-fb-gira .7s linear infinite;
}

@keyframes sils-fb-gira {
	to { transform: rotate(360deg); }
}

/* ── Etiquetas de lo elegido, en una segunda línea de la barra ─────────────── */
html.sils-fb .brxe-container.sils-filtros .sils-fb-etiquetas {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sils-esp-2xs, 0.8rem);
	flex-basis: 100%;
	order: 99;
	padding: var(--sils-esp-2xs, 0.8rem) 0 0.2rem;
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-etiquetas:empty {
	display: none;
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-etiqueta,
html.sils-fb .brxe-container.sils-filtros .sils-fb-etiqueta:focus {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	height: 2.8rem;
	margin: 0;
	padding: 0 1rem;
	border: 0;
	border-radius: var(--sils-radio, 0.4rem);
	background: var(--sils-fondo-imagenes);
	box-shadow: none;
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	line-height: 1.8rem;
	letter-spacing: 0.025rem;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color .16s ease;
	animation: sils-fb-entra .2s ease;
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-etiqueta:hover {
	background: color-mix(in srgb, var(--sils-fondo-imagenes), var(--sils-principal) 7%);
	color: var(--sils-principal);
}

html.sils-fb .brxe-container.sils-filtros .sils-fb-etiqueta i {
	font-size: var(--sils-txt-4xs, 1.1rem);
}

/* Inspiración: la colección elegida en la franja de logos (filtros-panel.js la pone en la
   barra) va como un botón con elección: gris claro, misma altura y radio. */
html.sils-fb .brxe-container.sils-filtros .sils-filtros__coleccion {
	padding: 0;
}

html.sils-fb .brxe-container.sils-filtros .sils-filtros__etiqueta,
html.sils-fb .brxe-container.sils-filtros .sils-filtros__etiqueta:focus {
	height: 3.6rem;
	padding: 0 1.4rem;
	border-radius: var(--sils-radio, 0.4rem);
	background-color: var(--sils-fondo-imagenes);
	gap: 0.6rem;
}

html.sils-fb .brxe-container.sils-filtros .sils-filtros__etiqueta:hover {
	background-color: color-mix(in srgb, var(--sils-fondo-imagenes), var(--sils-principal) 7%);
}

/* ── Parte derecha: nº de obras, quitar filtros y orden ───────────────────── */
html.sils-fb .brxe-container.sils-filtros .sils-filtros__derecha {
	align-self: flex-start !important;
	align-items: center !important;
	column-gap: var(--sils-esp-m) !important;
	height: 5.6rem;
}

html.sils-fb .brxe-container.sils-filtros .sils-filtros__derecha > * {
	align-self: center;
}

html.sils-fb .brxe-container.sils-filtros .sils-filtros__cuenta {
	min-width: 0;
	padding: 0;
}

html.sils-fb .brxe-container.sils-filtros .jet-remove-all-filters__button {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	font-size: 0;
	letter-spacing: 0;
}

html.sils-fb .brxe-container.sils-filtros .jet-remove-all-filters__button::before {
	content: var(--sils-fb-quitar, "Quitar filtros");
	color: var(--sils-principal);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	line-height: 1.8rem;
	letter-spacing: 0.025rem;
	text-transform: uppercase;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.4rem;
}

html.sils-fb .brxe-container.sils-filtros .jet-remove-all-filters__button:hover::before {
	color: var(--sils-secundario);
}

html.sils-fb .brxe-container.sils-filtros .jet-smart-filters-sorting {
	display: flex;
	align-items: center;
}

html.sils-fb .brxe-container.sils-filtros .jet-sorting {
	display: flex;
	align-items: center;
	gap: var(--sils-esp-2xs, 0.8rem);
	height: auto;
}

html.sils-fb .brxe-container.sils-filtros .jet-sorting::before {
	content: var(--sils-fb-orden, "Orden");
	color: var(--sils-secundario);
	font-family: var(--sils-fuente-thoren);
	font-size: var(--sils-txt-3xs);
	line-height: 1.8rem;
	letter-spacing: 0.025rem;
	text-transform: uppercase;
}

html.sils-fb .brxe-container.sils-filtros .jet-sorting::after {
	right: 0 !important;
	width: 1rem !important;
	height: 1rem !important;
	background: currentColor !important;
	-webkit-mask-size: 0.9rem;
	mask-size: 0.9rem;
}

html.sils-fb .brxe-container.sils-filtros .jet-sorting-select {
	height: auto;
	min-width: 0;
	padding: 0 1.8rem 0 0;
	border: 0 !important;
	background: transparent !important;
	color: var(--sils-principal);
	font-size: var(--sils-txt-2xs);
	font-weight: 300;
	line-height: 1.2em;
	letter-spacing: var(--sils-ls-texto, 0.12rem);
	text-transform: none;
}

/* ── Móvil y tableta: la fila de «Filtrar y ordenar», sin marco ───────────── */
html.sils-fb .brxe-container.sils-filtros.es-panel {
	align-items: center !important;
}

html.sils-fb .brxe-container.sils-filtros.es-panel .sils-filtros__derecha {
	gap: var(--sils-esp-s);
	height: auto;
}

html.sils-fb .brxe-container.sils-filtros.es-panel .sils-filtros__cuenta {
	margin-right: auto;
	text-align: left;
}

html.sils-fb .brxe-container.sils-filtros.es-panel .sils-filtros__rejilla {
	border: 0 !important;
}

html.sils-fb .brxe-container.sils-filtros.es-panel .sils-filtros__rejilla > button {
	width: 3.6rem !important;
	min-width: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
}

html.sils-fb .brxe-container.sils-filtros.es-panel .sils-filtros__abrir {
	gap: var(--sils-esp-2xs, 0.8rem) !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	color: var(--sils-principal) !important;
	font-family: var(--sils-fuente-thoren) !important;
	font-size: var(--sils-txt-2xs) !important;
	font-weight: 300 !important;
	letter-spacing: var(--sils-ls-texto, 0.12rem) !important;
	text-transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
	html.sils-fb .brxe-container.sils-filtros *,
	html.sils-fb .brxe-container.sils-filtros *::before {
		animation: none !important;
		transition: none !important;
	}
}