/* * eFastWork — Dark Mode pour pages Tailwind CSS (candidat/employeur) * S'applique quand data-theme="dark" est sur le */ /* ── Backgrounds Tailwind ─────────────────────────────── */ [data-theme="dark"] .bg-white, [data-theme="dark"] .bg-gray-50 { background-color: #1e2433 !important; color: #e2e8f0 !important; } [data-theme="dark"] .bg-gray-100 { background-color: #1a2030 !important; } [data-theme="dark"] .bg-gray-200 { background-color: #232c3d !important; } [data-theme="dark"] .min-h-screen { background-color: #111827 !important; } [data-theme="dark"] .bg-gradient-to-br.from-blue-50.to-indigo-100 { background: linear-gradient(135deg, #1a2332 0%, #1e2a45 100%) !important; } /* ── Textes Tailwind ───────────────────────────────────── */ [data-theme="dark"] .text-gray-900, [data-theme="dark"] .text-gray-800 { color: #f1f5f9 !important; } [data-theme="dark"] .text-gray-700, [data-theme="dark"] .text-gray-600 { color: #94a3b8 !important; } [data-theme="dark"] .text-gray-500, [data-theme="dark"] .text-gray-400 { color: #64748b !important; } /* ── Bordures Tailwind ─────────────────────────────────── */ [data-theme="dark"] .border-gray-200, [data-theme="dark"] .border-gray-300 { border-color: #334155 !important; } [data-theme="dark"] .divide-gray-200 > * { border-color: #334155 !important; } /* ── Cards / Shadows Tailwind ──────────────────────────── */ [data-theme="dark"] .shadow, [data-theme="dark"] .shadow-sm, [data-theme="dark"] .shadow-lg, [data-theme="dark"] .shadow-xl { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important; } /* ── Backgrounds gradient spéciaux candidat ───────────── */ [data-theme="dark"] .from-blue-50 { --tw-gradient-from: #1a2332 !important; } [data-theme="dark"] .to-indigo-100 { --tw-gradient-to: #1e2a45 !important; } [data-theme="dark"] .from-gray-50 { --tw-gradient-from: #1e2433 !important; } [data-theme="dark"] .to-blue-50 { --tw-gradient-to: #1a2332 !important; } /* ── Hover states Tailwind ─────────────────────────────── */ [data-theme="dark"] .hover\:bg-gray-50:hover, [data-theme="dark"] .hover\:bg-gray-100:hover { background-color: #293548 !important; } /* ── Inputs Tailwind ───────────────────────────────────── */ [data-theme="dark"] input[class*="border-gray"], [data-theme="dark"] select[class*="border-gray"], [data-theme="dark"] textarea[class*="border-gray"] { background-color: #1e2433 !important; color: #e2e8f0 !important; border-color: #334155 !important; } /* ── Sections / Panels candidat ───────────────────────── */ [data-theme="dark"] .rounded-xl.bg-white, [data-theme="dark"] .rounded-lg.bg-white, [data-theme="dark"] .rounded-xl.overflow-hidden.bg-white { background-color: #1e2433 !important; } /* ── Tables ────────────────────────────────────────────── */ [data-theme="dark"] table thead { background-color: #1a2030 !important; } [data-theme="dark"] table thead th { color: #94a3b8 !important; border-bottom-color: #334155 !important; } [data-theme="dark"] table tbody tr { border-bottom-color: #2d3748 !important; } [data-theme="dark"] table tbody td { color: #cbd5e1 !important; } [data-theme="dark"] table tbody tr:hover { background-color: #1e2a3a !important; } /* ── Panels spéciaux (sidebar, cards employeur) ─────────── */ [data-theme="dark"] .card, [data-theme="dark"] .widget-card, [data-theme="dark"] .stat-card { background-color: #1e2433 !important; border-color: #334155 !important; color: #e2e8f0 !important; } /* ── Boutons outline sur fond sombre ────────────────────── */ [data-theme="dark"] .btn-outline-secondary, [data-theme="dark"] .btn-outline-light { color: #94a3b8 !important; border-color: #475569 !important; } [data-theme="dark"] .btn-outline-secondary:hover { background-color: #293548 !important; color: #e2e8f0 !important; } /* ── Badges & Alerts ────────────────────────────────────── */ [data-theme="dark"] .alert-light { background-color: #1e2433 !important; border-color: #334155 !important; color: #e2e8f0 !important; } /* ── Dropdown menus (dark) ──────────────────────────────── */ [data-theme="dark"] .dropdown-menu { background-color: #1e2433 !important; border-color: #334155 !important; } [data-theme="dark"] .dropdown-item { color: #cbd5e1 !important; } [data-theme="dark"] .dropdown-item:hover { background-color: #293548 !important; color: #f1f5f9 !important; } [data-theme="dark"] .dropdown-divider { border-color: #334155 !important; } /* ── Modals ─────────────────────────────────────────────── */ [data-theme="dark"] .modal-content { background-color: #1e2433 !important; border-color: #334155 !important; color: #e2e8f0 !important; } [data-theme="dark"] .modal-header, [data-theme="dark"] .modal-footer { border-color: #334155 !important; } /* ── Pagination ─────────────────────────────────────────── */ [data-theme="dark"] .page-item .page-link { background-color: #1e2433 !important; border-color: #334155 !important; color: #94a3b8 !important; } [data-theme="dark"] .page-item.active .page-link { background-color: #3b82f6 !important; border-color: #3b82f6 !important; color: #ffffff !important; } /* ── Liste groups ───────────────────────────────────────── */ [data-theme="dark"] .list-group-item { background-color: #1e2433 !important; border-color: #334155 !important; color: #e2e8f0 !important; } [data-theme="dark"] .list-group-item:hover { background-color: #293548 !important; } /* ── Placeholders / skeletons ───────────────────────────── */ [data-theme="dark"] .placeholder, [data-theme="dark"] .skeleton { background-color: #293548 !important; } /* ── Bouton dark mode — position fixe haut-droite, compact ─────────── */ .dark-mode-toggle { position: fixed !important; top: 80px !important; right: 16px !important; bottom: auto !important; z-index: 9999 !important; /* Mode jour : nuance orange */ background: linear-gradient(135deg, #f97316, #fb923c) !important; color: white !important; border: none !important; border-radius: 50% !important; width: 42px !important; height: 42px !important; padding: 0 !important; font-size: 1.1rem !important; cursor: pointer !important; box-shadow: 0 3px 12px rgba(249,115,22,0.45) !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 0 !important; transition: all 0.25s ease !important; } .dark-mode-toggle:hover { transform: scale(1.12) !important; box-shadow: 0 5px 18px rgba(249,115,22,0.6) !important; } /* Mode sombre : nuance violet */ [data-theme="dark"] .dark-mode-toggle { background: linear-gradient(135deg, #7c3aed, #a855f7) !important; box-shadow: 0 3px 12px rgba(124,58,237,0.5) !important; } [data-theme="dark"] .dark-mode-toggle:hover { box-shadow: 0 5px 18px rgba(124,58,237,0.7) !important; } /* Cacher le texte — icône seule */ .dark-mode-toggle .toggle-text { display: none !important; } .dark-mode-toggle .auto-badge { display: none !important; } .dark-mode-toggle .icon { font-size: 1.15rem; line-height: 1; } .auto-badge { font-size: 0.6rem; background: rgba(255,255,255,0.25); padding: 1px 5px; border-radius: 10px; letter-spacing: 0.5px; }