/* =========================
   Root + color variables
   ========================= */
.rus-rateus {
  display: flex;

  /* Defaults (overridden by Elementor controls) */
  --rus-star-unfilled: #BDBDBD;
  --rus-star-filled: #F5B301;
}

/* =========================
   Layout
   ========================= */
.rus-rateus__inner {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.rus-rateus__label {
  line-height: 1;
}

.rus-rateus__stars {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* =========================
   Star button reset
   ========================= */
.rus-rateus__star {
  appearance: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  line-height: 1;
  background: transparent !important;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  transition: transform 0.12s ease;
}

.rus-rateus__star:hover,
.rus-rateus__star:focus,
.rus-rateus__star:active {
  background: transparent !important;
  box-shadow: none !important;
  outline: none;
}

/* =========================
   SVG icon coloring
   ========================= */

/* Unfilled (default) */
.rus-rateus__star svg,
.rus-rateus__star svg * {
  fill: var(--rus-star-unfilled);
  stroke: var(--rus-star-unfilled);
  transition: fill 0.15s ease, stroke 0.15s ease, transform 0.12s ease;
}

/* Filled (hover preview via JS .is-filled) */
.rus-rateus__star.is-filled svg,
.rus-rateus__star.is-filled svg * {
  fill: var(--rus-star-filled);
  stroke: var(--rus-star-filled);
}

/* Micro interaction */
.rus-rateus__star:hover {
  transform: translateY(-1px) scale(1.04);
}

/* =========================
   Note
   ========================= */
.rus-rateus__note {
  font-size: 12px;
  opacity: 0.7;
  margin-left: 8px;
}

/* =========================
   Presets
   ========================= */

/* Minimal */
.rus-rateus--minimal .rus-rateus__inner {
  background: transparent;
  padding: 0;
  border-radius: 0;
}

/* Badge */
.rus-rateus--badge .rus-rateus__inner {
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.12);
}

/* Card */
.rus-rateus--card .rus-rateus__inner {
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid rgba(0, 0, 0, 0.10);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
}

/* Pill */
.rus-rateus--pill .rus-rateus__inner {
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0, 0, 0, 0.12);
}

.rus-rateus--pill .rus-rateus__label {
  padding-right: 10px;
  border-right: 1px solid rgba(0, 0, 0, 0.12);
}