/* .offcanvas, .offcanvas-lg, .offcanvas-md, .offcanvas-sm, .offcanvas-xl, .offcanvas-xxl  {
	max-width: 800px !important;
    width: 100% !important;
	}
	 */
	
 
.text-shadow1 {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
}

 
 /* Make offcanvas full-screen */
.offcanvas.offcanvas-start {
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    max-height: 100vh !important;
}
 
.flexLayer {
    display: flex;
    flex-direction: row;
    justify-content: space-between; /* Ensures spacing remains even */
    align-items: stretch; /* Makes both sections equal height */
    width: 100%;
    height: 100vh; /* Full height of the screen */
    overflow: hidden;
	
}

/* Both sections take up equal width */
#cart-items, #customer_detail {border-right: 1px solid #ccc;}
#cart-items:hover, #cart-totals:hover, #customer_detail:hover {/* overflow-y: auto;  */}
#cart-items, #cart-totals, #customer_detail {
    flex: 1; /* Ensures equal width */
    min-width: 50%; /* Prevents shrinkage */
    max-width: 50%; /* Prevents expansion */
    /* Enables scrolling inside each section */
	overflow-y: auto; 
    padding: 15px;
    padding: 0px;
    background: white; /* Default background for cart-items */
    box-sizing: border-box; /* Prevents padding from increasing width */
}

/* Set background color for totals and ensure it fills the entire half */
#cart-totals {
    background-color: #f7f7f7; /* Light gray background */
    height: 100%; /* Ensures it fills the full height */
}
#cart-items::-webkit-scrollbar, #totals::-webkit-scrollbar {
    width: 5px; /* Thin scrollbar */
}

#cart-items::-webkit-scrollbar-thumb, #totals::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.3); /* Subtle scrollbar color */
    border-radius: 5px;
}

#cart-items::-webkit-scrollbar-track, #totals::-webkit-scrollbar-track {
    background: transparent; /* Hide track */
}

/* 
.group_inputs input{
	width:50%
} */

@media (max-width: 768px) {
  .input-group-custom {
    flex-wrap: wrap;
  }
  .input-group-custom .input-group-text {
    width: 100px; /* Adjust label width */
    justify-content: flex-start;
  }
  .input-group-custom .form-control {
    flex: 1 1 100%;
    min-width: 70%;
    margin-bottom: 5px;
  }
}