/* ------------------------------------Sidebar------------------------------------ */
.product__thumbnail img {
  border-radius: var(--radius-2xl);
  box-shadow: var(--post-shodow);
}

.quickAccess {
  background: var(linear-gradient(135deg, #ffffff 0%, #e8e8e8 100%));
  box-shadow: var(--post-shodow);
  border-radius: var(--radius-2xl);
}

/* ------------------------------------Product information box------------------------------------ */

.productInfo__box {
  padding: 5rem;
  background: linear-gradient(135deg, #ffffff 0%, #f0f0f0 100%);
  box-shadow:
    5px 5px 10px rgba(220, 220, 220, 0.2),
    -5px -5px 10px rgba(220, 220, 220, 0.2),
    5px -5px 10px rgba(255, 255, 255, 0.9),
    -5px 5px 13px rgba(220, 220, 220, 0.9),
    inset -1px 1px 2px rgba(255, 255, 255, 0.3),
    inset 1px -1px 2px rgba(220, 220, 220, 0.5);
  border-radius: var(--radius-2xl);
}

.productInfo p {
  color: var(--color-secondary-dark);
}

.productInfo__option {
  font-size: 1.6rem;
}

.category__tx {
  color: var(--color-secondary-dark);
  font-size: 1.4rem;
}

#category {
  color: var(--color-primary);
  font-size: 1.4rem;
}

.sharePost {
  border: 0;
  padding: 1.5rem;
  border-radius: 50%;
  font-size: 2rem;
  background: linear-gradient(135deg, #ffffff 0%, #f2f2f2 100%);
  box-shadow:
    -6px 6px 12px rgba(224, 224, 224, 0.2),
    6px -6px 12px rgba(224, 224, 224, 0.2),
    -6px -6px 12px rgba(255, 255, 255, 0.9),
    6px 6px 15px rgba(224, 224, 224, 0.9),
    inset 1px 1px 2px rgba(255, 255, 255, 0.3),
    inset -1px -1px 2px rgba(224, 224, 224, 0.5);
  color: var(--socialMedia-icon);
}

/* ------------------------------------Related posts------------------------------------ */

.relatedPosts__wrap,
.contactUs__form {
  margin-top: 10rem;
}

.relatedPost {
  background: var(--relatedPost-bg);
  box-shadow: var(--relatedPost-shadow);
  border-radius: var(--radius-2xl);
  padding: 3rem;
  margin: 5rem 0;
  display: flex;
  gap: 3rem;
}

.relatedPost__img img {
  border-radius: var(--radius-lg);
}

.relatedPost__link {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.relatedPost__info {
  color: var(--color-secondary-dark);
}

.relatedPost__date {
  color: var(--color-secondary-dark);
  font-size: 1.4rem;
}

#sidebarWrap {
  top: 0;
  padding-bottom: 5rem;
  position: sticky;
  align-self: flex-start;
}

.contactUs__form {
  margin-bottom: 6rem;
}

.contactUs__form p {
  color: var(--color-secondary-dark);
  margin-top: 1.5rem;
}

.contactUs__form label {
  font-size: 1.4rem;
  color: var(--color-secondary-dark);
  margin: 1rem 0;
}

.viewpoint__wrap,
.inputName__wrap,
.inputEmail__wrap,
.inputTell__wrap,
.viewpoint__target {
  margin-top: 2.5rem;
}

.contactUs__form input,
textarea {
  border: none;
  padding: 1.2rem;
  border-radius: 15px;
}

.viewpoint__target {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.contactUs__form input[type="email"] {
  direction: rtl;
}

.form__check {
  display: flex;
}

.formCheck__input {
  margin-right: 1.2rem;
}

.productInfo__name {
  line-height: normal;
}

/*------------------------------------Responsive 992px------------------------------------*/

@media screen and (max-width: 992px) {
  .viewpoint__target {
    display: block;
  }
}

/*------------------------------------Responsive 768px------------------------------------*/

@media screen and (max-width: 768px) {
  #sidebarWrap {
    position: relative;
    padding-bottom: 3rem;
  }

  .quickAccess {
    display: none;
  }

  .productInfo__box {
    padding: 3rem;
  }

  .hr--primary {
    width: 100% !important;
  }

  .category__tx,
  #category {
    font-size: 1.2rem;
  }

  .relatedPost {
    text-align: center;
    display: block;
  }

  .relatedPost__index {
    margin-top: 3rem;
  }

  .contactUs__form label {
    font-size: 1.2rem;
  }

  .contactUs__wrapper {
    padding: 3rem !important;
  }

  .formSubmit__button {
    margin-top: 3rem;
    text-align: center;
  }

  .socialMedia__links a {
    padding: 1.5rem;
  }

  .access__wrapper {
    padding-bottom: 3rem;
  }
}
