/* ═══════════════════════════════════════════
   CV Parfait — Dark Mode
   Appliqué via html.dark (toggle) ou prefers-color-scheme
   ═══════════════════════════════════════════ */

/* ── Transition douce ── */
*, *::before, *::after {
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.1s ease;
}
/* Exclure les transitions sur les animations */
.animate-spin, .animate-pulse { transition: none; }

/* ── Base ── */
html.dark body {
    background-color: #0f172a;
    color: #e2e8f0;
}

/* ── Arrière-plans ── */
html.dark .bg-white       { background-color: #1e293b !important; }
html.dark .bg-gray-50     { background-color: #0f172a !important; }
html.dark .bg-gray-100    { background-color: #1e293b !important; }
html.dark .bg-gray-200    { background-color: #334155 !important; }
html.dark .bg-gray-800    { background-color: #0f172a !important; }

/* ── Textes ── */
html.dark .text-gray-900  { color: #f1f5f9 !important; }
html.dark .text-gray-800  { color: #e2e8f0 !important; }
html.dark .text-gray-700  { color: #cbd5e1 !important; }
html.dark .text-gray-600  { color: #94a3b8 !important; }
html.dark .text-gray-500  { color: #64748b !important; }
html.dark .text-gray-400  { color: #64748b !important; }
html.dark .text-gray-300  { color: #475569 !important; }

/* ── Bordures ── */
html.dark .border-gray-50  { border-color: #1e293b !important; }
html.dark .border-gray-100 { border-color: #334155 !important; }
html.dark .border-gray-200 { border-color: #334155 !important; }
html.dark .border-gray-300 { border-color: #475569 !important; }

/* ── Ombres ── */
html.dark .shadow-sm  { box-shadow: 0 1px 3px rgba(0,0,0,0.5) !important; }
html.dark .shadow-md  { box-shadow: 0 4px 12px rgba(0,0,0,0.6) !important; }
html.dark .shadow-xl  { box-shadow: 0 10px 30px rgba(0,0,0,0.7) !important; }
html.dark .shadow-2xl { box-shadow: 0 20px 50px rgba(0,0,0,0.8) !important; }

/* ── Navbar ── */
html.dark nav {
    background-color: #1e293b !important;
    border-color: #334155 !important;
}
html.dark nav a { color: #cbd5e1 !important; }
html.dark nav a:hover { color: #93c5fd !important; }

/* ── Inputs & formulaires ── */
html.dark input,
html.dark select,
html.dark textarea {
    background-color: #0f172a !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}
html.dark input::placeholder,
html.dark textarea::placeholder { color: #475569 !important; }
html.dark input:focus,
html.dark select:focus,
html.dark textarea:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 2px rgba(59,130,246,0.3) !important;
}

/* ── Hover states ── */
html.dark .hover\:bg-gray-50:hover  { background-color: #334155 !important; }
html.dark .hover\:bg-gray-100:hover { background-color: #334155 !important; }

/* ── Dividers ── */
html.dark .divide-gray-50 > * + *,
html.dark .divide-gray-100 > * + * { border-color: #1e293b !important; }

/* ── Badges / pills ── */
html.dark .bg-brand-50  { background-color: #172554 !important; }
html.dark .bg-blue-50   { background-color: #172554 !important; }
html.dark .bg-indigo-50 { background-color: #1e1b4b !important; }
html.dark .bg-green-50  { background-color: #052e16 !important; }
html.dark .bg-amber-50  { background-color: #1c1400 !important; }
html.dark .bg-red-50    { background-color: #1f0e0e !important; }
html.dark .bg-purple-50 { background-color: #2e1065 !important; }

html.dark .text-brand-700 { color: #93c5fd !important; }
html.dark .text-blue-700  { color: #93c5fd !important; }
html.dark .text-green-700 { color: #86efac !important; }
html.dark .text-red-700   { color: #fca5a5 !important; }
html.dark .text-amber-700 { color: #fcd34d !important; }
html.dark .text-indigo-700{ color: #a5b4fc !important; }

html.dark .border-brand-100 { border-color: #1d3461 !important; }
html.dark .border-brand-200 { border-color: #1d3461 !important; }
html.dark .border-blue-100  { border-color: #1e3a5f !important; }
html.dark .border-green-100 { border-color: #14532d !important; }
html.dark .border-red-200   { border-color: #7f1d1d !important; }
html.dark .border-amber-300 { border-color: #78350f !important; }

/* ── Cards KPI / stats ── */
html.dark .bg-brand-100 { background-color: #172554 !important; }
html.dark .text-brand-600 { color: #60a5fa !important; }

/* ── Gradient header ── */
html.dark .bg-gradient-to-r.from-brand-600 {
    background: linear-gradient(to right, #1e3a5f, #1e293b) !important;
}

/* ── Modales ── */
html.dark .bg-black.bg-opacity-50,
html.dark .bg-black.bg-opacity-40 { background-color: rgba(0,0,0,0.75) !important; }

/* ── Logo wordmark ── */
html.dark .logo-dark-invert {
    filter: brightness(0) invert(1);
}

/* ── Contenu article (HTML brut sans classes Tailwind) ── */
html.dark .article-body { color: #e2e8f0; }
html.dark .article-body h2,
html.dark .article-body h3,
html.dark .article-body h4 { color: #f1f5f9; }
html.dark .article-body p,
html.dark .article-body li { color: #cbd5e1; }
html.dark .article-body strong { color: #f1f5f9; }
html.dark .article-body em { color: #94a3b8; }
html.dark .article-body a { color: #60a5fa; }
html.dark .article-body a:hover { color: #93c5fd; }
html.dark .article-body blockquote {
    border-left: 4px solid #3b82f6;
    background: #0f172a;
    color: #94a3b8;
    padding: 0.75rem 1rem;
    border-radius: 0 0.5rem 0.5rem 0;
}
html.dark .article-body hr { border-color: #334155; }
html.dark .article-body .sources-block {
    background: #0f172a !important;
    border-color: #334155 !important;
}
html.dark .article-body .sources-block a { color: #60a5fa !important; }
html.dark .article-body .sources-block span { color: #64748b !important; }
html.dark .article-body .sources-block p { color: #475569 !important; }
html.dark .article-body .lead { color: #e2e8f0; }

/* ── Tableaux / grilles ── */
html.dark table { background-color: #1e293b; }
html.dark th { background-color: #0f172a; color: #94a3b8; }
html.dark td { border-color: #334155; color: #cbd5e1; }
html.dark .article-body table { border-color: #334155; }
html.dark .article-body th { background-color: #0f172a; color: #94a3b8; border-color: #334155; }
html.dark .article-body td { color: #cbd5e1; border-color: #334155; }

/* ── Scrollbar ── */
html.dark ::-webkit-scrollbar { width: 8px; }
html.dark ::-webkit-scrollbar-track { background: #0f172a; }
html.dark ::-webkit-scrollbar-thumb { background: #334155; border-radius: 4px; }
html.dark ::-webkit-scrollbar-thumb:hover { background: #475569; }

/* ── Kanban colonnes ── */
html.dark .bg-gray-50.rounded-xl,
html.dark .bg-gray-50.rounded-2xl { background-color: #1e293b !important; }

/* ── Code / pre ── */
html.dark pre, html.dark code {
    background-color: #0f172a !important;
    color: #93c5fd !important;
}

/* ── Footer ── */
html.dark footer {
    background-color: #1e293b !important;
    border-color: #334155 !important;
}
html.dark footer * { color: #64748b !important; }
html.dark footer a:hover { color: #94a3b8 !important; }

/* ── Fiches candidats (list) ── */
.candidate-card[data-unread="false"] { background: #fff; border-color: #f3f4f6; }
.candidate-card[data-unread="true"]  { background: #eef2ff; border-color: #a5b4fc; }
.candidate-avatar[data-unread="false"] { background: #dbeafe; color: #2563eb; }
.candidate-avatar[data-unread="true"]  { background: #c7d2fe; color: #4338ca; }
.candidate-name[data-unread="false"] { color: #111827; }
.candidate-name[data-unread="true"]  { color: #1e1b4b; }

html.dark .candidate-card[data-unread="false"] { background: #1e293b !important; border-color: #334155 !important; }
html.dark .candidate-card[data-unread="true"]  { background: #1e1b4b !important; border-color: #4338ca !important; }
html.dark .candidate-avatar[data-unread="false"] { background: #1e3a5f !important; color: #93c5fd !important; }
html.dark .candidate-avatar[data-unread="true"]  { background: #312e81 !important; color: #a5b4fc !important; }
html.dark .candidate-name[data-unread="false"] { color: #f1f5f9 !important; }
html.dark .candidate-name[data-unread="true"]  { color: #c7d2fe !important; }

/* ── Fiche candidat (detail) — bouton "Marquer lu" ── */
html.dark [style*="border-color:#a5b4fc"] {
    border-color: #4338ca !important;
    color: #a5b4fc !important;
    background: #1e1b4b !important;
}

/* ── Toggle bouton ── */
#dark-toggle {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, border-color 0.2s;
    background: transparent;
    flex-shrink: 0;
}
#dark-toggle:hover { background: rgba(148,163,184,0.1); border-color: #334155; }
#dark-toggle svg { width: 18px; height: 18px; }
html.dark #dark-toggle { border-color: #334155; }

/* ─── Icône soleil (visible en dark) / lune (visible en light) ─── */
#icon-moon { display: block; }
#icon-sun  { display: none; }
html.dark #icon-moon { display: none; }
html.dark #icon-sun  { display: block; }