@import"https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Manrope:wght@200;300;400;500;600;700;800&display=swap";*{padding:0;margin:0;box-sizing:border-box;font-family:inherit}body{font-family:Lato,sans-serif;font-size:16px;font-weight:400}a{text-decoration:none;color:inherit}button{background-color:transparent;border:none;outline:0;cursor:pointer}ul{list-style-type:none}.page-wrapper{background-color:#f3f6fc;min-height:100vh;overflow:hidden;transition:.5s ease-in-out}.content-wrapper{background-color:#f3f6fc;padding:20px;margin-left:220px}@media (max-width: 1400px){.content-wrapper{padding:20px}}@media (max-width: 1200px){.content-wrapper{padding:20px;margin-left:56px}}@media (max-width: 768px){.content-wrapper{margin-left:0;padding:24px;padding-bottom:5vh}}@media (max-width: 576px){.content-wrapper{margin-left:0;padding:16px;padding-bottom:10vh}}.content-area>section{margin-bottom:16px}.content-area>section:last-child{margin-bottom:0}.container{display:flex;align-items:center;justify-content:space-between;background-color:#fff;border-radius:5px;padding:15px 10px;box-shadow:#00000005 0 4px 12px;margin-bottom:15px}.container .title{color:#292929;font-weight:700;text-transform:capitalize}.container .menu{display:flex;align-items:center;gap:20px}.container .menu .search{display:flex;align-items:center;gap:10px;background-color:#f3f6fc;padding:10px;border-radius:10px}.container .menu .icons{display:flex;gap:20px}.sidebar{position:fixed;left:0;top:0;width:220px;height:100%;background-color:#fff;padding:20px 14px;box-shadow:#64646f1a 0 7px 29px;display:flex;flex-direction:column;z-index:999;transition:all .3s ease-in-out;overflow-y:scroll}.sidebar::-webkit-scrollbar{width:6px}.sidebar::-webkit-scrollbar-track{background-color:#fff}.sidebar::-webkit-scrollbar-thumb{border-radius:100vh!important;background-color:#f3f6fc;outline:1px solid rgba(0,0,0,.02);outline-offset:-1px}@media (max-width: 1200px){.sidebar{width:auto;padding:20px 6px}}@media (max-width: 768px){.sidebar{width:260px;transform:translate(-100%)}}.sidebar .sidebar-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px;padding-bottom:4px;border-bottom:1px solid #f6f6f6}.sidebar .sidebar-brand{display:flex;align-items:center;justify-content:flex-start;column-gap:5px}.sidebar .sidebar-brand img{width:2.5rem;height:2.5rem}.sidebar .sidebar-brand-text{text-transform:uppercase;font-weight:900;color:#222b3c}@media (max-width: 1200px){.sidebar .sidebar-brand-text{display:none}}@media (max-width: 768px){.sidebar .sidebar-brand-text{display:inline-block}}.sidebar .menu-item{margin-bottom:8px}.sidebar .menu-item:last-child{margin-bottom:0}@media (max-width: 1200px){.sidebar .menu-item{display:flex;align-items:center;justify-content:center}}.sidebar .menu-item .menu-link{width:100%;display:flex;align-items:center;justify-content:flex-start;column-gap:11px;padding:11px;border-radius:12px;color:#292929;transition:all .3s ease-in-out}@media (max-width: 1200px){.sidebar .menu-item .menu-link{padding:2px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px}}@media (max-width: 768px){.sidebar .menu-item .menu-link{padding:12px;border-bottom:12px;width:100%;height:42px;justify-content:flex-start}}.sidebar .menu-item .menu-link:hover{background-color:#f7f7f8;box-shadow:0 0 4px #475be80a}.sidebar .menu-item .menu-link.active{background-color:#cf0;box-shadow:0 0 4px #475be80a}.sidebar .menu-item .menu-link-text{font-weight:600;font-size:.875rem}@media (max-width: 1200px){.sidebar .menu-item .menu-link-text{display:none}}@media (max-width: 768px){.sidebar .menu-item .menu-link-text{display:inline-block}}.sidebar .menu-item .menu-link-icon{display:flex;align-items:center;justify-content:center}.sidebar .sidebar-body{flex:1;display:flex;flex-direction:column;justify-content:space-between}.sidebar .sidebar-menu2{margin-top:auto}@media (min-width: 768px){.bottom-nav{display:none}}@media (max-width: 768px){.bottom-nav{position:fixed;z-index:999;bottom:0;width:100%;background-color:#fff;padding:1rem;display:flex;justify-content:space-around;border-top-left-radius:1.2vh;border-top-right-radius:1.2vh;box-shadow:0 0 10px #0003}.bottom-nav .nav-item{color:#000;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.bottom-nav .nav-item .mobile-name{font-size:.6rem;color:#292929;font-weight:600;margin-top:4px}}.container-mkt{display:flex;height:calc(100vh - 125px);width:100%;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.sidebar-mkt{width:30%;min-width:280px;background:#fff;border-right:1px solid #eaeaea;display:flex;flex-direction:column;border-radius:12px 0 0 12px}.chat-header{padding:1rem;background:#fff;border-bottom:1px solid #eaeaea;font-weight:600;color:#333;border-radius:12px 0 0;position:sticky;top:0;z-index:10;display:flex;flex-direction:column;gap:.75rem}.selected-customer-header{padding:.75rem;background:#f8f9fa;border-radius:8px;border:1px solid #eaeaea;margin-top:.5rem}.selected-customer-info{display:flex;flex-direction:column;gap:.5rem}.selected-customer-label{font-size:.85rem;color:#666;text-align:center;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.selected-customer-name{font-size:1rem;font-weight:500;color:#333;text-align:center;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem;background:#f8f9fa;border-radius:6px}.selected-customer-email,.selected-customer-phone{font-size:.85rem;color:#666;text-align:center;margin-top:.25rem}.customer-info{display:flex;flex-direction:column;gap:.15rem;width:100%}.customer-name{display:flex;align-items:center;justify-content:space-between;font-weight:500;width:100%;margin-bottom:.1rem}.customer-email{font-size:.85rem;color:#666}.customer-phone{font-size:.92em;color:#666;margin-left:.1rem;margin-top:.1rem;word-break:break-all}.sms-icons{display:flex;gap:.75rem;margin-left:auto;align-items:center}.icon{font-size:1.2rem;color:#2196f3;margin-left:.5rem;display:flex;align-items:center}.email-icon{font-size:1.2rem}.sms-icon{font-size:1.2rem;color:#2196f3}.phone-icon{color:#4caf50}.chat-item.selected .icon,.chat-item.selected .sms-icon{color:#1976d2}.chat-item.selected .phone-icon{color:#388e3c}.selected-customer-phone,.customer-phone{font-size:.85rem;color:#666;margin-top:.25rem}.selected-customer-phone{text-align:center}.chat-type{display:flex;align-items:center;gap:.5rem;width:100%;background:#f8f9fa;padding:.5rem;border-radius:8px}.type-button{flex:1;padding:.8rem 1.2rem;font-size:.95rem;font-weight:500;background:#fff;color:#495057;border:1px solid #eaeaea;border-radius:6px;cursor:pointer;transition:all .2s ease;text-align:center;min-height:44px;-webkit-tap-highlight-color:transparent}.type-button:hover{background:#f0f0f0}.type-button.enable{background:#cf0;color:#000;border-color:#cf0}.type-button.disabled{background:#fff;color:#6c757d;border-color:#eaeaea}.chat-list{overflow-y:auto;flex:1;padding:.75rem;background:#fff;-webkit-overflow-scrolling:touch;border-radius:0 0 0 12px}.chat-item{padding:1rem;border-radius:8px;margin:.25rem 0;cursor:pointer;transition:all .2s ease;color:#333;font-size:.95rem;background:#f8f9fa;border:1px solid #eaeaea;min-height:44px;display:flex;align-items:center;-webkit-tap-highlight-color:transparent}.chat-item:hover{background:#f0f0f0;transform:translate(4px);border-color:#cf0}.chat-item.selected{background:#cf0;color:#000;border-color:#cf0}.chat-item.selected:hover{background:#9c0}.chat-item.first-group{margin-bottom:1rem;background:#f0f0f0;font-weight:500}.chat-main{flex:1;background:#fff;display:flex;flex-direction:column;justify-content:space-between;border-radius:0 12px 12px 0}.messages{padding:1.5rem;flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:1rem;background:#f8f9fa;border-radius:0 12px 0 0}.message{max-width:70%;padding:.8rem 1.2rem;border-radius:12px;font-size:.95rem;position:relative;word-wrap:break-word;box-shadow:0 1px 2px #0000001a}.message.sent{align-self:flex-end;background:#cf0;color:#000}.message.received{align-self:flex-start;background:#fff;border:1px solid #eaeaea}.input-box{padding:1.25rem;background:#fff;display:flex;gap:1rem;align-items:center;flex-wrap:wrap;border-top:1px solid #eaeaea;border-radius:0 0 12px}.input-box input{flex:1;padding:.8rem 1.2rem;border:1px solid #eaeaea;border-radius:8px;outline:none;min-width:200px;font-size:.95rem;transition:border-color .2s ease}.input-box input:focus{border-color:#cf0;box-shadow:0 0 0 2px #007bff1a}.input-box input.error{border-color:#dc3545;background-color:#fff8f8}.error-messages{padding:.75rem 1.25rem;background:#fff8f8;border-top:1px solid #ffdddd}.error-messages .error{color:#dc3545;font-size:.9rem;margin:.25rem 0}.customer-message-preview{font-size:.85em;color:#888;margin-top:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}@media (max-width: 768px){.container-mkt{width:100%;max-height:82vh;margin:0;flex-direction:column;border-radius:10px}.sidebar-mkt{width:100%;min-width:100%;border-right:none;border-bottom:1px solid #eaeaea;border-radius:0;height:40vh;min-height:300px}.chat-header{border-radius:0;padding:.75rem}.chat-type{padding:.25rem}.type-button{padding:.6rem 1rem;font-size:.9rem}.chat-list{padding:.5rem}.chat-item{padding:.75rem;margin:.15rem 0}.chat-main{flex:1;height:60vh;border-radius:0}.selected-customer-header{padding:.5rem;margin-top:.25rem}.selected-customer-label{font-size:.8rem}.selected-customer-name{font-size:.95rem;padding:.4rem}.selected-customer-email,.selected-customer-phone{font-size:.8rem}.customer-name{font-size:.9rem}.customer-email,.customer-phone{font-size:.8rem}.icon{font-size:1rem}.email-icon,.sms-icon{font-size:1.1rem}.sms-icons{gap:.5rem}}@media (max-width: 360px){.sidebar-mkt{height:35vh;min-height:250px}.chat-main{height:65vh}.type-button{padding:.5rem .75rem;font-size:.85rem}}