/* =============================================================================
   HT Reviews — Google + WC review display.
   Reuses parent theme's .tour-reviews__item for item spacing / separator.
   Only Google-review-specific styles live here (avatar, stars, attribution).
   Enqueued conditionally in functions.php SECTION 32 (has_shortcode check).
   ============================================================================= */

/* ── Aggregate rating row ──────────────────────────────────────────────────── */
.ht-reviews__agg {
    display:     flex;
    align-items: center;
    gap:         0.6rem;
    flex-wrap:   wrap;
    font-size:   0.92rem;
    color:       #555;
    margin-bottom: 1.5rem;
}

.ht-reviews__agg strong {
    font-size: 1.6rem;
    font-weight: 700;
    color: #013C1A;
    line-height: 1;
}

/* ── Inline stars (used inside agg rating row) ─────────────────────────────── */
.ht-reviews__stars-inline {
    display:   inline-flex;
    gap:       1px;
    align-items: center;
}

/* ── Per-review item layout ────────────────────────────────────────────────── */
.ht-reviews__item {
    /* Inherits .tour-reviews__item spacing (30px 0, border-bottom). */
}

.ht-reviews__reviewer-wrap {
    display:     flex;
    align-items: center;
    gap:         0.75rem;
    margin-bottom: 0.6rem;
}

/* ── Reviewer avatar ───────────────────────────────────────────────────────── */
.ht-reviews__avatar {
    width:       48px;
    height:      48px;
    border-radius: 50%;
    object-fit:  cover;
    flex-shrink: 0;
    border:      1.5px solid #e8f5ee;
}

.ht-reviews__avatar-placeholder {
    width:       48px;
    height:      48px;
    border-radius: 50%;
    background:  #e8f5ee;
    display:     flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-weight: 700;
    color:       #013C1A;
    font-size:   1rem;
    user-select: none;
}

/* ── Reviewer name + date ──────────────────────────────────────────────────── */
.ht-reviews__reviewer-name {
    font-weight: 600;
    color:       #1a1a1a;
    font-size:   0.95rem;
    display:     block;
}

.ht-reviews__date {
    font-size: 0.78rem;
    color:     #888;
    display:   block;
    margin-top: 1px;
}

/* ── Star row (per review) ─────────────────────────────────────────────────── */
.ht-reviews__stars-row {
    display:  flex;
    gap:      2px;
    margin-bottom: 0.5rem;
}

.ht-reviews__star {
    width:  16px;
    height: 16px;
    fill:   #f5a623;
    flex-shrink: 0;
}

.ht-reviews__star--empty {
    fill: #d9d9d9;
}

/* ── Review body ───────────────────────────────────────────────────────────── */
.ht-reviews__body {
    color:       #444;
    line-height: 1.7;
    font-size:   0.92rem;
}

.ht-reviews__body p {
    margin: 0 0 0.5em;
}

.ht-reviews__body p:last-child {
    margin-bottom: 0;
}

/* ── Trek badge (org-level display: shows which trek was reviewed) ──────────── */
.ht-reviews__trek-badge {
    display:       inline-block;
    font-size:     0.73rem;
    padding:       0.15rem 0.55rem;
    border:        1px solid #01A347;
    color:         #01A347;
    border-radius: 3px;
    margin-top:    0.6rem;
    text-decoration: none;
    transition:    background 0.15s, color 0.15s;
}

.ht-reviews__trek-badge:hover {
    background: #01A347;
    color:      #fff;
}

/* ── Source attribution ────────────────────────────────────────────────────── */
.ht-reviews__source {
    font-size:  0.73rem;
    color:      #bbb;
    margin-top: 0.4rem;
    margin-bottom: 0;
}

/* ── Empty state ───────────────────────────────────────────────────────────── */
.ht-reviews__empty {
    color:       #aaa;
    font-style:  italic;
    padding:     1rem 0;
}

/* ── Mobile ────────────────────────────────────────────────────────────────── */
@media (max-width: 480px) {
    .ht-reviews__agg strong {
        font-size: 1.35rem;
    }

    .ht-reviews__avatar,
    .ht-reviews__avatar-placeholder {
        width:  40px;
        height: 40px;
    }
}
