/* ==========================================================================
   SynapMed Dynamic Theme Engine
   Themes: classic | modern-pulse | emerald-vitality | midnight-luxe
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Inter:wght@400;500;600;700&display=swap');

/* --------------------------------------------------------------------------
   1. THÈME CLASSIQUE (Original SynapMed)
   -------------------------------------------------------------------------- */
[data-theme="classic"],
html:not([data-theme]) {
  --theme-font: 'Inter', system-ui, -apple-system, sans-serif;
  --theme-accent: #2563eb;
  --theme-accent-hover: #1d4ed8;
  --theme-accent-gradient: #2563eb;
  --theme-accent-glow: rgba(37, 99, 235, 0.25);
  --theme-surface: #f6f8fb;
  --theme-border: rgba(30, 64, 175, 0.12);
  --theme-card-bg: #ffffff;
  --theme-radius-card: 1rem;
}

/* --------------------------------------------------------------------------
   2. THÈME NEO-SANTÉ VIBRANT (Inspiré par Alan, Doctolib Neo, Stripe & Linear)
   -------------------------------------------------------------------------- */
[data-theme="modern-pulse"] {
  --theme-font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --theme-accent: #4f46e5;
  --theme-accent-hover: #4338ca;
  --theme-accent-gradient: linear-gradient(135deg, #4f46e5 0%, #3b82f6 50%, #06b6d4 100%);
  --theme-accent-glow: rgba(79, 70, 229, 0.35);
  --theme-surface: #f8faff;
  --theme-border: rgba(99, 102, 241, 0.14);
  --theme-card-bg: #ffffff;
  --theme-card-shadow: 0 10px 25px -5px rgba(79, 70, 229, 0.07), 0 4px 10px -2px rgba(0, 0, 0, 0.02);
  --theme-radius-card: 1.25rem;
}

[data-theme="modern-pulse"] body {
  font-family: var(--theme-font);
  background-color: var(--theme-surface);
  letter-spacing: -0.011em;
}

/* Boutons principaux Modern Pulse */
[data-theme="modern-pulse"] .bg-accent,
[data-theme="modern-pulse"] button.bg-accent,
[data-theme="modern-pulse"] a.bg-accent {
  background: var(--theme-accent-gradient) !important;
  box-shadow: 0 4px 14px 0 var(--theme-accent-glow);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  border: 1px solid rgba(255, 255, 255, 0.15);
}

[data-theme="modern-pulse"] .bg-accent:hover,
[data-theme="modern-pulse"] button.bg-accent:hover,
[data-theme="modern-pulse"] a.bg-accent:hover {
  transform: translateY(-1.5px);
  box-shadow: 0 6px 20px 0 rgba(79, 70, 229, 0.45);
  filter: brightness(1.05);
}

[data-theme="modern-pulse"] .text-accent {
  color: var(--theme-accent) !important;
}

[data-theme="modern-pulse"] .border-border {
  border-color: var(--theme-border) !important;
}

/* Cartes & Panels avec ombre subtile et survol vivant */
[data-theme="modern-pulse"] .rounded-2xl.bg-white,
[data-theme="modern-pulse"] .rounded-xl.bg-white {
  box-shadow: var(--theme-card-shadow);
  border: 1px solid var(--theme-border);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

[data-theme="modern-pulse"] .rounded-2xl.bg-white:hover,
[data-theme="modern-pulse"] .rounded-xl.bg-white:hover {
  border-color: rgba(99, 102, 241, 0.28);
}

/* Sidebar Modern Pulse */
[data-theme="modern-pulse"] aside {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(16px);
  border-right: 1px solid var(--theme-border);
}

[data-theme="modern-pulse"] aside .bg-accent {
  background: linear-gradient(135deg, rgba(79, 70, 229, 0.15), rgba(6, 182, 212, 0.15)) !important;
  color: #4338ca !important;
  border-left: 3px solid #4f46e5;
  font-weight: 700;
  box-shadow: none !important;
}

/* Header effet verre dépoli */
[data-theme="modern-pulse"] header {
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(16px) saturate(180%);
}

/* --------------------------------------------------------------------------
   3. THÈME ÉMERAUDE CLINIQUE PRIVÉE (Inspiré Apple Health & OneMedical)
   -------------------------------------------------------------------------- */
[data-theme="emerald-vitality"] {
  --theme-font: 'Plus Jakarta Sans', -apple-system, sans-serif;
  --theme-accent: #059669;
  --theme-accent-hover: #047857;
  --theme-accent-gradient: linear-gradient(135deg, #059669 0%, #0d9488 50%, #10b981 100%);
  --theme-accent-glow: rgba(5, 150, 105, 0.3);
  --theme-surface: #f4fbf7;
  --theme-border: rgba(16, 185, 129, 0.18);
  --theme-card-bg: #ffffff;
  --theme-card-shadow: 0 10px 25px -5px rgba(5, 150, 105, 0.06), 0 4px 10px -2px rgba(0, 0, 0, 0.02);
}

[data-theme="emerald-vitality"] body {
  font-family: var(--theme-font);
  background-color: var(--theme-surface);
}

[data-theme="emerald-vitality"] .bg-accent,
[data-theme="emerald-vitality"] button.bg-accent,
[data-theme="emerald-vitality"] a.bg-accent {
  background: var(--theme-accent-gradient) !important;
  box-shadow: 0 4px 14px 0 var(--theme-accent-glow);
  transition: all 0.2s ease;
}

[data-theme="emerald-vitality"] .bg-accent:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px 0 rgba(5, 150, 105, 0.4);
}

[data-theme="emerald-vitality"] .text-accent {
  color: var(--theme-accent) !important;
}

[data-theme="emerald-vitality"] .border-border {
  border-color: var(--theme-border) !important;
}

[data-theme="emerald-vitality"] aside .bg-accent {
  background: linear-gradient(135deg, rgba(5, 150, 105, 0.15), rgba(16, 185, 129, 0.15)) !important;
  color: #065f46 !important;
  border-left: 3px solid #059669;
  font-weight: 700;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   4. THÈME MIDNIGHT TECH LUXE (Dark High-Tech Ultra Précis)
   -------------------------------------------------------------------------- */
[data-theme="midnight-luxe"] {
  --theme-font: 'Plus Jakarta Sans', -apple-system, sans-serif;
  --theme-accent: #8b5cf6;
  --theme-accent-hover: #7c3aed;
  --theme-accent-gradient: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
  --theme-accent-glow: rgba(139, 92, 246, 0.4);
  --theme-surface: #0b0f19;
  --theme-card-bg: #111827;
  --theme-border: rgba(139, 92, 246, 0.25);
  color-scheme: dark;
}

[data-theme="midnight-luxe"] body {
  font-family: var(--theme-font);
  background-color: #0b0f19 !important;
  color: #f3f4f6 !important;
}

[data-theme="midnight-luxe"] .bg-surface {
  background-color: #0b0f19 !important;
}

[data-theme="midnight-luxe"] .bg-white {
  background-color: #111827 !important;
  border-color: rgba(139, 92, 246, 0.2) !important;
}

[data-theme="midnight-luxe"] .text-content {
  color: #f3f4f6 !important;
}

[data-theme="midnight-luxe"] .text-muted {
  color: #94a3b8 !important;
}

[data-theme="midnight-luxe"] .bg-accent,
[data-theme="midnight-luxe"] button.bg-accent,
[data-theme="midnight-luxe"] a.bg-accent {
  background: var(--theme-accent-gradient) !important;
  box-shadow: 0 4px 15px 0 var(--theme-accent-glow);
}

[data-theme="midnight-luxe"] aside {
  background-color: #0d1220 !important;
  border-color: rgba(139, 92, 246, 0.2) !important;
}

[data-theme="midnight-luxe"] header {
  background-color: rgba(13, 18, 32, 0.85) !important;
  border-color: rgba(139, 92, 246, 0.2) !important;
}

/* --------------------------------------------------------------------------
   ANIMATIONS & MICRO-INTERACTIONS PARTAGÉES
   -------------------------------------------------------------------------- */
@keyframes themeGlowPulse {
  0%, 100% { opacity: 0.6; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.05); }
}

.theme-live-dot {
  animation: themeGlowPulse 2s ease-in-out infinite;
}

/* Carte de sélection de thème dans l'Admin */
.theme-card-option {
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  cursor: pointer;
}

.theme-card-option:hover {
  transform: translateY(-3px);
}

.theme-card-active {
  ring-width: 2px;
}