@import "@css[shared]/page/product/_product";

.product-attachments {
   margin-bottom: 30px;

   .title-default {
      font-weight: 700;
   }
}

.product-outlinks {
   margin-bottom: 20px;

   ul {
      @include list-triangle;
   }
}

.product-main {
   .wpj-carousel-controls {
      top: 60%;
   }
}

.product-params + div {
   border-top: 1px solid $border-color;
   padding-top: 20px;
}

.focus.product-question .focus-content {
   width: 480px;
   padding: 20px 30px 10px 30px;
}

.focus.sizetable {
   .focus-content {
      width: auto;
   }

   table {
      border: 0;
      margin-bottom: 20px;
   }

   td {
      border: 0;
      border-bottom: 1px solid $border-color;
      padding: 2px 5px;
   }
}

.product-variations {
   margin-bottom: 30px;

   .img img {
      border-radius: 0;
   }
}

.product-articles {
   @media screen and (min-width: $xs) {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;

      .article-small {
         flex: none;
         width: calc(50% - 10px);
      }
   }
}

.reviews-empty.reviews-empty {
   text-align: left;
}

.reviews-header {
   display: flex;
   align-items: center;
   justify-content: space-between;

   .rating-stars {
      font-size: 16px;
      display: flex;
      align-items: center;
      margin-left: 12px;
   }

   .icons_star_full {
      color: $gold;
   }

   .icons_star_empty {
      color: $gold;
   }
}

.product-variation {
   border-radius: 5px;
}

.delivery-info {
   display: flex;
   margin-bottom: 10px;
   flex-wrap: wrap;
   flex-direction: column;

   [data-focus-opener=product-delivery] {
      margin-left: 0;
   }

   p {
      margin-bottom: 0;
   }
}

.delivery-timetable {
   margin-bottom: 5px;

   .delivery {
      font-weight: 600;
   }
}

.product-top {
   padding-bottom: 20px;

   &.container {
      max-width: 1420px;
   }

   .breadcrumbs {
      margin: 0 0 1.9rem;
      display: none;

      .active {
         display: none;
      }
   }

   h1 {
      margin-bottom: 10px;
   }

   .delivery {
      margin-right: 20px;
      text-transform: capitalize;
   }

   .delivery-0 {
      color: $green-price;
   }

   .delivery--2,
   .delivery--3 {
      color: $black;
   }

   .review-wrapper {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      margin-bottom: 10px;


      .flags-product .flag {
         margin-right: 10px;
      }

      &.flags-wrapper {
         .product-top-reviews {
            margin-top: 0;
         }
      }
   }

   .review-stars {
      color: $price-color;

      .icons_star_empty {
         color: $price-color;
      }
   }

   .product-wrapper {
      .breadcrumbs {
         display: flex;
      }

      /*[data-reload="variation"] .variation-single {
         p:first-child {
            display: none;
         }
      }*/
   }

   @media screen and (min-width: $lg - 1) {
      .column-left {
         position: sticky;
         top: 100px;
      }
   }

   .product-links {
      padding-top: 10px;
   }

   @media screen and (max-width: $lg - 1) {
      .breadcrumbs {
         display: flex;
         margin-bottom: 5px;
      }

      .product-wrapper {
         .breadcrumbs {
            display: none;
         }
      }

      .column-left {
         margin-bottom: 15px;
      }
   }

   @media screen and (max-width: $sm - 1) {
      h1 {
         font-size: 28px;
      }
   }
}

.description-box {
   @if $banner-bg-color {
      background-color: $light-pink;
   } @else {
      background-color: $gray-light;
   }

   padding: 30px 50px;
   margin-bottom: 30px;
   border-radius: 5px;
   position: relative;

   @if $banner-bg-color {
      &::before {
         content: url("/templates/images/template_bubbles.svg");
         position: absolute;
         right: 0;
         bottom: -8px;
      }
   }

   h5 {
      font-size: 20px;
      font-weight: 600;
   }

   @media screen and (max-width: $sm - 1) {
      padding: 30px 10px 10px 10px;
      margin-bottom: 20px;

      &::before {
         display: none;
      }
   }
}

.product-top-reviews {
   display: flex;
   margin-top: -10px;

   .review-stars {
      margin-right: 10px;
   }

   @media screen and (max-width: $sm - 1) {
      margin-top: 0;
   }
}

.submit-block {
   .btn-favorites {
      background: $green-price;
      border-bottom-right-radius: 5px 5px;
      border-top-right-radius: 5px 5px;
   }
}

.product-bottom .product-info {
   .ingredients, .info {
      h5 {
         display: none;
      }

      h6 {
         font-size: 20px;
         font-weight: 600;
      }
   }
}

@media screen and (min-width: $lg - 1) {
   .product-bottom {
      .templates-mobile {
         display: none;
      }
   }
}

@media screen and (max-width: $lg - 1) {
   .product-bottom {
      .templates-desktop {
         display: none;
      }
   }
}

@media screen and (max-width: 500px) {
   .product-bottom {
      .nav-link {
         display: flex;
         flex-direction: column;
         justify-content: center;
         align-items: center;
      }

      .review-stars {
         //margin: auto;
         display: flex;
      }
   }
}

@media screen and (max-width: $sm - 1) {
   .product-bottom  {
      .templates-mobile {
         padding: 0 10px;
      }

      .column-left {
         padding-left: 0;
         padding-right: 0;
      }
   }

   .product-main {
      .container-product-slider h5 {
         font-size: 28px;
      }
   }
}

