/* ===========================
   Product Reviews & Rating UI
   =========================== */

.product-reviews{
  margin-top: 22px;
  padding: 18px 18px 16px;
  border-radius: 16px;
  border: 1px solid rgba(0,255,255,.12);
  background: linear-gradient(135deg, rgba(10,20,30,.55), rgba(10,20,30,.35));
  box-shadow: 0 0 24px rgba(0,255,255,.08);
}

.reviews-title{
  margin: 0 0 10px;
  font-size: 18px;
  letter-spacing: .5px;
}

.reviews-stats{
  margin: 10px 0 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(0,255,255,.06);
  border: 1px solid rgba(0,255,255,.10);
}

.reviews-summary{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}

.reviews-score{
  font-size: 16px;
  font-weight: 800;
}
.reviews-score span{
  font-weight: 600;
  opacity: .7;
}

.reviews-stars{
  opacity: .85;
  font-size: 14px;
  letter-spacing: 1px;
}

.reviews-count{
  opacity: .75;
}

.reviews-list{
  display:flex;
  flex-direction: column;
  gap: 10px;
  margin: 10px 0 14px;
}

.reviews-empty{
  opacity: .8;
  padding: 10px 2px;
}

.review-card{
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(10,20,30,.55);
  border: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 0 18px rgba(0,0,0,.25);
}

.review-head{
  display:flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  align-items: baseline;
}

.review-name{
  font-weight: 800;
  letter-spacing: .2px;
}

.review-date{
  opacity: .75;
  font-size: 12px;
}

.review-stars{
  margin-top: 6px;
  opacity: .9;
  font-size: 14px;
}

.review-text{
  margin-top: 8px;
  line-height: 1.45;
  opacity: .92;
  white-space: pre-wrap;
  word-break: break-word;
}

/* Form */
.review-form-wrap{
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.08);
}

.review-form-title{
  margin: 0 0 10px;
  font-size: 15px;
  opacity: .95;
}

.review-form{
  display:flex;
  flex-direction: column;
  gap: 12px;
}

.review-form-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 12px;
}

@media (max-width: 900px){
  .review-form-grid{
    grid-template-columns: 1fr;
  }
}

.review-field{
  display:flex;
  flex-direction: column;
  gap: 6px;
}

.review-field-full{
  grid-column: 1 / -1;
}

.review-label{
  opacity: .8;
  font-size: 12px;
}

.review-input{
  border-radius: 12px;
}

.review-textarea{
  resize: vertical;
  min-height: 90px;
}

.review-actions{
  display:flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.review-submit{
  min-width: 140px;
}

.review-msg{
  opacity: .8;
}


/* --- Controls (inputs/select/textarea) --- */
.review-input,
.review-textarea,
.review-form select.review-input{
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,255,255,.16);
  background: rgba(8,16,24,.55);
  color: rgba(235,255,255,.95);
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}

.review-input::placeholder,
.review-textarea::placeholder{
  color: rgba(200,220,230,.55);
}

.review-input:hover,
.review-textarea:hover{
  border-color: rgba(0,255,255,.26);
  background: rgba(8,16,24,.62);
}

.review-input:focus,
.review-textarea:focus{
  border-color: rgba(0,255,255,.45);
  box-shadow: 0 0 0 3px rgba(0,255,255,.14);
  background: rgba(8,16,24,.68);
}

.review-form select.review-input{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 38px;
  background-image:
          linear-gradient(45deg, transparent 50%, rgba(0,255,255,.7) 50%),
          linear-gradient(135deg, rgba(0,255,255,.7) 50%, transparent 50%),
          linear-gradient(to right, transparent, transparent);
  background-position:
          calc(100% - 18px) 55%,
          calc(100% - 12px) 55%,
          calc(100% - 2.2rem) 0.5rem;
  background-size: 6px 6px, 6px 6px, 1px 1.6rem;
  background-repeat: no-repeat;
}

.review-textarea{
  min-height: 110px;
  line-height: 1.4;
}

/* Submit button polish (uses your existing .btn-primary gradient if present) */
.review-submit{
  border-radius: 14px;
  padding: 10px 16px;
}

/* Tighten layout a bit */
.review-form-grid{
  align-items: end;
}

.review-field-full{
  margin-top: -4px;
}

/* ==========================================================
   FORCE STYLES FOR REVIEW FORM CONTROLS (STRONG)
   Если у input/select/textarea нет классов или другие стили перебивают —
   применяем жёстко внутри .product-reviews.
   ========================================================== */

.product-reviews input:not([type="radio"]):not([type="checkbox"]),
.product-reviews select,
.product-reviews textarea{
  width: 100% !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(0,255,255,.16) !important;
  background: rgba(8,16,24,.55) !important;
  color: rgba(235,255,255,.95) !important;
  outline: none !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03) !important;
  font: inherit !important;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease !important;
}

.product-reviews textarea{
  resize: vertical !important;
  min-height: 110px !important;
  line-height: 1.4 !important;
}

.product-reviews input::placeholder,
.product-reviews textarea::placeholder{
  color: rgba(200,220,230,.55) !important;
}

.product-reviews input:not([type="radio"]):not([type="checkbox"]):hover,
.product-reviews select:hover,
.product-reviews textarea:hover{
  border-color: rgba(0,255,255,.26) !important;
  background: rgba(8,16,24,.62) !important;
}

.product-reviews input:not([type="radio"]):not([type="checkbox"]):focus,
.product-reviews select:focus,
.product-reviews textarea:focus{
  border-color: rgba(0,255,255,.45) !important;
  box-shadow: 0 0 0 3px rgba(0,255,255,.14) !important;
  background: rgba(8,16,24,.68) !important;
}

/* Select arrow styling */
.product-reviews select{
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  padding-right: 38px !important;
  background-image:
          linear-gradient(45deg, transparent 50%, rgba(0,255,255,.7) 50%),
          linear-gradient(135deg, rgba(0,255,255,.7) 50%, transparent 50%),
          linear-gradient(to right, transparent, transparent) !important;
  background-position:
          calc(100% - 18px) 55%,
          calc(100% - 12px) 55%,
          calc(100% - 2.2rem) 0.5rem !important;
  background-size: 6px 6px, 6px 6px, 1px 1.6rem !important;
  background-repeat: no-repeat !important;
}

.product-reviews option{
  background: rgb(8,16,24) !important;
  color: rgba(235,255,255,.95) !important;
}

/* Submit button fallback */
.product-reviews button[type="submit"],
.product-reviews .review-submit{
  border: 0 !important;
  border-radius: 14px !important;
  padding: 10px 18px !important;
  min-width: 140px !important;
  font-weight: 800 !important;
  letter-spacing: .8px !important;
  color: #071018 !important;
  background: linear-gradient(90deg, rgba(0,255,255,0.95), rgba(255,0,255,0.85)) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.35), 0 0 22px rgba(0,255,255,.16) !important;
  cursor: pointer !important;
  transition: transform .15s ease, box-shadow .2s ease, filter .2s ease !important;
}

.product-reviews button[type="submit"]:hover,
.product-reviews .review-submit:hover{
  transform: translateY(-1px) !important;
  filter: brightness(1.04) !important;
}