/* ═══════════════════════════════════════════
   THEME SYSTEM — CSS Custom Properties
   নতুন থিম যোগ করতে শুধু নিচের প্যাটার্ন কপি করুন
   ═══════════════════════════════════════════ */

:root {
  --transition-speed: 0.35s;
  --font-main: 'Inter', 'Segoe UI', system-ui, sans-serif;
}

/* ─── ১. Modern (Navy + Blue) ─── */
.theme-modern {
  --primary: #1e3a5f;
  --secondary: #2563eb;
  --accent: #60a5fa;
  --bg: #ffffff;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #e5e7eb;
  --header-bg: linear-gradient(135deg, #1e3a5f 0%, #2563eb 100%);
  --header-text: #ffffff;
  --card-bg: #f8fafc;
  --tag-bg: #2563eb;
}

/* ─── ২. Emerald (Green) ─── */
.theme-emerald {
  --primary: #064e3b;
  --secondary: #059669;
  --accent: #34d399;
  --bg: #ffffff;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #d1fae5;
  --header-bg: linear-gradient(135deg, #064e3b 0%, #059669 100%);
  --header-text: #ffffff;
  --card-bg: #ecfdf5;
  --tag-bg: #059669;
}

/* ─── ৩. Sunset (Orange + Pink) ─── */
.theme-sunset {
  --primary: #7c2d12;
  --secondary: #ea580c;
  --accent: #fb923c;
  --bg: #ffffff;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #ffedd5;
  --header-bg: linear-gradient(135deg, #ea580c 0%, #f43f5e 100%);
  --header-text: #ffffff;
  --card-bg: #fff7ed;
  --tag-bg: #ea580c;
}

/* ─── ৪. Royal (Purple) ─── */
.theme-royal {
  --primary: #4c1d95;
  --secondary: #7c3aed;
  --accent: #a78bfa;
  --bg: #ffffff;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #ede9fe;
  --header-bg: linear-gradient(135deg, #4c1d95 0%, #7c3aed 100%);
  --header-text: #ffffff;
  --card-bg: #f5f3ff;
  --tag-bg: #7c3aed;
}

/* ─── ৫. Ocean (Teal + Cyan) ─── */
.theme-ocean {
  --primary: #134e4a;
  --secondary: #0d9488;
  --accent: #2dd4bf;
  --bg: #ffffff;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #ccfbf1;
  --header-bg: linear-gradient(135deg, #134e4a 0%, #0d9488 100%);
  --header-text: #ffffff;
  --card-bg: #f0fdfa;
  --tag-bg: #0d9488;
}

/* ─── ৬. Midnight (Dark) ─── */
.theme-midnight {
  --primary: #0f172a;
  --secondary: #1e293b;
  --accent: #38bdf8;
  --bg: #ffffff;
  --text: #1e293b;
  --text-light: #64748b;
  --border: #e2e8f0;
  --header-bg: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  --header-text: #ffffff;
  --card-bg: #f1f5f9;
  --tag-bg: #0f172a;
}

/* ─── ৭. Rose Gold ─── */
.theme-rose {
  --primary: #881337;
  --secondary: #e11d48;
  --accent: #fb7185;
  --bg: #ffffff;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #ffe4e6;
  --header-bg: linear-gradient(135deg, #881337 0%, #e11d48 100%);
  --header-text: #ffffff;
  --card-bg: #fff1f2;
  --tag-bg: #e11d48;
}

/* ─── ৮. Amber (Gold) ─── */
.theme-amber {
  --primary: #78350f;
  --secondary: #d97706;
  --accent: #fbbf24;
  --bg: #ffffff;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #fef3c7;
  --header-bg: linear-gradient(135deg, #78350f 0%, #d97706 100%);
  --header-text: #ffffff;
  --card-bg: #fffbeb;
  --tag-bg: #d97706;
}

/* ─── ৯. Indigo (Deep Blue) ─── */
.theme-indigo {
  --primary: #312e81;
  --secondary: #4f46e5;
  --accent: #818cf8;
  --bg: #ffffff;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #e0e7ff;
  --header-bg: linear-gradient(135deg, #312e81 0%, #4f46e5 100%);
  --header-text: #ffffff;
  --card-bg: #eef2ff;
  --tag-bg: #4f46e5;
}

/* ─── ১০. Slate (Neutral Pro) ─── */
.theme-slate {
  --primary: #334155;
  --secondary: #475569;
  --accent: #94a3b8;
  --bg: #ffffff;
  --text: #1f2937;
  --text-light: #6b7280;
  --border: #e2e8f0;
  --header-bg: linear-gradient(135deg, #334155 0%, #64748b 100%);
  --header-text: #ffffff;
  --card-bg: #f8fafc;
  --tag-bg: #475569;
}

/* ═══ CV প্রিভিউতে থিম অ্যাপ্লিকেশন ═══ */
.cv-preview {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-main);
  transition: background var(--transition-speed), color var(--transition-speed);
}
.cv-preview .cv-header {
  background: var(--header-bg);
  color: var(--header-text);
  transition: background var(--transition-speed);
}
.cv-preview .cv-section {
  background: var(--card-bg);
  border-left: 4px solid var(--secondary);
  transition: all var(--transition-speed);
}
.cv-preview .section-title { color: var(--primary); }
.cv-preview .skill-tag { background: var(--tag-bg); }
.cv-preview .cv-item .date { color: var(--text-light); }