/* Dark Mode Styles */
body.dark-mode {
  background-color: #121212;
  color: #f5f5f5;
  transition: background-color 0.3s, color 0.3s;
}

.dark-mode .container {
  background-color: #1e1e1e;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

/* Header aplikasi - dark mode */
.dark-mode header {
  background-color: #1b4d1e;
}

.dark-mode .profile {
  background-color: #2e3e2e;
  color: white;
}

/* Kartu saldo utama - dark mode */
.dark-mode .summary-card {
  background: linear-gradient(135deg, #2c7230, #133a14);
}

/* Tab periode - dark mode */
.dark-mode .period-tabs {
  border-bottom-color: #444;
}

.dark-mode .period-tab {
  color: #aaa;
}

.dark-mode .period-tab.active {
  color: #8bc34a;
}

.dark-mode .period-tab.active::after {
  background-color: #8bc34a;
}

/* Judul seksi - dark mode */
.dark-mode .section-title {
  color: #e0e0e0;
}

/* Kartu info - dark mode */
.dark-mode .info-card {
  background-color: #2a2a2a;
  border-top-color: #4caf50;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.dark-mode .info-card h3 {
  color: #bbb;
}

.dark-mode .info-card .value {
  color: #8bc34a;
}

/* Seksi paragraf - dark mode */
.dark-mode .paragraph-section p {
  color: #bbb;
}

/* Menu navigasi bawah - dark mode */
.dark-mode .menu-bar {
  background-color: #1e1e1e;
  border-top-color: #333;
  transition: background-color 0.3s, border-color 0.3s;
}

.dark-mode .menu-item {
  color: #aaa;
}

.dark-mode .active {
  color: #8bc34a;
}