/* wire-universal-live-video-search-303f1h9171 */

.wire-video-live-search-303f1h9171{
  position:fixed;
  z-index:2147482500;
  display:grid;
  max-height:min(72vh,650px);
  overflow:auto;
  border:1px solid #31546a;
  border-radius:14px;
  background:
    linear-gradient(
      180deg,
      rgba(13,31,45,.985),
      rgba(5,17,27,.995)
    );
  box-shadow:
    0 22px 60px rgba(0,0,0,.52),
    0 0 0 1px rgba(255,255,255,.025) inset;
  color:#fff;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}

.wire-video-live-search-303f1h9171[hidden]{
  display:none!important;
}

.wire-video-live-search-head-303f1h9171{
  position:sticky;
  top:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px 8px;
  border-bottom:1px solid rgba(63,95,116,.55);
  background:rgba(7,24,36,.96);
  backdrop-filter:blur(12px);
}

.wire-video-live-search-head-303f1h9171>span,
.wire-video-live-search-group-title-303f1h9171>span{
  color:#ff3659;
  font-size:9px;
  font-weight:950;
  letter-spacing:.09em;
}

.wire-video-live-search-head-303f1h9171>small{
  min-width:0;
  overflow:hidden;
  color:#7794a6;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.wire-video-live-search-group-title-303f1h9171{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:9px 12px 5px;
}

.wire-video-live-search-group-title-303f1h9171.is-creators{
  margin-top:2px;
  border-top:1px solid rgba(63,95,116,.4);
}

.wire-video-live-search-group-title-303f1h9171>small{
  color:#68879a;
  font-size:8px;
}

.wire-video-live-search-video-303f1h9171{
  display:grid;
  grid-template-columns:112px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  min-width:0;
  padding:8px 10px;
  color:#fff;
  text-decoration:none;
  outline:0;
  transition:
    background .12s ease,
    transform .12s ease;
}

.wire-video-live-search-video-303f1h9171:hover,
.wire-video-live-search-video-303f1h9171.is-active{
  background:#102c40;
}

.wire-video-live-search-thumb-303f1h9171{
  position:relative;
  display:grid;
  place-items:center;
  width:112px;
  aspect-ratio:16/9;
  overflow:hidden;
  border:1px solid rgba(65,96,117,.65);
  border-radius:8px;
  background:#02080d;
}

.wire-video-live-search-thumb-303f1h9171>img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.wire-video-live-search-thumb-303f1h9171>i{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border:1px solid #718798;
  border-radius:50%;
  color:#fff;
  font-style:normal;
  font-size:11px;
}

.wire-video-live-search-thumb-303f1h9171>small{
  position:absolute;
  right:4px;
  bottom:4px;
  padding:2px 4px;
  border-radius:4px;
  background:rgba(0,0,0,.84);
  color:#fff;
  font-size:8px;
  font-weight:850;
}

.wire-video-live-search-copy-303f1h9171{
  display:grid;
  gap:5px;
  min-width:0;
}

.wire-video-live-search-copy-303f1h9171>strong{
  display:-webkit-box;
  overflow:hidden;
  font-size:11px;
  line-height:1.28;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}

.wire-video-live-search-copy-303f1h9171>span{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
  color:#809cac;
}

.wire-video-live-search-copy-303f1h9171>span>b{
  min-width:0;
  overflow:hidden;
  font-size:9px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.wire-video-live-search-copy-303f1h9171>span>small{
  flex:0 0 auto;
  font-size:8px;
}

.wire-video-live-search-play-303f1h9171{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border:1px solid #315870;
  border-radius:50%;
  background:#091d2b;
  color:#fff;
  font-size:9px;
}

.wire-video-live-search-video-303f1h9171:hover
.wire-video-live-search-play-303f1h9171,
.wire-video-live-search-video-303f1h9171.is-active
.wire-video-live-search-play-303f1h9171{
  border-color:#ff3157;
  background:#c82343;
}

.wire-video-live-search-channel-303f1h9171{
  display:grid;
  grid-template-columns:36px minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  padding:7px 11px;
  color:#fff;
  text-decoration:none;
  outline:0;
}

.wire-video-live-search-channel-303f1h9171:hover,
.wire-video-live-search-channel-303f1h9171.is-active{
  background:#102c40;
}

.wire-video-live-search-channel-avatar-303f1h9171{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border:1px solid #315a72;
  border-radius:50%;
  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(255,49,87,.22),
      transparent 60%
    ),
    #0b2332;
  color:#fff;
  font-size:12px;
  font-weight:950;
}

.wire-video-live-search-channel-303f1h9171>span:nth-child(2){
  display:grid;
  gap:1px;
  min-width:0;
}

.wire-video-live-search-channel-303f1h9171 strong{
  overflow:hidden;
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.wire-video-live-search-channel-303f1h9171 small{
  color:#7894a6;
  font-size:8px;
}

.wire-video-live-search-channel-303f1h9171>span:last-child{
  color:#7692a4;
  font-size:12px;
}

.wire-video-live-search-all-303f1h9171{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
  min-height:42px;
  padding:0 12px;
  border-top:1px solid rgba(63,95,116,.55);
  background:#081b29;
  color:#cfe1ea;
  text-decoration:none;
  outline:0;
}

.wire-video-live-search-all-303f1h9171:hover,
.wire-video-live-search-all-303f1h9171.is-active{
  background:#102c40;
  color:#fff;
}

.wire-video-live-search-all-303f1h9171>b{
  overflow:hidden;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.wire-video-live-search-status-303f1h9171,
.wire-video-live-search-empty-303f1h9171{
  display:grid;
  gap:5px;
  padding:15px 13px;
  color:#91a9b7;
  font-size:10px;
}

.wire-video-live-search-status-303f1h9171{
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
}

.wire-video-live-search-status-303f1h9171 b{
  color:#dbe7ee;
}

.wire-video-live-search-empty-303f1h9171>strong{
  color:#fff;
  font-size:12px;
}

.wire-video-live-search-spinner-303f1h9171{
  width:17px;
  height:17px;
  border:2px solid #29475a;
  border-top-color:#ff3157;
  border-radius:50%;
  animation:
    wire-video-live-search-spin-303f1h9171
    .7s linear infinite;
}

@keyframes wire-video-live-search-spin-303f1h9171{
  to{
    transform:rotate(360deg)
  }
}

@media(max-width:760px){
  .wire-video-live-search-303f1h9171{
    max-height:68vh;
  }

  .wire-video-live-search-video-303f1h9171{
    grid-template-columns:92px minmax(0,1fr);
    gap:8px;
  }

  .wire-video-live-search-thumb-303f1h9171{
    width:92px;
  }

  .wire-video-live-search-play-303f1h9171{
    display:none;
  }
}