select {
  margin-right: 20px;
  margin-left: 80px;
  margin-bottom: 10px;
  width: 230px;
  height: 21px;
}

form {
  position: relative;
}

.head-div0 {
  display: flex;
  flex-direction: row;
  margin-bottom: 7px;
  height: 4.4vh;
  align-items: center;
}

.sku-inp, .remark-inp {
  width: 20%;
  height: 100%;
  background-color: transparent;
  border: 2px solid rgb(109, 212, 219);
  border-radius: 7px;
  color: white;
  padding-left: 10px;
  font-size: 1.9vh;
}

.sku-inp {
  margin-left: 1.5vw;
}

.sku-inp::placeholder, .remark-inp::placeholder {
  font-size: 1.7vh;
}

.remark-inp {margin-left: 1vh;}

.save-butt {
  position: absolute;
  right: 11vh;
  width: 12%;
  font-size: 2.3vh;
  background-color: rgb(48, 161, 50);
  color: white;
  margin-left: 90px;
  border-radius: 7px;
  border: none;
  height: 4.3vh;
  cursor: pointer;
  transition: 0.2s ease;
}

.save-butt:hover, .save-butt2:hover {
  background-color: rgb(28, 116, 29);
  color: black;
}

.save-butt:active, .save-butt2:active {
  background-color: rgb(10, 31, 10);
  color: rgb(244, 244, 244);
}

.stockentryedit2-buttons-div {
  display: flex;
  flex-direction: row;
  width: 30%;
  gap: 5px;
  margin-left: 55vh;
}

.save-butt2 {
  font-size: 2.3vh;
  background-color: rgb(48, 161, 50);
  color: white;
  margin-left: 90px;
  border-radius: 7px;
  border: none;
  height: 4.3vh;
  cursor: pointer;
  transition: 0.2;
}

.submit-butt2, .cancel-butt, .save-butt2 {
  width: 100%;
  border-radius: 7px;
  color: white;
  font-size: 2.3vh;
  border: none;
  transition: 0.2;
  cursor: pointer;
  transition: 0.2s ease;
}

.submit-butt2 {
  background-color: aqua;
  color: rgb(54, 53, 53);
}

.submit-butt2:disabled, .cancel-butt:disabled {
  background-color: black;
}

.submit-butt2:hover {
  background-color: rgb(13, 75, 75);
  color: white;
}

.cancel-butt {
  background-color: brown;
}

.cancel-butt:hover {
  background-color: rgb(94, 38, 38);
}

.second-head-div {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 1vh;
  margin-top: 1.4vh;
  position: relative;
}

.fa-circle, .invoice-status-span {
  color: rgb(34, 70, 211);
  font-size: 2vh;
  margin-right: 1vh;
}

.invoice-status-span {
  margin-right: 4vh;
}

.excel-file-inp {
  display: none;
}

.fa-file-excel {
  margin-left: 2vh;
  margin-right: 6vh;
  font-size: 3vh;
  cursor: pointer;
  color: rgb(18, 196, 116);
  transition: 0.2s ease;
}

.fa-file-excel:hover {
  color: rgb(18, 196, 184);
}

.fa-file-excel:active {
  background-color: transparent;
  transition: 0.05s;
  color: rgb(2, 16, 15);
}

.find-item-div {
  position: relative;
  width: 17%;
  height: 3vh;
}


.search-inp {
  background-color: transparent;
  border: none;
  outline: none;
  color: white;
  border-bottom: 0.4vh solid rgb(18, 196, 116);
  font-size: 2vh;
  padding-left: 2vh;
}

.existing-item-par {
  position: absolute;
  right: 25px;
  bottom: 0px;
  color: rgb(18, 196, 116);
}

.checkbox-div {
  margin-left: 53.5vw;
  margin-right: 1.7vh;
}

.change-price-label {
  margin-left: 1.3vh;
  margin-right: 3vh;
  font-size: 2vh;
  cursor: pointer;
}

.checkbox-inp {
  height: 20px;
  transform: scale(2.3);
  margin-right: 2vh;
  cursor: pointer;
}

.fa-eye-slash, .fa-eye {
  font-size: 2.5vh;
  cursor: pointer;
  margin: 0;
  color: aquamarine;
}

.head-div {
  background-color: rgb(24, 55, 55);
  height: 4vh;
  display: flex;
  align-items: center;
  margin-bottom: 8px;
  border-radius: 3px;
  font-size: 1.8vh;
}

.index-par {
  position: absolute;
  left: 2vh;
}

.select-item-div {
  display: flex;
  align-items: center;
  margin-left: 27vw;
  justify-content: center;
}

.select-item-par {
  margin-right: 6px;
}

.buy-price-par {
  margin-left: 27.5vw;
}

.quantity-par {
  margin-left: 7vw;
}

.delete-par {
  margin-left: 15vw;
}

.index {
  position: absolute;
  left: 1vh;
  z-index: 1000;
}

.add-item-butt {
  font-size: 2.5vh;
  cursor: pointer;
}

.add-item-butt:hover {
  color: rgb(89, 212, 175);
}

.container-div {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-left: 4vh;
  height: 5vh;
  gap: 10px;
  margin-bottom: 6px;
}

.stock-entry-form {
  overflow-y: scroll;
  height: calc(83vh - 50px);
}

.stock-entry-form::-webkit-scrollbar {
  display: none;
}

.new-div, .buy-price-inp {
  position: relative;
  background-color: rgb(35, 34, 34);
  color: white;
  width: 10%;
  border-radius: 3px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding-left: 9px;
  font-size: 1.7vh;
  border: none;
}

.new-div {
  width: 60%;
  cursor: pointer;
}

.buy-price-inp {
  color: rgb(49, 183, 138);
  padding-left: 10px;
  outline: none;
}

.two-quantity-div {
  position: relative;
  width: 10%;
  height: 100%;
}

.quantity-inp {
  width: 100%;
  height: 100%;
  background-color: rgb(35, 34, 34);
  color: rgb(44, 108, 235);
  z-index: 100;
  border-radius: 3px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  font-size: 1.7vh;
  padding-left: 10px;
  outline: none;
}

.last-quantity-div {
  position: absolute;
  top: 1.2vh;
  right: 4px;
  color: rgb(171, 163, 163);
}

.delete-icon {
  margin-left: 13vw;
  font-size: 2.5vh;
  color: rgb(20, 134, 134);
  cursor: pointer;
  padding: 11px;
  border-radius: 40px;
  transition: 0.15s ease;
}

.delete-icon:hover {
  background-color: rgb(55, 81, 81);
}


.input-container-div {
  display: flex;
  display: none;
  flex-direction: column;
  background-color: rgb(18, 17, 16);
  position: absolute;
  align-items: center;
  justify-content: center;
  height: 46%;
  border-radius: 5px;
  width: 20%;
  text-align: center;
  left: 22vw;
}

.new-inp {
  position: absolute;
  top: 10px;
  width: 90%;
  height: 30px;
  background-color: black;
  color: white;
}

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

.costum-dropdwon {
  display: flex;
  flex-direction: column;
  position: absolute;
  border-radius: 5px;
  top:18%;
  width: 97%;
  color: white;
  overflow: auto;
  height: calc(40vh - 45px);
  scrollbar-width: none;
}

.item-span {
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  align-items: center;
  cursor: pointer;
  font-size: 1.7vh;
  word-wrap: break-word;
}

.item-span:hover {
  background-color: rgb(48, 48, 48);
}

.amount-container-div {
  display: flex;
  background-color: #0f1411;
  height: 4.5%;
  position: absolute;
  bottom: 0.5%;
  right: 0.3%;
  left: 0.3%;
  border-radius: 20px;
  color: white;
  align-items: center;
  justify-content: center;
  font-size: 2vh
}

.total-iqd-span {
  margin-left: 5px;
  margin-right: 260px;
  color: rgb(49, 183, 138);
}

.total-quantity-span {
  margin-left: 5px;
  color: rgb(44, 108, 235);
}

.spinner-container {
  position: absolute;
  left: 43vw;
  top: 18vh;
  height: 100%; /* Makes it fill the container vertically */
}

.spinner {
  width: 8vw;
  height: 8vw;
  border: 14px solid #ccc;
  border-top: 14px solid rgb(40, 40, 40);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

.fa-calculator {
  margin-left: 20px;
  font-size: 25px;
  cursor: pointer;
  color: rgb(80, 192, 80);
  transition: all 0.2s ease;
  padding: 12px;
}

.fa-calculator:active {
  color: rgb(7, 79, 7);
}

.modal-container-div {
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  z-index: 100;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.modal-container-div.show {
  visibility: visible;
  opacity: 1;
}

.modal-container-content-div {
  background-color: rgb(12, 12, 12);
  padding: 20px;
  text-align: center;
  width: 17vw;
  height: 28vh;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
}

.kilo-inp, .kilo-price-inp, .doller-dinar-inp, .RMB-inp {
  height: 5.7vh;
  background-color: transparent;
  border-top: none;
  border-right: none;
  border-left: none;
  color: wheat;
}