.wa-app{display:flex;width:100%;height:100%;background:#111b21;color:#e9edef;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;overflow:hidden;position:relative}.wa-sidebar{width:35%;min-width:260px;max-width:420px;border-right:1px solid #222d34;display:flex;flex-direction:column;background:#111b21;flex-shrink:0}.wa-sidebar-header{display:flex;align-items:center;gap:12px;padding:10px 16px;height:60px;background:#202c33;border-bottom:1px solid #222d34}.wa-sidebar-title{flex:1;font-weight:600;font-size:16px}.wa-avatar-icon{width:38px;height:38px;border-radius:50%;background:#2a3942;display:flex;align-items:center;justify-content:center}.wa-header-actions{display:flex;gap:16px;color:#aebac1}.wa-header-actions button{background:none;border:none;cursor:pointer;color:#aebac1;padding:4px;display:flex;align-items:center;border-radius:50%;transition:background .15s}.wa-header-actions button:hover{background:#2a3942;color:#e9edef}.wa-new-chat{padding:10px 12px;background:#182229;border-bottom:1px solid #222d34;display:flex;flex-direction:column;gap:6px}.wa-new-chat input{background:#2a3942;border:none;border-radius:8px;padding:8px 12px;color:#e9edef;font-size:14px;outline:none;width:100%;box-sizing:border-box}.wa-new-chat input::placeholder{color:#8696a0}.wa-new-chat-btn{background:#00a884;border:none;border-radius:8px;padding:8px;color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:background .2s}.wa-new-chat-btn:hover{background:#017d64}.wa-contact-list{flex:1;overflow-y:auto}.wa-contact-item{display:flex;align-items:center;gap:12px;padding:10px 16px;cursor:pointer;border-bottom:1px solid #1d2b32;transition:background .15s}.wa-contact-item:hover{background:#182229}.wa-contact-item--active{background:#2a3942}.wa-contact-avatar{width:46px;height:46px;border-radius:50%;background:#2a3942;display:flex;align-items:center;justify-content:center;flex-shrink:0}.wa-contact-info{flex:1;min-width:0}.wa-contact-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:3px}.wa-contact-name{font-size:15px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}.wa-contact-time{font-size:12px;color:#8696a0;flex-shrink:0}.wa-contact-bottom{display:flex;align-items:center;justify-content:space-between;gap:6px}.wa-contact-last{font-size:13px;color:#8696a0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}.wa-unread-badge{background:#00a884;color:#fff;font-size:11px;font-weight:700;min-width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 5px;flex-shrink:0}.wa-edit-name-btn{background:none;border:none;cursor:pointer;color:#8696a0;padding:2px 4px;margin-left:4px;display:inline-flex;align-items:center;border-radius:4px;transition:color .15s;vertical-align:middle}.wa-edit-name-btn:hover{color:#00a884}.wa-name-edit{display:flex;align-items:center;gap:4px;flex:1;min-width:0}.wa-name-input{flex:1;background:#2a3942;border:1px solid #00a884;border-radius:6px;padding:3px 8px;color:#e9edef;font-size:13px;outline:none;min-width:0}.wa-name-action{background:none;border:none;cursor:pointer;padding:3px;border-radius:4px;display:flex;align-items:center;flex-shrink:0}.wa-name-save{color:#00a884}.wa-name-save:hover{background:#00a88426}.wa-name-cancel{color:#8696a0}.wa-name-cancel:hover{background:#8696a026}.wa-empty-contacts{text-align:center;padding:40px 20px;color:#8696a0;font-size:14px}.wa-chat{flex:1;display:flex;flex-direction:column;background:#0b141a;position:relative;min-width:0}.wa-chat-header{display:flex;align-items:center;gap:12px;padding:10px 16px;height:60px;background:#202c33;border-bottom:1px solid #222d34;z-index:10;flex-shrink:0}.wa-back-btn{background:none;border:none;cursor:pointer;color:#aebac1;padding:4px;display:none;align-items:center;border-radius:50%;transition:background .15s}.wa-back-btn:hover{background:#2a3942;color:#e9edef}.wa-chat-avatar{width:38px;height:38px;border-radius:50%;background:#2a3942;display:flex;align-items:center;justify-content:center;flex-shrink:0}.wa-chat-user-info{flex:1;min-width:0}.wa-chat-name{font-size:15px;font-weight:600}.wa-chat-phone{font-size:12px;color:#8696a0}.wa-messages{flex:1;overflow-y:auto;padding:16px 10%;display:flex;flex-direction:column;gap:4px}.wa-message-row{display:flex}.wa-message-row--outgoing{justify-content:flex-end}.wa-message-row--incoming{justify-content:flex-start}.wa-bubble{max-width:70%;padding:6px 8px 8px 10px;border-radius:8px;font-size:14px;line-height:1.4;box-shadow:0 1px .5px #0000004d}.wa-message-row--outgoing .wa-bubble{background:#005c4b;border-top-right-radius:0}.wa-message-row--incoming .wa-bubble{background:#202c33;border-top-left-radius:0}.wa-bubble-label{display:flex;align-items:center;gap:4px;font-size:10px;color:#8696a0;margin-bottom:3px}.wa-bubble-text{word-break:break-word}.wa-bubble-time{font-size:11px;color:#ffffff80;text-align:right;margin-top:3px}.wa-footer{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#202c33;flex-shrink:0}.wa-footer input{flex:1;height:42px;border-radius:21px;border:none;padding:0 16px;font-size:15px;background:#2a3942;color:#e9edef;outline:none;min-width:0}.wa-footer input::placeholder{color:#8696a0}.wa-send-btn{width:42px;height:42px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:opacity .2s;flex-shrink:0}.wa-send-btn:disabled{opacity:.4;cursor:not-allowed}.wa-send-btn--inbound{background:#00a884;color:#fff}.wa-send-btn--inbound:hover:not(:disabled){background:#017d64}.wa-send-btn--outbound{background:#2a3942;color:#00a884;border:1px solid #00a884}.wa-send-btn--outbound:hover:not(:disabled){background:#00a884;color:#fff}.wa-footer-hint{padding:4px 12px 6px;font-size:11px;color:#8696a0;background:#202c33;display:flex;align-items:center;gap:4px}.wa-empty-state{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;background:#0b141a;color:#8696a0}.wa-empty-state h2{color:#e9edef;font-weight:300;margin-bottom:8px}.wa-empty-state p{font-size:14px}@media (max-width: 1023px) and (min-width: 640px){.wa-sidebar{width:38%;min-width:220px}.wa-messages{padding:16px 5%}.wa-back-btn{display:flex}}@media (max-width: 639px){.wa-sidebar{width:100%;max-width:100%;position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;transition:transform .25s ease}.wa-sidebar--hidden{transform:translate(-100%);pointer-events:none}.wa-chat{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;transform:translate(100%);transition:transform .25s ease}.wa-chat--visible{transform:translate(0)}.wa-empty-state{position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(100%);transition:transform .25s ease}.wa-empty-state.wa-chat--visible{transform:translate(0)}.wa-back-btn{display:flex}.wa-messages{padding:12px 4%}.wa-bubble{max-width:85%}.wa-contact-name{max-width:180px}}.sms-container{display:flex;width:100%;height:100vh;background-color:#f5f5f5;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#333}.sms-sidebar{width:350px;background-color:#fff;border-right:1px solid #ddd;display:flex;flex-direction:column}.sms-header{padding:15px 20px;border-bottom:1px solid #f0f0f0;display:flex;justify-content:space-between;align-items:center}.sms-header h2{font-size:24px;margin:0;font-weight:700}.sms-header-actions button{background:none;border:none;cursor:pointer;color:#007bff}.sms-new-chat-input{padding:10px;background:#f9f9f9}.sms-new-chat-input input{width:100%;padding:8px 12px;border-radius:20px;border:1px solid #ccc;outline:none}.sms-list{flex:1;overflow-y:auto}.sms-list-item{display:flex;align-items:center;padding:15px 20px;border-bottom:1px solid #eee;cursor:pointer;transition:background .2s}.sms-list-item:hover{background-color:#f9f9f9}.sms-list-item.selected{background-color:#e6f7ff}.sms-avatar{background:linear-gradient(135deg,#ccc,#aaa);color:#fff;width:45px;height:45px;border-radius:50%;display:flex;justify-content:center;align-items:center;margin-right:15px;font-size:14px}.sms-contact-name{font-weight:600;font-size:16px}.sms-preview .sms-preview-top{display:flex;justify-content:space-between;width:240px}.sms-time{color:#999;font-size:12px}.sms-last-msg{color:#666;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}.sms-chat-area{flex:1;display:flex;flex-direction:column;background-color:#fff;position:relative}.sms-chat-header{height:60px;border-bottom:1px solid #eee;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:#ffffffe6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:sticky;top:0;z-index:10}.sms-chat-user{display:flex;align-items:center;gap:10px}.sms-chat-actions{display:flex;gap:15px;color:#007bff}.sms-messages{flex:1;padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.sms-bubble-row{display:flex;width:100%}.sms-bubble-row.outgoing{justify-content:flex-end}.sms-bubble-row.incoming{justify-content:flex-start}.sms-bubble{max-width:70%;padding:10px 14px;border-radius:18px;font-size:15px;line-height:1.4;position:relative}.sms-bubble-row.outgoing .sms-bubble{background-color:#007bff;color:#fff;border-bottom-right-radius:4px}.sms-bubble-row.incoming .sms-bubble{background-color:#e5e5ea;color:#000;border-bottom-left-radius:4px}.sms-timestamp-helper{font-size:10px;color:#999;text-align:center;margin-top:10px;text-transform:uppercase;font-weight:600}.sms-input-area{padding:10px 15px;border-top:1px solid #eee;display:flex;align-items:center;gap:10px;background-color:#fff}.sms-attach-btn{background:none;border:none;color:#999;cursor:pointer;padding:5px}.sms-input-wrapper{flex:1;display:flex;align-items:center;border:1px solid #ddd;border-radius:20px;padding:4px 12px}.sms-input-wrapper input{flex:1;border:none;outline:none;padding:6px;font-size:15px}.sms-send-btn{background-color:#007bff;border:none;border-radius:50%;width:28px;height:28px;display:flex;justify-content:center;align-items:center;cursor:pointer;margin-left:5px}.sms-empty{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#ccc}.settings-container{display:flex;justify-content:center;padding:40px 24px;height:100%;background:#f0f2f5}.settings-card{background:#fff;border-radius:12px;padding:32px;width:100%;max-width:560px;box-shadow:0 2px 12px #00000014;height:fit-content}.settings-title{font-size:20px;font-weight:600;color:#111;margin:0 0 20px}.settings-section-title{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#25d366;margin:20px 0 12px;padding-bottom:6px;border-bottom:1px solid #e8e8e8}.settings-field{margin-bottom:24px}.settings-label{display:block;font-size:14px;font-weight:600;color:#333;margin-bottom:6px}.settings-hint{font-size:13px;color:#777;margin:0 0 10px;line-height:1.5}.settings-input{width:100%;padding:10px 14px;border:1px solid #ddd;border-radius:8px;font-size:14px;outline:none;box-sizing:border-box;transition:border-color .2s}.settings-input:focus{border-color:#25d366}.settings-input:disabled{background:#f5f5f5;color:#aaa}.settings-save-btn{display:flex;align-items:center;gap:8px;padding:10px 24px;background:#25d366;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}.settings-save-btn:hover{background:#1ebe59}.settings-save-btn:disabled{background:#a8e6bf;cursor:not-allowed}.main-layout{display:flex;width:100vw;height:100vh;height:100dvh;overflow:hidden}.nav-sidebar{width:80px;background-color:#2a2a2a;display:flex;flex-direction:column;align-items:center;padding:20px 0;color:#fff;z-index:100}.nav-logo{font-weight:700;font-size:14px;margin-bottom:40px;letter-spacing:1px;color:#00d2d3}.nav-links{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:30px;width:100%}.nav-links li{width:100%;display:flex;justify-content:center}.nav-links a{display:flex;flex-direction:column;align-items:center;color:#ccc;text-decoration:none;font-size:12px;transition:color .2s}.nav-links a:hover{color:#fff}.nav-icon{margin-bottom:5px}.app-content{flex:1;position:relative;overflow:hidden}@media (max-width: 639px){.nav-sidebar{width:52px;padding:12px 0}.nav-logo{display:none}.nav-links{gap:20px}.nav-links a span{display:none}.nav-icon{margin-bottom:0}}:root{--app-bg: #111b21;--sidebar-bg: #202c33;--chat-bg: #0b141a;--panel-header-bg: #202c33;--compose-bg: #202c33;--message-outgoing: #005c4b;--message-incoming: #202c33;--primary: #00a884;--text-primary: #e9edef;--text-secondary: #8696a0;--border: #2a3942}html,body{margin:0;padding:0;width:100%;height:100%;font-family:Segoe UI,Helvetica Neue,Helvetica,Arial,sans-serif;background-color:var(--app-bg);color:var(--text-primary);overflow:hidden}#root{width:100%;height:100%;display:flex}*{box-sizing:border-box}::-webkit-scrollbar{width:6px!important;height:6px!important}::-webkit-scrollbar-thumb{background-color:#fff3}::-webkit-scrollbar-track{background:#ffffff1a}