/* Theme 2: Luxury Dark Theme */
/* Inspired by premium construction/metalwork aesthetic */

:root[data-theme="dark"] {
    --primary: #d4af37;
    --primary-dark: #b8941f;
    --secondary: #c9a961;
    --accent: #f4e4c1;
    --dark: #1a1a1a;
    --darker: #0d0d0d;
    --light: #2a2a2a;
    --text: #e8e8e8;
    --text-light: #b8b8b8;
    --text-primary: #f4e4c1;
    --text-secondary: #b8b8b8;
    --gold: #d4af37;
    --gold-light: #f4e4c1;
    --card-bg: #2a2a2a;
    --border-color: rgba(212, 175, 55, 0.2);
}

/* Dark Theme Overrides */
[data-theme="dark"] body {
    background: var(--darker);
    color: var(--text);
}

[data-theme="dark"] header {
    background: linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);
    border-bottom: 1px solid rgba(212, 175, 55, 0.2);
}

[data-theme="dark"] .header-top {
    background: rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .logo h1 {
    color: var(--gold);
    text-shadow: 0 0 20px rgba(212, 175, 55, 0.3);
}

[data-theme="dark"] nav a {
    color: var(--gold-light);
}

[data-theme="dark"] nav a:hover,
[data-theme="dark"] nav a.active {
    background: rgba(212, 175, 55, 0.2);
    color: var(--gold);
}

/* Hero Section - Dark */
[data-theme="dark"] .hero {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.8) 0%, rgba(26, 26, 26, 0.9) 100%),
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="rgba(212,175,55,0.1)" d="M0,96L48,112C96,128,192,160,288,160C384,160,480,128,576,122.7C672,117,768,139,864,138.7C960,139,1056,117,1152,101.3C1248,85,1344,75,1392,69.3L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>') no-repeat bottom;
    background-size: cover;
    border-bottom: 2px solid rgba(212, 175, 55, 0.3);
}

[data-theme="dark"] .hero h1 {
    color: var(--gold);
    text-shadow: 0 0 30px rgba(212, 175, 55, 0.5);
}

[data-theme="dark"] .btn-primary {
    background: linear-gradient(135deg, var(--gold) 0%, var(--gold-light) 100%);
    color: var(--darker);
    font-weight: 700;
    box-shadow: 0 5px 20px rgba(212, 175, 55, 0.4);
}

[data-theme="dark"] .btn-primary:hover {
    box-shadow: 0 10px 40px rgba(212, 175, 55, 0.6);
    transform: translateY(-3px);
}

[data-theme="dark"] .btn-outline {
    border-color: var(--gold);
    color: var(--gold);
}

[data-theme="dark"] .btn-outline:hover {
    background: var(--gold);
    color: var(--darker);
}

/* Sections - Dark */
[data-theme="dark"] .categories,
[data-theme="dark"] .products {
    background: var(--dark);
}

[data-theme="dark"] .about {
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.05) 0%, rgba(201, 169, 97, 0.05) 100%);
}

[data-theme="dark"] .section-title h2 {
    color: var(--gold);
    text-shadow: 0 0 20px rgba(212, 175, 55, 0.2);
}

[data-theme="dark"] .section-title p {
    color: var(--text-light);
}

/* Cards - Dark */
[data-theme="dark"] .category-card,
[data-theme="dark"] .product-card {
    background: linear-gradient(135deg, #2a2a2a 0%, #1f1f1f 100%);
    border: 1px solid rgba(212, 175, 55, 0.2);
}

[data-theme="dark"] .category-card:hover,
[data-theme="dark"] .product-card:hover {
    border-color: var(--gold);
    box-shadow: 0 15px 40px rgba(212, 175, 55, 0.3);
    transform: translateY(-10px);
}

[data-theme="dark"] .category-card h3,
[data-theme="dark"] .product-info h3 {
    color: var(--gold-light);
}

[data-theme="dark"] .category-card .count,
[data-theme="dark"] .product-category {
    background: linear-gradient(135deg, var(--gold) 0%, var(--secondary) 100%);
    color: var(--darker);
}

[data-theme="dark"] .product-price {
    color: var(--gold);
}

/* Footer - Dark */
[data-theme="dark"] footer {
    background: linear-gradient(135deg, #0d0d0d 0%, #1a1a1a 100%);
    border-top: 2px solid rgba(212, 175, 55, 0.3);
}

[data-theme="dark"] .footer-section h3 {
    color: var(--gold);
}

[data-theme="dark"] .footer-section a:hover {
    color: var(--gold);
}

/* Product Detail - Dark */
[data-theme="dark"] .breadcrumb {
    background: var(--light);
}

[data-theme="dark"] .breadcrumb a {
    color: var(--gold);
}

[data-theme="dark"] .product-info-detail {
    background: linear-gradient(135deg, #2a2a2a 0%, #1f1f1f 100%);
    border: 1px solid rgba(212, 175, 55, 0.2);
}

[data-theme="dark"] .product-category-badge {
    background: linear-gradient(135deg, var(--gold) 0%, var(--secondary) 100%);
    color: var(--darker);
}

[data-theme="dark"] .product-price-large {
    background: linear-gradient(135deg, var(--gold) 0%, var(--gold-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

[data-theme="dark"] .feature-item {
    background: rgba(212, 175, 55, 0.1);
    border-left: 3px solid var(--gold);
}

[data-theme="dark"] .feature-icon {
    background: linear-gradient(135deg, var(--gold) 0%, var(--secondary) 100%);
}

/* Mobile Menu - Dark */
[data-theme="dark"] nav {
    background: linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);
}

[data-theme="dark"] nav li {
    border-bottom-color: rgba(212, 175, 55, 0.2);
}

/* About Section - Dark Theme */
[data-theme="dark"] .about-text h2 {
    color: var(--gold) !important;
    text-shadow: 0 0 20px rgba(212, 175, 55, 0.3);
}

[data-theme="dark"] .about-text p {
    color: var(--text-light) !important;
}

[data-theme="dark"] .about-features .feature h4 {
    color: var(--gold-light) !important;
}

[data-theme="dark"] .about-features .feature-icon {
    background: linear-gradient(135deg, var(--gold) 0%, var(--secondary) 100%);
    color: var(--darker);
}