/* ============================================
   Theme Transitions for Light/Dark Mode
   ============================================ */

.theme-transition,
.theme-transition *,
.theme-transition *::before,
.theme-transition *::after {
  transition: background-color 0.6s cubic-bezier(0.22, 1, 0.36, 1),
              color 0.6s cubic-bezier(0.22, 1, 0.36, 1),
              border-color 0.6s cubic-bezier(0.22, 1, 0.36, 1),
              box-shadow 0.6s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

/* Light mode specific overrides */
html[data-theme="light"] body {
  background: var(--bg);
}

html[data-theme="light"] .hero-badge {
  background: var(--bg-2);
}

html[data-theme="light"] .service-card:hover {
  box-shadow: 0 20px 60px rgba(139, 92, 246, 0.08);
}

html[data-theme="light"] .preloader {
  background: #fafafa;
}

html[data-theme="light"] .preloader-bar {
  background: rgba(0, 0, 0, 0.1);
}

html[data-theme="light"] .preloader-percent {
  color: rgba(0, 0, 0, 0.5);
}

html[data-theme="light"] .logo-text {
  -webkit-text-stroke: 1px rgba(0, 0, 0, 0.3);
}

html[data-theme="light"] .logo-text::before {
  color: #18181b;
}

html[data-theme="light"] .logo-text:last-child::before {
  background: var(--gradient);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

html[data-theme="light"] .showcase-item:hover {
  background: var(--bg-3);
}

html[data-theme="light"] .navbar.scrolled {
  background: rgba(255, 255, 255, 0.8);
}

/* Theme icon swap */
.theme-toggle .fa-moon { display: block; }
.theme-toggle .fa-sun { display: none; }

html[data-theme="light"] .theme-toggle .fa-moon { display: none; }
html[data-theme="light"] .theme-toggle .fa-sun { display: block; }