/* Theme variables */
:root,
[data-theme="dark"] {
  color-scheme: dark;
  --bg-body: #09090b;
  --bg-elevated: #18181b;
  --bg-muted: #27272a;
  --bg-section: rgba(24, 24, 27, 0.5);
  --text-primary: #e4e4e7;
  --text-secondary: #d4d4d8;
  --text-muted: #a1a1aa;
  --text-faint: #71717a;
  --border-color: #3f3f46;
  --border-light: #27272a;
  --glass-bg: rgba(9, 9, 11, 0.82);
  --neon-shadow: rgba(59, 130, 246, 0.45);
  --scrollbar-track: #18181b;
  --scrollbar-thumb: #3f3f46;
  --menu-overlay: rgba(0, 0, 0, 0.6);
  --nav-text: #e4e4e7;
  --nav-text-hover: #60a5fa;
  --card-shadow: none;
}

[data-theme="light"] {
  color-scheme: light;
  --bg-body: #ffffff;
  --bg-elevated: #ffffff;
  --bg-muted: #f8fafc;
  --bg-section: #f1f5f9;
  --text-primary: #0f172a;
  --text-secondary: #334155;
  --text-muted: #64748b;
  --text-faint: #94a3b8;
  --border-color: #e2e8f0;
  --border-light: #cbd5e1;
  --glass-bg: #ffffff;
  --neon-shadow: rgba(37, 99, 235, 0.15);
  --scrollbar-track: #f1f5f9;
  --scrollbar-thumb: #cbd5e1;
  --menu-overlay: rgba(15, 23, 42, 0.25);
  --nav-text: #0f172a;
  --nav-text-hover: #2563eb;
  --card-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 4px 12px rgba(15, 23, 42, 0.04);
}

html {
  scroll-behavior: smooth;
}

body {
  -webkit-font-smoothing: antialiased;
  background-color: var(--bg-body);
  color: var(--text-primary);
  transition: background-color 0.3s, color 0.3s;
}

.font-fa {
  font-family: 'Vazirmatn', Tahoma, system-ui, sans-serif;
}

.font-en {
  font-family: 'Inter', system-ui, sans-serif;
}

/* Navigation */
.site-nav {
  background: var(--glass-bg) !important;
  border-bottom-color: var(--border-color) !important;
  transition: background-color 0.3s, border-color 0.3s, box-shadow 0.3s;
}

[data-theme="light"] .site-nav {
  box-shadow: 0 1px 0 #e2e8f0, 0 4px 16px rgba(15, 23, 42, 0.06);
}

.nav-brand,
.nav-link {
  color: var(--nav-text);
  transition: color 0.2s;
}

.nav-brand:hover,
.nav-link:hover {
  color: var(--nav-text-hover) !important;
}

.nav-icon-btn {
  color: var(--text-muted);
  border-color: var(--border-color) !important;
  background: var(--bg-muted);
  transition: color 0.2s, border-color 0.2s, background-color 0.2s;
}

[data-theme="light"] .nav-icon-btn {
  background: #f8fafc;
}

.nav-icon-btn:hover {
  color: var(--nav-text-hover) !important;
  border-color: #3b82f6 !important;
}

.lang-switcher {
  background: var(--bg-muted) !important;
  border-color: var(--border-color) !important;
}

.lang-inactive {
  color: var(--text-muted) !important;
}

.lang-inactive:hover {
  color: var(--nav-text-hover) !important;
}

.glass {
  background: var(--glass-bg);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

[data-theme="light"] .glass {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.neon-text {
  text-shadow: 0 0 20px var(--neon-shadow);
}

[data-theme="light"] .neon-text {
  text-shadow: none;
  color: #0f172a;
}

/* Hero */
[data-theme="light"] .hero-section {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 45%, #e0e7ff 100%) !important;
}

[data-theme="light"] .hero-glow {
  opacity: 0.18 !important;
}

[data-theme="light"] .hero-glow .bg-blue-600 {
  background-color: #93c5fd !important;
}

[data-theme="light"] .hero-glow .bg-purple-600 {
  background-color: #c4b5fd !important;
}

/* Sections */
[data-theme="light"] .section-alt {
  background-color: #f1f5f9 !important;
}

[data-theme="light"] .theme-card {
  background-color: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: var(--card-shadow);
}

[data-theme="light"] .theme-card:hover {
  border-color: #93c5fd !important;
}

[data-theme="light"] .theme-input {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

[data-theme="light"] .theme-input:focus {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

[data-theme="light"] .theme-input::placeholder {
  color: #94a3b8 !important;
}

[data-theme="light"] .site-footer {
  background-color: #f8fafc;
  border-color: #e2e8f0 !important;
  color: #64748b;
}

.skill-bar {
  transition: width 1.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.project-card:hover .project-overlay {
  opacity: 1;
}

.timeline-line::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, #3b82f6, #8b5cf6, transparent);
}

[dir="rtl"] .timeline-line::before { right: 0; }
[dir="ltr"] .timeline-line::before { left: 0; }

.gallery-thumb.active {
  border-color: #3b82f6;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-fade-up {
  animation: fadeUp 0.7s ease-out forwards;
}

/* Mobile menu */
#mobile-menu {
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

#mobile-menu.open {
  visibility: visible;
  pointer-events: auto;
  opacity: 1;
}

#menu-overlay {
  background: var(--menu-overlay);
  opacity: 0;
  transition: opacity 0.3s ease;
}

#mobile-menu.open #menu-overlay {
  opacity: 1;
}

#mobile-menu-panel {
  background: var(--bg-elevated);
  border-color: var(--border-light);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

[data-theme="light"] #mobile-menu-panel {
  box-shadow: -8px 0 32px rgba(15, 23, 42, 0.1);
}

[dir="rtl"] #mobile-menu-panel { transform: translateX(100%); }
[dir="ltr"] #mobile-menu-panel { transform: translateX(-100%); }
#mobile-menu.open #mobile-menu-panel { transform: translateX(0); }

/* Theme toggle icons */
.theme-toggle .icon-sun,
.theme-toggle .icon-moon { transition: opacity 0.2s, transform 0.2s; }

[data-theme="dark"] .theme-toggle .icon-sun { display: none; }
[data-theme="dark"] .theme-toggle .icon-moon { display: inline; }
[data-theme="light"] .theme-toggle .icon-sun { display: inline; }
[data-theme="light"] .theme-toggle .icon-moon { display: none; }

/* Light mode — Tailwind utility overrides */
[data-theme="light"] .bg-zinc-950 { background-color: #ffffff !important; }
[data-theme="light"] .bg-zinc-900 { background-color: #ffffff !important; }
[data-theme="light"] .bg-zinc-900\/50 { background-color: #f1f5f9 !important; }
[data-theme="light"] .bg-zinc-800 { background-color: #f8fafc !important; }
[data-theme="light"] .bg-zinc-800\/80 { background-color: #ffffff !important; }
[data-theme="light"] .bg-zinc-700 { background-color: #e2e8f0 !important; }
[data-theme="light"] .bg-zinc-700\/80 { background-color: #f1f5f9 !important; }

[data-theme="light"] .from-zinc-950 { --tw-gradient-from: #ffffff !important; }
[data-theme="light"] .via-zinc-900 { --tw-gradient-via: #f8fafc !important; }
[data-theme="light"] .to-black { --tw-gradient-to: #e0e7ff !important; }
[data-theme="light"] .from-zinc-700 { --tw-gradient-from: #e2e8f0 !important; }
[data-theme="light"] .to-zinc-800 { --tw-gradient-to: #f1f5f9 !important; }

[data-theme="light"] .text-zinc-200 { color: #0f172a !important; }
[data-theme="light"] .text-zinc-300 { color: #334155 !important; }
[data-theme="light"] .text-zinc-400 { color: #475569 !important; }
[data-theme="light"] .text-zinc-500 { color: #64748b !important; }

[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] .font-bold,
[data-theme="light"] .font-semibold {
  color: #0f172a;
}

[data-theme="light"] .border-zinc-800,
[data-theme="light"] .border-zinc-800\/80 { border-color: #e2e8f0 !important; }
[data-theme="light"] .border-zinc-700,
[data-theme="light"] .border-zinc-700\/80 { border-color: #cbd5e1 !important; }

[data-theme="light"] .hover\:text-white:hover { color: #2563eb !important; }
[data-theme="light"] .hover\:border-zinc-400:hover { border-color: #94a3b8 !important; }
[data-theme="light"] .hover\:border-zinc-500:hover { border-color: #64748b !important; }
[data-theme="light"] .border-4.border-zinc-900 { border-color: #ffffff !important; }

[data-theme="light"] .hover\:bg-zinc-800\/50:hover { background-color: #f1f5f9 !important; }

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

[data-theme="light"] .profile-frame-inner {
  background-color: #f1f5f9 !important;
}

[data-theme="light"] .btn-outline {
  border-color: #cbd5e1 !important;
  color: #334155 !important;
  background-color: #ffffff;
}

[data-theme="light"] .btn-outline:hover {
  border-color: #64748b !important;
  color: #0f172a !important;
}

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

[data-theme="light"] .social-link:hover {
  color: #2563eb !important;
}

[data-theme="light"] .skill-icon-box {
  background-color: #f1f5f9 !important;
}

[data-theme="light"] .skill-track {
  background-color: #e2e8f0 !important;
}

[data-theme="light"] .flash-message.bg-emerald-900\/90 { background-color: #d1fae5 !important; color: #065f46 !important; border-color: #6ee7b7 !important; }
[data-theme="light"] .flash-message.bg-red-900\/90 { background-color: #fee2e2 !important; color: #991b1b !important; border-color: #fca5a5 !important; }
[data-theme="light"] .flash-message.bg-blue-900\/90 { background-color: #dbeafe !important; color: #1e40af !important; border-color: #93c5fd !important; }

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--scrollbar-track); }
::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #52525b; }
[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
