/* Text and distinct symbols carry status as well as color. */
.event-alert[data-tone],.event-log-row[data-tone]{--notification-accent:#a4b4c5;--notification-wash:#a4b4c51a}
.event-alert[data-tone=confirmed],.event-log-row[data-tone=confirmed]{--notification-accent:#66e1a0;--notification-wash:#66e1a018}
.event-alert[data-tone=blocked],.event-log-row[data-tone=blocked]{--notification-accent:#ffbc66;--notification-wash:#ffbc661a}
.event-alert[data-tone=rejected],.event-log-row[data-tone=rejected]{--notification-accent:#ff8996;--notification-wash:#ff89961a}
.event-alert[data-tone=entered],.event-log-row[data-tone=entered]{--notification-accent:#85c7ff;--notification-wash:#85c7ff1a}
.event-alert[data-status]{border-color:var(--notification-accent);border-inline-start-width:4px}
.event-alert[data-status] .event-alert-icon{color:var(--notification-accent);background:var(--notification-wash);border-radius:50%;font-weight:700}
.event-alert[data-status] strong{color:var(--text)}
.notification-status-badge{display:inline-block;width:fit-content;margin-block-end:5px;padding:2px 8px;border:1px solid currentColor;border-radius:5px;color:var(--notification-accent);background:var(--notification-wash);font-size:10px;font-weight:650;line-height:1.8;letter-spacing:0;vertical-align:middle}
.event-log-row[data-status]{border-inline-start:2px solid var(--notification-accent)}
.event-log-row .notification-status-badge{display:table;margin-block-end:4px}
html[data-theme=light] .event-alert[data-tone=confirmed],html[data-theme=light] .event-log-row[data-tone=confirmed]{--notification-accent:#146936;--notification-wash:#1469360d}
html[data-theme=light] .event-alert[data-tone=blocked],html[data-theme=light] .event-log-row[data-tone=blocked]{--notification-accent:#8f4903;--notification-wash:#8f49030d}
html[data-theme=light] .event-alert[data-tone=rejected],html[data-theme=light] .event-log-row[data-tone=rejected]{--notification-accent:#a32e43;--notification-wash:#a32e430d}
html[data-theme=light] .event-alert[data-tone=entered],html[data-theme=light] .event-log-row[data-tone=entered]{--notification-accent:#225e9d;--notification-wash:#225e9d0d}
/* Oldest at the top, newest at the bottom. The stack grows upward. */
.event-alert-stack{position:fixed;z-index:100;inset-inline-end:24px;bottom:24px;display:flex;flex-direction:column;gap:8px;width:min(380px,calc(100vw - 32px));max-height:calc(100dvh - 90px);overflow-y:auto;overflow-x:hidden;padding:6px;pointer-events:none;scrollbar-width:thin;overscroll-behavior:contain}
.event-alert-stack[hidden]{display:none}
.event-alert-stack .event-alert{position:relative;inset:auto;bottom:auto;max-width:none;width:100%;padding:0;display:flex;flex-shrink:0;align-items:flex-start;gap:0;pointer-events:auto;isolation:isolate;opacity:1}
.event-alert-open{flex:1;min-width:0;display:flex;align-items:flex-start;gap:10px;padding:12px 4px 12px 12px;border:0;background:none;color:inherit;text-align:start;font:inherit;border-radius:inherit;cursor:pointer}
.event-alert-stack .event-alert-icon{flex-shrink:0;margin-top:1px;inline-size:24px;block-size:24px;font-size:17px}
.event-alert-copy{display:grid;gap:2px;min-width:0}
.event-alert-copy strong{font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.event-alert-copy>span{font-size:11px;line-height:1.55;color:var(--muted);overflow-wrap:anywhere}
.event-alert-copy .event-alert-state{color:var(--notification-accent);font-weight:600}
.event-alert-copy .event-alert-reason{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.event-alert-copy .event-alert-reason[hidden]{display:none}
.event-alert-meta{color:var(--muted);font-size:9px;line-height:1.6;opacity:.8}
.event-alert-dismiss{flex-shrink:0;align-self:flex-start;width:28px;height:28px;margin:4px 3px 0 0;padding:0;background:none;border:0;color:var(--muted);font-size:19px;line-height:1;cursor:pointer;border-radius:6px}
.event-alert-open:focus-visible,.event-alert-dismiss:focus-visible{outline:2px solid var(--notification-accent,var(--cyan));outline-offset:-3px}
.event-alert-pending{flex-shrink:0;align-self:flex-end;max-width:100%;padding:6px 12px;border:1px solid var(--line);border-radius:20px;background:var(--raised);color:var(--muted);font-size:11px;pointer-events:auto}
.event-alert-pending[hidden]{display:none}
.event-alert-stack .event-alert-fade{opacity:0;transition:opacity 3s linear}
@media(max-width:780px){.event-alert-stack{inset-inline-end:10px;bottom:10px;width:calc(100vw - 20px);max-height:calc(100dvh - 70px)}.event-alert-open{padding:12px 6px 12px 12px;gap:9px}.event-alert-stack .event-alert-icon{inline-size:28px;block-size:28px;font-size:20px}}
@media(hover:hover) and (pointer:fine){.event-alert-open:hover{background:var(--notification-wash)}.event-alert-dismiss:hover{background:var(--notification-wash);color:var(--text)}}
@media(prefers-reduced-motion:reduce){.event-alert-stack .event-alert{transform:none!important}}
