.bin-search-bar {
    display: flex;
    align-items: center;
    gap: 1vh;
    width: 90%;
}

.bin-search-bar label {
    flex-shrink: 0;
    white-space: nowrap;
}

#bin-search-input {
	font-size: var(--font-size);
	padding: 1.5vh 1.5vh;
	border-radius: 0.5vh;
	color: white;
	background-color: #333;
	width: 60%;
	border: 0.3vh solid white;
    flex: 1;
    min-width: 0;
}

#bin-search-filt-panel {
	margin-top: 1vh;
}

#bin-action-delta-in,
#bin-action-new-qty-in,
#bin-search-filt-qty {
	font-size: var(--font-size);
	width: 6vh;
}

#bin-action-delta-in {
	margin-top: 1vh;
}

#bin-search-filt-qty-cmp,
#bin-search-filt-fav {
	font-size: var(--font-size);
}

#bin-search-filt-panel {
	display: none;
}

#bin-action-new-type-in,
#bin-action-edit-type-in,
#bin-search-filt-type {
	font-size: var(--font-size);
	width: 12vh;
}

#bin-action-order-in {
	font-size: var(--font-size);
	width: 10vh;
}

#bin-action-note-in,
#bin-action-new-note-in,
#bin-action-new-pn-in,
#bin-action-edit-note-in,
#bin-action-edit-pn-in {
	font-size: var(--font-size);
	width: 100%;
}

#bin-menu:hover {
	background-color: #333;
	color: white;
}

/*type image hover logic begin*/
tr:hover .type-img {
  display: none;
}
  
tr:hover .type-img-hover {
  display: inline-block;
}

.type-img, .type-img-hover {
	width: 4vh;
}

.type-img-hover {
	display: none;
}

.bin-actions {
	display: flex;
  	justify-content: center; /* Centers horizontally (Main Axis) */
  	align-items: center;     /* Centers vertically (Cross Axis) */
  	flex-wrap: wrap;
}

/*type image hover logic end*/
.bin-search-result-container {
	overflow-x: auto;
}

#bin-search-log {
	margin: 2vh;
}


@media screen and (max-width: 768px) {
	#bin-action-new-type-in {
		width: 10vh;
	}

	#bin-action-order-in,
	#bin-action-delta-in  {
		width: 6vh;
	}
}