/* ═══════════════ e'thix AI — «الأدوات القانونية»: the hub sheet, its cards, and the reports viewer (+ its print sheet) ═══════════════
   Loaded after agent-live.css: the job view inside the hub is the agent's own (.agl-job), drawn by E.agentLive, and keeps
   its styles. Mobile first: one column of cards up to 560px, then as many 240px+ columns as the sheet holds.
   Small text uses the same ink/muted mixes as agent-live.css so it keeps 4.5:1 on the sheet. */

.tools-sheet .sheet-body.th{display:grid;gap:14px;align-content:start}
.th-list{display:grid;gap:16px}
.th-intro{font-size:14px;line-height:1.7;color:var(--ink-soft);margin:0}
.th-muted{color:color-mix(in srgb,var(--muted) 60%,var(--ink));font-size:12.5px;margin:0}

/* the consultation picker */
.th-pick{display:grid;gap:6px;padding:12px;border-radius:14px;background:color-mix(in srgb,var(--ink) 4%,transparent);border:1px solid var(--line)}
.th-pick.is-empty{gap:10px;justify-items:start}
.th-pick.is-empty p{margin:0;font-size:14px;line-height:1.7;color:var(--ink)}
.th-pick-label{font-size:12.5px;font-weight:700;color:var(--ink-soft)}
.th-select{width:100%;min-height:44px}
.th-notice{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,#C79A2E 12%,transparent);color:var(--ink);font-size:13px}
.th-notice p{margin:0}

/* the cards */
.th-grid{display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:560px){.th-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}}
.th-card{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line);min-width:0}
.th-top{display:flex;align-items:center;gap:10px}
.th-ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;flex:none;background:color-mix(in srgb,#7488A8 12%,transparent);color:#56667F}
html[data-theme="dark"] .th-ic{color:#B7C6DD}
.th-ic .i{width:18px;height:18px}
.th-title{flex:1;min-width:0;margin:0;font-size:15px;font-weight:700;color:var(--ink);line-height:1.4}
.th-soon{flex:none;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:color-mix(in srgb,#C79A2E 16%,transparent);color:color-mix(in srgb,#8A6412 80%,var(--ink))}
html[data-theme="dark"] .th-soon{color:#E8C877}
.th-desc{margin:0;font-size:13.5px;line-height:1.7;color:var(--ink-soft)}
.th-needs,.th-checks{margin:0;font-size:12.5px;line-height:1.6;color:color-mix(in srgb,var(--muted) 55%,var(--ink))}
.th-needs b{color:var(--ink);font-weight:700}
.th-foot{margin-top:auto;display:grid;gap:6px;justify-items:start}
.th-why{margin:0;font-size:12.5px;line-height:1.6;color:color-mix(in srgb,var(--muted) 55%,var(--ink))}
.th-err{margin:0;font-size:12.5px;line-height:1.6;color:color-mix(in srgb,var(--danger) 80%,var(--ink))}
.th-go{min-height:40px}
/* a card that cannot start stays a focusable button (its reason is its description); it only looks disabled */
.th-go[aria-disabled="true"]{opacity:.55;cursor:default;filter:saturate(.3)}

/* the documents a card reads */
.th-docs{border:0;margin:0;padding:0;display:grid;gap:4px}
.th-docs legend{padding:0;margin-bottom:4px;font-size:12px;font-weight:700;color:var(--ink-soft)}
.th-doc{display:flex;align-items:center;gap:8px;min-height:36px;padding:4px 6px;border-radius:9px;font-size:13px;color:var(--ink);cursor:pointer}
.th-doc input{width:18px;height:18px;flex:none;margin:0;accent-color:var(--accent-b)}
.th-doc:has(input:disabled){cursor:default;opacity:.7}
.th-doc:has(input:focus-visible){outline:2px solid var(--gold-deep);outline-offset:1px}
.th-docname{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover:hover){.th-doc:not(:has(input:disabled)):hover{background:color-mix(in srgb,var(--ink) 5%,transparent)}}

/* recent results */
.th-recent.is-empty{display:none}
.th-recent{display:grid;gap:8px}
.th-h{margin:0;font-size:14.5px;font-weight:700;color:var(--ink)}
.th-rlist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.th-ritem{display:flex;align-items:center;gap:10px;justify-content:space-between;padding:8px 10px;border-radius:12px;border:1px solid var(--line);background:var(--surface)}
.th-rtxt{display:grid;gap:2px;min-width:0}
.th-rtxt b{font-size:13.5px;color:var(--ink)}
.th-rtxt small{font-size:12px;color:color-mix(in srgb,var(--muted) 55%,var(--ink))}
.th-draft{margin:0;font-size:12px;line-height:1.6;color:color-mix(in srgb,var(--muted) 55%,var(--ink))}

/* the bar above a job or a report */
.th-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:space-between}
.th-run{display:grid;gap:14px}

/* ─── the reports viewer ─── */
.rv{display:grid;gap:14px}
.rv-tools{display:flex;flex-wrap:wrap;gap:6px}
.rv-doc{display:grid;gap:14px;padding:18px clamp(14px,3vw,28px);border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.rv-head{display:grid;gap:4px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.rv-kind{margin:0;font-size:12px;font-weight:700;letter-spacing:.02em;color:color-mix(in srgb,var(--muted) 55%,var(--ink))}
.rv-title{margin:0;font-size:clamp(18px,4.6vw,22px);line-height:1.45;font-weight:800;color:var(--ink)}
.rv-title:focus{outline:none}
.rv-when{font-size:12.5px;color:color-mix(in srgb,var(--muted) 55%,var(--ink))}
/* long-form Arabic reads best a little larger and with more leading than chat bubbles */
.rv-body{font-size:15px;line-height:1.95;color:var(--ink);overflow-wrap:anywhere}
.rv-body h1,.rv-body h2{font-size:17px;margin:18px 0 6px}
.rv-body h3{font-size:15.5px;margin:14px 0 6px}
.rv-body .md-table{overflow-x:auto}
.rv-body table{border-collapse:collapse;width:100%;font-size:13.5px}
.rv-body th,.rv-body td{border:1px solid var(--line);padding:6px 8px;text-align:start;vertical-align:top}
.rv-body th{background:color-mix(in srgb,var(--ink) 5%,transparent)}
.rv-sources{display:grid;gap:8px;padding-top:10px;border-top:1px solid var(--line)}
.rv-sources h3{margin:0;font-size:14px;font-weight:700;color:var(--ink)}
.rv-slist{margin:0;padding-inline-start:22px;display:grid;gap:6px}
.rv-src{font-size:13.5px;line-height:1.6;color:var(--ink)}
.rv-src .i{width:14px;height:14px;margin-inline-end:6px;vertical-align:-2px;color:#56667F}
html[data-theme="dark"] .rv-src .i{color:#B7C6DD}
.rv-draft{margin:0;font-size:12px;line-height:1.6;color:color-mix(in srgb,var(--muted) 55%,var(--ink))}
/* C21: a letter or a contract review is a draft no lawyer has approved yet — said on it (and printed with it) */
.rv-pending{display:inline-flex;align-items:center;gap:6px;justify-self:start;margin:2px 0 0;padding:3px 10px;border-radius:999px;font-size:12.5px;font-weight:700;color:var(--gold-text,var(--ink));background:color-mix(in srgb,var(--gold,#c9a227) 16%,transparent);border:1px solid color-mix(in srgb,var(--gold,#c9a227) 45%,var(--line))}
.rv-pending .i{width:14px;height:14px;flex:none}
.rv-src .dv-link{margin-inline-start:2px}
.rv-others{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.rv-others h3{width:100%;margin:0;font-size:13.5px;font-weight:700;color:var(--ink)}

@media (max-width:420px){
  .th-card{padding:12px}
  .rv-tools .b{flex:1 1 auto;justify-content:center}
  .rv-doc{padding:14px 12px}
}

/* ─── print: the report alone, black on white, on A4 ─── */
.rv-print-root{display:none}
@media print{
  html.rv-printing body > *:not(.rv-print-root){display:none !important}
  html.rv-printing .rv-print-root{display:block}
  html.rv-printing,html.rv-printing body{background:#fff !important;color:#000 !important}
  .rv-print-root .rv-doc{border:0;padding:0;background:#fff;color:#000}
  .rv-print-root .rv-title{font-size:20pt;color:#000}
  .rv-print-root .rv-kind,.rv-print-root .rv-when,.rv-print-root .rv-draft{color:#333}
  .rv-print-root .rv-body{font-size:12pt;line-height:1.8;color:#000}
  .rv-print-root .rv-body th,.rv-print-root .rv-body td{border-color:#999}
  .rv-print-root .rv-src,.rv-print-root .rv-sources h3{color:#000}
  .rv-print-root table,.rv-print-root tr,.rv-print-root li{break-inside:avoid}
  @page{size:A4;margin:18mm 16mm}
}

/* the case file's way in (casefile.js toolsSection) */