@import '../../global_components/add_to_list/index';

.addtolist-reorder-modal {

  .modal-content {
    .modal-header,
    .modal-body,
    .modal-footer {
      overflow: auto;
      padding: 0 1rem;
    }

    .modal-body {
      margin: 0;
    }

    .modal-footer{
      border: none;
    }

    .body-section {
      background:
        linear-gradient(white 30%, rgba(255,255,255,0)),
        linear-gradient(rgba(255,255,255,0), white 70%) 0 100%,
        radial-gradient(farthest-side at 50% 0, rgba(0,0,0,.2), rgba(0,0,0,0)),
        radial-gradient(farthest-side at 50% 100%, rgba(0,0,0,.2), rgba(0,0,0,0)) 0 100%;
      background-repeat: no-repeat;
      background-color: transparent;
      background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
      background-attachment: local, local, scroll, scroll;

      overflow-y: scroll;
      overflow-x: hidden;

      .center-align {
        @include margin(32px 0);
      }

      .negative-z-index {
        z-index: -1;
      }

      input[type="number"].quantity-field {
        text-align: center;
        text-align: -webkit-center;
        padding: 12px 1px;
        -moz-appearance: textfield;
      }

      input[type="number"].quantity-field::-webkit-outer-spin-button,
      input[type="number"].quantity-field::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
      }

      input[type="number"].quantity-field:hover,
      input[type="number"].quantity-field:focus {
        -moz-appearance: 'number-input';
      }

      @include breakpoint(xs) {
        max-height: 28rem;

        input.quantity-field {
          width: 3rem;
        }
      }

      @include breakpoint(sm) {
        max-height: 22rem;
      }
    }
  }

  @media all and (min-width:0\0) and (min-resolution: .001dpcm) {
    .ie-inline-fix {
      width: 47%;
      float: left;
    }
  }

  @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .ie-inline-fix {
      width: 47%;
      float: left;
    }
  }
}