/* Common chat controls: the host retains ownership of viewport and safe-area. */
#consumer-panel [data-consumer-input-target="input"],
#consumer-panel [data-consumer-input-target="thread"],
#consumer-panel [data-consumer-input-target="conversation"] {
  font-size: 16px;
  line-height: 1.65;
}
#consumer-panel button,
#consumer-panel select,
#consumer-panel summary,
#consumer-panel a {
  min-height: 44px;
  min-width: 44px;
}
#consumer-panel summary { align-content: center; }
#consumer-panel label:has(input[type="checkbox"]) { min-height: 44px; align-items: center; }
#consumer-panel p,
#consumer-panel label,
#consumer-panel summary { font-size: 16px; }

/* Standalone Web chat only; the floating panel and mobile app own their layouts. */
.consumer-chat-page #consumer-panel {
  background: #fff;
  border: 0;
  box-shadow: none;
}
.consumer-chat-page #consumer-panel > [data-consumer-input-target="messages"] {
  padding: 32px max(20px, calc((100% - 800px) / 2));
  background: #fff;
  overscroll-behavior: contain;
}
.consumer-chat-page [data-consumer-input-target="conversation"] {
  font-size: 16px;
  line-height: 1.75;
}
.consumer-chat-page [data-consumer-input-target="conversation"] > div {
  padding: 16px 20px;
  margin-bottom: 20px;
  font-size: 16px;
  line-height: 1.75;
}
.consumer-chat-page [data-consumer-input-target="welcome"] {
  margin: clamp(32px, 10vh, 112px) auto 40px;
}
.consumer-chat-page [data-consumer-input-target="welcome"] > p:first-of-type {
  font-size: 26px;
  letter-spacing: -.04em;
}
.consumer-chat-page [data-consumer-input-target="welcome"] > p:nth-of-type(2) {
  max-width: 420px;
  margin: 12px auto 0;
  font-size: 16px;
  line-height: 1.8;
}
.consumer-chat-page #consumer-panel > div:last-child {
  width: min(840px, calc(100% - 32px));
  margin: 0 auto max(16px, env(safe-area-inset-bottom));
  padding: 14px 18px;
  border: 1px solid #e5e7eb;
  border-radius: 24px;
  box-shadow: 0 4px 24px #0f172a08;
}
.consumer-chat-page [data-consumer-input-target="input"] {
  min-height: 48px;
  font-size: 16px;
  line-height: 1.6;
  background: #fff;
}
.consumer-chat-page [data-consumer-input-target="sendBtn"] {
  background: #1f2937;
}
.consumer-chat-page [data-consumer-input-target="thread"] {
  max-width: 360px;
  padding: 10px 12px;
  font-size: 16px;
}
.consumer-chat-page #consumer-panel > div:has(> [data-consumer-input-target="thread"]) {
  padding: 4px max(20px, calc((100% - 800px) / 2));
  border-bottom: 0;
}
@media (max-width: 600px) {
  .consumer-chat-page #consumer-panel > [data-consumer-input-target="messages"] { padding: 16px; }
  .consumer-chat-page #consumer-panel > div:last-child { width: calc(100% - 16px); padding: 10px 12px; }
}
