/* Força a expansão total da descrição do produto no mobile */
@media only screen and (max-width: 767px) {
    /* Libera as margens do container geral da página de produto */
    body.pagina-produto .conteiner {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
    }

    /* Mantém respiro apenas no bloco superior (foto e botão comprar) */
    body.pagina-produto .produto > .row-fluid:first-child {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    /* Expande a área de abas e o corpo da descrição de ponta a ponta */
    body.pagina-produto .abas-conteudo,
    body.pagina-produto .tab-content,
    body.pagina-produto .tab-pane,
    body.pagina-produto #descricao {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(-50vw + 50%) !important;
        margin-right: calc(-50vw + 50%) !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Faz com que imagens, tabelas e vídeos internos ocupem exatamente a largura da tela */
    body.pagina-produto #descricao img,
    body.pagina-produto #descricao table,
    body.pagina-produto #descricao iframe,
    body.pagina-produto #descricao div {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Dá um respiro interno de 15px apenas nos textos para não colarem nas bordas do celular */
    body.pagina-produto #descricao p,
    body.pagina-produto #descricao h1,
    body.pagina-produto #descricao h2,
    body.pagina-produto #descricao h3,
    body.pagina-produto #descricao ul,
    body.pagina-produto #descricao ol {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}