/* Basic styling for the chat */
.yt-chat-root{ font-family: 'Titillium Web', sans-serif; max-width:400px; width:100%; display:flex; flex-direction:column; background:#000; color:#fff; border-radius:8px; box-shadow: 0 6px 22px rgba(0,0,0,0.6); overflow:hidden; }
.yt-chat-messages{ flex:1; padding:10px; min-height:360px; max-height:360px; overflow-y:auto; }
.yt-chat-message{ padding:2px 4px; border-bottom:1px solid rgba(255,255,255,0.04); }
.yt-chat-message-header{ display:flex; justify-content:space-between; align-items:center; font-size:12px; color:rgba(255,255,255,0.75); }
.yt-chat-username{ font-weight:600; color:#fff; margin-right:8px; }
.yt-chat-message-body{ margin-top:6px; font-size:14px; color:#eaeaea; word-wrap:break-word; }
.yt-chat-input-area{ display:flex; gap:8px; padding:10px; align-items:end; background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.02)); }
.yt-chat-emojis{ display:flex; gap:4px; flex-flow:row; max-width:0px; margin-bottom: 60px; padding: 0px 0px 10px 0px;}
.yt-emoji-btn{ background:transparent; border:0; font-size:18px; cursor:pointer; }
.yt-chat-input{ flex:1; resize:none; padding:8px 10px; border-radius:6px; border:1px solid rgba(255,255,255,0.06); background:#0c0c0c; color:#fff; min-height:36px; max-height:120px; }
.yt-chat-send{ background:#6a3bdc; color:#fff; border:0; padding:10px 14px; border-radius:6px; cursor:pointer; font-weight:600; line-height: 2.40;}
.yt-chat-send[disabled], .yt-chat-input[disabled]{ opacity:0.5; cursor:not-allowed; }
.yt-chat-login-note{ padding:8px 12px; font-size:13px; }

/* Responsive */
@media (max-width:600px){
	.yt-chat-root{ max-width:100%; border-radius:0; }
	.yt-chat-emojis{ display:none; }
}