/*
 * Feuille de styles applicative (AssetMapper) — chargée sur l'admin ET le login
 * via <link> (voir templates/_theme.html.twig).
 *
 * CSS « pur » : pas de @apply (le Play CDN ne traite pas les .css externes, et il
 * n'y a pas de build Tailwind en dev). Les composants réutilisables vivent ici.
 */

:root {
    --brand: #6258eb;
    --brand-50: #f1f0fe;
    --brand-200: #cdc8fb;
    --brand-700: #4f43d1;
}

/* ————————————————————————————————————————————————
   Boutons réutilisables
   class="btn btn-primary"  (plein marque)
   class="btn btn-primary-outline"  (contour marque)
   class="btn btn-outline"  (contour neutre)
   class="btn btn-dark" / "btn btn-danger"
   + "btn-sm" pour une taille réduite
   ———————————————————————————————————————————————— */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    border: 1px solid transparent;
    border-radius: .5rem;
    padding: .5rem 1rem;
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.btn-primary { background-color: var(--brand); color: #fff; }
.btn-primary:hover { background-color: var(--brand-700); }

.btn-primary-outline { border-color: var(--brand-200); background-color: #fff; color: var(--brand-700); }
.btn-primary-outline:hover { background-color: var(--brand-50); }

.btn-outline { border-color: #e2e8f0; background-color: #fff; color: #334155; }
.btn-outline:hover { background-color: #f8fafc; }

.btn-dark { background-color: #0f172a; color: #fff; }
.btn-dark:hover { background-color: #334155; }

.btn-danger { background-color: #dc2626; color: #fff; }
.btn-danger:hover { background-color: #b91c1c; }

.btn-sm { padding: .375rem .75rem; }
