/* Classes de couleurs pour les thèmes de pages */
/* Ces classes utilisent les variables CSS définies dans TailAdmin */

/* Blue (Objectifs) */
.bg-blue-50 { background-color: var(--color-blue-50, #eff6ff); }
.bg-blue-100 { background-color: var(--color-blue-100, #dbeafe); }
.bg-blue-500 { background-color: var(--color-blue-500, #3b82f6); }
.bg-blue-600 { background-color: var(--color-blue-600, #2563eb); }
.text-blue-400 { color: var(--color-blue-400, #60a5fa); }
.text-blue-500 { color: var(--color-blue-500, #3b82f6); }
.text-blue-700 { color: var(--color-blue-700, #1d4ed8); }
.text-blue-800 { color: var(--color-blue-800, #1e40af); }
.border-blue-500 { border-color: var(--color-blue-500, #3b82f6); }
.hover\:bg-blue-600:hover { background-color: var(--color-blue-600, #2563eb); }

/* Purple (Familles) */
.bg-purple-50 { background-color: var(--color-purple-50, #faf5ff); }
.bg-purple-100 { background-color: var(--color-purple-100, #f3e8ff); }
.bg-purple-500 { background-color: var(--color-purple-500, #a855f7); }
.bg-purple-600 { background-color: var(--color-purple-600, #9333ea); }
.text-purple-400 { color: var(--color-purple-400, #c084fc); }
.text-purple-500 { color: var(--color-purple-500, #a855f7); }
.text-purple-700 { color: var(--color-purple-700, #7e22ce); }
.border-purple-300 { border-color: var(--color-purple-300, #d8b4fe); }
.border-purple-400 { border-color: var(--color-purple-400, #c084fc); }
.border-purple-500 { border-color: var(--color-purple-500, #a855f7); }
.hover\:bg-purple-50:hover { background-color: var(--color-purple-50, #faf5ff); }
.dark\:bg-purple-500\/12:is(.dark *) { background-color: color-mix(in oklab, var(--color-purple-500, #a855f7) 12%, transparent); }
.dark\:text-purple-400:is(.dark *) { color: var(--color-purple-400, #c084fc); }
.dark\:border-purple-400:is(.dark *) { border-color: var(--color-purple-400, #c084fc); }
.dark\:hover\:bg-purple-900\/20:hover:is(.dark *) { background-color: color-mix(in oklab, var(--color-purple-900, #581c87) 20%, transparent); }

/* Emerald (Planning) */
.bg-emerald-50 { background-color: var(--color-emerald-50, #ecfdf5); }
.bg-emerald-500 { background-color: var(--color-emerald-500, #10b981); }
.bg-emerald-600 { background-color: var(--color-emerald-600, #059669); }
.text-emerald-400 { color: var(--color-emerald-400, #34d399); }
.text-emerald-500 { color: var(--color-emerald-500, #10b981); }
.border-emerald-500 { border-color: var(--color-emerald-500, #10b981); }
.hover\:bg-emerald-600:hover { background-color: var(--color-emerald-600, #059669); }
.dark\:bg-emerald-500\/12:is(.dark *) { background-color: color-mix(in oklab, var(--color-emerald-500, #10b981) 12%, transparent); }
.dark\:text-emerald-400:is(.dark *) { color: var(--color-emerald-400, #34d399); }

/* Rose (Demandes) */
.bg-rose-50 { background-color: var(--color-rose-50, #fff1f2); }
.bg-rose-100 { background-color: var(--color-rose-100, #ffe4e6); }
.bg-rose-500 { background-color: var(--color-rose-500, #f43f5e); }
.bg-rose-600 { background-color: var(--color-rose-600, #e11d48); }
.text-rose-400 { color: var(--color-rose-400, #fb7185); }
.text-rose-500 { color: var(--color-rose-500, #f43f5e); }
.text-rose-700 { color: var(--color-rose-700, #be123c); }
.border-rose-300 { border-color: var(--color-rose-300, #fda4af); }
.border-rose-500 { border-color: var(--color-rose-500, #f43f5e); }
.hover\:bg-rose-600:hover { background-color: var(--color-rose-600, #e11d48); }
.dark\:bg-rose-500\/12:is(.dark *) { background-color: color-mix(in oklab, var(--color-rose-500, #f43f5e) 12%, transparent); }
.dark\:bg-rose-900\/20:is(.dark *) { background-color: color-mix(in oklab, var(--color-rose-900, #881337) 20%, transparent); }
.dark\:text-rose-300:is(.dark *) { color: var(--color-rose-300, #fda4af); }
.dark\:text-rose-400:is(.dark *) { color: var(--color-rose-400, #fb7185); }

/* Indigo (Dashboard) */
.bg-indigo-50 { background-color: var(--color-indigo-50, #eef2ff); }
.bg-indigo-500 { background-color: var(--color-indigo-500, #6366f1); }
.bg-indigo-600 { background-color: var(--color-indigo-600, #4f46e5); }
.text-indigo-400 { color: var(--color-indigo-400, #818cf8); }
.text-indigo-500 { color: var(--color-indigo-500, #6366f1); }
.dark\:bg-indigo-500\/12:is(.dark *) { background-color: color-mix(in oklab, var(--color-indigo-500, #6366f1) 12%, transparent); }
.dark\:text-indigo-400:is(.dark *) { color: var(--color-indigo-400, #818cf8); }

/* Teal (Activités) */
.bg-teal-50 { background-color: var(--color-teal-50, #f0fdfa); }
.bg-teal-500 { background-color: var(--color-teal-500, #14b8a6); }
.bg-teal-600 { background-color: var(--color-teal-600, #0d9488); }
.text-teal-400 { color: var(--color-teal-400, #2dd4bf); }
.text-teal-500 { color: var(--color-teal-500, #14b8a6); }
.dark\:bg-teal-500\/12:is(.dark *) { background-color: color-mix(in oklab, var(--color-teal-500, #14b8a6) 12%, transparent); }
.dark\:text-teal-400:is(.dark *) { color: var(--color-teal-400, #2dd4bf); }

/* Violet (Activités scolaires) */
.bg-violet-50 { background-color: var(--color-violet-50, #f5f3ff); }
.bg-violet-500 { background-color: var(--color-violet-500, #8b5cf6); }
.bg-violet-600 { background-color: var(--color-violet-600, #7c3aed); }
.text-violet-400 { color: var(--color-violet-400, #a78bfa); }
.text-violet-500 { color: var(--color-violet-500, #8b5cf6); }
.dark\:bg-violet-500\/12:is(.dark *) { background-color: color-mix(in oklab, var(--color-violet-500, #8b5cf6) 12%, transparent); }
.dark\:text-violet-400:is(.dark *) { color: var(--color-violet-400, #a78bfa); }

/* Sky (Spécialistes) */
.bg-sky-50 { background-color: var(--color-sky-50, #f0f9ff); }
.bg-sky-500 { background-color: var(--color-sky-500, #0ea5e9); }
.bg-sky-600 { background-color: var(--color-sky-600, #0284c7); }
.text-sky-400 { color: var(--color-sky-400, #38bdf8); }
.text-sky-500 { color: var(--color-sky-500, #0ea5e9); }
.dark\:bg-sky-500\/12:is(.dark *) { background-color: color-mix(in oklab, var(--color-sky-500, #0ea5e9) 12%, transparent); }
.dark\:text-sky-400:is(.dark *) { color: var(--color-sky-400, #38bdf8); }

/* Cyan (Tâches) */
.bg-cyan-50 { background-color: var(--color-cyan-50, #ecfeff); }
.bg-cyan-500 { background-color: var(--color-cyan-500, #06b6d4); }
.bg-cyan-600 { background-color: var(--color-cyan-600, #0891b2); }
.text-cyan-400 { color: var(--color-cyan-400, #22d3ee); }
.text-cyan-500 { color: var(--color-cyan-500, #06b6d4); }

/* Amber (Preuves) */
.bg-amber-50 { background-color: var(--color-amber-50, #fffbeb); }
.bg-amber-500 { background-color: var(--color-amber-500, #f59e0b); }
.bg-amber-600 { background-color: var(--color-amber-600, #d97706); }
.text-amber-400 { color: var(--color-amber-400, #fbbf24); }
.text-amber-500 { color: var(--color-amber-500, #f59e0b); }

/* Pink (Messages) */
.bg-pink-50 { background-color: var(--color-pink-50, #fdf2f8); }
.bg-pink-500 { background-color: var(--color-pink-500, #ec4899); }
.bg-pink-600 { background-color: var(--color-pink-600, #db2777); }
.text-pink-400 { color: var(--color-pink-400, #f472b6); }
.text-pink-500 { color: var(--color-pink-500, #ec4899); }

/* Yellow (Notifications) */
.bg-yellow-50 { background-color: var(--color-yellow-50, #fefce8); }
.bg-yellow-500 { background-color: var(--color-yellow-500, #eab308); }
.bg-yellow-600 { background-color: var(--color-yellow-600, #ca8a04); }
.text-yellow-400 { color: var(--color-yellow-400, #facc15); }
.text-yellow-500 { color: var(--color-yellow-500, #eab308); }

/* Lime (Disponibilités) */
.bg-lime-50 { background-color: var(--color-lime-50, #f7fee7); }
.bg-lime-500 { background-color: var(--color-lime-500, #84cc16); }
.bg-lime-600 { background-color: var(--color-lime-600, #65a30d); }
.text-lime-400 { color: var(--color-lime-400, #a3e635); }
.text-lime-500 { color: var(--color-lime-500, #84cc16); }

/* Slate (Intégrations) */
.bg-slate-50 { background-color: var(--color-slate-50, #f8fafc); }
.bg-slate-500 { background-color: var(--color-slate-500, #64748b); }
.bg-slate-600 { background-color: var(--color-slate-600, #475569); }
.text-slate-400 { color: var(--color-slate-400, #94a3b8); }
.text-slate-500 { color: var(--color-slate-500, #64748b); }

/* Focus states */
.focus\:border-blue-500:focus { border-color: var(--color-blue-500, #3b82f6); }
.focus\:border-emerald-500:focus { border-color: var(--color-emerald-500, #10b981); }
.focus\:ring-blue-500\/20:focus { --tw-ring-color: color-mix(in oklab, var(--color-blue-500, #3b82f6) 20%, transparent); }
.focus\:ring-emerald-500\/20:focus { --tw-ring-color: color-mix(in oklab, var(--color-emerald-500, #10b981) 20%, transparent); }

/* Dark mode variants */
.dark\:bg-blue-50\/30:is(.dark *) { background-color: color-mix(in oklab, var(--color-blue-50, #eff6ff) 30%, transparent); }
.dark\:bg-blue-500\/15:is(.dark *) { background-color: color-mix(in oklab, var(--color-blue-500, #3b82f6) 15%, transparent); }
.dark\:bg-blue-900\/20:is(.dark *) { background-color: color-mix(in oklab, var(--color-blue-900, #1e3a8a) 20%, transparent); }
.dark\:text-blue-200:is(.dark *) { color: var(--color-blue-200, #bfdbfe); }
.dark\:text-blue-400:is(.dark *) { color: var(--color-blue-400, #60a5fa); }
.dark\:border-blue-700:is(.dark *) { border-color: var(--color-blue-700, #1d4ed8); }