/* ============ Notifications DA 2.0 (global) ============
   Bicolore forge/papier : segment sombre (texture v2-phero) avec l'icône,
   coupure diagonale colorée, partie claire pour les textes. */
.v2-toast-region {
    position: fixed; top: clamp(14px, 3vw, 28px); right: clamp(14px, 3vw, 28px);
    z-index: 4000; display: flex; flex-direction: column; gap: 10px;
    width: min(400px, calc(100vw - 28px)); pointer-events: none;
}
.v2-toast {
    pointer-events: auto; position: relative; display: flex; align-items: stretch;
    min-height: 64px; border-radius: 13px; overflow: hidden;
    color: var(--v2-ink, #191713);
    /* sombre 0→56px, bande diagonale 57→62px, papier ensuite (axe 102deg).
       Transitions sur 1px : juste de quoi lisser la diagonale, sans zone de
       mélange sombre/vert qui se lirait comme un second filet. */
    background: linear-gradient(102deg,
        #241f18 0px, #15130F 56px,
        var(--v2-green, #2D9446) 57px, var(--v2-green, #2D9446) 62px,
        #f6f5f1 63px);
    /* Filet en box-shadow et non en border : une bordure décalerait le fond
       d'1px sous elle (background-origin), d'où le liseré de couleur au bord. */
    box-shadow: 0 0 0 1px rgba(21,19,15,0.12),
                0 16px 36px -16px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.22);
    animation: v2ToastIn 0.38s cubic-bezier(.2,.8,.2,1) both;
}
/* traits forge (recette .v2-phero), masqués hors du segment sombre */
.v2-toast::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background:
        repeating-linear-gradient(115deg, rgba(217,98,43,0.12) 0 2px, transparent 2px 14px),
        radial-gradient(130% 140% at 0% 0%, rgba(55,180,87,0.16), transparent 58%);
    /* coupé net avant la bande : la texture orangée ne doit pas déteindre
       dessus, sinon le vert prend deux tons de part et d'autre de la diagonale */
    -webkit-mask: linear-gradient(102deg, #000 55px, transparent 56px);
            mask: linear-gradient(102deg, #000 55px, transparent 56px);
}
.v2-toast.is-out { animation: v2ToastOut 0.26s ease forwards; }

.v2-toast-ico {
    flex: none; width: 56px; display: grid; place-items: center;
    position: relative; color: var(--v2-green-glow, #37B457);
}
.v2-toast-ico svg { width: 20px; height: 20px; display: block; }

.v2-toast-body {
    min-width: 0; display: flex; flex-direction: column; justify-content: center;
    gap: 2px; padding: 10px 16px 11px 16px;
}
.v2-toast-kind {
    font-family: var(--v2-font-mono, 'IBM Plex Mono', monospace);
    font-size: 0.6rem; letter-spacing: 0.15em; text-transform: uppercase;
    color: var(--v2-green-deep, #1C6E34);
}
.v2-toast-title { font-family: var(--v2-font-sans, 'Inter', sans-serif); font-weight: 600; font-size: 0.92rem; line-height: 1.25; color: var(--v2-ink, #191713); margin: 0; }
.v2-toast-msg { font-size: 0.82rem; color: var(--v2-ink-soft, #565248); line-height: 1.45; margin: 0; }

/* variantes : bande diagonale + libellé + icône (le segment forge reste sombre) */
.v2-toast--warn {
    background: linear-gradient(102deg,
        #241f18 0px, #15130F 56px,
        var(--v2-ember, #D9622B) 57px, var(--v2-ember, #D9622B) 62px,
        #f6f5f1 63px);
}
.v2-toast--warn .v2-toast-ico { color: var(--v2-ember, #D9622B); }
.v2-toast--warn .v2-toast-kind { color: #B4511F; }
.v2-toast--error {
    background: linear-gradient(102deg,
        #241f18 0px, #15130F 56px,
        #D9534F 57px, #D9534F 62px,
        #f6f5f1 63px);
}
.v2-toast--error .v2-toast-ico { color: #E8776F; }
.v2-toast--error .v2-toast-kind { color: #C04440; }

@keyframes v2ToastIn { from { opacity: 0; transform: translateX(24px) scale(0.98); } to { opacity: 1; transform: translateX(0) scale(1); } }
@keyframes v2ToastOut { from { opacity: 1; transform: translateX(0); } to { opacity: 0; transform: translateX(24px); } }
@media (prefers-reduced-motion: reduce) { .v2-toast, .v2-toast.is-out { animation: none; } }