/**
 * Star Rating Component Styles
 *
 * Uses SVG files: star-full.svg, star-half.svg, star-empty.svg
 * SVGs use currentColor for CSS-based color control.
 *
 * Variants:
 * - .star-rating--full    : Shows all stars (default)
 * - .star-rating--compact : Shows 1 star + value
 * - .star-rating--simple  : Value only, no stars
 *
 * Sizes:
 * - .star-rating--sm : Small (12px stars)
 * - .star-rating--md : Medium (16px stars, default)
 * - .star-rating--lg : Large (20px stars)
 *
 * Color customization via CSS variables (set via inline style from PHP):
 * - --star-color-filled : Color for filled stars (default: #FFBB00)
 * - --star-color-empty  : Color for empty stars (default: #CDCDCD)
 */
.star-rating {
  --star-color-filled: #FFBB00;
  --star-color-empty: #CDCDCD;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.star-rating__label {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--wp--preset--color--text-muted, #6b7280);
}
.star-rating__content {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}
.star-rating__stars {
  display: inline-flex;
  align-items: center;
  gap: 0.125rem;
  line-height: 1;
}
.star-rating__star {
  display: block;
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
}
.star-rating__star--filled {
  color: var(--star-color-filled);
}
.star-rating__star--empty {
  color: var(--star-color-empty);
}
.star-rating__value {
  font-weight: 600;
  color: var(--wp--preset--color--text-heading, #111827);
  white-space: nowrap;
  line-height: 1;
}
.star-rating__value-max {
  font-weight: 400;
  color: var(--wp--preset--color--text-muted, #6b7280);
}
.star-rating--sm {
  gap: 0.375rem;
}
.star-rating--sm .star-rating__stars {
  gap: 0.0625rem;
}
.star-rating--sm .star-rating__star {
  width: 0.75rem;
  height: 0.75rem;
}
.star-rating--sm .star-rating__content {
  gap: 0.25rem;
}
.star-rating--sm .star-rating__value {
  font-size: 0.8125rem;
}
.star-rating--sm .star-rating__value-max {
  font-size: 0.6875rem;
}
.star-rating--sm .star-rating__label {
  font-size: 0.75rem;
}
.star-rating--md .star-rating__star {
  width: 1rem;
  height: 1rem;
}
.star-rating--md .star-rating__value {
  font-size: 1rem;
}
.star-rating--md .star-rating__value-max {
  font-size: 0.8125rem;
}
.star-rating--lg {
  gap: 0.625rem;
}
.star-rating--lg .star-rating__stars {
  gap: 0.1875rem;
}
.star-rating--lg .star-rating__star {
  width: 1.25rem;
  height: 1.25rem;
}
.star-rating--lg .star-rating__content {
  gap: 0.5rem;
}
.star-rating--lg .star-rating__value {
  font-size: 1.125rem;
}
.star-rating--lg .star-rating__value-max {
  font-size: 0.9375rem;
}
.star-rating--lg .star-rating__label {
  font-size: 1rem;
}
.star-rating--simple .star-rating__content {
  gap: 0;
}
.star-rating--compact .star-rating__stars--compact .star-rating__star {
  width: 1rem;
  height: 1rem;
}
.star-rating--compact.star-rating--sm .star-rating__stars--compact .star-rating__star {
  width: 0.875rem;
  height: 0.875rem;
}
.star-rating--compact.star-rating--lg .star-rating__stars--compact .star-rating__star {
  width: 1.25rem;
  height: 1.25rem;
}
.star-rating--responsive .star-rating__stars .star-rating__star:not(:first-child) {
  display: none;
}
@container (min-width: 900px) {
  .star-rating--responsive .star-rating__stars .star-rating__star:not(:first-child) {
    display: block;
  }
}
.star-rating--responsive .star-rating__label {
  display: none;
}
@container (min-width: 900px) {
  .star-rating--responsive .star-rating__label {
    display: block;
  }
}

/*# sourceMappingURL=star-rating.css.map */
