/*
 * DECORARTE — HOTFIX MOBILE SEM OVERFLOW HORIZONTAL
 * Objetivo:
 * - impedir que a PÁGINA inteira deslize para a direita e mostre faixa branca;
 * - preservar carrosséis internos que precisam rolar horizontalmente;
 * - corrigir grids, cards, ações e configurador que podem forçar largura.
 */

/* =========================================================
   1. LIMITE DO DOCUMENTO
   ========================================================= */
html{
    width:100%;
    max-width:100%;
    overflow-x:hidden !important;
    overflow-x:clip !important;
}

body{
    width:100%;
    max-width:100%;
    min-width:0;
    margin-left:0;
    margin-right:0;
    overflow-x:hidden !important;
    overflow-x:clip !important;
}

*,*::before,*::after{
    box-sizing:border-box;
}

img,picture,video,iframe,svg,canvas{
    max-width:100%;
}

/* =========================================================
   2. CONTAINERS GERAIS
   Não altera a largura visual normal; apenas proíbe estouro.
   ========================================================= */
main,
header,
footer,
section,
.fx2-header,
.fx2-adbar,
.fx2-contact,
.fx2-main,
.fx2-footer,
.fx2-newsletter,
.fx2-shell,
.da-home-v2,
.da-home-section,
.da-category-page,
.da-product-v2,
.da-shell,
.da-shell-wide{
    min-width:0;
    max-width:100%;
}

.fx2-shell,
.da-shell,
.da-shell-wide{
    box-sizing:border-box;
}

/* Filhos de grid/flex precisam poder encolher. */
.da-product-grid > *,
.da-category-grid > *,
.da-home-product-grid > *,
.da-home-category-grid > *,
.da-home-banner-grid > *,
.da-product-v2-layout > *,
.fx2-head-main > *,
.fx2-footer-main > *,
.fx2-footer-meta > *{
    min-width:0 !important;
    max-width:100%;
}

/* =========================================================
   3. HOME / CATEGORIA — CARDS E BOTÕES
   ========================================================= */
.da-product-grid,
.da-category-grid,
.da-home-product-grid,
.da-home-category-grid,
.da-home-carousel-wrap,
.da-product-card,
.da-home-product-card,
.da-product-image,
.da-product-actions{
    min-width:0 !important;
    max-width:100%;
}

.da-product-card,
.da-home-product-card{
    width:100%;
}

.da-product-card h3,
.da-home-product-card h3,
.da-product-card a,
.da-home-product-card a{
    overflow-wrap:anywhere;
}

/* A área do print: VER MAIS + botão pequeno não pode passar do card. */
.da-product-actions{
    width:100% !important;
    grid-template-columns:minmax(0,1fr) minmax(34px,42px) !important;
    gap:5px !important;
}

.da-product-actions > a{
    min-width:0 !important;
    max-width:100% !important;
    width:auto !important;
    box-sizing:border-box !important;
}

.da-product-actions > .da-mini-cart{
    width:100% !important;
    min-width:0 !important;
    max-width:42px !important;
}

/* =========================================================
   4. PRODUTO — CONFIGURADOR / BUYBOX
   ========================================================= */
.da-product-v2,
.da-product-v2 .da-product-v2-layout,
.da-product-v2 .da-v2-thumbs,
.da-product-v2 .da-v2-main,
.da-product-v2 .da-v2-buybox,
.da-product-v2 .da-config-block,
.da-product-v2 .da-config-options,
.da-product-v2 .da-config-choice,
.da-product-v2 .da-v2-buy-row,
.da-product-v2 form{
    min-width:0 !important;
    max-width:100% !important;
}

.da-product-v2 .da-config-options{
    box-sizing:border-box !important;
}

.da-product-v2 .da-config-choice{
    width:auto;
}

.da-product-v2 .da-addon-buttons{
    width:100%;
    max-width:100% !important;
    min-width:0 !important;
}

.da-product-v2 .da-addon-choice{
    min-width:0 !important;
    max-width:100% !important;
}

/* =========================================================
   5. RODAPÉ / NEWSLETTER
   ========================================================= */
.fx2-news-form,
.fx2-footer-main,
.fx2-footer-meta,
.da-newsletter,
.da-newsletter-inner,
.da-newsletter-form,
.da-footer,
.da-footer-grid,
.da-footer-icons-grid{
    min-width:0 !important;
    max-width:100%;
}

/* =========================================================
   6. MOBILE
   ========================================================= */
@media (max-width:800px){

    /* Não deixa padding/borda fazer o container ultrapassar o viewport. */
    .fx2-shell{
        width:calc(100% - 24px) !important;
        max-width:calc(100% - 24px) !important;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    .da-shell,
    .da-shell-wide{
        min-width:0 !important;
        max-width:100% !important;
    }

    /* Grids móveis sempre respeitam o espaço disponível. */
    .da-product-grid,
    .da-category-grid,
    .da-home-product-grid,
    .da-home-category-grid{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
    }

    /* Área dos botões dos cards, especialmente em 2 colunas. */
    .da-product-actions{
        grid-template-columns:minmax(0,1fr) 38px !important;
        gap:4px !important;
    }

    .da-product-actions > a{
        height:38px !important;
        min-height:38px !important;
        padding-left:4px !important;
        padding-right:4px !important;
        font-size:10px !important;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    .da-product-actions > .da-mini-cart{
        width:38px !important;
        min-width:38px !important;
        max-width:38px !important;
        padding:0 !important;
    }

    /* Configurador do produto */
    .da-product-v2 .da-product-v2-layout{
        width:100% !important;
        max-width:100% !important;
    }

    .da-product-v2 .da-v2-buybox{
        width:100% !important;
        min-width:0 !important;
        max-width:100% !important;
    }

    .da-product-v2 .da-config-options{
        width:100% !important;
        min-width:0 !important;
        max-width:100% !important;
    }

    .da-product-v2 .da-config-choice{
        min-width:0 !important;
        max-width:100% !important;
    }

    .da-product-v2 .da-v2-buy-row{
        width:100% !important;
        min-width:0 !important;
        max-width:100% !important;
    }

    /* Formulários do rodapé também precisam poder encolher. */
    .fx2-news-form input,
    .fx2-news-form button,
    .da-newsletter-form input,
    .da-newsletter-form button{
        min-width:0 !important;
        max-width:100% !important;
    }
}

/* =========================================================
   7. CARROSSÉIS INTERNOS
   Estes CONTINUAM podendo rolar; só o body não rola.
   ========================================================= */
.da-home-hero-track,
.da-home-carousel-wrap.is-carousel .da-home-product-grid,
.da-home-carousel-wrap.is-carousel .da-home-category-grid,
.da-home-testimonial-track,
.da-benefits-carousel-wrap .da-home-benefits-grid,
.da-v2-thumbs{
    overscroll-behavior-x:contain;
}


/* =========================================================
   8. ALINHAMENTO DOS CARDS DE PRODUTO
   Mantém preços e botões na mesma altura mesmo quando
   os títulos têm comprimentos diferentes.
   ========================================================= */

.da-product-grid{
    align-items:stretch !important;
}

.da-product-card,
.da-home-product-card{
    display:flex !important;
    flex-direction:column !important;
    height:100% !important;
}

/* Reserva exatamente duas linhas para o nome do produto. */
.da-product-card h3,
.da-home-product-card h3{
    line-height:1.22 !important;
    min-height:2.44em !important;
    height:2.44em !important;
    max-height:2.44em !important;
    margin:12px 5px 7px !important;
    overflow:hidden !important;

    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
}

/* Evita o margin negativo antigo deslocar preços de forma desigual. */
.da-home-card-old{
    min-height:16px !important;
    margin:0 0 3px !important;
    line-height:16px !important;
}

.da-home-card-price{
    min-height:23px !important;
    line-height:23px !important;
    margin:0 0 10px !important;
}

/* O botão sempre fica no final do card. */
.da-product-actions{
    margin-top:auto !important;
}

/* Mobile: mantém tudo compacto e alinhado. */
@media (max-width:800px){
    .da-product-card h3,
    .da-home-product-card h3{
        font-size:13px !important;
        line-height:1.18 !important;
        min-height:2.36em !important;
        height:2.36em !important;
        max-height:2.36em !important;
        margin:10px 4px 6px !important;
    }

    .da-home-card-old{
        min-height:15px !important;
        line-height:15px !important;
        font-size:12px !important;
    }

    .da-home-card-price{
        min-height:22px !important;
        line-height:22px !important;
        margin-bottom:9px !important;
    }
}
