/* ==========================================================
   Mommy Crafts Frontend v3.47.0
   Capa final móvil limpia
   ----------------------------------------------------------
   Objetivo:
   - Centralizar los ajustes móviles que antes estaban duplicados.
   - Mantener escritorio intacto.
   - Corregir galería móvil de ficha y navbar móvil uniforme.
   ========================================================== */

:root {
    --mc-mobile-action-size: 39px;
    --mc-mobile-action-color: #65445A;
    --mc-mobile-action-bg: #FFFFFF;
    --mc-mobile-action-border: #eadfe2;
    --mc-mobile-page-bg: var(--color-background, #fff9fd);
}

.product-mobile-brand {
    display: none;
}

/* Carruseles sin caja/fondo global: tarjetas modulares sobre el fondo de página */
.carousel-wrapper,
.carousel-container,
.carousel-track,
.category-rail-shell,
.categories-grid,
.section-products,
.featured-section,
.trending-section,
.best-sellers-section,
.new-section,
.all-products-section,
.related-products,
.related-products .container,
.related-products .container-products,
.products-carousel,
.product-carousel,
.home-carousel {
    background: var(--mc-mobile-page-bg) !important;
    background-color: var(--mc-mobile-page-bg) !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
}

.carousel-wrapper::before,
.carousel-wrapper::after,
.carousel-container::before,
.carousel-container::after,
.carousel-track::before,
.carousel-track::after,
.category-rail-shell::before,
.category-rail-shell::after,
.categories-grid::before,
.categories-grid::after,
.related-products::before,
.related-products::after,
.related-products .container::before,
.related-products .container::after,
.related-products .container-products::before,
.related-products .container-products::after {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
}

.carousel-container,
.categories-grid,
.related-products .container-products {
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    overscroll-behavior-inline: contain;
}

.carousel-container.is-dragging-scroll,
.categories-grid.is-dragging-scroll,
.related-products .container-products.is-dragging-scroll {
    scroll-behavior: auto !important;
    scroll-snap-type: none !important;
}

@media (max-width: 820px) {
    /* Navbar móvil uniforme: menú, búsqueda, cuenta, comparar/favoritos y carrito = 39px */
    .site-header .mobile-menu-button,
    .site-header .navbar-actions.mc-header-actions > button,
    .site-header .navbar-actions.mc-header-actions > a,
    .site-header .navbar-actions.mc-header-actions > details,
    .site-header .navbar-actions.mc-header-actions .mc-header-icon,
    .site-header .navbar-actions.mc-header-actions .icon-btn,
    .site-header .navbar-actions.mc-header-actions .account-button,
    .site-header .navbar-actions.mc-header-actions .account-button.account-session-chip,
    .site-header .navbar-actions.mc-header-actions .compare-button,
    .site-header .navbar-actions.mc-header-actions .wishlist-button,
    .site-header .navbar-actions.mc-header-actions .cart-button,
    .site-header .navbar-actions > button,
    .site-header .navbar-actions > a,
    .site-header .navbar-actions > details,
    .site-header .navbar-actions .mc-header-icon,
    .site-header .navbar-actions .icon-btn,
    .site-header .navbar-actions .account-button,
    .site-header .navbar-actions .account-button.account-session-chip,
    .site-header .navbar-actions .compare-button,
    .site-header .navbar-actions .wishlist-button,
    .site-header .navbar-actions .cart-button {
        width: var(--mc-mobile-action-size) !important;
        min-width: var(--mc-mobile-action-size) !important;
        max-width: var(--mc-mobile-action-size) !important;
        height: var(--mc-mobile-action-size) !important;
        min-height: var(--mc-mobile-action-size) !important;
        max-height: var(--mc-mobile-action-size) !important;
        flex: 0 0 var(--mc-mobile-action-size) !important;
        aspect-ratio: 1 / 1 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 1px solid var(--mc-mobile-action-border) !important;
        border-radius: 50% !important;
        box-sizing: border-box !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: visible !important;
        line-height: 1 !important;
        background: var(--mc-mobile-action-bg) !important;
        color: var(--mc-mobile-action-color) !important;
        box-shadow: none !important;
        filter: none !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: none !important;
        translate: none !important;
    }

    .site-header .navbar-actions.mc-header-actions,
    .site-header .navbar-actions {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: .55rem !important;
        pointer-events: auto !important;
        opacity: 1 !important;
        filter: none !important;
    }

    .site-header .navbar-actions.mc-header-actions .account-session-copy,
    .site-header .navbar-actions .account-session-copy {
        display: none !important;
    }

    .site-header .navbar-actions.mc-header-actions .account-session-icon,
    .site-header .navbar-actions .account-session-icon {
        width: 100% !important;
        min-width: 0 !important;
        height: 100% !important;
        min-height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        border-radius: 50% !important;
        background: transparent !important;
        box-shadow: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .site-header .navbar-actions summary.account-session-chip {
        list-style: none !important;
    }

    .site-header .navbar-actions summary.account-session-chip::-webkit-details-marker {
        display: none !important;
    }

    .site-header .mobile-menu-button i,
    .site-header .navbar-actions.mc-header-actions i,
    .site-header .navbar-actions i {
        font-size: 1.67rem !important;
        line-height: 1 !important;
    }

    .site-header .navbar-actions .badge,
    .site-header .navbar-actions.mc-header-actions .badge,
    .site-header .navbar-actions .mc-compare-count,
    .site-header .navbar-actions.mc-header-actions .mc-compare-count {
        top: -.45rem !important;
        right: -.45rem !important;
        min-width: 1.8rem !important;
        height: 1.8rem !important;
        padding: 0 .35rem !important;
        font-size: 1.05rem !important;
    }

    /* Menú móvil estable y clickeable. Se mantiene para no perder avances anteriores. */
    body.mobile-menu-open {
        overflow: hidden !important;
    }

    body.mobile-menu-open::before {
        position: fixed !important;
        inset: 0 !important;
        z-index: 1790 !important;
        background: rgba(32, 25, 30, .46) !important;
        content: "" !important;
    }

    .site-header .container-navbar,
    .site-header .navbar {
        position: relative !important;
        z-index: 1810 !important;
    }

    .site-header .mobile-menu-button {
        position: relative !important;
        z-index: 1860 !important;
    }

    .menu {
        z-index: 1850 !important;
        flex-direction: column !important;
        align-items: stretch !important;
        pointer-events: none !important;
    }

    .menu.is-open {
        display: flex !important;
        flex-direction: column !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateX(0) !important;
    }

    .menu.is-open,
    .menu.is-open * {
        pointer-events: auto !important;
        touch-action: manipulation;
    }

    .menu > li {
        display: block !important;
        width: 100% !important;
        flex: 0 0 auto !important;
    }

    .menu > li > a,
    .category-dropdown-link,
    .season-mobile-submenu-link {
        cursor: pointer !important;
        user-select: none;
    }

    .menu .has-dropdown > .dropdown {
        position: static !important;
        display: none !important;
        width: 100% !important;
        max-height: none !important;
        margin: .35rem 0 1rem !important;
        padding: .75rem !important;
        border: 1px solid rgba(146, 75, 103, .12) !important;
        border-radius: 1.5rem !important;
        background: var(--mc-mobile-page-bg) !important;
        box-shadow: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        pointer-events: auto !important;
    }

    .menu .has-dropdown.is-mobile-open > .dropdown,
    .season-mobile-submenu:not([hidden]) {
        display: grid !important;
        gap: .55rem !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .season-mobile-submenu:not([hidden]) {
        margin: .35rem 0 .7rem !important;
        padding: .7rem !important;
        border: 1px solid rgba(146, 75, 103, .12) !important;
        border-radius: 1.35rem !important;
        background: #fff !important;
    }
}

@media (max-width: 700px) {
    body[data-page="product"] .promo-banner {
        display: block !important;
    }

    body[data-page="product"] .container-hero {
        display: none !important;
    }

    body[data-page="product"] .container-navbar {
        position: sticky !important;
        top: 0 !important;
        z-index: 1300 !important;
        border-bottom: 1px solid rgba(146, 75, 103, .14) !important;
        background: rgba(255, 249, 253, .98) !important;
        box-shadow: 0 .25rem 1.2rem rgba(83, 49, 64, .045) !important;
        backdrop-filter: blur(12px);
    }

    body[data-page="product"] .navbar {
        display: grid !important;
        grid-template-columns: 39px minmax(7rem, 1fr) auto !important;
        align-items: center !important;
        gap: .55rem !important;
        min-height: 5.4rem !important;
        padding: .62rem 0 !important;
    }

    body[data-page="product"] .mobile-menu-button {
        grid-column: 1 !important;
        grid-row: 1 !important;
        z-index: 1304 !important;
    }

    body[data-page="product"] .product-mobile-brand {
        grid-column: 2 !important;
        grid-row: 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 0 !important;
        padding-inline: .15rem !important;
    }

    body[data-page="product"] .product-mobile-brand img {
        width: min(14.2rem, 34vw) !important;
        max-height: 3.1rem !important;
        object-fit: contain !important;
    }

    body[data-page="product"] .navbar > .search-shell {
        display: none !important;
    }

    body[data-page="product"] .navbar-actions,
    body[data-page="product"] .navbar-actions.mc-header-actions {
        grid-column: 3 !important;
        grid-row: 1 !important;
        position: relative !important;
        inset: auto !important;
        justify-self: end !important;
        margin: 0 !important;
        width: auto !important;
        transform: none !important;
        translate: none !important;
        z-index: 1304 !important;
    }

    /* Ajuste validado manualmente por el usuario para cerrar el espacio superior de la galería móvil. */
    body[data-page="product"] .product-detail-grid,
    body[data-page="product"] .product-detail-images,
    body[data-page="product"] .detail-main-image-container {
        margin-top: -25px !important;
    }

    body[data-page="product"] .product-page,
    body[data-page="product"] .product-page > .container {
        padding-top: 0 !important;
    }

    body[data-page="product"] .product-detail-images {
        padding-top: 0 !important;
        background: transparent !important;
        min-height: 0 !important;
    }

    body[data-page="product"] .detail-main-image-container {
        display: grid !important;
        place-items: center !important;
        background: #fff !important;
    }
}

/* ==========================================================
   Mommy Crafts Frontend v3.47.0
   Capa final de cierre: acciones móviles clickeables y tarjetas completas
   ----------------------------------------------------------
   Mantiene escritorio intacto. Esta capa gana sobre reglas antiguas.
   ========================================================== */
@media (max-width: 820px) {
    html, body {
        overflow-x: hidden !important;
    }

    .site-header,
    .site-header .container-navbar,
    .site-header .navbar {
        isolation: isolate !important;
    }

    .site-header .navbar {
        position: relative !important;
    }

    .site-header .mobile-menu-button,
    .site-header .navbar-actions .mc-header-icon,
    .site-header .navbar-actions .icon-btn,
    .site-header .navbar-actions .account-button.account-session-chip,
    .site-header .navbar-actions .compare-button,
    .site-header .navbar-actions .wishlist-button,
    .site-header .navbar-actions .cart-button {
        width: 39px !important;
        min-width: 39px !important;
        max-width: 39px !important;
        height: 39px !important;
        min-height: 39px !important;
        max-height: 39px !important;
        flex: 0 0 39px !important;
        aspect-ratio: 1 / 1 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 1px solid var(--mc-mobile-action-border, #eadfe2) !important;
        border-radius: 50% !important;
        background: var(--mc-mobile-action-bg, #FFFFFF) !important;
        color: var(--mc-mobile-action-color, #65445A) !important;
        box-shadow: none !important;
        filter: none !important;
        opacity: 1 !important;
        box-sizing: border-box !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        line-height: 1 !important;
        overflow: visible !important;
        pointer-events: auto !important;
        touch-action: manipulation !important;
        cursor: pointer !important;
        transform: none !important;
        translate: none !important;
        z-index: 12 !important;
    }

    .site-header .navbar-actions,
    .site-header .navbar-actions.mc-header-actions {
        position: relative !important;
        inset: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: .55rem !important;
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        filter: none !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: none !important;
        translate: none !important;
        z-index: 15 !important;
    }

    .site-header .navbar-actions > details,
    .site-header .navbar-actions.mc-header-actions > details,
    .site-header .navbar-actions .customer-account-menu {
        position: relative !important;
        width: 39px !important;
        min-width: 39px !important;
        max-width: 39px !important;
        height: 39px !important;
        min-height: 39px !important;
        max-height: 39px !important;
        flex: 0 0 39px !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: transparent !important;
        box-shadow: none !important;
        overflow: visible !important;
        pointer-events: auto !important;
        touch-action: manipulation !important;
        transform: none !important;
        translate: none !important;
        z-index: 16 !important;
    }

    .site-header .navbar-actions summary.account-session-chip,
    .site-header .navbar-actions.mc-header-actions summary.account-session-chip {
        list-style: none !important;
        width: 39px !important;
        min-width: 39px !important;
        max-width: 39px !important;
        height: 39px !important;
        min-height: 39px !important;
        max-height: 39px !important;
        flex: 0 0 39px !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 1px solid var(--mc-mobile-action-border, #eadfe2) !important;
        border-radius: 50% !important;
        background: var(--mc-mobile-action-bg, #FFFFFF) !important;
        color: var(--mc-mobile-action-color, #65445A) !important;
        box-shadow: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        pointer-events: auto !important;
        cursor: pointer !important;
    }

    .site-header .navbar-actions summary.account-session-chip::-webkit-details-marker,
    .site-header .navbar-actions.mc-header-actions summary.account-session-chip::-webkit-details-marker {
        display: none !important;
    }

    .site-header .navbar-actions .account-session-copy,
    .site-header .navbar-actions.mc-header-actions .account-session-copy {
        display: none !important;
    }

    .site-header .navbar-actions .account-session-icon,
    .site-header .navbar-actions.mc-header-actions .account-session-icon {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: transparent !important;
        box-shadow: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        pointer-events: none !important;
    }

    .site-header .mobile-menu-button i,
    .site-header .navbar-actions i,
    .site-header .navbar-actions.mc-header-actions i {
        font-size: 16.7px !important;
        line-height: 1 !important;
        pointer-events: none !important;
    }

    .site-header .navbar-actions .badge,
    .site-header .navbar-actions.mc-header-actions .badge,
    .site-header .navbar-actions .mc-compare-count,
    .site-header .navbar-actions.mc-header-actions .mc-compare-count {
        position: absolute !important;
        top: -7px !important;
        right: -7px !important;
        z-index: 22 !important;
        pointer-events: none !important;
    }

    .site-header .menu,
    .site-header .menu.is-open {
        z-index: 1900 !important;
    }
}

@media (max-width: 700px) {
    body[data-page="product"] .product-detail-grid,
    body[data-page="product"] .product-detail-images,
    body[data-page="product"] .detail-main-image-container {
        margin-top: -25px !important;
    }

    body[data-page="product"] .product-detail-grid,
    body[data-page="product"] .product-detail-images,
    body[data-page="product"] .product-detail-info,
    body[data-page="product"] .product-purchase-panel,
    body[data-page="product"] .product-heading-block,
    body[data-page="product"] .product-price-card,
    body[data-page="product"] .product-key-facts,
    body[data-page="product"] .product-color-selector,
    body[data-page="product"] .product-size-selector,
    body[data-page="product"] .light-customization-panel,
    body[data-page="product"] .product-delivery-info,
    body[data-page="product"] .product-confidence {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        justify-self: stretch !important;
        align-self: stretch !important;
    }

    body[data-page="product"] .product-purchase-panel {
        display: block !important;
    }

    body[data-page="product"] .product-price-card {
        display: block !important;
        padding-inline: 0 !important;
        border-right: 0 !important;
    }

    body[data-page="product"] .product-key-facts {
        margin-inline: 0 !important;
    }
}
