<div class="trustpilot-review" style='--rating:{{ block.settings.rating }};--star-color:{{ block.settings.star_color }};--bg-star-color:{{ block.settings.bg_star_color }};--font-size:{{ block.settings.size | divided_by: 10.0 }}rem;--alignment:{{ block.settings.alignment }};--verified-color:{{ block.settings.verified_color | default: "#00b67a" }};--avatar-bg-color:{{ block.settings.avatar_bg_color | default: "#00b67a" }};--avatar-text-color:{{ block.settings.avatar_text_color | default: "#ffffff" }};--border-color:{{ block.settings.border_color | default: "#e0e0e0" }};--border-radius:{{ block.settings.border_radius | default: 4 }}px;--background-color:{{ block.settings.background_color | default: "#ffffff" }};{% if margins %}--margin-top: {{ block.settings.margin_top | divided_by: 10.0 }}rem;--margin-bottom: {{ block.settings.margin_bottom | divided_by: 10.0 }}rem;{% endif %}' {% if block_attributes %}{{ block.shopify_attributes }}{% endif %}>
  
  <!-- Header with verification badge -->
  <div class="trustpilot-review__header">
    {% if block.settings.verification_badge %}
      <div class="trustpilot-review__verified">
        <svg width="14" height="14" viewBox="0 0 16 16" fill="none">
          <circle cx="8" cy="8" r="7" fill="{{ block.settings.verified_color | default: '#00b67a' }}"/>
          <path d="M5.5 8L7 9.5L10.5 6" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
        </svg>
                  {{ block.settings.verified_text | default: "Verified" }}
      </div>
    {% endif %}
  </div>
  
  <!-- Review Text -->
  {% if block.settings.review_text != blank %}
    <div class="trustpilot-review__text">
      {{ block.settings.review_text }}
    </div>
  {% endif %}
  
  <!-- Bottom Row: Customer Info and Stars -->
  <div class="trustpilot-review__bottom">
    <!-- Customer Info -->
    <div class="trustpilot-review__customer">
      {% if block.settings.customer_initial != blank %}
        <div class="trustpilot-review__avatar">
          {{ block.settings.customer_initial }}
        </div>
      {% endif %}
      
      {% if block.settings.customer_name != blank %}
        <div class="trustpilot-review__name">
          {{ block.settings.customer_name }}
        </div>
      {% endif %}
    </div>
    
    <!-- Review Stars -->
    <div class='rating-stars-and-text'>
      <div class='rating-stars__container rating-stars__container--underlay'>
        <svg height="469" width="2500" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 96" class='trustpilot-stars-svg'>
          <path fill="{{ block.settings.bg_star_color }}" d="M0 0h96v96H0zM104 0h96v96h-96zM208 0h96v96h-96zM312 0h96v96h-96zM416 0h96v96h-96z"/>
          <path fill="{{ block.settings.star_symbol_color }}" d="M48 64.7L62.6 61l6.1 18.8zm33.6-24.3H55.9L48 16.2l-7.9 24.2H14.4l20.8 15-7.9 24.2 20.8-15 12.8-9.2zM152 64.7l14.6-3.7 6.1 18.8zm33.6-24.3h-25.7L152 16.2l-7.9 24.2h-25.7l20.8 15-7.9 24.2 20.8-15 12.8-9.2zM256 64.7l14.6-3.7 6.1 18.8zm33.6-24.3h-25.7L256 16.2l-7.9 24.2h-25.7l20.8 15-7.9 24.2 20.8-15 12.8-9.2zM360 64.7l14.6-3.7 6.1 18.8zm33.6-24.3h-25.7L360 16.2l-7.9 24.2h-25.7l20.8 15-7.9 24.2 20.8-15 12.8-9.2zM464 64.7l14.6-3.7 6.1 18.8zm33.6-24.3h-25.7L464 16.2l-7.9 24.2h-25.7l20.8 15-7.9 24.2 20.8-15 12.8-9.2z" />
        </svg>
        <div class='rating-stars__container rating-stars__container--overlay'>
          <svg height="469" width="2500" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 96" class='trustpilot-stars-svg'>
            <path fill="{{ block.settings.star_color }}" d="M0 0h96v96H0zM104 0h96v96h-96zM208 0h96v96h-96zM312 0h96v96h-96zM416 0h96v96h-96z"/>
            <path fill="{{ block.settings.star_symbol_color }}" d="M48 64.7L62.6 61l6.1 18.8zm33.6-24.3H55.9L48 16.2l-7.9 24.2H14.4l20.8 15-7.9 24.2 20.8-15 12.8-9.2zM152 64.7l14.6-3.7 6.1 18.8zm33.6-24.3h-25.7L152 16.2l-7.9 24.2h-25.7l20.8 15-7.9 24.2 20.8-15 12.8-9.2zM256 64.7l14.6-3.7 6.1 18.8zm33.6-24.3h-25.7L256 16.2l-7.9 24.2h-25.7l20.8 15-7.9 24.2 20.8-15 12.8-9.2zM360 64.7l14.6-3.7 6.1 18.8zm33.6-24.3h-25.7L360 16.2l-7.9 24.2h-25.7l20.8 15-7.9 24.2 20.8-15 12.8-9.2zM464 64.7l14.6-3.7 6.1 18.8zm33.6-24.3h-25.7L464 16.2l-7.9 24.2h-25.7l20.8 15-7.9 24.2 20.8-15 12.8-9.2z" />
          </svg>
        </div>
      </div>
    </div>
  </div>
</div>