/* Theme CSS */
:root {
  /* Light Theme Variables (Default) */
  --bg-color: #ffffff;
  --bg-secondary: #f8f9fa;
  --text-color: #212529;
  --text-secondary: #6c757d;
  --border-color: #dee2e6;
}

/* Light Theme */
.light-theme {
  --bg-color: #ffffff;
  --bg-secondary: #f8f9fa;
  --text-color: #212529;
  --text-secondary: #6c757d;
  --border-color: #dee2e6;
}

/* Dark Theme */
.dark-theme {
  --bg-color: #121212;
  --bg-secondary: #1e1e1e;
  --text-color: #f8f9fa;
  --text-secondary: #adb5bd;
  --border-color: #343a40;
}

/* Theme Transitions */
body {
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Theme Toggle Button Styles */
.light-theme #theme-toggle-btn .fa-sun {
  display: none;
}

.light-theme #theme-toggle-btn .fa-moon {
  display: block;
}

.dark-theme #theme-toggle-btn .fa-sun {
  display: block;
}

.dark-theme #theme-toggle-btn .fa-moon {
  display: none;
}