/* Google reviews (partials/reviews.njk): specialist pages, service pages and /opinie/ */

ul.reviews {
    list-style: none;
    margin: var(--space-double) 0 0;
    padding: 0;
    columns: 20rem;
    column-gap: var(--space-normal);
}

/* as specific as main.css's ".page-content ul li" arrow bullet, and loaded later */
ul.reviews > li {
    list-style: none;
}

.review {
    break-inside: avoid;
    margin: 0 0 var(--space-normal);
    padding: var(--space-normal) 1.25rem;
    background-color: var(--clr-surface-raised);
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-1);

    blockquote {
        margin: var(--space-half) 0;
        font-family: var(--font-text);
        line-height: var(--line-height-body);
        color: var(--clr-text);

        p {
            margin-block: 0 var(--space-half);
        }
    }
}

.review-stars {
    margin: 0;
    color: var(--clr-accent);
    letter-spacing: .1em;

    .off {
        color: var(--clr-border);
    }
}

.review-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-quarter) var(--space-half);
    margin: 0;
    font-family: var(--font-regular);
    font-size: var(--font-size-small);
    color: var(--clr-text-muted);

    .review-author {
        font-weight: var(--font-weight-ui);
        color: var(--clr-text-2);
    }

    .review-about {
        flex-basis: 100%;
    }

    a {
        color: var(--clr-base-strong);
    }
}

/* Average rating (partials/rating-summary.njk): homepage and /opinie/ */
.rating-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-half) var(--space-double);
    width: fit-content;
    max-width: 100%;
    margin-block: var(--space-double);
    margin-inline: auto;
    padding: var(--space-normal) var(--space-double);
    background-color: var(--clr-surface-raised);
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-panel);
    box-shadow: var(--shadow-1);
    font-family: var(--font-regular);

    p {
        margin: 0;
    }

    .rating-score {
        display: flex;
        align-items: baseline;
        gap: var(--space-half);

        strong {
            font-family: var(--font-display);
            font-size: var(--font-size-h2);
            font-weight: var(--font-weight-h1);
            line-height: 1;
            color: var(--clr-text);
        }

        .review-stars {
            font-size: var(--font-size-h4);
        }
    }

    .rating-count {
        color: var(--clr-text-2);
    }
}

.reviews-more {
    font-family: var(--font-regular);
    font-weight: var(--font-weight-ui);
}

:is(.reviews-more a, a.reviews-more) {
    color: var(--clr-base-strong);

    &::after {
        content: " →";
    }
}