/* =========================================================
   Servicios Polares — capa de estilos WooCommerce
   v1.1 — tipografia mas liviana, ritmo vertical y grid de ficha
   ========================================================= */

/* --- Tokens --------------------------------------------------------------- */
:root {
	--sp-navy-900: #061b3a;
	--sp-navy-800: #0a2a5e;
	--sp-blue-700: #0b4c9b;
	--sp-blue-500: #1476d2;
	--sp-cyan: #2bb6ec;
	--sp-cyan-600: #0e9bd8;

	--sp-ink: #14243a;
	--sp-ink-soft: #46586f;
	--sp-muted: #7185a0;
	--sp-line: #e6ecf3;
	--sp-line-soft: #f0f4f9;
	--sp-soft: #f6f9fc;
	--sp-white: #fff;

	/* Pesos: el tema padre aplica negrita casi en todo, asi que los
	   declaramos explicitamente en lugar de heredar. */
	--sp-fw-body: 400;
	--sp-fw-medium: 500;
	--sp-fw-label: 600;
	--sp-fw-title: 700;

	--sp-radius: 16px;
	--sp-radius-sm: 10px;
	--sp-radius-pill: 999px;

	--sp-shadow: 0 6px 24px rgba(6, 27, 58, .06);
	--sp-shadow-hi: 0 16px 40px rgba(6, 27, 58, .13);

	--sp-grad: linear-gradient(135deg, var(--sp-navy-800) 0%, var(--sp-blue-700) 55%, var(--sp-cyan-600) 100%);
	--sp-ease: .28s cubic-bezier(.2, .7, .3, 1);

	--sp-gap: clamp(1.75rem, 4vw, 3.25rem);
}

/* --- Reset de peso -------------------------------------------------------
   Neutraliza la negrita heredada. Si tu fuente global solo trae pesos
   pesados, esto no alcanza: cambia la fuente del cuerpo en
   Elementor -> Site Settings -> Typography y elige un peso 400. */
.woocommerce,
.woocommerce-page,
.woocommerce div.product,
.woocommerce ul.products {
	font-weight: var(--sp-fw-body);
	color: var(--sp-ink);
	letter-spacing: 0;
}

.woocommerce p,
.woocommerce li,
.woocommerce dd,
.woocommerce td,
.woocommerce span:not(.sp-chip):not(.amount),
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-Tabs-panel p {
	font-weight: var(--sp-fw-body);
}

.woocommerce strong,
.woocommerce b {
	font-weight: var(--sp-fw-label);
}

.sp-icon {
	width: 1.05em;
	height: 1.05em;
	flex: 0 0 auto;
}

/* --- Encabezado de tienda ------------------------------------------------- */
.sp-shop-header {
	background: var(--sp-grad);
	border-radius: var(--sp-radius);
	padding: clamp(2.25rem, 5vw, 3.5rem) clamp(1.5rem, 4vw, 2.75rem);
	margin: 0 0 2.5rem;
	color: var(--sp-white);
	position: relative;
	overflow: hidden;
}

.sp-shop-header::after {
	content: "";
	position: absolute;
	inset: auto -10% -60% auto;
	width: 55%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(43, 182, 236, .32), transparent 70%);
	pointer-events: none;
}

.sp-shop-header__eyebrow {
	display: inline-block;
	font-size: .74rem;
	font-weight: var(--sp-fw-label);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--sp-cyan);
	margin-bottom: .75rem;
}

.sp-shop-header__title {
	margin: 0;
	font-size: clamp(1.8rem, 3.6vw, 2.75rem);
	font-weight: var(--sp-fw-title);
	line-height: 1.12;
	letter-spacing: -.015em;
	color: var(--sp-white);
}

.sp-shop-header__desc {
	margin-top: 1rem;
	max-width: 60ch;
	color: rgba(255, 255, 255, .8);
	font-size: .97rem;
	line-height: 1.65;
}

/* --- Barra de filtros ----------------------------------------------------- */
.sp-filter-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 1.1rem;
	background: var(--sp-white);
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius);
	padding: 1.35rem 1.5rem;
	margin-bottom: 2rem;
	box-shadow: var(--sp-shadow);
}

.sp-filter {
	display: flex;
	flex-direction: column;
	gap: .45rem;
	min-width: 170px;
	flex: 1 1 170px;
}

.sp-filter__label {
	font-size: .7rem;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--sp-muted);
	font-weight: var(--sp-fw-label);
}

.sp-filter select {
	width: 100%;
	padding: .68rem .85rem;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-sm);
	background: var(--sp-soft);
	color: var(--sp-ink);
	font-size: .93rem;
	font-weight: var(--sp-fw-body);
	line-height: 1.3;
	transition: border-color var(--sp-ease), box-shadow var(--sp-ease);
}

.sp-filter select:focus {
	outline: none;
	border-color: var(--sp-cyan);
	box-shadow: 0 0 0 3px rgba(43, 182, 236, .16);
}

.sp-filter-bar__actions {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.sp-filter-reset {
	font-size: .87rem;
	font-weight: var(--sp-fw-body);
	color: var(--sp-muted);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.sp-filter-reset:hover {
	color: var(--sp-blue-500);
}

/* --- Botones -------------------------------------------------------------- */
.woocommerce .sp-btn,
.sp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .55rem;
	padding: .78rem 1.5rem;
	border: 1px solid transparent;
	border-radius: var(--sp-radius-pill);
	font-size: .92rem;
	font-weight: var(--sp-fw-label);
	letter-spacing: .005em;
	line-height: 1.2;
	cursor: pointer;
	text-decoration: none;
	transition: transform var(--sp-ease), box-shadow var(--sp-ease), background var(--sp-ease);
}

.sp-btn:hover {
	transform: translateY(-2px);
}

.sp-btn--block {
	width: 100%;
	margin-top: .35rem;
}

.sp-btn--primary,
.woocommerce .sp-btn--primary {
	background: var(--sp-grad);
	color: var(--sp-white);
	box-shadow: 0 6px 18px rgba(11, 76, 155, .25);
}

.sp-btn--ghost {
	background: transparent;
	border-color: var(--sp-line);
	color: var(--sp-navy-800);
}

.sp-btn--ghost:hover {
	border-color: var(--sp-cyan);
	color: var(--sp-blue-700);
}

.sp-btn--wa {
	background: #25d366;
	color: #fff;
	box-shadow: 0 6px 18px rgba(37, 211, 102, .24);
}

.sp-btn--wa:hover {
	color: #fff;
}

/* Botones nativos */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
	background: var(--sp-grad);
	color: var(--sp-white);
	border: 0;
	border-radius: var(--sp-radius-pill);
	padding: .78rem 1.5rem;
	font-weight: var(--sp-fw-label);
	font-size: .92rem;
	line-height: 1.2;
	transition: transform var(--sp-ease), box-shadow var(--sp-ease);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
	background: var(--sp-grad);
	color: var(--sp-white);
	transform: translateY(-2px);
	box-shadow: var(--sp-shadow-hi);
}

/* --- Grid de productos ---------------------------------------------------- */
.woocommerce ul.products {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.65rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce ul.products li.product::before,
.woocommerce ul.products li.product::after {
	content: none;
}

.woocommerce ul.products li.product {
	width: 100%;
	margin: 0;
	padding: 0;
	float: none;
	clear: none;
}

/* --- Tarjeta -------------------------------------------------------------- */
.sp-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--sp-white);
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius);
	overflow: hidden;
	transition: transform var(--sp-ease), box-shadow var(--sp-ease), border-color var(--sp-ease);
}

.sp-card:hover {
	transform: translateY(-4px);
	border-color: rgba(43, 182, 236, .45);
	box-shadow: var(--sp-shadow-hi);
}

.sp-card__media {
	position: relative;
	background: var(--sp-soft);
	aspect-ratio: 4 / 3;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.sp-card__imglink {
	display: block;
	width: 100%;
	height: 100%;
}

.woocommerce ul.products li.product .sp-card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	margin: 0;
	padding: 1.15rem;
	transition: transform var(--sp-ease);
}

.sp-card:hover .sp-card__media img {
	transform: scale(1.04);
}

.sp-chip {
	display: inline-flex;
	align-items: center;
	font-size: .66rem;
	font-weight: var(--sp-fw-label);
	letter-spacing: .11em;
	text-transform: uppercase;
	padding: .34rem .7rem;
	border-radius: var(--sp-radius-pill);
	line-height: 1;
}

.sp-chip--brand {
	position: absolute;
	top: .85rem;
	left: .85rem;
	background: rgba(6, 27, 58, .85);
	color: var(--sp-white);
	backdrop-filter: blur(4px);
}

.sp-chip--sale {
	position: absolute;
	top: .85rem;
	right: .85rem;
	background: var(--sp-cyan);
	color: var(--sp-navy-900);
}

.sp-chip--soft {
	background: var(--sp-soft);
	border: 1px solid var(--sp-line);
	color: var(--sp-muted);
}

.sp-card__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	gap: .6rem;
	padding: 1.35rem 1.4rem 1.5rem;
}

.sp-card__eyebrow {
	font-size: .69rem;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--sp-cyan-600);
	font-weight: var(--sp-fw-label);
}

.woocommerce ul.products li.product .sp-card__title {
	margin: 0;
	padding: 0;
	font-size: 1.02rem;
	font-weight: var(--sp-fw-title);
	line-height: 1.4;
	letter-spacing: -.008em;
}

.sp-card__title a {
	color: var(--sp-ink);
	text-decoration: none;
}

.sp-card__title a:hover {
	color: var(--sp-blue-700);
}

.sp-specs {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
	margin: .1rem 0 0;
	padding: 0;
	list-style: none;
}

.sp-specs li {
	font-size: .75rem;
	font-weight: var(--sp-fw-body);
	color: var(--sp-ink-soft);
	background: var(--sp-line-soft);
	border-radius: var(--sp-radius-sm);
	padding: .3rem .62rem;
	line-height: 1.35;
}

.woocommerce ul.products li.product .price {
	margin: .25rem 0 0;
	font-size: 1.15rem;
	font-weight: var(--sp-fw-title);
	color: var(--sp-navy-800);
}

.woocommerce ul.products li.product .price del {
	font-size: .8rem;
	font-weight: var(--sp-fw-body);
	color: var(--sp-muted);
	opacity: 1;
}

.woocommerce ul.products li.product .price ins {
	text-decoration: none;
}

.sp-card__note {
	display: flex;
	align-items: center;
	gap: .42rem;
	margin: 0;
	font-size: .75rem;
	font-weight: var(--sp-fw-body);
	color: var(--sp-muted);
}

.woocommerce ul.products li.product .sp-card__body > .button,
.woocommerce ul.products li.product .sp-card__body > .added_to_cart {
	margin-top: auto;
	align-self: flex-start;
}

/* =========================================================
   FICHA DE PRODUCTO
   ========================================================= */

@media (min-width: 900px) {
	.woocommerce div.product {
		display: grid;
		grid-template-columns: minmax(0, 46fr) minmax(0, 54fr);
		grid-template-areas:
			"images summary"
			"tabs   tabs"
			"rel    rel";
		column-gap: var(--sp-gap);
		align-items: start;
	}

	.woocommerce div.product > div.images,
	.woocommerce div.product > .woocommerce-product-gallery {
		grid-area: images;
		position: sticky;
		top: 2rem;
		width: 100%;
		float: none;
		margin: 0;
	}

	.woocommerce div.product > div.summary {
		grid-area: summary;
		width: 100%;
		float: none;
		margin: 0;
	}

	.woocommerce div.product > .woocommerce-tabs {
		grid-area: tabs;
		margin-top: 3.5rem;
	}

	.woocommerce div.product > .related,
	.woocommerce div.product > .upsells {
		grid-area: rel;
		margin-top: 3rem;
	}
}

.woocommerce div.product div.images img,
.woocommerce div.product .woocommerce-product-gallery__image img {
	border-radius: var(--sp-radius);
	background: var(--sp-soft);
	aspect-ratio: 1;
	object-fit: contain;
	padding: 1.5rem;
}

/* Titulo */
.woocommerce div.product .product_title {
	font-size: clamp(1.45rem, 2.2vw, 2.05rem);
	font-weight: var(--sp-fw-title);
	line-height: 1.2;
	letter-spacing: -.018em;
	margin: 0 0 .85rem;
	color: var(--sp-ink);
}

.sp-single__eyebrow {
	display: flex;
	flex-wrap: wrap;
	gap: .45rem;
	margin: 0 0 1.35rem;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-size: 1.6rem;
	font-weight: var(--sp-fw-title);
	color: var(--sp-navy-800);
	margin: 0 0 1.25rem;
	line-height: 1.2;
}

.woocommerce div.product .woocommerce-product-details__short-description {
	color: var(--sp-ink-soft);
	font-size: 1rem;
	font-weight: var(--sp-fw-body);
	line-height: 1.7;
	margin-bottom: 1.75rem;
}

.woocommerce div.product .woocommerce-product-details__short-description p:last-child {
	margin-bottom: 0;
}

/* Ficha tecnica compacta */
.sp-spec-table {
	margin: 0 0 1.75rem;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-sm);
	overflow: hidden;
}

.sp-spec-table__row {
	display: grid;
	grid-template-columns: minmax(95px, 32%) 1fr;
	gap: 1rem;
	padding: .78rem 1.1rem;
	font-size: .9rem;
	border-bottom: 1px solid var(--sp-line-soft);
}

.sp-spec-table__row:last-child {
	border-bottom: 0;
}

.sp-spec-table dt {
	margin: 0;
	color: var(--sp-muted);
	font-weight: var(--sp-fw-medium);
}

.sp-spec-table dd {
	margin: 0;
	color: var(--sp-ink);
	font-weight: var(--sp-fw-medium);
}

/* Aviso de cotizacion */
.sp-quote-notice {
	display: flex;
	align-items: center;
	gap: .85rem;
	padding: .95rem 1.15rem;
	margin: 0 0 1.5rem;
	border-radius: var(--sp-radius-sm);
	background: rgba(43, 182, 236, .07);
	border: 1px solid rgba(43, 182, 236, .28);
	color: var(--sp-navy-800);
}

.sp-quote-notice p {
	margin: 0;
	font-size: .91rem;
	font-weight: var(--sp-fw-body);
	line-height: 1.55;
}

.sp-quote-notice .sp-icon {
	width: 1.3rem;
	height: 1.3rem;
	color: var(--sp-cyan-600);
}

/* Formulario y selectores de variacion */
.woocommerce div.product form.cart {
	margin: 0 0 1.75rem;
}

.woocommerce div.product form.cart .variations {
	width: 100%;
	margin: 0 0 1.1rem;
	border-collapse: separate;
	border-spacing: 0;
}

.woocommerce div.product form.cart .variations tr {
	display: block;
	margin-bottom: .9rem;
}

.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th {
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	text-align: left;
}

.woocommerce div.product form.cart .variations label {
	display: block;
	margin-bottom: .4rem;
	font-size: .7rem;
	font-weight: var(--sp-fw-label);
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--sp-muted);
}

.woocommerce div.product form.cart .variations select {
	width: 100%;
	min-height: 48px;
	padding: .6rem .9rem;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-sm);
	background: var(--sp-white);
	font-size: .95rem;
	font-weight: var(--sp-fw-medium);
	color: var(--sp-ink);
	transition: border-color var(--sp-ease), box-shadow var(--sp-ease);
}

.woocommerce div.product form.cart .variations select:focus {
	outline: none;
	border-color: var(--sp-cyan);
	box-shadow: 0 0 0 3px rgba(43, 182, 236, .16);
}

.woocommerce div.product form.cart .reset_variations {
	display: inline-block;
	margin-top: .3rem;
	font-size: .8rem;
	font-weight: var(--sp-fw-body);
	color: var(--sp-muted);
}

.woocommerce div.product .woocommerce-variation-price {
	margin-bottom: 1rem;
}

.woocommerce div.product form.cart div.quantity {
	margin-right: .8rem;
}

.woocommerce .quantity input.qty {
	height: 48px;
	width: 72px;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-sm);
	background: var(--sp-white);
	font-weight: var(--sp-fw-medium);
}

/* --- Modo cotizacion: sin precio cargado ---------------------------------- */
.sp-quote div.product form.cart .single_add_to_cart_button,
.sp-quote div.product form.cart div.quantity,
.sp-quote div.product .woocommerce-variation-price,
.sp-quote div.product .woocommerce-variation-availability {
	display: none !important;
}

.sp-quote div.product .woocommerce-variation-add-to-cart {
	display: block;
}

/* Logistica */
.sp-logistics {
	display: grid;
	gap: 1px;
	margin: 0 0 1.5rem;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius);
	background: var(--sp-line);
	overflow: hidden;
}

.sp-logistics__item {
	display: flex;
	align-items: flex-start;
	gap: .95rem;
	padding: 1.05rem 1.2rem;
	background: var(--sp-white);
}

.sp-logistics__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	border-radius: 50%;
	background: var(--sp-grad);
	color: var(--sp-white);
}

.sp-logistics__item > div {
	display: flex;
	flex-direction: column;
	gap: .22rem;
}

.sp-logistics__item strong {
	font-size: .9rem;
	font-weight: var(--sp-fw-label);
	color: var(--sp-ink);
	letter-spacing: -.005em;
}

.sp-logistics__item span {
	font-size: .855rem;
	font-weight: var(--sp-fw-body);
	color: var(--sp-ink-soft);
	line-height: 1.6;
}

/* Acciones */
.sp-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .7rem;
	margin: 0 0 1.5rem;
}

/* Meta */
.woocommerce div.product .product_meta {
	padding-top: 1.25rem;
	border-top: 1px solid var(--sp-line);
	font-size: .84rem;
	color: var(--sp-muted);
	line-height: 1.9;
}

.woocommerce div.product .product_meta > span {
	display: block;
}

.woocommerce div.product .product_meta a {
	color: var(--sp-blue-700);
	text-decoration: none;
}

.woocommerce div.product .product_meta a:hover {
	text-decoration: underline;
}

/* --- Pestanas ------------------------------------------------------------- */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: .45rem;
	padding: 0;
	margin: 0 0 1.85rem;
	border: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	content: none;
	border: 0;
	box-shadow: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: var(--sp-soft);
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-pill);
	margin: 0;
	padding: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: .62rem 1.35rem;
	font-size: .88rem;
	font-weight: var(--sp-fw-label);
	color: var(--sp-muted);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
	background: var(--sp-grad);
	border-color: transparent;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--sp-white);
}

.woocommerce div.product .woocommerce-tabs .panel {
	margin: 0;
	padding: 0;
	max-width: 78ch;
}

.woocommerce div.product .woocommerce-tabs .panel > h2:first-child {
	font-size: 1.2rem;
	font-weight: var(--sp-fw-title);
	letter-spacing: -.01em;
	margin: 0 0 1rem;
}

.woocommerce div.product .woocommerce-tabs .panel p {
	line-height: 1.75;
	color: var(--sp-ink-soft);
	margin-bottom: 1rem;
}

/* Tabla de atributos */
.woocommerce table.shop_attributes {
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-sm);
	overflow: hidden;
	border-collapse: separate;
	border-spacing: 0;
	margin: 0;
}

.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td {
	border: 0;
	border-bottom: 1px solid var(--sp-line-soft);
	padding: .8rem 1.1rem;
	font-size: .9rem;
	line-height: 1.5;
}

.woocommerce table.shop_attributes td {
	font-style: normal;
	font-weight: var(--sp-fw-medium);
	color: var(--sp-ink);
}

.woocommerce table.shop_attributes td p {
	margin: 0;
	padding: 0;
}

.woocommerce table.shop_attributes th {
	background: var(--sp-soft);
	color: var(--sp-muted);
	font-weight: var(--sp-fw-medium);
	text-align: left;
	width: 32%;
}

.woocommerce table.shop_attributes tr:last-child th,
.woocommerce table.shop_attributes tr:last-child td {
	border-bottom: 0;
}

/* Politicas */
.sp-policies {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
	gap: 1.1rem;
}

.sp-policy {
	display: flex;
	gap: .95rem;
	padding: 1.3rem;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius);
	background: var(--sp-white);
}

.sp-policy__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	flex: 0 0 38px;
	border-radius: 50%;
	background: var(--sp-grad);
	color: var(--sp-white);
}

.sp-policy__body h4 {
	margin: 0 0 .45rem;
	font-size: .98rem;
	font-weight: var(--sp-fw-title);
	letter-spacing: -.005em;
}

.sp-policy__body p {
	margin: 0;
	font-size: .875rem;
	font-weight: var(--sp-fw-body);
	color: var(--sp-ink-soft);
	line-height: 1.65;
}

.sp-policy__link {
	display: inline-block;
	margin-top: .55rem;
	font-size: .85rem;
	color: var(--sp-blue-700);
	font-weight: var(--sp-fw-label);
}

/* Relacionados */
.woocommerce div.product .related > h2,
.woocommerce div.product .upsells > h2 {
	font-size: 1.35rem;
	font-weight: var(--sp-fw-title);
	letter-spacing: -.012em;
	margin: 0 0 1.5rem;
}

/* --- Avisos, orden y paginacion ------------------------------------------- */
.woocommerce .woocommerce-result-count {
	color: var(--sp-muted);
	font-size: .87rem;
	font-weight: var(--sp-fw-body);
}

.woocommerce .woocommerce-ordering select {
	padding: .6rem .85rem;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-sm);
	background: var(--sp-white);
	font-size: .9rem;
	font-weight: var(--sp-fw-body);
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border-top: 0;
	border-left: 4px solid var(--sp-cyan);
	border-radius: var(--sp-radius-sm);
	background: var(--sp-soft);
	color: var(--sp-ink);
	font-weight: var(--sp-fw-body);
}

.woocommerce-error {
	border-left-color: #d64545;
}

.woocommerce nav.woocommerce-pagination {
	margin-top: 2.5rem;
}

.woocommerce nav.woocommerce-pagination ul {
	border: 0;
	gap: .4rem;
	display: flex;
	justify-content: center;
}

.woocommerce nav.woocommerce-pagination ul li {
	border: 0;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius-sm);
	min-width: 42px;
	padding: .55rem .75rem;
	font-weight: var(--sp-fw-medium);
}

.woocommerce nav.woocommerce-pagination ul li span.current {
	background: var(--sp-grad);
	color: var(--sp-white);
	border-color: transparent;
}

/* --- Responsive ----------------------------------------------------------- */
@media (max-width: 1024px) {
	.woocommerce ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 899px) {
	.woocommerce div.product > div.images,
	.woocommerce div.product > .woocommerce-product-gallery {
		margin-bottom: 2rem;
	}

	.woocommerce div.product > .woocommerce-tabs {
		margin-top: 2.5rem;
	}
}

@media (max-width: 640px) {
	.woocommerce ul.products {
		grid-template-columns: minmax(0, 1fr);
		gap: 1.2rem;
	}

	.sp-filter {
		flex: 1 1 100%;
	}

	.sp-filter-bar__actions {
		width: 100%;
	}

	.sp-filter-bar__actions .sp-btn {
		flex: 1 1 auto;
	}

	.sp-actions .sp-btn {
		flex: 1 1 100%;
	}

	.woocommerce div.product .woocommerce-tabs ul.tabs li a {
		padding: .55rem 1.05rem;
		font-size: .84rem;
	}

	.sp-logistics__item {
		padding: .95rem 1rem;
	}
}

/* =========================================================
   CAPA DE FORZADO — v1.2
   Estas reglas van al final a proposito: sobrescriben tanto al CSS
   nativo de WooCommerce como al del tema padre, que ganaban por
   especificidad. Si algo se ve raro, el culpable esta aqui.
   ========================================================= */

:root {
	/* Aire bajo el header flotante. Subelo o bajalo aqui. */
	--sp-top: clamp(72px, 9vw, 132px);
	--sp-maxw: 1180px;
}

/* --- 1. Espaciado superior ------------------------------------------------ */
.woocommerce-page .site-main,
.single-product .site-main,
.woocommerce-shop .site-main,
.tax-product_cat .site-main,
body.woocommerce main,
body.woocommerce-page main {
	padding-top: var(--sp-top) !important;
}

.woocommerce .woocommerce-breadcrumb,
.woocommerce-page .woocommerce-breadcrumb {
	margin: 0 0 1.75rem !important;
	font-size: .84rem !important;
	color: var(--sp-muted) !important;
}

/* Contenedor: evita que la ficha se estire de lado a lado en pantallas
   grandes. Comenta este bloque si tu layout ya limita el ancho. */
.woocommerce-page .site-main > .woocommerce,
.single-product .site-main > .product,
.woocommerce-shop .site-main,
.tax-product_cat .site-main {
	max-width: var(--sp-maxw) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* --- 2. Grid de productos: matar floats y anchos heredados ---------------- */
.woocommerce ul.products,
.woocommerce-page ul.products,
.woocommerce .related ul.products,
.woocommerce .upsells ul.products,
.woocommerce div.product .related ul.products {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 1.65rem !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	list-style: none !important;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.woocommerce .related ul.products li.product {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
	clear: none !important;
}

.woocommerce ul.products li.product::before,
.woocommerce ul.products li.product::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	display: none !important;
	content: none !important;
}

/* La tarjeta debe llenar su celda */
.sp-card {
	width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
}

.sp-card > *,
.sp-card__body > * {
	min-width: 0;
	max-width: 100%;
}

.sp-card__title,
.sp-card__title a,
.sp-card__eyebrow {
	overflow-wrap: break-word;
	hyphens: none;
}

/* Boton de tarjeta a ancho completo: se ve mejor y no desborda */
.woocommerce ul.products li.product .sp-card__body > .button,
.woocommerce ul.products li.product .sp-card__body > .sp-btn {
	width: 100% !important;
	align-self: stretch !important;
	margin-top: auto !important;
	text-align: center !important;
}

.woocommerce div.product .related > h2,
.woocommerce div.product .upsells > h2 {
	margin-top: 0 !important;
	padding-top: 2rem !important;
	border-top: 1px solid var(--sp-line) !important;
}

/* --- 3. Ficha: layout en dos columnas ------------------------------------ */
@media (min-width: 900px) {
	.woocommerce div.product,
	.woocommerce-page div.product {
		display: grid !important;
		grid-template-columns: minmax(0, 46fr) minmax(0, 54fr) !important;
		grid-template-areas:
			"images summary"
			"tabs   tabs"
			"rel    rel" !important;
		column-gap: var(--sp-gap) !important;
		align-items: start !important;
	}

	.woocommerce div.product > div.images,
	.woocommerce div.product > .woocommerce-product-gallery {
		grid-area: images !important;
		width: 100% !important;
		max-width: none !important;
		float: none !important;
		margin: 0 !important;
		position: sticky !important;
		top: 2rem !important;
	}

	.woocommerce div.product > div.summary {
		grid-area: summary !important;
		width: 100% !important;
		max-width: none !important;
		float: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.woocommerce div.product > .woocommerce-tabs {
		grid-area: tabs !important;
		width: 100% !important;
		float: none !important;
		clear: both !important;
		margin-top: 3.5rem !important;
	}

	.woocommerce div.product > .related,
	.woocommerce div.product > .upsells {
		grid-area: rel !important;
		width: 100% !important;
		float: none !important;
		clear: both !important;
		margin-top: 3rem !important;
	}
}

/* La imagen no debe crecer sin limite */
.woocommerce div.product div.images img,
.woocommerce div.product .woocommerce-product-gallery__image img {
	max-height: 520px !important;
	width: 100% !important;
	object-fit: contain !important;
}

/* --- 4. Variaciones: limpiar la tabla nativa ------------------------------ */
.woocommerce div.product form.cart .variations,
.woocommerce div.product form.cart .variations tbody,
.woocommerce div.product form.cart .variations tr,
.woocommerce div.product form.cart .variations th,
.woocommerce div.product form.cart .variations td {
	display: block !important;
	width: 100% !important;
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	text-align: left !important;
}

.woocommerce div.product form.cart .variations tr {
	margin-bottom: 1rem !important;
}

.woocommerce div.product form.cart .variations td.label label {
	display: block !important;
	margin: 0 0 .4rem !important;
	font-size: .7rem !important;
	font-weight: 600 !important;
	letter-spacing: .13em !important;
	text-transform: uppercase !important;
	color: var(--sp-muted) !important;
}

.woocommerce div.product .single_variation_wrap,
.woocommerce div.product .woocommerce-variation-add-to-cart {
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Modo cotizacion: fuera precio vacio, cantidad y boton nativo */
.sp-quote div.product .single_add_to_cart_button,
.sp-quote div.product form.cart div.quantity,
.sp-quote div.product .woocommerce-variation-price,
.sp-quote div.product .woocommerce-variation-availability,
.sp-quote div.product .woocommerce-variation-description:empty,
.sp-quote div.product .woocommerce-variation:empty {
	display: none !important;
}

.sp-quote div.product .woocommerce-variation-add-to-cart {
	display: block !important;
	opacity: 1 !important;
}

/* --- 5. Pesos tipograficos ------------------------------------------------
   El tema padre aplica negrita casi en todo. Si tu fuente global no trae
   un peso 400, esto no alcanza: cambiala en Elementor > Site Settings. */
.woocommerce p,
.woocommerce li,
.woocommerce dd,
.woocommerce td,
.woocommerce span,
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-Tabs-panel,
.woocommerce div.product .product_meta,
.sp-logistics__item span,
.sp-policy__body p,
.sp-quote-notice p,
.sp-card__note {
	font-weight: 400 !important;
}

.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce h4,
.woocommerce div.product .product_title,
.woocommerce ul.products li.product .sp-card__title,
.sp-shop-header__title,
.woocommerce div.product p.price,
.woocommerce ul.products li.product .price {
	font-weight: 700 !important;
	letter-spacing: -.015em !important;
}

.woocommerce .sp-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .sp-chip,
.sp-filter__label,
.sp-card__eyebrow,
.sp-logistics__item strong,
.sp-policy__body h4,
.sp-spec-table dt,
.sp-spec-table dd,
.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td,
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	font-weight: 600 !important;
}

/* La tabla nativa pone cursiva en los valores */
.woocommerce table.shop_attributes td,
.woocommerce table.shop_attributes td p {
	font-style: normal !important;
}

/* --- 6. Iconos ------------------------------------------------------------ */
.sp-logistics__icon,
.sp-policy__icon {
	width: 38px !important;
	height: 38px !important;
	flex: 0 0 38px !important;
}

.sp-logistics__icon .sp-icon,
.sp-policy__icon .sp-icon {
	width: 18px !important;
	height: 18px !important;
	stroke-width: 2 !important;
}

.sp-btn .sp-icon {
	width: 17px !important;
	height: 17px !important;
}

/* --- 7. Responsive del forzado ------------------------------------------- */
@media (max-width: 1024px) {
	.woocommerce ul.products,
	.woocommerce .related ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 640px) {
	:root {
		--sp-top: 84px;
	}

	.woocommerce ul.products,
	.woocommerce .related ul.products {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 1.2rem !important;
	}

	.woocommerce div.product div.images img {
		max-height: 340px !important;
	}
}

/* =========================================================
   CAPA DE FORZADO — v1.3
   Fuente de cuerpo, fin del sticky, aire inferior e iconos.
   ========================================================= */

:root {
	/* --- FUENTE DEL TEXTO DE CUERPO ---------------------------------
	   La fuente del tema solo trae pesos gruesos, por eso font-weight:400
	   no cambiaba nada. Este stack usa la fuente del sistema, que sí tiene
	   pesos reales, no descarga nada y carga instantáneo.

	   Los títulos, chips y botones NO usan esto: siguen con la fuente de
	   la marca. Solo cambia el texto corrido.

	   ¿Prefieres mantener la fuente del kit en todo? Cambia el valor por
	   'inherit' y carga el peso 400 en Elementor > Site Settings. */
	--sp-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
		"Helvetica Neue", Arial, "Noto Sans", sans-serif;

	--sp-bottom: clamp(3.5rem, 8vw, 6rem);
}

.woocommerce p,
.woocommerce li,
.woocommerce dd,
.woocommerce dt,
.woocommerce td,
.woocommerce th,
.woocommerce select,
.woocommerce input,
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-Tabs-panel,
.woocommerce div.product .woocommerce-Tabs-panel p,
.woocommerce div.product .product_meta,
.woocommerce div.product .product_meta span,
.woocommerce div.product .product_meta a,
.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td,
.woocommerce table.shop_attributes td p,
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-breadcrumb,
.sp-spec-table dt,
.sp-spec-table dd,
.sp-logistics__item span,
.sp-policy__body p,
.sp-quote-notice p,
.sp-card__note,
.sp-specs li,
.sp-shop-header__desc,
.sp-filter select,
.sp-filter-reset {
	font-family: var(--sp-font-body) !important;
	font-weight: 400 !important;
	-webkit-font-smoothing: antialiased;
}

/* Lo que sí debe destacar dentro del texto de cuerpo */
.woocommerce table.shop_attributes th,
.sp-spec-table dt,
.sp-logistics__item strong,
.woocommerce div.product .product_meta > span > span,
.woocommerce div.product .product_meta .sku {
	font-weight: 600 !important;
}

/* Los títulos conservan la tipografía de la marca */
.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce h4,
.woocommerce div.product .product_title,
.sp-card__title,
.sp-shop-header__title,
.sp-policy__body h4,
.sp-chip,
.sp-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	font-family: inherit !important;
}

/* --- Fin del sticky ------------------------------------------------------
   La imagen se salía de su fila y se montaba sobre las pestañas. */
.woocommerce div.product > div.images,
.woocommerce div.product > .woocommerce-product-gallery {
	position: static !important;
	top: auto !important;
	align-self: start !important;
}

/* --- Aire abajo: los relacionados quedaban pegados al footer -------------- */
.woocommerce-page .site-main,
.single-product .site-main,
.woocommerce-shop .site-main,
.tax-product_cat .site-main,
body.woocommerce main,
body.woocommerce-page main {
	padding-bottom: var(--sp-bottom) !important;
}

.woocommerce div.product > .related,
.woocommerce div.product > .upsells {
	margin-bottom: var(--sp-bottom) !important;
	padding-bottom: .5rem !important;
}

.woocommerce div.product > .woocommerce-tabs {
	margin-bottom: 2.5rem !important;
}

.woocommerce nav.woocommerce-pagination {
	margin-bottom: 1rem !important;
}

/* --- Iconos --------------------------------------------------------------
   Círculo un poco más grande, glifo más grande dentro y trazo más grueso
   para que se lean en blanco sobre el degradado. */
.sp-logistics__icon,
.sp-policy__icon {
	width: 40px !important;
	height: 40px !important;
	flex: 0 0 40px !important;
	align-self: flex-start !important;
	box-shadow: 0 3px 10px rgba(11, 76, 155, .28);
}

.sp-logistics__icon .sp-icon,
.sp-policy__icon .sp-icon {
	width: 20px !important;
	height: 20px !important;
	stroke-width: 1.9 !important;
	overflow: visible;
}

.sp-icon {
	stroke-width: 1.9;
	vector-effect: non-scaling-stroke;
}

.sp-quote-notice .sp-icon {
	width: 22px !important;
	height: 22px !important;
	stroke-width: 2 !important;
}

.sp-btn .sp-icon {
	width: 18px !important;
	height: 18px !important;
	stroke-width: 2 !important;
}

/* Un poco más de aire dentro de los bloques de logística */
.sp-logistics__item {
	gap: 1rem !important;
	padding: 1.15rem 1.25rem !important;
	align-items: flex-start !important;
}

.sp-logistics__item strong {
	margin-bottom: .1rem !important;
}

/* =========================================================
   CAPA DE FORZADO — v1.4
   Ancho de los paneles de pestaña y ritmo vertical.
   ========================================================= */

/* --- Ancho por tipo de panel ---------------------------------------------
   El límite de 78ch sirve para texto corrido, pero estrangulaba la rejilla
   de políticas y la tabla de especificaciones. Ahora solo aplica a la
   descripción. */
.woocommerce div.product .woocommerce-tabs .panel {
	max-width: none !important;
	width: 100% !important;
}

.woocommerce div.product .woocommerce-Tabs-panel--description {
	max-width: 78ch !important;
}

/* --- Rejilla de políticas ------------------------------------------------- */
.sp-policies {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 1.15rem !important;
	align-items: stretch !important;
}

.sp-policy {
	height: 100% !important;
	padding: 1.5rem 1.4rem !important;
	gap: 1rem !important;
	align-items: flex-start !important;
}

.sp-policy__body {
	min-width: 0;
}

.sp-policy__body h4 {
	margin: 0 0 .5rem !important;
	line-height: 1.35 !important;
}

.sp-policy__body p {
	line-height: 1.6 !important;
}

@media (max-width: 900px) {
	.sp-policies {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 560px) {
	.sp-policies {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}

/* --- Ritmo vertical ------------------------------------------------------- */
.woocommerce div.product > .woocommerce-tabs {
	margin-top: 3rem !important;
	margin-bottom: 0 !important;
	padding-top: 2.25rem !important;
	border-top: 1px solid var(--sp-line) !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
	margin: 0 0 1.75rem !important;
	padding: 0 !important;
}

.woocommerce div.product .woocommerce-tabs .panel > h2:first-child {
	margin: 0 0 1.15rem !important;
}

.woocommerce div.product .woocommerce-tabs .panel table.shop_attributes {
	margin: 0 !important;
	max-width: 760px !important;
}

/* Separación antes de relacionados */
.woocommerce div.product > .related,
.woocommerce div.product > .upsells {
	margin-top: 3.25rem !important;
}

.woocommerce div.product .related > h2,
.woocommerce div.product .upsells > h2 {
	padding-top: 2.25rem !important;
	margin-bottom: 1.75rem !important;
}

/* La columna de imagen no debe estirarse hasta el alto del resumen */
.woocommerce div.product > div.images,
.woocommerce div.product > .woocommerce-product-gallery {
	align-self: start !important;
	height: auto !important;
}

/* Aire entre bloques del resumen */
.woocommerce div.product div.summary > * {
	margin-bottom: 1.35rem;
}

.woocommerce div.product div.summary > *:last-child {
	margin-bottom: 0;
}

.woocommerce div.product .product_meta {
	margin-top: .5rem !important;
	padding-top: 1.35rem !important;
}

/* --- Restos de valoraciones ---------------------------------------------- */
.woocommerce div.product .woocommerce-product-rating,
.woocommerce div.product #reviews,
.woocommerce div.product .star-rating,
.woocommerce ul.products li.product .star-rating {
	display: none !important;
}

/* =========================================================
   CAPA DE FORZADO — v1.5
   Relleno de los SVG y color del encabezado de tienda.
   ========================================================= */

/* --- Iconos --------------------------------------------------------------
   Los SVG llevan fill="none" como atributo, pero cualquier regla CSS del
   tema (por ejemplo `svg { fill: currentColor }`) le gana a un atributo de
   presentación y los rellena sólidos. Por eso se veían como manchas.
   Aquí se fuerza contorno sin relleno. */
.sp-icon,
.sp-icon path,
.sp-icon circle,
.sp-icon rect,
.sp-icon line,
.sp-icon polyline,
.sp-icon polygon {
	fill: none !important;
	stroke: currentColor !important;
	stroke-linecap: round !important;
	stroke-linejoin: round !important;
	vector-effect: none !important;
}

/* Excepción: los puntos que sí deben ir rellenos */
.sp-icon [fill="currentColor"] {
	fill: currentColor !important;
	stroke: none !important;
}

.sp-icon {
	display: inline-block !important;
	overflow: visible !important;
	max-width: none !important;
	flex: 0 0 auto !important;
}

/* Círculo: más claro para que el trazo blanco tenga contraste real */
.sp-logistics__icon,
.sp-policy__icon {
	background: linear-gradient(135deg, var(--sp-blue-700) 0%, var(--sp-cyan-600) 100%) !important;
	color: #fff !important;
	border-radius: 50% !important;
}

.sp-logistics__icon .sp-icon,
.sp-policy__icon .sp-icon {
	width: 19px !important;
	height: 19px !important;
	stroke-width: 2 !important;
	color: #fff !important;
}

.sp-btn--wa .sp-icon {
	stroke-width: 2.1 !important;
	color: #fff !important;
}

.sp-quote-notice .sp-icon {
	color: var(--sp-cyan-600) !important;
	stroke-width: 2.1 !important;
}

.sp-card__note .sp-icon {
	width: 14px !important;
	height: 14px !important;
	stroke-width: 2 !important;
	color: var(--sp-muted) !important;
}

/* --- Encabezado de tienda: texto sobre fondo azul ------------------------- */
.sp-shop-header,
.sp-shop-header * {
	position: relative;
	z-index: 1;
}

.sp-shop-header::after {
	z-index: 0 !important;
}

.woocommerce .sp-shop-header .sp-shop-header__title,
.woocommerce .sp-shop-header h1,
.sp-shop-header .sp-shop-header__title,
.sp-shop-header h1 {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
	text-shadow: none !important;
}

.sp-shop-header .sp-shop-header__eyebrow {
	color: #7fd6f7 !important;
	-webkit-text-fill-color: #7fd6f7 !important;
}

.sp-shop-header .sp-shop-header__desc,
.sp-shop-header .sp-shop-header__desc p {
	color: rgba(255, 255, 255, .85) !important;
	-webkit-text-fill-color: rgba(255, 255, 255, .85) !important;
}

/* --- Encabezados de sección ---------------------------------------------- */
.woocommerce div.product .related > h2,
.woocommerce div.product .upsells > h2,
.woocommerce div.product .woocommerce-tabs .panel > h2:first-child {
	color: var(--sp-ink) !important;
}
/* =========================================================
   Servicio de instalación por producto (v2.1)
   Opción del cliente junto al botón de cotización; solo aparece cuando el
   producto tiene activada «Servicio de instalación de producto».
   Reutiliza los tokens y el icono circular de .sp-logistics.
   ========================================================= */
.sp-instalacion {
	display: flex;
	align-items: flex-start;
	gap: .95rem;
	width: 100%;
	box-sizing: border-box;
	margin: 0 0 1rem;
	padding: 1.15rem 1.2rem;
	border: 1px solid var(--sp-line);
	border-radius: var(--sp-radius);
	background: var(--sp-soft);
	box-shadow: var(--sp-shadow);
}

.sp-instalacion__cuerpo {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: .4rem;
	min-width: 0;
}

.woocommerce div.product p.sp-instalacion__titulo,
.sp-instalacion__titulo {
	margin: 0;
	font-size: 1rem;
	font-weight: var(--sp-fw-label);
	line-height: 1.3;
	color: var(--sp-ink);
	letter-spacing: -.005em;
	text-transform: none;
}

.woocommerce div.product p.sp-instalacion__texto,
.sp-instalacion__texto {
	margin: 0 0 .45rem;
	font-size: .875rem;
	font-weight: var(--sp-fw-body);
	line-height: 1.6;
	color: var(--sp-ink-soft);
}

.woocommerce div.product label.sp-instalacion__opcion,
.sp-instalacion__opcion {
	display: flex;
	font-family: inherit;
	letter-spacing: normal;
	text-transform: none;
	align-items: center;
	gap: .55rem;
	margin: 0;
	font-size: .9375rem;
	font-weight: var(--sp-fw-label);
	line-height: 1.4;
	color: var(--sp-ink);
	cursor: pointer;
}

.sp-instalacion__casilla {
	flex: none;
	width: 1.15rem;
	height: 1.15rem;
	margin: 0;
	accent-color: var(--sp-blue-500);
	cursor: pointer;
}

.sp-instalacion__casilla:focus-visible {
	outline: 2px solid var(--sp-ink);
	outline-offset: 2px;
}

/* Las reglas generales .woocommerce p/span de este archivo llevan
   !important; aquí se fija solo la tipografía del bloque, igual que el
   título h2 de la 2.1 (cuerpo 600) y la etiqueta en la fuente de cuerpo. */
.woocommerce .sp-instalacion .sp-instalacion__titulo {
	font-family: var(--sp-font-body) !important;
	font-weight: var(--sp-fw-label) !important;
}

.woocommerce .sp-instalacion .sp-instalacion__opcion,
.woocommerce .sp-instalacion .sp-instalacion__opcion span {
	font-family: var(--sp-font-body) !important;
	font-weight: var(--sp-fw-label) !important;
}

@media (max-width: 640px) {
	.sp-instalacion {
		flex-direction: column;
	}
}