*{box-sizing:border-box;margin:0;padding:0}html{-webkit-touch-callout:none}body,html{-webkit-user-select:none;-moz-user-select:none;user-select:none}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:#f0f2f5}@media print{body{display:none!important}}[dir=rtl]{text-align:right}[dir=rtl] .chat-layout{flex-direction:row-reverse}[dir=rtl] .message.sent{justify-content:flex-start}[dir=rtl] .message:not(.sent){justify-content:flex-end}@media (max-width:768px){.chat-layout{flex-direction:column}.sidebar{width:100%;height:auto;max-height:40vh;border-right:none;border-bottom:1px solid #e0e0e0}.sidebar.mobile-hidden{display:none}.chat-main{height:60vh}.chat-main.mobile-full{height:100vh}.group-list{max-height:30vh}.message-bubble{max-width:80%}.messages-container{padding:10px}.login-box{padding:30px 20px;margin:20px}.admin-container{padding:10px}.admin-section{padding:20px 15px}.modal-content{width:95%;padding:20px}.chat-header h2,.sidebar-header h2{font-size:16px}.message-input-form{gap:5px}.message-input-form input{font-size:14px;padding:10px}.message-input-form button{padding:10px 16px;font-size:14px}.profile-header{padding:5px}.btn{padding:10px;font-size:14px}[dir=rtl] .chat-layout{flex-direction:column}}.container{max-width:1200px;margin:0 auto;padding:20px}.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2)}.login-box{background:#fff;padding:40px;border-radius:10px;box-shadow:0 10px 40px rgba(0,0,0,.2);width:100%;max-width:400px;position:relative}.login-box h1{margin-bottom:30px;color:#333;text-align:center}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:5px;color:#555;font-weight:500}.form-group input{border:1px solid #ddd;border-radius:5px;font-size:14px}.btn,.form-group input{width:100%;padding:12px}.btn{background:#25d366;color:#fff;border:none;border-radius:5px;font-size:16px;font-weight:600;cursor:pointer;transition:background .3s}.btn:hover{background:#20ba5a}.btn-secondary{background:#667eea}.btn-secondary:hover{background:#5568d3}.error{color:#e74c3c;margin-top:10px;text-align:center}.chat-layout{display:flex;height:100vh;background:#f0f2f5}.sidebar{width:350px;background:#fff;border-right:1px solid #e0e0e0;display:flex;flex-direction:column}.sidebar-header{padding:20px;background:#ededed;border-bottom:1px solid #d1d1d1}.sidebar-header h2{font-size:18px;color:#333}.group-list{flex:1 1;overflow-y:auto}.group-item{padding:15px 20px;border-bottom:1px solid #f0f0f0;cursor:pointer;transition:background .2s}.group-item:hover{background:#f5f5f5}.group-item.active{background:#ebebeb}.group-item h3{font-size:16px;color:#000;margin-bottom:5px}.chat-main{flex:1 1;display:flex;flex-direction:column;background:#e5ddd5}.chat-header{padding:15px 20px;background:#ededed;border-bottom:1px solid #d1d1d1}.chat-header h2{font-size:18px;color:#000}.messages-container{flex:1 1;overflow-y:auto;padding:20px}.message{margin-bottom:10px;display:flex}.message.sent{justify-content:flex-end}.message-bubble{max-width:60%;padding:8px 12px;border-radius:8px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.1)}.message.sent .message-bubble{background:#dcf8c6}.message-sender{font-size:12px;font-weight:600;color:#667eea;margin-bottom:3px}.message-text{font-size:14px;color:#303030;word-wrap:break-word}.message-time{font-size:11px;color:#667;margin-top:3px;text-align:right}.message-input-container{padding:10px 20px;background:#f0f0f0;border-top:1px solid #d1d1d1}.message-input-form{display:flex;gap:10px}.message-input-form input{flex:1 1;padding:12px;border:1px solid #ccc;border-radius:25px;font-size:14px}.message-input-form button{padding:12px 24px;background:#25d366;color:#fff;border:none;border-radius:25px;cursor:pointer;font-weight:600}.message-input-form button:hover{background:#20ba5a}.admin-container{max-width:800px;margin:40px auto;padding:20px}.admin-header{background:#fff;padding:30px;border-radius:10px;margin-bottom:30px;box-shadow:0 2px 10px rgba(0,0,0,.1)}.admin-header h1{color:#333;margin-bottom:10px}.admin-section{background:#fff;padding:30px;border-radius:10px;margin-bottom:20px;box-shadow:0 2px 10px rgba(0,0,0,.1)}.admin-section h2{color:#333;margin-bottom:20px;font-size:20px}.logout-btn{background:#e74c3c;width:auto;padding:10px 20px;margin-top:10px}.logout-btn:hover{background:#c0392b}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;padding:30px;border-radius:10px;max-width:500px;width:90%;box-shadow:0 10px 40px rgba(0,0,0,.3)}.modal-content h2{margin-bottom:20px;color:#333}.profile-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;background:#ddd;display:flex;align-items:center;justify-content:center;font-weight:600;color:#666}.profile-header{display:flex;align-items:center;gap:10px;cursor:pointer;padding:10px;border-radius:5px;transition:background .2s}.profile-header:hover{background:rgba(0,0,0,.05)}