.home-container{display:flex;justify-content:center;align-items:center;height:100%;background-color:#f0f2f5;text-align:center;padding:20px}.welcome-content{max-width:450px}.welcome-img{width:250px;margin-bottom:20px}.welcome-content h1{font-size:32px;font-weight:300;color:#41525d;margin-bottom:15px}.welcome-content p{font-size:14px;color:#667781;line-height:20px;margin-bottom:30px}.download-btn{background-color:#008069;color:#fff;border:none;padding:10px 24px;border-radius:20px;font-weight:500;cursor:pointer}.message-row{display:flex;width:100%;margin-bottom:4px}.message-row.mi-mensaje{justify-content:flex-end}.message-row.su-mensaje{justify-content:flex-start}.message-info{display:flex;justify-content:flex-end;align-items:center;gap:4px;margin-top:-4px;margin-bottom:-4px;float:right;padding-left:10px}.chat-header{display:flex;align-items:center;padding:10px 16px;background-color:#f0f2f5;border-bottom:1px solid #d1d7db}.chat-header h2{font-size:16px;font-weight:500;color:#111b21;margin:0}.chat-header span{font-size:13px;color:#667781}.contact-texts{display:flex;flex-direction:column;margin-left:15px}.message-bubble{max-width:65%;padding:8px 12px;border-radius:8px;font-size:14px;position:relative;box-shadow:0 1px .5px #00000021}.message-row.mi-mensaje .message-bubble{background-color:#d9fdd3;border-top-right-radius:0}.message-row.su-mensaje .message-bubble{background-color:#fff;border-top-left-radius:0}.message-text{font-size:14.2px;line-height:1.4;color:#111b21;margin:0;word-wrap:break-word;overflow-wrap:break-word}.message-time{font-size:11px;color:#667781;white-space:nowrap;text-transform:uppercase}.check-mark-icon{color:#53bdeb;font-size:18px;margin-left:4px;vertical-align:middle}@media(min-width:1200px){.message-bubble{max-width:50%}}@media(max-width:320px){.message-bubble{max-width:85%}}.message-form{display:flex;align-items:flex-end;padding:10px 15px;background-color:#f0f2f5;gap:10px;border-top:1px solid #d1d7db;position:sticky;bottom:0;width:100%}.input-container{flex:1;background-color:#fff;border-radius:20px;padding:5px 10px}.message-input{width:100%;border:none;outline:none;resize:none;font-size:15px;font-family:inherit;padding:5px;background:transparent;max-height:120px;display:block;scroll-margin-bottom:20px}.send-button{background:none;border:none;color:#54656f;font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding-bottom:5px}.send-button:hover{color:#1fa855}html,body,#root{height:100%;margin:0;padding:0;overflow:hidden}@media(max-width:768px){.content-wrapper{height:100dvh!important;display:flex;flex-direction:column}.message-form{position:relative;bottom:0;padding-bottom:12px;border-radius:0}}.chat-header{display:flex;justify-content:space-between;flex-shrink:0;align-items:center;padding:10px 16px;background-color:#f0f2f5;border-bottom:1px solid #d1d7db;height:60px;box-sizing:border-box;font-size:16px}.header-left{display:flex;align-items:center;gap:12px}.back-btn{display:none;margin-right:8px;font-size:24px;color:#54656f;text-decoration:none}.header-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;cursor:pointer}.header-info-text{display:flex;flex-direction:column}.chat-header .header-name{font-size:16px;font-weight:500;color:#111b21;margin-left:10px}.chat-header .header-status{font-size:12px;color:#667781;margin-left:10px}.header-right-actions{display:flex;gap:10px}.header-icon-btn{background:none;border:none;padding:8px;border-radius:50%;color:#54656f;font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.header-icon-btn:hover{background-color:#0000000d}@media(max-width:768px){.back-btn{display:flex;align-items:center}.chat-header{position:fixed;top:0;left:0;width:100%;z-index:1000;background-color:#f0f2f5}.chat-messages-area{margin-top:60px;height:calc(100dvh - 130px)}}*{box-sizing:border-box;margin:0;padding:0}.app-container{display:flex;height:100dvh;width:100%;overflow:hidden;background-color:#f0f2f5;position:fixed;top:0;left:0}.sidebar-container{width:30%;min-width:260px;max-width:400px;background-color:#fff;border-right:1px solid #d1d7db;display:flex;flex-direction:column}.header-panel{display:flex;align-items:center;padding:16px 20px;background-color:#fff;gap:24px;height:60px}.header-panel h3{margin:0;font-size:17px;font-weight:500;color:#41525d}.info-panel,.search-panel{padding:20px;display:flex;flex-direction:column;gap:10px}.close-search-btn{background:none;border:none;cursor:pointer;font-size:20px;font-weight:800;color:#54656f;padding:5px;display:flex;align-items:center;justify-content:center;transition:color .2s}.close-search-btn:hover{color:#3b4a54}.body-panel .right-panel-search{display:block;font-size:14px;color:#747576;margin-top:25px!important}.body-panel{padding:10px 20px;background-color:#fff}.body-panel input{width:100%;padding:8px 20px;border:2px solid #00A884;border-radius:20px;background-color:#f0f2f5;outline:none}.header-panel button{background:none;border:none;cursor:pointer;font-size:16px;color:#54656f}.chat-container{display:flex;flex-direction:column;height:100dvh;width:100%;overflow:hidden;position:relative}.chat-header{display:flex;flex:0 0 60px;justify-content:space-between;align-items:center;height:60px;padding:10px 20px;background-color:#f0f2f5;border-bottom:1px solid #d1d7db;font-size:20px;width:100%;z-index:10}.contact-info{display:flex;align-items:center;gap:10px}.avatar{width:45px;height:45px;border-radius:50%;object-fit:cover}.chat-messages-area{flex:1;overflow-y:auto;display:flex;flex-direction:column;padding:20px;background-color:#efeae2;background-image:url(https://user-images.githubusercontent.com/15075759/28719144-86dc0f70-73b1-11e7-911d-60d70fcded21.png);background-repeat:repeat;background-size:400px;background-blend-mode:multiply;gap:8px;-webkit-overflow-scrolling:touch}.chat-input-area{flex:0 0 auto;background-color:#f0f2f5;padding:10px 15px;width:100%;z-index:10;box-sizing:border-box}.chat-body-wrapper{display:flex;flex-direction:row;flex-wrap:nowrap;height:100%;width:100%;position:relative;overflow:hidden}.right-sidebar{background:#fff;z-index:100;height:100%;overflow-y:auto}.back-button{display:none;font-size:24px;color:#667781;margin-right:10px;cursor:pointer;text-decoration:none;align-items:center}.phone_number{font-size:14px;color:#4f5459;padding-top:10px}.grey_line{height:1px;background-color:#acaeaf;margin:20px 0}.options-container{display:flex;flex-direction:column;padding:10px 20px;text-align:left}.option-item{display:flex;align-items:center;gap:20px;padding:15px 0;cursor:pointer;transition:background .2s}.option-item:hover{background-color:#f5f6f6}.option-icon{font-size:18px;color:#54656f;display:flex}.option-label{font-size:15px;color:#111b21}@media(max-width:767px){.right-sidebar{position:fixed;top:0;right:0;width:100%;height:100%}.back-btn{display:flex!important}}@media(min-width:768px){.right-sidebar{position:relative;width:350px;flex:0 0 350px;border-left:1px solid #ddd}.back-btn{display:none!important}}.sidebar-content{display:flex;flex-direction:column;height:100%;background-color:#fff}.contacts-list{flex:1;overflow-y:auto;background-color:#fff}.contact-item{display:flex;align-items:center;padding:12px 16px;width:100%;text-decoration:none;color:#111b21}.contact-avatar{width:49px;height:49px;border-radius:50%;object-fit:cover;margin-right:8px}.contact-info-text{flex:1;display:flex;flex-direction:column;margin-left:12px;min-width:0}.contact-info-text h3{font-size:16px;font-weight:600;color:#111b21;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.contact-info-text p{font-size:14px;font-weight:400;color:#747a7e;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.contact-header-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px}.contact-header-row h3{font-size:16px;font-weight:500;color:#111b21;margin:0}.contact-item.active-chat{background-color:#ebebeb}.contact-item.selected{background-color:#f0f2f5!important}.sidebar-content{width:100%;max-width:100vw;overflow-x:hidden;display:flex;flex-direction:column;height:100vh}.sidebar-header{background-color:#fff;padding:15px 16px 10px;border-bottom:1px solid #f0f2f5}.sidebar-header h2{font-size:16px;font-weight:700;color:#111b21}.header-top-row{display:flex;justify-content:space-between;align-items:center;padding:10px 16px 0}.whatsapp-title{color:#1fa855;font-size:22px;font-weight:700}.header-icons{display:flex;gap:8px;align-items:center}.sidebar-icon-btn{background:none;border:none;color:#54656f;font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:50%;transition:background-color .2s ease}.sidebar-icon-btn:hover{background-color:#0000000d}.search-input-wrapper{background-color:#f0f2f5;border-radius:20px;border:1px solid #54656f;padding:0 12px;display:flex;align-items:center;height:35px}.search-icon{font-size:14px;color:#54656f;margin-right:15px}.search-input-wrapper input{flex:1;border:none;outline:none;background:transparent;font-size:14px}.filters-container{display:flex;gap:8px;margin-top:15px}.filter-pill{background-color:#f0f2f5;border:1px solid #6d6e6f;padding:6px 12px;border-radius:20px;font-size:13px;color:#6d6e6f;font-weight:600;cursor:pointer}.filter-pill.active{background-color:#e7fce3;color:#6d6e6f;font-weight:600}.user-profile{display:flex;align-items:center;gap:10px}.user-profile h2{font-size:16px;margin:0}.favorite-text{font-size:13px;color:#667781;margin-top:0}.info-container{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.contact-date{font-size:12px;color:#667781}.last-message-preview{font-size:14px;color:#667781;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:768px){.contact-info-text{display:flex!important;flex:1!important;min-width:0!important}.contact-info-text h3{display:block!important;color:#111b21!important;font-size:15px!important}.contact-avatar{flex-shrink:0!important}.contact-item.selected{background-color:#f0f2f5!important}}@media(max-width:768px){.contact-info-text{display:flex!important;flex:1!important;min-width:0!important}.contact-info-text h3{display:block!important;color:#111b21!important;font-size:15px!important}.contact-avatar{flex-shrink:0!important}.contact-item.selected{background-color:#f0f2f5!important}.contacts-list::-webkit-scrollbar{display:none}.contacts-list{-ms-overflow-style:none;scrollbar-width:none;padding-bottom:20px;-webkit-overflow-scrolling:touch}}@media(max-width:320px){.sidebar{flex:1;min-width:320px}.contact-item{display:flex;align-items:center;padding:12px 16px;gap:12px}.contact-avatar{flex-shrink:0}.contact-info-text{flex:1;display:flex;flex-direction:column;margin-left:12px;min-width:0;border-bottom:1px solid #f2f2f2;padding-bottom:10px}.contact-header-row{display:flex;justify-content:space-between;align-items:center;width:100%}.contact-info-text h3{font-size:14px;font-weight:600;color:#000;margin:0}.contact-date{font-size:10px;color:#667781}.last-message-preview{font-size:12px;color:#667781;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}}@media(min-width:1200px){.sidebar{flex:0 0 25%;max-width:400px}}html,body{height:100dvh;overflow:hidden;margin:0;padding:0}#root{height:100dvh;display:flex;flex-direction:column;overflow:hidden}:root{--whatsapp-green: #00a884;--bg-gray: #f0f2f5;--border-color: #d1d7db}*{margin:0;padding:0;box-sizing:border-box}.app-main-layout{display:flex;width:100%;height:100vh;background-color:var(--bg-gray);overflow:hidden}.sidebar-wrapper{width:30%;min-width:350px;max-width:450px;background-color:#fff;border-right:1px solid var(--border-color);display:flex;flex-direction:column}.content-wrapper{flex-grow:1;display:flex;flex-direction:column;background-color:#efeae2}.contact-item{display:flex;align-items:center;padding:12px 16px;text-decoration:none;color:inherit;border-bottom:1px solid #f0f2f5;transition:background-color .2s}.contact-item:hover{background-color:#f5f6f6}.contact-avatar{width:49px;height:49px;border-radius:50%;object-fit:cover;flex-shrink:0}.contact-info-text{flex:1;min-width:0;display:flex;flex-direction:column;margin-left:12px}.contact-header-row{display:flex;justify-content:space-between;align-items:center}.contact-info-text h3{font-size:15px;font-weight:500;color:#111b21;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.contact-date{font-size:11px;color:#667781}.last-message-preview{font-size:13px;color:#667781;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}@media(max-width:1024px){.sidebar-wrapper{width:40%;min-width:320px}}@media(max-width:768px){.app-main-layout{flex-direction:row}.sidebar-wrapper{display:flex;width:100%!important}.content-wrapper{display:none}.app-main-layout.chat-is-open .sidebar-wrapper{display:none!important}.app-main-layout.chat-is-open .content-wrapper{display:flex!important;width:100%!important;position:fixed;top:0;left:0;height:100vh;z-index:99}}@media(max-width:320px){.contact-avatar{width:42px;height:42px}.contact-info-text h3{font-size:13px}.contact-date{font-size:10px}}@media(min-width:1441px){body{background-color:#dadbd3;display:flex;justify-content:center;align-items:center;height:100vh}.app-main-layout{width:1400px;height:95vh;box-shadow:0 6px 18px #0000001a}}html,body{height:100%;margin:0;padding:0;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;background-color:#f0f2f5;overscroll-behavior:none;width:100%;position:fixed}#root{height:100%;display:flex;flex-direction:column;overflow:hidden}@media(max-width:600px){.sidebar{flex:0 0 70px;min-width:70px}.contact-info-text{display:none}}@media(min-width:1440px){.app-container{max-width:1600px;margin:0 auto;height:95dvh;margin-top:2.5dvh;border-radius:6px;overflow:hidden}}