/**
 * Frontend — Sierra Muebles Gestor
 * Layout catálogo, filtros, banner, stock, precios, atributos,
 * opciones de modelo, componentes de bundle.
 *
 * @package SierraMueblesGestor
 * @since 1.2.0
 */

/* ═══════════════════════════════════════════════════════════════
   CATÁLOGO — Layout full width (Astra Pro)
   ═══════════════════════════════════════════════════════════════ */
/*
body.ast-woo-shop-archive.ast-page-builder-template .site-content > .ast-container {
    max-width: 100%;
    padding-left: 30px;
    padding-right: 30px;
}

body.ast-woo-shop-archive.ast-page-builder-template #primary {
    width: 100% !important;
}

body.ast-woo-shop-archive.ast-page-builder-template #secondary {
    display: none !important;
    width: 0 !important;
}

body.ast-woo-shop-archive ul.products.elementor-grid {
    opacity: 0;
    transition: opacity 0.3s ease;
}
body.ast-woo-shop-archive .sm-shop-layout ul.products.elementor-grid {
    opacity: 1;
}

body.ast-woo-shop-archive .elementor-element > .elementor-container {
    width: 100%;
    max-width: 1920px !important;
}
body.ast-woo-shop-archive .elementor-element.elementor-element-0e20c6f {
    margin: 0 -40px;
    padding: 0 50px;
}
body.ast-woo-shop-archive .elementor-col-33.elementor-element-53e83a2c {
    display: none !important;
}
body.ast-woo-shop-archive .elementor-col-66.elementor-element-2270f276 {
    width: 100%;
}
body.ast-woo-shop-archive .sm-shop-layout {
    gap: 0;
}
*/

body.single-product.ast-page-builder-template [data-id="058e065"] {
    display: none;
}

/* ═══════════════════════════════════════════════════════════════
   CATÁLOGO — Shop layout wrapper (sidebar + grilla)
   ═══════════════════════════════════════════════════════════════ */


.woocommerce ul.products li.product .astra-shop-summary-wrap, .woocommerce-page ul.products li.product .astra-shop-summary-wrap { padding:0 !important; }

/* ═══════════════════════════════════════════════════════════════
   CATÁLOGO — Sidebar de filtros
   ═══════════════════════════════════════════════════════════════ */

.sm-filter-sidebar {
    width: 0;
    overflow: hidden;
    flex-shrink: 0;
    transition: width 0.35s ease;
    display: none !important;
}
.sm-filter-sidebar.is-open {
    width: 260px;
}
.sm-filter-sidebar-inner {
    width: 260px;
    padding-right: 16px;
}

.sm-filter-group {
    border-bottom: 1px solid #e0e0e0;
    padding: 18px 0;
}
.sm-filter-group-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    user-select: none;
}
.sm-filter-group-header .sm-fg-icon {
    font-size: 20px;
    font-weight: 300;
    line-height: 1;
    transition: transform 0.2s;
}
.sm-filter-group.is-open .sm-fg-icon {
    transform: rotate(45deg);
}
.sm-filter-group-body {
    display: none;
    padding-top: 14px;
}
.sm-filter-group.is-open .sm-filter-group-body {
    display: block;
}

/* Botón Filtros toggle */
.sm-filter-toggle-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border: 1.5px solid #111;
    background: transparent;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    transition: background 0.2s, color 0.2s;
}
.sm-filter-toggle-btn:hover {
    background: #111;
    color: #fff;
}
.sm-filter-toggle-btn svg {
    width: 16px;
    height: 16px;
}

/* Toolbar (botón + sorting) */
.sm-shop-toolbar {
    display: flex;
    align-items: center;
    gap: 16px;
    display: none !important;
    margin-bottom: 28px;
}
.sm-shop-toolbar .woocommerce-ordering {
    margin: 0;
}

/* Overlay mobile */
.sm-filter-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    z-index: 9998;
}
.sm-filter-overlay.is-visible {
    display: block;
}

/* Sidebar mobile */
@media (max-width: 768px) {
    .sm-filter-sidebar.is-open {
        position: fixed;
        top: 0;
        left: 0;
        width: 280px !important;
        height: 100vh;
        background: #fff;
        z-index: 9999;
        overflow-y: auto;
        padding: 24px 20px;
        box-shadow: 4px 0 24px rgba(0,0,0,0.15);
    }
    .sm-filter-sidebar-inner {
        width: 100%;
        padding: 0;
    }
}

/* Ocultar sidebar original Astra */
.woocommerce .ast-woocommerce-sidebar,
.woocommerce #secondary,
.woocommerce .widget-area {
    display: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   CATÁLOGO — Banner 2×2 en grilla
   ═══════════════════════════════════════════════════════════════ */

ul.products.elementor-grid.columns-4 {
    grid-auto-flow: dense;
}

li.sm-banner-2x2 {
    grid-column: span 2;
    grid-row: span 2;
    overflow: hidden;
}
li.sm-banner-2x2 a,
li.sm-banner-2x2 img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 768px) {
    li.sm-banner-2x2 {
        grid-column: span 1;
        grid-row: span 1;
    }
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Layout full width
   ═══════════════════════════════════════════════════════════════ */
/*
body.single-product .elementor-section > .elementor-container {
    max-width: calc(100% - 30px);
}

@media (min-width: 768px) {
    body.single-product .woo-variation-gallery-container {
        gap: 15px;
    }
}
*/

/* Galería con imagen única: sin columna de thumbnails */
.woocommerce-product-gallery.smg-gallery-imagen-unica {
    display: block;
}
.woocommerce-product-gallery.smg-gallery-imagen-unica .flex-viewport {
    width: 100% !important;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Precios
   ═══════════════════════════════════════════════════════════════ */

.smg-precios {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    margin: 8px 0 4px;
    flex-wrap: wrap;
}
.smg-precios * {
    white-space: nowrap;
    font-family: 'Maven Pro', sans-serif;
}

/* El precio activo (regular o con descuento) */
.smg-precios .woocommerce-Price-amount {
    font-size: 1.5em;
    font-weight: 700;
    color: #111;
}

/* Precio tachado cuando hay descuento (generado por WC o plugin de descuento) */
.smg-precios del .woocommerce-Price-amount {
    font-size: 1em;
    font-weight: 400;
    color: #999;
}
.smg-precios ins {
    text-decoration: none;
}
.smg-precios del {
    color: #999;
}

.smg-precio-consultar {
    color: #999;
    font-style: italic;
    margin: 8px 0;
    font-size: 0.95em;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Stock por tienda
   ═══════════════════════════════════════════════════════════════ */
.smg-stock-tiendas { display:flex; gap:10px; font-size:14px; }
.smg-stock-item { display:flex; align-items:center; gap:5px; }
.smg-stock-cantidad { font-weight:700; }
/* Tránsito con tono distinto */
.smg-stock-transito .smg-stock-cantidad { color:#000; }
/* Sin stock */
.smg-stock-tiendas.smg-sin-stock .smg-stock-consultar { font-style:italic; color:#999; }


.woocommerce-product-details__short-description p { margin-bottom:0 !important; }

.smg-descripcion { font-size:14px; line-height:1.4; }

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Atributos informativos
   ═══════════════════════════════════════════════════════════════ */

.smg-atributos { margin-top:3px; }

.smg-atributo-item {
    display: flex;
    gap: 8px;
    padding:0;
    font-size: 14px;
    line-height: 1.4;
}
.smg-atributo-item:last-child {
    border-bottom: none;
}

.smg-atributo-nombre {
    /*min-width: 80px;*/
    flex-shrink: 0;
}

.smg-atributo-valor {
}

/* Código comercial — destacado, va primero */
.smg-atributo-codigo {
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Nombre comercial — secundario, va después del · */
.smg-atributo-nombre-comercial {
    text-transform: capitalize;
    font-style: normal;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Opciones de Modelo (selector de hermanos)
   ═══════════════════════════════════════════════════════════════ */

.smg-opciones-modelo {
    margin: 24px 0;
}

.smg-opciones-modelo-titulo {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #000;
    margin: 0 0 12px;
}

.smg-opciones-modelo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 10px;
}

@media (min-width: 769px) {
    .smg-opciones-modelo-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Card de cada opción (a o div) */
.smg-opcion-modelo {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 10px 8px;
    border: 1.5px solid #e0e0e0;
    border-radius: 4px;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.2s, box-shadow 0.2s;
    cursor: pointer;
}
a.smg-opcion-modelo:hover {
    border-color: #111;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    color: inherit;
    text-decoration: none;
}

/* Opción activa (producto actual) */
.smg-opcion-modelo.smg-opcion-activa {
    border-color: #111;
    box-shadow: 0 0 0 1px #111;
    cursor: default;
}

.smg-opcion-imagen {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 3px;
    margin-bottom: 8px;
    display: block;
}
.smg-opcion-sin-imagen {
    width: 80px;
    height: 80px;
    background: #f5f5f5;
    border-radius: 3px;
    margin-bottom: 8px;
}

.smg-opcion-sku {
    font-size: 10px;
    color: #aaa;
    letter-spacing: 0.04em;
    display: block;
    margin-bottom: 0;
}

.smg-opcion-nombre {
    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;
    color: #333;
    margin-bottom: 4px;
    display: block;
}

.smg-opcion-atributos {
    font-size: 10px;
    color: #888;
    line-height: 1.3;
    display: block;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Dimensiones y Peso
   ═══════════════════════════════════════════════════════════════ */

.smg-dimensiones { }

.smg-dim-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding:0;
    /*border-bottom: 1px solid #f0f0f0;*/
    font-size: 14px;
}
.smg-dim-item:last-child {
    border-bottom: none;
}
.smg-dim-item .smg-dim-icono, .smg-dim-item .smg-dim-label { display:none; }

.smg-dim-peso {
    display: none;
}

.smg-dim-icono {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: #aaa;
}

.smg-dim-label {
    color: #888;
    font-weight: 500;
    min-width: 90px;
    flex-shrink: 0;
}

.smg-dim-valor { }

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Componentes de Bundle (seccional)
   Layout horizontal: imagen izquierda + info derecha
   ═══════════════════════════════════════════════════════════════ */

.smg-componentes-bundle {
    margin: 24px 0;
}

.smg-componentes-titulo {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #888;
    margin: 0 0 12px;
}

/* Lista vertical de componentes */
.smg-componentes-lista {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Cada componente: fila horizontal */
.smg-componente-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 14px;
    background: #f9f9f9;
    border: 1px solid #ebebeb;
    border-radius: 4px;
    transition: box-shadow 0.2s;
}
.smg-componente-item:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

/* Imagen — tamaño fijo a la izquierda */
.smg-componente-imagen {
    width: 90px;
    height: 90px;
    object-fit: cover;
    border-radius: 3px;
    flex-shrink: 0;
    display: block;
}
.smg-componente-sin-imagen {
    width: 90px;
    height: 90px;
    background: #efefef;
    border-radius: 3px;
    flex-shrink: 0;
}

/* Info — columna derecha */
.smg-componente-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.smg-componente-sku {
    font-size: 10px;
    color: #aaa;
    letter-spacing: 0.04em;
}

.smg-componente-nombre {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: #333;
}

.smg-componente-atributos {
    font-size: 11px;
    color: #888;
    line-height: 1.4;
}

/* Dimensiones dentro del componente — más compactas */
.smg-componente-info .smg-dimensiones {
    margin: 2px 0;
}
.smg-componente-info .smg-dim-item {
    padding: 2px 0;
    font-size: 11px;
}
.smg-componente-info .smg-dim-label {
    min-width: 70px;
    font-size: 11px;
}
.smg-componente-info .smg-dim-icono {
    width: 13px;
    height: 13px;
}

@media (max-width: 480px) {
    .smg-componente-item {
        flex-direction: column;
    }
    .smg-componente-imagen {
        width: 100%;
        height: 160px;
    }
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Ocultar elementos nativos de WooCommerce
   ═══════════════════════════════════════════════════════════════ */

.single-product .single_add_to_cart_button,
.single-product .quantity,
.single-product .woocommerce-variation-add-to-cart {
    display: none !important;
}

.single-product .smg-seccion-titulo { font-size:13px; line-height:1.4; margin-top:15px; }

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Variaciones como cards verticales
   (woo-variation-swatches plugin)
   ═══════════════════════════════════════════════════════════════ */

.woo-variation-swatches .variable-items-wrapper {
    flex-direction: column;
}
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item) {
    display: flex;
    width: 100%;
    height: auto;
    border: 0 none;
    justify-content: flex-start;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.1);
    color: var(--e-global-color-text, #333);
}
.woo-variation-swatches .variable-items-wrapper .variable-item .variable-item-contents {
    width: 60px;
    height: 60px;
    flex: 0 0 60px;
    margin-right: 5px;
}
.woo-variation-swatches .variable-items-wrapper .variable-item .variable-item-content {
    display: flex;
    flex-direction: column;
}
.woo-variation-swatches .variable-items-wrapper .variable-item .variable-item-content span {
    display: block;
    line-height: 1.1;
}
.woo-variation-swatches .variable-items-wrapper .variable-item .variable-item-content span:last-child {
    font-size: 0.9em;
}
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).variable-item-current {
    color: #000;
    box-shadow: 0 0 0 1px rgba(0,0,0,1);
}
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item):hover {
    color: #000;
}
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item.selected:not(.no-stock) .variable-item-contents:before,
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).image-variable-item.selected:not(.no-stock) .variable-item-contents:before {
    background: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Imágenes de Acabados
   ═══════════════════════════════════════════════════════════════ */

.smg-imagenes-acabados {
    display: flex;
    gap: 12px;
    margin:15px 0;
    flex-wrap: wrap;
}

.smg-imagen-acabado {
}

.elementor .smg-imagen-acabado img {
    display: block;
    width: auto;
    height: 50px;
    object-fit: cover;
    transition: transform 0.2s ease;
}

/* ═══════════════════════════════════════════════════════════════
   CATÁLOGO — Accordion de categorías (reemplaza ZF Category Accordion)
   Aplica sobre el widget nativo WooCommerce "Categorías de producto"
   ═══════════════════════════════════════════════════════════════ */

.widget_product_categories .product-categories,
.wp-block-categories.wp-block-categories-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.widget_product_categories .cat-item,
.wp-block-categories .cat-item {
    list-style: none;
    margin: 0;
    padding: 0 !important;
}

.widget_product_categories .smg-cat-row,
.wp-block-categories .smg-cat-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e8e8e8;
}

/* Enlace base — todos los niveles */
.widget_product_categories .smg-cat-row > a,
.wp-block-categories .smg-cat-row > a {
    flex: 1;
    padding: 8px 0;
    font-size: 13px !important;
    font-weight: 400;
    color: #555;
    text-decoration: none;
    letter-spacing: 0.02em;
    transition: color 0.15s;
}
.widget_product_categories .smg-cat-row > a:hover,
.wp-block-categories .smg-cat-row > a:hover {
    color: #000;
}

/* Nivel raíz — uppercase negrita */
.widget_product_categories > ul > .cat-item > .smg-cat-row > a,
.wp-block-categories > .cat-item > .smg-cat-row > a {
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #222;
    padding: 10px 0;
}

/* Categoría activa y ancestros */
.widget_product_categories .current-cat > .smg-cat-row > a,
.widget_product_categories .current-cat-parent > .smg-cat-row > a,
.widget_product_categories .current-cat-ancestor > .smg-cat-row > a,
.wp-block-categories .current-cat > .smg-cat-row > a,
.wp-block-categories .current-cat-parent > .smg-cat-row > a,
.wp-block-categories .current-cat-ancestor > .smg-cat-row > a {
    font-weight: 700;
    color: #000;
}

/* Botón toggle +/- */
.widget_product_categories .smg-cat-toggle,
.wp-block-categories .smg-cat-toggle {
    background: none !important;
    background-color: transparent !important;
    border: none;
    box-shadow: none !important;
    cursor: pointer;
    padding: 8px 0 8px 10px;
    font-size: 18px;
    font-weight: 300;
    line-height: 1;
    color: #bbb;
    transition: color 0.15s, transform 0.25s ease;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
}
.widget_product_categories .smg-cat-toggle:hover,
.wp-block-categories .smg-cat-toggle:hover {
    color: #666;
}
.widget_product_categories .smg-open > .smg-cat-row > .smg-cat-toggle,
.wp-block-categories .smg-open > .smg-cat-row > .smg-cat-toggle {
    transform: rotate(45deg);
    color: #666;
}

/* Hijos — smooth con max-height */
.widget_product_categories .children,
.wp-block-categories .children {
    list-style: none;
    margin: 0;
    padding: 0 0 0 10px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
.widget_product_categories .smg-open > .children,
.wp-block-categories .smg-open > .children {
    max-height: 1500px;
}

/* Separadores hijos */
.widget_product_categories .children .smg-cat-row,
.wp-block-categories .children .smg-cat-row {
    border-bottom: 1px solid #f0f0f0;
}
.widget_product_categories .children .cat-item:last-child > .smg-cat-row,
.wp-block-categories .children .cat-item:last-child > .smg-cat-row {
    border-bottom: none;
}

/* Nivel 3 (nietos) — más pequeño e indentado */
.widget_product_categories .children .children,
.wp-block-categories .children .children {
    padding-left: 8px;
}
.widget_product_categories .children .children > .cat-item > .smg-cat-row > a,
.wp-block-categories .children .children > .cat-item > .smg-cat-row > a {
    font-size: 13px;
    color: #777;
    padding: 7px 0;
}


.sm-filter-toggle-btn { display:none; }
.smg-badge-referencial--loop { top:auto !important; left:auto !important; bottom:10px; right:10px; }
.smg-badge-referencial span { background:transparent !important; font-size:9px !important; padding:0 !important; opacity:.75; }
.woocommerce-js ul.products li.product .price, .woocommerce-page ul.products li.product .price { font-weight:400 !important; }
.add-to-wishlist-before_image .yith-wcwl-add-to-wishlist { bottom:10px; }


.elementor-products-grid ul.products.elementor-grid li.product .onsale.smg-badge-discount, .woocommerce-js div.product span.onsale.smg-badge-discount { display:flex !important; border-radius:0; position:absolute; right: 20px; top: -10px; align-items: flex-start; justify-content: center; width:100px; min-width:0 !important; min-height:0 !important; font-size: 2.25em; font-family: 'NewYork'; line-height: 1; color: rgb(56, 56, 56); background: rgb(252, 252, 255); margin:0 !important; padding:.5rem 0 !important; z-index:1; box-shadow:3px 6px 9px 0px rgba(0, 0, 0, 0.5); }

/* Badge descuento en ficha de producto individual: junto al botón de zoom (top right).
   Scope body.single-product para no afectar la grilla. */
body.single-product div.product span.onsale.smg-badge-discount {
    top: -12px !important;
    right: 60px !important;
    left: auto !important;
    bottom: auto !important;
}
.woocommerce ul.products li.product .onsalesmg-badge-discount b { color: inherit; }
.woocommerce ul.products li.product .onsalesmg-badge-discount small { display: block; font-weight: 600; font-size: .7em; margin-left: 1px; }

.woocommerce-js div.product span.onsale.smg-badge-discount {  }


.tax-product_cat.term-sala .sm-banner-2x2 { display:none; }

/* ═══════════════════════════════════════════════════════════════
   BADGES NATIVOS — Ocultar WooCommerce / Astra
   Los badges los gestiona el módulo SMG (smg-badge-discount, etc.)
   ═══════════════════════════════════════════════════════════════ */

/* Badge "AGOTADO" / "Out of Stock" de Astra */
.ast-shop-product-out-of-stock,
.ast-out-of-stock,
.ast-out-of-stock-overlay,
.woocommerce-badge--outofstock,
span.outofstock-badge,
.product-image-wrap .outofstock,
.ast-woo-product-gallery__outofstock {
    display: none !important;
}

/* Badge "NUEVO" nativo de WooCommerce/Astra */
.ast-badge-new,
.woocommerce-badge--new,
span.new-badge {
    display: none !important;
}

/* Badge "REBAJADO" / "Sale" nativo — ocultar el nativo sin clase SMG custom.
   El badge con clase .smg-badge-discount se mantiene visible (ver regla más arriba). */
.woocommerce ul.products li.product .onsale:not(.smg-badge-discount),
.elementor-products-grid ul.products li.product .onsale:not(.smg-badge-discount),
.woocommerce span.onsale:not(.smg-badge-discount) {
    display: none !important;
}

/* ═══════════════════════════════════════════════════════════════
   PRODUCTO — Galería: ocultar columna de thumbnails si hay 1 sola imagen
   Clase añadida por JS (frontend.js) cuando quedan ≤1 thumbnails visibles
   ═══════════════════════════════════════════════════════════════ */

.smg-gallery-imagen-unica .flex-control-nav.flex-control-thumbs {
    display: none !important;
}


.single-product .elementor-1030 .elementor-element.elementor-element-ba23eb8 .elementor-heading-title { margin-bottom:0; }
.single-product .elementor-section.elementor-element-5391a15 {  
    display: none !important;
}
/* ═══════════════════════════════════════════════════════════════
   GRILLA — Subtítulo con StyleName + atributos
   ═══════════════════════════════════════════════════════════════ */

/* Prevenir que li.product se expanda más allá de su celda de grid */
ul.products li.product {
    min-width: 0;
}

.smg-subtitulo-grilla {
    font-size: 11px;
    color: #999;
    line-height: 1.4;
    margin: 2px 0 4px;
    white-space: normal;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    letter-spacing: 0.02em;
}

.smg-subtitulo-sku {
    color: #aaa;
    font-weight: 500;
}

.smg-subtitulo-attr {
    color: #999;
}

.smg-subtitulo-sep {
    color: #ccc;
}

/* Ocultar subtítulo mientras está dentro del wrapper de imagen (antes del reposicionamiento JS) */
.astra-shop-thumbnail-wrap .smg-subtitulo-grilla,
.tp-image-wrapper .smg-subtitulo-grilla,
.woocommerce-LoopProduct-link .smg-subtitulo-grilla {
    display: none !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   BADGES DEL VISUALIZADOR — grilla de productos
   El badge se inyecta como último hijo de li.product via
   woocommerce_after_shop_loop_item (prioridad 5).
   li.product ya tiene position:relative en Astra Pro + Elementor Pro.
   Con top/left y z-index alto se superpone sobre la imagen del producto.
──────────────────────────────────────────────────────────────────────────── */

/* Garantizar position:relative en el contenedor de la tarjeta */
ul.products li.product {
    position: relative;
}

.smg-badges-grilla {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    pointer-events: none;
}

.smg-badge-viz {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1.4;
}

/* En camino — azul */
.smg-badge-viz--en_camino {
    background: #2271b1;
    color: #fff;
}

/* Foto referencial — gris neutro */
.smg-badge-viz--foto_referencial {
    background: rgba(0, 0, 0, 0.45);
    color: #fff;
}

/* Sin stock (badge) — ocre suave */
.smg-badge-viz--sin_stock {
    background: #f0b849;
    color: #1d2327;
}

/* Sin precio — rojo suave */
.smg-badge-viz--sin_precio {
    background: #d63638;
    color: #fff;
}

/* ETA bajo stock en tránsito en ficha de producto */
.smg-eta-transito {
    font-size: 12px;
    color: #2271b1;
    margin: 6px 0 0;
    font-style: italic;
}

/* PRODUCTOS RELACIONADOS */
.related.products { margin-bottom:3rem; }
.related.products .yith-wcwl-add-to-wishlist { display:none; }
body.single-product  div.product .related.products span.onsale.smg-badge-discount { right:10px !important; border-radius:0; }

/* BUNDLES */
.smg-componentes-bundle .smg-componentes-titulo { font-size:12px; color:#000; }
.smg-componentes-bundle .smg-componente-info { gap:0; }
.smg-componentes-bundle .smg-componente-info .smg-componente-sku { line-height:1.1; }
.smg-componentes-bundle .smg-componente-info .smg-dim-item { padding:0; }
.smg-componentes-bundle .smg-componente-info .smg-dim-label { display:none; }

/* WHISHLIS */
body.single-product .yith-wcwl-add-button { margin-top:15px; text-align:left; }
body.single-product .yith-wcwl-add-button a.add_to_wishlist {  background:#000; padding:.75rem 1rem; border-radius:3px; }
body.single-product .yith-wcwl-add-button a.add_to_wishlist > i { margin-right:5px; }
body.single-product .yith-wcwl-add-button a.add_to_wishlist span { color:#FFF; }
body.single-product .yith-wcwl-add-button a.add_to_wishlist:hover span { color:var( --e-global-color-5ab5e60 ); }