.sc4-reviews-card{
  margin: 0;
}

.sc4-reviews{
  width: 100%;

  /* StarRating.js (Paul Ryley) uses CSS variables for star colors. */
  --gl-star-color: #d11a1a;               /* active star (red) */
  --gl-star-color-inactive: rgba(255,255,255,0.22); /* inactive star */
  --gl-tooltip-background: rgba(0,0,0,0.85);
  --gl-tooltip-color: rgba(255,255,255,0.95);
}

/*
  Force star colors even if the vendor stylesheet is cached/missed.
  StarRating.js uses inline SVG with .gl-star-full classes.
*/
.sc4-reviews [data-star-rating] .gl-star-full{
  fill: var(--gl-star-color-inactive) !important;
  stroke: var(--gl-star-color-inactive) !important;
}

.sc4-reviews [data-star-rating] .gl-active .gl-star-full{
  fill: var(--gl-star-color) !important;
  stroke: var(--gl-star-color) !important;
}

.sc4-reviews__header{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:12px;
  margin-bottom:14px;
}

.sc4-reviews__title{
  font-size:16px;
  font-weight:700;
  letter-spacing:0.02em;
  text-transform:uppercase;
}

.sc4-reviews__meta{
  opacity:0.9;
  font-size:13px;
  white-space:nowrap;
}

.sc4-reviews__avg{
  font-size:18px;
  font-weight:700;
}

.sc4-reviews__summary{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:18px;
}

.sc4-reviews__row{
  width:100%;
  display:grid;
  grid-template-columns:64px 1fr 100px;
  gap:10px;
  align-items:center;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:10px;
  background:rgba(0,0,0,0.18);
  color:inherit;
  cursor:pointer;
}

.sc4-reviews__row:hover{
  border-color:rgba(255,255,255,0.22);
  background:rgba(0,0,0,0.25);
}

.sc4-reviews__label{
  font-weight:700;
  opacity:0.9;
}

.sc4-reviews__bar{
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,0.12);
  overflow:hidden;
}

.sc4-reviews__barFill{
  display:block;
  height:100%;
  width:0;
  background:rgba(255,255,255,0.55);
}

.sc4-reviews__right{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  font-size:12px;
  opacity:0.9;
}

.sc4-reviews__allRow{
  margin-top:6px;
}

.sc4-reviews__allBtn{
  width:100%;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
  color:inherit;
  cursor:pointer;
}

.sc4-reviews__allBtn:hover{border-color:rgba(255,255,255,0.22);background:rgba(0,0,0,0.25);} 

.sc4-reviews__formWrap{
  margin-top:16px;
}

.sc4-reviews__formTitle{
  font-size:13px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.02em;
  opacity:0.9;
  margin-bottom:10px;
}

.sc4-reviews__field{margin-bottom:10px;}

.sc4-reviews__field label{
  display:block;
  font-size:12px;
  opacity:0.85;
  margin-bottom:6px;
}

.sc4-reviews__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

@media (max-width:680px){
  .sc4-reviews__grid{grid-template-columns:1fr;}
  .sc4-reviews__row{grid-template-columns:54px 1fr 90px;}
}

.sc4-reviews__field input,
.sc4-reviews__field select,
.sc4-reviews__field textarea{
  width:100%;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
  color:inherit;
  box-sizing:border-box;
}

/* Native select dropdown readability (Chrome/Firefox) */
.sc4-reviews__field select{
  color-scheme: dark;
}

.sc4-reviews__field select option{
  background-color:#0b0b0b;
  color:#f2f2f2;
}

.sc4-reviews__field input:focus,
.sc4-reviews__field select:focus,
.sc4-reviews__field textarea:focus{
  outline: 2px solid rgba(255,255,255,0.22);
  outline-offset: 2px;
}

.sc4-reviews__field textarea{resize:vertical;min-height:120px;}

.sc4-reviews__starsInput{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.sc4-reviews__starChoice{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 8px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(0,0,0,0.18);
  cursor:pointer;
  user-select:none;
}

.sc4-reviews__starChoice input{margin:0;}

.sc4-reviews__actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:6px;
}

.sc4-reviews__submit{
  padding:10px 14px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,0.16);
  background:rgba(255,255,255,0.12);
  color:inherit;
  cursor:pointer;
  font-weight:700;
}

.sc4-reviews__submit:hover{background:rgba(255,255,255,0.18);} 

.sc4-reviews__msg{font-size:12px;opacity:0.9;}
.sc4-reviews__hp{position:absolute;left:-99999px;top:-99999px;opacity:0;}

/* Modal */
.sc4-reviews__modal{position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center;}
.sc4-reviews__modal[hidden]{display:none;}
.sc4-reviews__backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.72);} 
.sc4-reviews__modalPanel{position:relative;z-index:2;max-width:820px;width:92vw;max-height:86vh;overflow:hidden;}
.sc4-reviews__modalHeader{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;}
.sc4-reviews__modalTitle{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:0.02em;opacity:0.95;}
.sc4-reviews__modalClose{background:transparent;border:0;color:inherit;font-size:28px;line-height:1;cursor:pointer;opacity:0.85;} 
.sc4-reviews__modalClose:hover{opacity:1;}
.sc4-reviews__modalBody{max-height:78vh;overflow:auto;padding-right:4px;}
.sc4-reviews__modalControls{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px;} 
.sc4-reviews__modalFilter{font-size:12px;opacity:0.9;}
.sc4-reviews__modalPager{display:flex;align-items:center;gap:10px;font-size:12px;opacity:0.9;} 
.sc4-reviews__modalPager button{padding:6px 10px;border-radius:10px;border:1px solid rgba(255,255,255,0.12);background:rgba(0,0,0,0.18);color:inherit;cursor:pointer;} 
.sc4-reviews__modalPager button:disabled{opacity:0.4;cursor:default;}
.sc4-reviews__list{display:flex;flex-direction:column;gap:10px;}
.sc4-reviews__review{padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,0.12);background:rgba(0,0,0,0.18);} 
.sc4-reviews__reviewTop{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:6px;}
.sc4-reviews__reviewName{font-weight:800;}
.sc4-reviews__reviewStars{opacity:0.9;}
.sc4-reviews__reviewMeta{font-size:12px;opacity:0.75;margin-bottom:8px;}
.sc4-reviews__reviewText{white-space:pre-wrap;line-height:1.35;}
