/* JR_MOBILE_CHROME_v7 — sticky browse chrome (no fixed overlap); hide down / show up */
.toolbar-wrap,
header.top,
.top,
#siteHeader,
.jr-e18-bottomnav,
.jr-bottomnav,
.jrg-bn {
  transition: transform .22s ease, opacity .18s ease, max-height .22s ease, padding .22s ease, margin .22s ease, border-width .22s ease, visibility .18s ease;
}

/* Sticky breaks when an ancestor uses overflow:clip — unblock on browse pages */
html.jr-browse-page,
html.jr-browse-page body,
body.jr-has-results,
body.jr-browse-open,
body.jr-home.jr-has-results {
  overflow-x: clip;
  overflow-y: visible !important;
}

@media (max-width: 900px) {
  /*
   * v6 used position:fixed and overlapped the filter panel (content bled through).
   * v7: sticky keeps chrome in document flow — no mid-page hole / no underlap.
   * Hide/show still via body.jr-chrome-hidden (display:none) + JS.
   */
  body.jr-has-results header.top,
  body.jr-browse-open header.top,
  body.jr-has-results .top,
  body.jr-browse-open .top,
  body.jr-has-results #siteHeader,
  body.jr-browse-open #siteHeader {
    position: sticky !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    z-index: 80 !important;
    background: #030709 !important;
  }

  body.jr-has-results .toolbar-wrap,
  body.jr-browse-open .toolbar-wrap,
  body.jr-home.jr-has-results .toolbar-wrap,
  body.jr-home.jr-browse-open .toolbar-wrap,
  body.jr-has-results section.toolbar-wrap,
  body.jr-browse-open section.toolbar-wrap {
    position: sticky !important;
    top: var(--jr-header-visible-h, 56px) !important;
    left: auto !important;
    right: auto !important;
    width: auto !important;
    z-index: 70 !important;
    margin-top: 6px !important;
    transform: none !important;
    background: #050b10 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: 0 1px 0 #172630 !important;
  }

  /* Old fixed-mode spacer — never reserve a hole in the page */
  .jr-chrome-spacer,
  body.jr-has-results .jr-chrome-spacer,
  body.jr-browse-open .jr-chrome-spacer {
    display: none !important;
    height: 0 !important;
  }

  /* Compact header while browsing results */
  body.jr-has-results header.top,
  body.jr-browse-open header.top,
  body.jr-has-results .top,
  body.jr-browse-open .top {
    min-height: 0 !important;
    height: auto !important;
    padding-top: calc(4px + var(--safe-top, 0px)) !important;
    padding-bottom: 4px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    gap: 6px !important;
  }
  body.jr-has-results .top .brand img,
  body.jr-browse-open .top .brand img {
    width: 30px !important;
    height: 30px !important;
  }
  body.jr-has-results .top .search,
  body.jr-browse-open .top .search {
    height: 34px !important;
    border-radius: 10px !important;
    padding: 0 10px !important;
  }
  body.jr-has-results .top .post,
  body.jr-browse-open .top .post {
    width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
  }

  /* Compact both toolbar rows + kill the light gap between them */
  .toolbar-wrap,
  section.toolbar-wrap {
    margin-top: 6px !important;
    background: #050b10 !important;
    backdrop-filter: none !important;
    border-top: 1px solid #172630 !important;
    border-bottom: 1px solid #172630 !important;
    padding: 0 !important;
  }
  .toolbar-wrap .toolbar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: 4px 8px !important;
    background: #050b10 !important;
  }
  .toolbar-wrap .tool-left,
  .toolbar-wrap .tool-right {
    gap: 6px !important;
    padding: 2px 0 !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
    background: #050b10 !important;
  }
  .toolbar-wrap .tool-right {
    border-top: 1px solid rgba(23, 38, 48, .95);
    padding-top: 4px !important;
    margin-top: 0 !important;
  }
  .toolbar-wrap .tbtn,
  .toolbar-wrap .small-action {
    min-height: 31px !important;
    height: 31px !important;
    padding: 0 10px !important;
    font-size: 12.5px !important;
    border-radius: 8px !important;
  }
  .toolbar-wrap .group {
    border-radius: 8px !important;
  }
  .toolbar-wrap .tbtn .icon,
  .toolbar-wrap .small-action .icon,
  .toolbar-wrap .tbtn [data-icon] svg,
  .toolbar-wrap .small-action [data-icon] svg,
  .toolbar-wrap .tbtn svg,
  .toolbar-wrap .small-action svg {
    width: 15px !important;
    height: 15px !important;
  }
  .toolbar-wrap .jr-sort-wrap {
    min-height: 31px !important;
    height: 31px !important;
    padding: 0 8px !important;
    font-size: 12px !important;
  }
  .toolbar-wrap .jr-sort {
    font-size: 12px !important;
    height: 28px !important;
  }
  .toolbar-wrap a.small-action[href*="saved-searches"] {
    display: none !important;
  }
}

/* --- Hide on scroll: display:none on mobile; transform on desktop --- */
body.jr-chrome-hidden,
body.jr-header-hidden,
body.jr-toolbar-hidden {
  --jr-header-visible-h: 0px !important;
  --jr-chrome-spacer-h: 0px !important;
}

@media (max-width: 900px) {
  body.jr-chrome-hidden header.top,
  body.jr-chrome-hidden .top,
  body.jr-chrome-hidden #siteHeader,
  body.jr-header-hidden header.top,
  body.jr-header-hidden .top,
  body.jr-header-hidden #siteHeader,
  header.top.jr-chrome-off,
  .top.jr-chrome-off,
  #siteHeader.jr-chrome-off,
  body.jr-chrome-hidden .toolbar-wrap,
  body.jr-chrome-hidden section.toolbar-wrap,
  body.jr-header-hidden .toolbar-wrap,
  body.jr-toolbar-hidden .toolbar-wrap,
  body.jr-toolbar-hidden section.toolbar-wrap,
  body.jr-home.jr-chrome-hidden .toolbar-wrap,
  .toolbar-wrap.jr-chrome-off,
  section.toolbar-wrap.jr-chrome-off {
    display: none !important;
  }

  body.jr-chrome-hidden .jr-e18-bottomnav,
  body.jr-chrome-hidden .jr-bottomnav,
  body.jr-chrome-hidden .jrg-bn,
  body.jr-bottomnav-hidden .jr-e18-bottomnav,
  body.jr-bottomnav-hidden .jr-bottomnav,
  body.jr-bottomnav-hidden nav.jr-e18-bottomnav,
  body.jr-bottomnav-hidden .jrg-bn {
    display: none !important;
  }
}

@media (min-width: 901px) {
  body.jr-chrome-hidden header.top,
  body.jr-chrome-hidden .top,
  body.jr-chrome-hidden #siteHeader,
  body.jr-header-hidden header.top,
  body.jr-header-hidden .top,
  body.jr-header-hidden #siteHeader,
  header.top.jr-chrome-off,
  .top.jr-chrome-off,
  #siteHeader.jr-chrome-off {
    transform: translate3d(0, -110%, 0) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.jr-chrome-hidden .toolbar-wrap,
  body.jr-chrome-hidden section.toolbar-wrap,
  body.jr-header-hidden .toolbar-wrap,
  body.jr-toolbar-hidden .toolbar-wrap,
  body.jr-toolbar-hidden section.toolbar-wrap,
  .toolbar-wrap.jr-chrome-off,
  section.toolbar-wrap.jr-chrome-off {
    transform: translate3d(0, -120%, 0) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.jr-chrome-hidden .jr-e18-bottomnav,
  body.jr-chrome-hidden .jr-bottomnav,
  body.jr-chrome-hidden .jrg-bn,
  body.jr-bottomnav-hidden .jr-e18-bottomnav,
  body.jr-bottomnav-hidden .jr-bottomnav,
  body.jr-bottomnav-hidden nav.jr-e18-bottomnav,
  body.jr-bottomnav-hidden .jrg-bn {
    transform: translate3d(0, 120%, 0) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .toolbar-wrap,
  header.top,
  .top,
  #siteHeader,
  .jr-e18-bottomnav,
  .jr-bottomnav,
  .jrg-bn {
    transition: none !important;
  }
}


/* JR_SHOW_CTA_GUARD_v7 — after Show results, filter CTA must not cover ads */
@media (max-width: 900px) {
  body.jr-has-results .panel .cta-row .primary,
  body.jr-browse-open .panel .cta-row .primary {
    display: none !important;
  }
}