/* =====================================================
   SINGLE PRODUCT — SORPRENDEBONITO MX
===================================================== */

/* =====================================================
   CONTENEDOR GENERAL
===================================================== */

.single-product .site-main{
    width:100%;
    max-width:1380px;
    margin:0 auto;
    padding:38px 40px 100px;
}

/* Migas de pan */

.single-product .woocommerce-breadcrumb{
    margin:0 0 28px;
    color:#9a7a67;
    font-size:14px;
}

.single-product .woocommerce-breadcrumb a{
    color:#7a4a27;
    text-decoration:none;
    transition:color .25s ease;
}

.single-product .woocommerce-breadcrumb a:hover{
    color:#ef3b8a;
}

/* =====================================================
   ESTRUCTURA PRINCIPAL
===================================================== */

.single-product div.product{
    display:grid;
    grid-template-columns:minmax(520px,1.2fr) minmax(380px,.8fr);
    grid-template-areas:
        "gallery summary"
        "tabs tabs"
        "related related";
    column-gap:72px;
    row-gap:0;
    align-items:start;
}

/* =====================================================
   GALERÍA
===================================================== */

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

.single-product .woocommerce-product-gallery__wrapper{
    width:100% !important;
    margin:0 !important;
    overflow:hidden;
    border-radius:20px;
    background:#fff8f5;
    box-shadow:0 18px 42px rgba(122,74,39,.10);
}

.single-product .woocommerce-product-gallery__image{
    width:100% !important;
    max-width:none !important;
    float:none !important;
    overflow:hidden;
}

.single-product .woocommerce-product-gallery__image a{
    display:block;
    width:100%;
}

.single-product .woocommerce-product-gallery__image img{
    display:block;
    width:100% !important;
    max-width:none !important;
    height:auto !important;
    aspect-ratio:1 / 1;
    object-fit:cover;
    border-radius:20px;
    transition:transform .45s ease;
}

.single-product .woocommerce-product-gallery__image:hover img{
    transform:scale(1.025);
}

/* Lupa */

.single-product .woocommerce-product-gallery__trigger{
    top:18px !important;
    right:18px !important;
    width:46px !important;
    height:46px !important;
    border-radius:50% !important;
    background:#fff !important;
    box-shadow:0 10px 24px rgba(122,74,39,.14);
}

/* Miniaturas */

.single-product .flex-control-thumbs{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    margin-top:14px !important;
}

.single-product .flex-control-thumbs li{
    width:auto !important;
    float:none !important;
}

.single-product .flex-control-thumbs img{
    width:100%;
    aspect-ratio:1 / 1;
    object-fit:cover;
    border-radius:10px;
    border:2px solid transparent;
    opacity:.72;
    transition:
        opacity .25s ease,
        border-color .25s ease,
        transform .25s ease;
}

.single-product .flex-control-thumbs img:hover,
.single-product .flex-control-thumbs img.flex-active{
    opacity:1;
    border-color:#ef3b8a;
    transform:translateY(-2px);
}

/* =====================================================
   RESUMEN DEL PRODUCTO
===================================================== */

.single-product div.product .summary{
    grid-area:summary;

    width:100% !important;
    max-width:none !important;
    float:none !important;
    clear:none !important;

    position:static !important;
    top:auto !important;

    align-self:start;
    margin:0 !important;
    padding:38px 38px 34px;

    background:#fffaf8;
    border:1px solid #f1dfd7;
    border-radius:18px;
    box-shadow:0 18px 40px rgba(122,74,39,.08);
}

/* Nombre */

.single-product div.product .summary .product_title{
    margin:0 0 18px !important;
    padding:0;

    font-family:Georgia,serif;
    font-size:clamp(42px,4vw,62px);
    line-height:1.02;
    font-weight:500;
    color:#7a4a27;
}

/* Precio */

.single-product div.product .summary p.price,
.single-product div.product .summary span.price{
    margin:0 0 28px !important;
    color:#9a6530;
    font-size:30px;
    line-height:1.2;
    font-weight:700;
}

.single-product div.product .summary p.price del,
.single-product div.product .summary span.price del{
    opacity:.45;
    margin-right:8px;
}

.single-product div.product .summary p.price ins,
.single-product div.product .summary span.price ins{
    color:#ef3b8a;
    text-decoration:none;
}

/* Descripción corta */

.single-product .woocommerce-product-details__short-description{
    margin-bottom:26px;
    color:#7a4a27;
    font-size:17px;
    line-height:1.7;
}

.single-product .woocommerce-product-details__short-description p{
    margin:0;
}

/* =====================================================
   FORMULARIO DE COMPRA
===================================================== */

.single-product div.product .summary form.cart{
    width:100% !important;
    margin:0 0 26px !important;
    padding:0 !important;

    display:grid !important;
    grid-template-columns:86px minmax(0,1fr);
    gap:14px;
    align-items:stretch;

    float:none !important;
    clear:both !important;
}

/* Cantidad */

.single-product div.product .summary form.cart .quantity{
    width:86px !important;
    min-width:86px !important;

    margin:0 !important;
    padding:0 !important;
    float:none !important;
}

.single-product div.product .summary form.cart .quantity .qty{
    display:block;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:58px;

    margin:0 !important;
    padding:0 8px !important;

    border:1px solid #e8d4ca;
    border-radius:9px;
    background:#fff;
    color:#7a4a27;

    font-size:16px;
    text-align:center;
    outline:none;
    box-shadow:none;
}

.single-product div.product .summary form.cart .quantity .qty:focus{
    border-color:#ef3b8a;
    box-shadow:0 0 0 3px rgba(239,59,138,.10);
}

/* Botón añadir al carrito */

.single-product div.product .summary form.cart .single_add_to_cart_button{
    display:flex !important;
    align-items:center;
    justify-content:center;

    width:100% !important;
    min-width:0 !important;
    min-height:58px;

    margin:0 !important;
    padding:15px 24px !important;

    float:none !important;
    clear:none !important;

    border:0 !important;
    border-radius:9px !important;
    background:#ef3b8a !important;
    color:#fff !important;

    font-size:13px !important;
    line-height:1.2;
    font-weight:800 !important;
    text-transform:uppercase;
    letter-spacing:.6px;

    box-shadow:0 14px 28px rgba(239,59,138,.20);
    cursor:pointer;

    transition:
        background .25s ease,
        transform .25s ease,
        box-shadow .25s ease;
}

.single-product div.product .summary form.cart .single_add_to_cart_button:hover{
    background:#d92f79 !important;
    color:#fff !important;
    transform:translateY(-3px);
    box-shadow:0 18px 34px rgba(239,59,138,.28);
}

/* Meta */

.single-product div.product .summary .product_meta{
    margin-top:0;
    padding-top:22px;
    border-top:1px solid #eadbd4;

    color:#9a7a67;
    font-size:14px;
    line-height:1.8;
}

.single-product div.product .summary .product_meta > span{
    display:block;
}

.single-product div.product .summary .product_meta a{
    color:#ef3b8a;
    font-weight:600;
    text-decoration:none;
}

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

/* =====================================================
   PESTAÑAS
===================================================== */

.single-product div.product .woocommerce-tabs{
    grid-area:tabs;
    grid-column:1 / -1;
    width:100% !important;
    clear:both !important;
    margin-top:78px !important;
}

.single-product .woocommerce-tabs ul.tabs{
    display:flex;
    gap:8px;
    width:100%;
    margin:0 0 34px !important;
    padding:0 !important;
    border-bottom:1px solid #eadbd4;
}

.single-product .woocommerce-tabs ul.tabs::before,
.single-product .woocommerce-tabs ul.tabs::after{
    display:none !important;
}

.single-product .woocommerce-tabs ul.tabs li{
    margin:0 !important;
    padding:0 !important;
    border:none !important;
    background:transparent !important;
    border-radius:0 !important;
}

.single-product .woocommerce-tabs ul.tabs li::before,
.single-product .woocommerce-tabs ul.tabs li::after{
    display:none !important;
}

.single-product .woocommerce-tabs ul.tabs li a{
    display:block;
    padding:14px 22px;
    color:#9a7a67;
    font-size:14px;
    font-weight:700;
    text-decoration:none;
    border-bottom:2px solid transparent;
    transition:
        color .25s ease,
        border-color .25s ease;
}

.single-product .woocommerce-tabs ul.tabs li.active a,
.single-product .woocommerce-tabs ul.tabs li a:hover{
    color:#ef3b8a;
    border-bottom-color:#ef3b8a;
}

.single-product .woocommerce-Tabs-panel{
    width:100%;
    max-width:980px;
    margin:0 auto;
    color:#6f4a35;
    font-size:16px;
    line-height:1.8;
}

.single-product .woocommerce-Tabs-panel h2{
    margin:0 0 20px;
    font-family:Georgia,serif;
    font-size:34px;
    font-weight:500;
    color:#7a4a27;
}

.single-product .woocommerce-Tabs-panel h3{
    margin:30px 0 12px;
    font-family:Georgia,serif;
    font-size:24px;
    font-weight:500;
    color:#9a6530;
}

.single-product .woocommerce-Tabs-panel ul{
    padding-left:22px;
}

.single-product .woocommerce-Tabs-panel li{
    margin-bottom:7px;
}

/* =====================================================
   PRODUCTOS RELACIONADOS
===================================================== */

.single-product div.product .related.products,
.single-product div.product .upsells.products{
    grid-area:related;
    grid-column:1 / -1;
    width:100% !important;
    clear:both !important;
    margin-top:76px !important;
}

.single-product .related.products > h2,
.single-product .upsells.products > h2{
    margin:0 0 34px;
    font-family:Georgia,serif;
    font-size:36px;
    font-weight:500;
    text-align:center;
    color:#9a6530;
}

.single-product .related.products ul.products,
.single-product .upsells.products ul.products{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:28px;
    margin:0;
}

.single-product .related.products ul.products li.product,
.single-product .upsells.products ul.products li.product{
    width:auto !important;
    margin:0 !important;
    float:none !important;
}

/* =====================================================
   RESPONSIVE
===================================================== */

@media(max-width:1050px){

    .single-product .site-main{
        padding:34px 28px 80px;
    }

    .single-product div.product{
        grid-template-columns:minmax(420px,1.1fr) minmax(330px,.9fr);
        column-gap:42px;
    }

    .single-product div.product .summary{
        padding:32px 28px;
    }
}

@media(max-width:850px){

    .single-product div.product{
        display:block;
    }

    .single-product div.product .summary{
        margin-top:34px !important;
        padding:30px 26px;
    }

    .single-product div.product .woocommerce-tabs{
        margin-top:58px !important;
    }

    .single-product .related.products ul.products,
    .single-product .upsells.products ul.products{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:560px){

    .single-product .site-main{
        padding:26px 20px 70px;
    }

    .single-product div.product .summary{
        padding:26px 20px;
    }

    .single-product div.product .summary .product_title{
        font-size:40px;
    }

    .single-product div.product .summary p.price,
    .single-product div.product .summary span.price{
        font-size:25px;
    }

    .single-product div.product .summary form.cart{
        grid-template-columns:76px minmax(0,1fr);
        gap:10px;
    }

    .single-product div.product .summary form.cart .quantity{
        width:76px !important;
        min-width:76px !important;
    }

    .single-product .woocommerce-tabs ul.tabs{
        overflow-x:auto;
        white-space:nowrap;
    }

    .single-product .related.products ul.products,
    .single-product .upsells.products ul.products{
        grid-template-columns:1fr;
    }
}

/* =====================================================
   CORRECCIONES: LUPA, ZOOM Y BOTÓN
===================================================== */

/* La imagen debe ocultar lo que sobresalga durante el zoom */

.single-product .woocommerce-product-gallery__image{
    position:relative;
    overflow:hidden !important;
    cursor:zoom-in;
}

/* Preparar la imagen para el zoom controlado con el cursor */

.single-product .woocommerce-product-gallery__image img{
    transform-origin:center center;
    will-change:transform;
    transition:transform .18s ease;
}

/* Zoom activo */

.single-product .woocommerce-product-gallery__image.sb-zoom-active img{
    transform:scale(2.25);
    cursor:zoom-out;
}

/* Evitar el zoom anterior automático */

.single-product .woocommerce-product-gallery__image:hover img{
    transform:none;
}

.single-product .woocommerce-product-gallery__image.sb-zoom-active:hover img{
    transform:scale(2.25);
}

/* Botón de la lupa */

.single-product .woocommerce-product-gallery__trigger{
    position:absolute !important;
    top:18px !important;
    right:18px !important;

    width:48px !important;
    height:48px !important;
    min-width:48px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    padding:0 !important;
    margin:0 !important;

    border-radius:50% !important;
    background:#fff !important;
    box-shadow:0 10px 24px rgba(122,74,39,.16);
    z-index:20 !important;
}

/* Centrar correctamente el dibujo interno de la lupa */

.single-product .woocommerce-product-gallery__trigger::before{
    position:static !important;
    display:block !important;
    width:15px !important;
    height:15px !important;
    margin:0 !important;
    transform:none !important;
}

.single-product .woocommerce-product-gallery__trigger::after{
    position:absolute !important;
    top:29px !important;
    left:29px !important;
    margin:0 !important;
}

/* Formulario de compra */

.single-product div.product .summary form.cart{
    display:grid !important;
    grid-template-columns:86px minmax(0, 1fr) !important;
    width:100% !important;
    gap:14px !important;
}

/* Botón grande y completo */

.single-product div.product .summary form.cart
.single_add_to_cart_button{
    grid-column:2;
    justify-self:stretch !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:58px !important;

    margin:0 !important;
    padding:15px 22px !important;

    float:none !important;

    background:#ef3b8a !important;
    color:#fff !important;
    border:0 !important;
    border-radius:9px !important;

    white-space:nowrap;
    font-size:13px !important;
    font-weight:800 !important;
    text-transform:uppercase;
    letter-spacing:.45px;

    box-shadow:0 14px 28px rgba(239,59,138,.22);
}

/* Asegurar que WooCommerce no reduzca el botón */

.single-product div.product .summary form.cart button.button{
    width:100% !important;
    max-width:none !important;
}

/* Móvil */

@media(max-width:560px){

    .single-product div.product .summary form.cart{
        grid-template-columns:72px minmax(0,1fr) !important;
    }

    .single-product div.product .summary form.cart
    .single_add_to_cart_button{
        padding-left:12px !important;
        padding-right:12px !important;
        font-size:11px !important;
    }
}