/* stockroom -- the assistant sheet (openAssistant(), web/js/assistant.js).
   Scoped under .asst / .asst-composer so nothing here leaks into any other
   sheet or view. */

.asst { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.asst-list { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px;
             padding: 2px 2px 8px; -webkit-overflow-scrolling: touch; }
.asst-list .empty { margin: auto 0; }

.msg { display: flex; }
.msg.user { justify-content: flex-end; }
.msg.asst, .msg.err { justify-content: flex-start; }

.bubble { max-width: 84%; padding: 10px 13px; border-radius: 16px; font-size: 14.5px; line-height: 1.42;
          white-space: pre-wrap; overflow-wrap: anywhere; }
.bubble.user { background: var(--brand); color: #fff; border-bottom-right-radius: 5px; }
.bubble.asst { background: var(--card); border: 1px solid var(--line); color: var(--ink);
               border-bottom-left-radius: 5px; }
.bubble.err { background: var(--bad-tint); color: var(--bad); border-bottom-left-radius: 5px; }
.bubble.working { display: inline-flex; align-items: center; gap: 8px; color: var(--muted);
                  background: var(--paper-2); border: 1px solid var(--line); border-bottom-left-radius: 5px; }
.bubble.working::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--brand);
                          animation: asst-pulse 1s ease-in-out infinite; flex: none; }
.bubble a.asst-link { color: inherit; text-decoration: underline; text-underline-offset: 2px; font-weight: 650; }

@keyframes asst-pulse { 0%, 100% { opacity: .35; transform: scale(.8); } 50% { opacity: 1; transform: scale(1); } }

.sheet-foot .asst-composer { flex: 1; display: flex; align-items: flex-end; gap: 8px; }
.asst-input { flex: 1; min-height: 44px; max-height: 160px; resize: none; }
.asst-composer .btn { flex: none; width: 44px; height: 44px; padding: 0; border-radius: 50%; }
.asst-composer .btn .i { width: 20px; height: 20px; }

@media (min-width: 700px) {
  .bubble { max-width: 78%; }
}