/* ================================================================
   CasaGlow - Reviews System CSS
   ================================================================ */

.bytora-reviews-section {
    padding: var(--bytora-space-16) 0;
    border-top: 1px solid var(--bytora-gray-200);
    margin-top: var(--bytora-space-8);
}
.bytora-reviews-section__heading {
    font-family: var(--bytora-font-heading);
    font-size: var(--bytora-text-2xl);
    font-weight: var(--bytora-font-bold);
    margin-bottom: var(--bytora-space-8);
}

/* SUMMARY */
.bytora-review-summary {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: var(--bytora-space-8);
    align-items: center;
    background: var(--bytora-gray-100);
    border-radius: var(--bytora-radius-xl);
    padding: var(--bytora-space-8);
    margin-bottom: var(--bytora-space-8);
}
.bytora-review-summary__score { text-align: center; }
.bytora-review-summary__avg {
    display: block;
    font-size: 3.5rem;
    font-weight: var(--bytora-font-extrabold);
    line-height: 1;
    color: var(--bytora-gray-900);
    margin-bottom: var(--bytora-space-2);
}
.bytora-review-summary__stars { justify-content: center; display: flex; margin-bottom: var(--bytora-space-2); }
.bytora-review-summary__total { font-size: var(--bytora-text-sm); color: var(--bytora-gray-500); }

/* RATING BARS */
.bytora-rating-bars { display: flex; flex-direction: column; gap: var(--bytora-space-2); }
.bytora-rating-bar {
    display: flex;
    align-items: center;
    gap: var(--bytora-space-3);
    cursor: pointer;
}
.bytora-rating-bar__label {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 36px;
    font-size: var(--bytora-text-sm);
    font-weight: var(--bytora-font-medium);
    color: var(--bytora-gray-700);
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: color 150ms ease;
}
.bytora-rating-bar__label:hover { color: var(--bytora-primary); }
.bytora-rating-bar__label svg { color: #F59E0B; }
.bytora-rating-bar__track {
    flex: 1;
    height: 8px;
    background: var(--bytora-gray-200);
    border-radius: var(--bytora-radius-full);
    overflow: hidden;
}
.bytora-rating-bar__fill {
    height: 100%;
    background: var(--bytora-primary);
    border-radius: var(--bytora-radius-full);
    transition: width 800ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.bytora-rating-bar__pct {
    min-width: 34px;
    text-align: right;
    font-size: var(--bytora-text-xs);
    color: var(--bytora-gray-500);
}

/* TOOLBAR */
.bytora-reviews-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--bytora-space-4);
    flex-wrap: wrap;
    margin-bottom: var(--bytora-space-6);
}
.bytora-review-filters { display: flex; gap: var(--bytora-space-2); flex-wrap: wrap; }
.bytora-filter-pill {
    padding: 6px 14px;
    border: 1.5px solid var(--bytora-gray-300);
    border-radius: var(--bytora-radius-full);
    font-size: var(--bytora-text-xs);
    font-weight: var(--bytora-font-medium);
    font-family: var(--bytora-font-button);
    background: #fff;
    color: var(--bytora-gray-700);
    cursor: pointer;
    transition: all 150ms ease;
    display: flex;
    align-items: center;
    gap: 4px;
}
.bytora-filter-pill:hover { border-color: var(--bytora-primary); color: var(--bytora-primary); }
.bytora-filter-pill--active, .bytora-filter-pill.is-active {
    background: var(--bytora-primary);
    border-color: var(--bytora-primary);
    color: #fff;
}
.bytora-filter-pill svg { color: #F59E0B; }
.bytora-filter-pill--active svg { color: #fff; }
.bytora-review-sort__select {
    padding: 8px 12px;
    border: 1.5px solid var(--bytora-gray-300);
    border-radius: var(--bytora-radius-md);
    font-size: var(--bytora-text-sm);
    font-family: var(--bytora-font-primary);
    background: #fff;
    color: var(--bytora-gray-700);
    cursor: pointer;
}
.bytora-review-sort__select:focus { border-color: var(--bytora-primary); outline: none; }

/* REVIEWS LIST */
.bytora-reviews-list { display: flex; flex-direction: column; gap: var(--bytora-space-4); min-height: 60px; }
.bytora-reviews-loading {
    display: flex; align-items: center; justify-content: center;
    padding: var(--bytora-space-12);
}

/* REVIEW CARD */
.bytora-review-card {
    background: #fff;
    border-radius: var(--bytora-radius-lg);
    border: 1px solid var(--bytora-gray-200);
    box-shadow: var(--bytora-shadow-card);
    padding: var(--bytora-space-6);
    transition: box-shadow 200ms ease;
    animation: review-in 300ms ease;
}
@keyframes review-in { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
.bytora-review-card:hover { box-shadow: var(--bytora-shadow-md); }
.bytora-review-card--pinned { border-left: 3px solid var(--bytora-primary); }
.bytora-review-card--featured { background: var(--bytora-primary-light); }

.bytora-review-card__header {
    display: flex;
    align-items: flex-start;
    gap: var(--bytora-space-3);
    margin-bottom: var(--bytora-space-4);
    flex-wrap: wrap;
}
.bytora-review-avatar {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: var(--bytora-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--bytora-text-base);
    font-weight: var(--bytora-font-bold);
    font-family: var(--bytora-font-heading);
    flex-shrink: 0;
}
.bytora-review-card__meta { flex: 1; min-width: 0; }
.bytora-review-card__author {
    font-size: var(--bytora-text-sm);
    font-weight: var(--bytora-font-semibold);
    color: var(--bytora-gray-900);
    display: block;
    margin-bottom: 4px;
}
.bytora-verified-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 8px;
    background: var(--bytora-primary-light);
    color: var(--bytora-primary);
    border-radius: var(--bytora-radius-full);
    font-size: 11px;
    font-weight: var(--bytora-font-semibold);
    margin-right: var(--bytora-space-2);
}
.bytora-review-card__date { font-size: var(--bytora-text-xs); color: var(--bytora-gray-400); display: block; }
.bytora-review-card__stars { display: flex; align-items: center; margin-left: auto; }

/* Stars */
.bytora-stars-wrap { display: inline-flex; align-items: center; gap: 2px; }
.bytora-star--filled { color: #F59E0B; }
.bytora-star--half   { color: #F59E0B; }
.bytora-star--empty  { color: var(--bytora-gray-300); }

/* Card body */
.bytora-review-card__title {
    font-size: var(--bytora-text-base);
    font-weight: var(--bytora-font-semibold);
    color: var(--bytora-gray-900);
    margin-bottom: var(--bytora-space-2);
}
.bytora-review-card__text { font-size: var(--bytora-text-sm); color: var(--bytora-gray-700); line-height: 1.6; }
.bytora-review-card__text p { margin: 0 0 var(--bytora-space-2); }

/* Review images */
.bytora-review-images {
    display: flex;
    gap: var(--bytora-space-2);
    flex-wrap: wrap;
    margin-top: var(--bytora-space-4);
}
.bytora-review-images__item {}
.bytora-review-img-link img {
    width: 64px; height: 64px;
    object-fit: cover;
    border-radius: var(--bytora-radius-sm);
    border: 1px solid var(--bytora-gray-200);
    transition: transform 150ms ease;
    display: block;
}
.bytora-review-img-link:hover img { transform: scale(1.06); }

/* Footer */
.bytora-review-card__footer { margin-top: var(--bytora-space-4); display: flex; align-items: center; gap: var(--bytora-space-4); }
.bytora-helpful-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--bytora-space-2);
    padding: 6px 12px;
    border: 1.5px solid var(--bytora-gray-300);
    border-radius: var(--bytora-radius-full);
    background: #fff;
    font-size: var(--bytora-text-xs);
    font-weight: var(--bytora-font-medium);
    color: var(--bytora-gray-600);
    cursor: pointer;
    transition: all 150ms ease;
}
.bytora-helpful-btn:hover, .bytora-helpful-btn.is-active {
    border-color: var(--bytora-primary);
    color: var(--bytora-primary);
    background: var(--bytora-primary-light);
}
.bytora-helpful-count { font-weight: var(--bytora-font-bold); }

/* Store reply */
.bytora-store-reply {
    margin-top: var(--bytora-space-4);
    padding: var(--bytora-space-4);
    background: var(--bytora-gray-100);
    border-left: 3px solid var(--bytora-primary);
    border-radius: 0 var(--bytora-radius-md) var(--bytora-radius-md) 0;
}
.bytora-store-reply__label {
    display: flex;
    align-items: center;
    gap: var(--bytora-space-2);
    font-size: var(--bytora-text-sm);
    color: var(--bytora-primary);
    margin-bottom: var(--bytora-space-2);
}
.bytora-store-reply p { font-size: var(--bytora-text-sm); color: var(--bytora-gray-700); margin: 0; }

/* Pagination */
.bytora-reviews-pagination { margin-top: var(--bytora-space-6); text-align: center; }

/* Write review */
.bytora-write-review {
    margin-top: var(--bytora-space-12);
    padding-top: var(--bytora-space-8);
    border-top: 1px solid var(--bytora-gray-200);
}
.bytora-write-review__heading {
    font-family: var(--bytora-font-heading);
    font-size: var(--bytora-text-xl);
    font-weight: var(--bytora-font-bold);
    margin-bottom: var(--bytora-space-6);
}
.bytora-write-review__login-notice, .bytora-write-review__notice {
    padding: var(--bytora-space-4) var(--bytora-space-6);
    background: var(--bytora-gray-100);
    border-radius: var(--bytora-radius-md);
    color: var(--bytora-gray-600);
    font-size: var(--bytora-text-sm);
}
.bytora-write-review__login-notice a { color: var(--bytora-primary); font-weight: var(--bytora-font-semibold); }

/* Review form */
.bytora-review-form { max-width: 640px; }
.bytora-review-form__rating { margin-bottom: var(--bytora-space-6); }
.bytora-review-form__rating > label { display: block; font-size: var(--bytora-text-sm); font-weight: var(--bytora-font-semibold); margin-bottom: var(--bytora-space-2); }
.bytora-star-select { display: flex; gap: var(--bytora-space-1); }
.bytora-star-select__btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 2px;
    color: var(--bytora-gray-300);
    transition: color 150ms ease, transform 100ms ease;
}
.bytora-star-select__btn:hover, .bytora-star-select__btn.is-active, .bytora-star-select__btn.is-hovered { color: #F59E0B; }
.bytora-star-select__btn:active { transform: scale(0.9); }
.bytora-star-select__btn svg { display: block; }
.bytora-review-form__field { margin-bottom: var(--bytora-space-5); }
.bytora-review-form__field label { display: block; font-size: var(--bytora-text-sm); font-weight: var(--bytora-font-medium); color: var(--bytora-gray-700); margin-bottom: var(--bytora-space-1); }
.bytora-review-form__upload input[type="file"] { width: 100%; }
.bytora-review-form__upload-previews { display: flex; flex-wrap: wrap; gap: var(--bytora-space-2); margin-top: var(--bytora-space-2); }
.bytora-review-form__upload-previews img { width: 56px; height: 56px; object-fit: cover; border-radius: var(--bytora-radius-sm); border: 1px solid var(--bytora-gray-200); }
.bytora-review-form__actions { margin-top: var(--bytora-space-6); }
.bytora-review-form__message { padding: var(--bytora-space-4); border-radius: var(--bytora-radius-md); font-size: var(--bytora-text-sm); margin-top: var(--bytora-space-4); }
.bytora-review-form__message--success { background: var(--bytora-success-light); color: var(--bytora-success); }
.bytora-review-form__message--error { background: var(--bytora-danger-light); color: var(--bytora-danger); }

/* Responsive */
@media (max-width: 768px) {
    .bytora-review-summary { grid-template-columns: 1fr; text-align: center; }
    .bytora-review-summary__score { display: flex; flex-direction: column; align-items: center; }
    .bytora-reviews-toolbar { flex-direction: column; align-items: flex-start; }
    .bytora-review-card__header { flex-wrap: wrap; }
    .bytora-review-card__stars { margin-left: 0; }
}