/* Light theme — keep in sync with src/theme.css; loaded after styles.css */

html {
  overflow-x: hidden;
}
html[data-theme="dark"] {
  background-color: #060606;
}

html[data-theme="light"] {
  color-scheme: light;
  background-color: #f1f5f9;
}

html[data-theme="light"] body.min-h-screen {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
}

#site-nav.nav-is-scrolled {
  background-color: rgba(6, 6, 6, 0.8);
  -webkit-backdrop-filter: blur(40px);
  backdrop-filter: blur(40px);
  border-bottom-width: 1px;
  border-bottom-color: rgba(255, 255, 255, 0.06);
}
html[data-theme="light"] #site-nav.nav-is-scrolled {
  background-color: rgba(255, 255, 255, 0.92) !important;
  border-bottom-color: rgba(15, 23, 42, 0.08) !important;
}

/* Projects section — “more soon” callout (base styling = dark theme) */
.projects-soon-callout {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  max-width: 26rem;
  padding: 1rem 1.25rem;
  border-radius: 0.75rem;
  border: 1px dashed rgba(165, 180, 252, 0.45);
  background: linear-gradient(145deg, rgba(99, 102, 241, 0.14), rgba(15, 23, 42, 0.55));
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  text-align: left;
}
.projects-soon-callout__icon-wrap {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.5rem;
  background: rgba(99, 102, 241, 0.22);
  border: 1px solid rgba(165, 180, 252, 0.35);
}
.projects-soon-callout__icon {
  width: 1.125rem;
  height: 1.125rem;
  color: #c7d2fe;
}
.projects-soon-callout__icon svg {
  width: 1.125rem;
  height: 1.125rem;
}
.projects-soon-callout__body {
  min-width: 0;
}
.projects-soon-callout__kicker {
  margin: 0 0 0.35rem;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #a5b4fc;
}
.projects-soon-callout__title {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 500;
  line-height: 1.5;
  color: #e2e8f0;
}

html[data-theme="light"] .projects-soon-callout {
  border-color: rgba(99, 102, 241, 0.4) !important;
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 10px 28px rgba(79, 70, 229, 0.12) !important;
}
html[data-theme="light"] .projects-soon-callout__icon-wrap {
  background: rgba(99, 102, 241, 0.12) !important;
  border-color: rgba(99, 102, 241, 0.3) !important;
}
html[data-theme="light"] .projects-soon-callout__icon {
  color: #4f46e5 !important;
}
html[data-theme="light"] .projects-soon-callout__kicker {
  color: #4f46e5 !important;
}
html[data-theme="light"] .projects-soon-callout__title {
  color: #0f172a !important;
}

/* Dark theme — stronger white text (default Tailwind opacities read too dim on #060606) */
html[data-theme="dark"] .text-white\/10 {
  color: rgb(255 255 255 / 0.3);
}
html[data-theme="dark"] .text-white\/15 {
  color: rgb(255 255 255 / 0.35);
}
html[data-theme="dark"] .text-white\/20 {
  color: rgb(255 255 255 / 0.4);
}
html[data-theme="dark"] .text-white\/25 {
  color: rgb(255 255 255 / 0.45);
}
html[data-theme="dark"] .text-white\/30 {
  color: rgb(255 255 255 / 0.5);
}
html[data-theme="dark"] .text-white\/35 {
  color: rgb(255 255 255 / 0.55);
}
html[data-theme="dark"] .text-white\/40 {
  color: rgb(255 255 255 / 0.6);
}
html[data-theme="dark"] .text-white\/50 {
  color: rgb(255 255 255 / 0.7);
}
html[data-theme="dark"] .text-white\/60 {
  color: rgb(255 255 255 / 0.8);
}
html[data-theme="dark"] .text-white\/70 {
  color: rgb(255 255 255 / 0.9);
}
html[data-theme="dark"] .text-white\/80 {
  color: rgb(255 255 255 / 1);
}
html[data-theme="dark"] .hover\:text-white\/60:hover {
  color: rgb(255 255 255 / 0.85);
}
html[data-theme="dark"] .hover\:text-white\/70:hover {
  color: rgb(255 255 255 / 0.95);
}
html[data-theme="dark"] .hover\:text-white\/80:hover {
  color: rgb(255 255 255 / 1);
}
html[data-theme="dark"] .group:hover .group-hover\:text-white\/50 {
  color: rgb(255 255 255 / 0.75);
}
html[data-theme="dark"] .placeholder-white\/15::placeholder {
  color: rgb(255 255 255 / 0.35);
}

html[data-theme="light"] #cursor-glow {
  background-color: rgba(99, 102, 241, 0.08) !important;
}
html[data-theme="light"] .bg-blue-600\/\[0\.04\] {
  background-color: rgba(37, 99, 235, 0.08) !important;
}
html[data-theme="light"] .bg-purple-600\/\[0\.04\] {
  background-color: rgba(147, 51, 234, 0.07) !important;
}
html[data-theme="light"] .bg-emerald-600\/\[0\.03\] {
  background-color: rgba(5, 150, 105, 0.06) !important;
}

html[data-theme="light"] #ambient-grid {
  background-image: linear-gradient(rgba(15, 23, 42, 0.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 23, 42, 0.028) 1px, transparent 1px) !important;
}

html[data-theme="light"] .primary-solid-cta {
  background-color: #4f46e5 !important;
  color: #ffffff !important;
  box-shadow: 0 10px 28px -8px rgba(79, 70, 229, 0.45) !important;
}
html[data-theme="light"] .primary-solid-cta:hover {
  background-color: #4338ca !important;
}

html[data-theme="light"] #journey-rail {
  background-image: linear-gradient(
    to bottom,
    rgba(99, 102, 241, 0.5),
    rgba(148, 163, 184, 0.4),
    rgba(148, 163, 184, 0.12),
    transparent
  ) !important;
}

html[data-theme="light"] #experience-spine {
  background-image: linear-gradient(
    to bottom,
    rgba(16, 185, 129, 0.55),
    rgba(59, 130, 246, 0.5),
    rgba(139, 92, 246, 0.45)
  ) !important;
}

html[data-theme="light"] #skills span.border-blue-500\/20 {
  background-color: rgba(37, 99, 235, 0.11) !important;
}
html[data-theme="light"] #skills span.border-emerald-500\/20 {
  background-color: rgba(5, 150, 105, 0.11) !important;
}
html[data-theme="light"] #skills span.border-amber-500\/20 {
  background-color: rgba(245, 158, 11, 0.12) !important;
}
html[data-theme="light"] #skills span.border-purple-500\/20 {
  background-color: rgba(147, 51, 234, 0.11) !important;
}

html[data-theme="light"] .hover\:text-white\/80:hover {
  color: rgba(15, 23, 42, 0.85) !important;
}
html[data-theme="light"] .text-white {
  color: #0f172a !important;
}
html[data-theme="light"] .text-white\/50 {
  color: rgba(51, 65, 85, 0.85) !important;
}
html[data-theme="light"] .text-white\/40 {
  color: rgba(71, 85, 105, 0.95) !important;
}
html[data-theme="light"] .text-white\/60 {
  color: rgba(71, 85, 105, 0.95) !important;
}
html[data-theme="light"] .hover\:text-white\/70:hover {
  color: rgba(15, 23, 42, 0.88) !important;
}
html[data-theme="light"] .hover\:bg-white\/\[0\.04\]:hover {
  background-color: rgba(15, 23, 42, 0.05) !important;
}
html[data-theme="light"] button.nav-pill.text-white.bg-white\/\[0\.08\] {
  color: #0f172a !important;
  background-color: rgba(15, 23, 42, 0.07) !important;
}
html[data-theme="light"] .hover\:text-white:hover {
  color: #0f172a !important;
}

html[data-theme="light"] #theme-toggle {
  color: rgba(71, 85, 105, 0.95) !important;
}
html[data-theme="light"] #theme-toggle:hover {
  color: #0f172a !important;
  background-color: rgba(15, 23, 42, 0.06) !important;
}

html[data-theme="light"] #mobile-nav-panel {
  background-color: rgba(255, 255, 255, 0.96) !important;
  border-bottom-color: rgba(15, 23, 42, 0.08) !important;
}
html[data-theme="light"] .mobile-nav-link.text-white\/50 {
  color: rgba(71, 85, 105, 0.95) !important;
}

html[data-theme="light"] .text-white\/30 {
  color: rgba(51, 65, 85, 0.92) !important;
}
html[data-theme="light"] .text-white\/25 {
  color: rgba(71, 85, 105, 0.9) !important;
}
html[data-theme="light"] .text-white\/20 {
  color: rgba(71, 85, 105, 0.82) !important;
}
html[data-theme="light"] .text-white\/35 {
  color: rgba(51, 65, 85, 0.9) !important;
}
html[data-theme="light"] .text-white\/15 {
  color: rgba(100, 116, 139, 0.85) !important;
}
html[data-theme="light"] .text-white\/10 {
  color: rgba(100, 116, 139, 0.75) !important;
}

html[data-theme="light"] .text-indigo-400\/60 {
  color: rgba(67, 56, 202, 0.85) !important;
}
html[data-theme="light"] .text-indigo-400\/40 {
  color: rgba(67, 56, 202, 0.55) !important;
}
html[data-theme="light"] .text-indigo-400\/30 {
  color: rgba(67, 56, 202, 0.45) !important;
}
html[data-theme="light"] .text-indigo-400\/20 {
  color: rgba(67, 56, 202, 0.35) !important;
}
html[data-theme="light"] .text-indigo-400 {
  color: #4f46e5 !important;
}

html[data-theme="light"] .text-blue-300\/25 {
  color: rgba(29, 78, 216, 0.72) !important;
}
html[data-theme="light"] .text-emerald-300\/25 {
  color: rgba(5, 122, 85, 0.75) !important;
}
html[data-theme="light"] .text-violet-300\/25 {
  color: rgba(109, 40, 217, 0.72) !important;
}
html[data-theme="light"] .text-amber-300\/25 {
  color: rgba(180, 83, 9, 0.75) !important;
}
html[data-theme="light"] .text-purple-400\/20,
html[data-theme="light"] .text-cyan-400\/20,
html[data-theme="light"] .text-pink-400\/20 {
  opacity: 1;
  color: rgba(91, 33, 182, 0.78) !important;
}
html[data-theme="light"] .text-cyan-400\/20 {
  color: rgba(14, 116, 144, 0.82) !important;
}
html[data-theme="light"] .text-pink-400\/20 {
  color: rgba(190, 24, 93, 0.78) !important;
}

html[data-theme="light"] .border-blue-500\/20.text-blue-300 {
  color: rgb(29 78 216) !important;
  border-color: rgba(37, 99, 235, 0.25) !important;
}
html[data-theme="light"] .hover\:border-blue-400\/40:hover {
  border-color: rgba(37, 99, 235, 0.35) !important;
}
html[data-theme="light"] .hover\:bg-blue-500\/5:hover {
  background-color: rgba(37, 99, 235, 0.06) !important;
}
html[data-theme="light"] .border-emerald-500\/20.text-emerald-300 {
  color: rgb(5 122 85) !important;
  border-color: rgba(5, 150, 105, 0.25) !important;
}
html[data-theme="light"] .hover\:border-emerald-400\/40:hover {
  border-color: rgba(5, 150, 105, 0.35) !important;
}
html[data-theme="light"] .hover\:bg-emerald-500\/5:hover {
  background-color: rgba(5, 150, 105, 0.06) !important;
}
html[data-theme="light"] .border-amber-500\/20.text-amber-300 {
  color: rgb(180 83 9) !important;
  border-color: rgba(245, 158, 11, 0.28) !important;
}
html[data-theme="light"] .hover\:border-amber-400\/40:hover {
  border-color: rgba(245, 158, 11, 0.35) !important;
}
html[data-theme="light"] .hover\:bg-amber-500\/5:hover {
  background-color: rgba(245, 158, 11, 0.07) !important;
}
html[data-theme="light"] .border-purple-500\/20.text-purple-300 {
  color: rgb(109 40 217) !important;
  border-color: rgba(147, 51, 234, 0.25) !important;
}
html[data-theme="light"] .hover\:border-purple-400\/40:hover {
  border-color: rgba(147, 51, 234, 0.35) !important;
}
html[data-theme="light"] .hover\:bg-purple-500\/5:hover {
  background-color: rgba(147, 51, 234, 0.06) !important;
}
html[data-theme="light"] .text-purple-400\/40 {
  color: rgba(109, 40, 217, 0.65) !important;
}

html[data-theme="light"] .text-violet-400\/70 {
  color: rgba(109, 40, 217, 0.85) !important;
}
html[data-theme="light"] .text-cyan-400\/70 {
  color: rgba(14, 116, 144, 0.9) !important;
}

html[data-theme="light"] .glow-card.border-white\/\[0\.06\] {
  border-color: rgba(15, 23, 42, 0.08) !important;
  background-color: rgba(255, 255, 255, 0.85) !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}
html[data-theme="light"] .glow-card.hover\:border-white\/\[0\.12\]:hover {
  border-color: rgba(15, 23, 42, 0.12) !important;
}
html[data-theme="light"] .glow-card.hover\:bg-white\/\[0\.04\]:hover {
  background-color: #ffffff !important;
}

html[data-theme="light"] .bg-white\/\[0\.04\] {
  background-color: rgba(15, 23, 42, 0.04) !important;
}
html[data-theme="light"] .border-white\/\[0\.06\] {
  border-color: rgba(15, 23, 42, 0.1) !important;
}
html[data-theme="light"] .border-white\/\[0\.08\] {
  border-color: rgba(15, 23, 42, 0.1) !important;
}
html[data-theme="light"] .border-white\/\[0\.04\] {
  border-color: rgba(15, 23, 42, 0.08) !important;
}
html[data-theme="light"] .border-white\/\[0\.03\] {
  border-color: rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] .border-dashed.border-white\/\[0\.06\] {
  border-color: rgba(15, 23, 42, 0.12) !important;
}

html[data-theme="light"] .bg-indigo-600\/\[0\.06\] {
  background-color: rgba(79, 70, 229, 0.1) !important;
}
html[data-theme="light"] .bg-blue-600\/\[0\.05\] {
  background-color: rgba(37, 99, 235, 0.08) !important;
}
html[data-theme="light"] .bg-indigo-600\/\[0\.04\] {
  background-color: rgba(79, 70, 229, 0.08) !important;
}

html[data-theme="light"] .bg-\[\#060606\] {
  background-color: #f1f5f9 !important;
}
html[data-theme="light"] .border-indigo-500\/40 {
  border-color: rgba(99, 102, 241, 0.45) !important;
}

html[data-theme="light"] .from-\[\#060606\]\/50 {
  --tw-gradient-from: rgba(15, 23, 42, 0.35) var(--tw-gradient-from-position) !important;
}
html[data-theme="light"] .via-\[\#060606\]\/40 {
  --tw-gradient-stops: var(--tw-gradient-from), rgba(15, 23, 42, 0.15) var(--tw-gradient-via-position),
    var(--tw-gradient-to) !important;
}
html[data-theme="light"] .from-\[\#060606\] {
  --tw-gradient-from: #0f172a var(--tw-gradient-from-position) !important;
}

html[data-theme="light"] .via-indigo-500\/\[0\.015\] {
  --tw-gradient-stops: var(--tw-gradient-from), rgba(99, 102, 241, 0.04) var(--tw-gradient-via-position),
    var(--tw-gradient-to) !important;
}

html[data-theme="light"] .border-white\/\[0\.1\] {
  border-color: rgba(15, 23, 42, 0.15) !important;
}
html[data-theme="light"] .hover\:border-white\/20:hover {
  border-color: rgba(15, 23, 42, 0.25) !important;
}

html[data-theme="light"] .bg-white\/\[0\.03\] {
  background-color: #ffffff !important;
}
html[data-theme="light"] .focus\:bg-white\/\[0\.05\]:focus {
  background-color: #f8fafc !important;
}
html[data-theme="light"] .focus\:border-indigo-500\/30:focus {
  border-color: rgba(99, 102, 241, 0.45) !important;
}
html[data-theme="light"] .placeholder-white\/15::placeholder {
  color: rgba(100, 116, 139, 0.65) !important;
}

/* Contact row links — clearer chips on #f1f5f9 */
html[data-theme="light"] a.border-white\/\[0\.06\].bg-white\/\[0\.02\] {
  border-color: rgba(15, 23, 42, 0.14) !important;
  background-color: #ffffff !important;
  color: rgba(51, 65, 85, 0.98) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 2px 10px rgba(15, 23, 42, 0.04) !important;
}
html[data-theme="light"] a.hover\:text-white\/60:hover {
  color: #0f172a !important;
}
html[data-theme="light"] a.hover\:border-white\/\[0\.12\]:hover {
  border-color: rgba(99, 102, 241, 0.4) !important;
}
html[data-theme="light"] a.hover\:bg-white\/\[0\.04\]:hover {
  background-color: rgba(99, 102, 241, 0.07) !important;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.07), 0 6px 16px rgba(79, 70, 229, 0.1) !important;
}

html[data-theme="light"] footer.border-white\/\[0\.04\] {
  border-color: rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] .text-red-400\/90 {
  color: rgb(220 38 38) !important;
}

html[data-theme="light"] .hero-metric-gradient {
  background-image: linear-gradient(to right, #0f172a, #334155, #64748b) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
}

html[data-theme="light"] .scroll-hint-line {
  background-image: linear-gradient(to bottom, rgba(15, 23, 42, 0.25), transparent) !important;
}

html[data-theme="light"] .text-emerald-500\/30 {
  color: rgba(5, 150, 105, 0.55) !important;
}
html[data-theme="light"] .text-blue-500\/30 {
  color: rgba(37, 99, 235, 0.55) !important;
}
html[data-theme="light"] .text-violet-500\/30 {
  color: rgba(139, 92, 246, 0.55) !important;
}

html[data-theme="light"] .focus-visible\:ring-offset-\[\#060606\] {
  --tw-ring-offset-color: #f1f5f9 !important;
}

html[data-theme="light"] .group:hover .group-hover\:text-white\/50 {
  color: rgba(71, 85, 105, 0.75) !important;
}
html[data-theme="light"] .group:hover .group-hover\:opacity-80 {
  opacity: 0.9 !important;
}
