/* Isolated product review component; uses the storefront palette and breakpoints. */
.product-reviews[hidden], .product-reviews [hidden] { display: none !important; }
.product-reviews .product-reviews__header { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.product-reviews .section-title { margin: 12px 0 20px; }
.product-reviews .product-reviews__notice { display: flex; align-items: center; gap: 14px; color: var(--text-soft); font-size: 13px; line-height: 1.7; margin: 0 0 20px; }
.product-reviews .product-reviews__notice img { flex: 0 0 32px; width: 32px; height: 32px; padding: 4px; box-sizing: content-box; object-fit: contain; background: white; border-radius: 50%; }
.product-reviews .product-reviews__notice strong { font-weight: 700; color: var(--text); }
.product-reviews .product-reviews__summary { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; font-size: 14px; }
.product-reviews .product-reviews__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.product-reviews .product-reviews__card { min-width: 0; padding: 22px; border: 1px solid #e4d6ca; border-radius: 16px; background: var(--surface); }
.product-reviews .product-reviews__person { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.product-reviews .product-reviews__avatar { display: grid; place-items: center; flex: 0 0 40px; height: 40px; border-radius: 50%; background: var(--surface-strong); color: var(--accent-dark); font-weight: 700; }
.product-reviews .product-reviews__identity { min-width: 0; }
.product-reviews .product-reviews__identity strong { display: block; font-size: 14px; }
.product-reviews .product-reviews__identity time { font-size: 12px; color: var(--text-soft); }
.product-reviews .product-reviews__rating { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.product-reviews .product-reviews__stars { display: inline-flex; white-space: nowrap; color: var(--accent-dark); font-size: 18px; line-height: 1; letter-spacing: 2px; }
.product-reviews .product-reviews__card p { margin: 14px 0 0; font-size: 14px; line-height: 1.8; color: var(--text-soft); }
.product-reviews .product-reviews__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.product-reviews .product-reviews__form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 24px; padding: 24px; border: 1px solid #e4d6ca; border-radius: 16px; background: var(--surface); }
.product-reviews .product-reviews__form h3, .product-reviews .product-reviews__form > p, .product-reviews .product-reviews__wide { grid-column: 1 / -1; margin: 0; }
.product-reviews .product-reviews__form > p { font-size: 13px; line-height: 1.7; color: var(--text-soft); }
.product-reviews .product-reviews__form label { display: grid; gap: 8px; min-width: 0; font-size: 14px; }
.product-reviews .field-input { width: 100%; min-width: 0; font: inherit; }
.product-reviews textarea { resize: vertical; }
.product-reviews :is(p, strong, button) { overflow-wrap: anywhere; }
.product-reviews :is(button, input, select, textarea):focus-visible { outline: 2px solid var(--accent-dark); outline-offset: 3px; }
@media (max-width: 1100px) { .product-reviews .product-reviews__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .product-reviews .product-reviews__grid, .product-reviews .product-reviews__form { grid-template-columns: minmax(0, 1fr); }
  .product-reviews .product-reviews__header { gap: 8px; margin-bottom: 18px; }
  .product-reviews .product-reviews__card, .product-reviews .product-reviews__form { padding: 18px; }
  .product-reviews .product-reviews__actions .btn { flex: 1 1 180px; white-space: normal; }
}

.product-reviews__photos { display: flex; flex-wrap: wrap; gap: 12px; }
.product-reviews__photo { margin: 0; width: 120px; max-width: 100%; }
.product-reviews__photo img { display: block; width: 120px; max-width: 100%; height: 100px; object-fit: cover; border-radius: 10px; }
.product-reviews__photo figcaption { margin-top: 6px; font-size: 12px; overflow-wrap: anywhere; color: var(--text-soft); }
