/* V8-32 — le centre de notifications (P6-10) et la carte flottante à l'ouverture (P0-08).
   La carte elle-même (.notif-card) vit dans app.css ; ici son placement flottant, les liens et
   la barre « Tout lu ». Couleurs et ombres par les jetons seulement. */

.notif-toast { position: fixed; top: 56px; left: 10px; right: 10px; z-index: 1037; display: block; text-decoration: none; color: inherit; }
.notif-toast .notif-card { background: color-mix(in srgb, var(--brand-surface) 97%, transparent); backdrop-filter: blur(12px); box-shadow: var(--brand-shadow-card); border: 1px solid var(--brand-line); }
.notif-toast.is-leaving { opacity: 0; transform: translateY(-8px); transition: opacity .25s ease, transform .25s ease; }
@media (min-width: 992px) { .notif-toast { top: 72px; left: auto; right: 16px; width: 360px; } }

.notif-link { display: block; text-decoration: none; color: inherit; }
.notif-link:hover .notif-card, .notif-link:focus-visible .notif-card { border-color: var(--brand-accent); }
.notif-card .notif-links a { color: var(--brand-secondary); text-decoration: none; }
.notif-card .notif-links a:hover { text-decoration: underline; }

.notif-toolbar { display: flex; justify-content: flex-end; }