/* Page « Notifications et application » et invitation du tableau de bord. */
.notif-card { border-radius: 12px; }
.notif-card .card-title i { color: #7C3AED; margin-right: 4px; }
.notif-status { font-weight: 600; margin-bottom: 12px; }
.notif-card.is-on .notif-status { color: #1e7e34; }
.notif-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.notif-msg { margin: 12px 0 0; }
.notif-msg:empty { display: none; }
.notif-msg.ok { color: #1e7e34; }
.notif-msg.err { color: #b02a37; }
.notif-help { margin-top: 12px; padding: 10px 12px; border-radius: 8px; background: #F3EEFF; }
.notif-devices { margin: 12px 0 0; font-size: .9rem; }
.notif-steps { margin: 8px 0 0; padding-left: 1.3em; }
.notif-steps li { margin-bottom: 4px; }
.notif-ok { color: #1e7e34; font-weight: 600; margin: 0; }

.notif-invite { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-bottom: 18px;
  padding: 12px 14px; border: 1px solid #E2D6FF; border-radius: 12px; background: #F3EEFF; }
.notif-invite[hidden] { display: none; }
.notif-invites { position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  z-index: 1040; max-width: 560px; margin: 0 auto; display: flex; flex-direction: column; gap: 8px; pointer-events: none; }
.notif-invites > .notif-invite { pointer-events: auto; margin-bottom: 0; box-shadow: 0 10px 28px rgba(17, 24, 39, .18); }
.notif-invite > .bi { font-size: 1.4rem; color: #7C3AED; }
.notif-invite-text { flex: 1 1 220px; }