/*
 * 口コミ一覧（/reviews/）
 * Figma 668-17000。検索UI（.ta-searchbar / .ta-modal / .ta-chip 等）は archive-teller.css、
 * 口コミカード本体（.teller-review-card*）は teller-reviews.css、
 * スピナー / さらに読み込む / 空状態は teller-reviews-tab.css を流用する。
 * ここではこのページ固有の差分だけを定義する。
 */

.review-archive { background: #F5F5F5; }

/* ── ソート（新しい順 / 古い順）── 見た目は ta-chip--select 相当のセレクト */
.rvl-sort { position: relative; }
.rvl-sort__select {
  -webkit-appearance: none;
  appearance: none;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 4px 32px 4px 12px;
  border: 1px solid #B3B3B3;
  border-radius: 999px;
  background: #FFFFFF;
  color: #1A1A1A;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  cursor: pointer;
}
.rvl-sort__icon {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #4D4D4D;
  pointer-events: none;
}

/* ── 一覧 ── */
.rvl-list { background: #FFFFFF; }

/* カード: 口コミタブの is-normal（枠線）ではなく、区切り線で縦に連ねる */
.rvl-card { position: relative; border: 0; border-bottom: 1px solid #D9D9D9; }
.rvl-card[hidden] { display: none; }

/* カード全面クリックで占い師詳細へ */
.rvl-card__overlay { position: absolute; inset: 0; z-index: 1; }

/* ── 占い師バー（グレー地・アバター＋名前＋シェブロン）── */
.rvl-card__teller {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  padding: 8px 12px;
  background: #B3B3B3;
  text-decoration: none;
}
.rvl-card__teller-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  object-position: center top;
  flex-shrink: 0;
}
.rvl-card__teller-avatar--empty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #808080;
}
.rvl-card__teller-name {
  flex: 1;
  min-width: 0;
  font-size: 14px;
  font-weight: 500;
  color: #1A1A1A;
  line-height: 1.7;
  letter-spacing: 0.03em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rvl-card__teller-chevron { flex-shrink: 0; color: #1A1A1A; }