/* WHITE THEME */
/* Old: .layout[data-theme="white-theme"] { */
/* Updated: Apply theme variables to layout, nav.menu, footer, and mobile-menu */
.layout[data-theme="white-theme"],
nav.menu[data-theme="white-theme"],
.footer[data-theme="white-theme"],
.mobile-menu[data-theme="white-theme"] {
  --font-body: var(--font-sans);
  --font-title: var(--font-serif);
  --primary-bg: #ffffff;
  --sidebar-bg: #ffffff;
  --item-bg: #ffffff;
  --text-color: #000000;
  --title-color: #000000;
  --link-color: #222222;
  --link-hover: #007acc;
  --border-color: #dddddd;
  /* Old: --menu-bg: #000000; */
  /* Updated: Consistent with original white theme */
  --menu-bg: #222222;
  --menu-text: #ffffff;
  --footer-bg: #111111;
}

/* BLACK THEME */
/* Old: .layout[data-theme="black-theme"] { */
/* Updated: Apply theme variables to layout, nav.menu, footer, and mobile-menu */
.layout[data-theme="black-theme"],
nav.menu[data-theme="black-theme"],
.footer[data-theme="black-theme"],
.mobile-menu[data-theme="black-theme"] {
  --font-body: var(--font-global); /* Noto Serif */
  --font-title: var(--font-classic); /* Merriweather */
  --primary-bg: #000000;
  --sidebar-bg: #000000;
  --item-bg: #000000;
  --text-color: #e0e0e0;
  --title-color: #f0f0f0;
  --link-color: #cccccc;
  --link-hover: #ffffff;
  --menu-bg: #000000;
  --menu-text: #ffffff;
  --footer-bg: #000000;
}

/* Previous: Attempted to handle mobile menu backgrounds here */
/*
[data-theme="white-theme"] .mobile-menu .mobile-menu-bg {
  background-image: url('../assets/images/bottom-image-positive.jpg') !important;
}
[data-theme="black-theme"] .mobile-menu .mobile-menu-bg {
  background-image: url('../assets/images/bottom-image-negative.jpg') !important;
}
*/