.oak-row:has(.oak-lister) {
    overflow: visible;
}

.oak-lister {
    --oak-lister-filter-width: 405px;
    width: 100%;
    padding: var(--oak-spacing-m) var(--oak-spacing-2xl);
    display: flex;
    flex-direction: column;
    gap: var(--oak-spacing-xl);
}

.oak-lister header {
    display: flex;
    flex-direction: column;
    gap: var(--oak-spacing-m);
}

.oak-lister-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: var(--oak-spacing-s);
}

.oak-lister-content {
    display: flex;
    gap: var(--oak-spacing-xl);
    position: relative;
}



.oak-checked-filters {
    display:none;
    align-self: flex-end;
}

.oak-lister-filter .oak-checked-filters {
    align-self:flex-start;
}

@media(max-width:1024px){
    .oak-checked-filters {
        display:block;
        float:right;
    }
    .oak-lister-filter .oak-text-strong-l {
        display:none;
    }
}

.oak-checked-filters > span {
	padding-left: 10px;
}

.oak-lister-filter {
    width: 100%;
    max-width: var(--oak-lister-filter-width);
    display: flex;
    flex-direction: column;
    gap: var(--oak-spacing-xl);
}

@media(max-width:1024px){
    .oak-lister-filter {
	    position: fixed;
	    top: 0px;
	    padding: var(--oak-spacing-xl);
	    background: white;
	    left: 100%;
	    width: 100%;
	    max-width: none;
        bottom:0px;
        transition:0.2s all;
        z-index: 3000;
    }
    .oak-lister-active .oak-lister-filter {
        left:0px;
        overflow: auto;
    }
}
@media(max-width:768px){
    .oak-lister-filter {
	    padding: var(--oak-spacing-m);
    }
}
@media(max-width:512px){
    .oak-lister-filter {
	    padding: var(--oak-spacing-s);
    }
}

.oak-lister-filter-btn {
    width: 100%;
    padding: var(--oak-spacing-xs);
    padding-left: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--oak-spacing-m);
    border: none;
    outline: none;
    background: none;
    border-bottom: 1px solid var(--oak-black);
    cursor: pointer;
    color: inherit;
}

.oak-lister-filter-btn .oak-icon-chevron-m {
    transform: rotate(90deg);
    stroke: var(--oak-black);
    transition: transform var(--oak-duration-m) var(--oak-ease);
}

.oak-lister-filter-section.oak-expanded .oak-icon-chevron-m {
    transform: rotate(270deg);
}

.oak-lister-filter-wrapper {
    display: grid;
    grid-template-rows: 0fr;
    transition: all var(--oak-duration-m) var(--oak-ease);
}

.oak-lister-filter-section.oak-expanded .oak-lister-filter-wrapper {
    grid-template-rows: 1fr;
    padding-top: var(--oak-spacing-s);
}

.oak-lister-filter-content {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: var(--oak-spacing-xs);
}

.oak-lister-filter-option {
    display: flex;
    align-items: flex-start;
    gap: var(--oak-spacing-s);
}

.oak-lister-filter-option input[type="checkbox"] {
    margin-top:7px;
}
.oak-lister-filter-option label small {
    display: block;
}
.oak-lister-items {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--oak-spacing-s);
}

.oak-lister-filter + .oak-lister-items {
    max-width: calc(100% - var(--oak-lister-filter-width) - var(--oak-spacing-xl));
}

.oak-lister-item {
    width: 100%;
    border-radius: var(--oak-radius-l);
    padding: var(--oak-spacing-xs) var(--oak-spacing-m);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--oak-spacing-xl);
    background-color: var(--oak-olive-800);
    color: var(--oak-white);
    text-decoration: none;
    outline: none;
}

.oak-lister-item-name {
    color: var(--oak-green-500);
}

.oak-lister-item .oak-icon-arrow-l {
    stroke: var(--oak-green-500);
}

.oak-lister-item-attributes {
    display: flex;
    flex-wrap: wrap;
    gap: 0 var(--oak-spacing-s);
}

@media (max-width: 1920px) {
    .oak-lister {
        padding: var(--oak-spacing-m) var(--oak-spacing-xl);
    }
}

@media (max-width: 1440px) {
    .oak-lister {
        padding: var(--oak-spacing-m);
    }

    .oak-lister-filter {
        max-width: calc((100% - var(--oak-spacing-xl)) / 3);
    }

    .oak-lister-filter + .oak-lister-items {
        max-width: calc((100% - var(--oak-spacing-xl)) / 3 * 2);
    }
}

@media (max-width: 1024px) {
    .oak-lister {
        padding: 0;
        gap: var(--oak-spacing-m);
    }

    .oak-lister-content {
        flex-direction: column;
        gap: var(--oak-spacing-m);
    }

    .oak-lister-filter,
    .oak-lister-items,
    .oak-lister-filter + .oak-lister-items {
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .oak-lister-filter {
        gap: var(--oak-spacing-m);
    }
}

@media (max-width: 512px) {
    .oak-lister-item {
        gap: var(--oak-spacing-m);
    }

    .oak-lister-item .oak-icon-arrow-l {
        display: none;
    }
}

.oak-lister-load-more {
    background-color: var(--oak-black) !important;
    color: var(--oak-white) !important;
    border-color: var(--oak-black) !important;
    display: none;
}

.oak-lister-load-more:hover {
    background-color: var(--oak-white) !important;
    color: var(--oak-black) !important;
    border-color: var(--oak-black) !important;
}

.oak-lister-load-more::after {
    background-image: var(--oak-btn-icon-white) !important;
}

.oak-lister-load-more:hover::after {
    background-image: var(--oak-btn-icon-black) !important;
}

.oak-lister-load-more:last-child {
    display: inline-block;
}

.oak-lister-notifier {
    position: fixed;
    top: 40px;
    left: 50%;
    transform: translatex(-50%);
    display: none;
}

.oak-scroll .oak-lister-notifier {
    top: calc(var(--oak-menu-height) + 10px);
}

.oak-lister-no-results {
    border-radius: var(--oak-radius-l);
    padding: var(--oak-spacing-xs) var(--oak-spacing-m);
    gap: var(--oak-spacing-xl);
    background-color: grey;
    color: var(--oak-white);
    text-decoration: none;
    outline: none;
}

.oak-clear-filters {
    display:none;
	margin-top: 5px;
	font-size: 0.8em;
}

@media(max-width:1024px){
    .oak-clear-filters {
	    margin-top: 20px;
    }
}

.oak-clear-filters.active {
	display: inline-block;
}