@import '../helpers/helpers';
@import '../components/checkout_order';
@import '../components/special-opening-schedule';

.merged {
  .page-header {
    &__title {
      font-weight: 400;
    }
  }

  .merge-basket-options {
    &__choise-inner {
      padding-bottom: 20px;
      border: 0;
    }
  }

  h2 {
    color: $blue-dark;
  }

  .baskets {
    .lines-group {
      border: 0;

      &__count {
        font-weight: 400;
        font-size: 1rem;
      }

      &__header {
        padding-bottom: 15px;
        border-bottom: 1px solid $gray;

        &-icon {
          top: -3px;
          font-size: 1.75rem;
        }

        &-text {
          font-weight: 400;
        }

        .product-code {
          padding: 0;
          background: transparent;
          border: 0;
          font-size: 1rem;
        }
      }
    }
  }

  .checkout-title {
    padding-top: 30px;
  }

  .summary {
    .checkout-widget {
      &__details,
      &_order-summary {
        padding-top: 0;
      }
    }

    &__payment {
      display: block;
    }
  }

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

.checkout-order {
  flex-wrap: nowrap;
  border-top: 2px dotted #ccc;
  margin-top: 15px;

  .order-block {
    &__address {
      margin: 0 5px;
      padding: 0;
      background: transparent;

      &-wrap {
        padding: 10px;
        background: $gray-bg;
      }

      .show-info {
        padding: initial;
        text-decoration: underline;
      }

      .address-icon {
        svg {
          color: $blue;
          margin-right: 5px;
        }
      }
    }

    &__store-info.order-block__store-info {
      padding: 20px;
      margin-bottom: 0;
      margin-top: 10px;
    }
  }

  .schedule-item__time {
    padding-right: 15px;
    text-align: right;
  }
}

@include media-breakpoint-down(md) {
  .merged {
    .baskets {
      .order-item {
        &__cost {
          justify-content: space-between;
        }

        &__quant {
          display: flex;

          &-title {
            align-self: center;
            margin-right: 10px;
            color: #3e3e3e;
          }
        }

        &__value {
          font-size: 1rem;
        }

        &__area {
          ~ .order-item__quant {
            display: block;

            .order-item__quant-title {
              line-height: 14px;
              font-size: .75rem;
              color: #7f7f7f;
              font-weight: 400;

              &::after {
                content: none;
              }
            }
          }
        }
      }
    }
  }
}

@include media-breakpoint-down(sm) {
  .merged {
    .baskets {
      .show-info {
        text-align: left;
      }
    }
  }
}

.checkout-order {
  flex-wrap: nowrap;
  border-top: 2px dotted #ccc;
  margin-top: 15px;
  //margin-bottom: -28px;

  .order-block {
    &__address {
      padding: 0;

      &-wrap {
        padding: 10px 10px 0;
        background: $gray-bg;
      }

      .show-info {
        padding: initial;
        text-decoration: underline;
      }

      .address-icon {
        svg {
          color: $blue;
          margin-right: 5px;
        }
      }
    }

    &__store-info {
      padding: 0 20px;
      margin-bottom: 20px;
    }
  }

  .schedule-item__time {
    padding-right: 15px;
    text-align: right;

    span {
      &:first-child {
        @include media-breakpoint-down(sm) {
          display: inline-block;
          min-width: 80px;
        }
      }
    }
  }
}

@include media-breakpoint-down(md) {
  .merged {
    .baskets {
      .order-item {
        &__cost {
          justify-content: space-between;
        }

        &__quant {
          display: flex;

          &-title {
            //font-size: 1rem;
            align-self: center;
            margin-right: 10px;
            color: #3e3e3e;
          }
        }

        &__value {
          font-size: 1rem;
        }
      }
    }
  }
}

@include media-breakpoint-down(sm) {
  .merged {
    .baskets {
      .show-info {
        text-align: left;
      }
    }
  }
}

@include media-breakpoint-up(sm) {
  .merged {
    .baskets {
      &__basket-lines,
      &__basket-summary {
        @include make-col(12)
      }

      .order-item {
        &__main {
          grid-template-rows: 1fr;
        }
      }
    }
  }
}

@include media-breakpoint-up(lg) {
  .merged {
    .merge-basket-options {
      padding: 25px 0 25px 10px;
      margin-bottom: 35px;

      &__choise-inner {
        padding-bottom: 8px;
        border: 0;
      }
    }

    .baskets {
      &__basket-lines {
        flex: 1;
        max-width: 100%;
        padding-right: 5px;
      }

      &__basket-summary {
        @include make-col(4);
        padding-left: 5px;
        max-width: 325px;
      }
    }
  }
}