/* Dark Mode Styles */
body.dark-mode {
  background-color: #121212;
  color: #e0e0e0;
}

/* Header Dark Mode */
body.dark-mode header {
  background: #1e1e1e;
  box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

body.dark-mode .top-header {
  background-color: #1e1e1e;
}

body.dark-mode .main-header {
  background: #2d2d2d;
}

body.dark-mode .linkmenukecil {
  color: #b0b0b0;
}

body.dark-mode .linkmenukecil:hover {
  color: #42b549;
}

/* Search Bar Dark Mode */
body.dark-mode .search-bar input {
  background-color: #2d2d2d;
  border-color: #3d3d3d;
  color: #e0e0e0;
}

body.dark-mode .search-bar input:focus {
  border-color: #42b549;
}

body.dark-mode .search-bar input::placeholder {
  color: #888;
}

/* Filter Dark Mode */
body.dark-mode .filter-dropdown {
  background: #2d2d2d;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

body.dark-mode .filter-section {
  border-bottom-color: #3d3d3d;
}

body.dark-mode .filter-section h4 {
  color: #e0e0e0;
}

body.dark-mode .filter-select {
  background-color: #2d2d2d;
  border-color: #3d3d3d;
  color: #e0e0e0;
}

body.dark-mode .filter-radio span {
  color: #e0e0e0;
}

body.dark-mode .price-input {
  background-color: #2d2d2d;
  border-color: #3d3d3d;
  color: #e0e0e0;
}

body.dark-mode .cancel-filter {
  background-color: #3d3d3d;
  color: #e0e0e0;
}

body.dark-mode .cancel-filter:hover {
  background-color: #4d4d4d;
}

/* Categories Dark Mode */
body.dark-mode .categories {
  background: #1e1e1e;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

body.dark-mode .categories h2 {
  color: #ff3d00;
}

body.dark-mode .category-icon {
  background: #2d2d2d;
}

body.dark-mode .category-item span {
  color: #b0b0b0;
}

/* Dark Mode Flash Sale Card Hover Effect */
body.dark-mode .card:hover {
  transform: translateY(-5px);
}

/* Flash Sale & Content Dark Mode */
body.dark-mode .flash-sale,
body.dark-mode .content-container {
  background: #1e1e1e;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

body.dark-mode .section-header h2 {
  color: #ff3d00;
}

body.dark-mode .card,
body.dark-mode .product-card {
  background: #2d2d2d;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

body.dark-mode .product-info h3,
body.dark-mode .card-content h3 {
  color: #e0e0e0;
}

body.dark-mode .location {
  color: #888;
}

body.dark-mode .sold-text {
  color: #888;
}

body.dark-mode .sold-bar {
  background: #3d3d3d;
}

/* Bubble Dark Mode */
body.dark-mode .bubble {
  background: #2d2d2d;
  color: #e0e0e0;
  box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

body.dark-mode .bubble::after {
  border-color: #2d2d2d transparent transparent;
}

/* Footer Dark Mode */
body.dark-mode footer {
  background: linear-gradient(180deg, #0d131b 0%, #080b10 100%);
}

body.dark-mode .footer-section ul li a {
  color: #b0b0b0;
}

body.dark-mode .footer-section ul li a:hover {
  color: #42b549;
}

body.dark-mode .footer-bottom {
  border-top-color: #2d2d2d;
  color: #888;
}

/* Dark mode styles for language toggle */
body.dark-mode .language-toggle {
  color: #b0b0b0;
}

body.dark-mode .language-toggle:hover {
  color: #42b549;
}

/* Dark Mode Toggle Button */
body.dark-mode .dark-mode-toggle {
  color: #42b549;
}

.dark-mode-toggle:hover {
  background-color: rgba(2, 255, 19, 0.1);
}

body.dark-mode .dark-mode-toggle:hover {
  background-color: rgba(2, 255, 19, 0.1);
}

/* Filter Button Dark Mode */
body.dark-mode .filter-btn {
  color: #42b549;
}

body.dark-mode .filter-btn:hover,
body.dark-mode .filter-btn.active {
  background-color: rgba(2, 255, 19, 0.1);
}

@media(max-width: 768px){
    body.dark-mode .filter-btn:hover,
    body.dark-mode .filter-btn.active {
      background-color: rgba(2, 255, 19, 0.1);
  }
}

/* Cart Button Dark Mode */
body.dark-mode .btncart {
  color: #42b549;
}

body.dark-mode .btncart:hover {
  background-color: rgba(2, 255, 19, 0.1);
}

/* Carousel Buttons Dark Mode */
body.dark-mode .carousel-btn,
body.dark-mode .banner-carousel .carousel-btn {
  background: #2d2d2d;
  color: #e0e0e0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}

body.dark-mode .carousel-btn:hover,
body.dark-mode .banner-carousel .carousel-btn:hover {
  background: #3d3d3d;
}

/*================================================BURGER MENU==============================================*/
/* Mobile Menu Dark Mode */
body.dark-mode #mobileMenu {
  background: #2d2d2d;
}

body.dark-mode #mobileMenu a {
  color: #e0e0e0;
  border-bottom-color: #3d3d3d;
}

body.dark-mode #mobileMenu a:hover {
  background: #3d3d3d;
}

/* Mobile Actions Dark Mode */
body.dark-mode .mobile-actions a {
  color: #42b549;
}

body.dark-mode .mobile-actions a:hover {
  background-color: rgba(2, 255, 19, 0.1);
}

/* Dark mode styles untuk animasi mobile menu */
body.dark-mode .menu-overlay {
  background-color: rgba(0, 0, 0, 0.7);
}

body.dark-mode .menu-header {
  background: #1a1a1a;
  color: #e0e0e0;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

body.dark-mode #mobileMenu {
  background: #252525;
  box-shadow: 4px 0 15px rgba(0, 0, 0, 0.3);
}

body.dark-mode #mobileMenu a {
  color: #e0e0e0;
  border-bottom: 1px solid #3a3a3a;
}

body.dark-mode #mobileMenu a:hover {
  background-color: #3a3a3a;
  color: #42b549;
}

body.dark-mode .burger-menu span {
  background-color: #42b549;
}

body.dark-mode .burger-menu.active span {
  background-color: #42b549;
}
/*================================================BURGER MENU==============================================*/
/* Mobile Header Top Dark Mode */
body.dark-mode .mobile-header-top {
  background-color: #1e1e1e;
}

/* Banner Carousel Dark Mode */
body.dark-mode .banner-carousel .carousel-indicators .indicator {
  background: #555;
}

body.dark-mode .banner-carousel .carousel-indicators .indicator.active {
  background: #42b549;
}

/* Floating Image Dark Mode */
body.dark-mode .floating-image {
  background: #42b549;
}

/* Dark mode styles for autocomplete */
body.dark-mode .autocomplete-results {
  background: #2d2d2d;
  border-color: #3d3d3d;
  color: #e0e0e0;
}

body.dark-mode .autocomplete-results div:hover {
  background-color: #3d3d3d;
}

/* Dark mode styles for login/register buttons */
body.dark-mode .btnmasuk {
  border-color: #42b549;
  color: #42b549;
}

body.dark-mode .btndaftar {
  border-color: #42b549;
  background-color: #42b549;
  color: #fff;
}

/* Dark mode styles for see-all link */
body.dark-mode .see-all {
  color: #42b549;
}

/* Dark mode styles for countdown */
body.dark-mode .countdown {
  color: #b0b0b0;
}

/* Dark Mode Filter Button Mobile */
body.dark-mode .mobile-filter-btn {
  color: #42b549;
}

body.dark-mode .mobile-filter-btn:hover,
body.dark-mode .mobile-filter-btn.active {
  background-color: rgba(2, 255, 19, 0.1);
}
/*=================================featured produk dark mode===================================*/
/* Featured Products Dark Mode */
body.dark-mode .featured-products {
  background: #1e1e1e;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

body.dark-mode .featured-products .section-header h2 {
  color: #ff3d00;
}

body.dark-mode .featured-badge {
  background: #42b549;
}

/* Modal Dark Mode */
body.dark-mode .modal-content {
  background: #2d2d2d;
  color: #e0e0e0;
}

body.dark-mode .close-modal {
  color: #b0b0b0;
}
/*=================================akhir featured produk dark mode===================================*/