/* Identidade visual Tecpavi: botões e barras em amarelo da faixa com texto
   preto (como a sinalização da estrada), nos modos claro e escuro. */

:root { --tecpavi-amarelo: var(--color-primary-500); --tecpavi-preto: #111111; }

/* Fundos "primary" (botão principal, barra de ações, avisos, barras de progresso) */
.bg-primary-600,
.dark .dark\:bg-primary-500 {
  background-color: var(--tecpavi-amarelo) !important;
}
.bg-primary-600,
.bg-primary-600 .text-white,
.bg-primary-600.text-white,
.dark .dark\:bg-primary-500,
.dark .dark\:bg-primary-500 .text-white {
  color: var(--tecpavi-preto) !important;
}
.hover\:bg-primary-600\/80:hover,
.bg-primary-600:hover {
  background-color: var(--color-primary-400) !important;
}
.border-primary-700,
.dark .dark\:border-primary-500 { border-color: var(--color-primary-600) !important; }

/* Caixas de seleção marcadas: amarelo com o "check" preto */
input[type="checkbox"]:checked { background-color: var(--tecpavi-amarelo) !important; border-color: var(--color-primary-600) !important; }

/* Faixa amarela fina no topo da barra lateral (lembra a sinalização) */
#nav-sidebar-inner, nav#nav-sidebar { border-top: 3px solid var(--tecpavi-amarelo); }

/* Logo na tela de login */
.logo-login { display: flex; justify-content: center; margin-bottom: 1.5rem; }
.logo-login img { height: 120px; width: auto; }

/* Botões do topo: tema claro/escuro e Sair */
.botao-topo {
  display: inline-flex; align-items: center; gap: 6px; height: 38px; min-width: 38px; padding: 0 10px;
  border: 1px solid var(--color-base-200); border-radius: 8px; background: transparent; cursor: pointer;
  color: inherit; font-weight: 500; font-size: 14px;
}
.botao-topo:hover { background: var(--color-base-100); }
.dark .botao-topo { border-color: var(--color-base-700); }
.dark .botao-topo:hover { background: var(--color-base-800); }
.botao-topo .icone-escuro { display: none; }
.dark .botao-topo .icone-escuro { display: inline; }
.dark .botao-topo .icone-claro { display: none; }
.botao-sair { color: #b42318; border-color: #f3c7c3; }
.dark .botao-sair { color: #f97066; border-color: #7a271a; }
.botao-sair:hover { background: #fef3f2; }
.dark .botao-sair:hover { background: rgba(240, 68, 56, .15); }
@media (max-width: 640px) { .botao-sair .texto-sair { display: none; } }