/* Requests — inbox + chat thread (public/views/requests.js) */

.rq-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 14px;border-bottom:1px solid var(--mist)}
.rq-filters button{display:inline-flex;align-items:center;gap:6px}
.rq-count{font:600 10.5px var(--font-h);background:var(--mist-2);color:var(--slate-2);border-radius:999px;padding:1px 6px;min-width:18px;text-align:center}
.rq-filters button.active .rq-count{background:rgba(255,255,255,.25);color:#fff}

.rq-list{padding:0 14px}
.rq-row{align-items:center;gap:12px;padding:12px 0}
.rq-row:focus-visible{outline:2px solid var(--blue);outline-offset:-2px;border-radius:6px}
.rq-status{flex:0 0 88px}
.rq-status .pill{width:100%;justify-content:center}
.rq-main{flex:1;min-width:0}
.rq-main .rt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rq-main .meta{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:11.5px;color:var(--slate);margin-top:3px}
.rq-side{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.rq-comments{font:600 12px var(--font-b);color:var(--slate-2);white-space:nowrap}
.rq-row.st-working .rt{color:var(--blue-press)}
.rq-row.st-queued .rt::after{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--amber);margin-left:6px;vertical-align:middle}
.rq-empty{padding:28px 10px;text-align:center}
.rq-empty p{margin-bottom:12px}
.rq-how{margin-top:12px}
.rq-how summary{cursor:pointer}

/* "what happens next" one-liner under the header */
.rq-next{font-size:13px;padding:9px 14px;border-radius:8px;margin-bottom:14px;border:1px solid var(--mist);background:#fff;color:var(--slate-2)}
.rq-next.queued{background:var(--amber-bg);border-color:transparent;color:var(--amber)}
.rq-next.working{background:var(--ice);border-color:var(--blue-100);color:var(--blue-press)}
.rq-next.failed{background:var(--red-bg);border-color:transparent;color:var(--red)}
.rq-next.answered{background:var(--green-bg);border-color:transparent;color:var(--green)}

/* chat bubbles */
.thread.chat{display:flex;flex-direction:column;gap:10px;max-width:960px}
.thread.chat .bub{max-width:min(92%,820px);border-radius:14px;padding:12px 16px;border:1px solid var(--mist);background:#fff;box-shadow:var(--shadow)}
.thread.chat .bub.me{align-self:flex-end;background:var(--ice);border-color:var(--blue-100);border-bottom-right-radius:4px}
.thread.chat .bub.them{align-self:flex-start;border-bottom-left-radius:4px}
.thread.chat .who{font:600 11.5px var(--font-h);color:var(--slate);margin-bottom:6px;display:flex;align-items:center;gap:6px}
.thread.chat .bub.me .who{justify-content:flex-end;color:var(--blue-press)}
.thread.chat .avatar{width:20px;height:20px;border-radius:50%;background:var(--navy);display:inline-flex;align-items:center;justify-content:center;font-size:11px}
.thread.chat .md{font-size:14px}
.thread.chat .md>:first-child{margin-top:0}
.thread.chat .md>:last-child{margin-bottom:0}
.thread.chat .md h1{font-size:18px;margin-bottom:10px}
.thread.chat .md h2{font-size:15px;margin:16px 0 8px}
.thread.chat .md table{font-size:12.5px}
.thread.chat .typing .dots{display:inline-flex;gap:4px;margin:2px 0 4px}
.thread.chat .typing .dots i{width:7px;height:7px;border-radius:50%;background:var(--steel);animation:rq-blink 1.2s infinite}
.thread.chat .typing .dots i:nth-child(2){animation-delay:.2s}.thread.chat .typing .dots i:nth-child(3){animation-delay:.4s}
@keyframes rq-blink{0%,80%,100%{opacity:.25}40%{opacity:1}}

/* reply box: always reachable — sticky above the tab bar on phones */
.reply-box{margin-top:14px;max-width:960px}
.reply-box textarea{min-height:88px}
@media(max-width:700px){
  .rq-status{flex-basis:auto}
  .rq-row{flex-wrap:wrap;gap:6px 10px}
  .rq-main{flex-basis:calc(100% - 100px)}
  .rq-side{flex-direction:row;gap:8px;width:100%;justify-content:flex-end}
  .rq-filters{width:100%}
  .rq-filters button{flex:1 1 auto;justify-content:center;padding:9px 6px}
  .thread.chat .bub{max-width:96%}
  .reply-box{position:sticky;bottom:calc(66px + env(safe-area-inset-bottom));z-index:5;box-shadow:0 -6px 18px rgba(20,24,31,.08)}
  .reply-box textarea{min-height:64px}
  .reply-box .row .btn{flex:1}
}
