/* Зеленые CTA в карточке и попапе ST340d */
.t-store .t-store__card__descr a,
.t-store .t-store__prod-popup__text a{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:170px; min-height:44px; padding:10px 16px; margin:8px 10px 8px 0;
  border-radius:12px; font-size:15px; font-weight:600; line-height:1; letter-spacing:.01em;
  text-decoration:none !important; border:1px solid rgba(0,120,51,.24) !important;
  background:linear-gradient(180deg,#ffffff 0%, #f6fbf7 100%) !important; color:#007833 !important;
  transition:background-color .25s, color .25s, border-color .25s, box-shadow .25s, transform .18s;
}
.t-store .t-store__card__descr a:hover,
.t-store .t-store__prod-popup__text a:hover,
.t-store .t-store__card__descr a:focus-visible,
.t-store .t-store__prod-popup__text a:focus-visible{
  color:#fff !important; border-color:#007833 !important;
  background:linear-gradient(180deg,#0a9b4b 0%, #007833 100%) !important;
  box-shadow:0 10px 24px rgba(0,120,51,.18) !important; transform:translateY(-1px);
}

/* Аптеки — мягче фон */
.t-store .t-store__card__descr a[href*="uteka.ru"],
.t-store .t-store__card__descr a[href*="b-apteka.ru"],
.t-store .t-store__card__descr a[href*="aptekiplus.ru"],
.t-store .t-store__card__descr a[href*="megapteka.ru"],
.t-store .t-store__prod-popup__text a[href*="uteka.ru"],
.t-store .t-store__prod-popup__text a[href*="b-apteka.ru"],
.t-store .t-store__prod-popup__text a[href*="aptekiplus.ru"],
.t-store .t-store__prod-popup__text a[href*="megapteka.ru"]{
  background:linear-gradient(180deg,#ffffff 0%, #fbfdfb 100%) !important;
  color:#007833 !important; border:1px solid rgba(0,120,51,.30) !important; box-shadow:0 4px 14px rgba(0,120,51,.06) !important;
}

/* Премиальная кнопка «Отзывы» */
.t-store .t-store__card__descr a[href^="#popup:reviews"],
.t-store .t-store__prod-popup__text a[href^="#popup:reviews"]{
  display:inline-flex; flex-direction:column; align-items:flex-start; justify-content:center;
  min-width:240px; min-height:72px; padding:14px 16px; gap:6px; border-radius:16px;
  background:linear-gradient(180deg,#ffffff 0%, #edf8f0 100%) !important; color:#007833 !important;
  border:1px solid rgba(0,120,51,.30) !important;
  box-shadow:0 10px 28px rgba(0,120,51,.12), inset 0 1px 0 rgba(255,255,255,.85) !important;
  text-align:left; line-height:1.2;
}
.t-store .t-store__card__descr a[href^="#popup:reviews"]:hover,
.t-store .t-store__prod-popup__text a[href^="#popup:reviews"]:hover{ color:#fff !important; }

/* Внутренности */
.stm-revbtn{ display:flex; flex-direction:column; gap:6px; }
.stm-revbtn__top{ display:flex; align-items:center; gap:8px; }
.stm-revbtn__label{ font-size:16px; font-weight:700; }
.stm-revbtn__badge{ display:inline-flex; align-items:center; justify-content:center; min-width:28px; height:20px; padding:0 8px;
  border-radius:999px; background:rgba(0,120,51,.12); font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.stm-revbtn__bottom{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.stm-revbtn__stars{ display:inline-flex; gap:2px; line-height:1; }
.stm-revbtn__star{ font-size:15px; color:rgba(0,120,51,.25); }
.stm-revbtn__star.active{ color:#ffb400; }
.stm-revbtn__avg{ font-size:15px; font-weight:700; }
.stm-revbtn__count{ font-size:13px; opacity:.85; }

@media (max-width:640px){
  .t-store .t-store__card__descr a,
  .t-store .t-store__prod-popup__text a{ min-width:150px; min-height:42px; padding:10px 12px; margin:6px 6px 6px 0; font-size:14px; border-radius:10px; }
  .t-store .t-store__card__descr a[href^="#popup:reviews"],
  .t-store .t-store__prod-popup__text a[href^="#popup:reviews"]{ min-width:100%; min-height:68px; padding:14px; border-radius:14px; }
  .stm-revbtn__label{ font-size:15px; } .stm-revbtn__star{ font-size:14px; } .stm-revbtn__avg{ font-size:14px; } .stm-revbtn__count{ font-size:12px; }
}
</style>



<div id="stm-reviews-widget">
  
    .stm-reviews{max-width:860px;margin:0 auto 10px;font-family:Arial,sans-serif;color:#1f1f1f;}
    .stm-head{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:18px;}
    .stm-title{margin:0;font-size:28px;font-weight:700;}
    .stm-sum{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#f7faf7;border:1px solid #e4efe4;border-radius:16px;padding:10px 14px;}
    .stm-avg{font-size:26px;font-weight:700;color:#111;line-height:1;}
    .stm-stars{display:inline-flex;gap:4px;line-height:1;}
    .stm-stars .star{color:#d6d6d6;font-size:18px;}
    .stm-stars .star.active{color:#ffb400;}
    .stm-bars{display:grid;gap:8px;margin-bottom:18px;}
    .stm-bar{display:grid;grid-template-columns:42px 1fr 48px;gap:10px;align-items:center;font-size:14px;color:#555;}
    .stm-track{height:10px;background:#eef5ee;border-radius:999px;overflow:hidden;}
    .stm-fill{height:100%;width:0;background:#007833;border-radius:999px;}

    .stm-form{background:linear-gradient(180deg,#fafafa 0%, #f6f6f6 100%);border:1px solid #ececec;border-radius:16px;padding:18px;margin-bottom:18px;}
    .stm-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
    .stm-form input,.stm-form textarea{width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid #ddd;border-radius:12px;font-size:16px;background:#fff;outline:none;transition:border-color .2s, box-shadow .2s;margin-bottom:12px;}
    .stm-form input:focus,.stm-form textarea:focus{border-color:#007833;box-shadow:0 0 0 3px rgba(0,120,51,.10);}
    .stm-form textarea{min-height:120px;resize:vertical;}

    .stm-lbl{display:block;margin:2px 0 8px;font-size:14px;color:#555;font-weight:600;}
    .stm-rate{margin-bottom:12px;}
    .stm-rate-stars{display:inline-flex;gap:8px;flex-direction:row-reverse;}
    .stm-rate-stars input{display:none;}
    .stm-rate-stars label{font-size:30px;color:#cfd8cf;cursor:pointer;transition:color .2s, transform .2s;line-height:1;margin:0;}
    .stm-rate-stars label:hover,.stm-rate-stars label:hover ~ label,.stm-rate-stars input:checked ~ label{color:#ffb400;}
    .stm-rate-stars label:hover{transform:scale(1.05);}

    .stm-bottom{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-top:4px;}
    .stm-note{font-size:13px;color:#777;}
    .stm-btn{display:inline-flex;align-items:center;justify-content:center;background:#007833;color:#fff;border:1px solid #007833;border-radius:12px;padding:12px 18px;font-size:16px;font-weight:700;cursor:pointer;transition:transform .2s,opacity .2s;}
    .stm-btn:hover{transform:translateY(-1px);opacity:.96;}
    .stm-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;}
    .stm-msg{display:none;margin-top:10px;font-size:14px;line-height:1.45;border-radius:12px;padding:10px 12px;}
    .stm-msg.error{background:rgba(198,40,40,.08);color:#b71c1c;}
    .stm-msg.success{background:rgba(0,120,51,.08);color:#0b5a2c;}

    .stm-list{display:flex;flex-direction:column;gap:12px;}
    .stm-card{display:grid;grid-template-columns:40px 1fr;gap:12px;background:#fff;border:1px solid #ececec;border-radius:16px;padding:14px;box-shadow:0 6px 20px rgba(0,0,0,.04);}
    .stm-ava{width:40px;height:40px;border-radius:50%;background:#007833;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;}
    .stm-ctop{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;flex-wrap:wrap;margin-bottom:6px;}
    .stm-name{font-size:15px;font-weight:700;color:#111;}
    .stm-date{font-size:12px;color:#777;}
    .stm-crating{margin-bottom:6px;}
    .stm-text{font-size:15px;line-height:1.7;color:#333;white-space:pre-wrap;word-break:break-word;}
    .stm-empty,.stm-loading{text-align:center;color:#777;padding:14px 0;font-size:15px;}

    @media(max-width:640px){
      .stm-title{font-size:24px;}
      .stm-row{grid-template-columns:1fr;}
      .stm-rate-stars label{font-size:28px;}
    }
  </style>

  <div class="stm-reviews">
    <div class="stm-head">
      <h3 class="stm-title">Отзывы</h3>
      <div class="stm-sum">
        <div class="stm-avg" id="rAvg">0.0</div>
        
          <div class="stm-stars" id="rAvgStars"></div>
          <div id="rCount">0 отзывов</div>
        </div>
      </div>
    </div>

    <div class="stm-bars" id="rBars"></div>

    <div class="stm-form">
      <div class="stm-row">
        <input type="text" id="rName" placeholder="Ваше имя *" maxlength="80"/>
        <input type="email" id="rEmail" placeholder="Email" maxlength="120"/>
      </div>

      <div class="stm-rate">
        <span class="stm-lbl">Оценка *</span>
        <div class="stm-rate-stars">
          <input type="radio" id="r5" name="rv" value="5"/><label for="r5">★</label>
          <input type="radio" id="r4" name="rv" value="4"/><label for="r4">★</label>
          <input type="radio" id="r3" name="rv" value="3"/><label for="r3">★</label>
          <input type="radio" id="r2" name="rv" value="2"/><label for="r2">★</label>
          <input type="radio" id="r1" name="rv" value="1"/><label for="r1">★</label>
        </div>
      </div>

      <textarea id="rText" placeholder="Напишите отзыв *" maxlength="2000"></textarea>
      <input type="text" id="rWebsite" class="stm-hp" name="website" tabindex="-1" autocomplete="off" style="position:absolute;left:-9999px;opacity:0;" />

      <div class="stm-bottom">
        <div class="stm-note">Отзыв публикуется сразу.</div>
        <button type="button" class="stm-btn" id="rSend">Отправить отзыв</button>
      </div>

      <div class="stm-msg error" id="rErr"></div>
      <div class="stm-msg success" id="rOk"></div>
    </div>

    <div class="stm-list" id="rList">
      <div class="stm-loading">Загрузка отзывов...</div>
    </div>
  </div>

  
</div>