html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

/* Light mode styling */
body.light-mode {
  background-color: #f2f2f2; /* 80% branco, cinza bem claro */
  color: #222;
}

body.light-mode .navbar {
  background-color: #e7e7e7 !important;
  color: #222;
  --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0,0,0,0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Garantir visibilidade do toggler no light mode */
body.light-mode .navbar-toggler {
  border-color: #333;
}

body.light-mode .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0,0,0,0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

body.light-mode .card {
  background-color: #ffffff;
  color: #000;
}

/* Dark mode styling */
body.dark-mode {
  background-color: #1a0026; /* roxo escuro ~90% preto */
  color: #bfbfbf;
}

body.dark-mode .navbar {
  background-color: #2a003a !important;
  --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(235,235,235,1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Garantir visibilidade do toggler no dark mode */
body.dark-mode .navbar-toggler {
  border-color: #e6e6e6;
}

body.dark-mode .navbar-toggler-icon {
  background-image: var(--bs-navbar-toggler-icon-bg) !important;
}

/* Legibilidade geral da navbar: texto maior e altura extra */
.navbar {
  font-size: 1.1rem; /* ~17.6px para melhor leitura */
  min-height: 64px;
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
}

.navbar .nav-link,
.navbar .dropdown-item {
  font-size: 1.05rem;
}

.navbar .navbar-brand {
  font-size: 1.15rem;
}

.navbar .btn {
  font-size: 0.95rem;
  padding: 0.4rem 0.75rem;
}

/* Dobro das fontes no modo celular */
@media (max-width: 575.98px) {
  .navbar {
    font-size: 1.1rem;
    min-height: 72px;
    padding-top: 0.9rem;
    padding-bottom: 0.9rem;
  }

  .navbar .nav-link,
  .navbar .dropdown-item {
    font-size: 1.05rem;
  }

  .navbar .navbar-brand {
    font-size: 1.15rem;
  }

  .navbar .btn {
    font-size: 0.95rem;
    padding: 0.55rem 0.95rem;
  }
}

/* Ajuste da logo na tela de login para mobile */
/* Defaults (desktop/tablet) */
.logo-box {
  background-color: rgba(35, 35, 35, 0.3);
}

.logo-img {
  max-width: 220px;
  display: block;
  margin: 0 auto;
  padding-top: 0;
}

/* Mobile overrides */
@media (max-width: 575.98px) {
  .logo-box {
    margin-top: 4.2rem;
  }

  .logo-img {
    max-width: 200px;
    margin-top: 36px;
    padding-top: 26px;
  }
}

body.dark-mode .card {
  background-color: #2b003e;
  color: #f5f5f5;
}

body.dark-mode a {
  color: #b18fff;
}

body.dark-mode .btn-outline-light {
  border-color: #bbb;
}

/* Ajustes de contraste em dark mode */
body.dark-mode .card,
body.dark-mode .card h6,
body.dark-mode .card p {
  color: #f5f5f5 !important;
}

body.dark-mode .card .text-muted {
  color: #bababa !important;
}

body.dark-mode label,
body.dark-mode select,
body.dark-mode input,
body.dark-mode textarea {
  color: #f5f5f5;
  background-color: #2d0040;
  border-color: #666;
}

body.dark-mode .form-select,
body.dark-mode .form-control {
  background-color: #2d0040;
  color: #f1f1f1;
}

/* Correção para textos menores (como ano nos cards) */
body.dark-mode small,
body.dark-mode .small,
body.dark-mode .text-secondary {
  color: #dcdcdc !important;
}

/* Corrigir cor do texto do menu no dark mode */
body.dark-mode .navbar-nav .nav-link,
body.dark-mode .navbar-brand,
body.dark-mode .dropdown-menu a {
  color: #e6e6e6 !important;
}

body.dark-mode .navbar-nav .nav-link:hover,
body.dark-mode .dropdown-menu a:hover {
  color: #ffffff !important;
}

/* Corrigir visibilidade do ícone de tema no light mode */
body.light-mode #toggleTheme i {
  color: #333 !important;
}

body.light-mode #toggleTheme:hover i {
  color: #000 !important;
}

/* Corrigir transparência e contraste de dropdown no dark mode */
body.dark-mode .dropdown-menu {
  background-color: #2a003a !important;
  border: 1px solid #444;
}

body.dark-mode .dropdown-menu a {
  color: #f1f1f1 !important;
  background-color: transparent !important;
}

body.dark-mode .dropdown-menu a:hover {
  background-color: #4a006a !important;
  color: #ffffff !important;
}

/* Ajustes visuais nas caixas de texto (detalhes de item) */
.form-control.bg-light {
  border: 1px solid #ccc;
  background: #fafafa;
  color: #222;
}

body.dark-mode .form-control.bg-light {
  border: 1px solid #555;
  background: #2d0040;
  color: #f5f5f5;
}

body.dark-mode .form-control.bg-light {
  border: 1px solid #666;
  background: #1a0926;
  color: #e0e0e0;
}

body.dark-mode label.text-muted,
body.dark-mode label,
body.dark-mode .fw-bold.text-muted {
  color: #cccccc !important;
}

body.light-mode .form-control.bg-light {
  background: #ffffff;
  border: 1px solid #ccc;
  color: #222;
}

/* Ajuste de contraste final nas caixas de texto do dark mode */
body.dark-mode .form-control.bg-light {
  background-color: #2b1240 !important; /* Fundo roxo mais escuro para contraste */
  color: #d0d0d0 !important; /* Texto cinza médio legível */
  border: 1px solid #5a4a70 !important;
}

body.dark-mode label,
body.dark-mode .fw-bold.text-muted {
  color: #e5e5e5 !important; /* Legendas e rótulos com contraste adequado */
}

/* Ajuste para tabela em dark mode na tela Item/Index */
body.dark-mode table.table {
  background-color: rgba(43, 0, 64, 0.85) !important; /* Fundo roxo sólido e consistente com o body */
  color: #f8f8ff !important; /* texto branco azulado de alto contraste */
  border: 1px solid #6a5090 !important;
}

body.dark-mode table.table thead th {
  background-color: rgba(60, 0, 90, 0.9) !important;
  color: #ffffff !important;
  border-bottom: 1px solid #7a5ca0 !important;
}

body.dark-mode table.table tbody td {
  background-color: rgba(43, 0, 64, 0.85) !important;
  color: #ffffff !important;
  border-top: 1px solid #6a5090 !important;
}

body.dark-mode table.table tr:hover td {
  background-color: rgba(90, 0, 120, 0.8) !important;
  color: #ffffff !important;
}

body.dark-mode table.table th,
body.dark-mode table.table td {
  color: #ffffff;
  border-color: #6b5880;
}

body.dark-mode table.table tr:hover {
  background-color: rgba(100, 50, 140, 0.6);
  color: #fff;
}

/* Efeito de zoom em cards de item na Home */
.card.h-100 {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card.h-100:hover {
  transform: scale(1.05);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
  cursor: pointer;
}

/* Ajuste dos quadros de estatísticas no dark mode */
body.dark-mode .card.bg-light {
  background-color: #2b003e !important; /* mesmo fundo das cards de itens */
  color: #f5f5f5 !important; /* texto branco suave */
  border: 1px solid #5a4a70 !important;
  box-shadow: 0 0 10px rgba(90, 74, 112, 0.3);
}

body.dark-mode .card.bg-light h5,
body.dark-mode .card.bg-light p {
  color: #f5f5f5 !important;
}

body.dark-mode .card.bg-light i {
  color: #b18fff !important;
}