/* ========================================
   DARK MODE STYLES FOR V DEEP CLEAN
   ======================================== */

/* Main body background - Change from white to dark */
body {
    background-color: #0f172a !important; /* Dark navy blue */
}

/* Header - Make it dark */
#header {
    background-color: rgba(15, 23, 42, 0.95) !important; /* Dark with transparency */
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

#header a {
    color: #e2e8f0 !important; /* Light gray text */
}

#header a:hover,
#header .hover\:text-\[\#104333\]:hover {
    color: #10B981 !important; /* Green on hover */
}

/* About Section - Dark background */
#about {
    background: linear-gradient(to bottom, #1e293b, #0f172a) !important;
}

#about .bg-white {
    background-color: #1e293b !important; /* Dark gray card */
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

#about h2,
#about .text-gray-800 {
    color: #f1f5f9 !important; /* Light text */
}

#about p,
#about .text-gray-700,
#about .text-gray-600 {
    color: #cbd5e1 !important; /* Light gray text */
}

#about .text-\[\#104333\] {
    color: #10B981 !important; /* Green accent */
}

/* Services Section - Dark background */
#services {
    background-color: #0f172a !important;
}

#services .service-card {
    background-color: #1e293b !important; /* Dark cards */
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

#services h2,
#services h3,
#services .text-gray-800 {
    color: #f1f5f9 !important; /* Light headings */
}

#services p,
#services .text-gray-600 {
    color: #cbd5e1 !important; /* Light text */
}

#services .text-\[\#104333\] {
    color: #10B981 !important;
}

#services .service-card:hover {
    background-color: #2d3b4e !important;
    border-color: #10B981 !important;
}

/* Testimonials Section - Dark background */
#testimonials {
    background-color: #1e293b !important;
}

#testimonials .testimonial-card {
    background: linear-gradient(to bottom right, #0f172a, #1e293b) !important;
    border-left-color: #10B981 !important;
}

#testimonials h2,
#testimonials .text-gray-800 {
    color: #f1f5f9 !important;
}

#testimonials p,
#testimonials .text-gray-700,
#testimonials .text-gray-600 {
    color: #cbd5e1 !important;
}

#testimonials .text-\[\#104333\] {
    color: #10B981 !important;
}

#testimonials .text-gray-500 {
    color: #94a3b8 !important;
}

/* Gallery Section - Dark background */
#gallery {
    background: linear-gradient(to bottom, #0f172a, #1e293b) !important;
}

#gallery .bg-white {
    background-color: #1e293b !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

#gallery h2,
#gallery .text-gray-800 {
    color: #f1f5f9 !important;
}

#gallery p,
#gallery .text-gray-600 {
    color: #cbd5e1 !important;
}

#gallery .text-\[\#104333\] {
    color: #10B981 !important;
}

/* Footer - Already dark, keep it */
footer {
    background-color: #020617 !important;
}

/* Stats section gradient - Keep as is (already colorful) */
.gradient-bg {
    /* Keep the original gradient - it looks good */
}

/* Contact section gradient - Keep as is */
#contact {
    /* Keep the original gradient - it looks good */
}

/* Fix any remaining white text on white background */
.text-white {
    color: #ffffff !important;
}

/* Decorative elements */
.decorative-dots {
    background-image: radial-gradient(circle, rgba(16, 185, 129, 0.15) 1px, transparent 1px) !important;
}

/* Mobile menu dark mode */
#mobile-menu {
    background-color: #1e293b !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

#mobile-menu a {
    color: #e2e8f0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

#mobile-menu a:hover {
    color: #10B981 !important;
    background-color: rgba(16, 185, 129, 0.1);
}

/* Scroll progress bar - Make it visible on dark */
.scroll-progress {
    background: linear-gradient(90deg, #10B981, #34d399) !important;
}

/* Make sure all headings are visible */
h1, h2, h3, h4, h5, h6 {
    color: #f1f5f9 !important;
}

/* ========================================
   OPTIONAL: LIGHTER DARK MODE
   Uncomment below for a lighter version
   ======================================== */

/*
body {
    background-color: #1e293b !important;
}

#about, #services, #testimonials, #gallery {
    background-color: #334155 !important;
}

.service-card, .testimonial-card, #about .bg-white {
    background-color: #475569 !important;
}
*/