:root {
--mobile_m_nav-bg: #fff;
--mobile_m_text-primary: #1d1d1f; /* Quase preto */
--mobile_m_text-secondary: #707073; /* Cinza médio */
--mobile_m_link-active: #0071e3;
}

/*body {
font-family: 'Inter', sans-serif;
background-color: #f5f5f7;
}*/



/* Estilo para a barra de navegação superior */
.mobile_m_nav-bar {
background-color: var(--mobile_m_nav-bg);
border-bottom: 1px solid #e0e0e0;
z-index: 1000; /* Garante que fique acima de tudo */
}

/* Estilo do Overlay do Menu (Escondido por padrão) */
#mobile_m_menu-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--mobile_m_nav-bg);
transform: translateX(100%); /* Começa fora da tela (direita) */
transition: transform 0.4s ease-in-out;
overflow-y: auto;
z-index: 990;
}

#mobile_m_menu-overlay.mobile_m_active {
transform: translateX(0); /* Desliza para dentro da tela */
}

/* Estilo para títulos de accordion/links principais */
.mobile_m_menu-title {
font-size: 1.25rem; /* text-xl */
font-weight: 600;
color: var(--mobile_m_text-primary);
padding: 0.75rem 0;
cursor: pointer;
border-bottom: 1px solid #d2d2d7;
display: flex;
justify-content: space-between;
align-items: center;
}

/* Estilo dos sublinks */
.mobile_m_submenu-link {
font-size: 0.95rem;
color: var(--mobile_m_text-primary);
padding: 0.5rem 0;
display: block;
opacity: 0.8;
}

.mobile_m_submenu-link:hover {
opacity: 1;
color: var(--mobile_m_link-active);
}

/* Transição suave para o ícone do accordion */
.mobile_m_accordion-icon {
transition: transform 0.3s;
}
.mobile_m_expanded .mobile_m_accordion-icon {
transform: rotate(180deg);
}

/* Estilo da Busca */
#mobile_m_search-input {
padding-left: 2.5rem; /* Espaço para o ícone de lupa */
background-color: #e8e8ed;
border: none;
}

/* Estilo da Caixa de Mensagem (Substituindo alert()) */
#mobile_m_message-box {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #333;
color: white;
padding: 1rem;
border-radius: 0.5rem;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
z-index: 1010;
opacity: 0;
transition: opacity 0.3s ease-in-out;
pointer-events: none;
max-width: 80%;
text-align: center;
}

#mobile_m_message-box.mobile_m_show {
opacity: 1;
pointer-events: auto;
}

:root {
--nav-bg: #f5f5f7; /* Fundo do menu: Cinza muito claro */
--nav-border: #e0e0e0;
--text-primary: #1d1d1f; /* Quase preto */
--text-secondary: #707073;
--link-hover: #0071e3;
/* Garantimos que o fundo do menu principal é ligeiramente transparente para o efeito blur */
--desktop-nav-bg: rgba(255, 255, 255, 0.9); 
/* Para o submenu, alterado para Branco Sólido (rgba com alpha 1.0) */
--submenu-bg: #ffffff; /* Branco puro para garantir opacidade total */
--desktop-text: #424245;
}


/* 1. Barra de Navegação Desktop (Topo) */
.menu_d_desktop-nav {
height: 44px; /* Altura padrão da navegação Apple */
background-color: var(--desktop-nav-bg);
backdrop-filter: saturate(180%) blur(20px); /* Efeito de vidro desfocado */
border-bottom: 1px solid var(--nav-border);
z-index: 1000;
}

/* 2. Links Principais */
.menu_d_main-nav-link {
font-size: 0.75rem; /* text-xs */
font-weight: 400;
padding: 0 10px;
height: 44px;
display: flex;
align-items: center;
color: var(--desktop-text);
transition: opacity 0.2s;
}

.menu_d_main-nav-link:hover {
opacity: 0.7;
}

/* 3. Submenu (Dropdown) - Agora posicionado no body */
.menu_d_submenu-wrapper {
position: fixed;
top: 44px; /* Alinhado exatamente abaixo da barra de navegação */
left: 0;
right: 0;
background-color: var(--submenu-bg); /* Branco sólido */
border-bottom: 1px solid var(--nav-border);

/* ESTADO INICIAL (Escondido) */
opacity: 0;
visibility: hidden;
transform: translateY(-10px); 

transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s; 

pointer-events: none; /* Não recebe cliques quando invisível */

/* OTIMIZAÇÕES PARA COBERTURA VERTICAL */
min-height: 250px; /* Garante uma altura mínima para o fundo branco */
padding-top: 2rem; /* Adiciona espaço no topo para afastar o conteúdo da nav principal */
padding-bottom: 2rem; /* Aumenta o padding inferior para cobrir bem o fundo */

/* CORREÇÃO CRÍTICA: z-index alto para ficar acima de tudo */
z-index: 999;
}

/* 4. Estado ABERTO (Controlado por JavaScript) - Renomeado para menu_d_is-open */
.menu_d_submenu-wrapper.menu_d_is-open {
opacity: 1;
visibility: visible;
transform: translateY(0); /* Estado final da animação vertical */
pointer-events: auto; /* Recebe cliques quando visível */
}

/* 5. Estilos de Conteúdo */
.menu_d_submenu-title {
font-size: 1.5rem; /* text-2xl */
font-weight: 700;
color: var(--text-primary);
margin-bottom: 0.5rem;
}

.menu_d_submenu-link {
font-size: 0.85rem;
color: var(--text-secondary);
transition: color 0.2s;
}

.menu_d_submenu-link:hover {
color: var(--text-primary);
}