/*
 * hpg-theme-light.css
 * -------------------
 * Light theme-specific styles for Hairtivity
 * Applied when body[data-hpg-theme="light"]
 */

/* ReSharper disable CssBrowserCompatibility */

/* Gallery background */
body[data-hpg-theme="light"] .hpg-gallery { background: var(--hpg-bg-light); }

/* ========================================
 * Product Card light mode styling
 * Soft pinkish backgrounds with prominent shadows
 * ======================================== */

body[data-hpg-theme="light"] .hpg-product-card { 
    background: var(--hpg-card-bg-light);
    box-shadow: 0 4px 20px 0 var(--hpg-shadow-dark-md), 0 2px 8px 0 var(--hpg-shadow-primary-33);
}

body[data-hpg-theme="light"] .hpg-product-card:hover,
body[data-hpg-theme="light"] .hpg-product-card:focus { 
    background: var(--hpg-card-bg-light-elevated);
    box-shadow: 0 8px 32px 0 var(--hpg-shadow-dark-lg), 0 4px 16px 0 var(--hpg-shadow-primary-44);
}

body[data-hpg-theme="light"] .hpg-product-card img { 
    background: transparent; 
}

/* Compact product card */
body[data-hpg-theme="light"] .hpg-product-card-compact { 
    background: var(--hpg-card-bg-light);
    box-shadow: 0 4px 20px 0 var(--hpg-shadow-dark-md), 0 2px 8px 0 var(--hpg-shadow-primary-33);
}

body[data-hpg-theme="light"] .hpg-product-card-compact-img { 
    background: transparent; 
}

/* ========================================
 * Product Detail Page light mode styling
 * ======================================== */

body[data-hpg-theme="light"] .hpg-popup-details {
    background: var(--hpg-card-bg-light);
    box-shadow: 0 6px 28px 0 var(--hpg-shadow-dark-md), 0 2px 12px 0 var(--hpg-shadow-primary-44);
}

body[data-hpg-theme="light"] .hpg-product-main-image {
    background: transparent;
}

body[data-hpg-theme="light"] .hpg-popup-package-img { 
    background: transparent; 
}

/* ========================================
 * Product Links Panel light mode styling
 * ======================================== */

body[data-hpg-theme="light"] .hpg-product-links {
    background: var(--hpg-card-bg-light);
    box-shadow: 0 4px 20px 0 var(--hpg-shadow-dark-md), 0 2px 8px 0 var(--hpg-shadow-primary-33);
}

body[data-hpg-theme="light"] .hpg-product-link-card { 
    background: var(--hpg-card-bg-light-elevated);
    box-shadow: 0 2px 8px 0 var(--hpg-shadow-dark-sm);
}

body[data-hpg-theme="light"] .hpg-product-link-card:hover,
body[data-hpg-theme="light"] .hpg-product-link-card:focus {
    background: var(--hpg-card-bg-light-subtle);
    box-shadow: 0 4px 16px 0 var(--hpg-shadow-dark-md);
}

body[data-hpg-theme="light"] .hpg-product-link-img { 
    background: transparent; 
}

/* ========================================
 * Carousel Modal light mode styling
 * ======================================== */

body[data-hpg-theme="light"] .hpg-carousel-content {
    background: var(--hpg-card-bg-light);
    box-shadow: 0 8px 40px 0 var(--hpg-shadow-dark-xl);
}

body[data-hpg-theme="light"] .hpg-carousel-image { 
    background: transparent;
    box-shadow: none;
}

/* Cart items list styling */

body[data-hpg-theme="light"] .hpg-cart-items li { background: var(--hpg-overlay-primary-08); }

body[data-hpg-theme="light"] .hpg-cart-items li:hover { background: var(--hpg-overlay-primary-12); }

/* Filter panel inputs */

body[data-hpg-theme="light"] .hpg-filter-panel input[type="text"],
body[data-hpg-theme="light"] .hpg-filter-panel input[type="email"],
body[data-hpg-theme="light"] .hpg-filter-panel input[type="tel"],
body[data-hpg-theme="light"] .hpg-filter-panel input[type="number"],
body[data-hpg-theme="light"] .hpg-filter-panel input[type="search"],
body[data-hpg-theme="light"] .hpg-filter-panel textarea,
body[data-hpg-theme="light"] .hpg-filter-panel select {
    background: var(--hpg-white);
    color: var(--hpg-text-dark);
}

/* Cart form panel inputs */

body[data-hpg-theme="light"] .hpg-cart-form-panel input[type="text"],
body[data-hpg-theme="light"] .hpg-cart-form-panel input[type="email"],
body[data-hpg-theme="light"] .hpg-cart-form-panel input[type="tel"],
body[data-hpg-theme="light"] .hpg-cart-form-panel input[type="number"],
body[data-hpg-theme="light"] .hpg-cart-form-panel textarea {
    background: var(--hpg-white);
    color: var(--hpg-text-dark);
}

/* Generic hpg-input class for light theme */

body[data-hpg-theme="light"] .hpg-input {
    background: var(--hpg-white);
    color: var(--hpg-text-dark);
}

/* Radio button styling for light theme */

body[data-hpg-theme="light"] .hpg-radio { background: var(--hpg-white); }

/* Autofill override for light theme */

body[data-hpg-theme="light"] .hpg-input:-webkit-autofill,
body[data-hpg-theme="light"] .hpg-input:-webkit-autofill:hover,
body[data-hpg-theme="light"] .hpg-input:-webkit-autofill:focus,
body[data-hpg-theme="light"] .hpg-input:-webkit-autofill:active,
body[data-hpg-theme="light"] input.hpg-input:-webkit-autofill,
body[data-hpg-theme="light"] input.hpg-input:-webkit-autofill:hover,
body[data-hpg-theme="light"] input.hpg-input:-webkit-autofill:focus,
body[data-hpg-theme="light"] input.hpg-input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px var(--hpg-white) inset !important;
    -webkit-text-fill-color: var(--hpg-text-dark) !important;
    background-color: var(--hpg-white) !important;
    color: var(--hpg-text-dark) !important;
}

/* Home page hero background */

body[data-hpg-theme="light"] .hpg-home-hero {
    /* Fallback solid color first for older browsers */
    background-color: var(--hpg-overlay-primary-15, #f5f5f5);
    /* Gradient overlay using explicit background-image so the color fallback remains */
    background-image: linear-gradient(135deg, var(--hpg-overlay-light-80, rgba(255, 255, 255, 0.8)) 0, var(--hpg-overlay-primary-15, rgba(245, 245, 245, 1)) 100%);
    background-repeat: no-repeat;
    background-size: cover;
    box-shadow: 0 10px 40px 0 var(--hpg-shadow-dark-lg), 0 2px 12px 0 var(--hpg-shadow-primary-44);
}

/* Respect users who prefer reduced motion / reduced visual effects */

@media (prefers-reduced-motion: reduce) {
    body[data-hpg-theme="light"] .hpg-home-hero {
        background-image: none;
        box-shadow: none;
    }
}

/* About page address block */

body[data-hpg-theme="light"] .hpg-about address { background: var(--hpg-overlay-primary-08); }

/* Product card brand - make it bolder and darker in light theme */

body[data-hpg-theme="light"] .hpg-product-brand {
    color: var(--hpg-brand-purple);
    font-weight: 700;
}

/* Header drop shadow for light mode */

body[data-hpg-theme="light"] .hpg-header { box-shadow: 0 4px 20px 0 var(--hpg-shadow-dark-md); }

/* Footer drop shadow for light mode */

body[data-hpg-theme="light"] .hpg-footer { box-shadow: 0 -4px 20px 0 var(--hpg-shadow-dark-md); }