/* Dark Mode Styles for Products & Online Shop Pages */

/* Base Dark Mode */
body.dark-mode {
    background: #1a1a1a;
    color: #e5e7eb;
}

/* Header & Navigation */
body.dark-mode header,
body.dark-mode nav {
    background: rgba(26, 26, 26, 0.95) !important;
    border-bottom-color: #374151;
}

body.dark-mode .bg-white {
    background: #2d2d2d !important;
    color: #e5e7eb;
}

/* Product Cards */
body.dark-mode .product-card {
    background: #2d2d2d !important;
    border-color: #374151 !important;
    color: #e5e7eb !important;
}

body.dark-mode .product-card:hover {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

body.dark-mode .product-name,
body.dark-mode .product-title {
    color: #e5e7eb !important;
}

body.dark-mode .product-description {
    color: #9ca3af !important;
}

/* Text Colors */
body.dark-mode .text-gray-800,
body.dark-mode .text-gray-900 {
    color: #e5e7eb !important;
}

body.dark-mode .text-gray-700 {
    color: #d1d5db !important;
}

body.dark-mode .text-gray-600 {
    color: #9ca3af !important;
}

body.dark-mode .text-gray-500 {
    color: #9ca3af !important;
}

body.dark-mode .text-gray-400 {
    color: #6b7280 !important;
}

/* Background Colors */
body.dark-mode .bg-gray-50,
body.dark-mode .bg-gray-100 {
    background: #2d2d2d !important;
}

body.dark-mode .bg-gray-200 {
    background: #374151 !important;
}

body.dark-mode .bg-amber-50 {
    background: #422006 !important;
}

body.dark-mode .bg-blue-50 {
    background: #1e3a8a !important;
}

body.dark-mode .bg-green-50 {
    background: #14532d !important;
}

/* Borders */
body.dark-mode .border-gray-200,
body.dark-mode .border-gray-300 {
    border-color: #374151 !important;
}

body.dark-mode .border-amber-100,
body.dark-mode .border-amber-200 {
    border-color: #78350f !important;
}

/* Shadows */
body.dark-mode .shadow-lg,
body.dark-mode .shadow-xl,
body.dark-mode .shadow-2xl {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.5), 0 10px 10px -5px rgba(0, 0, 0, 0.3) !important;
}

/* Modals & Overlays */
body.dark-mode .modal,
body.dark-mode .overlay {
    background: rgba(0, 0, 0, 0.85) !important;
}

body.dark-mode .modal-content,
body.dark-mode .modal-body {
    background: #2d2d2d !important;
    color: #e5e7eb !important;
    border-color: #374151 !important;
}

body.dark-mode .modal-header {
    background: #1a1a1a !important;
    border-bottom-color: #374151 !important;
    color: #e5e7eb !important;
}

/* Forms & Inputs */
body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select {
    background: #1a1a1a !important;
    color: #e5e7eb !important;
    border-color: #374151 !important;
}

body.dark-mode input:focus,
body.dark-mode textarea:focus,
body.dark-mode select:focus {
    background: #2d2d2d !important;
    border-color: #f59e0b !important;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
    color: #6b7280 !important;
}

/* Buttons */
body.dark-mode .btn-secondary,
body.dark-mode .button-secondary {
    background: #374151 !important;
    color: #e5e7eb !important;
}

body.dark-mode .btn-secondary:hover,
body.dark-mode .button-secondary:hover {
    background: #4b5563 !important;
}

body.dark-mode .border-amber-600 {
    border-color: #f59e0b !important;
}

body.dark-mode .text-amber-600 {
    color: #f59e0b !important;
}

/* Dropdowns */
body.dark-mode .dropdown-menu,
body.dark-mode .dropdown-content {
    background: #2d2d2d !important;
    border-color: #374151 !important;
}

body.dark-mode .dropdown-item {
    color: #e5e7eb !important;
}

body.dark-mode .dropdown-item:hover {
    background: #1a1a1a !important;
}

body.dark-mode .dropdown-divider {
    border-color: #374151 !important;
}

/* Sidebar & Categories */
body.dark-mode .sidebar,
body.dark-mode .category-sidebar {
    background: #2d2d2d !important;
    border-color: #374151 !important;
}

body.dark-mode .category-item {
    color: #e5e7eb !important;
}

body.dark-mode .category-item:hover {
    background: #374151 !important;
}

body.dark-mode .category-item.active {
    background: #78350f !important;
    color: #fff !important;
}

/* Search Bar */
body.dark-mode .search-bar,
body.dark-mode .search-input {
    background: #2d2d2d !important;
    color: #e5e7eb !important;
    border-color: #374151 !important;
}

/* Filters */
body.dark-mode .filter-section {
    background: #2d2d2d !important;
    border-color: #374151 !important;
}

body.dark-mode .filter-title {
    color: #e5e7eb !important;
}

body.dark-mode .filter-option {
    color: #d1d5db !important;
}

body.dark-mode .filter-option:hover {
    background: #374151 !important;
}

/* Tabs */
body.dark-mode .tab {
    background: #2d2d2d !important;
    color: #9ca3af !important;
    border-color: #374151 !important;
}

body.dark-mode .tab.active,
body.dark-mode .tab.selected {
    background: #f59e0b !important;
    color: #fff !important;
}

/* Badges & Tags */
body.dark-mode .badge,
body.dark-mode .tag {
    background: #374151 !important;
    color: #e5e7eb !important;
}

body.dark-mode .badge-success {
    background: #14532d !important;
    color: #86efac !important;
}

body.dark-mode .badge-warning {
    background: #78350f !important;
    color: #fcd34d !important;
}

/* Toast Notifications */
body.dark-mode .toast,
body.dark-mode .notification {
    background: #2d2d2d !important;
    color: #e5e7eb !important;
    border-color: #374151 !important;
}

/* Footer */
body.dark-mode footer {
    background: #1a1a1a !important;
    border-top-color: #374151 !important;
}

body.dark-mode footer a {
    color: #93c5fd !important;
}

body.dark-mode footer a:hover {
    color: #60a5fa !important;
}

/* Loading Spinner */
body.dark-mode .spinner,
body.dark-mode .loading {
    border-color: #374151 !important;
    border-top-color: #f59e0b !important;
}

/* Pagination */
body.dark-mode .pagination button {
    background: #2d2d2d !important;
    color: #e5e7eb !important;
    border-color: #374151 !important;
}

body.dark-mode .pagination button:hover {
    background: #374151 !important;
}

body.dark-mode .pagination button.active {
    background: #f59e0b !important;
    color: #fff !important;
}

/* Reviews & Ratings */
body.dark-mode .review-card {
    background: #2d2d2d !important;
    border-color: #374151 !important;
}

body.dark-mode .review-author {
    color: #e5e7eb !important;
}

body.dark-mode .review-text {
    color: #d1d5db !important;
}

/* Image Gallery */
body.dark-mode .gallery-thumbnail {
    border-color: #374151 !important;
}

body.dark-mode .gallery-thumbnail.active {
    border-color: #f59e0b !important;
}

/* Shopping Cart */
body.dark-mode .cart-item {
    background: #2d2d2d !important;
    border-color: #374151 !important;
}

body.dark-mode .cart-total {
    background: #1a1a1a !important;
    color: #e5e7eb !important;
}

/* Favorites Panel */
body.dark-mode .favorites-panel {
    background: #2d2d2d !important;
    border-color: #374151 !important;
}

body.dark-mode .favorites-panel-header {
    background: #1a1a1a !important;
    border-bottom-color: #374151 !important;
    color: #e5e7eb !important;
}

/* Mobile Menu */
body.dark-mode .mobile-sidebar {
    background: linear-gradient(160deg, #1a1a1a 0%, #0d0805 60%, #0a0604 100%) !important;
    border-left-color: #78350f !important;
}

body.dark-mode .mobile-sidebar-header {
    color: #ffcc66 !important;
    border-bottom-color: rgba(255, 204, 102, 0.2) !important;
}

body.dark-mode .mobile-sidebar-links a {
    color: #d1d5db !important;
    border-bottom-color: rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .mobile-sidebar-links a:hover {
    background: rgba(245, 158, 11, 0.1) !important;
}

/* Hover Effects */
body.dark-mode .hover\:bg-amber-50:hover {
    background: #422006 !important;
}

body.dark-mode .hover\:bg-gray-100:hover {
    background: #374151 !important;
}

body.dark-mode .hover\:bg-gray-50:hover {
    background: #2d2d2d !important;
}

/* Currency Buttons */
body.dark-mode .currency-btn {
    background: #2d2d2d !important;
    color: #e5e7eb !important;
    border-color: #374151 !important;
}

body.dark-mode .currency-btn.active {
    background: #f59e0b !important;
    color: #fff !important;
}

/* Product Details */
body.dark-mode .product-detail-section {
    background: #2d2d2d !important;
    border-color: #374151 !important;
}

body.dark-mode .product-specs {
    background: #1a1a1a !important;
}

body.dark-mode .spec-item {
    border-color: #374151 !important;
}

/* Scrollbar */
body.dark-mode::-webkit-scrollbar {
    width: 12px;
}

body.dark-mode::-webkit-scrollbar-track {
    background: #1a1a1a;
}

body.dark-mode::-webkit-scrollbar-thumb {
    background: #374151;
    border-radius: 6px;
}

body.dark-mode::-webkit-scrollbar-thumb:hover {
    background: #4b5563;
}

/* Transitions */
body.dark-mode * {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}