/* ============================================================================
   Plush74 Collections 2026 — REQUEST CHAT surface (2026-07-11)
   Staff↔member request-chat unread badges (overview pill, editor row pill +
   top-bar chip, per-row "Open chat" button badge) + the embedded slide-over
   chat panel in the collection editor. Kit-compliant: ink #111 / lime #E9FF75 /
   hairline rgba(17,17,17,.14). Button rule honoured — never dark fill + lime/
   yellow TEXT (count badges use WHITE text on ink; chips use INK text on lime).
   Tokens come from collections-2026.css (:root); scoped like the surfaces it
   extends (.p74co-root overview, .p74ce-md editor).
   ============================================================================ */

/* ---- OVERVIEW: unread request-chat pill (mirrors the lime Request pill) ---- */
.p74co-root a.p74co-pill--msg{
  color: var(--p74c-ink, #111); background: transparent; border: 0; cursor: pointer;
}
.p74co-root a.p74co-pill--msg::before{
  background: var(--p74c-lime-d, #d9f155); width: 6px; height: 6px;
}
.p74co-root a.p74co-pill--msg:hover{ color: var(--p74c-ink, #111); text-decoration: underline; }

/* ---- EDITOR: per-row unread-messages pill (distinct from the lime UPDATED
        pill — ink fill + white text, still button-rule compliant) ------------- */
.p74cmd__lrow-msg[hidden], .p74cmd__msgchip[hidden]{ display: none !important; }
.p74cmd__lrow-msg{
  display: inline-flex; align-items: center; gap: 3px;
  font-family: var(--p74c-font-disp); font-size: 8.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .05em; line-height: 1.3;
  padding: 2px 6px; white-space: nowrap;
  background: var(--p74c-ink, #111); color: #fff; border: 1px solid var(--p74c-ink, #111);
}
.p74ce-md.p74ce-md .p74cmd__lrow-msg{ font-size: 10.5px !important; }
.p74cmd__lrow-msg b{ font-variant-numeric: tabular-nums; }
/* a soft left cue on rows carrying unread messages (parallel to .is-updated) */
.p74cmd__lrow.has-msg:not(.is-active){ background: rgba(233,255,117,.16); }

/* ---- EDITOR: top-bar UNREAD-MESSAGES chip (clone of .p74cmd__updchip) ------- */
.p74cmd__msgchip{
  display: flex; width: 100%; align-items: center; justify-content: center; gap: 6px;
  appearance: none; border: 0; border-bottom: 1px solid var(--p74cmd-line3, rgba(17,17,17,.14));
  cursor: pointer; padding: 7px 4px 6px;
  font-family: var(--p74c-font-disp); font-size: 9.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
  background: var(--p74c-lime, #E9FF75); color: var(--p74c-ink, #111);
}
.p74cmd__msgchip b{ font-size: 12px; line-height: 1; font-variant-numeric: tabular-nums; }
.p74cmd__msgchip:hover{ background: var(--p74c-lime-d, #d9f155); }
.p74cmd__msgchip.is-on{ box-shadow: inset 0 0 0 2px var(--p74c-ink, #111); }

/* ---- "Open chat" button unread count badge (WHITE text on ink) ------------- */
.p74c-openchat{ position: relative; }
.p74c-openchat-badge{
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 16px; height: 16px; margin-left: 6px; padding: 0 4px;
  background: var(--p74c-ink, #111); color: #fff; border-radius: 8px;
  font-family: var(--p74c-font-disp); font-size: 10px; font-weight: 700;
  line-height: 1; font-variant-numeric: tabular-nums;
}
.p74c-openchat-badge[hidden]{ display: none !important; }

/* ============================================================================
   EMBEDDED SLIDE-OVER CHAT PANEL (collection editor)
   ============================================================================ */
.p74cmd__chatpanel[hidden]{ display: none !important; }
.p74cmd__chatpanel{
  position: fixed; inset: 0; z-index: 100000;
  display: block; pointer-events: none;
}
.p74cmd__chatpanel.is-open{ pointer-events: auto; }
.p74cmd__chat-backdrop{
  position: absolute; inset: 0; background: rgba(17,17,17,.34);
  opacity: 0; transition: opacity .18s ease;
}
.p74cmd__chatpanel.is-open .p74cmd__chat-backdrop{ opacity: 1; }
.p74cmd__chat{
  position: absolute; top: 0; right: 0; bottom: 0;
  width: 420px; max-width: 92vw;
  background: var(--p74c-paper, #fff);
  border-left: 1px solid var(--p74c-ink, #111);
  box-shadow: -18px 0 46px rgba(17,17,17,.16);
  display: flex; flex-direction: column;
  transform: translateX(100%); transition: transform .2s ease;
  font-family: var(--p74c-font, sans-serif);
}
.p74cmd__chatpanel.is-open .p74cmd__chat{ transform: translateX(0); }

/* the staff feedback bubble (#p74-feedback-root, z-index ~max-int) sits bottom-
   right and would overlap the composer Send button — hide it while chatting. */
body.p74cmd-chat-open #p74-feedback-root{ display: none !important; }

/* header */
.p74cmd__chat-head{
  display: flex; align-items: flex-start; gap: 10px;
  padding: 16px 16px 13px; border-bottom: 1px solid var(--p74c-hair, rgba(17,17,17,.14));
  flex: 0 0 auto;
}
.p74cmd__chat-head-main{ flex: 1; min-width: 0; }
.p74cmd__chat-eyebrow{
  display: block; font-family: var(--p74c-font-disp); font-size: 9.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em; color: var(--p74c-faint, #999);
}
.p74cmd__chat-title{
  display: block; margin-top: 3px; font-family: var(--p74c-font-disp);
  font-size: 15px; font-weight: 700; letter-spacing: .01em; color: var(--p74c-ink, #111);
  line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.p74cmd__chat-head-tools{ display: flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.p74cmd__chat-open, .p74cmd__chat-close{
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border: 1px solid var(--p74c-hair, rgba(17,17,17,.14));
  background: transparent; color: var(--p74c-ink, #111); cursor: pointer;
  text-decoration: none; line-height: 1;
}
.p74cmd__chat-close{ font-size: 22px; }
.p74cmd__chat-open:hover, .p74cmd__chat-close:hover{
  background: var(--p74c-lime, #E9FF75); border-color: var(--p74c-ink, #111); color: var(--p74c-ink, #111);
}

/* body / thread */
.p74cmd__chat-body{
  flex: 1 1 auto; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 10px; background: var(--p74c-soft, #f7f7f5);
}
.p74cmd__chat-empty{
  margin: auto; color: var(--p74c-muted, #777); font-size: 12.5px; text-align: center;
}
.p74cmd__msg{ max-width: 84%; display: flex; flex-direction: column; gap: 3px; }
.p74cmd__msg.is-member{ align-self: flex-start; align-items: flex-start; }
.p74cmd__msg.is-staff{ align-self: flex-end; align-items: flex-end; }
.p74cmd__msg-meta{
  display: flex; gap: 7px; align-items: baseline;
  font-size: 9.5px; text-transform: uppercase; letter-spacing: .04em;
  font-family: var(--p74c-font-disp); font-weight: 700;
}
.p74cmd__msg-who{ color: var(--p74c-ink, #111); }
.p74cmd__msg-time{ color: var(--p74c-faint, #999); font-weight: 400; letter-spacing: 0; text-transform: none; }
.p74cmd__msg-text{
  padding: 8px 11px; font-size: 13px; line-height: 1.42; color: var(--p74c-ink, #111);
  border: 1px solid var(--p74c-hair, rgba(17,17,17,.14)); word-wrap: break-word; overflow-wrap: anywhere;
}
.p74cmd__msg.is-member .p74cmd__msg-text{ background: var(--p74c-paper, #fff); }
.p74cmd__msg.is-staff .p74cmd__msg-text{ background: var(--p74c-lime, #E9FF75); border-color: var(--p74c-lime-d, #d9f155); }
.p74cmd__msg-text a{ color: var(--p74c-ink, #111); text-decoration: underline; }

/* composer */
.p74cmd__chat-composer{
  flex: 0 0 auto; display: flex; gap: 8px; align-items: flex-end;
  padding: 12px 14px; border-top: 1px solid var(--p74c-hair, rgba(17,17,17,.14));
  background: var(--p74c-paper, #fff);
}
.p74cmd__chat-input{
  flex: 1; resize: none; min-height: 40px; max-height: 120px;
  border: 1px solid var(--p74c-hair, rgba(17,17,17,.14)); background: var(--p74c-paper, #fff);
  padding: 9px 11px; font-family: var(--p74c-font, sans-serif); font-size: 13px; color: var(--p74c-ink, #111);
  border-radius: 0;
}
.p74cmd__chat-input:focus{ outline: none; border-color: var(--p74c-ink, #111); }
.p74cmd__chat-send{ flex: 0 0 auto; }
.p74cmd__chat-send[disabled]{ opacity: .5; pointer-events: none; }

@media (max-width: 560px){
  .p74cmd__chat{ width: 100vw; max-width: 100vw; border-left: 0; }
}

/* ============================================================================
   2026-07-14 — the top-bar chip is now the collection-level ENTRY POINT into the
   request chats, not just an unread counter: it shows whenever the collection has
   a chat at all (count = listings with a chat), and clicking it filters the grid
   to those listings. Lime + "N NEW" while a member reply is unread; quiet paper
   once everything is read — so the way back into a read chat never disappears.
   ============================================================================ */
.p74cmd__msgchip{ background: var(--p74c-paper, #fff); color: var(--p74c-ink, #111); }
.p74cmd__msgchip:hover{ background: var(--p74c-soft, rgba(17,17,17,.04)); }
.p74cmd__msgchip.is-alert{ background: var(--p74c-lime, #E9FF75); }
.p74cmd__msgchip.is-alert:hover{ background: var(--p74c-lime-d, #d9f155); }
.p74cmd__msgchip-new{ display: inline-flex; align-items: center; }
.p74cmd__msgchip-new[hidden]{ display: none !important; }