.mM_custom_select {
position: relative;
border-radius: 0;
border: none;
border-bottom: 1px solid rgba(46, 46, 46, 0.2);
transition: border-color .4s;
}
.mM_custom_select:hover,
.mM_custom_select:has(.mM_select_selected:focus) {
border-color: rgba(46, 46, 46, 0.5);
}
.mM_custom_select:has(.mM_select_item.mM_same_as_selected) {
border-color: rgba(46, 46, 46, 0.75);
}
.mM_custom_select:has(.mM_select_arrow_active),
.mM_custom_select:has(.mM_select_arrow_active):hover,
.mM_custom_select:has(.mM_select_arrow_active):focus {
border-color: rgba(46, 46, 46, 0); }
.mM_custom_select select {
display: none;
}
.mM_custom_select .mM_select_selected {
cursor: pointer;
padding: 5px 0px;
transition: color .4s;
}
.mM_custom_select .mM_select_selected:focus {
outline-color: rgba(46, 46, 46, 0.5);
}
.mM_custom_select:has(.mM_select_item.mM_same_as_selected) .mM_select_selected {
color: rgba(46, 46, 46, 1);
}
.mM_custom_select .mM_select_items {
height: 0;
overflow: hidden;
overflow-y: scroll;
position: absolute;
left: 0;
top: calc(100% + 1px);
z-index: 99;
background: #fff;
width: 100%;
border-bottom: 1px solid rgba(46, 46, 46, 0);
transition: border-color .4s;
}
.mM_custom_select:has(.mM_select_arrow_active) .mM_select_items {
border-color: rgba(46, 46, 46, .5);
}
.mM_custom_select .mM_select_item {
cursor: pointer;
padding: 2px 0 3px;
transition: color .4s;
}
.mM_custom_select .mM_select_item:focus,
.mM_custom_select .mM_select_item:hover {
color: rgba(46, 46, 46, 0.75);
}
.mM_custom_select .mM_select_item:focus {
outline-color: rgba(46, 46, 46, 0.5);
}
.mM_custom_select .mM_select_item.mM_same_as_selected {
color: rgba(46, 46, 46, 1);
}
.mM_custom_select .mM_select_arrow_down {
position: absolute;
right: 0;
bottom: 13px;
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' data-name='Ebene 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 326.33' style='fill: %232e2e2e'%3E%3Cpath d='M441.67,0l-185.67,185.67L70.33,0,0,70.33l256,256L512,70.33,441.67,0Z'/%3E%3C/svg%3E");
opacity: .3;
background-size: 8px 6px;
width: 8px;
height: 6px;
transform: rotateX(0deg);
transition: transform .4s, opacity .4s;
}
.mM_custom_select .mM_select_arrow_active .mM_select_arrow_down,
.mM_custom_select:hover .mM_select_arrow_down,
.mM_custom_select:has(.mM_select_selected:focus) .mM_select_arrow_down,
.mM_custom_select:has(.mM_select_item.mM_same_as_selected) .mM_select_arrow_down {
opacity: .5;
}
.mM_custom_select .mM_select_arrow_active .mM_select_arrow_down {
transform: rotateX(180deg);
}