/* WhatsApp-style chat + mobile app feel (loaded after app.css) */
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}
body{overscroll-behavior-y:none}
button,[data-a],[data-t],.row2,.hc,.site{touch-action:manipulation}
:root{--wa-bg:#0b141a;--wa-in:#202c33;--wa-out:#005c4b;--wa-bar:#1f2c34;--wa-tx:#e9edef;--wa-mu:#8696a0;--wa-tick:#53bdeb}
html[data-th=light]{--wa-bg:#efeae2;--wa-in:#fff;--wa-out:#d9fdd3;--wa-bar:#f0f2f5;--wa-tx:#111b21;--wa-mu:#667781}
.chv .msgs,.cv .msgs{background-color:var(--wa-bg);background-image:radial-gradient(#ffffff0a 1.2px,transparent 1.4px),radial-gradient(#ffffff08 1px,transparent 1.2px);background-size:26px 26px,41px 41px;background-position:0 0,13px 17px;gap:3px;padding:10px 10px 14px;scroll-behavior:smooth}
html[data-th=light] .chv .msgs,html[data-th=light] .cv .msgs{background-image:radial-gradient(#0000000c 1.2px,transparent 1.4px),radial-gradient(#0000000a 1px,transparent 1.2px)}
.chv .m,.cv .m{background:var(--wa-in);color:var(--wa-tx);border-radius:10px 10px 10px 2px;padding:6px 10px 18px;min-width:76px;max-width:84%;font-size:15px;line-height:1.35;box-shadow:0 1px .5px #0000002e;position:relative;margin-top:2px;word-break:break-word;white-space:pre-wrap}
.chv .m.me,.cv .m.me{background:var(--wa-out);color:var(--wa-tx);border-radius:10px 10px 2px 10px}
.chv .m:not(.sys):not(.ig):not(.me):before,.cv .m:not(.sys):not(.ig):not(.me):before{content:"";position:absolute;bottom:0;left:-7px;border-style:solid;border-width:0 8px 8px 0;border-color:transparent var(--wa-in) transparent transparent}
.chv .m.me:before,.cv .m.me:before{content:"";position:absolute;bottom:0;right:-7px;border-style:solid;border-width:0 0 8px 8px;border-color:transparent transparent transparent var(--wa-out)}
.chv .m.sys,.cv .m.sys{align-self:center;background:#182229cc;color:var(--wa-mu);font-size:12.5px;padding:5px 12px;text-align:center;box-shadow:none;border-radius:8px;min-width:0;max-width:92%}
html[data-th=light] .chv .m.sys,html[data-th=light] .cv .m.sys{background:#ffffffcc}
.m .tmx{position:absolute;right:8px;bottom:3px;font-size:11px;color:var(--wa-mu);display:flex;gap:3px;align-items:center;opacity:1}
.m.me .tmx{color:#ffffffa6}html[data-th=light] .m.me .tmx{color:#667781}
.tk{font-style:normal;letter-spacing:-3px;font-size:12px}.tk.rd{color:var(--wa-tick)}
.m .by{display:block;font:600 12px system-ui;color:#06cf9c;margin-bottom:1px}
.m img{max-width:min(240px,100%);border-radius:8px;margin:2px 0 4px}
.dsep{align-self:center;background:#182229cc;color:var(--wa-mu);font-size:12px;padding:4px 12px;border-radius:8px;margin:8px 0 6px;box-shadow:0 1px .5px #0000002e}
html[data-th=light] .dsep{background:#ffffffe6}
.m.ig{align-self:center;background:#ffffff0d;color:var(--wa-mu);font-size:12.5px;padding:5px 12px;min-width:0;border-radius:8px;cursor:pointer;box-shadow:none}.m.ig u{color:var(--ac)}
.m.igd{opacity:.55;outline:1px dashed #ff6b6b66}
.m[data-mid]{cursor:pointer}
/* header + composer */
.chh,.cvh{background:var(--wa-bar);color:var(--wa-tx)}
.chh .chn small,.cvh .cvt small{color:var(--wa-mu)}
.cmp,.cvf,.qr{background:var(--wa-bar);border-top:0}
.cmp input,.cvf input{background:var(--wa-in);color:var(--wa-tx);border:0;padding:11px 16px}
.cmp input::placeholder,.cvf input::placeholder{color:var(--wa-mu)}
.snd,.cvf .btn{background:#00a884;color:#fff;width:46px;height:46px;border-radius:50%;padding:0;justify-content:center;font-size:18px;flex:none}
.cvf{align-items:center}
.qk button{border-color:#00a884;color:#00a884;background:var(--wa-bar)}
.qr .btn.g{background:var(--wa-in);color:var(--wa-tx)}
/* customer chat = full screen on phones */
body.inchat header,body.inchat nav,body.inchat .fh,body.inchat footer,body.inchat #ib{display:none!important}
body.inchat{padding-bottom:0;overflow:hidden}
body.inchat main{padding:0;max-width:none}
body.inchat .chv{position:fixed;inset:0;height:100dvh;max-width:none;min-height:0;border:0;border-radius:0;z-index:50;padding-top:env(safe-area-inset-top);background:var(--wa-bg)}
body.inchat .chh{padding-top:calc(8px)}
body.inchat .cmp{padding-bottom:calc(8px + env(safe-area-inset-bottom))}
@media(min-width:900px){body.inchat header,body.inchat nav{display:flex!important}body.inchat nav{display:flex!important}body.inchat{overflow:auto}body.inchat main{padding:14px 18px;max-width:1000px}
 body.inchat .chv{position:static;height:calc(100dvh - 190px);min-height:440px;max-width:720px;border:1px solid #ffffff14;border-radius:22px;padding-top:0}}
/* message action sheet (desk) */
#msheet{position:fixed;inset:0;z-index:80;background:#0008;display:flex;align-items:flex-end;justify-content:center}
#msheet>div{width:min(460px,100%);background:var(--wa-bar);border-radius:18px 18px 0 0;padding:14px 14px calc(14px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px}
#msheet .pv{background:var(--wa-in);color:var(--wa-tx);border-radius:10px;padding:8px 12px;max-height:90px;overflow:hidden;font-size:14px;white-space:pre-wrap}
#msheet .btn{justify-content:center;background:var(--wa-in);color:var(--wa-tx)}#msheet .btn.red{background:#ff6b6b;color:#fff}
.sp{display:inline-block;font:700 10px system-ui;background:#ff6b6b;color:#fff;border-radius:99px;padding:1px 7px;margin-left:5px}
.row2.spam{opacity:.75}