/**
 * Rondônia Direto - ajuste responsivo do cabeçalho Foxiz + Elementor
 * Escopo: somente Header Template do Foxiz (.header-template)
 * Objetivos:
 * - reservar largura real para a logomarca;
 * - impedir que o menu invada a área da logo;
 * - reduzir apenas os espaçamentos em notebooks;
 * - antecipar o cabeçalho mobile quando a largura ficar crítica.
 */

/* Desktop: corrige a disputa de largura entre os widgets do Elementor. */
@media (min-width: 1025px) {
    .header-template .header-template-inner .elementor-widget-foxiz-logo {
        position: relative !important;
        z-index: 4 !important;
        flex: 0 0 clamp(160px, 14vw, 195px) !important;
        width: clamp(160px, 14vw, 195px) !important;
        min-width: clamp(160px, 14vw, 195px) !important;
        max-width: clamp(160px, 14vw, 195px) !important;
        overflow: visible;
    }

    .header-template .header-template-inner .elementor-widget-foxiz-logo .elementor-widget-container,
    .header-template .header-template-inner .elementor-widget-foxiz-logo .the-logo,
    .header-template .header-template-inner .elementor-widget-foxiz-logo .the-logo > a {
        display: flex;
        align-items: center;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .header-template .header-template-inner .elementor-widget-foxiz-logo .the-logo img {
        display: block;
        width: auto !important;
        height: auto !important;
        max-width: 100% !important;
        object-fit: contain !important;
        flex: 0 0 auto;
    }

    .header-template .header-template-inner .elementor-widget-foxiz-navigation {
        position: relative !important;
        z-index: 2 !important;
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .header-template .header-template-inner .elementor-widget-foxiz-navigation .elementor-widget-container,
    .header-template .header-template-inner .elementor-widget-foxiz-navigation .main-menu-wrap {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .header-template .header-template-inner .elementor-widget-foxiz-navigation .main-menu {
        display: flex !important;
        align-items: center;
        flex-flow: row nowrap !important;
        flex-wrap: nowrap !important;
        min-width: 0;
        max-width: 100%;
    }

    .header-template .header-template-inner .elementor-widget-foxiz-navigation .main-menu > li {
        flex: 0 0 auto;
    }

    .header-template .header-template-inner .elementor-widget-foxiz-search-icon,
    .header-template .header-template-inner .elementor-widget-foxiz-dark-mode-toggle,
    .header-template .header-template-inner .elementor-widget-foxiz-font-resizer,
    .header-template .header-template-inner .elementor-widget-foxiz-login-icon,
    .header-template .header-template-inner .elementor-widget-foxiz-social-list {
        flex: 0 0 auto !important;
        min-width: max-content;
    }
}

/* Notebook grande / 1366 px: mantém o menu completo, apenas economiza espaço lateral. */
@media (min-width: 1281px) and (max-width: 1440px) {
    .header-template .header-template-inner .elementor-widget-foxiz-navigation {
        --menu-item-spacing: 8px !important;
    }
}

/* Notebook médio: reduz um pouco mais o espaçamento, sem diminuir a fonte. */
@media (min-width: 1161px) and (max-width: 1280px) {
    .header-template .header-template-inner .elementor-widget-foxiz-logo {
        flex-basis: 165px !important;
        width: 165px !important;
        min-width: 165px !important;
        max-width: 165px !important;
    }

    .header-template .header-template-inner .elementor-widget-foxiz-navigation {
        --menu-item-spacing: 6px !important;
    }
}

/* Faixa crítica: usa o cabeçalho mobile nativo do Foxiz antes de ocorrer colisão. */
@media (min-width: 1025px) and (max-width: 1160px) {
    .header-template .header-template-inner {
        display: none !important;
    }

    .header-template .header-mobile {
        z-index: 1000;
        display: flex !important;
        flex-flow: column nowrap;
        max-height: 100vh;
    }
}
