@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;600;700;800&display=swap";*{box-sizing:border-box}body{color:#30332f;background:#efede6;margin:0;font-family:DM Sans,sans-serif}button,input{font:inherit}.chatPage{justify-content:center;align-items:flex-start;gap:28px;min-height:100vh;padding:40px;display:flex}.chatBox{background:#fff;border:1px solid #d9d4c8;border-radius:18px;flex-direction:column;width:min(610px,100%);height:calc(100vh - 80px);min-height:680px;display:flex;overflow:hidden;box-shadow:0 22px 65px #28352e18}.chatBox>header{color:#fff;background:linear-gradient(125deg,#103f35,#206856);justify-content:space-between;align-items:center;min-height:105px;padding:25px 28px;display:flex}.chatBox header b,.chatBox header span{display:block}.chatBox header span{color:#caddd7;margin-top:6px;font-size:12px}.chatBox header em{color:#143d32;background:#d8ad55;border-radius:20px;padding:9px 12px;font-size:10px;font-style:normal;font-weight:800}.who{background:#f6f4ee;border-bottom:1px solid #e5e0d6;align-items:center;gap:11px;padding:13px 25px;display:flex}.who i{color:#17483c;background:#d8aa50;border-radius:50%;place-items:center;width:42px;height:42px;display:grid}.who svg{width:20px}.who b,.who small{display:block}.who small{color:#7c847f;font-size:11px}.conversation{flex:1;padding:24px;overflow:auto}.bubble{white-space:pre-line;border-radius:15px;width:max-content;max-width:82%;margin-bottom:10px;padding:12px 15px;font-size:14px;line-height:1.5}.bubble.bot{background:#efede7;border-bottom-left-radius:4px}.bubble.user{color:#fff;background:#1b5b4c;border-bottom-right-radius:4px;margin-left:auto}.dots{color:#8a908b;letter-spacing:3px;background:#efede7;border-radius:15px;width:max-content;padding:8px 16px}.voiceGrid{grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 15px;display:grid}.voiceGrid button{color:#17483c;cursor:pointer;background:#fafcf9;border:1px solid #d9e2dc;border-radius:9px;align-items:center;gap:9px;padding:11px;display:flex}.voiceGrid svg{width:15px}.attach{color:#17483c;cursor:pointer;background:#f8fbf8;border:1px dashed #aabbb2;border-radius:12px;justify-content:center;align-items:center;gap:12px;width:100%;padding:18px;display:flex}.attach b,.attach small{text-align:left;display:block}.attach small{color:#7e8983;margin-top:3px}.attach input{display:none}.chatBox>footer{background:#f6f4ee;border-top:1px solid #ded9ce;padding:14px 17px}.chatBox footer>div{gap:8px;display:flex}.chatBox footer input{border:1px solid #cec9bd;border-radius:28px;outline:none;flex:1;min-width:0;padding:14px 18px}.chatBox footer div button{color:#fff;cursor:pointer;background:#b88739;border:0;border-radius:50%;place-items:center;width:48px;display:grid}.chatBox footer button:disabled{opacity:.35}.reset{color:#686b66;background:0 0;border:1px solid #d6d1c5;border-radius:7px;width:100%;margin-top:9px;padding:8px;font-size:10px;font-weight:800}.reset svg{vertical-align:middle;width:12px}.leadCard{background:#fff;border:1px solid #d9d4c8;border-radius:15px;width:340px;margin-top:65px;overflow:hidden;box-shadow:0 18px 50px #28352e10}.leadCard h3{color:#fff;letter-spacing:.7px;background:#153f35;margin:0;padding:20px;font-size:13px}.leadCard h3 small{color:#c9d9d4;letter-spacing:0;margin-top:5px;font-weight:400;display:block}.leadCard>strong{color:#26704f;letter-spacing:1px;background:#e2f1e8;align-items:center;gap:6px;padding:11px 18px;font-size:10px;display:flex}.leadCard>strong svg{width:14px}.leadCard p{border-bottom:1px solid #eeebe4;margin:0 20px;padding:10px 0}.leadCard p small,.leadCard p b{display:block}.leadCard p small{text-transform:uppercase;letter-spacing:1px;color:#92948e;font-size:9px}.leadCard p b{word-break:break-word;margin-top:3px;font-size:13px}.waiting{text-align:center;color:#7b817c;padding:60px 28px}.waiting svg{color:#b68a42}.waiting b,.waiting span{display:block}.waiting b{color:#3b413d;margin:12px 0 5px}.waiting span{font-size:12px}@media (width<=900px){.chatPage{background:#fff;padding:0}.chatBox{border:0;border-radius:0;height:100vh;min-height:620px}.leadCard{display:none}}@media (width<=480px){.chatBox>header{min-height:88px;padding:18px}.chatBox header span{display:none}.conversation{padding:18px 14px}.voiceGrid{grid-template-columns:1fr}.bubble{max-width:90%}}
