body.dark-mode {
  background-color: #121212;
  color: #f2f2f2;
}

body.dark-mode .container {
  background-color: #1c1c1c;
}

body.dark-mode .header {
  background: linear-gradient(to right, #111111, #333333);
  color: #f2f2f2;
}

body.dark-mode .search-container {
  background-color: #1e1e1e;
  color: white;
}

body.dark-mode .search-box {
  background-color: #2a2a2a;
  color: #f2f2f2;
}

body.dark-mode .search-box input {
  color: white;
}

body.dark-mode .search-box input::placeholder {
  color: #ffffff;
}

body.dark-mode .nav-tabs {
  background-color: #111;
  --shadow: rgba(255, 255, 255, 0.1);
}

body.dark-mode .nav-tab {
  color: #bbb;
}

body.dark-mode .nav-tab.active,
body.dark-mode .nav-tab:hover {
  background-color: #444;
  color: #fff;
}

body.dark-mode .see-all {
  color: #ddd;
}

body.dark-mode .menu-item {
  background-color: #2c2c2c;
  box-shadow: 0 0 20px rgba(250, 250, 250, 0.336);
}

body.dark-mode .menu-item .item-name,
body.dark-mode .menu-item .item-description,
body.dark-mode .menu-item .price {
  color: #eee;
}

body.dark-mode .favorite-btn {
  color: #ccc;
}

body.dark-mode .favorite-btn:hover {
  background: rgba(255, 0, 0, 0.15);
  color: #ff5c5c;
}

body.dark-mode .iframe-modal {
  background: rgba(18, 18, 18, 0.98);
}

body.dark-mode .close-btn {
  background: #222;
  color: #eee;
}

body.dark-mode .close-btn:hover {
  background-color: #444;
}

body.dark-mode .lang-btns button {
  background-color: #000;
  color: white;
}

body.dark-mode .lang-btns button:hover {
  background-color: #222;
}

body.dark-mode .lang-btns button.active {
  background-color: #777;
}

body.dark-mode .page-content .settings-title {
  color: #f2f2f2;
}

body.dark-mode .page-content .setting-label span {
  color: #ccc;
}

body.dark-mode .page-content .slider {
  background-color: #555;
}

body.dark-mode .page-content .slider:before {
  background-color: #ddd;
}

body.dark-mode .page-content-settings {
  background-color: #1a1a1a;
  color: #f2f2f2;
}

body.dark-mode .page-content-settings .settings-title {
  color: #f2f2f2;
}

body.dark-mode .page-content-settings .setting-label span {
  color: #ccc;
}

body.dark-mode .page-content-settings .slider {
  background-color: #555;
}

body.dark-mode .page-content-settings .slider:before {
  background-color: #ddd;
}

body.dark-mode .page-content-settings .settings-content,
body.dark-mode .page-content .settings-content {
  color: #bbb;
}

body.dark-mode .social-icon {
  filter: grayscale(0%) brightness(1.2) drop-shadow(0 2px 2px rgba(255, 255, 255, 0.1));
}