.quickform{
	
	position: fixed;
	display: inline-block;
	width: 600px;
	height: 50%;


	border-radius: 4px;

	left: 50%;
	transform: translate(-50%, -30%);
	transform-origin: center;
	top: 130vh; //keep hide
	@include back-visivility;


	background-color: $c-surface;
	z-index: 220;
	padding: 8px;
	padding-top: 56px;

	@include bs-24;  

    //border: 3px solid red;               //←←←←←←←←←←←←←←←←←←←←
}

@media (max-width: 500px) {
	.quickform {
	  width: 100vw;
	  height: 100vh;
  
	  & .card {
		min-height: calc(100vh - 80px);
  
		& .row {
		  & .c100 {
			position: relative;
  
			.icon-container {
			  position: absolute;
			  top: 525px;
			  left: 85px;
			  img {
				width: 200px;
				height: 200px;
			  }
			}
  
			& .multitable {
			  display: flex;
			  flex-direction: column;
			  justify-content: start;
			  height: calc(100vh - 85px);
			  gap: 10px;
  
			  & > input {
				outline: none;
				height: 35px;
				&::placeholder {
				  padding-left: 10px;
				}
			  }
  
			  .confirm-counter {
				margin: 0 auto;
				p {
				  font-size: 20px;
				}
			  }
  
			  & #btn-confirm {
				width: 45%;
				background-color: $cpd;
				color: white;
				margin: 0 auto;
				border: none;
				height: 25px;
			  }
  
			  & #sale_form_sale_vs_item_2 {
				& .line {
				  min-height: 25px;
				  padding-left: 0;
				  & .restriction {
					display: none;
				  }
				  & .removeLine {
					display: none;
				  }
				  & .row {
					& .itemname {
					  width: 100% !important;
					  & .row {
						& .c100 {
						  & .textfield {
							min-height: 50px;
							margin-top: 15px;
  
							& .chip-cont {
							  display: flex;
							  align-items: center;
							  gap: 2px;
  
							  & .warning-container {
								background-color: #ff040428;
								height: 40px;
								width: 32px;
								border-radius: 10px;
								display: flex;
								align-items: center;
								justify-content: center;
  
								p {
								  font-size: 20px;
								  color: red;
								}
							  }
  
							  & .check-container {
								background-color: #77ffa03c;
								height: 40px;
								width: 32px;
								border-radius: 10px;
								display: flex;
								align-items: center;
								justify-content: center;
  
								p {
								  font-size: 35px;
								}
							  }
  
							  & .chip {
								height: 40px;
								width: calc(100% - 45px);
								border-radius: 10px;
								padding-right: 20px;
								background-color: rgba(255, 4, 4, 0.155);
  
								& label {
								  left: 34px;
								  top: 12px;
								  color: #ff0000;
								  font-size: 14px;
								}
  
								& span {
								  display: none;
								}
							  }
  
							  & .chip-green {
								height: 40px;
								width: calc(100% - 45px);
								border-radius: 10px;
								padding-right: 20px;
								background-color: #77ffa03c;
  
								& label {
								  left: 34px;
								  top: 12px;
								  color: #003406;
								  font-size: 14px;
								}
  
								& span {
								  display: none;
								}
							  }
							}
						  }
						}
					  }
					}
					& .itemdetail {
					  width: 0% !important;
					  & .row {
						display: none !important;
					  }
					}
				  }
				}
			  }
			}
		  }
		}
	  }
	}
  }