/* Browse filter controls: phone layout only.
   Search is full width. Version, Key and Sort stay together in one row. */

html body.browse-page .filter-form .filter-search-button{
  background:#ff8a00!important;
  color:#000!important;
  border:0!important;
  font-weight:700!important;
}

html body.browse-page .filter-form .filter-search-button:hover,
html body.browse-page .filter-form .filter-search-button:focus{
  background:#ff9f2b!important;
  color:#000!important;
}

@media (max-width:768px){
  html body.browse-page .filter-form{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    align-items:end!important;
    width:100%!important;
  }

  html body.browse-page .filter-form .filter-search-field{
    grid-column:1 / -1!important;
    min-width:0!important;
  }

  html body.browse-page .filter-form .filter-version-field,
  html body.browse-page .filter-form .filter-key-field,
  html body.browse-page .filter-form .filter-sort-field{
    grid-column:auto!important;
    min-width:0!important;
    width:100%!important;
    font-size:10px!important;
    line-height:1.1!important;
  }

  html body.browse-page .filter-form #global-search,
  html body.browse-page .filter-form #version-filter,
  html body.browse-page .filter-form #key-filter,
  html body.browse-page .filter-form #sort-select{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:34px!important;
    padding-left:7px!important;
    padding-right:7px!important;
    font-size:11px!important;
  }

  html body.browse-page .filter-form .filter-search-button{
    grid-column:1 / -1!important;
    width:100%!important;
    height:36px!important;
    min-height:36px!important;
    margin:0!important;
    background:#ff8a00!important;
    color:#000!important;
    font-size:12px!important;
    font-weight:700!important;
  }
}