/* Shared chat canvas: composer on the floor, keyboard docks the thread.
 *
 * JS: js/visual-viewport.js → html.vv-keyboard-open + --vv-* while typing.
 * Each hub still pins its own chat host to --vv-height (Life .page-frame,
 * Tasks .hub-layout[data-hub-view='clare'], overlay .chat-view). Do not fork
 * a second keyboard inset helper per hub.
 */

.chat-view:not([hidden]) > .chat-form,
.chat-view:not([hidden]) > .hub-ai-bar--thread {
  flex: 0 0 auto;
  margin-top: auto;
}

/* Sticky Confirm tray sits above the composer; when visible it owns the
 * floor push so cards stay on screen across New chat / scroll. */
.chat-view:not([hidden]) > .chat-pending-confirms {
  flex: 0 0 auto;
  margin-top: auto;
  max-height: min(42vh, 22rem);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-2) 0;
  border-top: 1px solid var(--line);
  background: color-mix(in srgb, var(--paper) 92%, var(--ink) 8%);
}

.chat-view:not([hidden]) > .chat-pending-confirms[hidden] {
  display: none;
}

.chat-view:has(> .chat-pending-confirms:not([hidden])) > .chat-form,
.chat-view:has(> .chat-pending-confirms:not([hidden])) > .hub-ai-bar--thread {
  margin-top: 0;
}

.chat-pending-confirms__label {
  margin: 0;
  padding: 0 var(--space-1);
  font-size: var(--text-2xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.chat-pending-confirms__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.chat-pending-confirms__list > .confirm-card,
.chat-pending-confirms__list > .record-proposal {
  margin: 0;
}

@media (max-width: 720px) {
  /* Hide the locked bottom bar while any visible chat thread is typing. */
  html.vv-keyboard-open:has(.chat-view:not([hidden])) .hub-mobile-nav,
  body:has(.chat-view:not([hidden]) .chat-form:focus-within) .hub-mobile-nav,
  body:has(.chat-view:not([hidden]) .hub-ai-bar--thread:focus-within) .hub-mobile-nav,
  body:has(.chat-overlay:not([hidden]) .chat-form:focus-within) .hub-mobile-nav,
  body:has(.coach.chat .chat__composer:focus-within) .hub-mobile-nav {
    display: none;
  }

  /*
   * Full-page / rail chat owns the canvas. Refresh + sign-out sit above the
   * Messenger who-header and waste a phone row; keep them on non-chat pages.
   */
  body:has(.chat-view:not([hidden]):not([data-panel-mode])) .hub-utilities,
  body:has(.hub-layout[data-hub-view='clare']) .hub-utilities,
  body:has(.coach.chat) .hub-utilities,
  body:has(.teacher-chat) .hub-utilities {
    display: none;
  }
}