@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#25352f;background:#f6f8f7;font-size:14px}*{box-sizing:border-box}body{margin:0;display:flex;min-height:100vh}button,input{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}aside{width:248px;background:#fff;border-right:1px solid #e5ebe8;padding:30px 20px;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0}.brand{font:800 23px Manrope,sans-serif;color:#193c30;text-decoration:none;position:relative;padding-left:49px;line-height:28px}.logo{position:absolute;left:0;background:#177b58;color:white;border-radius:12px;padding:6px 10px;font-size:27px}.brand span{display:block;font:600 8px 'DM Sans',sans-serif;letter-spacing:1.8px}.workspace{display:flex;align-items:center;gap:13px;background:#f4f7f5;padding:14px;border-radius:10px;margin:36px 0 27px;color:#177b58}.workspace strong,.profile strong{color:#25352f;font-size:12px}small{display:block;font-size:10px;color:#839089;margin-top:5px;font-weight:400}.caption,.eyebrow{font-size:10px;letter-spacing:1.5px;color:#8a9690;font-weight:700}nav{display:grid;gap:7px}nav button{border:0;text-align:left;border-radius:8px;padding:13px;color:#6d7b74;background:none}nav button.active{background:#eaf5ef;color:#177b58;font-weight:700}em{float:right;background:#177b58;color:white;padding:1px 7px;border-radius:5px;font-style:normal;font-size:11px}.aside-bottom{margin-top:auto}.demo{border:1px solid #e2eae5;padding:13px;border-radius:9px;font-size:11px;color:#5b7767}.profile{display:flex;gap:12px;align-items:center;margin-top:22px}main{margin-left:248px;width:calc(100% - 248px);padding:33px 36px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}h1{font:800 28px Manrope,sans-serif;margin:7px 0}h2{font:800 22px Manrope,sans-serif}h3{font:700 16px Manrope,sans-serif}.header-right{display:flex;align-items:center;gap:22px}.pill{font-size:11px;color:#177b58;background:#e9f4ed;border-radius:20px;padding:8px 12px}.avatar{background:#e8eee9;border-radius:50%;padding:12px;font-size:11px;font-weight:700}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:25px}.metric,.card{background:white;border:1px solid #e2e9e5;border-radius:12px;padding:22px}.metric span{color:#829087;font-size:12px}.metric b{display:block;font:800 28px Manrope,sans-serif;margin:10px 0}.metric small{color:#177b58}.inbox{display:grid;grid-template-columns:310px 1fr;border:1px solid #e2e9e5;background:white;border-radius:12px;overflow:hidden;height:590px}.threads{border-right:1px solid #e2e9e5;overflow:auto}.search{padding:18px;border-bottom:1px solid #edf0ee}.search input{width:100%;border:1px solid #e2e9e5;padding:11px;border-radius:8px;background:#f9fbfa;outline-color:#177b58}.filters{display:flex;gap:8px;margin-top:14px}.filters button{border:0;background:#f0f4f1;padding:6px 9px;border-radius:5px;font-size:10px}.thread{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid #edf0ee;padding:20px;background:white}.thread.selected{background:#eff7f2;border-left:3px solid #177b58;padding-left:17px}.thread-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.thread-top strong{font-size:12px}.thread-top small{font-size:9px}.thread p{color:#859087;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.channel{font-size:9px;padding:4px 7px;background:#f1eefb;color:#8652a2;border-radius:4px}.channel.whatsapp{background:#e6f5ec;color:#288558}.conversation{display:flex;flex-direction:column;min-width:0}.conversation-head{padding:20px 25px;border-bottom:1px solid #edf0ee;display:flex;justify-content:space-between;align-items:center}.conversation-head strong{font-size:14px}.secondary,.primary{border:1px solid #dce6df;background:white;border-radius:7px;padding:10px 15px;color:#4e6759}.primary{background:#177b58;color:white;border-color:#177b58}.messages{flex:1;padding:24px;overflow:auto;background:#fcfdfc}.date{text-align:center;color:#94a097;font-size:10px;margin-bottom:24px}.bubble{max-width:80%;width:fit-content;padding:13px 17px;border:1px solid #e4eae6;border-radius:0 12px 12px;background:white;line-height:1.7;font-size:12px;margin-bottom:16px}.bubble.out{margin-left:auto;background:#e7f3eb;border-color:#e7f3eb;border-radius:12px 0 12px 12px}.bubble small{text-align:right;font-size:9px}.composer{padding:18px 22px;border-top:1px solid #e2e9e5;display:flex;gap:10px}.composer input{flex:1;min-width:0;border:0;outline:none;font-size:12px}.notice{background:#eef5f0;color:#577461;padding:14px 18px;border-radius:8px;font-size:12px;margin-bottom:22px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card p{color:#7f8c84;font-size:12px;line-height:1.8}.card.featured{border:2px solid #177b58}.price{font:800 32px Manrope,sans-serif;margin:25px 0}.price span{font:400 12px 'DM Sans',sans-serif;color:#89948d}.card button{width:100%;margin-top:20px}.tag{font-size:10px;color:#177b58;font-weight:700}.table{width:100%;border-collapse:collapse;background:white}.table th,.table td{text-align:left;padding:19px;border-bottom:1px solid #edf0ee;font-size:12px}.table th{color:#839087;font-weight:500}.empty{padding:30px;color:#829087}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#193c30;color:white;padding:14px 20px;border-radius:9px;display:none;z-index:10}.subscription-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.muted{color:#839087;font-size:12px}@media(max-width:1050px){aside{width:205px;padding:25px 14px}main{margin-left:205px;width:calc(100% - 205px);padding:25px 20px}.inbox{grid-template-columns:250px 1fr}.metrics{gap:10px}.metric{padding:16px}}@media(max-width:760px){aside{position:static;width:100%;padding:18px}.workspace,.caption,.aside-bottom{display:none}nav{display:flex;overflow:auto;margin-top:20px}nav button{white-space:nowrap;font-size:11px}body{display:block}main{margin:0;width:100%;padding:20px}.metrics{grid-template-columns:repeat(2,1fr)}.inbox{grid-template-columns:1fr;height:auto}.threads{max-height:240px;border-bottom:1px solid #e2e9e5}.conversation{min-height:440px}.grid{grid-template-columns:1fr}.header-right .pill{display:none}.table-wrap{overflow:auto}.subscription-top{align-items:flex-start;gap:15px}}
