/* =========================================================
   STS v5.6.153 - FINAL search pill force fix
   Loaded LAST so older header/search CSS cannot override it.
   ========================================================= */

html body.streamx-v5.twitch-v53 header.tw-topbar.sts-glass-nav form.tw-search.sts-nav-search.sts-mock-search,
html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav .tw-search.sts-nav-search.sts-mock-search,
html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav .tw-search.sts-nav-search,
html body.streamx-v5.twitch-v53 form#stsSearchForm.sts-nav-search{
  box-sizing: border-box !important;
  width: 240px !important;
  min-width: 240px !important;
  max-width: 240px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  flex: 0 0 240px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 40px !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 10px 0 auto !important;
  border: 1px solid rgba(82,255,28,.95) !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(6, 11, 20, .96) !important;
  box-shadow: 0 0 16px rgba(57,255,20,.10), inset 0 0 0 1px rgba(255,255,255,.03) !important;
  position: relative !important;
  z-index: 5000 !important;
}

html body.streamx-v5.twitch-v53 header.tw-topbar.sts-glass-nav form.tw-search.sts-nav-search.sts-mock-search input,
html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav .tw-search.sts-nav-search input,
html body.streamx-v5.twitch-v53 form#stsSearchForm.sts-nav-search input,
html body.streamx-v5.twitch-v53 #stsSearchInput{
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  line-height: 34px !important;
  padding: 0 14px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px 0 0 999px !important;
  outline: none !important;
  background: transparent !important;
  color: #f6fff4 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .02em !important;
  box-shadow: none !important;
}

html body.streamx-v5.twitch-v53 #stsSearchInput::placeholder{
  color: rgba(238,255,238,.64) !important;
  opacity: 1 !important;
}

html body.streamx-v5.twitch-v53 header.tw-topbar.sts-glass-nav form.tw-search.sts-nav-search.sts-mock-search button,
html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav .tw-search.sts-nav-search button,
html body.streamx-v5.twitch-v53 form#stsSearchForm.sts-nav-search button{
  box-sizing: border-box !important;
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-left: 1px solid rgba(82,255,28,.55) !important;
  border-radius: 0 999px 999px 0 !important;
  background: rgba(8, 15, 26, .98) !important;
  color: #ffffff !important;
  display: grid !important;
  place-items: center !important;
  font-size: 13px !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

html body.streamx-v5.twitch-v53 .tw-topbar.sts-glass-nav .sts-search-results,
html body.streamx-v5.twitch-v53 #stsSearchResults{
  top: calc(100% + 10px) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  border-radius: 18px !important;
  z-index: 999999 !important;
}

@media (max-width: 1500px){
  html body.streamx-v5.twitch-v53 header.tw-topbar.sts-glass-nav form.tw-search.sts-nav-search.sts-mock-search,
  html body.streamx-v5.twitch-v53 form#stsSearchForm.sts-nav-search{
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    flex-basis: 220px !important;
  }
}

@media (max-width: 1180px){
  html body.streamx-v5.twitch-v53 header.tw-topbar.sts-glass-nav form.tw-search.sts-nav-search.sts-mock-search,
  html body.streamx-v5.twitch-v53 form#stsSearchForm.sts-nav-search{
    display: none !important;
  }
}
