*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
.dropdown-skppr{
    height: 40px;
    background-color: #2B2B2B;
    /*width:30px;*/
}



.dropdown-skppr .dropdown {
    position: relative;
}

.dropdown-skppr #dropdownButton {
    text-align: left;
    position: relative;
    padding-right: 10px; /* Space for the arrow */
    margin-top: 3px;
    background-color: #2B2B2B;
       text-transform: capitalize;
    border: none;
    outline: none;
        padding-left: 0px;
    width: 128px;
}
.dropdown-skppr .btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
    outline: none;
    /*outline-offset: -2px;*/
}

.dropdown-skppr #dropdownButton::after {
    content: '';
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none"><path d="M7 10L12 15L17 10" stroke="%23ffffff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-size: 18px 18px;
    background-repeat: no-repeat;
    position: absolute;
    right: 26px;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    transition: transform 0.2s ease;
   
}

.dropdown-skppr #dropdownButton.active::after {
    transform: translateY(-50%) rotate(180deg);
   /*transform: translateY(-50%) rotate(180deg) translateX(-4px)*/
  
}

.dropdown-skppr .dropdown-menu {

    position: absolute;
    background-color: #2B2B2B;
    border: none;
min-width: 138px !important;
    padding: 0 !important;
    z-index: 101;
    transition: all .5s ease;
    left:-23px;
    margin-top:0px;
  
}


.dropdown-skppr .dropdownMenuItems {
	max-height: 200px;
	overflow: auto;
    background-color: #2B2B2B;
    color: white;
}
.dropdown-skppr .dropdownMenuItems li{
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.20);
    border-bottom: 1px solid #3e3e3e;
}
.dropdown-skppr .dropdownMenuItems li:hover{
    background-color: #313131;
}
.dropdownMenuItems ul{
    margin-bottom: 0px;
}


.dropdown-skppr li:hover img {
    filter: brightness(0.7);
}
.dropdown-skppr .dropdownMenuItems li img{
    height: 41px;
    width: 90px;
}
.dropdown-skppr .dropdown-menu .dropdownMenuItems::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

.dropdown-skppr .dropdown-menu .dropdownMenuItems::-webkit-scrollbar-track {
	background:#2B2B2B;
}

.dropdown-skppr .dropdown-menu .dropdownMenuItems::-webkit-scrollbar-thumb {
	background: #888;
}

.dropdown-skppr .dropdown-menu .dropdownMenuItems::-webkit-scrollbar-thumb:hover {
	background: red;
}

.dropdown-skppr .dropdown-menu .dropdownMenuItems::-webkit-scrollbar-button {
	display: none;
}

.dropdown-skppr .dropdown-menu label {
    display: block;
    padding: 5px 8px;
    cursor: pointer;
	margin: 0;
	user-select: none;
    transition: background-color 0.3s ease; 
}
.dropdown-skppr .dropdown-menu li:hover {
    background-color: #363535; 
}
.dropdown-skppr .hover-item {
    display: flex; /* Align items horizontally */
    align-items: center; /* Center align vertically */
    padding: 5px 10px; /* Add some padding */
    cursor: pointer; /* Change cursor on hover */
    transition: color 0.3s ease; /* Smooth transition */
}

.dropdown-skppr .hover-item:hover {

    color: rgb(255, 0, 0); /* Change text color to white */
}
.close_dropdown{
    display: none;
}
.dropdown-skppr .btn-primary:active, .dropdown-skppr .btn-primary:focus {
    background: transparent !important;
    /*border-color: #806D5A !important;*/
    /*color: #fff !important;*/
}


@media only screen and (max-width:991.98px){
        
        .dropdown-skppr .dropdown-menu{
                z-index: 562;
        }
    
}