/* ROUND 101 — Mobile Filters button (inc/round101.php). Loads after r80-filters.css on the three filter pages. */
@media (max-width:1023px){
  /* the /plans/ view-toggle look (btn--white + the round 63 inactive-view tint), hover = the .btn--white
     hover (cream sweep, lift shadow, -2px lift) that round 80 had switched off */
  .sh-r101.sh-r80 .sh-r80-open{background:var(--off-white);opacity:.85;border-color:transparent;color:var(--charcoal);box-shadow:0 1px 2px rgba(0,0,0,.15)}
  .sh-r101.sh-r80 .sh-r80-open:hover,.sh-r101.sh-r80 .sh-r80-open:focus-visible{background:var(--off-white);opacity:1;color:var(--charcoal);border-color:transparent;box-shadow:var(--lift-shadow)}
  .sh-r101.sh-r80 .sh-r80-open:active{box-shadow:var(--lift-shadow-active)}
  .sh-r101.sh-r80 .sh-r80-open::before{display:block}
  .sh-r101.sh-r80 .sh-r80-open[aria-expanded="true"]{background:var(--white);opacity:1;box-shadow:0 1px 4px rgba(0,0,0,.12)}
  /* icon: 16px line glyph, same gap to the label as the /plans/ buttons (.btn gap) */
  .sh-r101 .sh-r80-open__icon{display:inline-flex;width:16px;height:16px;flex:0 0 16px}
  .sh-r101 .sh-r80-open__icon svg{width:16px;height:16px;display:block}
  .sh-r101 .sh-r80-open__count{margin-left:2px}
  /* the server-rendered gallery "Filters" button used to show until r80-filters.js swapped it for the
     bar (a flash of the old outline button on slow loads); hide it from first paint on the bands that get the bar */
  .sh-r101.sh-r80 .gal__filters-toggle{display:none!important}
}
/* centred on phones (button, chips and the "Featured Sentinel Builds" switch); tablet keeps the bar's left alignment */
@media (max-width:767px){
  .sh-r101 .sh-r80-bar{align-items:center}
  .sh-r101 .sh-r80-open{align-self:center}
  .sh-r101 .sh-r80-chips__list{justify-content:center}
  .sh-r101.sh-r80 .gal__toggle{justify-content:center}
}