/* jev-ask.css — Ask Anywhere + live section chat panels (PR 4).
   BUSY system: mint pills, bold counts, full-color coins, information
   at a glance — on the site-social tokens. AA contrast kept: body
   text on white/navy at full ink, muted text never below the
   --ss-ink-60 tier on light panels. */

.ja-replaced { display: none !important; }

/* ---------- right rail on Learn / Certified (Veterans grid is PR B's) ---------- */
@media (min-width: 1080px) {
  body[data-ss-route="academy"] #page-content,
  body[data-ss-route="certified"] #page-content { position: relative; }
  body[data-ss-route="academy"] .ja-panel,
  body[data-ss-route="certified"] .ja-panel {
    float: right; width: 330px; margin: 0 0 20px 24px;
  }
}

/* ---------- panel ---------- */
.ja-panel {
  background: var(--ss-panel, #fff);
  border: 1px solid var(--ss-line, #d8e2e0);
  border-radius: 16px;
  box-shadow: 0 2px 12px rgba(16, 36, 40, 0.08);
  padding: 14px 16px 16px;
  margin: 0 0 20px;
  min-width: 0;
}
.ja-panel-head { display: flex; align-items: center; gap: 8px; }
.ja-live-dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: #1d9d74; box-shadow: 0 0 0 3px rgba(29, 157, 116, 0.18);
  flex: none;
}
.ja-panel-title { margin: 0; font-size: 16px; font-weight: 800; flex: 1; }
.ja-panel-note { margin: 8px 0 0; }

.ja-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 10px 0 4px; }
.ja-tab {
  border: 1px solid var(--ss-line, #d8e2e0);
  background: #eef4f2; color: #17323a;
  border-radius: 999px; padding: 5px 12px;
  font: inherit; font-size: 13px; font-weight: 700; cursor: pointer;
}
.ja-tab.on { background: var(--ss-mint, #b8ecd9); border-color: #1d9d74; color: #0c3b2e; }

.ja-stream { display: flex; flex-direction: column; gap: 12px; padding: 10px 0 4px; }
.ja-composer-host { border-top: 1px solid var(--ss-line, #d8e2e0); padding-top: 12px; }

.ja-note { color: #43565e; font-size: 13.5px; margin: 4px 0; }
.ja-gate {
  background: #fdf3e3; border: 1px solid #e5c877; color: #5c430a;
  border-radius: 10px; padding: 10px 12px; font-size: 13.5px; font-weight: 600;
}

/* ---------- messages ---------- */
.ja-msg { min-width: 0; }
.ja-msg-link { cursor: pointer; }
.ja-msg-link:hover .ja-msg-title { text-decoration: underline; }
.ja-author { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.ja-avatar {
  width: 26px; height: 26px; border-radius: 50%; flex: none;
  background: #17323a; color: #fff; border: none;
  font: inherit; font-size: 11px; font-weight: 800;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; padding: 0;
}
.ja-avatar.lg { width: 44px; height: 44px; font-size: 16px; cursor: default; }
.ja-avatar:disabled, .ja-name:disabled { cursor: default; opacity: 1; }
.ja-name, .ja-name-link {
  background: none; border: none; padding: 0; cursor: pointer;
  font: inherit; font-size: 14px; font-weight: 800; color: #0f5f4d;
}
.ja-name-link { font-size: inherit; }
.ja-role {
  background: var(--ss-mint, #b8ecd9); color: #0c3b2e;
  border-radius: 999px; padding: 1px 8px; font-size: 11.5px; font-weight: 800;
}
.ja-time { color: #43565e; font-size: 12px; font-weight: 600; }
.ja-msg-title { margin: 3px 0 0; font-weight: 800; font-size: 14.5px; }
.ja-msg-body { margin: 3px 0 0; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.ja-msg-meta { margin: 3px 0 0; color: #43565e; font-size: 12.5px; font-weight: 600; }
.ja-replies { display: inline-block; margin: 4px 0 0; padding: 6px 0; min-height: 24px; font-size: 13px; font-weight: 700; color: var(--ja-link, #3f5236); text-decoration: underline; }
.ja-panel-note[hidden] { display: none; }

/* ---------- forms ---------- */
.ja-form { display: flex; flex-direction: column; gap: 8px; }
.ja-label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 700; }
.ja-input {
  width: 100%; box-sizing: border-box;
  border: 1px solid var(--ss-line, #b9cdc9); border-radius: 10px;
  padding: 9px 11px; font: inherit; font-size: 14px; background: #fff; color: #12262e;
}
.ja-check { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; line-height: 1.4; }
.ja-check input { accent-color: var(--olive, #526547); }
.ja-btn {
  align-self: flex-start;
  background: #17323a; color: #fff; border: 1px solid #17323a;
  border-radius: 999px; padding: 8px 18px;
  font: inherit; font-size: 14px; font-weight: 800; cursor: pointer;
  text-decoration: none; display: inline-block;
}
.ja-btn.primary { background: #0f7a5c; border-color: #0f7a5c; }
.ja-btn:disabled { opacity: 0.55; cursor: default; }
.ja-status { margin: 0; font-size: 13.5px; color: #8c2f1b; min-height: 0; }
.ja-status:empty { display: none; }

/* ---------- Ask ---------- */
.ja-ask-btn {
  background: var(--ss-mint, #b8ecd9); color: #0c3b2e;
  border: 1px solid #1d9d74; border-radius: 999px; padding: 6px 14px;
  font: inherit; font-size: 13.5px; font-weight: 800; cursor: pointer;
  white-space: nowrap;
}
.ja-ask-entry {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: #eafaf3; border: 1px solid #9fd8c2; border-radius: 14px;
  padding: 10px 14px; margin: 0 0 16px;
}
.ja-ask-entry-label { font-weight: 800; font-size: 14.5px; flex: 1; }
.ja-ask-room { background: none; border: none; padding: 0; margin: 0 0 0 auto; }
.ja-dest {
  background: var(--ss-mint, #b8ecd9); color: #0c3b2e;
  border-radius: 10px; padding: 9px 12px; font-weight: 800; font-size: 14.5px;
}

/* ---------- helpers ---------- */
.ja-helpers { border: 1px solid var(--ss-line, #d8e2e0); border-radius: 12px; padding: 10px 12px; margin: 10px 0; }
.ja-helpers-title { margin: 0 0 6px; font-weight: 800; font-size: 13.5px; }
.ja-helper { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 3px 0; }
.ja-helper-main { display: inline-flex; align-items: center; gap: 7px; background: none; border: none; padding: 0; cursor: pointer; font: inherit; }
.ja-helper-name { font-weight: 800; font-size: 14px; color: #0f5f4d; }
.ja-helper-meta { color: #43565e; font-size: 12.5px; font-weight: 600; }

/* ---------- sheet (profile + ask share the shell) ---------- */
.ja-sheet-wrap {
  position: fixed; inset: 0; z-index: 1200;
  background: rgba(10, 24, 30, 0.55);
  display: flex; align-items: flex-end; justify-content: center;
}
@media (min-width: 720px) { .ja-sheet-wrap { align-items: center; } }
.ja-sheet {
  background: #fff; color: #12262e; width: min(560px, 100%);
  max-height: 88vh; overflow: auto; border-radius: 18px 18px 0 0;
  padding: 20px; position: relative; box-sizing: border-box;
}
@media (min-width: 720px) { .ja-sheet { border-radius: 18px; } }
.ja-sheet-x {
  position: absolute; top: 10px; right: 12px;
  background: none; border: none; font-size: 24px; line-height: 1;
  cursor: pointer; color: #43565e; padding: 4px 8px;
}
.ja-ask-title { margin: 0 24px 10px 0; font-size: 19px; font-weight: 800; }
.ja-person-top { display: flex; gap: 12px; align-items: center; margin-bottom: 8px; }
.ja-person-name { font-size: 17px; }
.ja-headline { font-weight: 700; margin: 4px 0; }
.ja-summary { margin: 8px 0; line-height: 1.5; }
.ja-coins { margin: 10px 0; }

/* ---------- unanswered strip ---------- */
.ja-unanswered {
  border: 2px solid #e5c877; background: #fffaf0;
  border-radius: 16px; padding: 14px 16px; margin: 0 0 16px;
  display: flex; flex-direction: column; gap: 10px;
}
.ja-unanswered-title { margin: 0; font-size: 16px; font-weight: 800; }

/* ---------- S2: lesson cohort strip + fit pills ---------- */
.ja-cohort {
  border: 2px solid #0f5f4d; background: #f2fbf7;
  border-radius: 16px; padding: 12px 14px; margin: 12px 0 16px;
  display: flex; flex-direction: column; gap: 8px;
}
.ja-cohort-title { margin: 0; font-size: 15px; font-weight: 800; }
.ja-cohort-row { display: flex; flex-wrap: wrap; gap: 8px 14px; }
.ja-cohort-member { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ja-cohort-btn {
  background: none; border: none; padding: 0; cursor: pointer; font: inherit;
  font-weight: 800; font-size: 14px; color: #0f5f4d;
  display: inline-flex; align-items: center; gap: 6px;
}
.ja-cohort-state {
  font-size: 11.5px; font-weight: 800; color: #0b3d33;
  background: #b9f2d8; border-radius: 999px; padding: 2px 8px;
}
.ja-fit {
  font-size: 11.5px; font-weight: 800; color: #06382d;
  background: #7fe6b8; border-radius: 999px; padding: 2px 8px; white-space: nowrap;
}
/* Room tab: link to the full room page (2026-10-16). */
.ja-open-room { margin-left: auto; font-size: 12.5px; font-weight: 600; text-decoration: underline; white-space: nowrap; }
.ja-open-room[hidden] { display: none; }

/* ---------- lean member card (r06: every plan) ---------- */
.ja-sheet-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 6px; }
.ja-link { color: #344b2c; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
body.fd-design .ja-sheet-actions .ja-btn:not(.primary) { background: #fffef9; color: #344b2c; border-color: #b9c4ab; }
body.fd-design .ja-sheet-actions .ja-btn:not(.primary):hover { background: #edf1e6; }
.ja-sheet .ja-mini-coins { margin: 8px 0 4px; }
@media (max-width: 760px) { .ja-sheet .ja-link { display: inline-flex; align-items: center; min-height: 44px; } }
/* r02: the pinned FedM8 AI note in a contract or grant conversation; r14: the set-aside line in Ask. */
.ja-pinned { margin: 0 0 10px; padding: 10px 12px; border: 1px solid #cbd4bf; border-radius: 6px; background: #f3f5ec; }
.ja-pinned-head { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; font-size: 13px; color: #29372e; }
.ja-pinned-head .ja-avatar-ai { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: #526547; color: #fffef9; font-size: 11px; font-weight: 700; }
.ja-pinned-tag { color: #586653; font-size: 12px; }
/* FIX-4 (r03): the room's words for the note, and replies nested under their post as in the room. */
.ja-pinned-meta { color: #586653; font-size: 12px; }
.ja-pinned-meta::before { content: "· "; }
.ja-branch { margin: 8px 0 0 6px; padding-left: 12px; border-left: 2px solid #dce2d1; display: grid; gap: 8px; }
.ja-branch > summary.ja-replies { display: list-item; cursor: pointer; text-decoration: none; margin: 0; min-height: 32px; padding: 6px 0; }
.ja-msg-reply { background: #fdfdf8; }
@media (max-width: 640px) { .ja-branch > summary.ja-replies { min-height: 44px; } .ja-branch { margin-left: 2px; padding-left: 8px; } }
.ja-pinned .ja-msg-body { margin: 0; white-space: pre-wrap; }
.ja-cert { margin: 4px 0 8px; }
