/*
 * 占い師詳細 口コミタブ
 * ワイヤー: 占い師口コミ.html
 */

/* ── Charts ── */
.teller-reviews-tab__charts { background:#fff; padding:20px 16px; border-bottom:1px solid rgba(0,0,0,0.12); display:flex; flex-direction:column; gap:20px; }
.teller-reviews-tab__chart-block { display:flex; flex-direction:column; gap:8px; }
.teller-reviews-tab__chart-title { font-size:16px; font-weight:500; color:rgba(0,0,0,0.87); line-height:1.5; margin:0; }
.teller-reviews-tab__chart-body  { display:flex; align-items:center; gap:30px; overflow:hidden; height:100px; }
.teller-reviews-tab__chart-img   { width:100px; height:100px; flex-shrink:0; border-radius:50%; overflow:hidden; }
.teller-reviews-tab__chart-img svg { display:block; width:100%; height:100%; }
.teller-reviews-tab__chart-legend { display:flex; flex-direction:column; gap:6px; }
.teller-reviews-tab__legend-item  { display:flex; align-items:center; gap:8px; font-size:12px; color:rgba(0,0,0,0.87); line-height:1.5; }
.teller-reviews-tab__legend-dot   { width:8px; height:8px; border-radius:2px; flex-shrink:0; display:inline-block; }
.teller-reviews-tab__chart-empty  { font-size:12px; color:rgba(0,0,0,0.6); padding:8px 0; margin:0; }

/* ── Heading ── */
.teller-reviews-tab__heading { display:flex; align-items:center; padding:32px 16px 8px; }
.teller-reviews-tab__heading h2 { flex:1; font-size:20px; font-weight:500; font-family:'Noto Sans JP', sans-serif; color:rgba(0,0,0,0.87); line-height:1.5; margin:0; }

/* ── Filter bar ── */
.teller-reviews-tab__filter-bar { padding:0 16px; background:#fff; }
.teller-reviews-tab__filter-row { display:flex; align-items:center; justify-content:space-between; padding:16px 0; }
.teller-reviews-tab__filter-left  { display:flex; align-items:center; gap:8px; }
.teller-reviews-tab__filter-label { font-size:14px; font-weight:500; color:#111; }
.teller-reviews-tab__filter-status{ font-size:14px; font-weight:400; color:#999; }
.teller-reviews-tab__btn-change   { display:flex; align-items:center; gap:6px; padding:8px 14px; border-radius:20px; background:#eee; border:none; cursor:pointer; font-size:13px; font-weight:500; color:#555; min-height:44px; }

/* ── List ── */
.teller-reviews-tab__list { background:#fff; }
.teller-reviews-tab__empty { padding:32px 16px; text-align:center; color:rgba(0,0,0,0.6); font-size:13px; }

/* Batch 非表示（初回は batch 0 のみ表示） */
.teller-reviews-tab__list[data-visible-batch="0"] [data-batch]:not([data-batch="0"]) { display:none; }
.teller-reviews-tab__list[data-visible-batch="1"] [data-batch]:not([data-batch="0"]):not([data-batch="1"]) { display:none; }
.teller-reviews-tab__list[data-visible-batch="2"] [data-batch]:not([data-batch="0"]):not([data-batch="1"]):not([data-batch="2"]) { display:none; }
.teller-reviews-tab__list[data-visible-batch="3"] [data-batch]:not([data-batch="0"]):not([data-batch="1"]):not([data-batch="2"]):not([data-batch="3"]) { display:none; }
.teller-reviews-tab__list[data-visible-batch="4"] [data-batch]:not([data-batch="0"]):not([data-batch="1"]):not([data-batch="2"]):not([data-batch="3"]):not([data-batch="4"]) { display:none; }
.teller-reviews-tab__list[data-visible-batch="5"] [data-batch]:not([data-batch="0"]):not([data-batch="1"]):not([data-batch="2"]):not([data-batch="3"]):not([data-batch="4"]):not([data-batch="5"]) { display:none; }

/* spinner & load more */
.teller-reviews-tab__spinner { display:flex; align-items:center; justify-content:center; padding:24px 0; }
.teller-reviews-tab__spinner[hidden] { display:none; }
.teller-reviews-tab__spinner::after { content:''; width:28px; height:28px; border:3px solid #e0e0e0; border-top-color:#888; border-radius:50%; animation:teller-reviews-spin 0.7s linear infinite; }
@keyframes teller-reviews-spin { to { transform:rotate(360deg); } }

.teller-reviews-tab__sentinel { height:1px; }

.teller-reviews-tab__load-more { background:#fff; padding:16px; display:flex; justify-content:center; }
.teller-reviews-tab__load-more[hidden] { display:none; }
.teller-reviews-tab__load-more button { display:flex; align-items:center; gap:8px; padding:8px 16px; background:#fff; border:1px solid rgba(0,0,0,0.15); border-radius:4px; cursor:pointer; font-size:12px; font-weight:500; color:rgba(0,0,0,0.87); letter-spacing:0.46px; min-height:44px; }

/* ── Filter modal ── */
.teller-reviews-filter-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:1100; align-items:flex-end; justify-content:center; }
.teller-reviews-filter-modal.is-open { display:flex; }
.teller-reviews-filter-modal__content { width:100%; max-width:375px; max-height:85vh; background:#fff; border-radius:16px 16px 0 0; display:flex; flex-direction:column; animation:teller-reviews-modal-up 0.25s ease; }
@keyframes teller-reviews-modal-up { from { transform:translateY(100%); } to { transform:translateY(0); } }

.teller-reviews-filter-modal__close-bar { display:flex; justify-content:center; padding:12px; }
.teller-reviews-filter-modal__close     { width:32px; height:32px; border-radius:50%; background:#1a1a1a; border:none; color:#fff; font-size:14px; font-weight:500; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.teller-reviews-filter-modal__title     { text-align:center; font-size:18px; font-weight:500; color:rgba(0,0,0,0.87); padding:0 16px 16px; margin:0; }
.teller-reviews-filter-modal__scroll    { flex:1; overflow-y:auto; }
.teller-reviews-filter-modal__section   { padding:16px; display:flex; flex-direction:column; gap:8px; }
.teller-reviews-filter-modal__section-title { font-size:14px; font-weight:500; color:rgba(0,0,0,0.87); margin:0; }
.teller-reviews-filter-modal__options   { background:#f5f5f5; border-radius:8px; padding:12px 16px; display:flex; flex-wrap:wrap; gap:4px 0; }
.teller-reviews-filter-modal__option    { display:flex; align-items:center; gap:8px; padding:6px 0; padding-right:16px; cursor:pointer; }
.teller-reviews-filter-modal__option input[type="checkbox"],
.teller-reviews-filter-modal__option input[type="radio"] { width:20px; height:20px; margin:0; accent-color:#1976d2; flex-shrink:0; }
.teller-reviews-filter-modal__option span { font-size:13px; color:rgba(0,0,0,0.87); white-space:nowrap; }

.teller-reviews-filter-modal__bottom { display:flex; align-items:center; justify-content:center; gap:16px; padding:16px; border-top:1px solid #e0e0e0; }
.teller-reviews-filter-modal__clear  { font-size:14px; font-weight:500; color:#555; background:none; border:none; cursor:pointer; min-height:44px; padding:0 8px; }
.teller-reviews-filter-modal__submit { padding:14px 32px; border-radius:24px; background:#1a1a1a; border:none; color:#fff; font-size:14px; font-weight:500; cursor:pointer; }