:root{font-family:Inter,system-ui,Arial,sans-serif;color:#1c2930;background:#f3f6f7}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{border:0;border-radius:9px;background:#0c8067;color:white;padding:11px 15px;cursor:pointer}button.secondary{background:#e8f1ee;color:#23604f}button.ghost{background:transparent;color:#475b63}input,textarea{width:100%;padding:12px;border:1px solid #d5dedf;border-radius:9px;background:white}textarea{min-height:80px;resize:vertical}h1,h2,h3,p{margin:0}.login{max-width:430px;margin:10vh auto;padding:30px;background:white;border-radius:18px;box-shadow:0 8px 35px #142c3015}.login h1{margin-bottom:8px}.login p{color:#718089;margin-bottom:25px}.stack{display:grid;gap:12px}.error{color:#b42318;font-size:13px}.shell{height:100vh;display:flex;flex-direction:column}.top{background:#fff;border-bottom:1px solid #e1e7e8;padding:15px 22px;display:flex;justify-content:space-between;align-items:center}.top small,.muted{color:#718089}.layout{display:grid;grid-template-columns:320px minmax(0,1fr);min-height:0;flex:1}.sidebar{background:white;border-right:1px solid #e1e7e8;display:flex;flex-direction:column;min-height:0}.sidebarhead{padding:16px;border-bottom:1px solid #e9eeee;display:grid;gap:12px}.sidebarhead>div{display:flex;justify-content:space-between;align-items:center}.customers{overflow:auto;flex:1}.customer{display:block;width:100%;text-align:left;background:white;color:#23343b;border-radius:0;padding:15px;border-bottom:1px solid #edf0f0}.customer:hover,.customer.active{background:#eaf6f2}.customer strong{display:block}.customer small{color:#718089}.pill{float:right;background:#0c8067;color:white;border-radius:99px;padding:1px 7px;font-size:12px}.main{display:flex;flex-direction:column;min-height:0}.chathead{padding:18px 24px;background:#fff;border-bottom:1px solid #e1e7e8;display:flex;justify-content:space-between;align-items:center}.chathead small{display:block;color:#718089}.messages{flex:1;overflow:auto;padding:24px;display:flex;flex-direction:column;gap:12px}.bubble{padding:12px 15px;border-radius:14px;max-width:min(70%,500px);background:white;box-shadow:0 1px 3px #0001;align-self:flex-start;white-space:pre-wrap;overflow-wrap:anywhere}.bubble.out{background:#d8f6e7;align-self:flex-end}.bubble small{display:block;color:#718089;font-size:11px;margin-top:6px}.composer{background:white;border-top:1px solid #e1e7e8;padding:15px 22px;display:flex;gap:10px}.composer input{flex:1}.empty{margin:auto;color:#7a8a8f;text-align:center;padding:30px}.modalbg{position:fixed;inset:0;background:#102b3566;display:flex;justify-content:center;align-items:center;padding:15px}.modal{background:white;width:min(450px,100%);padding:25px;border-radius:16px;display:grid;gap:13px}.modal .actions{display:flex;justify-content:flex-end;gap:8px}.hint{font-size:12px;color:#728187}.warning{background:#fff8e7;color:#86620b;padding:8px 14px;font-size:12px;text-align:center}@media(max-width:650px){.layout{grid-template-columns:145px minmax(0,1fr)}.sidebarhead{padding:10px}.customer{padding:10px}.top{padding:10px}.chathead{padding:10px}.messages{padding:10px}.composer{padding:10px}.bubble{max-width:95%}button{padding:9px}}

/* WhatsApp-inspired visual refresh */
:root{font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:#eae6df;color:#152b2a}body{background:#eae6df}.shell{height:100dvh;max-width:1700px;margin:auto;background:#f0f2f5}.top{background:#f0f2f5;padding:10px 20px;min-height:61px}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px}.brandicon{display:grid;place-items:center;background:#00a884;color:white;width:35px;height:35px;border-radius:12px}.topactions{display:flex;align-items:center;gap:8px}.signedin{color:#647574;font-size:12px;margin-right:6px}.warning{background:#fff4d9;color:#805b11}.layout{grid-template-columns:370px minmax(0,1fr)}.sidebar{border-right:1px solid #dce2e3}.sidebarhead{padding:17px 15px;gap:14px}.sidebarheading{display:flex;align-items:center;justify-content:space-between}.sidebarheading h2{font-size:22px}.newchat{border-radius:9px;background:#00a884;font-size:13px;padding:9px 12px}.chatsearch{background:#f0f2f5;border:none;border-radius:9px;padding:11px 13px}.filters{display:flex;gap:7px}.filterchip{background:#f0f2f5;color:#536562;padding:7px 13px;border-radius:30px;font-size:12px}.filterchip.active{background:#d9f5e9;color:#067a5d}.customer{display:flex;align-items:center;gap:12px;min-height:75px;padding:12px 14px;border-bottom:1px solid #f0f2f5}.customer.active,.customer:hover{background:#f0f2f5}.avatar{width:44px;height:44px;min-width:44px;display:grid;place-items:center;border-radius:50%;background:#d9e7e2;color:#407367;font-weight:700;font-size:19px}.customerinfo{flex:1;min-width:0}.customername{display:flex;justify-content:space-between}.customer strong{font-size:15px;font-weight:600}.preview{color:#667781;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:5px}.pill{float:none;flex-shrink:0;background:#25d366}.main{background-color:#efeae2;background-image:radial-gradient(#d8d3cb66 .7px,transparent .7px);background-size:19px 19px}.chathead{min-height:68px;background:#f0f2f5;padding:10px 20px;gap:12px}.chatinfo{flex:1}.chatinfo h3{font-size:15px}.chathead small{font-size:12px}.chathead .editbtn{font-size:12px}.messages{padding:24px 7%;gap:7px}.bubble{max-width:min(72%,560px);border-radius:9px;padding:9px 11px;font-size:14px;box-shadow:0 1px 1px #0002}.bubble.out{background:#d9fdd3}.bubble small{text-align:right;color:#73847f}.composerarea{position:relative;background:#f0f2f5;padding:7px 13px}.chattoolbar{display:flex;align-items:center;gap:6px;padding:2px 0 6px}.toolbtn{background:transparent;color:#526866;padding:6px 10px;font-size:14px}.toolbtn:first-child{font-size:23px}.toolbtn:hover{background:#e0e7e6}.toolhint{margin-left:auto;color:#85928f;font-size:11px}.composer{background:transparent;border:0;padding:0;align-items:end;gap:8px}.messageinput{min-height:43px;max-height:120px;resize:vertical;flex:1;border:0;border-radius:9px;padding:11px 14px;font-size:14px}.sendbtn{border-radius:50%;width:43px;height:43px;padding:0;font-size:19px;background:#00a884}.simulatebtn{white-space:nowrap;font-size:12px;min-height:43px}.picker,.shortcutpanel{position:absolute;bottom:105px;left:12px;z-index:3;background:white;border-radius:13px;box-shadow:0 5px 30px #0003;padding:12px;max-width:min(340px,calc(100% - 24px))}.picker[hidden],.shortcutpanel[hidden]{display:none}.picker{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.emojibtn{background:transparent;color:#223;font-size:23px;padding:6px}.shortcutpanel{display:grid;gap:4px;min-width:300px}.shortcutitem{background:#fff;color:#253a36;text-align:left;padding:10px;border-radius:6px;font-size:12px}.shortcutitem:hover{background:#edf6f2}.welcome{margin:auto;display:grid;justify-items:center;gap:12px;text-align:center;color:#546761;padding:30px}.welcomeicon{font-size:70px}.welcome h2{font-size:23px;color:#283b38}.welcome p{max-width:400px;font-size:14px}.welcome small{color:#84928e}.backbtn{display:none}
@media(max-width:700px){.top{padding:8px 12px;min-height:53px}.brand{font-size:15px}.brandicon{width:28px;height:28px}.signedin{display:none}.topactions button{padding:8px;font-size:12px}.layout{display:block;position:relative}.sidebar{width:100%;height:100%}.main{display:none}.layout.haschat .sidebar{display:none}.layout.haschat .main{display:flex;height:100%}.backbtn{display:block;background:transparent;color:#526866;font-size:29px;padding:2px 8px}.chathead{padding:8px;gap:8px}.chathead .avatar{width:36px;height:36px;min-width:36px}.messages{padding:13px}.bubble{max-width:88%}.toolhint{display:none}.simulatebtn{font-size:11px;padding:8px}.messageinput{min-width:0}.welcome{min-height:60vh}.warning{font-size:10px}.composerarea{padding:6px}}

.attachmentlink{display:block;color:inherit;text-decoration:underline;overflow-wrap:anywhere;padding:8px 0;font-weight:600}.attachmentlink:hover{opacity:.75}


.top{flex-wrap:wrap;gap:8px}.topactions{flex-wrap:wrap}.modal{max-height:90dvh;overflow:auto}select{font:inherit;padding:10px;border:1px solid #d5dedf;border-radius:9px;max-width:100%}@media(max-width:700px){.topactions{width:100%;justify-content:flex-end}.chatinfo{min-width:0}.chatinfo h3{overflow-wrap:anywhere}}


.push-indicator{font-size:11px;border-radius:20px;padding:4px 8px;background:#fff0cf;color:#8a5700}.push-indicator.ready{background:#d9f5e9;color:#075e54}.notification-detail{font-size:13px;overflow-wrap:anywhere}.device-list{display:grid;gap:10px}.device-row{border:1px solid #dce2e3;border-radius:8px;padding:10px;display:grid;gap:6px;font-size:13px}

.staff-settings{height:100dvh;overflow:auto;background:#f0f2f5}.staff-content{max-width:900px;margin:auto;padding:20px}.staff-card{background:white;border-radius:10px;padding:16px;margin:16px 0;display:flex;gap:12px;flex-wrap:wrap;align-items:center}.staff-card h3{width:100%;margin:0}.staff-card input[type=email]{min-width:200px;max-width:100%;flex:1}.staff-card label{display:flex;gap:8px;align-items:center}.staff-card input[type=checkbox]{width:auto}

.live-indicator{font-size:12px;color:#075e54;padding:4px 8px;background:#dcf8c6;border-radius:12px;white-space:nowrap}