/* ============================================================
   Standard white mode — the primary Den-mas website experience.
   This deliberately uses clean white surfaces instead of tinted cards.
   ============================================================ */

html[data-theme="light"] {
    color-scheme: light;
    --white: #ffffff;
    --bg-light: #f8fafc;
    --off-white: #f8fafc;
    --surface: #ffffff;
    --text-dark: #172033;
    --text-main: #172033;
    --text-light: #526174;
    --text-muted: #526174;
    --border: #dbe3ee;
    --navy: #172b4d;
    --navy-mid: #223b65;
    /* Keep the same brand orange used in dark mode.  Button labels use a
       dark foreground below, preserving contrast without changing the hue. */
    --primary-color: #f39c12;
    --primary-dark: #e67e22;
    --gold: #f39c12;
    --gold-dark: #e67e22;
    --brand: #f59e0b;
    --brand-strong: #d97706;
    --brand-soft: #fff1e4;
}

html[data-theme="light"] body { background: #fff !important; color: #172033; }

/* A clear page structure: white content, then a restrained section break. */
html[data-theme="light"] .services-preview,
html[data-theme="light"] .testimonials-home,
html[data-theme="light"] .about-intro,
html[data-theme="light"] .why-choose-about,
html[data-theme="light"] .contact-content,
html[data-theme="light"] .categories-section,
html[data-theme="light"] .designs-section,
html[data-theme="light"] .projects-section,
html[data-theme="light"] .services-section,
html[data-theme="light"] .services-main-section,
html[data-theme="light"] .process-section,
html[data-theme="light"] .cart-container-page { 
    background: #fff !important; 
}

html[data-theme="light"] .services-preview {
    border-radius: 40px 40px 0 0 !important;
    margin-top: -60px !important;
    z-index: 10 !important;
    position: relative !important;
}

html[data-theme="light"] .company-overview,
html[data-theme="light"] .services-main-section,
html[data-theme="light"] .contact-section,
html[data-theme="light"] .categories-section,
html[data-theme="light"] .designs-section,
html[data-theme="light"] .projects-section {
    border-radius: 40px 40px 0 0 !important;
    margin-top: -60px !important;
    z-index: 10 !important;
    position: relative !important;
    padding-top: 120px !important;
}

html[data-theme="light"] .featured-projects-home,
html[data-theme="light"] .mission-vision,
html[data-theme="light"] .team-section,
html[data-theme="light"] .values-section,
html[data-theme="light"] .featured-designs-home,
html[data-theme="light"] .explore-designs,
html[data-theme="light"] .cart-page { background: #ffffff !important; }

/* Header: Transparent at top, white when scrolled */
html[data-theme="light"] .main-nav {
    background: transparent !important;
    backdrop-filter: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

html[data-theme="light"] .main-nav.scrolled {
    background: rgba(255, 255, 255, .98) !important;
    backdrop-filter: blur(18px) saturate(180%) !important;
    border-bottom: none !important;
    box-shadow: 0 4px 20px rgba(23, 32, 51, .12) !important;
    border-radius: 16px !important;
}

/* White text/icons at top, dark when scrolled */
html[data-theme="light"] .logo,
html[data-theme="light"] .logo-text,
html[data-theme="light"] .nav-links > li > a,
html[data-theme="light"] .search-icon,
html[data-theme="light"] .cart-icon,
html[data-theme="light"] .consultation-icon,
html[data-theme="light"] .theme-toggle { 
    color: #ffffff !important; 
    transition: color 0.4s ease !important;
}

html[data-theme="light"] .main-nav.scrolled .logo,
html[data-theme="light"] .main-nav.scrolled .logo-text,
html[data-theme="light"] .main-nav.scrolled .nav-links > li > a,
html[data-theme="light"] .main-nav.scrolled .search-icon,
html[data-theme="light"] .main-nav.scrolled .cart-icon,
html[data-theme="light"] .main-nav.scrolled .consultation-icon,
html[data-theme="light"] .main-nav.scrolled .theme-toggle { 
    color: #172b4d !important; 
}

html[data-theme="light"] .logo-text span {
    color: #f39c12 !important;
}
html[data-theme="light"] .dropdown-menu,
html[data-theme="light"] .cart-dropdown,
html[data-theme="light"] .search-results { background: #fff !important; border-color: #dbe3ee !important; }
html[data-theme="light"] .search-bar { background: transparent !important; border: none !important; padding: 0 !important; }
html[data-theme="light"] .search-bar input {
    background: #f8f6f1 !important;
    border: 1.5px solid #f39c12 !important;
    outline: none !important;
    color: #172b4d !important;
    border-radius: 25px !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
html[data-theme="light"] .search-bar input::placeholder {
    color: #8993a4 !important;
}
html[data-theme="light"] .search-bar input:focus {
    border-color: #f39c12 !important;
    box-shadow: none !important;
    background: #ffffff !important;
    outline: none !important;
}
html[data-theme="light"] .dropdown-menu li a { color: #253550 !important; }

/* Modern, white cards with visible but quiet boundaries. */
html[data-theme="light"] .service-preview-card,
html[data-theme="light"] .featured-project-card,
html[data-theme="light"] .testimonial-home-card,
html[data-theme="light"] .service-card,
html[data-theme="light"] .project-card,
html[data-theme="light"] .category-card,
html[data-theme="light"] .design-card,
html[data-theme="light"] .about-card,
html[data-theme="light"] .value-card,
html[data-theme="light"] .team-card,
html[data-theme="light"] .team-member,
html[data-theme="light"] .contact-form,
html[data-theme="light"] .contact-form-container,
html[data-theme="light"] .contact-details,
html[data-theme="light"] .contact-info-card,
html[data-theme="light"] .why-choose-card,
html[data-theme="light"] .cart-item,
html[data-theme="light"] .summary-card,
html[data-theme="light"] .cart-items-container,
html[data-theme="light"] .cart-summary {
    background: #fff !important;
    border-color: #dbe3ee !important;
    box-shadow: 0 2px 10px rgba(23, 32, 51, .045);
}
html[data-theme="light"] .service-preview-card:hover,
html[data-theme="light"] .featured-project-card:hover,
html[data-theme="light"] .testimonial-home-card:hover,
html[data-theme="light"] .service-card:hover,
html[data-theme="light"] .project-card:hover,
html[data-theme="light"] .category-card:hover,
html[data-theme="light"] .design-card:hover { box-shadow: 0 12px 26px rgba(23, 32, 51, .10); }

/* Contact Page Light Mode Adjustments */
html[data-theme="light"] .contact-section {
    background: #f8fafc !important;
}

html[data-theme="light"] .contact-info-container {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

html[data-theme="light"] .contact-form-container h2,
html[data-theme="light"] .contact-info-card h3,
html[data-theme="light"] .why-choose-card h3,
html[data-theme="light"] .method-content h4 {
    color: #172033 !important;
}

html[data-theme="light"] .form-description,
html[data-theme="light"] .contact-info-card p,
html[data-theme="light"] .method-content p,
html[data-theme="light"] .checkbox-label,
html[data-theme="light"] .checkbox-label span {
    color: #526174 !important;
}

html[data-theme="light"] .benefits-list li {
    color: #526174 !important;
    border-bottom-color: #e2e8f0 !important;
}

html[data-theme="light"] .benefits-list li i {
    color: #ffa500 !important;
}

html[data-theme="light"] .form-group select option {
    background: #ffffff !important;
    color: #172033 !important;
}

/* Standard readable content hierarchy. */
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] .section-header h2 { color: #172033; }
html[data-theme="light"] p,
html[data-theme="light"] .section-header p,
html[data-theme="light"] .service-preview-card p,
html[data-theme="light"] .service-card p,
html[data-theme="light"] .project-card p,
html[data-theme="light"] .category-card p,
html[data-theme="light"] .design-card p { color: #526174; }

/* Project Card Specific Light Mode Overrides */
html[data-theme="light"] .project-info h3 {
    color: #172033 !important;
}

html[data-theme="light"] .project-info .location,
html[data-theme="light"] .project-info p {
    color: #526174 !important;
}

/* Featured Project Card Content Light Mode - Maximum Specificity */
html[data-theme="light"] .featured-projects-home .featured-project-card h3,
html[data-theme="light"] .featured-projects-home .featured-project-content h3,
html[data-theme="light"] .featured-project-card h3,
html[data-theme="light"] .featured-project-content h3 {
    color: #172033 !important;
    font-weight: 700 !important;
    text-shadow: none !important;
}

html[data-theme="light"] .featured-projects-home .featured-project-card p,
html[data-theme="light"] .featured-projects-home .featured-project-content p,
html[data-theme="light"] .featured-project-card p,
html[data-theme="light"] .featured-project-content p {
    color: #526174 !important;
    text-shadow: none !important;
}

html[data-theme="light"] .featured-projects-home .project-view-btn,
html[data-theme="light"] .featured-project-card .project-view-btn,
html[data-theme="light"] .project-view-btn {
    color: #172033 !important;
    background: transparent !important;
    border: 2px solid #dbe3ee !important;
}

html[data-theme="light"] .featured-projects-home .project-view-btn:hover,
html[data-theme="light"] .featured-project-card .project-view-btn:hover,
html[data-theme="light"] .project-view-btn:hover {
    color: #ffffff !important;
    background: #f59e0b !important;
    border-color: #f59e0b !important;
}

/* Orange action backgrounds need legible contrast. */
html[data-theme="light"] .cta-button,
html[data-theme="light"] .btn-primary,
html[data-theme="light"] .hero-buttons .btn-primary,
html[data-theme="light"] .project-view-btn,
html[data-theme="light"] .btn-view-more,
html[data-theme="light"] .btn-browse,
html[data-theme="light"] .cart-btn-primary,
html[data-theme="light"] .cart-btn-order {
    color: #172033 !important;
    font-weight: 700;
}

html[data-theme="light"] .submit-btn {
    color: #ffffff !important;
    font-weight: 700;
}

/* Order Now button always needs white text on its navy/orange backgrounds. */
html[data-theme="light"] .order-now-btn { color: #fff !important; }
html[data-theme="light"] .order-now-btn:hover { color: #fff !important; }

/* Text links and quiet controls remain distinct from the white surface. */
html[data-theme="light"] .service-link-arrow,
html[data-theme="light"] .read-more,
html[data-theme="light"] .contact-info a,
html[data-theme="light"] .project-link {
    color: #8f4100 !important;
}

html[data-theme="light"] .filter-btn,
html[data-theme="light"] .category-filter-btn,
html[data-theme="light"] .quantity-btn,
html[data-theme="light"] .add-to-cart-btn,
html[data-theme="light"] .category-btn {
    color: #172b4d !important;
    border-color: #9aaabd !important;
    font-weight: 650;
}

html[data-theme="light"] .category-btn i {
    color: #172b4d !important;
}

html[data-theme="light"] .filter-btn.active,
html[data-theme="light"] .category-filter-btn.active {
    color: #fff !important;
    border-color: var(--navy) !important;
}

/* A visible keyboard focus indicator helps every interactive element stand
   apart from the light background without relying on colour alone. */
html[data-theme="light"] :is(a, button, input, textarea, select):focus-visible {
    outline: 3px solid #8f4100;
    outline-offset: 3px;
}

/* Image hero and brand panels deliberately retain their light foregrounds. */
html[data-theme="light"] .hero h1,
html[data-theme="light"] .hero p,
html[data-theme="light"] .about-hero h1,
html[data-theme="light"] .about-hero p,
html[data-theme="light"] .services-hero h1,
html[data-theme="light"] .services-hero p,
html[data-theme="light"] .contact-hero h1,
html[data-theme="light"] .contact-hero p,
html[data-theme="light"] .page-header h1,
html[data-theme="light"] .page-header p,
html[data-theme="light"] .why-choose-home h2,
html[data-theme="light"] .why-choose-home h3,
html[data-theme="light"] .why-choose-home p { color: #fff; }

html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select {
    background: #fff !important;
    color: #172033 !important;
    border-color: #cbd5e1 !important;
}

/* The white design finishes with a dependable deep-blue footer. */
html[data-theme="light"] .footer { 
    background: #f8fafc !important; 
    border-top: 1px solid #e2e8f0 !important;
}
html[data-theme="light"] .footer-section h3 { 
    color: #172033 !important; 
}
html[data-theme="light"] .footer-section p,
html[data-theme="light"] .footer-section a { 
    color: #526174 !important; 
}

html[data-theme="light"] .footer-section a:hover {
    color: #f39c12 !important;
}

html[data-theme="light"] .footer-bottom {
    border-top: 1px solid #e2e8f0 !important;
}

html[data-theme="light"] .footer-bottom p {
    color: #526174 !important;
}

html[data-theme="light"] .footer .social-icons a {
    background: rgba(243, 156, 18, 0.1) !important;
    color: #f39c12 !important;
    border: 1px solid rgba(243, 156, 18, 0.2) !important;
}

html[data-theme="light"] .footer .social-icons a:hover {
    background: #f39c12 !important;
    color: #ffffff !important;
}

/* In light mode, this is a calm sand-toned trust section rather than a
   dark overlay. It keeps the content visually distinct without sacrificing
   legibility or making the page feel like it has switched themes midway. */
html[data-theme="light"] .why-choose-home {
    background:
        radial-gradient(circle at 8% 12%, rgba(245, 158, 11, .16), transparent 30%),
        radial-gradient(circle at 92% 88%, rgba(30, 64, 104, .09), transparent 32%),
        #fff8ed !important;
    color: #172b4d !important;
    background-attachment: initial !important;
}
html[data-theme="light"] .why-choose-home::before { display: none; }
html[data-theme="light"] .why-choose-home .section-header h2,
html[data-theme="light"] .why-choose-home h2 { color: #172b4d !important; }
html[data-theme="light"] .why-choose-home .section-header p { color: #526174 !important; }
html[data-theme="light"] .why-choose-card,
html[data-theme="light"] .stat-home {
    background: rgba(255, 255, 255, .86) !important;
    border: 1px solid #ead9bd !important;
    box-shadow: 0 8px 22px rgba(23, 43, 77, .07);
    backdrop-filter: none;
}
html[data-theme="light"] .why-choose-card:hover,
html[data-theme="light"] .stat-home:hover {
    background: #fff !important;
    border-color: #e6aa4a !important;
    box-shadow: 0 14px 28px rgba(23, 43, 77, .12);
}
html[data-theme="light"] .why-icon-wrapper {
    background: #fff0d6 !important;
    border: 1px solid #f6d59e;
}
html[data-theme="light"] .why-choose-card h3 { color: #172b4d !important; }
html[data-theme="light"] .why-choose-card p,
html[data-theme="light"] .stat-home p { color: #526174 !important; }
html[data-theme="light"] .stat-home h4 { color: #a85609 !important; }

/* Page styles previously hard-coded dark blue gradients for these panels.
   Give every one of them the same bright, branded light-mode treatment. */
/* Light mode Hero & Page Header styling - High contrast architectural photo headers with smooth fade ONLY at the bottom border edge */
html[data-theme="light"] .hero,
html[data-theme="light"] .services-hero,
html[data-theme="light"] .contact-hero,
html[data-theme="light"] .projects-header,
html[data-theme="light"] .categories-header,
html[data-theme="light"] .designs-header {
    background-color: #0f172a !important;
    position: relative !important;
    overflow: hidden !important;
    border-bottom: none !important;
    padding-top: 130px !important;
    padding-bottom: 120px !important;
}

html[data-theme="light"] .hero::before,
html[data-theme="light"] .services-hero::before,
html[data-theme="light"] .contact-hero::before,
html[data-theme="light"] .projects-header::before,
html[data-theme="light"] .categories-header::before,
html[data-theme="light"] .designs-header::before {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    background-attachment: scroll !important;
    background-size: cover !important;
    background-position: center !important;
    border: none !important;
    z-index: 1 !important;
}

/* Specific background images for each page in light mode */
html[data-theme="light"] .hero::before {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.85) 0%, rgba(15, 23, 42, 0.80) 70%, rgba(15, 23, 42, 0.60) 100%), 
                url('../Homepage%20Image/homepage.jpg') !important;
}

html[data-theme="light"] .about-hero::before {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.85) 0%, rgba(15, 23, 42, 0.80) 70%, rgba(15, 23, 42, 0.60) 100%), 
                url('../Designs/2. Commercial Design/Office buildings/Office.jpg') !important;
}

html[data-theme="light"] .services-hero::before {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.85) 0%, rgba(15, 23, 42, 0.80) 70%, rgba(15, 23, 42, 0.60) 100%), 
                url('../Designs/3. Institutional Design/Universities/University.jpg') !important;
}

html[data-theme="light"] .contact-hero::before {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.85) 0%, rgba(15, 23, 42, 0.80) 70%, rgba(15, 23, 42, 0.60) 100%), 
                url('../Designs/5. Interior Design/Office interiors/Office interiors.jpg') !important;
}

/* Projects/Categories/Designs pages use specific classes */
html[data-theme="light"] .projects-header::before {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.85) 0%, rgba(15, 23, 42, 0.80) 70%, rgba(15, 23, 42, 0.60) 100%), 
                url('../Designs/4. Industrial Design/Factories/Factoriesl architecture design.jpg') !important;
}

html[data-theme="light"] .categories-header::before {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.85) 0%, rgba(15, 23, 42, 0.80) 70%, rgba(15, 23, 42, 0.60) 100%), 
                url('../Designs/1. Residential Design/Maisonettes/WhatsApp Image 2026-07-19 at 08.33.36.jpeg') !important;
}

html[data-theme="light"] .designs-header::before {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.85) 0%, rgba(15, 23, 42, 0.80) 70%, rgba(15, 23, 42, 0.60) 100%), 
                url('../Designs/1. Residential Design/Villas/villas.jpg') !important;
}

/* Ultra-smooth bottom fade — REMOVED for clean hero */
html[data-theme="light"] .hero::after,
html[data-theme="light"] .services-hero::after,
html[data-theme="light"] .about-hero::after,
html[data-theme="light"] .contact-hero::after,
html[data-theme="light"] .projects-header::after,
html[data-theme="light"] .categories-header::after,
html[data-theme="light"] .designs-header::after {
    display: none !important;
}

/* Keep text, badges, and stats inside hero headers crisp, white, and perfectly readable */
html[data-theme="light"] .hero-content,
html[data-theme="light"] .services-hero-content,
html[data-theme="light"] .about-hero-content,
html[data-theme="light"] .contact-hero-content,
html[data-theme="light"] .page-header-content {
    position: relative !important;
    z-index: 3 !important;
}

html[data-theme="light"] .hero h1,
html[data-theme="light"] .about-hero h1,
html[data-theme="light"] .services-hero h1,
html[data-theme="light"] .contact-hero h1,
html[data-theme="light"] .page-header h1 {
    color: #ffffff !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="light"] .hero p,
html[data-theme="light"] .about-hero p,
html[data-theme="light"] .services-hero p,
html[data-theme="light"] .contact-hero p,
html[data-theme="light"] .page-header p {
    color: rgba(255, 255, 255, 0.92) !important;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="light"] .hero-badge {
    background: rgba(243, 156, 18, 0.18) !important;
    color: #d97706 !important;
    border: 1.5px solid rgba(243, 156, 18, 0.5) !important;
    font-weight: 700 !important;
}

/* High contrast hero buttons in light mode */
html[data-theme="light"] .hero-buttons .btn-primary,
html[data-theme="light"] .cta-buttons .btn-primary {
    background: #f39c12 !important;
    color: #0f172a !important;
    font-weight: 700 !important;
    border: none !important;
    box-shadow: 0 8px 25px rgba(243, 156, 18, 0.4) !important;
}

html[data-theme="light"] .hero-buttons .btn-secondary,
html[data-theme="light"] .cta-buttons .btn-secondary {
    background: #0f172a !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    border: 1.5px solid #1e293b !important;
    box-shadow: 0 8px 25px rgba(15, 23, 42, 0.3) !important;
}

html[data-theme="light"] .hero-buttons .btn-secondary:hover,
html[data-theme="light"] .cta-buttons .btn-secondary:hover {
    background: #1e293b !important;
    color: #ffffff !important;
    border-color: #f39c12 !important;
}

/* Stat cards pop sharply over the bottom fade with solid dark navy surface & vibrant amber icons */
html[data-theme="light"] .hero-stat {
    background: #0f172a !important;
    border: 1.5px solid #1e293b !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.35) !important;
    color: #ffffff !important;
}

html[data-theme="light"] .hero-stat i {
    color: #f39c12 !important;
}

html[data-theme="light"] .hero-stat strong {
    color: #ffffff !important;
    font-weight: 800 !important;
}

html[data-theme="light"] .hero-stat span {
    color: #cbd5e1 !important;
    font-weight: 500 !important;
}

html[data-theme="light"] .why-us,
html[data-theme="light"] .why-choose-services,
html[data-theme="light"] .stats-section,
html[data-theme="light"] .about-cta,
html[data-theme="light"] .cta-home,
html[data-theme="light"] .cta-section {
    background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%) !important;
    color: #172033 !important;
    border-top: 1px solid #e2e8f0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    background-attachment: scroll !important;
}

html[data-theme="light"] .cta-section::before {
    display: none !important;
}

html[data-theme="light"] .why-us h2,
html[data-theme="light"] .why-us h3,
html[data-theme="light"] .why-us p,
html[data-theme="light"] .why-choose-services h2,
html[data-theme="light"] .why-choose-services h3,
html[data-theme="light"] .why-choose-services p,
html[data-theme="light"] .stats-section h2,
html[data-theme="light"] .stats-section h3,
html[data-theme="light"] .stats-section p,
html[data-theme="light"] .about-cta h2,
html[data-theme="light"] .about-cta p,
html[data-theme="light"] .cta-home h2,
html[data-theme="light"] .cta-home p,
html[data-theme="light"] .cta-section h2,
html[data-theme="light"] .cta-section p,
html[data-theme="light"] .cta-content h2,
html[data-theme="light"] .cta-content p {
    color: #172033 !important;
}

html[data-theme="light"] .cta-icon {
    color: #f39c12 !important;
}

html[data-theme="light"] .cta-feature,
html[data-theme="light"] .cta-feature i {
    color: #526174 !important;
}

html[data-theme="light"] .cta-feature i {
    color: #f39c12 !important;
}

/* CTA Buttons in light mode */
html[data-theme="light"] .cta-buttons .btn-secondary {
    background: transparent !important;
    color: #172033 !important;
    border: 2px solid #cbd5e1 !important;
}

html[data-theme="light"] .cta-buttons .btn-secondary:hover {
    background: #f39c12 !important;
    color: #ffffff !important;
    border-color: #f39c12 !important;
}
html[data-theme="light"] .stat-box,
html[data-theme="light"] .feature-box {
    background: #fff !important;
    border-color: #ead9bd !important;
    box-shadow: 0 8px 22px rgba(23, 43, 77, .07);
}
html[data-theme="light"] .stat-box *,
html[data-theme="light"] .feature-box * { color: #172b4d !important; }
html[data-theme="light"] .stat-box i,
html[data-theme="light"] .feature-box i { color: #b65b05 !important; }

@media (max-width: 768px) {
    html[data-theme="light"] .nav-links { background: #fff !important; }
    html[data-theme="light"] .dropdown-menu { background: #f8fafc !important; }
    
    /* Mobile nav header - transparent at top, solid when scrolled (same as desktop) */
    html[data-theme="light"] .main-nav {
        background: transparent !important;
        backdrop-filter: none !important;
        border-bottom: none !important;
        box-shadow: none !important;
    }
    
    html[data-theme="light"] .main-nav.scrolled {
        background: rgba(255, 255, 255, 0.98) !important;
        backdrop-filter: blur(18px) saturate(180%) !important;
        border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
        box-shadow: 0 2px 12px rgba(23, 32, 51, 0.08) !important;
    }
    
    /* Mobile header icons - White at top, dark when scrolled */
    html[data-theme="light"] .search-icon,
    html[data-theme="light"] .search-icon i,
    html[data-theme="light"] .cart-icon,
    html[data-theme="light"] .cart-icon i,
    html[data-theme="light"] .consultation-icon,
    html[data-theme="light"] .consultation-icon i,
    html[data-theme="light"] .theme-toggle,
    html[data-theme="light"] .theme-toggle i,
    html[data-theme="light"] .mobile-toggle,
    html[data-theme="light"] .mobile-toggle i {
        color: #ffffff !important;
    }
    
    /* Icons turn dark when scrolled */
    html[data-theme="light"] .main-nav.scrolled .search-icon,
    html[data-theme="light"] .main-nav.scrolled .search-icon i,
    html[data-theme="light"] .main-nav.scrolled .cart-icon,
    html[data-theme="light"] .main-nav.scrolled .cart-icon i,
    html[data-theme="light"] .main-nav.scrolled .consultation-icon,
    html[data-theme="light"] .main-nav.scrolled .consultation-icon i,
    html[data-theme="light"] .main-nav.scrolled .theme-toggle,
    html[data-theme="light"] .main-nav.scrolled .theme-toggle i,
    html[data-theme="light"] .main-nav.scrolled .mobile-toggle,
    html[data-theme="light"] .main-nav.scrolled .mobile-toggle i {
        color: #172b4d !important;
    }
    
    /* Mobile logo - white at top, dark when scrolled */
    html[data-theme="light"] .logo,
    html[data-theme="light"] .logo-text {
        color: #ffffff !important;
    }
    
    html[data-theme="light"] .main-nav.scrolled .logo,
    html[data-theme="light"] .main-nav.scrolled .logo-text {
        color: #172b4d !important;
    }
    
    html[data-theme="light"] .logo-text span {
        color: #f39c12 !important;
    }
    
    /* Mobile nav menu links */
    html[data-theme="light"] .nav-links > li > a {
        color: #172b4d !important;
    }
}

/* Projects page - Increase contrast for project card overlays in light mode */
html[data-theme="light"] .gallery-overlay {
    background: linear-gradient(to top, 
        rgba(15, 23, 42, 0.98) 0%, 
        rgba(15, 23, 42, 0.85) 40%, 
        rgba(15, 23, 42, 0.45) 70%, 
        transparent 100%) !important;
}

html[data-theme="light"] .gallery-info h3 {
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

html[data-theme="light"] .gallery-location {
    color: rgba(255, 255, 255, 0.95) !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="light"] .gallery-category {
    color: #f39c12 !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) !important;
    font-weight: 700 !important;
}

html[data-theme="light"] .gallery-btn {
    color: #ffffff !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) !important;
}

/* Featured Projects Light Mode */
html[data-theme="light"] .featured-project-overlay {
    background: linear-gradient(to top, 
        rgba(15, 23, 42, 0.95) 0%, 
        rgba(15, 23, 42, 0.75) 40%, 
        rgba(15, 23, 42, 0.35) 70%, 
        transparent 100%) !important;
}

html[data-theme="light"] .featured-project-card h3 {
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}

html[data-theme="light"] .featured-project-card p {
    color: rgba(255, 255, 255, 0.95) !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4) !important;
}

html[data-theme="light"] .featured-badge {
    backdrop-filter: blur(8px) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="light"] .project-view-btn {
    background: #f39c12 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(243, 156, 18, 0.4) !important;
}

/* WhatsApp widget light mode - Remove orange border */
html[data-theme="light"] .whatsapp-input {
    border: 2px solid #d1d5db !important;
    background: #ffffff !important;
    color: #172033 !important;
    box-shadow: none !important;
}

html[data-theme="light"] .whatsapp-input:focus {
    border-color: #25D366 !important;
    box-shadow: 0 0 0 3px rgba(37, 211, 102, 0.1) !important;
    outline: none !important;
}

html[data-theme="light"] .whatsapp-input::placeholder {
    color: #9ca3af !important;
}

/* Remove any browser default styling on textarea */
html[data-theme="light"] .whatsapp-input::-webkit-input-placeholder {
    color: #9ca3af !important;
}

html[data-theme="light"] .whatsapp-input:-moz-placeholder {
    color: #9ca3af !important;
}

html[data-theme="light"] .whatsapp-input::-moz-placeholder {
    color: #9ca3af !important;
}

html[data-theme="light"] .whatsapp-input:-ms-input-placeholder {
    color: #9ca3af !important;
}