.inim-component.distributors .inim-component-wrapper { padding-top:0 }
.inim-component.distributors .distributors-wrapper { padding:0rem 0 2.5rem; }
.inim-component.distributors .distributors-heading { color:rgb(var(--black)); font-size:1.75rem; line-height: 1.5rem; text-align:left; text-transform: uppercase; margin-bottom:1rem; }
.inim-component.distributors .list { display:grid; width:100%; position: relative; gap:2rem; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); margin-top:1rem; }
.inim-component.distributors .list .posts-item { text-align: left; display:flex; flex-direction: row; align-items: flex-start; padding:0; gap:2rem; }
.inim-component.distributors .list .posts-image { width:6rem; height:4rem; background: none top center no-repeat; background-size: contain; background-color:rgb(var(--white)); margin-bottom:2rem; color:rgb(var(--black)); }
.inim-component.distributors .list .posts-item > div { flex:1 1 auto; }
.inim-component.distributors .list .posts-title { color:rgb(var(--black)); font-family:var(--font-headings); font-size:1.5rem; line-height:2rem; font-weight:600; text-align:left; width: 100%; margin-bottom:.5rem; }

.inim-component.distributors .list .branches-toggle { display:flex; align-items: center; gap:1rem; cursor: pointer; }
.inim-component.distributors .list .branches-toggle i { font-size:12px; border-radius: 9999px; padding:1px; border:2px solid black; font-weight:bold; }
.inim-component.distributors .list .branches { margin:5px 0; padding:0; }
.inim-component.distributors .list .branches .branch { margin:0 0 5px; padding:0; display: flex; flex-direction: column; gap:5px; }
.inim-component.distributors .list .branches .branch > a { display:flex; align-items: center; width:100%; }
.inim-component.distributors .list .branches .branch > a:before { content:""; margin-right:10px; font-family: "inim-icon"; font-size: 8px; content: "\e95c"; line-height: 1.5rem; display: inline-block;}
.inim-component.distributors .list .branches .branch > div { width:100%; display:grid; grid-template-rows:0fr; transition: grid-template-rows 0.5s ease-out; }
.inim-component.distributors .list .branches .branch > div.open-branch { grid-template-rows:1fr; }
.inim-component.distributors .list .branches .branch > div > div { overflow:hidden; }

.inim-component.distributors .list .posts-text { text-align:left; width: 100%; margin-bottom:1rem; }
.inim-component.distributors .list .posts-text a { color:rgb(var(--accent)); }
.inim-component.distributors .list .posts-distributors-icons { display:inline-flex; flex-direction: row; gap:.5rem; margin-bottom:1rem; }
.inim-component.distributors .list .posts-distributors-icons img { flex:0 1 1.5rem; width:2rem; }
.inim-component.distributors .list .inim-button { width: fit-content; }
.inim-component.distributors .distributor-filter { width:100%; margin: 2rem 0; display:flex; flex-wrap: wrap; gap: 1rem; }
.inim-component.distributors .distributor-filter > * { flex:1 0 100%; }
.inim-component.distributors .distributor-filter .distributor-filter-text { position:relative; flex:1 1 20rem; }
.inim-component.distributors .distributor-filter .distributor-filter-text input { display:block; border:1px solid rgb(var(--gray-2)); border-radius:100px; color:rgb(var(--black)); background-color: rgb(var(--gray-background)); width:100%; padding:1rem; }
.inim-component.distributors .distributor-filter .distributor-filter-text i { position:absolute; right:2rem; top:50%; margin-top:-0.5rem; z-index:999; }
.inim-component.distributors .distributor-filter .distributor-filter-text .autocomplete-suggestions { position: absolute; top: 100%; left: 0;
    right: 0;
    z-index: 999;
    background: #fff;
    border: 1px solid #ddd;
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 200px;
    overflow-y: auto;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}
.inim-component.distributors .distributor-filter .distributor-filter-text .autocomplete-suggestions li { padding: 10px; cursor: pointer; border-bottom: 1px solid #f0f0f0; }
.inim-component.distributors .distributor-filter .distributor-filter-text .autocomplete-suggestions li:hover { background: #f9f9f9; }


.inim-component.distributors .distributor-filter .distributor-filter-label { font-weight:bold; text-transform: uppercase; font-size: 0.875rem;}
.inim-component.distributors .distributor-filter .distributor-filter-select { display:flex; gap:1rem; margin-left:auto; flex-wrap: wrap; max-width: 100%; align-items: center; }
.inim-component.distributors .distributor-filter .distributor-filter-select > * { flex:1 0 auto; }
.inim-component.distributors .distributor-filter .filter-button { width:100%; border-radius:8px; }
.inim-component.distributors .distributor-filter .spinner { margin-left: 20px; position:initial; top: auto; left:auto; flex: 0 0 auto; }
.inim-component.distributors .list .dummy-posts-item, .inim-component.distributors .list .dummy-posts-inim { display:none }

@media (min-width: 768px) {
    .inim-component.distributors .distributor-filter .distributor-filter-text { flex:0 1 40rem; }
    .inim-component.distributors .distributor-filter .distributor-filter-select > * { flex:0 0 auto; }
    .inim-component.distributors .distributor-filter .filter-button { width:auto; height:100%; }
    .inim-component.distributors .list { grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); }
    .inim-component.distributors .list .posts-image { flex: 0 0 auto; width:12rem; height:7rem; }
    .inim-component.distributors .list { column-gap: 5rem; }
}

@media (min-width: 992px) {
    .inim-component.distributors .list { column-gap: 5rem; }
}