.filter-bar{margin-bottom:1rem;gap:1rem;& .filter-bar__hidden-content{padding:.5rem;display:none;visibility:hidden;transition:max-height .1s ease-in-out;background:linear-gradient(180deg,rgba(42,123,155,0) 0,var(--color-background-80) 100%);border-radius:var(--border-radius);&>[class*=flex]{flex-wrap:wrap;flex-direction:row;display:flex;gap:1rem;&>div{width:calc(50% - .5rem);flex:0 0 calc(50% - 0.5rem);min-width:0}}}@media (min-width:640px){& .filter-bar__hidden-content{padding:1rem}}&.filter-bar__open{& .filter-bar__hidden-content{display:block;visibility:visible}}& .filter-bar__toggle-button{width:180px}& .filter-bar__toggle-button{& svg{transition:transform .1s ease-in-out}&.filter-bar__toggle-button--open{& svg{transform:rotate(180deg)}}}}.reset-filters-button{white-space:nowrap}@media (min-width:640px){.filter-bar{.filter-bar__hidden-content{& [class*=flex]{&>div{max-width:300px}}}}}