.template-product-page {
  & .product__wrapper {
    margin: 0;
  }
  & .product__images {
    width: 100%;
    max-width: 600px;
    padding: 0;
  }
  & .image-wrapper {
    background: #f0f5fa;
  }
  & .product__content {
    padding-left: 50px;
  }
  & .form__width {
    max-width: calc(100dvw - 600px);
    min-width: 50%;
  }
  & .product__head {
    margin-bottom: 16px;
  }
  & .product__block--lines {
    border-color: var(--COLOR-BORDER-OPACITY-024);
    & .radio__fieldset {
      padding-bottom: 20px;
      border-bottom: 1px solid var(--COLOR-BORDER-OPACITY-024);
    }
  }
  & .radio__legend__value {
    padding-top: 0;
  }
  & .product__block {
    margin-bottom: 16px;
  }
  & .product__price--off {
    align-self: center;
    & * {
      color: inherit;
    }
  }
  & .radio__legend {
    & .radio__legend__option-name {
      color: var(--COLOR-SECONDARY-TEXT);
    }
  }
  & .product__form__holder {
    & .radio__buttons {
      align-self: center;
      label {
        padding: 10px 16px;
        border-radius: 120px;
        background-color: unset;
        color: var(--COLOR-TEXT);
      }
      & input[type="radio"] {
        & + label {
          color: var(--COLOR-TEXT);
          background-color: unset;
        }
        & + label:hover {
          background-color: var(--COLOR-LIGHTER-BG);
        }
      }
      & input[type="radio"]:checked {
        & + label {
          border-color: var(--BTN-PRIMARY-BORDER-COLOR);
          background-color: var(--COLOR-LIGHTER-BG);
          color: var(--BTN-PRIMARY-BORDER-COLOR);
          & * {
            color: inherit;
          }
        }
        & + label:hover {
          cursor: default;
        }
      }
      & input[type="radio"].sold-out, & input.unavailable[data-is-variant-available="false"] {
        & ~ label {
          border-color: var(--BTN-SOLT-OUT-TEXT-BORDER-COLOR);
          color: var(--BTN-SOLT-OUT-TEXT-BORDER-COLOR);
          background-color: var(--COLOR-A5);
          & span {
            color: var(--BTN-SOLT-OUT-TEXT-BORDER-COLOR);
          }
        }
        & ~ label:hover {
          border-color: var(--COLOR-TEXT);
          color: var(--COLOR-TEXT);
          & span {
            color: var(--COLOR-TEXT);
          }
        }
      }
      & input[type="radio"].sold-out:checked, & input.unavailable[data-is-variant-available="false"]:checked {
        ~ label {
          background-color: var(--BTN-SOLT-OUT-TEXT-BACKGROUND-COLOR);
        }
        ~ label:hover {
          border-color: var(--BTN-SOLT-OUT-TEXT-BORDER-COLOR);
          color: var(--BTN-SOLT-OUT-TEXT-BORDER-COLOR);
          & span {
            color: var(--BTN-SOLT-OUT-TEXT-BORDER-COLOR);
          }
        }
      }
    }
  }

  & .product-form {
    & .select-popout {
      width: 100px;
    }
    & .select-popout__toggle {
      border: 1px solid #919eab52;
      padding: 0 24px;
      border-radius: 120px;
      span {
        font-feature-settings: "pnum" on, "lnum" on;
      }

      & svg path {
        fill: #000000;
      }
    }

    & .select-popout__list {
      border-radius: 20px;
      border: 1px solid var(--SITE-BORDER-LIGHT-COLOR);
    }
    & .select-popout__list::-webkit-scrollbar {
      width: 0;
    }
    & .select-popout__list::-webkit-scrollbar-track {
      background: transparent;
    }
    & .select-popout__list::-webkit-scrollbar-thumb {
      background: transparent;
    }
    & .select-popout__list::-webkit-scrollbar-thumb:hover {
      background: transparent;
    }

    & .product__submit__buttons {
      gap: 30px;
      & .cowlendar-btn {
        pointer-events: all;
        cursor: pointer;
      }
    }

    & .btn__text,
    .shopify-payment-button__button {
      border-radius: 120px;
    }
  }
  & .product__submit__item {
    button[data-add-to-cart] {
      padding: 0;
    }
  }

  & .product__block--buttons {
    margin-top: 22px;
    margin-bottom: 40px;
  }

  & .product-tabs {
    margin-bottom: 24px;
    & .product-tabs-title {
      & li span {
        background-position: 50% 75%;
      }
    }
    & ul.tabs {
      padding-bottom: 12px;

      & > li {
        margin-right: 28px;
        padding-top: 8px;

        & span {
          padding-bottom: 22px;
        }
        & span:hover {
          background-size: 100% 2px;
        }
      }
      & > li.current {
        span {
          background-size: 100% 2px;
        }
      }
    }

    & .product-tabs__head {
      margin-bottom: -24px;
    }

    & .tab-content {
      padding: 26px 15px 0px 0px;

      & p {
        margin-top: 0;
      }

      & .tab-content__actions {
        margin-top: 8px;

        & button {
          text-decoration: underline;
        }
      }
    }
  }

  & .product__icon__row .product__icon__container {
    & .product__icon {
      margin-right: 8px;
      margin-top: 6px;
      margin-bottom: 6px;

      & .icon {
        width: 24px;
        height: 24px;
        stroke: var(--primary);
      }
    }

    & .product__icon__text {
      & p {
        margin-top: 6px;
        margin-bottom: 6px;
      }
    }
  }

  & .product__block--divider {
    margin-bottom: var(--block-padding-bottom);

    & hr {
      border-color: rgba(145, 158, 171, 0.24);
    }
  }

  & .product__feature {
    padding: 16px;
    background-color: #f0f5fa;

    & .product__icon {
      width: 24px;
      height: 24px;
      margin-top: 0;
      margin-right: 8px;
      margin-bottom: 0;

      & .image-wrapper {
        width: 24px;
        height: 24px;
      }

      & .icon,
      img {
        width: 24px;
        height: 24px;
        stroke: var(--primary);
      }
    }

    & .product__icon__text p {
      margin: 0;
    }

    & .rte {
      & p {
        margin: 4px 0;
      }

      & a {
        background: none;
        text-decoration: underline;
      }
    }
  }

  @media screen and (max-width: 1200px) {
    & .wrapper--narrow {
      max-width: unset;
      padding-left: var(--outer);
      padding-right: var(--outer);
    }
  }
  @media screen and (max-width: 1024px) {
    & .product__images {
      max-width: unset;
    }
    & .product__content {
      padding-left: var(--outer);
      & .form__width {
        max-width: unset;
        & .product__block.product__block--buttons {
          margin-bottom: 22px;
        }
        & .product__block.product__tabs {
          margin-bottom: 22px;
        }
        & .product-tabs {
          margin-bottom: 0;
          & .tabs__head {
            padding-bottom: 0;
            & .product-tabs-title {
              padding-top: 0;
            }
            & .tab-link {
              padding-top: 0;
            }
            & li span {
              background-position-y: 50%;
            }
          }
        }
      }
    }
  }

  @media screen and (max-width: 767px) {
    & .product__page {
      & .product__images {
        max-width: 100dvw;
        padding-left: var(--outer);
        padding-right: var(--outer);
        & .product__slides {
          max-height: 420px;
          max-width: 100dvw;
        }
        & .product__slide {
          width: 80%;
        }
      }
      & .product__content {
        padding-left: var(--outer);
        padding-right: var(--outer);
      }
    }
    & .product__slides[data-slides-mobile="true"] {
      align-items: center;
    }
  }

  @media (max-width: 750px) {
    padding-left: 0;
    padding-right: 0;
  }
}
