@import"https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css";.message-container{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:8px 12px 20px}.contact-message,.own-message{max-width:70%;margin:12px 16px;border-radius:12px 0 12px 12px;font-size:15px;position:relative;display:flex;flex-direction:column;padding:0 0 0 20px}.contact-message{align-self:flex-start;background-color:#222;color:#fff;margin-right:auto}.own-message{align-self:flex-end;background-color:#005c4b;color:#fff;margin-left:auto}.contact-message span,.own-message span{font-size:11px;opacity:.7;margin-top:4px;position:absolute;bottom:4px;right:8px}.new-message-form{display:flex;align-items:center;padding:10px 16px;background-color:#1e1e1e;border-top:1px solid #333}.message-input{flex:1;padding:10px 14px;border:none;border-radius:20px;background-color:#2a2a2a;color:#fff;font-size:14px;outline:none;margin-right:8px}.send-button{border:none;color:#fff;background-color:transparent;font-size:24px;cursor:pointer}.chat-screen-container{display:flex;flex-direction:column;height:100%}.chat-header{display:flex;align-items:center;padding:12px 16px;background-color:#161717}.chat-header-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;margin-right:12px}.chat-header-info{display:flex;flex-direction:column}.chat-header-name{margin:0;font-size:16px;font-weight:600}.chat-header-status{font-size:12px;font-weight:400;color:gray}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background-color:#161717;border-bottom:1px solid #2a2a2a;width:100%;box-sizing:border-box}.chat-header-icons{display:flex;align-items:center;gap:16px;color:#bbb;font-size:18px;margin-left:auto}.chat-screen-container{display:flex;flex-direction:column;height:100%;background-color:#0d0d0d}.message-list-container{flex:1;overflow-y:auto;padding:12px 16px}.welcome-screen{padding:48px;text-align:center;background-color:#161717;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.welcome-cover{max-width:320px;height:auto}.welcome-title{font-family:Arial,Helvetica,sans-serif;font-weight:100;font-size:36px;color:#fafafa;margin:38px 0 0}.welcome-screen p{font-size:16px;color:#555;max-width:480px;margin-bottom:24px}.download-button{background-color:#21c063;color:#0a0a0a;font-weight:600;border:none;padding:10px 24px;border-radius:8px;cursor:pointer;font-size:14px}.contact-list-container{display:flex;flex-direction:column;height:100%}.contact-list-header{display:flex;justify-content:space-between;align-items:center;padding:18px 16px}.contact-list-title{font-size:20px;color:#fff;font-family:Helvetica;font-weight:600;margin:0}.contact-list-icons i{font-size:20px;color:#fff;margin-left:25px;cursor:pointer}.contact-items{display:flex;flex-direction:column;padding:8px}.search-bar{display:flex;align-items:center;gap:12px;background-color:#2a2a2a;border-radius:20px;padding:6px 12px;margin:10px 12px 8px;color:#bbb}.search-bar i{font-size:16px;color:#bbb}.search-bar input{border:none;outline:none;background-color:transparent;color:#fff;font-size:14px;flex:1}.app-container{display:flex;height:100vh;width:100vw;background-color:#161717;font-family:Helvetica}.left-panel{width:502px;min-width:502px;display:flex;flex-direction:column;z-index:1;border-right:1px solid #2a3942;overflow-y:auto}.right-panel{flex:1;overflow-y:auto;display:flex;flex-direction:column}.chat-screen-container{display:flex;flex-direction:column;height:100%;background-image:url(/Images/WhatsApp-Wallpaper.png);background-repeat:repeat;background-size:350px;background-attachment:fixed}@media screen and (max-width: 1140px){.chat-header .icon-group{gap:8px}}@media screen and (max-width: 1024px){.left-panel{flex:1;max-width:100%}.right-panel{flex:2;max-width:100%}.chat-screen-container{background-size:contain}}@media screen and (max-width: 768px){.app-container{flex-direction:column}.left-panel,.right-panel{width:100%;height:auto}.contact-name{font-size:14px}.contact-lastSeen,.contact-preview{font-size:12px}.message-container{padding:6px 8px 16px}}@media screen and (max-width: 480px){.photo-avatar{width:40px;height:40px}.chat-header .icon-group i{font-size:16px}.message-container{padding:4px 6px 12px}}@media screen and (max-width: 320px){html,.contact-name{font-size:13px}.chat-header .icon-group{gap:4px}.photo-avatar{width:36px;height:36px}}.chat-header-icons i{display:inline-block;color:#fff;font-size:20px;margin-left:12px;cursor:pointer}@media screen and (max-width: 768px){.chat-header-icons i:not(.mobile-only){display:none}.mobile-only{display:inline-block}.left-panel{display:none}.left-panel.show{display:block;position:absolute;top:0;left:0;width:80%;height:100%;background-color:#202020;z-index:10;box-shadow:2px 0 5px #00000080}}.contact-profile{display:flex;flex-direction:row;align-items:center;padding:10px 15px;text-decoration:none;color:inherit}.contact-profile:hover{background-color:#42424233;cursor:pointer;border-radius:15px}.photo-avatar{width:48px;height:48px;border-radius:50%;margin-right:12px}.contact-content{display:flex;flex-direction:column;flex:1}.contact-details{display:flex;justify-content:space-between;align-items:center}.contact-name{font-size:15px;font-weight:700;margin:0}.contact-lastSeen{font-size:12px;color:#fff9;margin-left:8px}.contact-preview{font-size:14px;color:#fff9;margin-top:2px;white-space:nowrap;overflow:hidden}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}