/* Importando a fonte Comic Sans MS */
@import url('https://fonts.googleapis.com/css2?family=Comic+Sans+MS&display=swap');

/* Paleta de Cores Sivuca News */
:root {
  --primary-color: #5965F5;
  --secondary-color: #F5E64E;
  --tertiary-color: #B576F5;
  --accent-green-1: #D2F556;
  --accent-blue-2: #4B8EF5;
  --accent-green-2: #A3F56B;

  /* Light mode */
  --background-light: #ffffff;
  --text-light: #212529;
  --sidebar-light: #f8f9fa;
  --footer-light: #5965F5;
}

/* Definir a fonte Comic Sans para todo o corpo do site */
body {
  font-family: 'Comic Sans MS', cursive, sans-serif;
}

/* Light theme */
[data-bs-theme="light"] {
  background-color: var(--background-light);
  color: var(--text-light);
}

/* Dark theme */
[data-bs-theme="dark"] {
  background-color: #121212;
  color: #e0e0e0;
}

/* Navbar */
.navbar {
  background-color: var(--primary-color);
}

/* Estilo para o item ativo no navbar */
.nav-link.active {
    background-color: var(--secondary-color);
    color: #000 !important;
    border-radius: 4px;
    font-weight: bold;
    transition: all 0.3s ease;
}

.nav-link.active span::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--accent-green-1);
}

/* Efeito hover para todos os itens */
.nav-link:hover:not(.active) {
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
}

/* Sidebar */
.sidebar {
  padding: 1rem;
  border-radius: 8px;
}

[data-bs-theme="light"] .sidebar {
  background-color: var(--sidebar-light);
  color: var(--text-light);
}

[data-bs-theme="dark"] .sidebar {
  background-color: #1f1f1f;
  color: #e0e0e0;
}

/* Footer */
footer {
  padding: 1rem 0;
  margin-top: 2rem;
  text-align: center;
  border-top: 4px solid var(--secondary-color);
}

[data-bs-theme="light"] footer {
  background-color: var(--footer-light);
  color: #ffffff;
}

[data-bs-theme="dark"] footer {
  background-color: #1f1f1f;
  color: #e0e0e0;
}

/* Botão de alternância de tema */
.theme-toggle {
  cursor: pointer;
  border: none;
  background: none;
  font-size: 1.2rem;
}

/* Estilo dos ícones */
.bi {
  font-size: 1.2rem;
  margin-right: 0.5rem;
}

.dropdown-item .bi {
  color: var(--primary-color);
}