/* =====================================================================
   BUILD 181 — the ONE toast (assets/js/toast.js: window.oxToast). It is the card the new-mail pop-up always used (BUILD 167/168), now shared by every message on the
   site: saved / failed after a form, completing a task or a bug, Undo, syncing, Warden's "Sending in 5...", the Calendar, Sticky Notes, the Task Board.
   Loaded in the <head> of every page (layout/header.php) — for everybody, signed in or not — and uses only the theme variables from rampart-theme.css, so the dark and
   the light theme both work. It sits in the lower right corner, above the bar along the bottom of the page (--ox-appbar-h, from appbar.css).
   ===================================================================== */
.ox-toasts{position:fixed;right:16px;bottom:calc(var(--ox-appbar-h,0px) + 14px);z-index:99990;display:flex;flex-direction:column;align-items:flex-end;gap:8px;width:min(400px,calc(100vw - 32px));pointer-events:none}
.ox-toasts:empty{display:none}
.ox-toast{--ox-tk:var(--blue);pointer-events:auto;box-sizing:border-box;width:100%;display:flex;align-items:center;gap:12px;padding:11px 8px 11px 14px;background:var(--card);color:var(--text);border:1px solid var(--line);border-left:4px solid var(--ox-tk);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.45);font-size:13.5px;animation:ox-toast-in .22s ease-out}
.ox-toast-success{--ox-tk:#34a853}
.ox-toast-error{--ox-tk:var(--danger-fg,#e5534b)}
.ox-toast-warn{--ox-tk:#f9ab00}
.ox-toast-info,.ox-toast-mail{--ox-tk:var(--blue)}
.ox-toast-out{opacity:0;transform:translateY(6px);transition:opacity .18s ease,transform .18s ease}
@keyframes ox-toast-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ox-toast-ic{flex:none;display:inline-grid;place-items:center;width:22px;height:22px;color:var(--ox-tk)}
.ox-toast-mail .ox-toast-ic{color:var(--link)}
.ox-toast-b{flex:1 1 auto;min-width:0;line-height:1.35}
.ox-toast-t{font-size:13.5px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ox-toast-s{font-size:13px;color:var(--text-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ox-toast-s b{color:var(--text);font-weight:700}
.ox-toast-t + .ox-toast-s{margin-top:1px}
.ox-toast-s.ox-toast-wrap{color:var(--text);white-space:normal;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6;line-clamp:6;user-select:text}
.ox-toast-t + .ox-toast-s.ox-toast-wrap{color:var(--text-soft)}
.ox-toast-m{margin-top:1px;font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ox-toast-n{display:inline-block;margin-left:6px;padding:0 6px;border-radius:9px;background:var(--btn-bg-h);color:var(--muted);font-size:11px;font-weight:700;line-height:17px;vertical-align:1px}
.ox-toast-go{flex:none;padding:5px 11px;border:0;border-radius:7px;background:var(--accent-wash);color:var(--link);font:inherit;font-size:12.5px;font-weight:700;text-decoration:none;white-space:nowrap;cursor:pointer}
.ox-toast-go:hover{background:var(--hover-row);text-decoration:none}
.ox-toast-x{flex:none;width:26px;height:26px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted);font-size:18px;line-height:1;cursor:pointer}
.ox-toast-x:hover{background:var(--btn-bg-h);color:var(--text)}
.ox-toast-go:focus-visible,.ox-toast-x:focus-visible{outline:2px solid var(--blue);outline-offset:1px}
/* a note that is still working shows a spinner instead of its icon */
.ox-toast-spin{width:16px;height:16px;border:2px solid var(--line);border-top-color:var(--ox-tk);border-radius:50%;animation:ox-toast-spin .75s linear infinite}
@keyframes ox-toast-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ox-toast{animation:none}.ox-toast-out{transition:none}.ox-toast-spin{animation-duration:2.4s}}
@media (max-width:520px){.ox-toasts{right:12px;left:12px;width:auto}}
@media print{.ox-toasts{display:none !important}}

