/* Emerald OS: undo, Revert from History, and the tile pills' icons and priority colours.
   Loaded last. Posters stay dark in the light theme (theme-light.css), so pills on a tile use
   one set of colours; the 40K View cards and History follow the page's theme. */

/* ---- pills on the popup's tile and the Board view tiles (projects.js pmPill) ---- */
.pm-chip:is(.st, .prio, .late, .due) { gap: 6px; }
.pm-chip-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--sc); }
.pm-chip-ic { flex: none; width: 13px; height: 13px; }

/* priority: text, border and a soft tint in its colour */
.pm-chip.prio-urgent { border-color: rgba(255, 107, 107, .7); background: rgba(255, 107, 107, .14); color: #ff6b6b; }
.pm-chip.prio-blocking { border-color: rgba(255, 181, 71, .7); background: rgba(255, 181, 71, .14); color: #ffb547; }
.pm-chip.prio-waiting { border-color: rgba(154, 163, 178, .6); background: rgba(154, 163, 178, .12); color: #9aa3b2; }
.pm-chip.prio-other { border-color: rgba(255, 210, 122, .65); background: rgba(255, 210, 122, .12); color: #ffd27a; }

/* Overdue: a red clock on a red-tinted pill (instead of the solid red one) */
.pm-chip.late { border-color: rgba(255, 107, 107, .7); background: rgba(255, 107, 107, .14); color: #ff6b6b; }

/* ---- the priority line on 40K View cards ---- */
.pm-flag { display: flex; align-items: center; gap: 5px; }
.pm-flag .pm-chip-ic { width: 12px; height: 12px; }
.pm-flag.prio-urgent { color: #ff6b6b; }
.pm-flag.prio-blocking { color: #ffb547; }
.pm-flag.prio-waiting { color: #9aa3b2; }
.pm-flag.prio-other { color: #ffd27a; }
html[data-theme="light"] .pm-flag.prio-urgent { color: #c93c3c; }
html[data-theme="light"] .pm-flag.prio-blocking { color: #b86e00; }
html[data-theme="light"] .pm-flag.prio-waiting { color: #5f6673; }
html[data-theme="light"] .pm-flag.prio-other { color: #9a6700; }

/* ---- Revert on a History line ---- */
.pm-history-list li .pm-revert { flex: none; align-self: center; height: 24px; margin-left: 2px; padding: 0 10px; border: 1px solid var(--line); border-radius: 999px; background: transparent; color: var(--muted); font: inherit; font-size: 12px; font-weight: 600; line-height: 22px; cursor: pointer; }
.pm-history-list li .pm-revert:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.pm-history-list li .pm-revert:disabled { opacity: .5; cursor: default; }
@media (hover: hover) { .pm-history-list li .pm-revert:not(:disabled):hover { border-color: var(--accent); color: var(--accent); } }
html[data-theme="light"] .pm-history-list li .pm-revert { border-color: rgba(15, 23, 42, .18); color: #4b5563; }
@media (hover: hover) { html[data-theme="light"] .pm-history-list li .pm-revert:not(:disabled):hover { border-color: var(--accent); color: var(--accent); } }

/* the notice: the words shorten with … and the Undo button always shows (phones too) */
.toast.has-action { display: flex; align-items: center; gap: 4px; }
.toast-msg { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.toast .toast-act { flex: none; }
dialog .toast { position: fixed; } /* inside an open popup it still sits at the bottom of the screen */