/* Variáveis para Modo Escuro */
body.dark-mode {
    --bg-color: #1a1a1a;
    --sidebar-bg: #2d2d2d;
    --card-bg: #2d2d2d;
    --text-color: #e0e0e0;
    --text-muted: #a0a0a0;
    --border-color: #404040;
    --input-bg: #333333;
    --hover-color: #3d3d3d;
}

/* Aplicação das variáveis */
body.dark-mode {
    background-color: var(--bg-color);
    color: var(--text-color);
}

body.dark-mode .sidebar {
    background-color: var(--sidebar-bg);
    border-right: 1px solid var(--border-color);
}

body.dark-mode .header {
    background-color: var(--card-bg);
    border-bottom: 1px solid var(--border-color);
}

body.dark-mode .card,
body.dark-mode .grupo-card,
body.dark-mode .profile-card,
body.dark-mode .chart-container,
body.dark-mode .recent-transactions,
body.dark-mode .category-section,
body.dark-mode .modal-content,
body.dark-mode .toast {
    background-color: var(--card-bg);
    border: 1px solid var(--border-color);
    color: var(--text-color);
}

body.dark-mode .nav-item {
    color: var(--text-muted);
}

body.dark-mode .nav-item:hover,
body.dark-mode .nav-item.active {
    background-color: var(--hover-color);
    color: var(--text-color);
}

body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea {
    background-color: var(--input-bg);
    border-color: var(--border-color);
    color: var(--text-color);
}

body.dark-mode .data-table th {
    background-color: var(--hover-color);
    color: var(--text-color);
    border-bottom-color: var(--border-color);
}

body.dark-mode .data-table td {
    border-bottom-color: var(--border-color);
    color: var(--text-color);
}

body.dark-mode .transaction-item {
    border-bottom-color: var(--border-color);
}

body.dark-mode .user-dropdown {
    background-color: var(--card-bg);
    border-color: var(--border-color);
}

body.dark-mode .dropdown-item {
    color: var(--text-color);
}

body.dark-mode .dropdown-item:hover {
    background-color: var(--hover-color);
}

body.dark-mode h1, 
body.dark-mode h2, 
body.dark-mode h3, 
body.dark-mode h4 {
    color: var(--text-color);
}

body.dark-mode .text-muted,
body.dark-mode small {
    color: var(--text-muted) !important;
}

/* Estilo do botão de toggle */
.theme-toggle {
    background: none;
    border: none;
    color: var(--text-color); /* Usa a cor do tema atual */
    font-size: 1.2rem;
    cursor: pointer;
    padding: 0.5rem;
    margin-right: 1rem;
    transition: transform 0.3s ease;
}

body:not(.dark-mode) .theme-toggle {
    color: #64748b;
}

.theme-toggle:hover {
    transform: rotate(15deg);
}

body.dark-mode .tabs-container {
    border-bottom-color: var(--border-color);
}

body.dark-mode .tab-btn {
    color: var(--text-muted);
}

body.dark-mode .tab-btn:hover,
body.dark-mode .tab-btn.active {
    color: var(--primary-color);
}

body.dark-mode .calendar-container {
    background-color: var(--card-bg);
}

body.dark-mode .calendar-grid {
    background-color: var(--border-color);
    border-color: var(--border-color);
}

body.dark-mode .calendar-day-header {
    background-color: var(--input-bg);
    color: var(--text-muted);
}

body.dark-mode .calendar-day {
    background-color: var(--card-bg);
}

body.dark-mode .calendar-day:hover {
    background-color: var(--hover-color);
}

body.dark-mode .calendar-day.other-month {
    background-color: var(--bg-color);
    color: var(--text-muted);
}

body.dark-mode .calendar-day.today {
    background-color: rgba(59, 130, 246, 0.1);
}