/* A reply that didn't come: a quiet line, never a bubble. See pal-failures.js. */
body.pal-experience{--pal-failure-mark:#b9821c}
html[data-theme=dark] body.pal-experience,body.pal-experience[data-theme=dark]{--pal-failure-mark:#e8bd68}

/* Under the owner's message it belongs to, tucked into the thread's gap. */
.pal-failure{align-self:flex-end;display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:2px 6px;max-width:82%;margin-top:-18px;font-size:12px;line-height:1.45;color:var(--pal-muted)}
.pal-failure .pal-failure-mark{width:14px;height:14px;color:var(--pal-failure-mark)}
.pal-failure-words{min-width:0;overflow-wrap:anywhere}
.pal-failure.is-legacy{padding:0;background:none}
.pal-failure-retry{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;margin:-4px -4px -4px 0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--pal-ink);cursor:pointer}
.pal-failure-retry:hover{background:var(--pal-soft)}.pal-failure-retry .pal-icon{width:15px;height:15px}
.pal-failure-action{border:0;background:transparent;padding:2px 4px;margin:-2px 0;border-radius:6px;color:var(--pal-ink);font:600 12px/1.4 'Nunito Sans',sans-serif;cursor:pointer;text-decoration:underline;text-decoration-color:color-mix(in srgb,currentColor 35%,transparent);text-underline-offset:3px}
.pal-failure-action:hover{background:var(--pal-soft)}
.pal-failure [aria-busy=true],.pal-outage [aria-busy=true],.pal-regenerate[aria-busy=true]{opacity:.55;cursor:default}
.pal-failure-retry[aria-busy=true] .pal-icon{animation:pal-failure-turn .9s linear infinite}
@keyframes pal-failure-turn{to{transform:rotate(360deg)}}

/* One status for an outage, above the composer, instead of a line per message. */
.pal-outage{display:flex;align-items:center;gap:9px;margin:10px max(30px,calc((100% - var(--pal-column,840px))/2)) -2px;padding:8px 8px 8px 13px;border:1px solid var(--pal-line);border-radius:14px;background:var(--pal-soft);color:var(--pal-ink);font-size:13px;line-height:1.45;flex-shrink:0}
.pal-outage[hidden]{display:none}
.pal-outage .pal-failure-mark{width:16px;height:16px;color:var(--pal-failure-mark)}
.pal-outage-words{flex:1;min-width:0}
.pal-outage-actions{display:flex;align-items:center;gap:4px;flex-shrink:0}
.pal-outage-retry,.pal-outage .pal-failure-action{border:1px solid var(--pal-line);background:var(--pal-paper);color:var(--pal-ink);border-radius:9px;padding:5px 11px;margin:0;font:600 12px/1.3 'Nunito Sans',sans-serif;text-decoration:none;cursor:pointer}
.pal-outage-retry:hover,.pal-outage .pal-failure-action:hover{border-color:color-mix(in srgb,var(--pal-muted) 50%,var(--pal-line))}

/* Try again on the latest reply, and the earlier answer it replaced, folded. */
.pal-regenerate{display:inline-flex;align-items:center;gap:6px;margin:6px 0 0 4px;padding:3px 8px 3px 6px;border:0;border-radius:8px;background:transparent;color:var(--pal-muted);font:500 12px/1.3 'Nunito Sans',sans-serif;cursor:pointer}
.pal-regenerate:hover{background:var(--pal-soft);color:var(--pal-ink)}.pal-regenerate .pal-icon{width:13px;height:13px}
.pal-message.is-superseded:not(.is-open)>:not(.pal-superseded-toggle){display:none}
.pal-message.is-superseded.is-open>:not(.pal-superseded-toggle){opacity:.6}
.pal-superseded-toggle{display:inline-flex;align-items:center;gap:4px;margin-left:2px;padding:2px 7px 2px 3px;border:0;border-radius:7px;background:transparent;color:var(--pal-muted);font:500 12px/1.3 'Nunito Sans',sans-serif;cursor:pointer}
.pal-superseded-toggle:hover{background:var(--pal-soft);color:var(--pal-ink)}
.pal-superseded-toggle .pal-icon{width:12px;height:12px;transition:transform .15s}
.pal-message.is-open>.pal-superseded-toggle{margin-bottom:6px}.pal-message.is-open>.pal-superseded-toggle .pal-icon{transform:rotate(90deg)}

@media(prefers-reduced-motion:reduce){.pal-failure-retry[aria-busy=true] .pal-icon{animation:none}.pal-superseded-toggle .pal-icon{transition:none}}
@media(max-width:1100px){.pal-outage{margin:10px 25px -2px}}
@media(max-width:900px){.pal-failure{max-width:88%}}
@media(max-width:600px){.pal-failure{margin-top:-16px;max-width:94%}.pal-outage{margin:8px 12px 0;flex-wrap:wrap;padding:8px 10px}.pal-outage-words{flex-basis:calc(100% - 30px)}.pal-outage-actions{margin-left:auto}}
