.checkout-order {
  @include make-row;
  flex-direction: column;
  font-size: 1rem;

  &__charity {
    @include make-row;
    margin: 0;
    flex-direction: row;
  }

  &__img {
    @include make-col(6);

    .image {
      width: 115px;
      height: 115px;
    }
  }

  &__info-wrap {
    @include make-col(6);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    font-size: 1rem;

    .title-wrap {
      display: flex;
      flex-direction: column;

      .title {
        margin-bottom: 8px;
      }

      .subtitle-link {
        text-decoration: none;
      }
    }

    .price-wrap {
      display: flex;
      justify-content: space-between;
    }
  }

  .order-block {
    &__time-head {
      display: flex;
      flex-direction: column;
      background-color: $blue-ocean;
      color: $white;
      font-size: 1.375rem;
      padding: 27px 24px;

      .iconHead {
        margin-right: 10px;
      }

      .boldDate {
        font-weight: 500;
      }

      &-info {
        font-size: 1rem;
        margin-left: 30px;
      }
    }

    &__address {
      background-color: $white;
      padding: 36px 32px 31px;
      margin-bottom: 8px;

      &-wrap {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
      }

      &-info {
        margin-right: 10px;
      }

      .fa-map-marker-alt {
        color: $blue-ocean;
        font-size: 1.125rem;
        margin-right: 15px;
      }
    }

    .btn-link {
      text-decoration: underline;
      font-size: 1rem;
      padding: 0;
    }

    &__store-info {
      display: none;
      background-color: $white;
      margin-top: 36px;

      .header-block {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;

        .store-name {
          color: $blue-ocean;
          font-size: 20px;
          line-height: 24px;
          margin: 0 10px 0 0;
          font-weight: 400;
        }

        .hide-info {
          white-space: normal;
        }
      }

      .contact-block {
        margin-bottom: 62px;

        &__phone {
          margin-bottom: 27px;
        }

        &__address {
          display: flex;
          align-items: center;
          justify-content: space-between;
          margin-bottom: 27px;
        }
      }

      .opening-times-block {
        @include make-row;
        margin: 0;

        &__col {
          @include make-col(12);
          padding-right: 5px;
          padding-left: 5px;

          .title {
            color: $blue-ocean;
            font-size: 16px;
            line-height: 19px;
            margin-bottom: 20px;
          }

          .schedule {
            border: 1px solid $gray-border;

            &-regular {
              margin-bottom: 20px;

              .schedule-item {
                display: flex;
                justify-content: space-between;
                padding: 9px 0;

                &__time {
                  width: 60%;
                  padding-right: 15px;

                  span:last-child {
                    white-space: nowrap;
                  }
                }

                &__day {
                  width: auto;
                }

                &:first-child {
                  background-color: $blue-ocean;
                  color: $white;
                  font-weight: bold;
                }
              }
            }

            .schedule-item:nth-child(2n),
            .store-locator-details .schedule-item .schedule-item:nth-child(odd) {
              background-color: $white;
            }

            .special-opening-schedule-item.schedule-item {
              &__main {
                display: flex;
                flex-direction: row;
                align-items: center;
                width: 100%;
              }

              &__day-reason {
                width: 50%;
              }

              &__time {
                width: 50%;
                padding-right: 15px;
              }

              &__day {
                width: 100%;
              }

              &__reason {
                font-weight: 400;
              }
            }
          }
        }
      }
    }

    &__order-line {
      background-color: $white;
      margin-bottom: 8px;
      padding: 20px 23px 28px;

      .order-line {
        &__wrap {
          @include make-row;
          margin: 0;
          padding-bottom: 20px;
        }

        &__image {
          @include make-col(5);
          display: flex;
          justify-content: center;

          .image {
            max-width: 90px;
            max-height: 90px;
          }
        }

        &__info {
          @include make-col(7);
        }

        &__promo {
          margin: 10px 0 0;
        }

        &__product {
          display: flex;
          flex-direction: column;
          justify-content: space-between;
        }

        &__quantity {
          width: 40px;
          height: 40px;
          background-color: $gray-bg;
          padding: 10px;

          .value {
            font-weight: bold;
          }
        }

        &__price {
          border-top: 1px dashed $gray-middle;
          margin: 0 -23px;
          padding-top: 23px;

          &-item {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            padding: 0 23px;
            margin-bottom: 10px;

            .price-item__info {
              text-align: end;
            }
          }
        }
      }

      .supplier-block {
        border-top: 1px dashed $gray-middle;
        padding: 14px 0;
        margin-top: 25px;

        .fa-exclamation-circle {
          color: $blue;
        }

        &__title {
          font-weight: bold;
        }
      }
    }

    &__price {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      margin-top: 30px;
      font-size: 1rem;
      margin: 40px 23px 0;
    }

    &__product-line {
      .show-products,
      .hide-products {
        padding: 21px 0 29px 32px;
      }

      .hide-products {
        display: none;
      }
    }

    &__product-info {
      display: none;

      .order-line {
        &__image {
          a {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-content: flex-start;

            .image {
              max-width: 90px;
              max-height: 90px;
              width: auto;
              height: auto;
            }
          }
        }
      }
    }

    &:last-child {
      .order-block__product-line {
        .show-products {
          padding-bottom: 0;
        }
      }
    }
  }
}

.total-delivery__wrap {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background-color: $gray-light;
  padding: 20px 60px;
  font-size: 1.375rem;
  margin: 0 -15px;
}

.click-collect-message {
  position: relative;
  display: flex;
  background-color: $gray-light;
  padding: 20px 60px;
  margin: 0 -15px;
  font-size: 1rem;

  .icon-info {
    position: absolute;
    color: $blue;
    left: 25px;
    top: 24px;
  }
}

@include media-breakpoint-only(xl) {
  .checkout-order {
    .order-block {
      &__store-info {
        .opening-times-block {
          justify-content: space-between;

          &__col {
            @include make-col(6);

            .schedule {
              height: 90%;

              &-regular {
                margin-bottom: 0;
              }
            }
          }
        }
      }
    }
  }
}

@include media-breakpoint-up(md) {
  .checkout-order {
    .order-block {
      &__address {
        &-wrap {
          flex-direction: row;
          align-items: center;
        }
      }

      &__store-info {
        .opening-times-block {
          &__col {
            .schedule {
              &-regular {
                .schedule-item {
                  &__time {
                    width: auto;
                  }
                }
              }

              .special-opening-schedule-item.schedule-item {
                &__time {
                  width: auto;
                }
              }
            }
          }
        }
      }

      &__order-line {
        .order-line {
          &__image {
            .image.image {
              width: auto;
              height: auto;
            }
          }
        }
      }
    }
  }
}

@include media-breakpoint-up(lg) {
  .checkout-order {
    margin: 0;

    &__img {
      @include make-col(3);
    }

    &__info-wrap {
      @include make-col(9);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      font-size: 1rem;
    }

    .order-block {
      &__time-head {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        font-size: 1.625rem;

        .iconHead {
          margin-right: 20px;
        }

        &-info {
          font-size: 1.125rem;
          margin: 0;
        }
      }

      &__order-line {
        .order-line {
          &__image {
            @include make-col(2);

            .image {
              width: auto;
              max-height: 60px;
            }
          }

          &__info {
            @include make-col(10);
          }

          &__product {
            flex-direction: row;
            align-items: center;
          }

          &__quantity {
            margin-left: 10px;
          }
        }
      }

      &__product-info {
        .order-line {
          &__image {
            a {
              .image {
                max-width: 60px;
                max-height: 60px;
              }
            }
          }
        }
      }
    }
  }

  .total-delivery__wrap {
    margin: 0;
  }

  .click-collect-message {
    margin: 0;
  }
}

@include media-breakpoint-only(md) {
  .checkout-order {
    &__img {
      @include make-col(4);
    }

    &__info-wrap {
      @include make-col(8);
    }

    .order-block {
      &__order-line {
        .order-line {
          &__image {
            @include make-col(4);

            .image {
              width: 90px;
              height: 90px;
            }
          }

          &__info {
            @include make-col(8);
          }
        }
      }
    }
  }
}
