/* ===========================================
   Theme Overrides for Light/Dark Mode
   
   This file overrides Tailwind's hardcoded dark colors
   when light theme is active via data-theme="light"
   =========================================== */

/* ===========================================
   LIGHT THEME OVERRIDES
   When data-theme="light", override dark colors
   =========================================== */

[data-theme="light"] {
    /* Background overrides */
    .bg-gray-900 { background-color: #f9fafb !important; }
    .bg-gray-950 { background-color: #ffffff !important; }
    .bg-gray-800 { background-color: #f3f4f6 !important; }
    .bg-gray-700 { background-color: #e5e7eb !important; }
    .bg-gray-600\/50 { background-color: rgba(229, 231, 235, 0.5) !important; }
    
    /* Text color overrides - but NOT on blue background buttons */
    .text-white:not(.bg-blue-700):not(.bg-blue-600):not(.bg-primary-700):not(.bg-primary-600) { 
        color: #111827 !important; 
    }
    
    /* Explicit override: Keep white text on blue background buttons */
    button.bg-blue-700,
    button.bg-blue-600,
    button.bg-primary-700,
    button.bg-primary-600 {
        color: #ffffff !important;
    }
    
    .text-gray-100 { color: #374151 !important; }
    .text-gray-200 { color: #4b5563 !important; }
    .text-gray-300 { color: #6b7280 !important; }
    .text-gray-400 { color: #6b7280 !important; }
    .text-gray-500 { color: #9ca3af !important; }
    .text-gray-500\/50 { color: rgba(107, 114, 128, 0.5) !important; }
    
    /* Border overrides */
    .border-gray-700 { border-color: #e5e7eb !important; }
    .border-gray-800 { border-color: #d1d5db !important; }
    
    /* Hover states for dropdowns */
    .hover\:bg-gray-700\/50:hover { background-color: rgba(229, 231, 235, 0.5) !important; }
    .hover\:bg-gray-700:hover { background-color: #e5e7eb !important; }
    
    /* Vertical line in timeline */
    .bg-gray-700 { background-color: #d1d5db !important; }
    
    /* Timeline dot */
    .bg-gray-500 { background-color: #9ca3af !important; }
    .border-gray-950 { border-color: #ffffff !important; }
}

/* ===========================================
   CLIENTS SECTION - LIGHT THEME
   =========================================== */

[data-theme="light"] .clients-title {
    color: #111827 !important;
}

[data-theme="light"] .clients-subtitle {
    color: #4b5563 !important;
}

/* SVG logos in clients section */
[data-theme="light"] .home-hero-clients svg path[fill="white"],
[data-theme="light"] .home-hero-clients svg path[fill="white" i] {
    fill: #374151 !important;
}

[data-theme="light"] .home-hero-clients svg[fill="white"],
[data-theme="light"] .home-hero-clients svg path[fill-opacity] {
    fill: #374151 !important;
    fill-opacity: 1 !important;
}

/* ===========================================
   SERVICES PAGE - LIGHT THEME
   =========================================== */

/* Hero Section */
[data-theme="light"] .services-hero-section::after {
    background: rgba(255, 60, 0, 0.5);
}

/* Stats */
[data-theme="light"] .services-stat-value {
    color: #1c1e21 !important;
}

[data-theme="light"] .services-stat-label {
    color: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .services-stat-divider {
    background: rgba(0, 0, 0, 0.2) !important;
}

/* Service Rows (Featured Services) */
[data-theme="light"] .service-row {
    border-color: rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .service-row__title {
    color: #1c1e21 !important;
}

[data-theme="light"] .service-row__description {
    color: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .service-row__feature {
    color: #1c1e21 !important;
}

[data-theme="light"] .service-row__tag {
    border-color: rgba(0, 0, 0, 0.2) !important;
    color: #1c1e21 !important;
}

[data-theme="light"] .service-row__image {
    background: linear-gradient(180deg, #ffffff 0%, #e2dbdb 100%) !important;
}

/* Specialized Expertise Section */
[data-theme="light"] .services-expertise-section {
    background: transparent;
}

[data-theme="light"] .services-expertise-section .section-title {
    color: #1c1e21 !important;
}

[data-theme="light"] .services-expertise-section .section-description {
    color: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .services-expertise-card {
    background: #FFFFFF !important;
    -webkit-backdrop-filter: blur(4px) !important;
    backdrop-filter: blur(4px) !important;
    box-shadow: none !important;
    border-radius: 26px !important;
}

[data-theme="light"] .services-expertise-card::before {
    display: none !important;
}

[data-theme="light"] .services-expertise-title {
    color: #1c1e21 !important;
}

[data-theme="light"] .services-expertise-desc {
    color: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .services-expertise-tags {
    gap: 16px !important;
}

[data-theme="light"] .services-expertise-tag {
    border-color: rgba(0, 0, 0, 0.2) !important;
    color: #1c1e21 !important;
    padding: 8px 16px !important;
}

/* CTA Section on Services page */
[data-theme="light"] .pricing-cta-card h2 {
    color: #1c1e21 !important;
}

[data-theme="light"] .pricing-cta-card p {
    color: rgba(0, 0, 0, 0.5) !important;
}

/* ===========================================
   ABOUT PAGE - LIGHT THEME
   =========================================== */

/* Hero: hide warm orange glow and world-map SVG background */
[data-theme="light"] .about-hero-glow,
[data-theme="light"] .about-hero-worldmap {
    display: none !important;
}

/* Replace with CSS ellipse like Services hero */
[data-theme="light"] .about-hero-section {
    position: relative;
}

[data-theme="light"] .about-hero-section::after {
    content: '';
    position: absolute;
    width: 1082px;
    height: 126px;
    background: rgba(255, 60, 0, 0.6);
    border-radius: 50%;
    filter: blur(70px);
    left: 50%;
    bottom: 40px;
    transform: translateX(-50%);
    pointer-events: none;
    z-index: 0;
}

/* Stats bar — numbers and labels */
[data-theme="light"] .about-stat-value {
    color: #1c1e21 !important;
}

[data-theme="light"] .about-stat-label {
    color: rgba(0, 0, 0, 0.5) !important;
}

/* Mission/Vision/Values cards */
[data-theme="light"] .about-mission-card {
    background: #FFFFFF !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

/* Core Values photo cards — light theme: switch images, overlay, text */
[data-theme="light"] .about-value-card {
    border-color: rgba(0, 0, 0, 0.12) !important;
    background-color: #f5f4f0 !important;
}

[data-theme="light"] .about-value-innovation {
    background-image: url('/images/about/value-innovation-light.png') !important;
}
[data-theme="light"] .about-value-collaboration {
    background-image: url('/images/about/value-collaboration-light.png') !important;
}
[data-theme="light"] .about-value-security {
    background-image: url('/images/about/value-security-light.png') !important;
}
[data-theme="light"] .about-value-excellence {
    background-image: url('/images/about/value-excellence-light.png') !important;
}
[data-theme="light"] .about-value-sustainability {
    background-image: url('/images/about/value-sustainability-light.png') !important;
}
[data-theme="light"] .about-value-customer-focus {
    background-image: url('/images/about/value-customer-focus-light.png') !important;
}

/* Light gradient overlay — white fade at bottom instead of black */
[data-theme="light"] .about-value-overlay {
    background: linear-gradient(to top, rgba(245,244,240,0.95) 0%, rgba(245,244,240,0.3) 45%, transparent 100%) !important;
}

/* Dark text on light images */
[data-theme="light"] .about-value-card h3 {
    color: #1c1e21 !important;
}
[data-theme="light"] .about-value-card p {
    color: rgba(0, 0, 0, 0.6) !important;
}

/* ===========================================
   ROLES SECTION - LIGHT THEME
   =========================================== */

[data-theme="light"] .role-card {
    border-color: rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .role-title {
    color: #111827 !important;
}

[data-theme="light"] .role-tag {
    background: transparent !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
    color: #111827 !important;
}

/* ===========================================
   COLLABORATION SECTION - LIGHT THEME
   =========================================== */

[data-theme="light"] .collab-card {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .collab-card:hover {
    border-color: rgba(0, 0, 0, 0.15) !important;
}

[data-theme="light"] .collab-icon {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, #ffffff 100%) !important;
}

[data-theme="light"] .collab-title {
    color: #111827 !important;
}

[data-theme="light"] .collab-description {
    color: #4b5563 !important;
}

[data-theme="light"] .collab-link {
    color: #0052FF !important;
}

[data-theme="light"] .collab-link:hover {
    color: #0052FF !important;
    opacity: 0.8;
}

/* ===========================================
   WHY CONNECTSOFT SECTION - LIGHT THEME
   =========================================== */

[data-theme="light"] .why-section-title {
    color: #111827 !important;
}

[data-theme="light"] .why-section-subtitle {
    color: #4b5563 !important;
}

/* ===========================================
   FEATURE CARDS - LIGHT THEME
   =========================================== */

[data-theme="light"] .feature-card {
    background: transparent !important;
}

[data-theme="light"] .feature-icon {
    background: transparent !important;
}

[data-theme="light"] .feature-title {
    color: #111827 !important;
}

[data-theme="light"] .feature-description {
    color: #4b5563 !important;
}

/* Testimonials light theme is now in figma-redesign.css */

/* ===========================================
   LEGACY TESTIMONIAL SECTION - LIGHT THEME
   =========================================== */

[data-theme="light"] section[style*="background-color: #1E1F1F"],
[data-theme="light"] section[style*="background-color:#1E1F1F"] {
    background-color: #f3f4f6 !important;
}

[data-theme="light"] .testimonial-quote {
    color: #111827 !important;
}

[data-theme="light"] .testimonial-author {
    color: #111827 !important;
}

[data-theme="light"] .testimonial-role {
    color: #4b5563 !important;
}

[data-theme="light"] .testimonial-nav-btn {
    color: #6b7280 !important;
}

[data-theme="light"] .testimonial-nav-btn:hover {
    color: #111827 !important;
}

[data-theme="light"] .testimonial-nav-btn svg path {
    stroke: #6b7280 !important;
}

[data-theme="light"] .testimonial-nav-btn:hover svg path {
    stroke: #111827 !important;
}

[data-theme="light"] .testimonial-rating svg {
    color: #f59e0b !important;
    fill: #f59e0b !important;
}

/* ===========================================
   CTA FORM SECTION - LIGHT THEME
   =========================================== */

[data-theme="light"] .home-cta-section {
    background-color: #f0ecec !important;
}

[data-theme="light"] .cta-title {
    color: #111827 !important;
}

[data-theme="light"] .cta-description {
    color: #4b5563 !important;
}

[data-theme="light"] .cta-input {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.15) !important;
    color: #111827 !important;
}

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

[data-theme="light"] .cta-input:focus {
    border-color: #2563eb !important;
}

[data-theme="light"] .cta-privacy-label {
    color: #4b5563 !important;
}

[data-theme="light"] .cta-privacy-link {
    color: #111827 !important;
}

/* ===========================================
   HEADER - LIGHT THEME  (matches Figma node 819:18482)
   =========================================== */

[data-theme="light"] .header-root {
    background-color: #ffffff !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

[data-theme="light"] nav.bg-gray-900 {
    background-color: #ffffff !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* Logo — flip SVG fills from white → dark */
[data-theme="light"] .header-logo svg path {
    fill: #1c1e21 !important;
}

/* Nav links */
[data-theme="light"] .nav-link {
    color: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .nav-link:hover,
[data-theme="light"] .nav-link.active {
    color: #1c1e21 !important;
}

/* Chevron icon inside nav */
[data-theme="light"] .header-nav svg {
    stroke: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .header-nav button:hover svg {
    stroke: #1c1e21 !important;
}

/* CTA button — dark bg, light text */
[data-theme="light"] .header-theme-toggle {
    color: rgba(0, 0, 0, 0.5);
}

[data-theme="light"] .header-theme-toggle:hover {
    color: #1c1e21;
}

[data-theme="light"] .header-cta {
    background: #1c1e21 !important;
    color: #f0ecec !important;
}

[data-theme="light"] .header-cta:hover {
    background: #2c2e31 !important;
    color: #f0ecec !important;
}

/* Desktop dropdown panel */
[data-theme="light"] .company-dropdown {
    background-color: rgba(0, 0, 0, 0.05) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
    backdrop-filter: blur(30px);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);
}

[data-theme="light"] .company-dropdown__item:hover {
    background-color: rgba(0, 0, 0, 0.06) !important;
}

[data-theme="light"] .company-dropdown__icon {
    background: white !important;
}

[data-theme="light"] .company-dropdown__icon svg path[fill="white"],
[data-theme="light"] .company-dropdown__icon svg circle[fill="white"] {
    fill: #0052FF;
}

[data-theme="light"] .company-dropdown__title {
    color: #1c1e21 !important;
}

[data-theme="light"] .company-dropdown__desc {
    color: rgba(0, 0, 0, 0.5) !important;
}

/* Mobile menu */
[data-theme="light"] .md\:hidden.bg-gray-900,
[data-theme="light"] #navbar-mobile {
    background-color: #f0ecec !important;
}

[data-theme="light"] #navbar-mobile .text-gray-300 {
    color: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] #navbar-mobile .text-gray-300:hover,
[data-theme="light"] #navbar-mobile .hover\:text-white:hover {
    color: #1c1e21 !important;
}

[data-theme="light"] #navbar-mobile .text-gray-400 {
    color: rgba(0, 0, 0, 0.4) !important;
}

[data-theme="light"] #navbar-mobile .border-gray-700 {
    border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Mobile CTA link */
[data-theme="light"] #navbar-mobile a.border.border-white {
    color: #1c1e21 !important;
    border-color: #1c1e21 !important;
}

[data-theme="light"] #navbar-mobile a.border.border-white:hover {
    background-color: #1c1e21 !important;
    color: #f0ecec !important;
}

/* Mobile hamburger button in light theme */
[data-theme="light"] .header-inner button.text-gray-400 {
    color: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .header-inner button.text-gray-400:hover {
    background-color: rgba(0, 0, 0, 0.05) !important;
}

/* Mobile menu - light theme */
[data-theme="light"] .mobile-menu-toggle {
    color: rgba(0, 0, 0, 0.6);
}

[data-theme="light"] .mobile-menu-toggle:hover {
    background: rgba(0, 0, 0, 0.05);
}

[data-theme="light"] .mobile-menu-overlay {
    background-color: #ffffff;
}

[data-theme="light"] .mobile-menu-header .header-logo svg path {
    fill: #08090A;
}

[data-theme="light"] .mobile-menu-close {
    color: rgba(0, 0, 0, 0.6);
}

[data-theme="light"] .mobile-menu-close:hover {
    color: #000000;
}

[data-theme="light"] .mobile-menu-link {
    color: rgba(0, 0, 0, 0.7);
}

[data-theme="light"] .mobile-menu-link:hover {
    color: #000000;
}

[data-theme="light"] .mobile-menu-divider {
    background: rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .mobile-menu-submenu {
    border-inline-start-color: rgba(0, 0, 0, 0.15);
}

[data-theme="light"] .mobile-menu-submenu__link {
    color: rgba(0, 0, 0, 0.5);
}

[data-theme="light"] .mobile-menu-submenu__link:hover {
    color: #000000;
}

[data-theme="light"] .mobile-menu-cta {
    background: #08090A;
    color: #FFFFFF;
}

[data-theme="light"] .mobile-menu-cta:hover {
    background: #1a1d21;
    color: #FFFFFF;
}

[data-theme="light"] .mobile-menu-link--inline .nav-link {
    color: rgba(0, 0, 0, 0.7);
}

[data-theme="light"] .mobile-menu-chevron {
    color: rgba(0, 0, 0, 0.5);
}

/* ===========================================
   FOOTER - LIGHT THEME
   =========================================== */

[data-theme="light"] footer.bg-gray-900,
[data-theme="light"] footer.dark\:bg-gray-950 {
    background-color: #f0ecec !important;
    border-top: 1px solid rgba(0, 0, 0, 0.2);
}

/* ===========================================
   SECTION BACKGROUNDS - LIGHT THEME
   =========================================== */

[data-theme="light"] section {
    background-color: #ffffff !important;
}

[data-theme="light"] section.bg-gray-950,
[data-theme="light"] section.bg-gray-900 {
    background-color: #ffffff !important;
}

/* Alternate sections for visual separation */
[data-theme="light"] section:nth-of-type(even) {
    background-color: #f9fafb !important;
}

/* ===========================================
   GENERIC TEXT OVERRIDES - LIGHT THEME
   Override inline styles with white colors
   =========================================== */

[data-theme="light"] section h1,
[data-theme="light"] section h2,
[data-theme="light"] section h3,
[data-theme="light"] section h4 {
    color: #111827 !important;
}

[data-theme="light"] section p {
    color: #4b5563 !important;
}

/* Override ANY element with inline white color */
[data-theme="light"] [style*="color: #FFFFFF"],
[data-theme="light"] [style*="color:#FFFFFF"],
[data-theme="light"] [style*="color: white"],
[data-theme="light"] [style*="color:white"] {
    color: #111827 !important;
}

[data-theme="light"] [style*="color: rgba(255, 255, 255"],
[data-theme="light"] [style*="color:rgba(255, 255, 255"] {
    color: #4b5563 !important;
}

/* ===========================================
   CARDS & BACKGROUNDS - LIGHT THEME
   =========================================== */

[data-theme="light"] .bg-gray-800 {
    background-color: #ffffff !important;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}

[data-theme="light"] .bg-gray-800\/50 {
    background-color: rgba(243, 244, 246, 0.8) !important;
}

/* ===========================================
   BUTTONS - LIGHT THEME
   =========================================== */

[data-theme="light"] .bg-white {
    background-color: #ffffff !important;
}

[data-theme="light"] .text-gray-900 {
    color: #111827 !important;
}

[data-theme="light"] .hover\:bg-gray-100:hover {
    background-color: #f3f4f6 !important;
}

[data-theme="light"] .hover\:text-white:hover {
    color: #1d4ed8 !important;
}

[data-theme="light"] .bg-blue-600 {
    background-color: #2563eb !important;
}

[data-theme="light"] .hover\:bg-blue-700:hover {
    background-color: #1d4ed8 !important;
}

/* ===========================================
   FOCUS STATES - LIGHT THEME
   =========================================== */

[data-theme="light"] .focus\:ring-gray-600:focus {
    --tw-ring-color: #4b5563 !important;
}

/* ===========================================
   FORM INPUTS - LIGHT THEME
   =========================================== */

[data-theme="light"] input.bg-gray-800,
[data-theme="light"] textarea.bg-gray-800,
[data-theme="light"] select.bg-gray-800 {
    background-color: #ffffff !important;
    border: 1px solid #d1d5db !important;
    color: #111827 !important;
}

[data-theme="light"] input.bg-gray-800::placeholder,
[data-theme="light"] textarea.bg-gray-800::placeholder {
    color: #9ca3af !important;
}

/* ===========================================
   VALIDATION COLORS - LIGHT THEME
   =========================================== */

[data-theme="light"] .text-red-400 {
    color: #dc2626 !important;
}

[data-theme="light"] .text-green-400 {
    color: #16a34a !important;
}

/* ===========================================
   WHY US PAGE - LIGHT THEME
   =========================================== */

/* Hero orange glow — soften for light background */
[data-theme="light"] .whyus-hero-glow {
    opacity: 0.5;
}

/* Stats bar */
[data-theme="light"] .whyus-stat-value {
    color: #1c1e21 !important;
}

[data-theme="light"] .whyus-stat-label {
    color: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .whyus-stat-divider {
    background: rgba(0, 0, 0, 0.12) !important;
}

/* Benefit cards */
[data-theme="light"] [style*="background: #111218"] {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Comparison table wrapper */
[data-theme="light"] .whyus-comparison-table {
    border-color: rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .whyus-thead-row {
    border-bottom-color: rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .whyus-table-row {
    border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

/* Feature and Others columns — light gray bg */
[data-theme="light"] .whyus-th-feature,
[data-theme="light"] .whyus-th-others,
[data-theme="light"] .whyus-td-feature,
[data-theme="light"] .whyus-td-others {
    background: #f8f7f5 !important;
}

[data-theme="light"] .whyus-th-feature,
[data-theme="light"] .whyus-th-others {
    color: rgba(0, 0, 0, 0.5) !important;
}

[data-theme="light"] .whyus-td-feature {
    color: #1c1e21 !important;
}

/* ConnectSoft column — blue tint */
[data-theme="light"] .whyus-th-us,
[data-theme="light"] .whyus-td-us {
    background: rgba(0, 82, 255, 0.07) !important;
}

[data-theme="light"] .whyus-th-us {
    color: #0052FF !important;
}

[data-theme="light"] .text-blue-400 {
    color: #2563eb !important;
}

/* ===========================================
   CTA BUTTONS - UNIVERSAL STYLE
   =========================================== */

.cta-button {
    background: #ffffff;
    color: #111827;
    border: none;
}

.cta-button:hover {
    background: #f3f4f6;
}

[data-theme="light"] .cta-button,
html[data-theme="light"] .cta-button {
    background: #2563eb !important;
    color: #ffffff !important;
    border: none !important;
}

[data-theme="light"] .cta-button:hover,
html[data-theme="light"] .cta-button:hover {
    background: #1d4ed8 !important;
}

/* UIKit Primary Button - ensure white text on blue background */
[data-theme="light"] button[class*="btn-primary"],
[data-theme="light"] .btn-primary,
[data-theme="light"] button.bg-blue-600,
html[data-theme="light"] button[class*="btn-primary"],
html[data-theme="light"] .btn-primary {
    color: #ffffff !important;
}

/* ===========================================
   SVG ICONS - LIGHT THEME
   =========================================== */

[data-theme="light"] svg.text-white {
    color: #1f2937 !important;
}

[data-theme="light"] svg.text-gray-400 {
    color: #6b7280 !important;
}

[data-theme="light"] svg.text-gray-500\/50 {
    color: rgba(107, 114, 128, 0.5) !important;
}

[data-theme="light"] .opacity-80 svg path {
    fill: #374151 !important;
}

/* ===========================================
   BLUE CTA SECTIONS - KEEP COLORS ON LIGHT THEME
   Blue background sections should keep their original colors
   =========================================== */

[data-theme="light"] section.bg-blue-600 .text-white,
[data-theme="light"] section.bg-blue-600 h2,
[data-theme="light"] section.bg-blue-600 h3 {
    color: #ffffff !important;
}

[data-theme="light"] section.bg-blue-600 .text-blue-100,
[data-theme="light"] section.bg-blue-600 p {
    color: rgba(219, 234, 254, 1) !important; /* blue-100 */
}

[data-theme="light"] section.bg-blue-600 {
    background-color: #2563eb !important;
}

/* ===========================================
   DARK THEME (default/explicit)
   Keep original dark styles
   =========================================== */

[data-theme="dark"] {
    /* These are the default styles, no changes needed */
}

/* ===========================================
   SMOOTH TRANSITIONS FOR THEME SWITCHING
   =========================================== */

html {
    transition: background-color 0.2s ease-in-out;
}

body,
nav,
footer,
section,
.bg-gray-900,
.bg-gray-950,
.bg-gray-800,
.service-card,
.service-row,
.service-row__image,
.services-expertise-card,
.services-stat-divider,
.role-card,
.collab-card,
.feature-card {
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

/* ── Theme-conditional visibility utility classes ── */
.theme-light-only { display: none; }
[data-theme="light"] .theme-light-only { display: initial; }
[data-theme="light"] .theme-dark-only { display: none; }