body.dark-mode {
  --bg-color: #121826;
  --card-bg: #1E293B;
  --primary-color: #7670da;
  --primary-color-rgb: 118, 112, 218;
  --secondary-color: #6366F1;
  --border-color: #23263a;
  --text-color: #eaeaea;
  --footer-bg: #181824;
  --footer-text: #bdbdbd;
  background: var(--bg-color) !important;
  --header-color: #C084FC;
  --body-text: #F1F5F9;
  --secondary-text: #94A3B8;
  --badge-bg: #6366F1;
  --like-btn-bg: #FBCFE8;
  --like-btn-text: #831843;
  --like-btn-hover: #F9A8D4;
  --download-btn-bg: #DDD6FE;
  --download-btn-text: #4C1D95;
  --download-btn-hover: #C4B5FD;
  --edit-btn-bg: #FDE68A;
  --edit-btn-text: #92400E;
  --edit-btn-hover: #FCD34D;
  --blue-color-accent: #6366F1;
}
body.color-mode-animate {
  transition: background 0.3s;
}
body.dark-mode .categories-description .lead {
  color: #fff !important;
}
body.dark-mode .proverb-card,
body.dark-mode .card,
body.dark-mode .settings-section {
  background: var(--card-bg) !important;
  color: var(--body-text);
}
body.dark-mode .proverb-card .proverb-text-top,
body.dark-mode .card h2,
body.dark-mode .settings-section h2 {
  color: var(--header-color) !important;
}
body.dark-mode .proverb-card .proverb-text-bottom,
body.dark-mode .card .card-text,
body.dark-mode .settings-section,
body.dark-mode .settings-section p {
  color: var(--body-text) !important;
}
body.dark-mode .proverb-card .secondary,
body.dark-mode .card .secondary,
body.dark-mode .settings-section .secondary,
body.dark-mode .settings-section .description,
body.dark-mode .settings-section .warning-text {
  color: var(--secondary-text) !important;
}
body.dark-mode .category-label,
body.dark-mode .badge,
body.dark-mode .proverb-card .category-label {
  color: #fff !important;
}
body.dark-mode .like-button {
  background: var(--like-btn-bg) !important;
  color: var(--like-btn-text) !important;
}
body.dark-mode .like-button:hover {
  background: var(--like-btn-hover) !important;
}
body.dark-mode .download-button {
  background: var(--download-btn-bg) !important;
  color: var(--download-btn-text) !important;
}
body.dark-mode .download-button:hover {
  background: var(--download-btn-hover) !important;
}
body.dark-mode .edit-button {
  background: var(--download-btn-bg) !important;
  color: var(--download-btn-text) !important;
}
body.dark-mode .edit-button:hover {
  background: var(--download-btn-hover) !important;
}
body.dark-mode .header {
  background: var(--card-bg) !important;
}
body.dark-mode .search-button {
  background: linear-gradient(90deg, var(--primary-color) 80%, var(--secondary-color) 100%) !important;
  color: #fff !important;
  border: none;
}
body.dark-mode .search-button:hover, body.dark-mode .search-button:focus {
  background: linear-gradient(90deg, var(--primary-color) 80%, var(--secondary-color) 100%) !important;
  color: #fff !important;
}
body.dark-mode .search-container,
body.dark-mode .search-input-wrapper {
    background: var(--card-bg) !important;
}
body.dark-mode .search-input,
body.dark-mode select.form-control {
    background: #23263a !important;
    color: var(--text-color) !important;
    border: 1.5px solid var(--border-color) !important;
}
body.dark-mode .search-input::placeholder {
    color: #bdbdbd !important;
    opacity: 1;
}
body.dark-mode .search-icon {
    color: #C084FC !important;
}
body.dark-mode .search-box {
    background: #23263a !important;
    border: 3px solid #6366F1 !important;
    box-shadow: none !important;
}
body.dark-mode .search-input {
    background: #23263a !important;
    color: #fff !important;
}
body.dark-mode .search-input::placeholder {
    color: #888 !important;
    opacity: 1;
}
body.dark-mode .search-container,
body.dark-mode .language-selection,
body.dark-mode .quotes-container {
  background-color: var(--bg-color);
}

/* Remove background for quotes-grid in dark mode */
body.dark-mode .quotes-grid {
  background-color: transparent;
}

/* Dark mode for citaten-dropdowns */
body.dark-mode .citaten-dropdowns {
  background: var(--card-bg) !important;
  border-color: var(--border-color) !important;
}

body.dark-mode .citaten-select {
  color: var(--body-text) !important;
  background-color: var(--card-bg) !important;
}

body.dark-mode .proverb-category-accent {
    background: #7670da !important;
}

body.dark-mode .category-label {
    background: #7670da !important;
    color: #fff !important;
}

body.dark-mode .proverb-card-bubble,
body.dark-mode .category-label {
    background-color: #7670da !important;
    background: #7670da !important;
    color: #fff !important;
}

body.dark-mode .proverb-card:hover .proverb-text-top,
body.dark-mode .proverb-card:hover .proverb-text-bottom {
    color: #fff !important;
    transition-delay: 0.05s;
}

/* Prevent bubble expansion when editing in dark mode */
body.dark-mode .proverb-card.editing:hover .proverb-card-bubble {
    transform: scale(1) !important;
}

/* Ensure edit form is properly styled in dark mode */
body.dark-mode .edit-form {
    background: var(--card-bg) !important;
    box-shadow: 0 4px 24px rgba(118, 112, 218, 0.10), 0 1.5px 6px rgba(0,0,0,0.10);
    border: 1px solid var(--border-color);
}

body.dark-mode .edit-form textarea {
    background: #23263a;
    color: #eaeaea;
    border-color: #32323a;
} 

body.dark-mode .quote-card {
  background-color: var(--card-bg) !important;
  border-left: 4px solid var(--blue-color-accent) !important;
}

/* Dark mode styles for settings page form labels */
body.dark-mode .form-group label,
body.dark-mode .settings-form label {
  color: var(--header-color) !important;
  font-weight: 500 !important;
  font-family: 'Baloo 2', sans-serif !important;
  letter-spacing: 0.02em !important;
}

/* Profile settings specific styling */
body.dark-mode .settings-section.profile-card .settings-form label {
  color: var(--header-color) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  font-family: 'Baloo 2', sans-serif !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Settings form input styling in dark mode */
body.dark-mode .settings-form input {
  color: var(--body-text);
  font-size: 1rem;
  font-family: 'Baloo 2', sans-serif;
  background-color: var(--card-bg);
  border: 1px solid var(--border-color);
  transition: all 0.3s ease;
}

body.dark-mode .settings-form input:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 2px rgba(118, 112, 218, 0.2);
  outline: none;
}

/* Make footer match header in dark mode */
body.dark-mode footer {
  background-color: var(--card-bg) !important;
  border-top-color: var(--border-color) !important;
}

/* Update footer section styles to match dark mode theme */
body.dark-mode .footer-section h3 {
  color: var(--header-color) !important;
}

body.dark-mode .footer-brand span {
  color: var(--body-text) !important;
}

body.dark-mode .footer-tagline {
  color: var(--secondary-text) !important;
}

body.dark-mode .copyright {
  color: var(--secondary-text) !important;
}

body.dark-mode .footer-bottom {
  border-top-color: var(--border-color) !important;
}

/* Language icon specific styling for dark mode */
body.dark-mode .language-button .language-icon {
  border-color: #6366F1 !important;
}