/* Styles globaux GRA */
:root {
    --graret-primary: #1e1b4b;
    --graret-accent: #f59e0b;
}

body {
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif;
}

.font-display {
    font-family: 'Plus Jakarta Sans', 'Inter', ui-sans-serif, system-ui, sans-serif;
}

/* Scrollbar discrète */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: #c7d2fe;
    border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
    background: #a5b4fc;
}

/* Animations douces */
@keyframes fade-up {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: translateY(0); }
}
.animate-fade-up {
    animation: fade-up 0.5s ease-out both;
}
.animate-fade-up-delay-1 { animation: fade-up 0.5s ease-out 0.1s both; }
.animate-fade-up-delay-2 { animation: fade-up 0.5s ease-out 0.2s both; }
.animate-fade-up-delay-3 { animation: fade-up 0.5s ease-out 0.3s both; }

/* Classes dynamiques (couleurs des cartes statistiques du tableau de bord)
   — déclarées ici car le CDN Tailwind ne voit pas les classes construites
     dynamiquement dans les templates Twig. */
@supports (color: #6366f1) {
    .bg-brand-50   { background-color: #eef2ff; } .text-brand-600  { color: #4f46e5; }
    .ring-brand-100 { --tw-ring-color: #e0e7ff; }
    .from-brand-400 { --tw-gradient-from: #818cf8; --tw-gradient-stops: #818cf8, #4338ca; }
    .to-brand-600   { --tw-gradient-to: #4f46e5; }

    .bg-blue-50    { background-color: #eff6ff; } .text-blue-600   { color: #2563eb; }
    .ring-blue-100 { --tw-ring-color: #dbeafe; }
    .from-blue-400 { --tw-gradient-from: #60a5fa; --tw-gradient-stops: #60a5fa, #2563eb; }
    .to-blue-600   { --tw-gradient-to: #2563eb; }

    .bg-pink-50    { background-color: #fdf2f8; } .text-pink-600   { color: #db2777; }
    .ring-pink-100 { --tw-ring-color: #fce7f3; }
    .from-pink-400 { --tw-gradient-from: #f472b6; --tw-gradient-stops: #f472b6, #db2777; }
    .to-pink-600   { --tw-gradient-to: #db2777; }

    .bg-emerald-50    { background-color: #ecfdf5; } .text-emerald-600 { color: #059669; }
    .ring-emerald-100 { --tw-ring-color: #d1fae5; }
    .from-emerald-400 { --tw-gradient-from: #34d399; --tw-gradient-stops: #34d399, #059669; }
    .to-emerald-600   { --tw-gradient-to: #059669; }

    .bg-amber-50    { background-color: #fffbeb; } .text-amber-600 { color: #d97706; }
    .ring-amber-100 { --tw-ring-color: #fef3c7; }
    .from-amber-400 { --tw-gradient-from: #fbbf24; --tw-gradient-stops: #fbbf24, #d97706; }
    .to-amber-600   { --tw-gradient-to: #d97706; }
}