/* ==========================================================================
   Site public — socle partage
   Extrait de templates/partials/_public_styles.html.twig.
   Charge par le site vitrine, les pages de connexion, l'aide et les pages
   legales. Ecrit contre public/css/tokens.css.
   ========================================================================== */

/* Alias de l'ancienne charte, remappes sur les jetons actuels.
   Ils restent declares parce que le balisage de ces pages les utilise encore
   (.btn, --gray-200, ...). Point d'entree unique pour finir la bascule. */
:root {
    /* Direction « Crenolia » : le site vitrine prend le bleu neutre de
       l'application hors outil (jetons --info). */
    --primary:       var(--info);
    --primary-50:    var(--info-tint);
    --primary-hover: var(--info-ink);

    --gray-100: var(--surface-sunken);
    --gray-200: var(--border);
    --gray-300: var(--border-strong);
    --gray-700: var(--ink-secondary);
    --white:    var(--surface);

    --radius-xlg: var(--radius-pill);
}

*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-ui);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ---------- Boutons herites ------------------------------------------------
   Vocabulaire .btn de l'ancienne charte. Conserve tant que le site vitrine,
   l'aide et les pages legales s'en servent ; les ecrans recettes utilisent
   .ui-btn / <twig:ui:Button>.
   -------------------------------------------------------------------------- */
.btn {
    display: inline-block;
    padding: 0.8rem 1.25rem;
    line-height: 1.2;
    font-size: 0.75rem;
    font-weight: var(--weight-medium);
    text-align: center;
    text-decoration: none;
    border: none;
    border-radius: var(--radius-xlg);
    cursor: pointer;
    transition: all var(--duration) var(--ease);
    font-family: var(--font-ui);
}

.btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-primary {
    background: var(--primary);
    color: var(--white);
    border: 2px solid var(--primary);
}

.btn-primary:hover:not(:disabled) {
    border-color: var(--primary-hover);
    background: var(--surface);
    color: var(--primary-hover);
}

.btn-secondary {
    background: var(--gray-100);
    color: var(--gray-700);
    border: 2px solid var(--gray-100);
}

.btn-secondary:hover:not(:disabled) {
    background: var(--gray-200);
}

.btn-outline {
    background: transparent;
    border: 2px solid var(--gray-300);
    color: var(--gray-700);
}

.btn-outline:hover:not(:disabled) {
    border-color: var(--primary-hover);
    color: var(--primary);
}

.btn-success {
    background: var(--success);
    color: var(--ink-on-dark);
    border: 2px solid var(--success);
}

.btn-success:hover:not(:disabled) {
    background: var(--success-ink);
    border-color: var(--success-ink);
}

.btn-warning {
    background: var(--warning);
    color: var(--ink-on-dark);
    border: 2px solid var(--warning);
}

.btn-warning:hover:not(:disabled) {
    background: var(--warning-ink);
    border-color: var(--warning-ink);
}

.btn-danger {
    background: var(--danger);
    color: var(--ink-on-dark);
    border: 2px solid var(--danger);
}

.btn-danger:hover:not(:disabled) {
    background: var(--danger-ink);
    border-color: var(--danger-ink);
}

.btn-sm {
    padding: 0.4rem 0.875rem;
    font-size: 0.8rem;
}

.btn-lg {
    padding: 1rem 1.75rem;
    font-size: 1rem;
}

.btn-block {
    display: block;
    width: 100%;
}