@import "core/static/core/colors";

.quantity {
  display: inline-block;
  min-width: 1.2em;
  text-align: center;
}

.remove-item {
  float: right;
}

.basket-message-container {
  position: relative;
  display: block
}

.basket-message {
  z-index: 10; // to get on top of tomselect
  text-align: center;
  position: absolute;
}


#bar-ui {
  padding: 0.4em;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row-reverse;
}

#products {
  flex-basis: 100%;
  margin: 0.2em;
  overflow: auto;
}

#click-form {
  flex: auto;
  margin: 0.2em;
  width: 20%;
  min-width: 350px;

  ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-left: 0;

    .basket-row {
      display: flex;
      align-items: center;
      gap: 1rem;

      .product-name {
        flex: 1 2 0;
        min-width: 0;
        text-wrap: wrap;
      }
    }
  }

  form {
    margin-top: .5rem;
    margin-bottom: .5rem;
  }
}

#user_info {
  flex: auto;
  padding: 0.5em;
  margin: 0.2em;
  height: 100%;
  background: $secondary-neutral-light-color;

  img {
    max-width: 70%;
  }

  input {
    background: white;
  }
}