/* 
 * MENU FIXO PARA PRODUÇÃO - Atlantida DMC
 * Versão 3.0 - Posicionamento absoluto e forçado do botão hambúrguer
 */

@media (max-width: 991px) {
    /* Reset completo do header 
    header * {
        box-sizing: border-box !important;
    }*/
    
    /* Remover completamente a linha branca do header 
    header[style] {
        border: none !important;
        border-bottom: none !important;
        border-top: none !important;
        box-shadow: none !important;
        background-color: transparent !important;
    }*/
    
    /* Criar um novo fundo branco com z-index maior */
    body::before {
        content: '' !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 90px !important;
        background-color: white !important;
        z-index: 998 !important;
        box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important;
    }
    
    /* Container principal 
    header .container {
      /*  position: relative !important;
        width: 100% !important;
        padding: 10px !important;
        display: block !important;
        height: 70px !important;
    }
    
    /* Ajuste para conteúdo principal começar após o botão Informe-se (apenas em dispositivos móveis) */
    @media (max-width: 991px) {
        header + div,
        header + section,
        header + main,
        header + article,
        header + .hero,
        header + .banner,
        header + .slider {
            margin-top: 50px !important; /* Espaço para o botão Informe-se */
        }
    }
    
    /* LOGO - centralizado entre menu hamburger e seletor de idioma */
    header .logo,
    .logo {
        position: absolute !important;
        left: 50% !important;
        top: -5px !important;
        transform: translateX(-50%) !important;
        margin: 0 !important;
        padding: 0 !important;
        max-width: 150px !important;
        z-index: 100 !important;
    }
    
   /* header .logo img,
    .logo img {
        max-height: 50px !important;
        width: auto !important;
        display: block !important;
    }
    
    /* BOTÃO HAMBÚRGUER - posicionado ABSOLUTAMENTE à esquerda */
    header .mobile-menu-toggle,
    header #mobile-menu-toggle,
    .mobile-menu-toggle,
    #mobile-menu-toggle {
        position: absolute !important;
        left: 10px !important;
        top: 15px !important;
        width: 40px !important;
        height: 40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        z-index: 9999 !important;
        visibility: visible !important;
        opacity: 1 !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
        cursor: pointer !important;
        font-family: 'General Sans', sans-serif !important;
    }
    
    /* Garantir que o ícone do hambúrguer seja visível 
    header .mobile-menu-toggle i,
    header #mobile-menu-toggle i,
    .mobile-menu-toggle i,
    #mobile-menu-toggle i {
        font-size: 25px !important;
        color: #333 !important;
        display: inline-block !important;
    }
    
    /* Botão 'Informe-se agora' 
    header .btn-informe-se,
    header #btn-informe-se,
    .btn-informe-se,
    #btn-informe-se {
        /* Estilo base que se aplica a todas as telas 
        white-space: nowrap !important;
        z-index: 100 !important;
        font-size: 14px !important;
        box-sizing: border-box !important;
    }
    
    /* REPOSICIONADO PARA FICAR ABAIXO DO LOGOTIPO em dispositivos móveis */
    @media (max-width: 991px) {
        header .btn-informe-se,
        header #btn-informe-se,
        .btn-informe-se,
        #btn-informe-se {
            /* Posicionamento abaixo do logotipo */
            position: fixed !important;
            display: block !important;
            width: 100% !important;
            left: 0 !important;
            right: 0px !important;
            top: 90px !important; /* Mais abaixo para ficar após o logotipo */
            margin: 0 auto !important;
            padding: 10px 20px !important;
       /*     text-align: center !important;*/
            max-width: 250px !important; /* Limitar a largura */
            left: 50% !important;
            transform: translateX(-50%) !important; /* Centralização perfeita */
            background-color: #D71921 !important; /* Cor vermelha da marca */
            color: white !important;
            font-weight: bold !important;
            font-size: 14px !important;
            z-index: 9000 !important; /* Alto, mas abaixo do z-index do seletor de idiomas */
            box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important;
            font-family: 'General Sans', sans-serif !important;
        }
    }
    
    /* Mantém o estilo original em telas maiores */
    @media (min-width: 992px) {
        header .btn-informe-se,
        header #btn-informe-se,
        .btn-informe-se,
        #btn-informe-se {
            position: absolute !important;
            right: 180px !important;
            left: -300px !important;
            top: 10px !important;
            padding: 6px 10px !important;
        }
    }
    
    /* Seletor de idiomas - posicionado à direita para equilibrar com o menu hamburguer 
    header .language-selector,
    header #language-selector,
    .language-selector,
    #language-selector {
        position: absolute !important;
        right: 10px !important;
        top: 15px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 5px 10px !important;
        min-width: 30px !important;
        min-height: 30px !important;
        background-color: #fff !important; /* Fundo branco 
        border-radius: 4px !important; /* Cantos arredondados 
        pointer-events: auto !important; /* Garantir que os eventos de clique funcionem 
        z-index: 9999 !important; /* Garantir que fique visível 
        color: #000 !important; /* Texto em preto */
        font-family: 'General Sans', sans-serif !important;
    }
    
    header .language-selector a,
    header #language-selector a,
    .language-selector a,
    #language-selector a {
        color: #333 !important; /* Texto PT em preto */
        font-weight: bold !important;
    }
    
    /* Aumentando a área clicável para o botão de idiomas */
    header .language-selector a,
    header #language-selector a,
    .language-selector a,
    #language-selector a,
    #lang-select-btn {
        display: block !important;
        padding: 10px !important;
        min-width: 44px !important;
        min-height: 44px !important;
    }
    
    /* Para aumentar a área clicável das bandeiras */
    .language-selector img,
    #language-selector img {
        padding: 5px !important;
    }
    
    /* Garantindo que o dropdown fique visível quando exibido */
    #lang-dropdown,
    .lang-dropdown {
        position: absolute !important;
        right: 0 !important;
        top: 100% !important;
        z-index: 99999 !important; /* z-index aumentado para corresponder ao seletor */
        pointer-events: auto !important; /* Garantir que os eventos de clique funcionem */
    }
    
    /* Layout de pacotes em grade 2x2 para telas pequenas */
    @media (max-width: 767px) {
        /* Container principal dos pacotes */
        .services-grid.pacotes-container {
            display: grid !important;
            grid-template-columns: 1fr 1fr !important; /* 2 colunas em telas pequenas */
            gap: 40px 20px !important; /* Aumento do espaçamento entre cards */
            width: 100% !important;
           padding-bottom: -50px !important; /* Maior distância da próxima seção */
        }
        
        /* Estilo para cada card de pacote - CORREÇÃO COMPLETA */
        .service-item.pacote-card {
            display: block !important;
            width: 100% !important;
            height: auto !important; /* Deixa a altura ajustar ao conteúdo */
            min-height: 190px !important; /* Altura mínima */
            background-color: white !important;
            border-radius: 8px !important;
            box-shadow: 0 3px 6px rgba(0,0,0,0.16) !important;
            overflow: hidden !important;
            position: relative !important;
            padding: 0 !important;
            margin: 0 !important;
        }
        
        /* Área da imagem */
        .service-item.pacote-card .service-image {
            width: 100% !important;
            height: 150px !important; /* Altura fixa para imagem - valor médio entre as duas definições anteriores */
            display: block !important;
        }
/* LOGO - centralizado entre menu hamburger e seletor de idioma */
header .logo,
.logo {
    position: absolute !important;
    left: 50% !important;
    top: -5px !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: 150px !important;
    z-index: 100 !important;
}
/*
header .logo img,
.logo img {
   max-height: 50px !important;
    width: auto !important;
    display: block !important;
}
}
/* BOTÃO HAMBÚRGUER - posicionado ABSOLUTAMENTE à esquerda */
header .mobile-menu-toggle,
header #mobile-menu-toggle,
.mobile-menu-toggle,
#mobile-menu-toggle {
    position: absolute !important;
    left: 10px !important;
    top: 10px !important;
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 9999 !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
}

/* Garantir que o ícone do hambúrguer seja visível 
header .mobile-menu-toggle i,
header #mobile-menu-toggle i,
.mobile-menu-toggle i,
#mobile-menu-toggle i {
    font-size: 25px !important;
    color: #333 !important;
    display: inline-block !important;
}


/* Botão 'Informe-se agora' */
header .btn-informe-se,
header #btn-informe-se,
.btn-informe-se,
#btn-informe-se {
    /* Estilo base que se aplica a todas as telas */
    /*white-space: nowrap !important;*/
    z-index: 100 !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
}

/* REPOSICIONADO PARA FICAR ABAIXO DO LOGOTIPO em dispositivos móveis */
@media (max-width: 991px) {
    header .btn-informe-se,
    header #btn-informe-se,
    .btn-informe-se,
    #btn-informe-se {
        /* Posicionamento abaixo do logotipo */
            font-size: 14px !important;
            line-height: 1.3 !important;
            color: #fff !important; /* Alterado para branco */
           /* text-align: center !important;*/
            font-weight: 600 !important;
        }
        
        /* Descrição do pacote */
        .service-item.pacote-card p {
            padding: 0 8px 10px 8px !important;
            margin: 0 !important;
            font-size: 11px !important;
            line-height: 1.2 !important;
            color: #666 !important;
            text-align: center !important;
            height: auto !important;
            max-height: 40px !important;
            overflow: hidden !important;
        }
        
        /* Espaço extra antes da próxima seção */
        h2[style*="margin-top: 60px"] {
            margin-top: 100px !important;
            padding-top: 20px !important;
        }
    }
    
    /* Esconde o menu desktop em telas pequenas */
    header .menu-container,
    .menu-container {
        display: none !important;
    }
    
    /* Estilos para o menu móvel */
    #mobile-menu {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 80% !important;
        max-width: 300px !important;
        height: 100vh !important;
        background-color: white !important;
        z-index: 9998 !important;
        overflow-y: auto !important;
        box-shadow: 2px 0 10px rgba(0,0,0,0.2) !important;
        transform: translateX(-100%) !important;
        transition: transform 0.3s ease-in-out !important;
        display: block !important;
    }
    
    #mobile-menu.active {
        transform: translateX(0) !important;
    }
    
    /* Conteúdo do menu */
    #mobile-menu ul {
        padding: 20px !important;
        margin: 0 !important;
        list-style: none !important;
    }
    
    #mobile-menu li {
        margin-bottom: 15px !important;
        list-style: none !important;
    }
    
    #mobile-menu a {
        display: block !important;
        padding: 8px 0 !important;
        color: #333 !important;
        text-decoration: none !important;
        font-size: 16px !important;
        font-weight: 500 !important;
    }
    
    #mobile-menu .mobile-submenu {
        display: none !important;
        padding-left: 15px !important;
        margin-top: 10px !important;
    }
    
    #mobile-menu .mobile-dropdown.active .mobile-submenu {
        display: block !important;
    }
    
    /* Para evitar problemas com floats ou posições anteriores */
    header .clearfix:after,
    .clearfix:after {
        content: "" !important;
        display: table !important;
        clear: both !important;
    }
    
    /* Reset de qualquer estilo inline que possa interferir */
    header [style*="position"],
    header [style*="left"],
    header [style*="right"],
    header [style*="top"] {
        position: static !important;
    }
    
    /* Exceções para os elementos que queremos posicionar */
    header .mobile-menu-toggle[style*="position"],
    header #mobile-menu-toggle[style*="position"],
    header .logo[style*="position"],
    header .btn-informe-se[style*="position"],
    header #btn-informe-se[style*="position"],
    header .language-selector[style*="position"],
    header #language-selector[style*="position"] {
        position: absolute !important;
    }
}