/* ManualPass – interaktive Vorschau „Sicherheitsmitteilungen“ */
.xd-nt-kinds { display: flex; flex-wrap: wrap; gap: 6px; }
.xd-nt-kind { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 5px 11px; font: 600 12.5px var(--display); cursor: pointer; color: var(--ink); }
.xd-nt-kind[aria-pressed="true"] { background: var(--ink); color: #fff; border-color: var(--ink); }
.xd-nt-check { display: flex; gap: 8px; align-items: center; font-size: 12.5px; color: var(--muted); }
.xd-nt-banner { border-radius: 8px; padding: 7px 9px; display: flex; flex-direction: column; gap: 2px; border: 1px solid #F1B4AE; border-left: 5px solid var(--red); background: #FDECEA; animation: xdnt .5s ease; }
.xd-nt-banner b { font-size: 12.5px; line-height: 1.25; }
.xd-nt-banner small { font-size: 10.5px; color: #3A4652; line-height: 1.3; }
.xd-nt-banner em { font-style: normal; font-weight: 600; }
.xd-nt-k { align-self: flex-start; font: 700 9.5px var(--display); letter-spacing: .06em; text-transform: uppercase; color: #fff; background: var(--red); border-radius: 4px; padding: 1px 6px; }
.xd-nt-banner[data-banner="warning"] .xd-nt-k { background: none; color: var(--red); padding: 0; }
.xd-nt-banner[data-banner="info"] { background: #EEF3FF; border-color: #BFD0F5; border-left-color: #1D4ED8; }
.xd-nt-banner[data-banner="info"] .xd-nt-k { background: none; color: #1D4ED8; padding: 0; }
.xd-nt-banner[data-banner="security"] { background: #FFF4D6; border-color: #F2D27A; border-left-color: var(--amber); }
.xd-nt-banner[data-banner="security"] .xd-nt-k { background: none; color: #8A5F00; padding: 0; }
.xd-nt-doc { background: #fff; border: 1px solid var(--line); border-radius: 7px; padding: 5px 8px; font-size: 11.5px; display: flex; gap: 6px; align-items: center; }
.xd-nt-doc i { font: 700 9px var(--display); font-style: normal; background: #FDE7E5; color: var(--red); border-radius: 4px; padding: 1px 4px; }
.xd-nt-acks { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.xd-nt-acks li { display: flex; justify-content: space-between; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 7px 10px; transition: background .3s, border-color .3s; }
.xd-nt-acks span { display: flex; flex-direction: column; min-width: 0; }
.xd-nt-acks b { font-size: 13px; } .xd-nt-acks small { font-size: 11px; color: var(--muted); }
.xd-nt-acks em { font-style: normal; font-size: 11px; font-weight: 700; border-radius: 999px; padding: 2px 8px; white-space: nowrap; }
.xd-nt-open { background: #FFF1C2; color: #7A5200; }
.xd-nt-ok { background: #DDF2E7; color: var(--green); display: none; }
.xd-nt-acks li.done { background: #F4FBF7; border-color: #9FD3B8; }
.xd-nt-acks li.done .xd-nt-open { display: none; } .xd-nt-acks li.done .xd-nt-ok { display: inline; }
.xd-op-note { margin: 0; display: flex; gap: 8px; align-items: center; font-size: 13px; background: #F4FBF7; border: 1px solid #9FD3B8; border-radius: 8px; padding: 6px 10px; }
.xd-op-note span { font: 700 12px var(--display); color: var(--green); }
.xd[data-demo="notice"] .xd-toast { bottom: 70px; }
@keyframes xdnt { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .xd-nt-banner { animation: none; } }