/* =========================================================
   o24-skin.css — Capa visual (ficha, carrito, checkout, cabecera, pie)
   Solo usa las variables de tokens-sugoi.css / tokens-sakabato.css.
   Ningún color, fuente o radio literal fuera de los tokens.
   ========================================================= */

/* ---------- Base ---------- */
body.sugoi-themed,
body.sugoi-skin-sakabato {
	background: var(--sg-bg);
	color: var(--sg-ink);
	font-family: var(--sg-font-body);
	font-size: 16px;
	line-height: 1.6;
}

body.sugoi-themed h1, body.sugoi-themed h2, body.sugoi-themed h3,
body.sugoi-themed h4, body.sugoi-themed h5, body.sugoi-themed h6,
body.sugoi-skin-sakabato h1, body.sugoi-skin-sakabato h2, body.sugoi-skin-sakabato h3 {
	font-family: var(--sg-font-display);
	text-transform: none;
	letter-spacing: 0;
	color: var(--sg-ink);
	font-weight: 600;
}

body a { color: var(--sg-accent); }

.sugoi-themed .container,
.sugoi-skin-sakabato .container { max-width: var(--sg-container); }

.sugoi-themed :focus-visible,
.sugoi-skin-sakabato :focus-visible { outline: 2px solid var(--sg-accent); outline-offset: 2px; box-shadow: var(--sg-focus); }

/* Botones píldora, táctil */
.sugoi-themed .btn-primary,
.sugoi-themed .button,
.sugoi-themed button.single_add_to_cart_button,
.sugoi-themed input[type="submit"],
.sugoi-themed #place_order,
.sugoi-themed .wc-block-components-button,
.sugoi-skin-sakabato .btn-primary,
.sugoi-skin-sakabato .button,
.sugoi-skin-sakabato #place_order {
	background: var(--sg-accent);
	color: var(--sg-on-accent);
	border: none;
	border-radius: var(--sg-radius-pill);
	padding: 0.85rem 1.6rem;
	min-height: var(--sg-touch);
	font-family: var(--sg-font-body);
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	font-size: 1rem;
	box-shadow: var(--sg-shadow-sm);
	cursor: pointer;
	transition: background .2s ease, transform .15s ease;
}
.sugoi-themed .btn-primary:hover,
.sugoi-themed .button:hover,
.sugoi-themed #place_order:hover,
.sugoi-skin-sakabato .button:hover { background: var(--sg-accent-hover); transform: translateY(-1px); }

.sugoi-themed .btn-secondary,
.sugoi-skin-sakabato .btn-secondary {
	background: var(--sg-surface);
	color: var(--sg-ink);
	border: 1px solid var(--sg-line-strong);
	border-radius: var(--sg-radius-pill);
	min-height: var(--sg-touch);
}

/* ---------- Cabecera ---------- */
.sugoi-themed .aa-header,
.sugoi-skin-sakabato .aa-header {
	background: var(--sg-surface);
	border-bottom: 1px solid var(--sg-line);
	box-shadow: none;
	font-family: var(--sg-font-body);
	text-transform: none;
}
.sugoi-themed .aa-main-nav,
.sugoi-skin-sakabato .aa-main-nav { background: var(--sg-surface); padding: 1rem 0; color: var(--sg-ink); }
.sugoi-themed .nav-center .logo,
.sugoi-skin-sakabato .nav-center .logo {
	font-family: var(--sg-font-display);
	font-size: 1.9rem;
	color: var(--sg-ink);
	letter-spacing: 0;
}
.sugoi-themed .nav-center .logo span { color: var(--sg-accent); }
/* O26: logo real de Sugoi como imagen en la cabecera */
.sugoi-themed .nav-center .logo .sugoi-logo-img,
.sugoi-skin-sakabato .nav-center .logo .sugoi-logo-img,
.sugoi-themed .nav-center .logo img {
	display: block;
	width: auto;
	height: 48px;
	max-width: 100%;
}
@media (max-width: 900px) {
	.sugoi-themed .nav-center .logo .sugoi-logo-img,
	.sugoi-skin-sakabato .nav-center .logo .sugoi-logo-img,
	.sugoi-themed .nav-center .logo img { height: 38px; }
}
.sugoi-themed .nav-left,
.sugoi-themed .nav-right { font-family: var(--sg-font-body); font-weight: 600; font-size: 0.95rem; gap: 1.25rem; }
.sugoi-themed .nav-left a:hover,
.sugoi-themed .nav-right a:hover { color: var(--sg-accent); }
.sugoi-themed .search-container { border: 1px solid var(--sg-line); border-radius: var(--sg-radius-pill); background: var(--sg-surface-2); }
.sugoi-themed .search-input { font-family: var(--sg-font-body); background: transparent; }
.sugoi-themed .aa-cart-btn { font-family: var(--sg-font-body); text-transform: none; }
.sugoi-themed .cart-count { background: var(--sg-accent); }
.sugoi-themed .aa-topbar { background: var(--sg-ink); color: var(--sg-bg); }

/* En móvil el bloque de búsqueda y cuenta se simplifica */
@media (max-width: 900px) {
	.sugoi-themed .search-container,
	.sugoi-themed .nav-left { display: none; }
	.sugoi-themed .nav-collapse.open { display: block; }
	.sugoi-themed .aa-main-inner { gap: 0.75rem; }
	.sugoi-themed .nav-center .logo { font-size: 1.5rem; }
}

/* ---------- Pie ---------- */
.sugoi-themed .aa-footer,
.sugoi-themed footer {
	background: var(--sg-ink);
	color: var(--sg-bg);
	border-top: none;
	padding: var(--sg-space-7) 0 var(--sg-space-5);
}
.sugoi-themed .footer-col h4 { color: var(--sg-bg); font-family: var(--sg-font-display); text-transform: none; }
.sugoi-themed .footer-col a { color: var(--sg-bg); opacity: .85; }
.sugoi-themed .footer-col a:hover { color: var(--sg-gold); opacity: 1; }
.sugoi-themed .footer-bottom { border-top: 1px solid var(--sg-hairline-on-dark); margin-top: var(--sg-space-5); padding-top: var(--sg-space-4); opacity: .8; }
.sugoi-themed .footer-email { color: var(--sg-gold); }

/* ---------- Ficha de producto ---------- */
.sugoi-themed #page { padding-top: 130px; }
@media (max-width: 900px) { .sugoi-themed #page { padding-top: 96px; } }

.sugoi-themed .sugoi-single-product-flex {
	gap: var(--sg-space-6);
	align-items: flex-start;
}
.sugoi-themed .sugoi-single-gallery {
	background: var(--sg-surface);
	border: 1px solid var(--sg-line);
	border-radius: var(--sg-radius);
	padding: var(--sg-space-4);
}
.sugoi-themed .woocommerce-product-gallery__image img {
	border-radius: var(--sg-radius-sm);
}
.sugoi-themed .woocommerce div.product div.images .flex-control-thumbs li img {
	border-radius: var(--sg-radius-sm);
	border: 1px solid var(--sg-line);
	opacity: .8;
}
.sugoi-themed .woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
	border-color: var(--sg-accent);
	opacity: 1;
	box-shadow: var(--sg-focus);
}
.sugoi-themed .sugoi-single-info { padding-top: var(--sg-space-2); }

.sugoi-themed .sugoi-single-title {
	font-family: var(--sg-font-display);
	font-size: clamp(1.7rem, 4vw, 2.6rem);
	line-height: 1.15;
	margin-bottom: var(--sg-space-2);
}
.sugoi-themed .sugoi-single-price,
.sugoi-themed .sugoi-single-price .woocommerce-Price-amount,
.sugoi-themed .woocommerce-variation-price .woocommerce-Price-amount {
	font-family: var(--sg-font-display);
	color: var(--sg-accent-2);
	font-size: clamp(1.8rem, 5vw, 2.4rem);
	font-weight: 600;
}
.sugoi-themed .sugoi-single-price { margin: var(--sg-space-2) 0; }
.sugoi-themed .woocommerce-product-details__short-description {
	color: var(--sg-ink-soft);
	font-size: 1.02rem;
	border-left: 3px solid var(--sg-line-strong);
	padding-left: var(--sg-space-4);
	margin: var(--sg-space-4) 0;
}

/* Nota de envío + WhatsApp inline */
.sugoi-themed .sugoi-shipping-note {
	background: var(--sg-surface-2);
	border: 1px dashed var(--sg-line-strong);
	border-radius: var(--sg-radius-sm);
	color: var(--sg-ink-soft);
	padding: var(--sg-space-3) var(--sg-space-4);
	font-size: 0.92rem;
	margin: var(--sg-space-3) 0;
}
.sugoi-themed .sugoi-wa-inline {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: var(--sg-touch);
	padding: 0.6rem 1.2rem;
	border-radius: var(--sg-radius-pill);
	border: 1px solid var(--sg-sage);
	color: var(--sg-sage);
	font-weight: 600;
	background: var(--sg-surface);
	margin-bottom: var(--sg-space-3);
}
.sugoi-themed .sugoi-wa-inline:hover { background: var(--sg-sage); color: var(--sg-surface); }

/* Confianza */
.sugoi-themed .sugoi-trust {
	list-style: none;
	margin: var(--sg-space-3) 0;
	padding: 0;
	display: grid;
	gap: 0.4rem;
}
.sugoi-themed .sugoi-trust li {
	position: relative;
	padding-left: 1.6rem;
	color: var(--sg-ink-soft);
	font-size: 0.95rem;
}
.sugoi-themed .sugoi-trust li::before {
	content: "◆";
	position: absolute;
	left: 0;
	color: var(--sg-gold);
}

/* Selector visual de portada */
.sugoi-themed .sugoi-select-hidden {
	position: absolute;
	width: 1px !important;
	min-width: 0 !important;
	max-width: 1px !important;
	height: 1px !important;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.sugoi-themed .sugoi-option-visual {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sg-space-3);
	margin-top: var(--sg-space-2);
}
.sugoi-themed .sugoi-option {
	width: 96px;
	background: var(--sg-surface);
	border: 2px solid var(--sg-line);
	border-radius: var(--sg-radius-sm);
	padding: 0.4rem;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.sugoi-themed .sugoi-option img { width: 100%; height: auto; border-radius: 6px; }
.sugoi-themed .sugoi-option-label { font-size: 0.78rem; color: var(--sg-ink-soft); text-align: center; }
.sugoi-themed .sugoi-option.is-active { border-color: var(--sg-accent); box-shadow: var(--sg-focus); }

/* Bloque «Elige tu edición» */
.sugoi-themed .sugoi-editions {
	margin: var(--sg-space-6) 0;
	padding: var(--sg-space-5);
	background: var(--sg-surface);
	border: 1px solid var(--sg-line);
	border-radius: var(--sg-radius);
}
.sugoi-themed .sugoi-editions-title {
	font-family: var(--sg-font-display);
	font-size: 1.4rem;
	margin-bottom: var(--sg-space-4);
}
.sugoi-themed .sugoi-editions-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--sg-space-4);
}
.sugoi-themed .sugoi-edition {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	padding: var(--sg-space-4);
	border: 1px solid var(--sg-line);
	border-radius: var(--sg-radius-sm);
	background: var(--sg-bg);
	color: var(--sg-ink);
	transition: border-color .15s ease, transform .15s ease;
}
.sugoi-themed .sugoi-edition:hover { border-color: var(--sg-accent); transform: translateY(-2px); }
.sugoi-themed .sugoi-edition-label { font-family: var(--sg-font-display); font-size: 1.15rem; }
.sugoi-themed .sugoi-edition-price { color: var(--sg-accent-2); font-weight: 600; }
.sugoi-themed .sugoi-edition-desc { color: var(--sg-ink-soft); font-size: 0.88rem; }
.sugoi-themed .sugoi-edition.is-current { border-color: var(--sg-accent); background: var(--sg-surface-2); }
.sugoi-themed .sugoi-edition-current { font-size: 0.78rem; color: var(--sg-accent); font-weight: 600; margin-top: 0.25rem; }

@media (max-width: 760px) {
	.sugoi-themed .sugoi-editions-grid { grid-template-columns: 1fr; }
}

/* Descripción larga cuidada */
.sugoi-themed .sugoi-section { margin: var(--sg-space-7) 0; }
.sugoi-themed .sugoi-section h2 {
	font-family: var(--sg-font-display);
	font-size: 1.6rem;
	text-transform: none;
	letter-spacing: 0;
	margin-bottom: var(--sg-space-4);
	padding-bottom: var(--sg-space-2);
	border-bottom: 2px solid var(--sg-line);
}
.sugoi-themed .sugoi-section-description .sugoi-section-content ol {
	list-style: none;
	counter-reset: sg-item;
	display: grid;
	gap: var(--sg-space-3);
	padding: 0;
}
.sugoi-themed .sugoi-section-description ol li {
	position: relative;
	counter-increment: sg-item;
	padding-left: 2.6rem;
	font-size: 1.02rem;
}
.sugoi-themed .sugoi-section-description ol li::before {
	content: counter(sg-item);
	position: absolute;
	left: 0;
	top: 0;
	width: 2rem; height: 2rem;
	display: flex; align-items: center; justify-content: center;
	background: var(--sg-accent);
	color: var(--sg-on-accent);
	border-radius: 50%;
	font-weight: 600;
	font-size: 0.85rem;
}
.sugoi-themed .sugoi-section-additional-info table { border-radius: var(--sg-radius-sm); overflow: hidden; border: 1px solid var(--sg-line); }
.sugoi-themed .sugoi-section-additional-info th { background: var(--sg-surface-2); }

/* Reseñas: si no hay, el bloque no se muestra */
.sugoi-themed .sugoi-section-reviews.is-empty { display: none; }

/* Productos relacionados */
.sugoi-themed .related.products > h2 {
	font-family: var(--sg-font-display);
	text-transform: none;
	letter-spacing: 0;
	font-size: 1.5rem;
}
.sugoi-themed .product-card .product-info h3,
.sugoi-themed .sugoi-product-title-link {
	font-family: var(--sg-font-body);
	text-transform: none;
	color: var(--sg-ink);
}
.sugoi-themed .sugoi-product-price,
.sugoi-themed .product-info .price { font-family: var(--sg-font-display); color: var(--sg-accent-2); }

/* ---------- Carrito (clásico) ---------- */
.sugoi-themed .woocommerce-cart .sugoi-shop-wrapper,
.sugoi-themed .woocommerce-checkout .sugoi-shop-wrapper { padding-top: var(--sg-space-5); }

.sugoi-themed .woocommerce table.shop_table {
	background: var(--sg-surface);
	border: 1px solid var(--sg-line);
	border-radius: var(--sg-radius);
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}
.sugoi-themed .woocommerce table.shop_table th {
	background: var(--sg-surface-2);
	color: var(--sg-ink);
	font-family: var(--sg-font-body);
	text-transform: none;
}
.sugoi-themed .woocommerce table.shop_table td,
.sugoi-themed .woocommerce table.shop_table th { border-color: var(--sg-line); }
.sugoi-themed .woocommerce-cart .cart_item img { border-radius: var(--sg-radius-sm); }
.sugoi-themed .sugoi-cart-notice {
	background: var(--sg-surface-2);
	border-radius: var(--sg-radius-sm);
	padding: var(--sg-space-3) var(--sg-space-4);
	color: var(--sg-ink-soft);
}

.sugoi-themed .woocommerce .cart-collaterals .cart_totals,
.sugoi-themed .woocommerce-cart .cart-collaterals .cart_totals {
	background: var(--sg-surface);
	border: 1px solid var(--sg-line);
	border-radius: var(--sg-radius);
	padding: var(--sg-space-5);
}
.sugoi-themed .woocommerce .cart_totals h2 { font-family: var(--sg-font-display); text-transform: none; letter-spacing: 0; font-size: 1.35rem; }

/* Un único botón principal; «seguir comprando» como enlace */
.sugoi-themed .woocommerce-cart .wc-proceed-to-checkout a.checkout-button { width: 100%; text-align: center; font-size: 1.05rem; }
.sugoi-themed .woocommerce-cart a.continue-shopping,
.sugoi-themed .woocommerce .return-to-shop a.button {
	background: none;
	color: var(--sg-accent);
	box-shadow: none;
	text-decoration: underline;
	padding: 0.4rem 0;
	min-height: auto;
}
.sugoi-themed .woocommerce .return-to-shop a.button:hover { background: none; color: var(--sg-accent-hover); }

.sugoi-themed .sugoi-cart-variation { display: block; color: var(--sg-ink-soft); font-size: 0.85rem; margin-top: 0.2rem; }

/* ---------- Checkout (clásico) ---------- */
.sugoi-themed .woocommerce-checkout form.checkout {
	display: grid;
	grid-template-columns: 1.6fr 1fr;
	gap: var(--sg-space-6);
	align-items: start;
}
.sugoi-themed #customer_details { width: 100%; }
.sugoi-themed .woocommerce-checkout #order_review_heading { font-family: var(--sg-font-display); text-transform: none; letter-spacing: 0; }

.sugoi-themed .woocommerce-checkout .col2-set { display: block; }
.sugoi-themed .woocommerce-checkout .woocommerce-billing-fields h3,
.sugoi-themed .woocommerce-checkout .woocommerce-additional-fields h3 {
	font-family: var(--sg-font-display);
	text-transform: none;
	letter-spacing: 0;
	font-size: 1.25rem;
	border-bottom: 1px solid var(--sg-line);
	padding-bottom: var(--sg-space-2);
}
.sugoi-themed .woocommerce form .form-row label { font-family: var(--sg-font-body); font-weight: 500; color: var(--sg-ink); }
.sugoi-themed .woocommerce form .form-row input.input-text,
.sugoi-themed .woocommerce form .form-row textarea,
.sugoi-themed .woocommerce form .form-row select {
	background: var(--sg-surface);
	border: 1px solid var(--sg-line-strong);
	border-radius: var(--sg-radius-sm);
	padding: 0.7rem 0.9rem;
	min-height: var(--sg-touch);
	color: var(--sg-ink);
	font-family: var(--sg-font-body);
}
.sugoi-themed .woocommerce form .form-row input.input-text:focus,
.sugoi-themed .woocommerce form .form-row select:focus {
	border-color: var(--sg-accent);
	box-shadow: var(--sg-focus);
	outline: none;
}

/* Resumen del pedido claramente separado */
.sugoi-themed .woocommerce-checkout #order_review {
	background: var(--sg-surface);
	border: 1px solid var(--sg-line);
	border-radius: var(--sg-radius);
	padding: var(--sg-space-5);
	position: sticky;
	top: 140px;
}
.sugoi-themed .woocommerce-checkout #order_review table.shop_table { border: none; }

/* Zona de pago separada y segura */
.sugoi-themed .woocommerce-checkout #payment {
	background: var(--sg-surface-2);
	border-radius: var(--sg-radius-sm);
	padding: var(--sg-space-4);
}
.sugoi-themed .woocommerce-checkout #payment ul.payment_methods {
	border-bottom: 1px solid var(--sg-line);
	padding-bottom: var(--sg-space-3);
}
.sugoi-themed .woocommerce-checkout #payment div.payment_box {
	background: var(--sg-surface);
	color: var(--sg-ink-soft);
	border-radius: var(--sg-radius-sm);
}
.sugoi-themed .woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--sg-surface); }
.sugoi-themed .woocommerce-checkout .sugoi-pay-logos { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: var(--sg-space-3); align-items: center; }
.sugoi-themed .sugoi-pay-logos .sugoi-pay-chip {
	border: 1px solid var(--sg-line-strong);
	border-radius: var(--sg-radius-sm);
	padding: 0.3rem 0.7rem;
	font-size: 0.82rem;
	color: var(--sg-ink-soft);
	background: var(--sg-surface);
}

@media (max-width: 900px) {
	.sugoi-themed .woocommerce-checkout form.checkout { grid-template-columns: 1fr; }
	.sugoi-themed .woocommerce-checkout #order_review { position: static; }
	.sugoi-themed .woocommerce .col2-set .col-1,
	.sugoi-themed .woocommerce .col2-set .col-2,
	.sugoi-themed .woocommerce-checkout .form-row-first,
	.sugoi-themed .woocommerce-checkout .form-row-last { width: 100%; float: none; }
}

/* ---------- Mini-carrito / off-canvas ---------- */
.sugoi-themed .sugoi-offcanvas-content { background: var(--sg-surface); }
.sugoi-themed .sugoi-offcanvas-header h3 { font-family: var(--sg-font-display); }

/* ---------- WhatsApp flotante ---------- */
.sugoi-themed .sugoi-whatsapp-float { background: var(--sg-sage); }

/* ---------- Contraste y accesibilidad (O24) ---------- */
.sugoi-themed .woocommerce-breadcrumb,
.sugoi-themed .woocommerce-breadcrumb a { color: var(--sg-ink-soft); }
.sugoi-themed .related.products > h2 { color: var(--sg-ink); }
.sugoi-themed .aa-footer .footer-bottom { color: var(--sg-bg); opacity: 1; }
.sugoi-themed .aa-footer, .sugoi-themed footer { color: var(--sg-bg); }
.sugoi-themed .sugoi-offcanvas-body .woocommerce-mini-cart__buttons a.button { color: var(--sg-on-accent); }

/* =========================================================
   O25 — Ronda 2 (correcciones sobre O24)
   ========================================================= */

/* ---------- 3. Cabecera nueva, compacta y clara ---------- */
.sugoi-themed .aa-main-nav,
.sugoi-skin-sakabato .aa-main-nav { padding: 0.65rem 0; }

/* ---------- O26: botones de acción en la tipografía de la marca ---------- */
/* main.css hereda Oswald + MAYÚSCULAS en los botones de WooCommerce. La piel
   de Sugoi usa Fraunces + Libre Franklin, sin mayúsculas. Se corrige solo en
   los botones de la ficha, el carrito y el checkout. */
.sugoi-themed div.product form.cart button.single_add_to_cart_button,
.sugoi-themed .woocommerce a.button,
.sugoi-themed .woocommerce button.button,
.sugoi-themed .woocommerce input.button,
.sugoi-themed .woocommerce #respond input#submit,
.sugoi-themed .woocommerce a.button.alt,
.sugoi-themed .woocommerce button.button.alt,
.sugoi-themed .woocommerce input.button.alt,
.sugoi-themed .woocommerce #respond input#submit.alt,
.sugoi-themed #place_order,
.sugoi-themed .btn-primary,
.sugoi-themed .btn-secondary {
	font-family: var(--sg-font-body);
	text-transform: none;
	letter-spacing: 0;
}
.sugoi-themed .nav-center .logo,
.sugoi-skin-sakabato .nav-center .logo {
	font-family: var(--sg-font-display);
	font-size: 1.7rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: var(--sg-ink);
}
.sugoi-themed .nav-left a,
.sugoi-themed .nav-right a { letter-spacing: 0; text-transform: none; }
.sugoi-themed .aa-header { box-shadow: 0 1px 0 var(--sg-line); }

/* La cabecera fija no debe tapar el contenido; el relleno ya reserva
   el alto. En celular reducimos el alto de la cabecera al mínimo. */
@media (max-width: 900px) {
	.sugoi-themed .aa-main-nav { padding: 0.5rem 0; }
	.sugoi-themed .nav-center .logo { font-size: 1.45rem; }
	.sugoi-themed #page { padding-top: 88px; }
	.sugoi-themed .aa-main-inner { gap: 0.5rem; }
	.sugoi-themed .nav-right { gap: 0.75rem; font-size: 0.85rem; }
	.sugoi-themed .nav-right a,
	.sugoi-themed .nav-right .aa-cart-btn { text-transform: none; }
}

/* En el checkout, deja aire bajo la cabecera para no tapar campos. */
.sugoi-themed.woocommerce-checkout #page,
.sugoi-themed body.woocommerce-checkout #page { padding-top: 96px; }
@media (max-width: 900px) {
	.sugoi-themed.woocommerce-checkout #page { padding-top: 96px; }
}

/* ---------- 4. Selector de portada junto al botón, en fila ---------- */
/* El formulario ocupa todo el ancho de la columna y alinea sus filas. */
.sugoi-themed div.product form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--sg-space-3);
	width: 100%;
	margin: var(--sg-space-4) 0;
}
.sugoi-themed div.product form.cart table.variations {
	flex: 1 1 100%;
	width: 100%;
	table-layout: fixed;
	margin: 0 0 var(--sg-space-2);
}
.sugoi-themed div.product form.cart table.variations th.label,
.sugoi-themed div.product form.cart table.variations td.value {
	display: block;
	width: 100%;
}
.sugoi-themed div.product form.cart table.variations th.label { width: 100%; }
.sugoi-themed div.product form.cart table.variations th,
.sugoi-themed div.product form.cart table.variations td {
	padding: 0.25rem 0;
}
.sugoi-themed div.product form.cart .single_variation_wrap {
	flex: 1 1 100%;
	width: 100%;
}
.sugoi-themed div.product form.cart .woocommerce-variation-add-to-cart {
	display: flex;
	align-items: center;
	gap: var(--sg-space-3);
	flex-wrap: wrap;
}

/* Miniaturas de portada: siempre en fila; en pantallas chicas, scroll. */
.sugoi-themed .sugoi-option-visual {
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	max-width: 100%;
	gap: var(--sg-space-3);
	padding: 2px;
}
.sugoi-themed .sugoi-option {
	flex: 0 0 auto;
	width: 104px;
}
/* Portada elegida: marcada con fuerza. */
.sugoi-themed .sugoi-option.is-active {
	border-color: var(--sg-accent);
	background: var(--sg-surface-2);
	box-shadow: var(--sg-focus);
}
.sugoi-themed .sugoi-option.is-active .sugoi-option-label {
	color: var(--sg-accent);
	font-weight: 700;
}
.sugoi-themed .sugoi-option.is-active::after {
	content: "✓";
	position: absolute;
	top: 4px;
	right: 4px;
	background: var(--sg-accent);
	color: var(--sg-on-accent);
	border-radius: 50%;
	width: 18px;
	height: 18px;
	font-size: 12px;
	line-height: 18px;
	text-align: center;
}
.sugoi-themed .sugoi-option { position: relative; }

/* Botón «Añadir al carrito»: color principal del sistema (azul del logo
   de Sugoi) tanto activo como inactivo, y aviso de por qué está inactivo. */
.sugoi-themed div.product form.cart button.single_add_to_cart_button,
.sugoi-themed div.product form.cart button.single_add_to_cart_button:hover {
	background: var(--sg-accent);
	color: var(--sg-on-accent);
}
.sugoi-themed div.product form.cart button.single_add_to_cart_button:not(.disabled):not(:disabled):hover {
	background: var(--sg-accent-hover);
}
.sugoi-themed div.product form.cart button.single_add_to_cart_button.disabled,
.sugoi-themed div.product form.cart button.single_add_to_cart_button:disabled,
.sugoi-themed div.product form.cart button.single_add_to_cart_button.wc-variation-selection-needed,
.sugoi-themed div.product form.cart button.single_add_to_cart_button.disabled:hover {
	background: var(--sg-accent) !important;
	color: var(--sg-on-accent) !important;
	opacity: 1 !important;
	cursor: not-allowed;
	box-shadow: none !important;
	transform: none !important;
}
.sugoi-themed .sugoi-choose-note {
	flex: 1 1 100%;
	margin: 0;
	color: var(--sg-ink-soft);
	font-size: 0.9rem;
}
.sugoi-themed .sugoi-choose-note::before {
	content: "→ ";
	color: var(--sg-accent);
}
.sugoi-themed .sugoi-choose-note[hidden] { display: none; }

/* ---------- 5. Tarjetas de edición: distribución vertical y legible ---------- */
.sugoi-themed .sugoi-editions-grid {
	grid-template-columns: 1fr;
	gap: var(--sg-space-3);
}
.sugoi-themed .sugoi-edition {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: baseline;
	column-gap: var(--sg-space-3);
	row-gap: 0.15rem;
	padding: var(--sg-space-3) var(--sg-space-4);
}
.sugoi-themed .sugoi-edition-label { font-family: var(--sg-font-display); font-size: 1.1rem; }
.sugoi-themed .sugoi-edition-price { text-align: right; white-space: nowrap; }
.sugoi-themed .sugoi-edition-desc {
	grid-column: 1 / -1;
	font-size: 0.86rem;
	line-height: 1.35;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.sugoi-themed .sugoi-edition-current { grid-column: 1 / -1; margin-top: 0; }

/* ---------- 7. Meta del producto limpio ---------- */
.sugoi-themed .sugoi-product-meta { margin-top: var(--sg-space-3); font-size: 0.85rem; color: var(--sg-ink-soft); }
.sugoi-themed .sugoi-product-meta .sku_wrapper { margin-right: var(--sg-space-3); }

/* ---------- 8. Sin desbordamiento horizontal ---------- */
/* El mini-carrito off-canvas vive a la derecha; sin recorte, ensancha la
   página en escritorio. Se recorta sin afectar su apertura. */
.sugoi-themed .sugoi-offcanvas,
.sugoi-skin-sakabato .sugoi-offcanvas { overflow: hidden; }
.sugoi-themed body, .sugoi-skin-sakabato body { overflow-x: hidden; }

