challenge-vtex-io-gabriel-ferraz/styles/sass/pages/product/vtex.slider-layout.scss

.sliderLayoutContainer {
  padding: 0 40px 32px;
  margin-bottom: 32px;

  .sliderLeftArrow {
    left: 36px;
    margin: 0;
    padding: 0;
  }

  .sliderRightArrow {
    right: 36px;
    margin: 0;
    padding: 0;
  }

  .sliderTrackContainer {
    margin: 0 auto;
    width: 94%;

    .sliderTrack {
      gap: 16px;

      .slide {
        .slideChildrenContainer {
          :global(.vtex-product-summary-2-x-container) {
            margin: 0;

            :global(.vtex-product-summary-2-x-element) {
              padding: 0;
              :global(.vtex-product-summary-2-x-imageContainer) {
                display: flex;
                order: 1;

                :global(.vtex-store-components-3-x-discountContainer) {
                  :global(.vtex-store-components-3-x-discountInsideContainer) {
                    display: none;
                  }
                  :global(.vtex-product-summary-2-x-imageContainer) {
                    :global(.vtex-product-summary-2-x-imageNormal) {
                      width: 100%;
                      height: 100%;
                    }
                  }
                }
              }
              :global(.vtex-product-summary-2-x-nameContainer) {
                display: flex;
                order: 2;
                padding: 0;
                justify-content: center;

                :global(.vtex-product-summary-2-x-productBrand) {
                  display: flex;
                  max-width: 282.4px;
                  height: 50px;
                  align-items: center;

                  font-family: 'Open Sans', sans-serif;
                  font-style: normal;
                  font-weight: 400;
                  font-size: 18px;
                  line-height: 25px;
                  text-align: center;
                  color: #000;
                }
              }
              :global(.vtex-product-summary-2-x-priceContainer) {
                display: flex;
                order: 3;
                padding: 0;

                :global(.vtex-store-components-3-x-listPrice) {
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  text-decoration-line: line-through;
                  gap: 1px;

                  :global(.vtex-store-components-3-x-listPriceLabel) {
                    font-family: 'Open Sans', sans-serif;
                    font-style: normal;
                    font-weight: 400;
                    font-size: 14px;
                    line-height: 19px;
                    text-align: center;
                    color: #bababa;
                    text-transform: lowercase;
                    text-decoration: none;
                    padding: 0;
                  }
                  :global(.vtex-store-components-3-x-listPriceValue) {
                    font-family: 'Open Sans', sans-serif;
                    font-style: normal;
                    font-weight: 400;
                    font-size: 14px;
                    line-height: 19px;
                    text-align: center;
                    color: #bababa;
                    text-decoration: none;
                    padding: 0;
                  }
                }
                :global(.vtex-store-components-3-x-listPrice)::after {
                  content: 'por';
                  font-family: 'Open Sans', sans-serif;
                  font-style: normal;
                  font-weight: 400;
                  font-size: 14px;
                  line-height: 19px;
                  text-align: center;
                  color: #bababa;
                }

                :global(.vtex-store-components-3-x-sellingPrice) {
                  padding: 0;

                  :global(.vtex-product-summary-2-x-currencyContainer) {
                    font-family: 'Open Sans', sans-serif;
                    font-style: normal;
                    font-weight: 700;
                    font-size: 24px;
                    line-height: 33px;
                    text-align: center;
                    color: #000;
                  }

                  :global(.vtex-store-components-3-x-sellingPriceLabel) {
                    display: none;
                  }
                }

                :global(.vtex-store-components-3-x-installmentsPrice) {
                  display: none;
                }
              }

              :global(.vtex-product-summary-2-x-buyButtonContainer) {
                display: none;
              }
              :global(.vtex-product-summary-2-x-description) {
                display: none;
              }
              :global(.vtex-product-summary-2-x-SKUSelectorContainer) {
                display: none;
              }
            }
          }
        }
      }
    }
  }
  .paginationDotsContainer {
    align-items: center;
    // bottom: -32px;

    .paginationDot {
      width: 10px;
      height: 10px;
      background-color: #000;
    }

    .paginationDot--isActive {
      background-color: #fff;
      width: 17px !important;
      height: 17px !important;
      border: 0.5px solid #000;
    }
  }
}