/*
Theme Name: Veen Child — Carrossel SEO + Dark Mode
Theme URI: https://estudiopatagon.com/projects/veen-for-wordpress/
Author: EstudioPatagon / Personalização
Description: Tema filho do Veen com carrossel SEO, Dark Mode clássico e otimizações de carregamento com compatibilidade reforçada.
Template: veen
Version: 2.0.1
Text Domain: veen-child
*/

/*
 * Os estilos do carrossel ficam em assets/css/hub-carousel.css.
 * O Dark Mode fica em assets/css/dark-mode.css; o controlador é inline para máxima compatibilidade.
 * Use este arquivo apenas para outras personalizações gerais do tema filho.
 */

/*
 * Remove o ponto decorativo que o Veen adiciona aos títulos com .bordered.
 * Mantém tipografia, espaçamento e hierarquia dos títulos inalterados.
 */
.title.bordered::after,
.title.bordered:after {
    content: none !important;
    display: none !important;
}


/*
 * Contenção de overflow horizontal.
 * Evita o "site andando para o lado" em telas pequenas sem bloquear o
 * scroll horizontal interno do carrossel, que possui seu próprio viewport.
 */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    overscroll-behavior-x: none;
}

@supports (overflow: clip) {
    html,
    body {
        overflow-x: clip;
    }
}

#wrapper,
.vch-carousel-section,
.vch-carousel-section .grid-container {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

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


/*
 * v1.9.0 — correção definitiva de overflow horizontal no mobile.
 * O Veen desloca o #wrapper em 300px ao abrir o menu e o carrossel pode ter
 * muitos pontos de paginação. Ambos podem aumentar o scrollWidth da página.
 * As regras abaixo mantêm o documento preso ao viewport sem bloquear o swipe
 * horizontal dentro do carrossel.
 */
@media screen and (max-width: 767px) {
    html,
    body {
        width: 100% !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
        overscroll-behavior-x: none;
    }

    @supports (overflow: clip) {
        html,
        body {
            overflow-x: clip !important;
        }
    }

    #wrapper {
        position: relative;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
        box-sizing: border-box;
    }

    @supports (overflow: clip) {
        #wrapper {
            overflow-x: clip !important;
        }
    }

    /* O menu continua abrindo por cima do conteúdo, sem empurrar a página 300px. */
    body.menu-open {
        overflow: hidden !important;
    }

    body.menu-open #wrapper {
        -webkit-transform: none !important;
        -ms-transform: none !important;
        transform: none !important;
    }

    nav.mobile.main-nav {
        width: min(300px, 86vw) !important;
        max-width: 86vw !important;
        -webkit-transform: translateX(-105%) !important;
        -ms-transform: translateX(-105%) !important;
        transform: translateX(-105%) !important;
    }

    body.menu-open nav.mobile.main-nav {
        -webkit-transform: translateX(0) !important;
        -ms-transform: translateX(0) !important;
        transform: translateX(0) !important;
    }

    .menu-overlay {
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
        max-width: 100vw !important;
    }

    .grid-container,
    [class^="grid"],
    [class*=" grid"] {
        box-sizing: border-box;
        max-width: 100%;
        min-width: 0;
    }

    #single,
    #page,
    #archives,
    #sidebar,
    .content,
    .left-content,
    .main-article,
    div.text,
    .widget {
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    div.text,
    .widget,
    .vch-card__title {
        overflow-wrap: anywhere;
    }

    div.text table,
    div.text pre,
    div.text code[class*="language-"],
    div.text pre[class*="language-"] {
        max-width: 100%;
    }
}