/* PONO とのやり取りの吹き出し（LP・コースの違いのページで共用。アプリのホーム画面に合わせる） */

.chat-mock__divider {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--c-text-tertiary);
  font-size: 0.5625rem;
  font-weight: 700;
}

.chat-mock__divider::before,
.chat-mock__divider::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--c-divider);
}

.chat-mock__row { display: flex; align-items: flex-end; gap: 0.375rem; }
.chat-mock__row--me { justify-content: flex-end; }

.chat-mock__avatar { flex: none; width: 26px; height: 26px; object-fit: contain; }

.chat-mock__avatar--me {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--c-primary-light);
  color: var(--c-primary);
}

.chat-mock__avatar--me svg { width: 16px; height: 16px; }

.chat-mock__body { max-width: 78%; }

.chat-mock__bubble-row { display: flex; align-items: flex-end; gap: 0.375rem; }
.chat-mock__row--me .chat-mock__body { text-align: right; }

.chat-mock__bubble {
  display: inline-block;
  text-align: left;
  background: var(--c-surface);
  color: var(--c-text);
  border-radius: 12px;
  padding: 0.4375rem 0.625rem;
  box-shadow: 0 1px 4px rgba(74, 74, 74, 0.06);
}

.chat-mock__bubble--me {
  background: var(--c-primary);
  color: var(--c-text-on-primary);
  box-shadow: none;
}

.chat-mock__time {
  display: block;
  margin-top: 0.1875rem;
  font-size: 0.5625rem;
  font-weight: 600;
  color: var(--c-text-tertiary);
}