/* v5.6.178 - Chat footer final layout + clean emote rail
   Fixes the missing/tiny input after the wave button is hidden and removes boxes around emotes. */

html body.streamx-v5.twitch-v53 aside.chat-panel #chatForm.chat-form.pro-chat-form,
html body.streamx-v5.twitch-v53 #chatForm.chat-form.pro-chat-form{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 108px!important;
  grid-template-rows:48px!important;
  align-items:center!important;
  gap:10px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  padding:10px 12px 12px!important;
  margin:0!important;
  background:#070b12!important;
  border-top:1px solid rgba(168,85,247,.35)!important;
  position:relative!important;
  overflow:hidden!important;
}

html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form #chatInput{
  display:block!important;
  grid-column:1!important;
  grid-row:1!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:48px!important;
  line-height:48px!important;
  flex:none!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:0 16px!important;
  border-radius:12px!important;
  border:1px solid rgba(255,255,255,.16)!important;
  background:#0d131b!important;
  color:#f8fbff!important;
  outline:none!important;
  opacity:1!important;
  visibility:visible!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  transform:none!important;
}

html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form #chatInput:focus{
  border-color:#39ff14!important;
  box-shadow:0 0 0 1px rgba(57,255,20,.75),0 0 18px rgba(57,255,20,.16)!important;
}

html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form > button[type="submit"],
html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form > button:not(#chatWaveBtn):last-child{
  display:flex!important;
  grid-column:2!important;
  grid-row:1!important;
  align-items:center!important;
  justify-content:center!important;
  width:108px!important;
  min-width:108px!important;
  max-width:108px!important;
  height:48px!important;
  flex:none!important;
  margin:0!important;
  border-radius:14px!important;
  border:0!important;
  background:linear-gradient(135deg,#a855f7,#c026d3)!important;
  color:#fff!important;
  font-weight:900!important;
  box-shadow:0 10px 26px rgba(168,85,247,.22)!important;
}

/* Wave button sits inside the input until used, then vanishes without keeping space. */
html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form .chat-wave-btn{
  display:flex!important;
  grid-column:1!important;
  grid-row:1!important;
  align-items:center!important;
  justify-content:center!important;
  z-index:2!important;
  justify-self:start!important;
  width:44px!important;
  min-width:44px!important;
  max-width:44px!important;
  height:44px!important;
  margin-left:2px!important;
  padding:0!important;
  border-radius:12px!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form:not(.wave-is-hidden):not(.wave-used) .chat-wave-btn:not([hidden]) + #chatInput{
  padding-left:54px!important;
}

html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form .chat-wave-btn[hidden],
html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form .chat-wave-btn.sent,
html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form .chat-wave-btn.cooldown-hidden,
html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form.wave-is-hidden .chat-wave-btn,
html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form.wave-used .chat-wave-btn{
  display:none!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  height:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  position:absolute!important;
  left:-9999px!important;
}

html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form.wave-is-hidden #chatInput,
html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form.wave-used #chatInput,
html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form:has(.chat-wave-btn[hidden]) #chatInput{
  padding-left:16px!important;
  grid-column:1!important;
  width:100%!important;
  max-width:100%!important;
}

/* Clean Twitch/Kick style emotes: no boxes, just the emote with a tiny hover lift. */
html body.streamx-v5.twitch-v53 .v53-emote-strip{
  display:flex!important;
  align-items:center!important;
  gap:13px!important;
  padding:9px 16px!important;
  min-height:44px!important;
  background:#060a10!important;
  border-top:1px solid rgba(168,85,247,.34)!important;
  border-bottom:1px solid rgba(168,85,247,.22)!important;
  overflow-x:auto!important;
  scrollbar-width:none!important;
}
html body.streamx-v5.twitch-v53 .v53-emote-strip::-webkit-scrollbar{display:none!important;}
html body.streamx-v5.twitch-v53 .v53-emote-strip .emote-pick{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  outline:none!important;
  cursor:pointer!important;
  flex:0 0 auto!important;
}
html body.streamx-v5.twitch-v53 .v53-emote-strip .emote-pick:hover{
  transform:translateY(-2px) scale(1.08)!important;
  background:transparent!important;
  box-shadow:none!important;
  filter:drop-shadow(0 0 8px rgba(168,85,247,.42))!important;
}
html body.streamx-v5.twitch-v53 .v53-emote-strip .emote-pick img{
  display:block!important;
  width:28px!important;
  height:28px!important;
  object-fit:contain!important;
}
html body.streamx-v5.twitch-v53 .v53-emote-strip .emote-pick span{display:none!important;}

@media (max-width:560px){
  html body.streamx-v5.twitch-v53 #chatForm.chat-form.pro-chat-form{
    grid-template-columns:minmax(0,1fr) 92px!important;
    gap:8px!important;
    padding:9px 10px 10px!important;
  }
  html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form > button[type="submit"],
  html body.streamx-v5.twitch-v53 #chatForm.pro-chat-form > button:not(#chatWaveBtn):last-child{
    width:92px!important;min-width:92px!important;max-width:92px!important;
  }
  html body.streamx-v5.twitch-v53 .v53-emote-strip{gap:11px!important;padding-inline:14px!important;}
}
