.inside-page-top {
  margin-top: 7.6rem;
}

.breadcrumb-item a {
  color: #666666;
  font-size: 14px;
}

.breadcrumb-item.active {
  color: #ed1944;
  font-size: 14px;
}

.color-picker {
  display: flex;
  gap: 10px;
}

.color-option {
  width: 60px;
  height: 60px;
  cursor: pointer;
  border: 2px solid rgba(0, 0, 0, 0.102);
  transition: all 0.3s ease;
}


.color-option-22 {
  width: 17px;
  height: 17px;
  display: flex;
  top: -5px;
  left: -5px;
}

.red-filter {
  filter: invert(26%) sepia(92%) saturate(5682%) hue-rotate(-1deg)
    brightness(85%) contrast(102%);
}

/* حالت انتخاب‌شده */
.color-picker input[type="radio"] {
  display: none;
}

input[type="radio"]:checked + .color-option {
  border: 2px solid #ed1944;
}

.color-picker-new {
  display: flex;
  gap: 10px;
}

.color-picker-new input[type="radio"] {
  display: none;
}

.color-option-new {
  width: 100%;
  border-radius: 5px;
  display: inline-block;
  padding: 5px 0px 2px;
  cursor: pointer;
  background-color: #fff; /* سفید */
  border: 1px solid rgba(221, 221, 221, 1); /* مرز خاکستری */
  transition: all 0.3s ease;
  text-align: center;
}

/* حالت انتخاب شده */
.color-picker-new input[type="radio"]:checked + .color-option-new {
  background-color: #333333;
  color: white !important;
}

.add-to-card {
  padding: 10px 20px;
  background-color: #333333;
  color: white;
  transition: 0.5s ease-in-out;
  border: 1px solid #333333;
  cursor: pointer;
}

.add-to-card:hover {
  background-color: transparent;
  color: #333333;
}

.dynamic-text-box {
  width: 300px;
  height: 30px;
  overflow: hidden;
  position: relative;
  font-size: 16px;
  font-weight: bold;
  color: #fe0000;
}

#dynamic-text-list {
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition: transform 0.5s;
}

#dynamic-text-list li {
  height: 30px;
  display: flex;
  align-items: center;
}

.details-comments .tab-pane {
  padding: 15px;
  background-color: #f7f7f7;
  border-radius: 5px;
}

.cm-form input,
.cm-form textarea {
  padding: 10px !important;
  border-radius: 0.375rem !important;
}

.cm-form input:focus-visible,
.cm-form textarea:focus-visible {
  box-shadow: unset !important;
}

.cm-form input::placeholder,
.cm-form textarea::placeholder {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.385);
}

.cm-form button {
  padding: 8px 16px;
  background-color: #141517;
  color: white;
  border: 1px solid #141517;
  transition: 0.5s ease-in-out;
}

.cm-form button:hover {
  background-color: transparent;
  color: #333333;
}

.comment-tab .cm-form .rate .rating {
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: relative;
}
.comment-tab .cm-form .rate .rating-0 {
  filter: grayscale(100%);
}
.comment-tab .cm-form .rate .rating > input {
  display: none;
}
.comment-tab .cm-form .rate .rating > label {
  cursor: pointer;
  width: 20px;
  height: 29px;
  margin-top: auto;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='126.729' height='126.73'%3e%3cpath fill='%23e3e3e3' d='M121.215 44.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.101 0l-12.4 30.3c-.8 2.1-2.8 3.5-5 3.7l-34.9 3.3c-5.2.5-7.3 7-3.4 10.5l26.3 23.1c1.7 1.5 2.4 3.7 1.9 5.9l-7.9 32.399c-1.2 5.101 4.3 9.3 8.9 6.601l29.1-17.101c1.9-1.1 4.2-1.1 6.1 0l29.101 17.101c4.6 2.699 10.1-1.4 8.899-6.601l-7.8-32.399c-.5-2.2.2-4.4 1.9-5.9l26.3-23.1c3.8-3.5 1.6-10-3.6-10.5z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 76%;
  transition: 0.3s;
}
.comment-tab .cm-form .rate .rating > input:checked ~ label,
.comment-tab .cm-form .rate .rating > input:checked ~ label ~ label {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='126.729' height='126.73'%3e%3cpath fill='%23fcd93a' d='M121.215 44.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.101 0l-12.4 30.3c-.8 2.1-2.8 3.5-5 3.7l-34.9 3.3c-5.2.5-7.3 7-3.4 10.5l26.3 23.1c1.7 1.5 2.4 3.7 1.9 5.9l-7.9 32.399c-1.2 5.101 4.3 9.3 8.9 6.601l29.1-17.101c1.9-1.1 4.2-1.1 6.1 0l29.101 17.101c4.6 2.699 10.1-1.4 8.899-6.601l-7.8-32.399c-.5-2.2.2-4.4 1.9-5.9l26.3-23.1c3.8-3.5 1.6-10-3.6-10.5z'/%3e%3c/svg%3e");
}
.comment-tab .cm-form .rate .rating > input:not(:checked) ~ label:hover,
.comment-tab
  .cm-form
  .rate
  .rating
  > input:not(:checked)
  ~ label:hover
  ~ label {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='126.729' height='126.73'%3e%3cpath fill='%23d8b11e' d='M121.215 44.212l-34.899-3.3c-2.2-.2-4.101-1.6-5-3.7l-12.5-30.3c-2-5-9.101-5-11.101 0l-12.4 30.3c-.8 2.1-2.8 3.5-5 3.7l-34.9 3.3c-5.2.5-7.3 7-3.4 10.5l26.3 23.1c1.7 1.5 2.4 3.7 1.9 5.9l-7.9 32.399c-1.2 5.101 4.3 9.3 8.9 6.601l29.1-17.101c1.9-1.1 4.2-1.1 6.1 0l29.101 17.101c4.6 2.699 10.1-1.4 8.899-6.601l-7.8-32.399c-.5-2.2.2-4.4 1.9-5.9l26.3-23.1c3.8-3.5 1.6-10-3.6-10.5z'/%3e%3c/svg%3e");
}
.comment-tab .cm-form .rate .feedback {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.f7 {
  background-color: #f7f7f7;
}

.comment-tab .star-rating .star-rating-fill {
  background: url(../img/ravan-gold.png) repeat-x;
  background-position-x: 0;
  background-position-y: 0;
  background-position: 0 100%;
  float: left;
  height: 17px;
  display: block;
  width: 70%;
}

.comment-tab .star-rating {
  background: url(../img/ravan-gold.png) repeat-x;
  height: 20px;
  width: 85px;
  overflow: hidden;
}

.detail .nav-link.active,
#moreimg .nav-link.active {
  opacity: 1;
}

.detail .nav-link,
#moreimg .nav-link {
  opacity: 0.5;
}

.buy-via-whatsapp {
  background-color: #25d366 !important;
  border: 1px solid #25d366 !important;
  transition: 0.3s ease-in-out;
  padding: 10px 20px;
}

.buy-via-whatsapp:hover {
  background-color: transparent !important;
  color: #25d366 !important;
}

.buy-via-whatsapp:hover svg {
  filter: invert(40%) sepia(64%) saturate(709%) hue-rotate(83deg)
    brightness(94%) contrast(93%);
}

.heart-btn {
  position: relative;
  width: 30px;
  height: 30px;
  cursor: pointer;
}

.heart-btn i {
  position: absolute;
  top: 0;
  left: 0;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.heart-btn .bi-heart {
  opacity: 1;
  transform: scale(1);
}

.heart-btn .bi-heart-fill {
  opacity: 0;
  transform: scale(0.5);
}

/* وقتی کلیک شد */
.heart-btn.active .bi-heart {
  opacity: 0;
  transform: scale(0.5);
}

.heart-btn.active .bi-heart-fill {
  opacity: 1;
  transform: scale(1);
}

.off-swiper .col-xxl-3 {
  width: 100%;
}

.off-swiper .col-xxl-3 .overflow-hidden p {
  text-align: right !important;
}

.slogan-border {
  border-left: solid 1px rgba(0, 0, 0, 0.108);
}

.slogan-border:last-child {
  border: unset !important;
}

.mySwiper-dynamic .swiper-pagination-bullet-active {
  background-color: white !important;
}

.green {
  color: #25d366;
}

.doot {
  width: 5px;
  height: 5px !important;
  background-color: rgba(0, 0, 0, 0.203);
}

.thumbs898 {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100vh;
  align-items: center;
  overflow: scroll;
  width: 10% !important;
}

.gallery-container898 .border-primary {
  border-color: #ed1944 !important;
}

.thumbs898 button {
  background: none;
  border: 2px solid transparent;
  padding: 0;
  border-radius: 8px;
  cursor: pointer;
  transition: 0.2s;
  opacity: 0.5;
}
.thumbs898 button img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 6px;
  display: block;
}

.filter-option {
  text-align: start !important;
}

.main-scroll898 img {
  width: 45% !important;
}
.thumbs898 button.active {
  border-color: red;
  box-shadow: var(--shadow);
  opacity: 1 !important;
}
.main-scroll898 {
  flex: 1;
  overflow-y: auto;
  scroll-behavior: smooth;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--muted);
  width: 90% !important;
}
.main-scroll898 img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  display: block;
  margin-bottom: 20px;
  border-radius: 12px;
}

.discount-badge {
  position: relative;
  width: 45px;
  height: 45px;
  background-image: url('../img/Group\ 35.svg');
  border-radius: 50%;
  align-content: center;
  text-align: center;
  font-size: 14px;
  color: white;
  background-size: cover;
}

.trans-35 {
  rotate: -35deg;
  display: flex;
  justify-content: center;
}

.unavailable-0::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: -5px;
  width: 120%;
  height: 3px;
  background-color: #000000;
  margin: auto;
  transform: rotate(25deg);
}

.unavailable-0 {
  opacity: 0.5;
}

.translate-none {
  transform: scale(1) !important;
}

.discount-alert-dander {
  width: max-content;
  height: 20px;
  background-color: red;
  display: flex;
  padding: 2px 4px;
  font-size: 13px;
}

.customized-shadow {
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.share-bs-data {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  border: 1px solid #40b048;
  background-color: white;
}

.share-bs-data2 {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  border: 1px solid #039ce5;
  background-color: white;
}

.share-bs-data3 {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  border: 1px solid #ed1944;
  background-color: white;
}