$delivery-label-height: 82px; //$line-height-sm * $font-size-base * 2 + 2rem !default;
$delivery_collapsible: true;

@import "@css[shared]/page/order/_step-delivery";

.cart-box {
   margin-bottom: 25px;
}

.cart-box-row {
   padding: 0 20px;

   .delivery-content {
      padding-left: calc(2rem + 25px);
   }

   .title,
   .name {
      font-size: 16px;
      font-weight: $font-weight-bold;
   }

   .subtitle {
      font-size: 14px;
      font-weight: 400;
   }
}

.delivery-item,
.payment-item {
   .custom-control-indicator {
      width: 26px;
      height: 26px;
   }

   &.selected {
      border-color: $black;

      .custom-control-indicator {
         display: flex;
         align-items: center;
         justify-content: center;
         border-color: $custom-control-border-checked !important;
         background: $custom-control-background-checked !important;

         &::before {
            content: '';
            width: 16px;
            height: 16px;
            background-image: $custom-checkbox-icon;
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
         }
      }
   }
}

.deliveries-collapsible {
   .delivery-reset-label {
      padding: 15px 20px;
   }

   .payments-box {
      .unselected-notify {
         font-size: $font-size-smaller;
      }
   }

   &.delivery-selected {
      .delivery-inperson-city {
         display: none;
      }
   }
}

.payment-item-gopay {
   cursor: pointer;
   display: flex;
   flex-wrap: wrap;
   flex-direction: column;

   > div {
      width: 100%;

      &.disabled {
         display: block;
      }
   }
}

.thepay-method {
   min-height: $delivery-label-height;
   order: 1;

   &.disabled {
      display: flex !important;
   }

   > div:first-child {
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex: 1;
      margin-right: 30px;
   }

   .name {
      margin: 0 10px 0 0;
   }

   img {
      max-width: 60px;
      max-height: 30px;
      height: auto;
      width: auto;
      margin: 0 5px;
   }

   .thepay-more {
      @include underline-never;

      display: flex;
      align-items: center;

      span {
         text-decoration: underline;
      }

      &:hover span {
         text-decoration: none;
      }
   }
}

.payment-item-gp {
   .img {
      text-align: center;

      img {
         display: inline-block;
      }
   }
}

.delivery-item-inperson {
   > div:first-child {
      justify-content: flex-start;
   }

   img {
      margin: 0;
   }

   @media screen and (max-width: 449px) {
      flex-wrap: wrap;
      padding-top: 10px;

      > div:first-child {
         flex: 100%;
      }

      > div:last-child {
         margin-left: 60px;
      }

      .name {
         order: 0 !important;
      }

      .img {
         margin: 0;
         align-self: center;
      }
   }
}

@media screen and (max-width: $md - 1) {
   .thepay-method img:nth-child(4) {
      display: none;
   }
}

@media screen and (max-width: $sm - 1) {
   .thepay-method img:nth-child(3) {
      display: none;
   }
}

@media screen and (max-width: $xs - 1) {
   .thepay-method img {
      display: none;
   }
}
