.template-7013.style-1 {
    display: flex;
    align-items: center;
}

.template-7013.style-1 .template__title {
    line-height: 1.4;
}

.template-7013.style-1 .template__entry {
    display: block;
    line-height: 1.4;
    background: #fff;
    border: 1px solid #D9D9D9;
    border-radius: 5px;
    padding: 6px 40px 6px 12px;
    position: relative;
}

.template-7013.style-1 .template__entry:before {
    content: '';
    position: absolute;
    right: 12px;
    top: 50%;
    height: 9px;
    width: 9px;
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
    transform: translateY(-80%) rotate(45deg);
    transition: transform .3s;
    z-index: 1 ;
}

.template-7013.style-1 .template__entry.is-active:before {
    transform: translateY(-20%) rotate(-135deg);
}

.template-7013.style-1 .template__inner {
    position: relative;
}

.template-7013.style-1 .template__list {
    transition: opacity .3s;
    opacity: 0;
    pointer-events: none;
    margin-top: 5px;
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 4;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .25);
    background-color: #fff;
    border-radius: 5px;
    padding: 5px 0;
}

.template-7013.style-1 .template__list.is-active {
    opacity: 1;
    pointer-events: all;
}

.template-7013.style-1 .template__list li {
    padding: 5px 15px;
    white-space: nowrap;
    transition: color .3s, background .4s;
}

.template-7013.style-1 .template__list li.is-checked,
.template-7013.style-1 .template__list li:hover {
    background: var(--color-3);
    color: #fff;
}

.template-7013.style-1 .radio-checkmark {
    display: none;
}

/* checked & selected color styles */

.template-7013.checked-color-2 .template__list li.is-checked {
    color: var(--color-2);
}

.template-7013.checked-color-2 .template__list li:hover {
    color: initial;
}

@media (min-width: 991.92px) {
    
    .template-7013.checked-color-2 .template__list li:hover {
        color: var(--color-2);
    }
}

/* checked & selected background color styles */

.template-7013.checked-bg-color-4 .template__list li.is-checked {
    background: var(--color-4);
}

.template-7013.checked-bg-color-4 .template__list li:hover {
    background: initial;
}

@media (min-width: 991.92px) {

    .template-7013.checked-bg-color-4 .template__list li:hover {
        background: var(--color-4);
    }
}

/*  style-1--alt  */

.template-7013.style-1.style-1--alt .template__entry {
    min-width: 160px;
    transition: background .3s, color .3s;
}

.template-7013.style-1.style-1--alt .template__entry:before {
    right: 8px;
    top: 50%;
    height: 22px;
    width: 23px;
    border-bottom: none !important;
    border-right: none !important;
    background-image: url('/assets/template_files/images/descending_icon_blue.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transform: translateY(-50%);
    transition: background-image .3s;
}

.template-7013.style-1.style-1--alt .template__entry.is-active {
    background: var(--color-3);
    color: var(--color-2);
}

.template-7013.style-1.style-1--alt .template__entry.is-active:before {
    background-image: url('/assets/template_files/images/descending_icon_white.svg');
}

.template-7013.style-1.style-1--alt .template__inner:has(.template__list li input#select-sort-page-title-asc:checked) .template__entry:before {
    background-image: url('/assets/template_files/images/ascending_icon_blue.svg');
}

.template-7013.style-1.style-1--alt .template__inner:has(.template__list li input#select-sort-page-title-asc:checked) .template__entry.is-active:before {
    background-image: url('/assets/template_files/images/ascending_icon_white.svg');
}


.template-7013.style-1.style-1--alt .template__list li:last-child {
    border-bottom: none !important;
}

/*style-2*/

.template-7013.style-2 .template__entry {
    position: relative;
}

.template-7013.style-2 .template__entry:before {
    content: '';
    height: 7px;
    width: 7px;
    border-bottom: 1px solid var(--color-3);
    border-right: 1px solid var(--color-3);
    display: inline-block;
    transition: transform .4s;
    transform: rotate(45deg);
    position: absolute;
    right: 10px;
    top: 10px;
}

.template-7013.style-2 .template__entry.is-active:before {
    transform: translateY(5px) rotate(-135deg);
}

.template-7013.style-2 .template__list {
    max-height: 0;
    transform: scaleY(0);
    opacity: 0;
    z-index: 2;
    transform-origin: top;
    transition: transform .4s;
    pointer-events: none;
}

.template-7013.style-2 .template__list .is-checked {
    color: var(--color-3) !important;
}

.template-7013.style-2 .template__list.is-active{
    max-height: 100%;
    transform: scaleY(1);
    opacity: 1;
    pointer-events: all;
}

.template-7013.style-2 .template__list .form-check-input,
.template-7013.style-2 .template__list .radio-checkmark {
    display: none;
}