:root {
  --oj-sp-smart-filter-search-main-content-height: 50vh;
}

oj-sp-simple-filter-search {
  display: block;
  margin: 0 auto;
  min-height: 100vh;
}

oj-sp-smart-filter-search:not(.oj-complete) {
  visibility: hidden;
}

oj-sp-smart-filter-search .oj-sp-smart-filter-dashboard-wrapper {
  min-width: 332px;
  max-width: 332px;
  margin-left: auto;
  margin-right: auto;
}

oj-sp-smart-filter-search .oj-sp-smart-filter-main-content-wrapper,
#storypage .oj-sp-smart-filter-main-content-wrapper {
  width: calc(100% - 20.75rem);
}

@media screen and (max-width: 599px) {
  oj-sp-smart-filter-search .oj-sp-smart-filter-main-content-wrapper,
  #storypage .oj-sp-smart-filter-main-content-wrapper {
    width: 100%;
  }
}

@media screen and (min-width: 599px) {
  oj-sp-smart-filter-search .oj-sp-smart-filter-content-sticky {
    position: sticky;
    position: -webkit-sticky;
    top: var(--oj-sp-smart-filter-content-sticky-top, '0px');
  }
}

oj-sp-smart-filter-search .oj-sp-smart-filter-dashboard-inner-wrapper > * {
  margin: 1em;
}

oj-sp-smart-filter-search .oj-sp-smart-filter-switcher {
  border-radius: 25px;
  position: fixed;
  bottom: 0.5rem;
  left: 50%;
  transform: translateX(-50%) scale(0.75);
}

html[dir='rtl'] oj-sp-smart-filter-search .oj-sp-smart-filter-switcher {
  padding-right: 0.5rem;
}

html:not([dir='rtl']) oj-sp-smart-filter-search .oj-sp-smart-filter-switcher {
  padding-left: 0.5rem;
}