/* =========================
   Paleta e base - Updated 2025-10-01 15:30 GMT-3
   ========================= */
:root {
  --brand-green:  #065f46; /* verde */
  --brand-blue:   #0284c7; /* azul  */
  --brand-black:  #000000; /* preto */
  --brand-red:    #D20103; /* vermelho */
  --brand-yellow: #ffff00; /* amarelo */
}

html, body {
  margin: 0 !important;
  padding: 0 !important;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0 !important;
  padding: 0 !important;
  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
}

/* Aplicar a mesma fonte aos elementos principais */
h1, h2, h3, h4, h5, h6, p, div, span, a, li, td, th {
  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
}

/* Fonte específica para a navbar */
.navbar, .navbar-brand, .nav-link, .navbar-text {
  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
}

/* =========================
   MODO ESCURO - Estilos Globais
   ========================= */

/* Fundo e texto principal do modo escuro */
html[data-bs-theme="dark"] body {
  background-color: #383A3D !important;
  color: #e9ecef !important;
}

/* Títulos no modo escuro */
html[data-bs-theme="dark"] h1,
html[data-bs-theme="dark"] h2,
html[data-bs-theme="dark"] h3,
html[data-bs-theme="dark"] h4,
html[data-bs-theme="dark"] h5,
html[data-bs-theme="dark"] h6 {
  color: #f8f9fa !important;
}

/* Parágrafos e textos no modo escuro */
html[data-bs-theme="dark"] p,
html[data-bs-theme="dark"] div,
html[data-bs-theme="dark"] span:not(.navbar *):not(.dropdown *):not(.nav-footer *) {
  color: #e9ecef !important;
}

/* Cards no modo escuro */
html[data-bs-theme="dark"] .card {
  background-color: #495057 !important;
  border-color: #6c757d !important;
  color: #f8f9fa !important;
}

/* Conteúdo principal no modo escuro */
html[data-bs-theme="dark"] main,
html[data-bs-theme="dark"] .content,
html[data-bs-theme="dark"] #quarto-document-content {
  background-color: #383A3D !important;
  color: #e9ecef !important;
}

/* Container principal no modo escuro */
html[data-bs-theme="dark"] .quarto-container {
  background-color: #383A3D !important;
}

/* Links no modo escuro */
html[data-bs-theme="dark"] a:not(.navbar *):not(.dropdown *):not(.btn *) {
  color: #6EA8FE !important;
}

html[data-bs-theme="dark"] a:not(.navbar *):not(.dropdown *):not(.btn *):hover {
  color: #9EC5FE !important;
}

/* Listas no modo escuro */
html[data-bs-theme="dark"] ul,
html[data-bs-theme="dark"] ol,
html[data-bs-theme="dark"] li {
  color: #e9ecef !important;
}

/* Elementos com texto que podem estar aparecendo em branco */
html[data-bs-theme="dark"] .quarto-title-block,
html[data-bs-theme="dark"] .quarto-title,
html[data-bs-theme="dark"] .content-block,
html[data-bs-theme="dark"] .page-columns {
  color: #e9ecef !important;
}

/* =========================
   TOPBAR (navbar / headroom)
   ========================= */

/* Elimina completamente qualquer gap entre omnibox e topbar */
html, body {
  margin: 0 !important;
  padding: 0 !important;
}

/* Remove margens do container principal */
.quarto-container,
.container-fluid,
main,
.main {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

#quarto-header {
  margin: 0 !important;
  padding: 0 !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
}

#quarto-header .navbar {
  color: #fff !important;
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border: 0 !important;
}

/* Topbar Light Mode (padrão) */
html[data-bs-theme="light"] #quarto-header .navbar,
html:not([data-bs-theme]) #quarto-header .navbar {
  background: linear-gradient(
    140deg,
    #33a4faff 0%,
    #4188beff 12%,   
    #0ccbe9ff 45%,   
    #5ab434ff 55%,   
    #1bbe90ff 65%,   
    #0ca278ff 85%,   
    rgb(229, 229, 229) 100%   
  ) !important;
}

/* Topbar Dark Mode */
html[data-bs-theme="dark"] #quarto-header .navbar {
  background: linear-gradient(
    140deg,
    #2986cc 0%,
    #2b587a 12%,   
    #0ab9d3 45%,   
    #3f7a25 55%,   
    #065f46 65%,   
    #065f46 85%,   
    #000000 100%   
  ) !important;
}

#quarto-header .navbar,
#quarto-header.headroom {
  position: sticky;
  top: 0;
  z-index: 100;
  backdrop-filter: blur(6px);
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
}

/* textos/ícones na barra */
#quarto-header .navbar a,
#quarto-header .navbar .nav-link,
#quarto-header .navbar .navbar-brand,
#quarto-header .navbar .navbar-toggler,
#quarto-header .navbar .navbar-text { color: #fff !important; }

#quarto-header .navbar .navbar-title { font-weight: 700; letter-spacing: .2px; }

/* ====== Layout fixo baseado no HTML gerado ====== */
#quarto-header .navbar .navbar-container.container-fluid {
  position: relative !important;
  min-height: 56px;
}

/* BRAND à esquerda (neutraliza .mx-auto) */
#quarto-header .navbar .navbar-brand-container {
  position: absolute !important;
  left: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin: 0 !important;
  width: auto !important;
}

/* LINKS à esquerda, próximo ao logo - REMOVE CENTRALIZAÇÃO */
#quarto-header .navbar #navbarCollapse { position: static !important; }
#quarto-header .navbar #navbarCollapse .navbar-nav {
  position: static !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
  display: flex !important;
  gap: .6rem !important;
  margin-left: 200px !important; /* Espaço para o logo */
  margin-right: 0 !important;
  width: auto !important;
  justify-content: flex-start !important; /* Alinha à esquerda */
}
#quarto-header .navbar #navbarCollapse .navbar-nav.me-auto,
#quarto-header .navbar #navbarCollapse .navbar-nav.ms-auto {
  margin-left: 200px !important; /* Consistente com acima */
  margin-right: 0 !important;
}

/* SEARCH e TOOLS à direita */
#quarto-header .navbar #quarto-search {
  position: absolute !important;
  right: 180px !important; /* Mais espaço para os novos botões */
  top: 50% !important;
  transform: translateY(-50%) !important;
}
#quarto-header .navbar .quarto-navbar-tools {
  position: absolute !important;
  right: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  display: flex !important;
  gap: .5rem;
  align-items: center !important;
}

/* Estilos para os novos botões */
#quarto-header .navbar .quarto-navbar-tools a[aria-label],
#quarto-header .navbar .quarto-navbar-tools .quarto-navigation-tool {
  color: #fff !important;
  padding: 8px !important;
  border-radius: 6px !important;
  transition: background-color 0.2s ease !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#quarto-header .navbar .quarto-navbar-tools a[aria-label]:hover,
#quarto-header .navbar .quarto-navbar-tools .quarto-navigation-tool:hover {
  background-color: rgba(255,255,255,0.1) !important;
  color: #fff !important;
}

/* Ícones dos botões */
#quarto-header .navbar .quarto-navbar-tools .bi {
  font-size: 1.1em !important;
}

/* Ícone de email específico - sem rebarbas */
#quarto-header .navbar .quarto-navbar-tools .bi-envelope-at {
  font-weight: bold !important;
  font-size: 1.0em !important;
}

/* Estilos específicos para emojis nos tools */
#quarto-header .navbar .quarto-navbar-tools a[href^="mailto"] {
  font-size: 1.2em !important;
  line-height: 1 !important;
}

/* hover/ativo nos links do topo */
#quarto-header .navbar .nav-link.active,
#quarto-header .navbar .nav-link:hover {
  color: #ffffff !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* toggler visível */
#quarto-header .navbar .navbar-toggler {
  border-color: rgba(255,255,255,.5) !important;
}
#quarto-header .navbar .navbar-toggler:focus {
  box-shadow: 0 0 0 .15rem rgba(255,255,255,.35);
}

/* ====== Mobile (<= 992px): empilhado ====== */
@media (max-width: 991.98px) {
  #quarto-header .navbar .navbar-brand-container,
  #quarto-header .navbar #navbarCollapse .navbar-nav,
  #quarto-header .navbar #quarto-search,
  #quarto-header .navbar .quarto-navbar-tools {
    position: static !important;
    transform: none !important;
  }
  
  #quarto-header .navbar .navbar-container.container-fluid {
    display: block !important;
  }
  
  #quarto-header .navbar #navbarCollapse .navbar-nav {
    width: 100% !important;
    justify-content: flex-start !important; /* Mantém alinhamento à esquerda */
    padding: .25rem 0 !important;
    margin-left: 0 !important; /* Remove margem no mobile */
  }
  
  #quarto-header .navbar .quarto-navbar-tools {
    justify-content: flex-end !important;
    padding: .25rem 0 !important;
  }
}

/* =========================
   Dropdown menu nativo do Quarto
   ========================= */

/* Estilização para o dropdown nos tools da navbar */
.quarto-navbar-tools .dropdown-toggle {
  color: #fff !important;
  font-size: 1.2em !important;
  border: none !important;
  background: none !important;
  padding: 8px 12px !important;
  text-decoration: none !important;
}

.quarto-navbar-tools .dropdown-toggle:hover,
.quarto-navbar-tools .dropdown-toggle:focus {
  color: #fff !important;
  background-color: rgba(255,255,255,0.1) !important;
  border-radius: 6px !important;
  text-decoration: none !important;
}

/* Posicionamento do dropdown */
.quarto-navbar-tools .dropdown {
  position: relative !important;
}

/* Dropdown Light Mode (padrão) */
html[data-bs-theme="light"] .quarto-navbar-tools .dropdown-menu,
html:not([data-bs-theme]) .quarto-navbar-tools .dropdown-menu {
  background: linear-gradient(
    140deg,
    #33a4faff 0%,
    #4188beff 12%,   
    #0ccbe9ff 45%,   
    #5ab434ff 55%,   
    #1bbe90ff 65%,   
    #0ca278ff 85%,   
    #bbacacff 100%   
  ) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 8px !important;
  min-width: 220px !important;
  
  /* Posicionamento correto */
  position: absolute !important;
  top: calc(100% + 15px) !important;  /* 15px abaixo da topbar para igualar o espaçamento do conteúdo */
  right: 0 !important;               /* Alinhado à direita do botão */
  left: auto !important;             /* Remove alinhamento à esquerda */
  transform: translateX(0) !important;
  
  /* Garante que apareça acima de outros elementos */
  z-index: 9999 !important;
  
  /* Sombra para destaque */
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
}

/* Dropdown Dark Mode */
html[data-bs-theme="dark"] .quarto-navbar-tools .dropdown-menu {
  background: linear-gradient(
    140deg,
    #2986cc 0%,
    #2b587a 12%,   
    #0ab9d3 45%,   
    #3f7a25 55%,   
    #065f46 65%,   
    #065f46 85%,   
    #000000 100%   
  ) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 8px !important;
  min-width: 220px !important;
  
  /* Posicionamento correto */
  position: absolute !important;
  top: calc(100% + 15px) !important;  /* 15px abaixo da topbar para igualar o espaçamento do conteúdo */
  right: 0 !important;               /* Alinhado à direita do botão */
  left: auto !important;             /* Remove alinhamento à esquerda */
  transform: translateX(0) !important;
  
  /* Garante que apareça acima de outros elementos */
  z-index: 9999 !important;
  
  /* Sombra para destaque */
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
}

/* Para telas menores, ajusta para não sair da tela */
@media (max-width: 768px) {
  .quarto-navbar-tools .dropdown-menu {
    right: -10px !important;
    min-width: 200px !important;
  }
}

.quarto-navbar-tools .dropdown-item {
  color: #fff !important;
  padding: 10px 16px !important;
  transition: background-color 0.2s ease !important;
  border: none !important;
  white-space: nowrap !important;
}

.quarto-navbar-tools .dropdown-item:hover,
.quarto-navbar-tools .dropdown-item:focus {
  background-color: rgba(255,255,255,0.15) !important;
  color: #fff !important;
}

/* 
   CÓDIGO DA GAVETA COMENTADO - NÃO MAIS NECESSÁRIO
   =========================
   Drawer base (classe .open)
   =========================
*/

/* Overlay neutro: sem escurecer, sem bloquear cliques */
.drawer-overlay {
  position: fixed;
  inset: 0;
  background: transparent !important; /* nada de escurecer */
  opacity: 0 !important;
  pointer-events: none !important;    /* não intercepta cliques */
  transition: none !important;
  z-index: -1 !important;             /* fica “atrás” de tudo */
}

/* Mesmo com .show, continua neutro */
.drawer-overlay.show {
  background: transparent !important;
  opacity: 0 !important;
  pointer-events: none !important;
  z-index: -1 !important;
}


/*
   =========================
   Drawer: menu + efeitos - COMENTADO
   =========================
.drawer-menu { list-style: none; padding: 0; margin: 0; }
.drawer-menu li { margin-bottom: 10px; }

.drawer-menu .menu-link {
  display: block;
  padding: 10px 14px;
  border-radius: 8px;
  color: #111827;
  text-decoration: none;
  font-size: 1rem;
  transition: background-color .2s, color .2s, transform .08s ease-out;
}
.drawer-menu .menu-link:hover  { background-color: #e5f9ef; color: #065f46; }
.drawer-menu .menu-link:active { transform: scale(0.98); background-color: #bbf7d0; }
*/

/* =========================
   Cards / Grid / misc
   ========================= */
.grid { display: grid; gap: 16px; }
.grid.cols-3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }

.card {
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 16px;
  background: #fff;
  transition: box-shadow .2s;
}
.card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.06); }

footer .center { text-align: center; color: #6b7280; }

/* =========================
   Navfooter / Rodapé
   ========================= */

/* Navfooter Light Mode (padrão) */
html[data-bs-theme="light"] .nav-footer,
html:not([data-bs-theme]) .nav-footer {
  background-color: #E8E8E8 !important;
}

/* Navfooter Dark Mode */
html[data-bs-theme="dark"] .nav-footer {
  background-color: #CAC9C9 !important;
}

/* hero antigo fora */
.hero { display: none; }

/* =========================
   Dropdown menu principal (Projeto)
   ========================= */

/* Cria uma área expandida para o hover do dropdown */
.navbar-nav .nav-item.dropdown {
  position: relative !important;
}

/* Área invisible que conecta o botão ao dropdown */
.navbar-nav .nav-item.dropdown::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 10px; /* Ponte invisível de 10px */
  background: transparent;
  z-index: 9998;
}

/* Ativa dropdown com hover - inclui a área de ponte */
.navbar-nav .nav-item.dropdown:hover .dropdown-menu,
.navbar-nav .dropdown-menu:hover {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Remove a setinha do dropdown */
.navbar-nav .nav-item.dropdown .dropdown-toggle::after {
  display: none !important;
}

/* Estilização do dropdown do menu principal - Light Mode */
html[data-bs-theme="light"] .navbar-nav .dropdown-menu,
html:not([data-bs-theme]) .navbar-nav .dropdown-menu {
  background: linear-gradient(
    140deg,
    #33a4faff 0%,
    #4188beff 12%,   
    #0ccbe9ff 45%,   
    #5ab434ff 55%,   
    #1bbe90ff 65%,   
    #0ca278ff 85%,   
    #bbacacff 100%   
  ) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 8px !important;
  min-width: 200px !important;
  margin-top: 10px !important; /* Espaço para a ponte */
  z-index: 9999 !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
}

/* Estilização do dropdown do menu principal - Dark Mode */
html[data-bs-theme="dark"] .navbar-nav .dropdown-menu {
  background: linear-gradient(
    140deg,
    #2986cc 0%,
    #2b587a 12%,   
    #0ab9d3 45%,   
    #3f7a25 55%,   
    #065f46 65%,   
    #065f46 85%,   
    #000000 100%   
  ) !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 8px !important;
  min-width: 200px !important;
  margin-top: 10px !important; /* Espaço para a ponte */
  z-index: 9999 !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
}

/* Itens do dropdown do menu principal */
.navbar-nav .dropdown-item {
  color: #fff !important;
  padding: 12px 18px !important;
  transition: background-color 0.2s ease !important;
  border: none !important;
  text-decoration: none !important;
  display: block !important;
}

.navbar-nav .dropdown-item:hover,
.navbar-nav .dropdown-item:focus {
  background-color: rgba(255,255,255,0.15) !important;
  color: #fff !important;
  border-radius: 4px !important;
  text-decoration: none !important;
}

/* Estado inicial do dropdown - escondido com transição suave */
.navbar-nav .dropdown-menu {
  display: none !important;
  transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(-10px) !important;
}

/* Estado ativo do dropdown - visível com animação */
.navbar-nav .nav-item.dropdown:hover .dropdown-menu,
.navbar-nav .dropdown-menu:hover {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

/* Delay para evitar fechamento acidental */
.navbar-nav .nav-item.dropdown {
  transition: all 0.1s ease !important;
}

/* Melhora a área clicável do dropdown toggle e força alinhamento */
#quarto-header .navbar .navbar-nav .nav-item.dropdown .dropdown-toggle {
  padding: 8px 16px !important;
  position: relative !important;
  vertical-align: baseline !important;
  line-height: 1.5 !important;
  display: inline-flex !important;
  align-items: center !important;
  height: auto !important;
  margin: 0 !important;
}

/* Remove flexbox dos nav-links que pode estar causando problemas */
#quarto-header .navbar .navbar-nav .nav-link {
  padding: 8px 16px !important;
  vertical-align: baseline !important;
  line-height: 1.5 !important;
  display: inline-block !important;
  height: auto !important;
  margin: 0 !important;
}

/* =========================
   FORÇA ALINHAMENTO - CSS v2.0 para cache bust
   ========================= */

/* Super específico para forçar alinhamento - override completo */
#quarto-header .navbar .navbar-nav.navbar-nav-scroll.me-auto .nav-item.dropdown .dropdown-toggle,
#quarto-header .navbar .navbar-nav .nav-item.dropdown .nav-link.dropdown-toggle {
  padding: 8px 16px !important;
  margin: 0 !important;
  border: 0 !important;
  vertical-align: baseline !important;
  line-height: 1.5rem !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 1rem !important;
  font-weight: normal !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

/* Força mesmo comportamento para todos os nav-links */
#quarto-header .navbar .navbar-nav.navbar-nav-scroll.me-auto .nav-item .nav-link:not(.dropdown-toggle) {
  padding: 8px 16px !important;
  margin: 0 !important;
  border: 0 !important;
  vertical-align: baseline !important;
  line-height: 1.5rem !important;
  height: auto !important;
  display: inline-block !important;
  font-size: 1rem !important;
  font-weight: normal !important;
  text-align: center !important;
  box-sizing: border-box !important;
}