:root{--bg-primary:#f0f4f8;--bg-secondary:#fff;--text-primary:#2d3748;--text-secondary:#4a5568;--accent-color:#3182ce;--accent-hover:#2c5282;--border-color:#e2e8f0;--shadow:#0000001a}*{box-sizing:border-box;margin:0;padding:0}body{background-color:#f0f4f8;background-color:var(--bg-primary);color:#2d3748;color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}.mobile-header,.mobile-sidebar-close,.mobile-sidebar-toggle{display:none}@media screen and (max-width:1024px){.chat-container{flex-direction:column}.users-sidebar{border-bottom:1px solid #e2e8f0;border-bottom:1px solid var(--border-color);border-right:none;max-height:300px;width:100%}.chat-area{flex-grow:1;height:calc(100vh - 300px)}}@media screen and (max-width:768px){.mobile-header{align-items:center;background-color:#fff;background-color:var(--bg-secondary);box-shadow:0 2px 4px #0000001a;display:flex;justify-content:space-between;padding:15px;position:sticky;top:0;z-index:100}.mobile-header h2{color:#3182ce;color:var(--accent-color);font-size:1.2rem}.mobile-sidebar-close,.mobile-sidebar-toggle{background:none;border:none;color:#3182ce;color:var(--accent-color);cursor:pointer;display:block}.users-sidebar{background-color:#fff;background-color:var(--bg-secondary);height:100vh;left:-100%;overflow-y:auto;position:fixed;top:0;transition:left .3s ease;width:100%;z-index:200}.users-sidebar.mobile-sidebar-open{left:0}.mobile-sidebar-close{position:absolute;right:15px;top:15px}.login-box{margin:0 auto;max-width:95%;padding:20px}.social-links{flex-direction:row;gap:15px}.login-content button,.login-content input{font-size:16px}.messages{max-width:100%;padding:10px}.message{max-width:90%}.message-form{flex-direction:column;gap:10px;padding:10px}.message-form input{margin-right:0;width:100%}.message-form button{width:100%}}.login-container{align-items:center;background:linear-gradient(135deg,#e6f2ff,#d1e7ff);display:flex;height:100vh;justify-content:center;padding:20px}.login-box{background-color:#fff;background-color:var(--bg-secondary);border-radius:20px;box-shadow:0 20px 40px #0000001a;max-width:450px;padding:40px;text-align:center;transition:all .3s ease;width:100%}.login-header h1{color:#3182ce;color:var(--accent-color);font-size:2.5rem;margin-bottom:10px}.login-header p{color:#4a5568;color:var(--text-secondary);margin-bottom:30px}.login-content input{border:2px solid #e2e8f0;border:2px solid var(--border-color);border-radius:12px;font-size:16px;margin:15px 0;padding:15px;transition:all .3s ease;width:100%}.login-content input:focus{border-color:#3182ce;border-color:var(--accent-color);box-shadow:0 0 0 3px #3182ce1a;outline:none}.login-content button{align-items:center;background-color:#3182ce;background-color:var(--accent-color);border:none;border-radius:12px;color:#fff;cursor:pointer;display:flex;font-size:18px;font-weight:600;justify-content:center;padding:15px;transition:all .3s ease;width:100%}.login-content button:hover{background-color:#2c5282;background-color:var(--accent-hover);box-shadow:0 10px 20px #0000001a;transform:translateY(-3px)}.social-footer{border-top:1px solid #e2e8f0;border-top:1px solid var(--border-color);margin-top:30px;padding-top:20px}.social-links{display:flex;gap:25px;justify-content:center;margin-bottom:20px}.social-link{align-items:center;color:#4a5568;color:var(--text-secondary);display:flex;flex-direction:column;gap:8px;text-decoration:none;transition:all .3s ease}.social-link svg{color:#3182ce;color:var(--accent-color);height:30px;transition:transform .3s ease;width:30px}.social-link:hover,.social-link:hover svg{color:#2c5282;color:var(--accent-hover)}.social-link:hover svg{transform:scale(1.1)}.social-link span{font-size:.9rem;font-weight:500}.footer-tagline{color:#4a5568;color:var(--text-secondary);text-align:center}.footer-tagline p{font-size:.9rem;margin:10px 0}.login-content button .button-icon{margin-left:10px;transition:transform .3s ease}.login-content button:hover .button-icon{transform:translateX(5px)}.chat-container{background-color:#fff;background-color:var(--bg-secondary);box-shadow:0 0 30px #0000000d;display:flex;height:100vh;margin:0 auto;max-width:1600px}.users-sidebar{background-color:#f7fafc;border-right:1px solid #e2e8f0;border-right:1px solid var(--border-color);display:flex;flex-direction:column;overflow-y:auto;padding:20px;width:300px}.logged-in-user{background-color:#edf2f7;border-radius:10px;color:#3182ce;color:var(--accent-color);font-weight:600;margin-bottom:15px;padding:10px;text-align:center}.leave-room-btn{background-color:#3182ce;background-color:var(--accent-color);border:none;border-radius:12px;color:#fff;cursor:pointer;font-weight:600;margin-top:auto;padding:12px;transition:all .3s ease}.leave-room-btn:hover{background-color:#2c5282;background-color:var(--accent-hover);transform:translateY(-2px)}.users-header{align-items:center;border-bottom:2px solid #3182ce;border-bottom:2px solid var(--accent-color);display:flex;justify-content:space-between;margin-bottom:20px;padding-bottom:10px}.users-header h2{color:#3182ce;color:var(--accent-color);font-size:1.5rem}.user-count{background-color:#3182ce;background-color:var(--accent-color);border-radius:20px;color:#fff;font-size:.9rem;padding:5px 10px}.users-list{display:flex;flex-direction:column;gap:10px}.user-item{align-items:center;background-color:#edf2f7;border-radius:10px;display:flex;gap:10px;padding:12px;transition:all .3s ease}.user-item:hover{background-color:#e2e8f0;transform:translateX(5px)}.user-icon{font-size:1.2rem}.chat-area{display:flex;flex-direction:column;flex-grow:1}.chat-header{background-color:#f7fafc;border-bottom:1px solid #e2e8f0;border-bottom:1px solid var(--border-color);padding:20px}.chat-header h2{color:#3182ce;color:var(--accent-color);font-size:1.8rem}.chat-header p{color:#4a5568;color:var(--text-secondary);margin-top:5px}.messages{display:flex;flex-direction:column;flex-grow:1;gap:15px;overflow-y:auto;padding:20px}.message{background-color:#edf2f7;border-radius:12px;max-width:70%;padding:15px;position:relative}.message .username{color:#3182ce;color:var(--accent-color);display:block;font-weight:600;margin-bottom:5px}.message .message-text{color:#2d3748;color:var(--text-primary)}.message .timestamp{color:#4a5568;color:var(--text-secondary);display:block;font-size:.8rem;margin-top:10px;text-align:right}.message.self{align-self:flex-end;background-color:#3182ce;background-color:var(--accent-color);color:#fff;margin-left:auto}.message.system{align-self:center;background-color:#e6f2ff;color:#4a5568;color:var(--text-secondary);font-style:italic;text-align:center}.message-form{background-color:#f7fafc;border-top:1px solid #e2e8f0;border-top:1px solid var(--border-color);display:flex;padding:20px}.message-form input{border:2px solid #e2e8f0;border:2px solid var(--border-color);border-radius:12px;flex-grow:1;font-size:16px;margin-right:15px;padding:15px;transition:all .3s ease}.message-form input:focus{border-color:#3182ce;border-color:var(--accent-color);outline:none}.message-form button{background-color:#3182ce;background-color:var(--accent-color);border:none;border-radius:12px;color:#fff;cursor:pointer;font-weight:600;padding:15px 25px;transition:all .3s ease}.message-form button:hover{background-color:#2c5282;background-color:var(--accent-hover)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f5f9}::-webkit-scrollbar-thumb{background:#3182ce;background:var(--accent-color);border-radius:4px}
/*# sourceMappingURL=main.cd0c488f.css.map*/