/* Mathematical spacing grid variables */
:root {
  --space-4: 4px;
  --space-8: 8px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-48: 48px;
  --space-64: 64px;
  --space-96: 96px;
  --space-128: 128px;
  --space-160: 160px;
}

/* Light mode overrides */
[data-theme="light"] {
  --c-brand-main-rgb: 249, 115, 22;
  --c-brand-light-rgb: 251, 146, 60;
  --bg-body: #f8fafc;
  --bg-surface-1: #ffffff;
  --bg-surface-2: #f1f5f9;
  --bg-glass: rgba(255,255,255,0.7);
  --bg-glass-heavy: rgba(248,250,252,0.95);
  --text-primary: #020617;
  --text-secondary: #334155;
  --text-tertiary: #64748b;
  --text-invert: #f8fafc;
  --border-glass: rgba(0,0,0,0.08);
  --border-highlight: rgba(249,115,22,0.4);
  
  --c-brand-darkest: #431407;
  --c-brand-dark: #7c2d12;
  --c-brand-main: #f97316;
  --c-brand-glow: #fdba74;
  --c-brand-light: #fb923c;
  
  --shadow-sm: 0 2px 4px rgba(0,0,0,0.05);
  --shadow-lg: 0 20px 40px -10px rgba(0,0,0,0.1);
}

/* Light mode component specific fixes */
[data-theme="light"] .footer {
  background: #000;
  color: #f8fafc;
}
[data-theme="light"] .footer .footer-heading { color: rgba(255,255,255,.4); }
[data-theme="light"] .footer .footer-link { color: rgba(255,255,255,.55); }
[data-theme="light"] .footer .footer-link:hover { color: var(--c-brand-light); }
[data-theme="light"] .footer .social-btn { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.07); color: rgba(255,255,255,.45); }
[data-theme="light"] .footer .copyright { border-color: rgba(255,255,255,.07); color: rgba(255,255,255,.3); }
[data-theme="light"] .footer .owner-signature { color: rgba(255,255,255,.3); }

[data-theme="light"] .header.scrolled {
  box-shadow: 0 10px 40px rgba(0,0,0,0.08);
}

[data-theme="light"] .service-card,
[data-theme="light"] .card,
[data-theme="light"] .form-card,
[data-theme="light"] .stat-block,
[data-theme="light"] .portfolio-card {
  background: #ffffff;
  border-color: rgba(0,0,0,0.08);
}

[data-theme="light"] .service-card:hover,
[data-theme="light"] .card:hover,
[data-theme="light"] .portfolio-card:hover {
  box-shadow: 0 20px 40px rgba(0,0,0,0.1);
  border-color: rgba(14,116,144,0.3);
}

[data-theme="light"] .service-card::before { background: linear-gradient(135deg,rgba(14,116,144,.2),rgba(0,0,0,.03) 50%,rgba(139,92,246,.1)); }
[data-theme="light"] .service-num { color: rgba(0,0,0,0.04); }
[data-theme="light"] .service-card h3,
[data-theme="light"] .portfolio-card-body h3,
[data-theme="light"] .process-step h3 { color: #020617 !important; }
[data-theme="light"] .service-card p,
[data-theme="light"] .portfolio-card-body p,
[data-theme="light"] .process-step p { color: #334155 !important; }



[data-theme="light"] .hero-card-3d {
  background: rgba(255,255,255,0.8);
  border-color: rgba(0,0,0,0.08);
}

[data-theme="light"] .process-number { background: #ffffff; border-color: rgba(0,0,0,0.08); }

[data-theme="light"] .tech-card { background: #ffffff; border-color: rgba(0,0,0,0.08); }
[data-theme="light"] .tech-name { color: #334155; }
[data-theme="light"] .tech-card:hover .tech-name { color: #020617; }

[data-theme="light"] .btn-secondary { color: #020617; border-color: rgba(0,0,0,0.1); }
[data-theme="light"] .btn-secondary:hover { color: #fff; border-color: var(--c-brand-main); }

[data-theme="light"] .input-field { background: #fff; border-color: rgba(0,0,0,0.1); color: #020617; }
[data-theme="light"] .input-field:focus, [data-theme="light"] .input-field:not(:placeholder-shown) { background: #fff; }

/* Theme Toggle Button */
.theme-toggle-btn {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--border-glass);
  border-radius: 999px;
  width: 56px;
  height: 28px;
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 4px;
  color: var(--text-secondary);
  font-size: 14px;
  transition: all 0.3s ease;
  margin-left: 1rem;
}
.theme-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.1);
}
.theme-toggle-btn::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 22px;
  height: 22px;
  background: var(--c-brand-light);
  border-radius: 50%;
  transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  box-shadow: 0 0 10px rgba(103,232,249,0.5);
  z-index: 1;
}
[data-theme="light"] .theme-toggle-btn::after {
  transform: translateX(28px);
  background: var(--c-brand-main);
  box-shadow: 0 0 10px rgba(14,116,144,0.5);
}
[data-theme="light"] .theme-toggle-btn {
  background: rgba(0, 0, 0, 0.05);
}
.theme-icon {
  z-index: 2;
  position: relative;
  pointer-events: none;
}

[data-theme="light"] .service-card::before { background: linear-gradient(135deg, rgba(249,115,22,0.2), rgba(0,0,0,0.03) 50%, rgba(251,146,60,0.1)); }
[data-theme="light"] .theme-toggle-btn::after {
  background: #f97316;
  box-shadow: 0 0 10px rgba(249,115,22,0.5);
}
[data-theme="light"] .btn-primary {
  background: #f97316;
  color: #fff;
  border-color: rgba(249,115,22,0.2);
  box-shadow: 0 0 20px rgba(249,115,22,0.4);
}
[data-theme="light"] .btn-primary:hover {
  color: #fff;
  border-color: #fb923c;
  box-shadow: 0 0 40px rgba(249,115,22,0.6);
}
[data-theme="light"] .btn-primary::before {
  background: radial-gradient(circle, #fb923c 0, #f97316 100%);
}
[data-theme="light"] .float-tag { border-color: #f97316; color: #020617; }
[data-theme="light"] .process-number { color: #f97316; }
[data-theme="light"] .process-step:hover .process-number { background: #f97316; color: #fff; border-color: #fb923c; }
[data-theme="light"] .text-gradient {
  background: linear-gradient(135deg, #7c2d12 10%, #f97316 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Make sure all hardcoded #fff text becomes dark in light mode */
[data-theme="light"] body { color: #020617; }
[data-theme="light"] .stat-number, 

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

[data-theme="light"] .card h3, [data-theme="light"] .service-card h3, [data-theme="light"] .portfolio-card-body h3, [data-theme="light"] .process-step h3 {
    color: #020617 !important;
}

[data-theme="light"] p, [data-theme="light"] .stat-label, [data-theme="light"] .service-card p, [data-theme="light"] .process-step p, [data-theme="light"] .portfolio-card-body p {
    color: #334155 !important;
}

[data-theme="light"] .btn-primary {
    background: #f97316 !important;
    color: #fff !important;
    border-color: rgba(249,115,22,0.2) !important;
    box-shadow: 0 0 20px rgba(249,115,22,0.4) !important;
}

[data-theme="light"] .btn-primary:hover {
    border-color: #fb923c !important;
    box-shadow: 0 0 40px rgba(249,115,22,0.6) !important;
}

[data-theme="light"] .float-tag { border-color: #f97316 !important; color: #020617 !important; background: #fff !important; }
[data-theme="light"] .process-number { color: #f97316 !important; background: #fff !important; }
[data-theme="light"] .process-step:hover .process-number { background: #f97316 !important; color: #fff !important; border-color: #fb923c !important; }

[data-theme="light"] .footer {
    background: #ffffff !important;
    border-top: 1px solid rgba(0,0,0,0.1) !important;
}

[data-theme="light"] .footer-heading {
    color: #334155 !important;
}

[data-theme="light"] .footer-link {
    color: #475569 !important;
}

[data-theme="light"] .footer-link:hover {
    color: #f97316 !important;
}

[data-theme="light"] .social-btn {
    background: rgba(0,0,0,0.04) !important;
    border-color: rgba(0,0,0,0.07) !important;
    color: #334155 !important;
}

[data-theme="light"] .social-btn:hover {
    background: #f97316 !important;
    color: #fff !important;
}

[data-theme="light"] .copyright {
    border-top: 1px solid rgba(0,0,0,0.1) !important;
    color: #64748b !important;
}

[data-theme="light"] .owner-signature {
    color: #64748b !important;
}

[data-theme="light"] .owner-signature:hover {
    color: #f97316 !important;
}

[data-theme="light"] .owner-signature::before {
    color: #f97316 !important;
}


[data-theme="light"] {
    --c-brand-darkest: #f8fafc !important;
    --c-brand-dark: #f1f5f9 !important;
    --c-brand-main: #f97316 !important;
    --c-brand-glow: #fb923c !important;
    --c-brand-light: #fdba74 !important;
    
    --bg-body: #ffffff !important;
    --bg-surface-1: #f8fafc !important;
    --bg-surface-2: #f1f5f9 !important;
    --bg-glass: rgba(255,255,255,0.85) !important;
    --bg-glass-heavy: rgba(255,255,255,0.95) !important;
    
    --border-glass: rgba(0,0,0,0.1) !important;
    --border-highlight: rgba(249,115,22,0.4) !important;
    
    --text-primary: #020617 !important;
    --text-secondary: #334155 !important;
    --text-tertiary: #475569 !important;
    --text-invert: #ffffff !important;
}

[data-theme="light"] .evolnex-logo,
[data-theme="light"] .footer-evolnex-logo {
    filter: invert(1) !important;
}

/* Fix any remaining hardcoded whites */
[data-theme="light"] .service-card h3,
[data-theme="light"] .process-step h3,
[data-theme="light"] .portfolio-card-body h3,
[data-theme="light"] .card-icon,
[data-theme="light"] .tech-name,
[data-theme="light"] .astra-header-info h4,
[data-theme="light"] .astra-msg.bot {
    color: #020617 !important;
}

[data-theme="light"] .service-card p,
[data-theme="light"] .process-step p,
[data-theme="light"] .portfolio-card-body p,
[data-theme="light"] .tech-category-label {
    color: #334155 !important;
}

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

[data-theme="light"] .hero-badge {
    color: #020617 !important;
    background: rgba(255,255,255,0.9) !important;
    border-color: rgba(0,0,0,0.1) !important;
}

[data-theme="light"] .card-icon {
    background: linear-gradient(135deg, rgba(249,115,22,0.2), rgba(0,0,0,0.05)) !important;
}

[data-theme="light"] .service-card {
    background: linear-gradient(145deg, #f8fafc, #f1f5f9) !important;
    border: 1px solid rgba(0,0,0,0.05) !important;
}

[data-theme="light"] .tech-card {
    background: #f8fafc !important;
    border-color: rgba(0,0,0,0.05) !important;
}

[data-theme="light"] .tech-card:hover {
    background: #ffffff !important;
    box-shadow: 0 16px 36px rgba(249,115,22,0.15) !important;
}

[data-theme="light"] .btn-primary {
    background: #f97316 !important;
    color: #fff !important;
    box-shadow: 0 0 20px rgba(249,115,22,0.4) !important;
}
[data-theme="light"] .btn-primary:hover {
    box-shadow: 0 0 40px rgba(249,115,22,0.6) !important;
}

[data-theme="light"] .astra-chat-window {
    background: rgba(255,255,255,0.95) !important;
    border-color: rgba(0,0,0,0.1) !important;
}
[data-theme="light"] .astra-chat-header {
    background: #f8fafc !important;
    border-color: rgba(0,0,0,0.1) !important;
}
[data-theme="light"] .astra-msg.user {
    background: #f97316 !important;
    color: #fff !important;
}


/* Invert graphics to turn white to black and blue to orange */
[data-theme="light"] .footer-graphic svg,
[data-theme="light"] .hero-visual svg,
[data-theme="light"] svg.ambient-blob,
[data-theme="light"] .client-logo {
    filter: invert(1) contrast(1.2) !important;
}

/* Hardcoded SVGs with stroke */
[data-theme="light"] svg [stroke="rgba(255,255,255,0.04)"],
[data-theme="light"] svg [stroke="rgba(103,232,249,0.06)"],
[data-theme="light"] svg [stroke="rgba(14,116,144,0.6)"],
[data-theme="light"] svg [stroke="rgba(14,116,144,0.3)"],
[data-theme="light"] svg [stroke="rgba(14,116,144,0.15)"] {
    filter: invert(1) !important;
}


/* FIX INVISIBLE TEXT IN DARK SECTIONS */
[data-theme="light"] .cta-card h2,
[data-theme="light"] .cta-card h3,
[data-theme="light"] .cta-card p,
[data-theme="light"] .cta-section h2,
[data-theme="light"] .cta-section h3,
[data-theme="light"] .cta-section p,
[data-theme="light"] .footer h2,
[data-theme="light"] .footer h3,
[data-theme="light"] .footer p,
[data-theme="light"] .footer a {
    color: #ffffff !important;
}

[data-theme="light"] .footer,
[data-theme="light"] .cta-section,
[data-theme="light"] .cta-card {
    background-color: #020617 !important;
}

/* FIX ALL SVGS IN LIGHT MODE */
[data-theme="light"] svg {
    filter: invert(1) brightness(0.8) !important;
}
/* Except SVGs in dark sections */
[data-theme="light"] .footer svg,
[data-theme="light"] .cta-card svg,
[data-theme="light"] .cta-section svg {
    filter: none !important;
}

/* Ensure Logo inverts properly */
[data-theme="light"] .evolnex-logo {
    filter: invert(1) !important;
}
[data-theme="light"] .footer .evolnex-logo {
    filter: none !important; /* Keep original white/blue in dark footer */
}

/* Particles should be visible */
[data-theme="light"] #webgl-hero {
    filter: none !important;
    opacity: 1 !important;
}

[data-theme='light'] img[src*='evolnex'] {
    filter: hue-rotate(190deg) saturate(1.5) brightness(0.9);
}