/* ============================================================
   Block: reviews  (sections/block_reviews.php)
   Google reviews — rating summary + review cards. DVS palette.
   ============================================================ */

.dvs-gr__summary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    flex-wrap: wrap;
    margin-bottom: 2.5rem;
}

.dvs-gr__glogo { flex: none; }

.dvs-gr__score {
    font-family: var(--font-display);
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--ink);
}

.dvs-gr__stars {
    display: inline-flex;
    gap: 1px;
    letter-spacing: 1px;
}

.dvs-gr__star {
    color: rgba(255, 255, 255, 0.22);
    font-size: 1.1rem;
    line-height: 1;
}

.dvs-gr__star--on { color: var(--orange); }

.dvs-gr__count {
    color: var(--text-muted);
    font-size: 0.95rem;
}

/* Carousel — 3 per view, equal-height cards */
.dvs-gr__carousel {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.dvs-gr__viewport {
    overflow: hidden;
    flex: 1;
}

.dvs-gr__track {
    display: flex;
    transition: transform 0.35s ease;
    align-items: stretch;         /* every slide same height as tallest */
}

.dvs-gr__slide {
    flex: 0 0 calc((100% - 3rem) / 3);   /* 3 per view, 1.5rem gaps between */
    margin-right: 1.5rem;
    display: flex;               /* stretch card to full slide height */
}

.dvs-gr__card {
    background: var(--paper);
    border: 1px solid var(--line);
    border-radius: 1rem;
    padding: 1.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    width: 100%;                 /* fill the slide → all cards equal width+height */
}

/* Nav buttons */
.dvs-gr__nav {
    flex: none;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--paper);
    border: 1px solid var(--line);
    color: var(--ink);
    font-size: 1.4rem;
    line-height: 1;
    padding-bottom: 4px;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s, opacity 0.2s;
}

.dvs-gr__nav:hover:not(:disabled) {
    background: var(--orange);
    border-color: var(--orange);
    color: #fff;
}

.dvs-gr__nav:disabled {
    opacity: 0.35;
    cursor: default;
}

.dvs-gr__stars--card { font-size: 1rem; }

.dvs-gr__text {
    color: var(--ink-2);
    font-size: 0.95rem;
    line-height: 1.7;
    margin: 0;
    /* clamp long reviews so every card is the same height */
    display: -webkit-box;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.7em * 5);   /* reserve 5 lines so short reviews match tall ones */
}

.dvs-gr__author-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: auto;
    padding-top: 0.5rem;
}

.dvs-gr__avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    flex: none;
}

.dvs-gr__avatar--initial {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--orange);
    color: #fff;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 1.1rem;
}

.dvs-gr__author-meta {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.dvs-gr__author {
    font-weight: 700;
    color: var(--ink);
    font-size: 0.95rem;
}

.dvs-gr__date {
    color: var(--text-muted);
    font-size: 0.8rem;
}

/* See-all button */
.dvs-gr__more {
    text-align: center;
    margin-top: 2.5rem;
}

.dvs-gr__more-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: transparent;
    border: 1px solid var(--orange-border);
    color: var(--accent);
    font-weight: 600;
    font-size: 0.95rem;
    padding: 0.75rem 1.6rem;
    border-radius: 0.6rem;
    text-decoration: none;
    transition: background 0.2s, border-color 0.2s;
}

.dvs-gr__more-btn:hover {
    background: var(--orange-dim);
    border-color: var(--accent);
}

.dvs-gr__more-btn i,
.dvs-gr__more-btn svg {
    width: 16px !important;
    height: 16px !important;
}

@media (max-width: 900px) {
    .dvs-gr__slide {
        flex: 0 0 100%;
        margin-right: 0;
    }

    /* Nav below the card, not overlapping it → card gets full width */
    .dvs-gr__carousel {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0;
    }
    .dvs-gr__viewport {
        flex: 0 0 100%;
        order: 1;
    }
    .dvs-gr__nav {
        order: 2;
        margin-top: 1.25rem;
    }
    .dvs-gr__nav--prev { margin-right: 0.5rem; }
    .dvs-gr__nav--next { margin-left: 0.5rem; }
}
