/* ============================================================
   DARK MODE — cloud app
   Triggered by: body.dark-mode  (set via JS + localStorage)
   ============================================================ */

/* ---- Base ------------------------------------------------- */
body.dark-mode {
    background-color: #0f172a !important;
    color: #cbd5e1 !important;
}

/* ---- Glass card (sidebar, bottom bar, file cards, …) ------ */
body.dark-mode .glass-card {
    background-color: rgba(15, 23, 42, 0.92) !important;
    border-color: rgba(51, 65, 85, 0.6) !important;
}

/* ---- Sidebar --------------------------------------------- */
body.dark-mode aside {
    background: rgba(15, 23, 42, 0.92) !important;
    border-color: rgba(51, 65, 85, 0.6) !important;
}

/* Logo & brand text */
body.dark-mode .logo-text,
body.dark-mode aside .text-blue-900 {
    color: #e2e8f0 !important;
}

/* Nav link — inactive */
body.dark-mode aside nav a,
body.dark-mode aside .teams-section a {
    color: #94a3b8 !important;
}
body.dark-mode aside nav a:hover,
body.dark-mode aside .teams-section a:hover {
    background-color: rgba(51, 65, 85, 0.5) !important;
    color: #e2e8f0 !important;
}
/* Nav link — active (keep blue bg, just ensure text is white) */
body.dark-mode aside nav a.bg-blue-600,
body.dark-mode aside .teams-section a.bg-blue-600 {
    color: #ffffff !important;
}

/* Sidebar label text (text-slate-500 / text-slate-600) */
body.dark-mode aside .text-slate-500,
body.dark-mode aside .text-slate-600 {
    color: #94a3b8 !important;
}

/* Toggle sidebar button */
body.dark-mode .toggle-sidebar-btn {
    color: #94a3b8 !important;
}
body.dark-mode .toggle-sidebar-btn:hover {
    background-color: rgba(51, 65, 85, 0.5) !important;
    color: #e2e8f0 !important;
}

/* Storage bar text */
body.dark-mode aside .text-xs {
    color: #94a3b8 !important;
}

/* Divider line in sidebar */
body.dark-mode aside hr,
body.dark-mode aside .border-slate-100,
body.dark-mode aside .border-slate-200 {
    border-color: #334155 !important;
}

/* Teams section header */
body.dark-mode aside .teams-section > div:first-child span {
    color: #64748b !important;
}

/* ---- Header (top bar on pages that have one) -------------- */
body.dark-mode header.glass-card {
    background: rgba(15, 23, 42, 0.92) !important;
    border-color: rgba(51, 65, 85, 0.6) !important;
}
body.dark-mode header .text-blue-900 {
    color: #e2e8f0 !important;
}
body.dark-mode header .text-slate-500,
body.dark-mode header .text-slate-600 {
    color: #94a3b8 !important;
}
body.dark-mode header input[type="text"],
body.dark-mode header input[type="search"] {
    background: rgba(30, 41, 59, 0.8) !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}
body.dark-mode header input::placeholder {
    color: #64748b !important;
}

/* ---- File / content cards --------------------------------- */
body.dark-mode .file-card {
    background-color: rgba(30, 41, 59, 0.85) !important;
    border-color: rgba(51, 65, 85, 0.5) !important;
}
body.dark-mode .file-card:hover {
    background-color: rgba(30, 41, 59, 0.97) !important;
}
body.dark-mode .file-card h3 {
    color: #e2e8f0 !important;
}
body.dark-mode .file-card p,
body.dark-mode .file-card .mod-date,
body.dark-mode .file-card .text-slate-500,
body.dark-mode .file-card .text-slate-600 {
    color: #94a3b8 !important;
}
body.dark-mode .file-card .more-btn i {
    color: #94a3b8 !important;
}
body.dark-mode .file-card.selected {
    background-color: rgba(var(--azure-glow-rgb),.25) !important;
    box-shadow: 0 0 0 2px rgba(var(--azure-glow-rgb),.4) !important;
}

/* ---- Dropdown (context menu on file cards) --------------- */
body.dark-mode .dropdown-actions {
    background: rgba(15, 23, 42, 0.97) !important;
    border-color: rgba(51, 65, 85, 0.7) !important;
}
body.dark-mode .dropdown-actions button,
body.dark-mode .dropdown-actions a {
    color: #cbd5e1 !important;
}
body.dark-mode .dropdown-actions button:hover,
body.dark-mode .dropdown-actions a:hover {
    background-color: rgba(51, 65, 85, 0.5) !important;
}
body.dark-mode .dropdown-actions .text-red-600 {
    color: #f87171 !important;
}
body.dark-mode .dropdown-actions .text-red-600:hover {
    background-color: rgba(127, 29, 29, 0.3) !important;
}

/* ---- Modals ---------------------------------------------- */
body.dark-mode .modal-backdrop,
body.dark-mode [id$="-modal"] > .fixed,
body.dark-mode .fixed.inset-0.bg-black {
    /* overlay stays dark, no change needed */
}
body.dark-mode [id$="-modal"] .bg-white,
body.dark-mode dialog .bg-white,
body.dark-mode .modal .bg-white {
    background: #1e293b !important;
    color: #cbd5e1 !important;
}
body.dark-mode [id$="-modal"] .text-slate-800,
body.dark-mode [id$="-modal"] .text-slate-700,
body.dark-mode [id$="-modal"] .text-blue-900,
body.dark-mode dialog .text-slate-800,
body.dark-mode dialog .text-blue-900 {
    color: #e2e8f0 !important;
}
body.dark-mode [id$="-modal"] .text-slate-500,
body.dark-mode [id$="-modal"] .text-slate-600,
body.dark-mode dialog .text-slate-500 {
    color: #94a3b8 !important;
}
body.dark-mode [id$="-modal"] input,
body.dark-mode [id$="-modal"] textarea,
body.dark-mode [id$="-modal"] select,
body.dark-mode dialog input,
body.dark-mode dialog textarea,
body.dark-mode dialog select {
    background: rgba(30, 41, 59, 0.9) !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}
body.dark-mode [id$="-modal"] input::placeholder,
body.dark-mode dialog input::placeholder {
    color: #64748b !important;
}
body.dark-mode [id$="-modal"] label,
body.dark-mode dialog label {
    color: #94a3b8 !important;
}
body.dark-mode [id$="-modal"] .border-slate-200,
body.dark-mode [id$="-modal"] .border-slate-100,
body.dark-mode dialog .border-slate-200 {
    border-color: #334155 !important;
}
body.dark-mode [id$="-modal"] .bg-slate-50,
body.dark-mode dialog .bg-slate-50 {
    background: rgba(30, 41, 59, 0.5) !important;
}
body.dark-mode [id$="-modal"] .bg-slate-100,
body.dark-mode dialog .bg-slate-100 {
    background: #1e293b !important;
}
body.dark-mode [id$="-modal"] .text-slate-400,
body.dark-mode dialog .text-slate-400 {
    color: #64748b !important;
}

/* ---- Generic content area --------------------------------- */
body.dark-mode main .bg-white {
    background: rgba(30, 41, 59, 0.85) !important;
}
body.dark-mode .text-blue-900 {
    color: var(--azure-glow) !important;
}
body.dark-mode .text-slate-700 {
    color: #cbd5e1 !important;
}
body.dark-mode .text-slate-600 {
    color: #94a3b8 !important;
}
body.dark-mode .text-slate-500 {
    color: #64748b !important;
}
body.dark-mode .bg-slate-50 {
    background-color: #1e293b !important;
}
body.dark-mode .bg-slate-100 {
    background-color: #1e293b !important;
}
body.dark-mode .border-slate-200,
body.dark-mode .border-slate-100 {
    border-color: #334155 !important;
}
body.dark-mode .border-blue-100 {
    border-color: rgba(51, 65, 85, 0.6) !important;
}

/* Scrollbar : gérée globalement par assets/css/azur.css via les variables
   de thème (--scroll-thumb / --scroll-thumb-hover), plus de surcharge ici. */

/* ============================================================
   MOBILE CREATE MENU — dark mode (#mobile-create-menu popup)
   ============================================================ */

body.dark-mode #mobile-create-sheet-inner {
    background: rgba(15, 23, 42, 0.97) !important;
}
body.dark-mode #mobile-create-sheet-inner h3 {
    color: #e2e8f0 !important;
}
body.dark-mode #mobile-create-sheet-inner span.font-medium {
    color: #cbd5e1 !important;
}
body.dark-mode #mobile-create-sheet-inner button:not(#mobile-menu-cancel):hover {
    background-color: rgba(51, 65, 85, 0.5) !important;
}
body.dark-mode #mobile-create-sheet-inner #mobile-upload-files:hover {
    background-color: rgba(88, 28, 135, 0.2) !important;
}
body.dark-mode #mobile-create-sheet-inner #mobile-menu-cancel {
    background-color: #1e293b !important;
    color: #94a3b8 !important;
}
body.dark-mode #mobile-create-sheet-inner #mobile-menu-cancel:hover {
    background-color: #334155 !important;
}
body.dark-mode #mobile-create-sheet-inner .border-slate-100 {
    border-color: #334155 !important;
}

/* ============================================================
   MOBILE MENU DRAWER — dark mode
   #mobile-menu-drawer has Tailwind class bg-white/95
   We must override it with !important
   ============================================================ */

body.dark-mode #mobile-menu-drawer {
    background: rgba(15, 23, 42, 0.97) !important;
    border-top: 1px solid rgba(51, 65, 85, 0.7) !important;
}

/* Pill handle */
body.dark-mode #mobile-menu-drawer .bg-slate-200 {
    background-color: #334155 !important;
}

/* Drawer title */
body.dark-mode #mobile-menu-drawer .text-blue-900 {
    color: #e2e8f0 !important;
}

/* Close button */
body.dark-mode #mobile-menu-drawer .text-slate-400 {
    color: #64748b !important;
}
body.dark-mode #mobile-menu-drawer button.text-slate-400:hover {
    background-color: rgba(51, 65, 85, 0.5) !important;
    color: #94a3b8 !important;
}

/* Section heading ("Navigation", etc.) */
body.dark-mode #mobile-menu-drawer .text-slate-500 {
    color: #64748b !important;
}

/* Inactive nav items */
body.dark-mode #mobile-menu-drawer a:not(.bg-blue-600),
body.dark-mode #mobile-menu-drawer button:not(.bg-blue-600):not([class*="text-slate-400"]) {
    color: #94a3b8 !important;
}
body.dark-mode #mobile-menu-drawer a:not(.bg-blue-600):hover {
    background-color: rgba(51, 65, 85, 0.5) !important;
    color: #e2e8f0 !important;
}
body.dark-mode #mobile-menu-drawer .hover\:bg-slate-50:hover,
body.dark-mode #mobile-menu-drawer .hover\:bg-slate-100:hover {
    background-color: rgba(51, 65, 85, 0.5) !important;
}

/* Active nav items (keep blue, but ensure icon + text are white) */
body.dark-mode #mobile-menu-drawer .bg-blue-600 {
    background-color: var(--azure) !important;
    color: #ffffff !important;
}

/* Nav item label spans */
body.dark-mode #mobile-menu-drawer span {
    color: inherit !important;
}

/* ============================================================
   BOTTOM MOBILE BAR — dark mode
   Uses .glass-card + border-blue-100
   ============================================================ */

/* .glass-card rule above already covers the background.
   Extra rules for icon / button colours inside the bottom bar. */
body.dark-mode .lg\:hidden.fixed .text-blue-600 {
    color: var(--azure-glow) !important;
}
body.dark-mode .lg\:hidden.fixed .text-slate-400 {
    color: #64748b !important;
}
body.dark-mode .lg\:hidden.fixed .text-slate-600 {
    color: #94a3b8 !important;
}
body.dark-mode .lg\:hidden.fixed button:hover .text-slate-400,
body.dark-mode .lg\:hidden.fixed a:hover .text-slate-400 {
    color: #94a3b8 !important;
}

/* ============================================================
   FIX GLOBAL — éléments non couverts
   ============================================================ */

/* ---- bg-white générique ----------------------------------- */
body.dark-mode .bg-white {
    background-color: #1e293b !important;
    color: #cbd5e1 !important;
}
/* bg-white avec opacité (ex: audio player, mobile drawer) */
body.dark-mode [class*="bg-white\/"] {
    background-color: rgba(15, 23, 42, 0.97) !important;
}

/* ---- Inputs / Select / Textarea globaux ------------------- */
body.dark-mode input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
body.dark-mode textarea,
body.dark-mode select {
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}
body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
    color: #64748b !important;
}
body.dark-mode input:focus,
body.dark-mode textarea:focus,
body.dark-mode select:focus {
    outline-color: var(--azure-glow) !important;
    box-shadow: 0 0 0 2px rgba(var(--azure-glow-rgb),0.25) !important;
    border-color: var(--azure-glow) !important;
}

/* ---- Boutons bg-white (filtre/tri/vue) -------------------- */
body.dark-mode button.bg-white,
body.dark-mode a.bg-white {
    background-color: #1e293b !important;
    border-color: #334155 !important;
    color: #cbd5e1 !important;
}
body.dark-mode button.bg-white:hover,
body.dark-mode a.bg-white:hover {
    background-color: #334155 !important;
    border-color: #475569 !important;
}

/* ---- View-mode switch (#view-mode-switch) ----------------- */
body.dark-mode #view-mode-switch {
    background-color: #1e293b !important;
    border-color: #334155 !important;
}
body.dark-mode #view-mode-switch button {
    color: #94a3b8 !important;
}
body.dark-mode #view-mode-switch button.active,
body.dark-mode #view-mode-switch button[class*="bg-"] {
    background-color: #334155 !important;
    color: #e2e8f0 !important;
}

/* ---- Dropdowns inline (sort/filter/create menus) ---------- */
body.dark-mode .bg-white.rounded-2xl,
body.dark-mode .bg-white.rounded-xl {
    background-color: #1e293b !important;
    border-color: #334155 !important;
}
body.dark-mode .bg-white.rounded-2xl button,
body.dark-mode .bg-white.rounded-2xl a,
body.dark-mode .bg-white.rounded-xl button,
body.dark-mode .bg-white.rounded-xl a {
    color: #cbd5e1 !important;
}
/* Hover dans les dropdowns (hover:bg-blue-50, hover:bg-slate-50) */
body.dark-mode .hover\:bg-blue-50:hover {
    background-color: rgba(51, 65, 85, 0.6) !important;
    color: var(--azure-glow) !important;
}
body.dark-mode .hover\:bg-slate-50:hover {
    background-color: rgba(51, 65, 85, 0.5) !important;
}
body.dark-mode .hover\:bg-slate-100:hover {
    background-color: #334155 !important;
}
body.dark-mode .hover\:bg-slate-200:hover {
    background-color: #475569 !important;
}
body.dark-mode .hover\:bg-red-100:hover {
    background-color: rgba(127, 29, 29, 0.4) !important;
}
body.dark-mode .hover\:bg-red-200:hover {
    background-color: rgba(127, 29, 29, 0.5) !important;
}

/* ---- Bouton déconnexion (bg-red-100) ---------------------- */
body.dark-mode .bg-red-100 {
    background-color: rgba(127, 29, 29, 0.35) !important;
    color: #fca5a5 !important;
}
body.dark-mode .bg-red-200 {
    background-color: rgba(127, 29, 29, 0.5) !important;
}

/* ---- Bannières succès / erreur ---------------------------- */
body.dark-mode .bg-green-50 {
    background-color: rgba(6, 78, 59, 0.3) !important;
    border-color: #065f46 !important;
    color: #6ee7b7 !important;
}
body.dark-mode .bg-red-50 {
    background-color: rgba(127, 29, 29, 0.3) !important;
    border-color: #7f1d1d !important;
    color: #fca5a5 !important;
}
body.dark-mode .bg-yellow-50 {
    background-color: rgba(113, 63, 18, 0.3) !important;
    border-color: #78350f !important;
    color: #fcd34d !important;
}
body.dark-mode .text-green-700 {
    color: #6ee7b7 !important;
}
body.dark-mode .text-red-700 {
    color: #fca5a5 !important;
}
body.dark-mode .border-green-200 {
    border-color: #065f46 !important;
}
body.dark-mode .border-red-200 {
    border-color: #7f1d1d !important;
}

/* ---- Darkmode toggle button ------------------------------- */
body.dark-mode #darkmode-toggle {
    background-color: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.4) !important;
}
body.dark-mode #darkmode-toggle:hover {
    background-color: #334155 !important;
    box-shadow: 0 6px 20px rgba(0,0,0,0.5) !important;
}

/* ---- Ombres (shadow-blue-100, shadow-sm génériques) -------- */
body.dark-mode [class*="shadow-blue"] {
    --tw-shadow-color: rgba(0,0,0,0) !important;
    box-shadow: none !important;
}
body.dark-mode .shadow-sm {
    box-shadow: 0 1px 3px rgba(0,0,0,0.4) !important;
}
body.dark-mode .shadow-md {
    box-shadow: 0 4px 8px rgba(0,0,0,0.45) !important;
}
body.dark-mode .shadow-lg {
    box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
}
body.dark-mode .shadow-xl {
    box-shadow: 0 12px 32px rgba(0,0,0,0.55) !important;
}
body.dark-mode .shadow-2xl {
    box-shadow: 0 20px 48px rgba(0,0,0,0.6) !important;
}

/* ---- Admin — onglets tab-btn -------------------------------
   Onglets inactifs : azur-btn-ghost (assets/css/azur.css), déjà
   thémé via les variables --glass/--glass-line. Onglet actif :
   voir la règle body.dark-mode .tab-btn.active dans admin.php,
   alignée sur .dock-item.active (fond --azure-glow). */

/* ---- Settings — lignes d'option (bg-slate-50 rows) -------- */
body.dark-mode .toggle-slider {
    background-color: #334155 !important;
}
body.dark-mode input:checked + .toggle-slider {
    background-color: var(--azure-glow) !important;
}
body.dark-mode .toggle-slider::before {
    background-color: #e2e8f0 !important;
}

/* ---- Teams — cartes équipes ------------------------------- */
body.dark-mode .bg-slate-200 {
    background-color: #334155 !important;
    color: #94a3b8 !important;
}
/* Boutons dans les cartes équipes */
body.dark-mode .bg-red-50 {
    background-color: rgba(127, 29, 29, 0.3) !important;
}
body.dark-mode .text-red-600 {
    color: #f87171 !important;
}
body.dark-mode .bg-green-500 {
    background-color: #059669 !important;
}
body.dark-mode .hover\:bg-green-600:hover {
    background-color: #047857 !important;
}

/* ---- Audio player (share.php) ----------------------------- */
body.dark-mode .audio-player-container {
    background-color: rgba(15, 23, 42, 0.97) !important;
    border-color: #334155 !important;
}
body.dark-mode .audio-btn:hover {
    background-color: rgba(51, 65, 85, 0.5) !important;
}

/* ---- Page login/register/verify (centered cards) ---------- */
body.dark-mode .min-h-screen.bg-gradient-to-br {
    background: linear-gradient(135deg, #0f172a 0%, #1e1b4b 50%, #0f172a 100%) !important;
}

/* ---- Text colors génériques non couverts ------------------ */
body.dark-mode .text-slate-800 {
    color: #e2e8f0 !important;
}
body.dark-mode .text-slate-900 {
    color: #f1f5f9 !important;
}
body.dark-mode .text-gray-600,
body.dark-mode .text-gray-700 {
    color: #94a3b8 !important;
}
body.dark-mode .text-gray-800,
body.dark-mode .text-gray-900 {
    color: #e2e8f0 !important;
}

/* ---- Dividers génériques ---------------------------------- */
body.dark-mode hr,
body.dark-mode .divide-y > * + * {
    border-color: #334155 !important;
}

/* ---- Couleurs génériques additionnelles (badges, textes atténués) */
body.dark-mode .text-slate-400 {
    color: #64748b !important;
}
body.dark-mode .text-slate-300 {
    color: #64748b !important;
}
body.dark-mode .text-blue-600 {
    color: var(--azure-glow) !important;
}
body.dark-mode .text-green-600 {
    color: #6ee7b7 !important;
}
body.dark-mode .bg-blue-50 {
    background-color: rgba(var(--azure-glow-rgb),.15) !important;
}
body.dark-mode .border-blue-200 {
    border-color: rgba(var(--azure-glow-rgb),0.35) !important;
}
body.dark-mode .bg-amber-50 {
    background-color: rgba(120, 53, 15, 0.3) !important;
}
body.dark-mode .text-amber-500 {
    color: #fbbf24 !important;
}
body.dark-mode .bg-purple-100 {
    background-color: rgba(88, 28, 135, 0.35) !important;
}
body.dark-mode .text-purple-600 {
    color: #c084fc !important;
}

/* ---- Badges / encarts clairs (bg-*-50/100/200) — même formule que
   ci-dessus : fond translucide de la teinte + texte clair assorti ---- */
body.dark-mode .bg-blue-100 { background-color: rgba(var(--azure-glow-rgb),.22) !important; color: var(--azure-glow) !important; }
body.dark-mode .bg-blue-200 { background-color: rgba(var(--azure-glow-rgb),.32) !important; color: var(--azure-glow) !important; }
body.dark-mode .bg-green-100 { background-color: rgba(6, 78, 59, 0.4) !important; color: #6ee7b7 !important; }
body.dark-mode .bg-green-200 { background-color: rgba(6, 78, 59, 0.55) !important; color: #6ee7b7 !important; }
body.dark-mode .bg-amber-100 { background-color: rgba(120, 53, 15, 0.4) !important; color: #fbbf24 !important; }
body.dark-mode .bg-yellow-100 { background-color: rgba(133, 77, 14, 0.35) !important; color: #fde047 !important; }
body.dark-mode .bg-yellow-200 { background-color: rgba(133, 77, 14, 0.45) !important; color: #fde047 !important; }
body.dark-mode .bg-orange-50 { background-color: rgba(154, 52, 18, 0.25) !important; color: #fdba74 !important; }
body.dark-mode .bg-orange-100 { background-color: rgba(154, 52, 18, 0.35) !important; color: #fdba74 !important; }
body.dark-mode .bg-purple-50 { background-color: rgba(88, 28, 135, 0.25) !important; color: #c084fc !important; }
body.dark-mode .bg-purple-200 { background-color: rgba(88, 28, 135, 0.45) !important; color: #c084fc !important; }
body.dark-mode .bg-indigo-100 { background-color: rgba(67, 56, 202, 0.35) !important; color: #a5b4fc !important; }
body.dark-mode .bg-indigo-200 { background-color: rgba(67, 56, 202, 0.45) !important; color: #a5b4fc !important; }
body.dark-mode .bg-pink-50 { background-color: rgba(157, 23, 77, 0.25) !important; color: #f9a8d4 !important; }
body.dark-mode .bg-pink-100 { background-color: rgba(157, 23, 77, 0.35) !important; color: #f9a8d4 !important; }
body.dark-mode .bg-slate-300 { background-color: #334155 !important; color: #cbd5e1 !important; }
body.dark-mode .bg-slate-400 { background-color: #475569 !important; color: #e2e8f0 !important; }
body.dark-mode .border-slate-300 { border-color: #475569 !important; }
body.dark-mode .border-blue-300,
body.dark-mode .border-blue-400,
body.dark-mode .border-blue-500,
body.dark-mode .border-blue-600 { border-color: rgba(var(--azure-glow-rgb),0.45) !important; }
body.dark-mode .border-red-300,
body.dark-mode .border-red-500 { border-color: rgba(239, 68, 68, 0.45) !important; }
body.dark-mode .border-amber-200 { border-color: rgba(217, 119, 6, 0.4) !important; }
body.dark-mode .border-orange-200 { border-color: rgba(234, 88, 12, 0.4) !important; }

/* ---- Textes de couleur foncée devenant illisibles sur fond sombre -- */
body.dark-mode .text-blue-400,
body.dark-mode .text-blue-500 { color: var(--azure-glow) !important; }
body.dark-mode .text-blue-700,
body.dark-mode .text-blue-800 { color: var(--azure-glow) !important; }
body.dark-mode .text-red-300,
body.dark-mode .text-red-400,
body.dark-mode .text-red-500 { color: #f87171 !important; }
body.dark-mode .text-red-800 { color: #fca5a5 !important; }
body.dark-mode .text-green-500 { color: #34d399 !important; }
body.dark-mode .text-amber-600,
body.dark-mode .text-amber-700,
body.dark-mode .text-amber-800 { color: #fbbf24 !important; }
body.dark-mode .text-yellow-600 { color: #fde047 !important; }
body.dark-mode .text-orange-400,
body.dark-mode .text-orange-500,
body.dark-mode .text-orange-600 { color: #fb923c !important; }
body.dark-mode .text-orange-700,
body.dark-mode .text-orange-800 { color: #fdba74 !important; }
body.dark-mode .text-purple-500 { color: #c084fc !important; }
body.dark-mode .text-indigo-600 { color: #a5b4fc !important; }
body.dark-mode .text-pink-400,
body.dark-mode .text-pink-600 { color: #f472b6 !important; }

/* ---- Scroll général ---------------------------------------
   Volontairement vide : la scrollbar est unifiée dans azur.css et suit les
   variables de thème. Les anciennes règles !important d'ici imposaient une
   piste opaque (#0f172a) qui empêchait la barre discrète de s'appliquer. */