/* W3 Pages: the Ask agent panel, Page blocks (checklist, table, reference
   cards), the insertion menu and the table toolbar. Builds on
   design-foundation.css tokens and library-docs.css; nothing here restyles
   shared components. Grays are untinted; color only marks meaning. */

/* Toolbar additions. */
.lib-doc-tools .btn.small { display:inline-flex; align-items:center; gap:6px; }
.lib-doc-tools .btn.small svg { width:15px; height:15px; }
.lib-doc-tools .icon-only { width:32px; padding:0; justify-content:center; }
.lib-doc-tablebar { display:flex; flex-wrap:wrap; gap:6px; }
.lib-doc-tablebar[hidden] { display:none; }

/* Checklist. */
.lib-doc-prose ul[data-type="taskList"] { list-style:none; padding-left:2px; }
.lib-doc-prose ul[data-type="taskList"] li { display:flex; align-items:flex-start; gap:var(--space-2); }
.lib-doc-prose ul[data-type="taskList"] li > label { flex:none; margin-top:.28em; }
.lib-doc-prose ul[data-type="taskList"] li > label input { width:16px; height:16px; margin:0; accent-color:var(--ink); cursor:pointer; }
.lib-doc-prose ul[data-type="taskList"] li > div { flex:1; min-width:0; }
.lib-doc-prose ul[data-type="taskList"] li[data-checked="true"] > div { color:var(--ink-3); text-decoration:line-through; }

/* Table. */
.lib-doc-prose .tableWrapper { overflow-x:auto; margin:.8em 0; }
.lib-doc-prose table { border-collapse:collapse; width:100%; table-layout:fixed; font-size:var(--text-lg); }
.lib-doc-prose th, .lib-doc-prose td { border:1px solid var(--line-2); padding:6px 10px; vertical-align:top; min-width:80px; position:relative; }
.lib-doc-prose th { background:var(--quiet); font-weight:600; text-align:left; }
.lib-doc-prose td > p, .lib-doc-prose th > p { margin:0; }
.lib-doc-prose .selectedCell::after { content:''; position:absolute; inset:0; background:var(--hover); pointer-events:none; }

/* Reference cards: a Library item or a Project, resolved for each reader. */
.lib-ref-card { display:flex; align-items:center; gap:10px; margin:.6em 0; padding:10px 12px; border:1px solid var(--line-2); border-radius:10px; background:var(--panel); user-select:none; }
.lib-ref-card.ProseMirror-selectednode { outline:2px solid var(--ink); outline-offset:1px; }
.lib-ref-title { font-weight:600; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lib-ref-meta { color:var(--ink-3); font-size:var(--text-sm); white-space:nowrap; }
.lib-ref-open { margin-left:auto; flex:none; }
.lib-ref-card.unavailable .lib-ref-title { color:var(--ink-3); font-weight:500; }
.lib-ref-picker { display:flex; flex-direction:column; gap:10px; }
.lib-ref-results { list-style:none; margin:0; padding:0; max-height:46vh; overflow:auto; }
.lib-ref-row { display:flex; flex-direction:column; align-items:flex-start; gap:2px; width:100%; padding:8px 10px; border:0; border-radius:8px; background:transparent; color:var(--ink); font:inherit; text-align:left; cursor:pointer; }
.lib-ref-row.active, .lib-ref-row:hover { background:var(--hover); }

/* The insertion menu reuses the @ menu; it can be taller. */
.lib-insert-menu { max-height:min(360px, 60vh); overflow:auto; }

/* The floating selection actions for read-only readers. */
.lib-doc-comment-float { display:flex; gap:6px; }

/* The side panel's tabs: three short labels on one line. */
.lib-review-tabs button { white-space:nowrap; padding:8px; }

/* Ask agent panel. */
.pg-ask { display:flex; flex-direction:column; gap:10px; min-height:0; }
.pg-ask-head { display:flex; align-items:center; gap:var(--space-2); flex-wrap:wrap; }
.pg-ask-agent { flex:1; min-width:0; }
.pg-ask-agent select { width:100%; max-width:260px; height:var(--control-h); padding:0 8px; border:1px solid var(--line-2); border-radius:8px; background:var(--quiet); color:var(--ink); font:inherit; font-size:var(--text-md); }
.pg-ask-model { min-width:0; }
.pg-ask-scope { display:flex; align-items:center; flex-wrap:wrap; gap:6px; font-size:var(--text-sm); }
.pg-ask-scope strong { min-width:0; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pg-ask-chip { display:inline-flex; align-items:flex-start; gap:var(--space-1); max-width:100%; padding:3px 8px; border-radius:8px; background:var(--quiet); color:var(--ink-2); overflow:hidden; text-overflow:ellipsis; }
.pg-ask-chip.active { background:var(--hover); color:var(--ink); }
.pg-ask-chip-x { padding:0 2px; border:0; background:transparent; color:inherit; font:inherit; cursor:pointer; }
.pg-ask-thread { display:flex; flex-direction:column; gap:10px; max-height:46vh; overflow:auto; }
.pg-ask-empty { margin:0; }
.pg-ask-msg { display:flex; flex-direction:column; gap:2px; }
.pg-ask-msg.user { align-items:flex-end; }
.pg-ask-who { color:var(--ink-3); font-size:var(--text-xs); }
.pg-ask-bubble { max-width:100%; padding:8px 10px; border-radius:10px; font-size:var(--text-md); overflow-wrap:anywhere; }
.pg-ask-msg.user .pg-ask-bubble { background:var(--quiet); white-space:pre-wrap; }
.pg-ask-msg.agent .pg-ask-bubble { padding-left:0; padding-right:0; }
.pg-ask-status { color:var(--ink-2); font-size:var(--text-sm); }
.pg-ask-status[hidden] { display:none; }
.pg-ask-composer { display:flex; flex-direction:column; gap:6px; }
.pg-ask-composer textarea { width:100%; min-height:72px; padding:8px 10px; border:1px solid var(--line-2); border-radius:9px; background:var(--quiet); color:var(--ink); font:inherit; font-size:var(--text-md); resize:vertical; }
.pg-ask-actions { display:flex; align-items:center; justify-content:flex-end; gap:var(--space-2); }
.pg-ask-actions .linklike { margin-right:auto; }
.pg-ask-actions [hidden] { display:none; }

/* Runs started from the Page, inside a comment thread. */
.lib-run-state { font-weight:500; }
.lib-run-state.running, .lib-run-state.queued { color:var(--amber); }
.lib-run-state.done { color:var(--green); }
.lib-run-state.failed { color:var(--red); }

@media (max-width: 600px) {
  .lib-doc-tools { flex-wrap:wrap; }
  .lib-doc-tools .btn.small span { display:none; }
  .lib-doc-tools .btn.small { width:34px; padding:0; justify-content:center; }
  .lib-doc-tools .btn.small[data-doc-versions] { width:auto; padding:0 10px; }
  .lib-ref-card { flex-wrap:wrap; }
  .lib-ref-open { margin-left:0; }
  .pg-ask-thread { max-height:none; }
}