.wtps-rating {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    flex-wrap: nowrap;
    gap: calc(var(--rating-size) * 0.25);
}

.wtps-rating .wtps-star {
    display: inline-block !important;
    width: var(--rating-size, 24px) !important;
    height: var(--rating-size, 24px) !important;
    min-width: var(--rating-size, 24px) !important;
    min-height: var(--rating-size, 24px) !important;
    max-width: var(--rating-size, 24px) !important;
    max-height: var(--rating-size, 24px) !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    pointer-events: none;
}

.wtps-rating .wtps-star-full {
    fill: var(--ratingcolor, #f59e0b);
    color: var(--ratingcolor, #f59e0b);
}

.wtps-rating .wtps-star-empty {
    fill: var(--ratingcolorempty, #d1d5db);
    color: var(--ratingcolorempty, #d1d5db);
    opacity: 0.65;
}

.layoutElement:has(.wtps-rating) {
    width: auto;
    height: auto;
}