.star_rating_container {
   display: inline-block;
   vertical-align: middle;
   margin-right: var(--spacing-sm);
   margin-top: var(--spacing-sm);
}

.star_rating {
   unicode-bidi: bidi-override;
   direction: rtl;
   list-style: none;
   margin: 0;
   padding: 0;
   vertical-align: middle;
}

.star_rating li a:hover,
.star_rating .current_rating {
   vertical-align: middle;
}

td .star_rating {
   margin-left: auto;
   margin-right: auto;
   width: 120px;
   position: relative;
}

.star_rating li {
   margin-left: var(--spacing-sm);
   float: right;
   unicode-bidi: bidi-override;
}

.star_rating li a {
   color: var(--star-color, #97adb9);
   text-decoration: none;
   font-size: 0; /* Hide text */
}

.star_rating li a:before {
   font-family: 'Font Awesome 5 Free';
   content: "\f005";
   font-size: var(--star-size, 14px);
   font-weight: 900;
}

/* Firefox-specific override */
@-moz-document url-prefix() {
   .star_rating li a:before {
      font-size: 18px;
      position: relative;
      top: -5px;
   }
}

.star_rating_notrated li:hover a,
.star_rating_notrated li:hover ~ li a {
   color: var(--star-hover, #e6e600) !important;
   cursor: pointer;
}

li.current_rating[style*="20"] ~ li a.one_star,
li.current_rating[style*="40"] ~ li:nth-child(n+5) a,
li.current_rating[style*="60"] ~ li:nth-child(n+4) a,
li.current_rating[style*="80"] ~ li:nth-child(n+3) a,
li[style*="100"] ~ li:nth-child(n+2) a {
   color: var(--star-active, #eab71f);
}

.star_rating .current_rating {
   unicode-bidi: bidi-override;
   direction: ltr;
   display: none;
   float: left;
   text-align: right;
   position: relative;
   top: 1px;
   right: 3px;
}

.inline_rating {
   float: left;
   vertical-align: middle;
   padding-right: var(--spacing-sm);
}

.star_rating_success,
.success_message {
   color: var(--success-color, #00b200);
   font-weight: bold;
   font-size: var(--font-xs, 10px);
   margin-bottom: var(--spacing-md);
}

td[id*="rating_table"] {
   text-align: center;
   margin: 0 auto;
}