/*
 * Extrait de templates/extranet/_styles.html.twig le 17/08/2026.
 *
 * POURQUOI CE FICHIER EXISTE. Ces règles étaient écrites dans un bloc <style>
 * au milieu du gabarit. Un style inline est retransmis DANS LE HTML à chaque
 * affichage de la page : le navigateur ne peut pas le mettre en cache, il le
 * retélécharge et le ré-analyse à chaque navigation, pour un contenu
 * rigoureusement identique. Sur l'ensemble de l'intranet, cela représentait
 * environ 370 Ko renvoyés en boucle.
 *
 * Servi comme fichier, il est mis en cache un an par le navigateur (le nom
 * porte une empreinte du contenu : toute modification produit un nom neuf, il
 * ne peut donc pas y avoir de version périmée servie par erreur).
 *
 * NE PAS MODIFIER CE FICHIER À LA MAIN sans savoir qu'il est référencé par son
 * empreinte dans le gabarit d'origine : changer l'un sans l'autre ferait servir
 * l'ancienne feuille. Voir docs/statiques-extraits.md.
 */
:root {
        /* Couleurs IBS (alignées sur la charte du login intranet) */
        --ibs-ink:        #0E2A40;
        --ibs-deep:       #133C55;
        --ibs-blue:       #2D73A7;
        --ibs-sky:        #59A5D8;
        --ibs-mist:       #E8F1F8;

        --c-text:         #17324D;
        --c-text-muted:   #6B7C8F;
        --c-text-soft:    #95A0AB;

        --c-bg:           #F3F7FB;
        --c-bg-soft:      #F8FBFE;
        --c-card:         #FFFFFF;

        --c-border:       rgba(148, 163, 184, 0.18);
        --c-border-soft:  rgba(148, 163, 184, 0.10);
        --c-border-hover: rgba(89, 165, 216, 0.45);

        --c-success-bg:   #D4F3DD;
        --c-success-fg:   #1E7E34;
        --c-warning-bg:   #FFF3CD;
        --c-warning-fg:   #856404;
        --c-danger-bg:    #F1D4D4;
        --c-danger-fg:    #842029;
        --c-info-bg:      #D1ECF1;
        --c-info-fg:      #0C5460;

        --radius-sm: 8px;
        --radius:    12px;
        --radius-lg: 18px;
        --radius-xl: 24px;

        --shadow-card:  0 1px 2px rgba(15, 23, 42, .03), 0 1px 3px rgba(15, 23, 42, .04);
        --shadow-pop:   0 16px 40px rgba(15, 23, 42, .10);
        --shadow-deep:  0 28px 64px rgba(15, 23, 42, .14);

        --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    }

    * { box-sizing: border-box; }

    body {
        font-family: var(--font-sans);
        color: var(--c-text);
        background:
            radial-gradient(900px 380px at 90% -10%, rgba(89, 165, 216, .10), transparent 60%),
            linear-gradient(180deg, #F4F8FC 0%, #EEF4FA 100%);
        margin: 0;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    /* ---------- Badges ---------- */
    .ibs-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 3px 10px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .04em;
        line-height: 1.5;
    }
    .ibs-badge--success { background: var(--c-success-bg); color: var(--c-success-fg); }
    .ibs-badge--warning { background: var(--c-warning-bg); color: var(--c-warning-fg); }
    .ibs-badge--danger  { background: var(--c-danger-bg);  color: var(--c-danger-fg); }
    .ibs-badge--info    { background: var(--c-info-bg);    color: var(--c-info-fg); }
    .ibs-badge--soft    { background: rgba(45, 115, 167, .10); color: var(--ibs-deep); }

    /* ---------- Cards & tables ---------- */
    .ibs-card {
        background: var(--c-card);
        border: 1px solid var(--c-border-soft);
        border-radius: var(--radius-lg);
        box-shadow: var(--shadow-card);
        padding: 28px;
    }

    .ibs-page-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 22px;
    }
    .ibs-page-title {
        display: flex;
        align-items: center;
        gap: 12px;
        margin: 0;
        font-size: 20px;
        font-weight: 700;
        color: var(--ibs-ink);
        letter-spacing: -.01em;
    }
    .ibs-page-title__icon {
        width: 38px;
        height: 38px;
        border-radius: 12px;
        background: linear-gradient(135deg, var(--ibs-deep) 0%, var(--ibs-blue) 100%);
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 8px 18px rgba(45, 115, 167, .25);
    }
    .ibs-page-title__icon .material-icons { font-size: 20px; }
    .ibs-page-eyebrow {
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .12em;
        font-weight: 700;
        color: var(--c-text-soft);
        margin-bottom: 4px;
    }

    .ibs-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 14px;
    }
    .ibs-table thead th {
        text-align: left;
        padding: 12px 14px;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .08em;
        font-weight: 700;
        color: var(--c-text-muted);
        border-bottom: 1px solid var(--c-border);
        background: var(--c-bg-soft);
    }
    .ibs-table tbody td {
        padding: 14px;
        border-bottom: 1px solid var(--c-border-soft);
        vertical-align: middle;
    }
    .ibs-table tbody tr:last-child td { border-bottom: 0; }
    .ibs-table tbody tr { transition: background .14s ease; }
    .ibs-table tbody tr:hover { background: var(--c-bg-soft); }
    .ibs-table a { color: var(--ibs-deep); font-weight: 600; text-decoration: none; }
    .ibs-table a:hover { color: var(--ibs-blue); text-decoration: underline; }

    /* ---------- Empty state ---------- */
    .ibs-empty {
        padding: 48px 20px;
        text-align: center;
        color: var(--c-text-muted);
    }
    .ibs-empty__icon {
        width: 64px;
        height: 64px;
        margin: 0 auto 16px;
        border-radius: 50%;
        background: var(--ibs-mist);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--ibs-blue);
    }
    .ibs-empty__icon .material-icons { font-size: 28px; }
    .ibs-empty__title {
        font-size: 16px;
        font-weight: 700;
        color: var(--c-text);
        margin-bottom: 6px;
    }
    .ibs-empty__text { font-size: 14px; color: var(--c-text-muted); margin: 0; }

    /* ---------- Buttons ---------- */
    .ibs-btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 10px 18px;
        font-size: 14px;
        font-weight: 600;
        border-radius: 10px;
        border: 1px solid transparent;
        cursor: pointer;
        text-decoration: none;
        transition: transform .14s ease, box-shadow .14s ease, background .14s ease;
    }
    .ibs-btn--primary {
        background: linear-gradient(135deg, var(--ibs-deep) 0%, var(--ibs-blue) 100%);
        color: #fff;
        box-shadow: 0 10px 22px rgba(45, 115, 167, .25);
    }
    .ibs-btn--primary:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(45, 115, 167, .32); color: #fff; }
    .ibs-btn--ghost {
        background: #fff;
        color: var(--c-text);
        border-color: var(--c-border);
    }
    .ibs-btn--ghost:hover { border-color: var(--c-border-hover); color: var(--ibs-deep); }

    /* ---------- Alert ---------- */
    .ibs-alert {
        padding: 14px 16px;
        border-radius: var(--radius);
        margin-bottom: 16px;
        border: 1px solid transparent;
        font-size: 14px;
        font-weight: 500;
    }
    .ibs-alert--success { background: var(--c-success-bg); color: var(--c-success-fg); border-color: rgba(30, 126, 52, .15); }
    .ibs-alert--danger  { background: var(--c-danger-bg);  color: var(--c-danger-fg);  border-color: rgba(132, 32, 41, .15); }
    .ibs-alert--info    { background: var(--c-info-bg);    color: var(--c-info-fg);    border-color: rgba(12, 84, 96, .15); }
    .ibs-alert--warning { background: var(--c-warning-bg); color: var(--c-warning-fg); border-color: rgba(133, 100, 4, .15); }

    /* ---------- Form ---------- */
    .ibs-form-row + .ibs-form-row { margin-top: 16px; }
    .ibs-form-label {
        display: block;
        font-size: 13px;
        font-weight: 700;
        color: var(--c-text);
        margin-bottom: 6px;
    }
    .ibs-form-control {
        display: block;
        width: 100%;
        height: 48px;
        padding: 0 14px;
        background: #fff;
        border: 1px solid var(--c-border);
        border-radius: 12px;
        font-size: 14px;
        color: var(--c-text);
        transition: border-color .14s ease, box-shadow .14s ease;
    }
    .ibs-form-control:focus {
        outline: none;
        border-color: var(--c-border-hover);
        box-shadow: 0 0 0 4px rgba(89, 165, 216, .12);
    }
    .ibs-form-help { font-size: 12.5px; color: var(--c-text-muted); margin-top: 6px; }
    .ibs-form-rules {
        background: var(--c-bg-soft);
        border: 1px solid var(--c-border-soft);
        border-radius: var(--radius);
        padding: 14px 18px;
        font-size: 12.5px;
        color: var(--c-text-muted);
        margin-bottom: 18px;
    }
    .ibs-form-rules ul { margin: 6px 0 0; padding-left: 18px; }
    .ibs-form-rules li { margin: 3px 0; }