/* ===== DARK MODE STYLES ===== */

/* Dark Mode Toggle Button */
.dark-mode-toggle {
    position: relative;
    width: 24px;
    height: 24px;
    cursor: pointer;
    border: none;
    background: transparent;
    padding: 0;
    color: var(--gray-600);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dark-mode-toggle:hover {
    color: var(--navy-primary);
    transform: rotate(15deg);
}

.dark-mode-toggle svg {
    width: 22px;
    height: 22px;
    transition: all 0.3s ease;
}

.dark-mode-toggle .icon-sun {
    display: none;
}

.dark-mode-toggle .icon-moon {
    display: block;
}

/* Toggle Icons in Dark Mode */
[data-theme="dark"] .dark-mode-toggle .icon-sun {
    display: block;
}

[data-theme="dark"] .dark-mode-toggle .icon-moon {
    display: none;
}

/* Header Dark Mode Toggle */
.header-action.dark-mode-toggle {
    padding: 0;
}

/* Dark Mode Variables */
[data-theme="dark"] {
    --color-page-bg: #0f1419;
    --color-card-bg: #1a1f26;
    --color-card-bg-secondary: #242a33;
    --color-text-body: #b0b8c4;
    --color-text-heading: #e8eaed;
    --color-footer-bg: #0a0d10;
    --color-footer-text: #8b939d;

    --body-bg: var(--color-page-bg);
    --card-bg: var(--color-card-bg);

    --white: #1a1f26;
    --off-white: #1e242b;
    --gray-100: #232a33;
    --gray-200: #2d3640;
    --gray-300: #3d4654;
    --gray-400: #5a6577;
    --gray-500: #7d8899;
    --gray-600: #9aa5b4;
    --gray-700: #b0b8c4;
    --gray-800: #c8ced6;
    --gray-900: #e8eaed;
    --black: #ffffff;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow: 0 1px 3px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.35), 0 2px 4px rgba(0, 0, 0, 0.25);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.3), 0 4px 6px rgba(0, 0, 0, 0.2);
    --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.4), 0 10px 10px rgba(0, 0, 0, 0.2);
}

/* Body Transition */
body {
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Top Navigation */
[data-theme="dark"] .top-nav {
    background: var(--color-card-bg);
    border-color: var(--gray-200);
}

[data-theme="dark"] .top-nav-link {
    color: var(--gray-600);
}

[data-theme="dark"] .top-nav-link:hover {
    color: var(--navy-primary);
}

/* Announcement Bar */
[data-theme="dark"] .announcement-bar {
    background: linear-gradient(90deg, #1a3a50, #2a4a60);
}

/* Main Header */
[data-theme="dark"] .main-header {
    background: var(--color-card-bg);
    border-color: var(--gray-200);
    box-shadow: var(--shadow);
}

[data-theme="dark"] .logo-text {
    color: var(--gray-900);
}

[data-theme="dark"] .search-wrapper {
    background: var(--gray-100);
    border-color: var(--gray-200);
}

[data-theme="dark"] .search-input {
    background: transparent;
    color: var(--gray-900);
}

[data-theme="dark"] .search-input::placeholder {
    color: var(--gray-500);
}

[data-theme="dark"] .search-btn {
    background: var(--navy-primary);
}

/* Header Actions */
[data-theme="dark"] .header-action {
    color: var(--gray-700);
}

[data-theme="dark"] .header-action:hover {
    color: var(--navy-primary);
}

[data-theme="dark"] .action-count {
    background: var(--navy-primary);
    color: #ffffff;
}

/* Category Navigation */
[data-theme="dark"] .category-nav {
    background: var(--color-card-bg);
    border-color: var(--gray-200);
}

[data-theme="dark"] .category-item {
    background: var(--gray-100);
}

[data-theme="dark"] .category-item:hover {
    background: var(--gray-200);
}

[data-theme="dark"] .category-name {
    color: var(--gray-800);
}

[data-theme="dark"] .category-image {
    background: var(--gray-200);
}

[data-theme="dark"] .category-placeholder {
    color: var(--gray-500);
}

/* Category Slider Arrows */
[data-theme="dark"] .category-slider .swiper-button-prev,
[data-theme="dark"] .category-slider .swiper-button-next {
    background: var(--gray-200);
    color: var(--gray-700);
}

[data-theme="dark"] .category-slider .swiper-button-prev:hover,
[data-theme="dark"] .category-slider .swiper-button-next:hover {
    background: var(--navy-primary);
}

/* Mobile Menu */
[data-theme="dark"] .mobile-menu {
    background: var(--color-card-bg);
}

[data-theme="dark"] .mobile-menu-header {
    border-color: var(--gray-200);
}

[data-theme="dark"] .mobile-menu-title {
    color: var(--gray-900);
}

[data-theme="dark"] .mobile-menu-link {
    color: var(--gray-700);
    border-color: var(--gray-200);
}

[data-theme="dark"] .mobile-menu-link:hover {
    background: var(--gray-100);
    color: var(--navy-primary);
}

[data-theme="dark"] .mobile-menu-overlay {
    background: rgba(0, 0, 0, 0.8);
}

/* Product Cards */
[data-theme="dark"] .product-card {
    background: var(--color-card-bg);
}

[data-theme="dark"] .product-card:hover {
    box-shadow: var(--shadow-lg);
}

[data-theme="dark"] .product-wishlist {
    background: var(--gray-200);
    color: var(--gray-500);
}

[data-theme="dark"] .product-quick-view {
    background: var(--gray-200);
    color: var(--gray-500);
}

[data-theme="dark"] .product-image {
    background: var(--gray-100);
}

[data-theme="dark"] .product-no-image {
    color: var(--gray-400);
}

[data-theme="dark"] .product-title {
    color: var(--gray-900);
}

[data-theme="dark"] .product-category {
    color: var(--gray-500);
}

[data-theme="dark"] .out-of-stock {
    background: var(--gray-200);
    color: var(--gray-500);
}

/* Hero Section */
[data-theme="dark"] .hero-section .swiper-slide {
    background: var(--color-card-bg);
}

[data-theme="dark"] .hero-content h2 {
    color: var(--gray-900);
}

[data-theme="dark"] .hero-content p {
    color: var(--gray-600);
}

/* Sections */
[data-theme="dark"] .section-title {
    color: var(--gray-900);
}

[data-theme="dark"] .section-link {
    color: var(--navy-primary);
}

/* Shop Page */
[data-theme="dark"] .shop-page {
    background: var(--body-bg);
}

[data-theme="dark"] .shop-title {
    color: var(--gray-900);
}

[data-theme="dark"] .shop-controls {
    background: var(--color-card-bg);
}

[data-theme="dark"] .shop-count {
    color: var(--gray-600);
}

[data-theme="dark"] .shop-sort select {
    background: var(--gray-100);
    border-color: var(--gray-300);
    color: var(--gray-800);
}

/* Shop Sidebar */
[data-theme="dark"] .shop-sidebar {
    background: var(--color-card-bg);
}

[data-theme="dark"] .widget {
    border-color: var(--gray-200);
}

[data-theme="dark"] .widget-title {
    color: var(--gray-900);
}

[data-theme="dark"] .widget li a {
    color: var(--gray-600);
}

[data-theme="dark"] .widget li a:hover {
    color: var(--navy-primary);
}

[data-theme="dark"] .widget li .count {
    background: var(--gray-200);
    color: var(--gray-600);
}

/* Category Images in Sidebar */
[data-theme="dark"] .sidebar-category-item {
    background: var(--gray-100);
    border-color: var(--gray-200);
}

[data-theme="dark"] .sidebar-category-item:hover {
    border-color: var(--navy-primary);
}

/* Price Filter */
[data-theme="dark"] .price-filter input {
    background: var(--gray-100);
    border-color: var(--gray-300);
    color: var(--gray-800);
}

/* Single Product */
[data-theme="dark"] .single-product-page {
    background: var(--body-bg);
}

[data-theme="dark"] .product-main-image {
    background: var(--gray-100);
}

[data-theme="dark"] .product-thumbnail {
    border-color: var(--gray-300);
}

[data-theme="dark"] .product-thumbnail.active,
[data-theme="dark"] .product-thumbnail:hover {
    border-color: var(--navy-primary);
}

[data-theme="dark"] .product-details .product-title {
    color: var(--gray-900);
}

[data-theme="dark"] .product-excerpt {
    color: var(--gray-600);
}

[data-theme="dark"] .product-meta {
    background: var(--gray-100);
}

[data-theme="dark"] .product-meta-label {
    color: var(--gray-500);
}

[data-theme="dark"] .product-meta-value {
    color: var(--gray-800);
}

/* Quantity Input */
[data-theme="dark"] .quantity {
    border-color: var(--gray-300);
}

[data-theme="dark"] .quantity button {
    color: var(--gray-600);
}

[data-theme="dark"] .quantity button:hover {
    background: var(--gray-200);
}

[data-theme="dark"] .quantity input {
    background: var(--gray-100);
    border-color: var(--gray-300);
    color: var(--gray-900);
}

/* Tabs */
[data-theme="dark"] .tabs-nav {
    border-color: var(--gray-200);
}

[data-theme="dark"] .tab-btn {
    color: var(--gray-500);
}

[data-theme="dark"] .tab-btn:hover,
[data-theme="dark"] .tab-btn.active {
    color: var(--navy-primary);
    border-color: var(--navy-primary);
}

[data-theme="dark"] .tab-content h3 {
    color: var(--gray-900);
}

[data-theme="dark"] .tab-content p {
    color: var(--gray-600);
}

/* Related Products */
[data-theme="dark"] .related-products {
    background: var(--color-card-bg-secondary);
}

/* Quick View Modal */
[data-theme="dark"] .quick-view-modal {
    background: var(--color-card-bg);
}

[data-theme="dark"] .quick-view-close {
    background: var(--gray-200);
    color: var(--gray-700);
}

[data-theme="dark"] .quick-view-close:hover {
    background: var(--sale-red);
    color: #ffffff;
}

[data-theme="dark"] .quick-view-gallery {
    background: var(--gray-100);
}

[data-theme="dark"] .quick-view-thumbnails {
    background: var(--color-card-bg);
}

[data-theme="dark"] .quick-view-thumb {
    border-color: var(--gray-300);
}

[data-theme="dark"] .quick-view-nav {
    background: var(--gray-200);
    color: var(--gray-700);
}

[data-theme="dark"] .quick-view-nav:hover {
    background: var(--navy-primary);
    color: #ffffff;
}

[data-theme="dark"] .quick-view-title {
    color: var(--gray-900);
}

[data-theme="dark"] .quick-view-meta {
    color: var(--gray-500);
}

[data-theme="dark"] .quick-view-excerpt {
    color: var(--gray-600);
}

[data-theme="dark"] .quick-view-option-btn {
    background: var(--gray-100);
    border-color: var(--gray-300);
    color: var(--gray-700);
}

[data-theme="dark"] .quick-view-option-btn:hover,
[data-theme="dark"] .quick-view-option-btn.active {
    background: var(--navy-primary);
    border-color: var(--navy-primary);
    color: #ffffff;
}

[data-theme="dark"] .quick-view-quantity-control {
    border-color: var(--gray-300);
}

[data-theme="dark"] .quick-view-qty-btn {
    background: var(--gray-200);
    color: var(--gray-700);
}

[data-theme="dark"] .quick-view-qty-input {
    background: var(--gray-100);
    border-color: var(--gray-300);
    color: var(--gray-900);
}

[data-theme="dark"] .quick-view-wishlist-btn {
    border-color: var(--gray-300);
    color: var(--gray-500);
}

/* Features Section */
[data-theme="dark"] .feature-box {
    background: var(--color-card-bg);
}

[data-theme="dark"] .feature-icon {
    background: var(--gray-100);
}

[data-theme="dark"] .feature-title {
    color: var(--gray-900);
}

[data-theme="dark"] .feature-desc {
    color: var(--gray-600);
}

/* Collections */
[data-theme="dark"] .collection-item {
    background: var(--gray-100);
}

[data-theme="dark"] .collection-title {
    color: var(--gray-900);
}

/* Promo Cards */
[data-theme="dark"] .promo-card {
    background: var(--color-card-bg);
}

[data-theme="dark"] .promo-title {
    color: var(--gray-900);
}

[data-theme="dark"] .promo-desc {
    color: var(--gray-600);
}

/* Footer */
[data-theme="dark"] .main-footer {
    background: var(--color-footer-bg);
}

[data-theme="dark"] .footer-logo-text {
    color: var(--gray-900);
}

[data-theme="dark"] .footer-desc {
    color: var(--color-footer-text);
}

[data-theme="dark"] .footer-title {
    color: var(--gray-900);
}

[data-theme="dark"] .footer-link {
    color: var(--color-footer-text);
}

[data-theme="dark"] .footer-link:hover {
    color: var(--navy-primary);
}

[data-theme="dark"] .footer-contact-item {
    color: var(--color-footer-text);
}

[data-theme="dark"] .footer-bottom {
    border-color: var(--gray-200);
}

[data-theme="dark"] .footer-copyright {
    color: var(--color-footer-text);
}

[data-theme="dark"] .social-link {
    background: var(--gray-200);
    color: var(--gray-600);
}

[data-theme="dark"] .social-link:hover {
    background: var(--navy-primary);
    color: #ffffff;
}

/* Back to Top Button */
[data-theme="dark"] .back-to-top {
    background: var(--color-card-bg);
    color: var(--gray-700);
    box-shadow: var(--shadow-lg);
}

[data-theme="dark"] .back-to-top:hover {
    background: var(--navy-primary);
    color: #ffffff;
}

/* Scrollbar */
[data-theme="dark"] ::-webkit-scrollbar-track {
    background: var(--gray-100);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: var(--gray-400);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: var(--gray-500);
}

/* Buttons */
[data-theme="dark"] .btn-outline {
    border-color: var(--navy-primary);
    color: var(--navy-primary);
}

[data-theme="dark"] .btn-outline:hover {
    background: var(--navy-primary);
    color: #ffffff;
}

[data-theme="dark"] .btn-white {
    background: var(--color-card-bg);
    color: var(--navy-primary);
}

[data-theme="dark"] .btn-white:hover {
    background: var(--gray-100);
}

/* WooCommerce Pages */
[data-theme="dark"] .woocommerce-info,
[data-theme="dark"] .woocommerce-message {
    background: var(--color-card-bg);
    border-color: var(--navy-primary);
    color: var(--gray-800);
}

[data-theme="dark"] .woocommerce-error {
    background: var(--color-card-bg);
    border-color: var(--sale-red);
    color: var(--gray-800);
}

[data-theme="dark"] .woocommerce form,
[data-theme="dark"] .woocommerce-cart-form,
[data-theme="dark"] .woocommerce-checkout {
    background: var(--color-card-bg);
    border-radius: var(--radius-lg);
}

[data-theme="dark"] .woocommerce table.shop_table {
    background: var(--color-card-bg);
}

[data-theme="dark"] .woocommerce table.shop_table th,
[data-theme="dark"] .woocommerce table.shop_table td {
    border-color: var(--gray-200);
    color: var(--gray-800);
}

[data-theme="dark"] .woocommerce table.shop_table thead {
    background: var(--gray-100);
}

[data-theme="dark"] .woocommerce input,
[data-theme="dark"] .woocommerce select,
[data-theme="dark"] .woocommerce textarea {
    background: var(--gray-100);
    border-color: var(--gray-300);
    color: var(--gray-900);
}

/* Pagination */
[data-theme="dark"] .woocommerce-pagination a,
[data-theme="dark"] .woocommerce-pagination span {
    background: var(--color-card-bg);
    color: var(--gray-700);
    border-color: var(--gray-300);
}

[data-theme="dark"] .woocommerce-pagination a:hover,
[data-theme="dark"] .woocommerce-pagination .current {
    background: var(--navy-primary);
    color: #ffffff;
    border-color: var(--navy-primary);
}

/* Selection */
[data-theme="dark"] ::selection {
    background: var(--navy-primary);
    color: #ffffff;
}

/* Lang Switcher */
[data-theme="dark"] .lang-switcher {
    color: var(--gray-700);
}

/* Animation for toggle */
@keyframes darkModeIn {
    0% {
        opacity: 0;
        transform: scale(0.95);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

[data-theme="dark"] body {
    animation: darkModeIn 0.3s ease-out;
}