/* ============================================================
   AX-ON — Badge de visibilité (Lot L9)
   Pose un label discret à côté du titre d'écran listing pour
   indiquer le périmètre de visibilité actif (rôle 4 modèles).
   ============================================================ */

.ax-visibility-badge {
    display: inline-flex;
    align-items: center;
    margin-left: 0.625rem;
    padding: 2px 8px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-radius: 9999px;
    border: 1px solid transparent;
    white-space: nowrap;
    vertical-align: middle;
    cursor: help;
    user-select: none;
}

/* Variant user / user_mandat — sobre ivoire */
.ax-visibility-badge--user {
    background: var(--ax-ivory-0, #ffffff);
    color: var(--ax-ink-700, #3F3826);
    border-color: var(--ax-ink-200, #DDD6BC);
}

/* Variant cabinet_admin — accent navy léger */
.ax-visibility-badge--cabinet-admin {
    background: var(--ax-navy-50, #F2F5F9);
    color: var(--ax-navy-800, #0B2545);
    border-color: var(--ax-navy-100, #E8EDF3);
}

/* Variant super_admin — accent or */
.ax-visibility-badge--super-admin {
    background: var(--ax-gold-50, #FDF8E8);
    color: var(--ax-gold-700, #7D5A14);
    border-color: var(--ax-gold-100, #FBF0D2);
}

/* Adaptation contraste sur header sombre (gradient navy/ink) :
   quand le badge est placé dans un container fond foncé, le titre H2
   est blanc → on inverse le rendu via .on-dark sur le badge. */
.ax-visibility-badge.on-dark,
[style*="linear-gradient(135deg, #071A30"] .ax-visibility-badge,
[style*="linear-gradient(135deg,#071A30"] .ax-visibility-badge {
    background: rgba(255, 255, 255, 0.10);
    color: rgba(255, 255, 255, 0.92);
    border-color: rgba(255, 255, 255, 0.20);
}