/* ═══════════════════════════════════════════════
   Threads inbox — Layout (mirrors feed.css)
   ═══════════════════════════════════════════════ */
body.threads-page #main-content {
  justify-content: start;
}

.threads {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  position: relative;
  width: 100%;
  max-inline-size: 100%;
  padding: calc(var(--navbar-height) + var(--block-space)) var(--inline-space) var(--block-space-double);
}

@media (min-width: 100ch) {
  .threads {
    max-inline-size: 680px;
    margin-inline: auto;
  }
}

.threads__loading { display: flex; justify-content: center; padding: var(--block-space-double) 0; }

/* ═══════════════════════════════════════════════
   Thread Card (minimal custom — mostly utility classes in HTML)
   ═══════════════════════════════════════════════ */
.thread-card { cursor: pointer; }
.thread-card:hover { --border-color: var(--color-border-darker); }

/* Unread emphasis — ring treatment, same weight semantics as .room.unread */
.thread-card--unread {
  --border-color: var(--color-text);
  box-shadow: 0 0 0 1px var(--color-text);
}

/* “New replies” pill — mirrors .post-card__pinned-badge */
.thread-card__unread-badge {
  background: oklch(var(--lch-blue) / 0.1);
  color: oklch(var(--lch-blue));
  border-radius: 1em;
  padding: 0.15em 0.6em;
}

/* 2-line parent snippet — mirrors .post-card__preview */
.thread-card__snippet {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Participant facepile — mirrors .post-card__faces/__face */
.thread-card__faces { display: flex; }

.thread-card__face {
  --avatar-size: 1.8ch;
  margin-inline-end: -0.25rem;
  border: 2px solid var(--color-bg);
  border-radius: 50%;
}

.thread-card__face:last-child { margin-inline-end: 0; }

/* Options button — hidden until hover (matches post-card/message pattern) */
.thread-card__options-btn {
  @media (hover: hover) and (pointer: fine) {
    opacity: 0;
    transition: opacity 150ms ease-in-out;
    transition-delay: 150ms;
  }
  @media (hover: none) and (pointer: coarse) {
    opacity: 0.5;
  }
}

.thread-card:hover .thread-card__options-btn,
.thread-card:has([open]) .thread-card__options-btn { opacity: 1; }

/* Actions dropdown menu */
.thread-card__actions-menu {
  position: absolute;
  inset-inline-end: 0;
  inset-block-start: 100%;
  z-index: 10;
  min-inline-size: 12rem;
}

/* Member search in the nav */
.threads__search {
  position: relative;
  inline-size: 13rem;
}

.threads__search-icon {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: 0.8em;
  translate: 0 -50%;
  opacity: 0.4;
  pointer-events: none;
}

.threads__search-input {
  --input-border-radius: 2em;
  --input-padding: 0.3em 0.9em 0.3em 2.4em;
  --input-background: var(--color-bg);
}