.generatePicklist,
.managePicklist,
.scanPacklist,
.detailExportPicklist,
.exportPicklist,
.picklistSettings,
.processHistory {
  float: right;
  margin-top: 2px;
  text-decoration: none !important;
}
#tbGeneratePicklistLog_wrapper {
  margin: 1rem 0;
}
#tbGeneratePicklistLog_wrapper thead .form-check-input {
  position: absolute;
  margin-top: 0.25rem;
  margin-left: 0.5rem;
  zoom: 1.4;
}
#tbGeneratePicklistLog_wrapper .form-check-input {
  position: absolute;
  margin-top: -0.4rem;
  margin-left: 2.3rem;
  zoom: 1.4;
}
#printPicklistLog .modal-dialog,
#printlistSettings .modal-dialog {
  max-width: 500px !important;
}
.popover .arrow {
  top: auto !important;
}
#skuPicklistModal .modal-dialog,
#picklistSettingsModal .modal-dialog,
#deletePicklistModal .modal-dialog {
  max-width: 400px !important;
}
#processHistoryModal .modal-dialog {
  max-width: 850px !important;
}
.order-details .gift-wrapper p span {
  font-weight: bold;
}
.order-details .gift-wrapper p {
  flex-basis: 33%;
  margin-bottom: 5px;
}
.order-details {
  border-bottom: 1px solid #eee;
  padding: 10px 0;
}
.order-details:last-child {
  border-bottom: 0;
}
.box-shadow1 {
  box-shadow: 1px 2px 4px #777;
}
.orderStatusBox span,
.orderDetailBox span {
  font-size: 13px;
}
.orderStatusBox p {
  word-break: break-all;
  font-weight: bold;
}
.modal-dialog {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
}
select#fulfillmentLocationSelectId {
  height: 30px;
  width: 100%;
  background: white;
  border-radius: 5px;
}
.partnerLineHeight .selectize-control {
  line-height: 0;
}
.partnerSelectDisabled {
  pointer-events: none;
  opacity: 0.4;
}
.incColWid tbody tr:first-child td:first-child {
  width: 102px !important;
}

input#chkBoxId.form-check-input {
  position: absolute;
  margin-top: 0.3rem;
  margin-left: 0.25rem;
}
/* .colWid tbody tr:first-child td:first-child {
	width:65px !important;
} */
/* .colWid tbody tr:first-child td:first-child {
	width:60px !important;
}
.colWid tbody tr:first-child td:nth-child(2) {
	width:80px !important;
} */

#tbGeneratedPicklist tr th:nth-child(1) {
  width: 7% !important;
}
#tbGeneratedPicklist tr th:nth-child(8) {
  width: 7% !important;
}
td:has(.red) {
  background: red;
  color: white;
}

.box-shadow2 {
  box-shadow: 1px 2px 4px #777;
}
.box-shadow2:active {
  box-shadow: 1px 2px 4px #777;
  background-color: #e1e9f1;
}

.add-new-box:hover i {
  transform: rotate(90deg);
  transition: 400ms all ease-out;
}
.add-new-box {
  height: 28px;
  width: 28px !important;
  border-radius: 50% !important;
  position: relative;
}
.add-new-box i {
  position: absolute;
  top: 30%;
  left: 30%;
}


.bookHover:hover {
	border: 2px solid #afca0b;
}

.volumeBookCross {
  color: #afca0b !important;
  text-align: right !important;
  padding-top: 0 !important;
  font-weight: bold !important;
  font-size: 22px !important;
  cursor: pointer !important;
  opacity: 0.5 !important;
  text-decoration: none !important;
  position: absolute !important;
  right: 1% !important;
  top: 0.25rem !important;
  text-shadow: 0 1px 0 #fff !important;
  line-height: 1 !important;
}

.volumeBookCross:hover {
	opacity: 1;
}

.dropdown {
      position: relative;
      display: inline-block;
	  margin-top: 16px;
    }

     Style the dropdown button 
    .dropdown-button,#butt1,.dropdown-button11,#butt3 {
      padding: 11px 20px;
      font-size: 16px;
      cursor: pointer;
      border: 1px solid #ccc;
      background-color:#afca0b;
      border-radius: 5px;
      display: inline-block;
	  color:white;
	  
    }

     Style the dropdown menu initially hidden
    .dropdown-menu {
      display: none;
      position: absolute;
      background-color: white;
      min-width: 60px;
      box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
      z-index: 1;
      border-radius: 5px;
      margin-top: 5px;
      padding: 10px 0;
    }

     Style the menu items 
    .dropdown-menu a {
      color: black;
      padding: 2px 7px;
      text-decoration: none;
      display: block;
    }

     Change background color of menu items on hover 
    .dropdown-menu a:hover {
      background-color: #f1f1f1;
    }

     Show the dropdown when the button is clicked 
    .dropdown.open .dropdown-menu {
      display: block;
	  width:20px;
	 
    }
	.dropdown.open{
		height: 48px;
		margin-top:17px;
	}
	

	#dropone a{
		text-decoration:none;
	}

	#dropone a:hover{
		transition:  all 0.5s ease;
		color:white;
		background-color:#afca0b;
	}

	#arrow{
		margin-left: 7px;
	}
	
	.dropdown1 {
		margin-top:20px;
	           position: relative;
	           display: inline-block;
	       }

	       .dropdown-button1 {
	           background-color:#afca0b;  /*Green*/ 
	           color: white;
	           padding: 10px 20px;
	           font-size: 16px;
	           border: none;
	           cursor: pointer;
	           border-radius: 5px;
	       }

	       

	       .dropdown-menu1 {
			width:200px;
	           display: none;  /*Hide the dropdown menu initially */
	           position: absolute;
	           background-color: #f9f9f9;
	           min-width: 160px;
	           box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
	           z-index: 1;
	           border-radius: 5px;
	       }

	       .dropdown-menu1 a {
	           color: black;
	           padding: 5px 8px;
	           text-decoration: none;
	           display: block;
	       }

	       .dropdown-menu1 a:hover {
	           background-color: #f1f1f1;  /*Highlight option on hover */
	       }

	        Nested dropdown styling for Option A 
	       .dropdown-submenu {
			list-style: none;
	           position: relative;
	       }

	       .dropdown-submenu .dropdown-menu2 {
			list-style: none;
			width:200px;
	           display: none;
	           position: absolute;
	           top: 0;
	           left: 100%;  /*Open to the right */
	           background-color: #f9f9f9;
	           min-width: 500px;
	           box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
	           border-radius: 5px;
			   
	       }

	       .dropdown-submenu a {
	           cursor: pointer;
	       }
	
		   
		   #arrow2{
			float:right;
		   }
		   
		   
		   li.dropdown-submenu a{
			text-decoration:none;
		   }
		   
		  li.dropdown-submenu a:hover{
		   		transition:  all 0.5s ease;
		   		color:white;
		   		background-color:#afca0b;
		   	}
			
			.dropdown-menu11 {
						  display: none;
						  position: absolute;
						  background-color: #f9f9f9;
						  min-width: 143px;
						  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
						  z-index: 1;
						}

						.dropdown-menu11 a {
						  color: black;
						  padding: 8px 16px;
						  text-decoration: none;
						  display: block;
						}

					
						.dropdown-menu11 a:hover {
						color:black;
						  background-color:#afca0b;
						  text-decoration: none;
						}
						.dropdown11 {
							
							margin-left:150px;
							
						
						
						            position: relative;
									            width: 200px;
									        }
									        .search-input {
									            width: 100%;
									            padding: 10px;
									            /*border: 1px solid #ccc;*/
									            border-radius: 5px;
									            outline: none;
									            cursor: pointer;
									        }
									        .dropdown-content {
									            position: absolute;
									            width: 100%;
									            background: white;
									            border: 1px solid #ddd;
									            max-height: 150px;
									            overflow-y: auto;
									            display: none;
									            border-radius: 5px;
									        }
									        .dropdown-content div {
									            padding: 8px;
									            cursor: pointer;
									        }
									        .dropdown-content div:hover {
									            background: #f0f0f0;
									        }
									        .show {
									            display: block;
									        }*/


						.dropdown {
							position: relative;
							/* Ensure relative positioning for absolute children */

						}


						.dropdown-content {
							position: absolute;
							top: 100%;
							/* Place dropdown right below search bar */
							left: 0;
							width: 100%;
							background: white;
							border: 1px solid #ddd;
							max-height: 150px;
							overflow-y: auto;
							display: none;
							border-radius: 5px;
							z-index: 1000;
							/* Ensures it appears above other elements */
						}


						#dropdown1,#dropdown2 {
							position: relative;
							width: 368px;
							/*margin-left: -20px;*/
						}

						.search-input1, .search-input3 {

							width: 475px;
							padding: 10px;
							border: 1px solid #ccc;
							border-radius: 5px;
							outline: none;
							cursor: pointer;
						}

						.dropdown-content {
							position: absolute;
							width: 100%;
							background: white;
							border: 1px solid #ddd;
							max-height: 150px;
							overflow-y: auto;
							display: none;
							border-radius: 5px;
						}

						.dropdown-content div {
							padding: 8px;
							cursor: pointer;
						}

						.dropdown-content div:hover {
							background: #f0f0f0;
						}

						.dropdown-content1 div {
							padding: 8px;
							cursor: pointer;
						}

						.dropdown-content1 div:hover {
							background: #f0f0f0;
						}

						.show {
							display: block;
						}

						#col1 {
							margin-left: 20px;
						}

						.dropdown-icon {
							position: absolute;
							    right: 0px;
							    padding-right: 30px;
							    /* padding-left: 0px; */
							    width: 20px;
							    background-color: white;
							    top: 42%;
							    transform: translateY(-50%);
							    pointer-events: none;
							    color: #555;
						}

						.dropdown-icon1 {
							position: absolute;
							    right: 30px;
							    padding-left: 20px;
							    padding-right: 11px;
							    background-color: white;
							    top: 50%;
							    transform: translateY(-50%);
							    pointer-events: none;
							    color: #555;
						}

						#butt1,#butt2{
									margin-left: 10px;
									    width: 140px;
									    /*height: 47px;*/
									    /*margin-top: -75px;*/
										padding: 0px 11px;
										     font-size: 16px;
										     cursor: pointer;
										     border: 1px solid #ccc;
										     background-color:#afca0b;
										     border-radius: 5px;
										     display: inline-block;
										  color:white;
										
									}
									
									
									.plusAdd {
									    display: flex;
										justify-content: flex-end;
										margin-right: 15px;
									    gap: 10px; /* Optional: adds space between buttons */
									}

									.plusAdd button {
									    flex: 0 0 auto; /* Ensures buttons retain their size */
										margin-top: 8px;
									}
									.isbn-box {
									    min-height: 300px;
									    max-height: 400px;
									    overflow-y: auto;
									    background-color: #f9f9f9;
									  }
									  
									  .isbn-box {
									      border: 2px solid #ddd;
									      border-radius: 8px;
									      padding: 15px;
									      min-height: 300px;
									      max-height: 400px;
									      overflow-y: auto;
									      background-color: #f9f9f9;
									      box-shadow: 0 0 8px rgba(0,0,0,0.1);
									    }

									    .f2-container {
									      border-color: #28a745;
									      background-color: #eafbe7;
									    }

									    .f1-container {
									      border-color: #007bff;
									      background-color: #e7f0fe;
									    }

									    .box-title {
									      font-size: 16px;
									      font-weight: bold;
									      margin-bottom: 10px;
									      color: #333;
									      border-bottom: 1px solid #ccc;
									      padding-bottom: 5px;
									    }

									    .action-buttons button {
									      width: 100px;
									    }
										.modal-sm .modal-footer .btn {
										  min-width: 70px;
										}
										.custom-small-modal .modal-dialog {
										  max-width: 300px; /* You can reduce this to 250px, 200px etc. */
										  margin: auto;
										}
										.clear-icon {
										    position: absolute;
										    right: 50px; /* Adjust based on your layout */
										    top: 50%;
										    transform: translateY(-50%);
										    cursor: pointer;
										    color: #999;
										    z-index: 10;
										}
										/* Style for the checkbox container */
										#f1Box div, #f2Box div {
										    display: flex;
										    align-items: center;
										    margin-bottom: 10px; /* Space between items */
										}

										/* Styling for the checkbox */
										.isbnCheckbox {
										    margin-right: 10px; /* Space between checkbox and text */
										}

										/* Styling for the error message */
										#f1Box label, #f2Box label {
										    color: black; /* Ensure the error text is black */
										    font-size: 14px; /* Optional: Adjust the font size */
										}
										
										#shippingModal .modal-dialog {
										    max-width: 350px; /* Adjust as needed */
										}

										#shippingModal .modal-body {
										    padding: 15px; /* Reduce padding if needed */
										}
										
										.printPicklist{
											display: flex;
											justify-content: space-between;
										}
										
										
										/* Custom File Upload Design */
										.custom-file {
										    position: relative;
										    display: inline-block;
										    width: 100%;
										    text-align: center;
										}

										.custom-file-input {
										    display: none; /* Hide the default file input */
										}

										.custom-file-label {
										    display: inline-block;
										    width: 100%;
										    padding: 0.375rem 1.25rem;
										    font-size: 1rem;
										    font-weight: 400;
										    text-align: center;
										    background-color: #f8f9fa;
										    border: 1px solid #ced4da;
										    color: #495057;
										    border-radius: 0.25rem;
										    cursor: pointer;
										    transition: background-color 0.3s ease;
										}

										.custom-file-label:hover {
										    background-color: #e2e6ea;
										}

										.custom-file-input:focus + .custom-file-label {
										    border-color: #80bdff;
										    outline: 0;
										}

										.custom-file-input:valid + .custom-file-label {
										    color: #28a745;
										}

										.custom-file-label::after {
										    content: "Browse...";
										    color: #007bff;
										}

										.custom-file-label {
										    text-align: center;
										}

										/* Centering the file input section in the modal */
										.modal-body .row {
										    justify-content: center; /* This ensures the row and elements inside it are centered */
										}

										/* Optional: Adjust the modal body padding */
										.modal-body {
										    padding: 2rem 3rem;
										}

										/* Additional styles for the download button and modal */
										.modal-header {
										    display: flex;
										    justify-content: space-between;
										    align-items: center;
										}

										.modal-title {
										    display: flex;
										    justify-content: space-between;
										    align-items: center;
										}

										.modal-title button {
										    margin-left: 500px;
										}
										/* Ensure the tables can scroll horizontally if content overflows */
										.table-container {
										    overflow-x: auto;
										    -webkit-overflow-scrolling: touch; /* Enables smooth scrolling for touch devices */
										    max-width: 100%; /* Ensures the container doesn't exceed the page width */
										    margin-bottom: 20px; /* Adds some space below the table */
										}

										/* Optional: Style the table to make sure it is responsive */
										.table {
										    width: 100%;
										    table-layout: auto; /* Let the table expand to fit content */
										}

										/* Optional: Customize the scrollbars (for Webkit browsers) */
										.table-container::-webkit-scrollbar {
										    height: 8px; /* Height of the horizontal scrollbar */
										}

										.table-container::-webkit-scrollbar-thumb {
										    background: #888; /* Color of the scrollbar thumb */
										    border-radius: 4px;
										}

										.table-container::-webkit-scrollbar-thumb:hover {
										    background: #555; /* Darker color when hovering */
										}
										
										/* Ensure the modal body is scrollable if the content overflows vertically */
										.modal-body {
										    max-height: 70vh; /* Set a max height for the modal body */
										    overflow-y: auto; /* Allow vertical scrolling */
										    padding-right: 15px; /* To prevent the scrollbar from overlapping content */
										}

										/* Optional: Add a scrollbar style */
										.modal-body::-webkit-scrollbar {
										    width: 8px; /* Width of the vertical scrollbar */
										}

										.modal-body::-webkit-scrollbar-thumb {
										    background: #888; /* Color of the scrollbar thumb */
										    border-radius: 4px;
										}

										.modal-body::-webkit-scrollbar-thumb:hover {
										    background: #555; /* Darker color when hovering */
										}



										
							
										
										
