/* iManage — toast */

/* ─── Notification box structure ─────────────────────────── */
#notification_box {
    width: 100%;
    position: fixed;
    z-index: 1090;
    background: var(--bg-notification);
    height: 48px;
    overflow: hidden;
    top: 0;
    left: 0;
}
/* Mobile : barre plus compacte */
@media (max-width: 575.98px) {
    #notification_box { height: 40px; }
    #notification_message_bar { height: 40px; }
    .notification_message_content { padding: 0 36px; }
}

#notification_slider {
    transform: translateY(-48px);
    transition: transform var(--transition-slow);
}

#notification_slider.show-notification {
    transform: translateY(0);
}

#notification_message_bar {
    height: 48px;
    background: transparent;
    position: relative;
    transition: background-color var(--transition);
}

/* ─── Toast (notification_box) ───────────────────────────── */
.notification_message_content {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    height: 100%;
    padding: 0 44px;   /* space for dismiss button on both sides */
}
/* Texte — toujours blanc quel que soit le fond sémantique */
#notification_text {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
    letter-spacing: 0.01em;
    color: var(--text-on-dark);
}
/* Force l'héritage sur tout le HTML injecté (spans, strong, a, badges...) */
#notification_text *:not(.badge):not(.btn) {
    color: inherit !important;
}
.nt-icon { display: none; }   /* icons disabled */
.nt-dismiss {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: var(--text-on-dark);
    opacity: var(--opacity-muted);
    font-size: 1.1rem;
    line-height: 1;
    padding: 4px 6px;
    cursor: pointer;
    transition: color var(--transition-fast), opacity var(--transition-fast);
    border-radius: var(--radius-xs);
}
.nt-dismiss:hover { color: var(--text-on-dark); opacity: 1; background: rgba(255,255,255,.12); }
/* Barre de progression — fine ligne au bas */
.nt-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    background: rgba(255,255,255,.4);
    width: 100%;
    border-radius: 0 0 0 0;
}
/* Couleurs sémantiques */
/* Le bandeau de succès prend un DÉGRADÉ qui va vers le plus foncé (04/09/2026,
   demande du propriétaire de LEMAI, posée ici pour les dix-huit projets qui
   partagent ce socle plutôt qu'en surcharge d'un seul).
   Il se construit à partir de --status-success et le fonce par color-mix : il
   reste donc VERT partout, et suit un projet qui redéfinirait ce jeton. Sur un
   bandeau qui passe deux secondes devant les yeux, l'aplat clair manquait
   d'assise. La couleur de repli reste servie pour qui ne connaît pas
   background-image. */
/* `.bg-success` est repris EN PLUS de `.nt-success` : toast.js traduit bien
   l'un en l'autre (ligne 69), mais seulement pour qui passe par le composant.
   Trois projets ont leur propre couche de notification et posent la classe
   Bootstrap directement sur le bandeau — le dégradé les aurait manqués en
   silence, ce que la session dep_boisson a mesuré avant de le signaler
   (04/09/2026). Un sélecteur de plus coûte moins qu'une dérive invisible. */
#notification_message_bar.nt-success,
#notification_message_bar.bg-success {
    background: var(--status-success);
    background-image: linear-gradient(135deg,
        var(--status-success) 0%,
        color-mix(in srgb, var(--status-success) 78%, black) 100%);
}
#notification_message_bar.nt-warning { background: var(--status-warning); }
#notification_message_bar.nt-danger  { background: var(--status-danger); }
#notification_message_bar.nt-info    { background: var(--accent); }

/* ─── Brand (logo + label) — v3.6.0 ─────────────────────────────────
   #brand_home est le lien cliquable de la barre supérieure (configuré par
   chaque projet via iManage.toast.configure({brand_label, logo_url, ...})).
   Il déclenche la navigation vers brand_link_id (typiquement 'dashboard').
*/
#brand_home {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    cursor: pointer;
    transition: opacity var(--transition-fast);
}
#brand_home:hover { opacity: 0.85; }

#brand_home .brand-logo {
    height: 22px;
    width: auto;
    max-width: 140px;
    display: block;
    object-fit: contain;
    /* Le logo est rendu blanc sur la barre sombre via filter (compatible logos transparents).
       Les projets dont le logo est déjà clair peuvent annuler ce filter dans leur app.css. */
    filter: brightness(0) invert(1);
}

#brand_home .brand-label {
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.01em;
}