/* Mode MODALE (réglage « Alertes en bandeau » décoché → divers.alerte = 'wrapper') :
   le conteneur devient un overlay centré sur fond sombre (parité legacy « template-alertes »).
   En mode bandeau (coché), .ws-alertes n'a pas ce modificateur → affichage en haut de page. */
.ws-alertes--wrapper {
    position: fixed;
    inset: 0;
    z-index: 8500;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1.5rem;
    background: rgba(0, 0, 0, .5);
    overflow-y: auto;
}
.ws-alertes--wrapper .alert {
    width: 100%;
    max-width: 600px;
    margin: 0;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .45);
    border-radius: 8px;
}
.ws-alertes--wrapper[hidden] { display: none; }

/* Cloche de notifications d'alerte — bouton fixe bas-gauche, sous le bouton d'accessibilité
   (#ws-access-toggle est à bottom:90px;left:18px). Clic = réaffiche les bandeaux fermés. */
.ws-alerte-bell {
    position: fixed;
    left: 18px;
    bottom: 30px;
    z-index: 8499;
    width: 48px;
    height: 48px;
    padding: 0;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #a0273a;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .4);
    transition: background .15s;
}
.ws-alerte-bell:hover { background: #7a1e2c; }
.ws-alerte-bell:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.ws-alerte-bell svg { width: 24px; height: 24px; fill: #fff; }

.ws-alerte-bell__count {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 9px;
    border: 2px solid #fff;
    background: #1a5276;
    color: #fff;
    font: 700 11px/1 sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ws-alerte-bell[hidden] { display: none; }