/* index.css — escopo: somente páginas com body.home-page Objetivo: garantir que login/cadastrar apareçam no dropdown mobile, manter header limpo no desktop e botão hambúrguer no canto direito. Coloque este arquivo e referencie AFTER style.css no do index.html. */ body.home-page .top-links { /* reforça layout do header apenas nesta página */ position: fixed; top: 0; left: 0; width: 100%; padding: 12px 20px; box-sizing: border-box; z-index: 9999; background: white; } /* mantém a área esquerda (logo/perfil) visível */ body.home-page .top-links .left-space { display: flex; align-items: center; gap: 12px; min-width: 0; } /* menu-links: desktop normal */ body.home-page .top-links .menu-links { display: flex; gap: 12px; align-items: center; margin-left: auto; } /* estilo suave dos links na index (desktop) */ body.home-page .top-links .menu-links a.btn-index { background: transparent; color: #1e3a8a; border: 2px solid transparent; padding: 8px 12px; border-radius: 8px; font-weight: 700; text-decoration: none; } /* variante "alt" permanece com borda */ body.home-page .top-links .menu-links a.btn-index.alt { background: white; color: #1e3a8a; border: 2px solid #3b82f6; } /* === MOBILE: esconder a versão horizontal e usar o painel móvel === */ @media (max-width: 700px) { /* oculta permanentemente a lista horizontal para evitar duplicação */ body.home-page header.top-links .menu-links { display: none !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; } /* mostra o hambúrguer no canto direito */ body.home-page header.top-links .menu-hamburguer { display: block !important; position: absolute !important; right: 12px !important; top: 12px !important; z-index: 10000 !important; } /* se quiser manter visual do perfil à esquerda */ body.home-page header.top-links .left-space { margin-left: 12px; } /* garante que o painel móvel seja visível e alinhado à direita quando aberto */ .mobile-dropdown-panel { right: 12px !important; left: auto !important; width: auto !important; min-width: 200px !important; max-width: 420px !important; } /* se o painel estiver vazio, exibe instrução (segurança) */ .mobile-dropdown-panel .panel-links:empty::before { content: "Nenhuma ação disponível"; display: block; padding: 12px; color: #555; font-size: 14px; } } /* força escopo — evita que regras globais do style.css sobrescrevam aqui */ body.home-page .mobile-dropdown-panel, body.home-page .mobile-dropdown-panel .panel-links, body.home-page header.top-links .menu-hamburguer { box-shadow: none; } /* index.css — forçar botões Entrar / Cadastrar visíveis no index (mobile) */ /* 1) Garante que, somente na página index (body.home-page), em telas pequenas, os botões de .menu-links fiquem visíveis lado a lado e o hambúrguer seja oculto. */ @media (max-width:700px) { /* mostra a versão horizontal do menu (botões lado a lado) */ body.home-page header.top-links .menu-links { display: flex !important; position: absolute !important; right: 12px !important; top: 10px !important; gap: 8px !important; align-items: center !important; background: transparent !important; padding: 0 !important; margin: 0 !important; z-index: 10000 !important; pointer-events: auto !important; visibility: visible !important; opacity: 1 !important; } /* forçar cada botão a ficar compacto e inline */ body.home-page header.top-links .menu-links a.btn-index { display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 6px 10px !important; border-radius: 8px !important; font-weight: 700 !important; text-decoration: none !important; white-space: nowrap !important; } /* variante primária (Cadastrar) */ body.home-page header.top-links .menu-links a.btn-index.alt, body.home-page header.top-links .menu-links a.btn-index.btn-primary { background: #3b82f6 !important; color: #fff !important; border: 2px solid #3b82f6 !important; } /* manter o botão hambúrguer completamente escondido somente nesta página */ body.home-page header.top-links .menu-hamburguer { display: none !important; visibility: hidden !important; pointer-events: none !important; } /* se houver pouco espaço, permite que os botões "flutuem" sobre o conteúdo (não quebrem) */ body.home-page header.top-links { padding-right: 12px !important; } }