/* Webpulse GBP Reviews — minimal default styles.
 * Plugin-prefixed BEM. Themes are expected to override or extend.
 * Goal: layout only — no colors/fonts beyond what's needed for legibility.
 */

.webpulse-gbp-reviews {
    max-width: 100%;
    margin: 0 auto;
}

.webpulse-gbp-reviews__summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 1.5em;
    padding: 12px 16px;
    border: 1px solid currentColor;
    border-radius: 6px;
    opacity: 0.92;
}

.webpulse-gbp-reviews__summary-text {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}

.webpulse-gbp-reviews__summary-text strong {
    font-size: 1.4em;
    line-height: 1;
}

.webpulse-gbp-reviews__summary-divider {
    opacity: 0.5;
}

.webpulse-gbp-reviews__write-btn {
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid currentColor;
    border-radius: 4px;
    text-decoration: none;
    font-size: 0.9em;
    line-height: 1.2;
}

.webpulse-gbp-reviews__grid {
    column-gap: 16px;
    column-count: 1;
}

@media (min-width: 640px) {
    .webpulse-gbp-reviews[data-columns="2"] .webpulse-gbp-reviews__grid,
    .webpulse-gbp-reviews[data-columns="3"] .webpulse-gbp-reviews__grid,
    .webpulse-gbp-reviews[data-columns="4"] .webpulse-gbp-reviews__grid {
        column-count: 2;
    }
}

@media (min-width: 960px) {
    .webpulse-gbp-reviews[data-columns="3"] .webpulse-gbp-reviews__grid {
        column-count: 3;
    }
    .webpulse-gbp-reviews[data-columns="4"] .webpulse-gbp-reviews__grid {
        column-count: 4;
    }
}

.webpulse-gbp-reviews__card {
    break-inside: avoid;
    margin-bottom: 16px;
    padding: 16px;
    border: 1px solid currentColor;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.6);
}

.webpulse-gbp-reviews__card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.webpulse-gbp-reviews__avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.webpulse-gbp-reviews__meta {
    min-width: 0;
}

.webpulse-gbp-reviews__name {
    font-weight: 600;
    text-transform: capitalize;
}

.webpulse-gbp-reviews__rating {
    font-size: 0.9em;
    line-height: 1;
    letter-spacing: 1px;
}

.webpulse-gbp-reviews__star {
    opacity: 0.25;
}

.webpulse-gbp-reviews__star.is-filled {
    opacity: 1;
}

.webpulse-gbp-reviews__body {
    font-size: 0.95em;
    line-height: 1.5;
    /* Full review text shown by default. The grid uses CSS columns
       (masonry-style — see `.webpulse-gbp-reviews__grid` above) so
       variable card heights flow naturally without alignment gaps.
       To truncate on a specific page, scope an override at the theme
       level (e.g. `.my-page .webpulse-gbp-reviews__body { ... }`). */
    white-space: pre-line;
}

.webpulse-gbp-reviews__more-wrap {
    text-align: center;
    margin: 24px 0 8px;
}

/* All `<button>` element rules below use `!important` on the four
   Elementor-kit aggressive properties (background-image, border-radius,
   padding, border-style) because some Elementor configurations end up
   with selectors more specific than our parent-scoped 0,2,0 — for
   example `.elementor-kit-XXX .elementor-widget-button .elementor-button`
   at 0,3,0. !important is the only reliable defense against arbitrary
   theme CSS specificity escalation. Limited to plugin-controlled buttons
   so it doesn't bleed into the host theme's button styling. */
.webpulse-gbp-reviews .webpulse-gbp-reviews__more-btn {
    padding: 10px 24px !important;
    border: 1px solid currentColor !important;
    border-radius: 4px !important;
    background: transparent !important;
    background-image: none !important;
    color: inherit;
    font-size: 0.95em;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    cursor: pointer;
    box-shadow: none;
}

.webpulse-gbp-reviews .webpulse-gbp-reviews__more-btn[disabled] {
    opacity: 0.5;
    cursor: default;
}

.webpulse-gbp-reviews__attribution {
    text-align: center;
    font-size: 0.85em;
    opacity: 0.6;
    margin-top: 12px;
}

.webpulse-gbp-reviews__empty {
    text-align: center;
    opacity: 0.7;
    padding: 24px 0;
}

/* -----------------------------------------------------------------
 * Location switcher (rendered when the shortcode has
 * `show_location_switcher="1"` AND the site has 2+ GBP locations).
 *
 * Minimal default styling — wraps cleanly on small screens, uses theme
 * vars when present, and gives `.is-active` a higher-contrast treatment.
 * Themes can fully restyle by targeting `.webpulse-gbp-reviews__location-btn`
 * — these defaults are intentionally low-specificity.
 * ----------------------------------------------------------------- */
.webpulse-gbp-reviews__location-switcher {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 16px;
}

.webpulse-gbp-reviews .webpulse-gbp-reviews__location-btn {
    appearance: none;
    background: transparent !important;
    background-image: none !important;
    border: 1px solid currentColor !important;
    border-radius: 999px !important;
    color: inherit;
    padding: 6px 16px !important;
    font: inherit;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    cursor: pointer;
    line-height: 1.2;
    opacity: 0.7;
    box-shadow: none;
    transition: background-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

.webpulse-gbp-reviews .webpulse-gbp-reviews__location-btn:hover {
    opacity: 1;
}

.webpulse-gbp-reviews .webpulse-gbp-reviews__location-btn.is-active {
    background: var(--color-action, currentColor);
    color: #fff;
    border-color: var(--color-action, currentColor);
    opacity: 1;
}

/* Loading state during a location swap. */
.webpulse-gbp-reviews__grid.is-loading {
    opacity: 0.5;
    pointer-events: none;
    transition: opacity 0.15s ease;
}

/* -----------------------------------------------------------------
 * Review slider variant (`[webpulse_gbp_review_slider]`).
 *
 * Different layout from the archive grid: a horizontal Swiper carousel
 * with prev/next arrows flanking the track. Card styles inherit from
 * `.webpulse-gbp-reviews__card` above; only positioning + nav chrome
 * gets new rules here.
 *
 * Themes can fully override by targeting the slider modifier classes
 * — these defaults are low-specificity and use CSS vars / currentColor
 * where possible so brand integration is one-line tweaks.
 * ----------------------------------------------------------------- */
.webpulse-gbp-reviews--slider .webpulse-gbp-reviews__slider-outer {
    position: relative;
    display: flex;
    align-items: stretch;
    gap: 8px;
}

.webpulse-gbp-reviews--slider .js-webpulse-gbp-review-slider {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
}

.webpulse-gbp-reviews--slider .swiper-slide {
    height: auto; /* let slides match tallest card in row */
    display: flex;
}

.webpulse-gbp-reviews--slider .webpulse-gbp-reviews__card--slide {
    width: 100%;
    margin-bottom: 0; /* override the masonry-card spacing */
    display: flex;
    flex-direction: column;
}

.webpulse-gbp-reviews--slider .webpulse-gbp-reviews__card--slide .webpulse-gbp-reviews__body {
    flex: 1 1 auto;
}

/* Arrow buttons — minimal default style. Theme overrides expected.
   !important on the four Elementor-kit overridden properties (bg-image,
   border-radius, padding, border) — see the more-btn comment above for
   the reasoning. */
.webpulse-gbp-reviews .webpulse-gbp-reviews__slider-arrow {
    flex: 0 0 auto;
    appearance: none;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: inherit;
    cursor: pointer;
    padding: 8px 12px !important;
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1;
    letter-spacing: 0;
    text-transform: none;
    opacity: 0.65;
    box-shadow: none;
    transition: opacity 0.15s ease;
    align-self: center;
}

.webpulse-gbp-reviews .webpulse-gbp-reviews__slider-arrow:hover,
.webpulse-gbp-reviews .webpulse-gbp-reviews__slider-arrow:focus-visible {
    opacity: 1;
}

.webpulse-gbp-reviews .webpulse-gbp-reviews__slider-arrow:disabled,
.webpulse-gbp-reviews .webpulse-gbp-reviews__slider-arrow.swiper-button-disabled {
    opacity: 0.2;
    cursor: default;
}

.webpulse-gbp-reviews__slider-pagination {
    margin-top: 16px;
    text-align: center;
    position: static;
}

/* -----------------------------------------------------------------
 * Trustindex-style slider variant (`style="trustindex"`).
 *
 * Top summary header with Google brand + rating + count + "Write a
 * review" CTA. Cards have avatar (or initial-circle fallback), name,
 * formatted date, Google G corner mark, stars + verified check, and
 * an inline Read-more toggle.
 * ----------------------------------------------------------------- */
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 16px;
    margin-bottom: 16px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 6px;
    background: #fff;
    flex-wrap: wrap;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Sub-rows: keep "4.6 ★★★★½" together as one wrap-unit, and keep
   "Excellent | 930 reviews" together as another wrap-unit. Without
   these groupings the pipe could wrap to a new line and look orphaned. */
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-rating-row,
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-summary-row {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-mark {
    display: inline-flex;
    align-items: center;
    height: 24px;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-mark .webpulse-gbp-reviews__g-mark {
    width: auto;
    height: 22px;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-label {
    font-weight: 600;
    color: #111;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-stars .webpulse-gbp-reviews__star {
    color: #fbbc05;
    font-size: 1.1em;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-stars .webpulse-gbp-reviews__star.is-filled {
    color: #fbbc05;
    opacity: 1;
}

/* Half-star — uses background-clip:text to paint the left half of the ★
   glyph at full color and the right half at the dimmed unfilled color.
   `stars_inline()` emits the `.is-half` class for the position
   immediately after the integer-rounded star when the fractional part
   is between 0.3 and 0.8 (so a 4.6 aggregate gets the 5th star half). */
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-stars .webpulse-gbp-reviews__star.is-half {
    background: linear-gradient(to right, #fbbc05 50%, rgba(251, 188, 5, 0.25) 50%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    opacity: 1;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-rating {
    font-weight: 700;
    color: #111;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__summary-divider {
    color: rgba(0, 0, 0, 0.25);
    margin: 0 4px;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand-count {
    color: #111;
    font-weight: 500;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__write-btn {
    padding: 8px 18px;
    border: 1px solid rgba(0, 0, 0, 0.4);
    border-radius: 6px;
    background: #fff;
    color: #111;
    font-weight: 600;
    text-decoration: none;
    font-size: 0.92em;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__write-btn:hover {
    background: #111;
    color: #fff;
}

/* Cards */
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__card--trustindex {
    position: relative;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 8px;
    padding: 16px;
    margin: 0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__card-header {
    align-items: center;
    margin-bottom: 8px;
    position: relative;
    /* Reserve 28px on the right so long reviewer names don't collide
       with the absolutely-positioned `.webpulse-gbp-reviews__google-corner`
       (20px G mark + 8px gap). */
    padding-right: 28px;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__card-header .webpulse-gbp-reviews__name,
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__card-header .webpulse-gbp-reviews__date {
    /* Truncate names that would still wrap into the G corner. Two-line
       break protection — slider cards are uniform so a very long single
       name shouldn't push the date below the avatar's bottom edge. */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__avatar {
    width: 36px;
    height: 36px;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__avatar--initial {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 0.95em;
    border-radius: 50%;
    user-select: none;
    flex-shrink: 0;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__meta {
    flex: 1 1 auto;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__name {
    font-weight: 600;
    color: #111;
    line-height: 1.2;
    text-transform: none;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__date {
    font-size: 0.8em;
    color: rgba(0, 0, 0, 0.55);
    margin-top: 2px;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__google-corner {
    position: absolute;
    top: 0;
    right: 0;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__google-corner .webpulse-gbp-reviews__g-mark {
    width: 20px;
    height: 20px;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__stars-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__stars-row .webpulse-gbp-reviews__star {
    color: #fbbc05;
    font-size: 1em;
    letter-spacing: 1px;
    opacity: 0.25;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__stars-row .webpulse-gbp-reviews__star.is-filled {
    opacity: 1;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__body {
    color: #1f2937;
    font-size: 0.92em;
    line-height: 1.45;
    flex: 1 1 auto;
}

/* Read-more is a <button> — !important on the kit-overridden properties
   so the link-style text appearance survives Elementor's button defaults. */
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__read-more {
    margin-top: 10px;
    appearance: none;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
    color: rgba(0, 0, 0, 0.55);
    font-size: 0.88em;
    font-weight: 500;
    cursor: pointer;
    text-align: left;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: none;
    box-shadow: none;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__read-more:hover,
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__read-more:focus-visible {
    color: #111;
    text-decoration: underline;
    background: transparent !important;
    background-image: none !important;
}

/* Trustindex-style arrows: circular outlined buttons, ~36px diameter,
   thin border, white background, soft shadow on hover. !important on
   the four base-resetted properties (border, border-radius, background,
   padding) because the base `.webpulse-gbp-reviews .__slider-arrow`
   rule uses !important to defeat Elementor — overrides need to match. */
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__slider-arrow {
    width: 40px;
    height: 40px;
    padding: 0 !important;
    border: 1px solid rgba(0, 0, 0, 0.15) !important;
    border-radius: 50% !important;
    background: #fff !important;
    background-image: none !important;
    color: rgba(0, 0, 0, 0.55);
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__slider-arrow:hover,
.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__slider-arrow:focus-visible {
    color: #111;
    border-color: rgba(0, 0, 0, 0.35) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__slider-arrow.swiper-button-disabled {
    opacity: 0.4;
    cursor: default;
    box-shadow: none;
}

@media (max-width: 639px) {
    .webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__slider-arrow {
        width: 32px;
        height: 32px;
        font-size: 1.2rem;
    }

    /* Mobile header bar: stack the brand block + Write button vertically.
       Inside the brand block, the rating-row and summary-row become
       their own lines because we set flex-direction: column on .__brand.
       The pipe stays visible because it lives inside the summary-row
       group — no orphaning. Matches the Trustindex mobile layout:

           Google
           4.6 ★★★★½
           Excellent | 930 reviews
           [Write a review] */
    .webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .webpulse-gbp-reviews--style-trustindex .webpulse-gbp-reviews__brand {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
}

/* -----------------------------------------------------------------
 * Trust Badge variants (`[webpulse_gbp_badge]`).
 *
 * Compact summary widgets — smaller than the slider/archive — meant
 * for above-the-fold trust signals, footer strips, sidebar widgets.
 * Two styles:
 *   - `--inline`  horizontal one-line strip
 *   - `--card`    boxed card with prominent G mark
 *
 * Both use `!important` on Elementor-defended properties (background,
 * border, padding, border-radius) so the badge appearance survives
 * arbitrary theme CSS — see button rules above for the same pattern.
 * ----------------------------------------------------------------- */

/* Shared — both variants. The badge renders as an <a> tag when
   `clickable="1"`, which Elementor's `.elementor-kit-XXX a` (0,1,1)
   would otherwise override — both directly AND via inheritance to
   child spans. We use !important on every inherited typography
   property so children inherit OUR values, not Elementor's accent
   typography scale. Color is left WITHOUT !important so the wordmark
   letters keep their inline-style brand colors (Google G blue/red/etc).
   Specific dark text colors are set on individual child elements
   below with their own 0,2,0 selectors that beat Elementor. */
.webpulse-gbp-badge {
    display: inline-flex;
    align-items: center;
    text-decoration: none !important;
    color: inherit;
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 1.2 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    background: transparent;
}

.webpulse-gbp-badge:hover,
.webpulse-gbp-badge:focus-visible {
    text-decoration: none !important;
}

.webpulse-gbp-badge .webpulse-gbp-badge__stars {
    color: #fbbc05;
    letter-spacing: 1px;
    font-size: 1em;
}

.webpulse-gbp-badge .webpulse-gbp-badge__stars .webpulse-gbp-reviews__star {
    opacity: 0.25;
}

.webpulse-gbp-badge .webpulse-gbp-badge__stars .webpulse-gbp-reviews__star.is-filled {
    opacity: 1;
}

.webpulse-gbp-badge .webpulse-gbp-badge__stars .webpulse-gbp-reviews__star.is-half {
    background: linear-gradient(to right, #fbbc05 50%, rgba(251, 188, 5, 0.25) 50%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    opacity: 1;
}

/* -----------------------------------------------------------------
 * Inline variant — horizontal strip:
 *   "EXCELLENT ★★★★⯨ 932 reviews  Google"
 * ----------------------------------------------------------------- */
.webpulse-gbp-badge--inline {
    gap: 8px;
    flex-wrap: wrap;
    font-size: 1em;
}

.webpulse-gbp-badge--inline .webpulse-gbp-badge__label {
    text-transform: uppercase !important;
    font-weight: 700 !important;
    color: #111 !important;
    letter-spacing: 0.04em !important;
}

.webpulse-gbp-badge--inline .webpulse-gbp-badge__count {
    color: #111 !important;
    font-weight: 600 !important;
}

.webpulse-gbp-badge--inline .webpulse-gbp-badge__wordmark {
    font-family: 'Product Sans', 'Roboto', Arial, sans-serif !important;
    font-weight: 500 !important;
    font-size: 1.1em !important;
    letter-spacing: -0.02em !important;
    margin-left: 4px;
}

.webpulse-gbp-badge--inline .webpulse-gbp-badge__wordmark-letter {
    font-family: inherit;
    font-weight: inherit;
}

/* -----------------------------------------------------------------
 * Card variant — boxed widget with prominent G mark + rating + count.
 * ----------------------------------------------------------------- */
.webpulse-gbp-badge--card {
    gap: 12px;
    padding: 12px 18px !important;
    background: #fff !important;
    background-image: none !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.webpulse-gbp-badge--card:hover,
.webpulse-gbp-badge--card:focus-visible {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 0, 0, 0.2) !important;
}

.webpulse-gbp-badge--card .webpulse-gbp-badge__mark--large {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}

.webpulse-gbp-badge--card .webpulse-gbp-badge__mark--large .webpulse-gbp-reviews__g-mark {
    width: 40px;
    height: 40px;
}

.webpulse-gbp-badge--card .webpulse-gbp-badge__content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.webpulse-gbp-badge--card .webpulse-gbp-badge__rating-row {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.webpulse-gbp-badge--card .webpulse-gbp-badge__rating {
    color: #111 !important;
    font-weight: 700 !important;
    font-size: 1.25em !important;
    line-height: 1 !important;
}

.webpulse-gbp-badge--card .webpulse-gbp-badge__stars {
    font-size: 1.05em !important;
}

.webpulse-gbp-badge--card .webpulse-gbp-badge__count {
    color: rgba(0, 0, 0, 0.6) !important;
    font-size: 0.9em !important;
}