/* ==========================================================================
   Reviews — assets/reviews.css
   Styles for front/reviews.html: rating summary, star-picker submission
   form, and the public review list.
   ========================================================================== */

.rv-summary{
  display:flex; align-items:center; gap:24px; flex-wrap:wrap;
  background: var(--surface); border:1px solid var(--border); border-radius: var(--radius-lg, 24px);
  box-shadow: var(--shadow-md); padding: 24px 28px; margin: 28px 0;
}
.rv-summary-score{ font-family: var(--font-display); font-size: 2.6rem; font-weight:800; color: var(--ink); line-height:1; }
.rv-summary-stars{ font-size:1.3rem; color:#f5a623; letter-spacing:2px; margin:6px 0 2px; }
.rv-summary-count{ font-size:.85rem; color: var(--ink-faint); }
.rv-summary-blurb{ flex:1; min-width:200px; font-size:.92rem; color: var(--ink-soft); line-height:1.5; }

.rv-form{
  background: var(--surface); border:1px solid var(--border); border-radius: var(--radius-lg, 24px);
  box-shadow: var(--shadow-md); padding: 24px 28px; margin: 0 0 32px;
  display:flex; flex-direction:column; gap:16px;
}
.rv-form h2{ margin:0; font-family: var(--font-display); font-size:1.2rem; }
.rv-star-picker{ display:flex; gap:6px; }
.rv-star-btn{
  appearance:none; background:none; border:none; cursor:pointer; font-size:2rem; line-height:1;
  color: var(--border); padding:0; transition: color .1s ease, transform .1s ease;
}
.rv-star-btn:hover{ transform: scale(1.1); }
.rv-star-btn.is-filled{ color:#f5a623; }
.rv-form label{ font-size:.78rem; font-weight:600; color: var(--ink-soft); }
.rv-form input[type="text"],
.rv-form textarea{
  border:1px solid var(--border); background: var(--surface-2); color: var(--ink);
  border-radius:10px; padding:10px 12px; font-size:.92rem; font-family: var(--font-body); width:100%;
  resize: vertical;
}
.rv-form-row{ display:flex; flex-direction:column; gap:6px; }
.rv-form-hint{ font-size:.75rem; color: var(--ink-faint); }
.rv-form-msg{ font-size:.85rem; font-weight:600; }
.rv-form-msg.ok{ color: var(--success); }
.rv-form-msg.err{ color: var(--accent-2); }

.rv-list{ display:flex; flex-direction:column; gap:14px; margin-bottom: 28px; }
.rv-card{
  background: var(--surface); border:1px solid var(--border); border-radius: 18px;
  box-shadow: var(--shadow-sm); padding: 16px 20px;
}
.rv-card-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px; }
.rv-card-stars{ color:#f5a623; letter-spacing:1px; font-size:.95rem; }
.rv-card-name{ font-weight:700; color: var(--ink); font-size:.9rem; }
.rv-card-date{ font-size:.75rem; color: var(--ink-faint); white-space:nowrap; }
.rv-card-comment{ font-size:.9rem; color: var(--ink-soft); line-height:1.5; margin:0; white-space:pre-wrap; }

.rv-empty, .rv-loading{ text-align:center; color: var(--ink-faint); font-size:.9rem; padding: 20px 0; }
.rv-load-more{ display:block; margin: 0 auto; }


/* Mobile polish: keep the review page compact and avoid oversized desktop spacing. */
@media (max-width: 720px){
  .rv-summary{gap:14px;padding:18px;margin:18px 0;border-radius:16px}
  .rv-summary-score{font-size:2.1rem}
  .rv-summary-blurb{min-width:0;font-size:.84rem}
  .rv-form{padding:18px;margin-bottom:22px;border-radius:16px;gap:13px}
  .rv-star-btn{font-size:1.7rem}
  .rv-card{padding:14px;border-radius:15px}
  .rv-card-head{align-items:flex-start}
  .rv-card-date{font-size:.68rem}
}