
/* Homologacao visual — celular, referência Nexus Agenda */
@media(max-width:520px){
 .page{padding:0}
 .phone{height:100dvh;display:flex;flex-direction:column;background:#eaf2ff}
 .wa-header{flex:0 0 82px;min-height:82px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:8px 10px;gap:7px;border-bottom:1px solid #d5e3f7}
 .chat-back{border:0;background:transparent;color:#061b4c;font-size:32px;padding:0 3px;line-height:1}
 .wa-header-left{display:flex;align-items:center;gap:8px;min-width:0;flex:1}
 .chat-logo-back{background:transparent;border-radius:0;padding:0;width:107px;flex:0 0 107px;overflow:hidden}
 .chat-logo-back .avatar{height:38px;width:107px;object-fit:contain;object-position:left}
 .who{min-width:0}.who strong{font-size:15px;font-weight:800;color:#0c1e47;white-space:nowrap}.who .status{font-size:10px;color:#183b6a;white-space:nowrap}
 .new-chat{background:transparent;border:0;color:#0c1f49;font-size:25px;padding:2px}
 .wa-thread{flex:1;min-height:0;overflow-y:auto;padding:16px 14px 18px;background:linear-gradient(160deg,#f4f8ff 0%,#e6f1ff 65%,#eaf3ff 100%)}
 .day-sep{display:none}
 .row.in{align-items:flex-start}.row.out{align-items:flex-end}
 .row.in .bubble{max-width:94%;font-size:15.5px;line-height:1.35;padding:12px 13px;background:#fff;border:0;box-shadow:0 2px 9px #5a7fa91a;border-radius:14px}
 .row.out .bubble{max-width:88%;font-size:15px;line-height:1.4;padding:11px 13px;background:#c8f8d3;border:0;border-radius:15px;box-shadow:0 2px 7px #5a7fa914}
 .meta{font-size:10px}.checks{color:#0b9d62}
 .quick-actions{display:flex;flex-direction:column;align-items:flex-start;gap:7px;margin-top:9px;padding:0;background:transparent;border:0;width:auto}
 .quick-actions button{width:auto;min-width:212px;max-width:100%;border-radius:999px;border:1px solid #a7caff;background:#f1f7ff;color:#0754bd;font-size:13px;font-weight:600;padding:8px 16px;text-align:left;white-space:nowrap}
 .quick-actions button span{display:inline-flex;vertical-align:middle;background:transparent;width:21px;height:21px;margin-right:6px}
 .quick-actions .nx-icon{width:19px;height:19px}
 .availability-row{width:100%;display:block}
 .availability{display:block!important;background:transparent;border:0;max-height:none;overflow:visible;padding:5px 0 9px;width:100%}
 .availability[hidden]{display:none!important}
 .availability h3{font-size:14px;font-weight:500;color:#10284d;background:#fff;border-radius:12px;padding:10px 12px;margin:12px 0 7px;box-shadow:0 2px 7px #6589b219}
 .date-chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;overflow:visible;padding:0}
 .date-chips button{min-width:0;border-radius:13px;border:1px solid #b5d1f9;background:#fff;color:#14295b;padding:8px 3px;box-shadow:0 2px 6px #6b9bd21a}
 .date-chips button.active{background:#0867ff;border-color:#0867ff;color:#fff;box-shadow:0 4px 12px #0867ff45}
 .date-chips small{font-size:12px;font-weight:600}
 .date-chips strong{font-size:12px;font-weight:700}
 .time-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
 .time-grid button{border:1px solid #b4cdf6;background:#fff;color:#09264c;border-radius:999px;padding:10px 5px;font-size:14px;font-weight:650}
 .time-grid button.active{background:#0867ff;color:#fff;border-color:#0867ff}
 .wa-composer{flex:0 0 65px;background:#f5f8ff;border-top:1px solid #d2e2fa;gap:8px;padding:8px 11px}
 .composer-plus{font-size:29px;line-height:1;background:transparent;border:0;color:#0867ff;padding:3px}
 .wa-composer input{font-size:14px;padding:12px 14px;border:1px solid #d2e3fa;border-radius:999px;background:#fff;min-width:0}
 .send{width:43px;height:43px;flex:0 0 43px;border-radius:50%;background:#0867ff}
 .send .nx-icon{width:22px;height:22px}
 .brand-foot{display:none}
}
@media(max-width:520px){.chat-logo-back{width:49px;flex-basis:49px;overflow:hidden}.chat-logo-back .avatar{width:168px;max-width:none;height:43px;object-fit:contain;object-position:left}.who strong{font-size:16px}}
@media(max-width:520px){.date-chips small,.date-chips strong{text-transform:none}.new-chat{font-size:28px;line-height:1}}
@media(max-width:520px){.wa-thread .bubble{max-width:85%;font-size:16px}.wa-thread .row.in .bubble,.wa-thread .row.out .bubble{font-size:16px}.date-chips{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin}.date-chips button{flex:0 0 calc((100% - 18px)/4);scroll-snap-align:start}.wa-composer{flex:0 0 auto;min-height:58px;padding-bottom:max(7px,env(safe-area-inset-bottom))}.wa-composer input{font-size:16px}.send{height:44px;width:44px;flex-basis:44px}.phone{height:100dvh;height:100svh;height:100dvh}}

/* Correção definitiva: conteúdo do chat idêntico em qualquer largura.
   Somente a moldura externa muda entre desktop e celular. */
.brand-top,.brand-foot{display:none!important}
.page{min-height:100dvh;align-items:center;justify-content:center;padding:12px}
.phone{width:100%;max-width:420px;min-height:0;height:min(820px,calc(100dvh - 24px));border-radius:18px;box-shadow:0 15px 45px #00132e55;overflow:hidden;background:#eaf2ff}
.wa-header{background:#fff!important;color:#102448!important;display:flex;align-items:center;gap:9px;min-height:76px;padding:10px 12px;border-bottom:1px solid #d6e3f7}
.chat-back{appearance:none;border:0!important;background:transparent!important;box-shadow:none!important;color:#12325c!important;font-size:32px;min-width:44px;min-height:44px;display:grid;place-items:center;padding:0;cursor:pointer}
.wa-header-left{display:flex;align-items:center;gap:9px;flex:1;min-width:0}
.chat-logo-back{width:43px;flex:0 0 43px;height:43px;padding:0;border:0;border-radius:0;background:transparent!important;overflow:visible}
.chat-logo-back .avatar{display:block;width:43px;height:43px;padding:0!important;border:0;border-radius:0;background:transparent!important;object-fit:contain}
.who strong{display:block;font-size:16px;font-weight:800;color:#102448}
.who .status{display:block;font-size:11px;color:#4a6384;opacity:1}
.new-chat{appearance:none;border:0;background:transparent;color:#12325c;font-size:27px;min-width:40px;min-height:44px;box-shadow:none}
.wa-thread{background:linear-gradient(155deg,#f7faff 0%,#e7f1ff 64%,#dcecff 100%)!important;flex:1;min-height:0;padding:16px 14px 20px;overflow-y:auto}
.day-sep{margin:0 0 12px;text-align:center}
.day-sep span{font-size:10px;letter-spacing:.03em;background:#f4f8fe;color:#7287a1;box-shadow:none}
.row.in{display:flex;flex-direction:column;align-items:flex-start;gap:0;width:100%}
.row.out{display:flex;justify-content:flex-end;width:100%}
.row.in .bubble,.row.out .bubble{font-size:16px;line-height:1.42;max-width:85%;border-radius:14px;padding:12px 13px;white-space:pre-wrap;overflow-wrap:anywhere}
.row.in .bubble{background:#fff;border:1px solid #e4edf9;box-shadow:0 2px 10px #2e6bb512}
.row.out .bubble{background:#cff4d8;border:1px solid #b8eac7}
.quick-actions{display:flex!important;flex-direction:column!important;grid-template-columns:none!important;align-items:flex-start;gap:8px;margin:9px 0 0 0;padding:0!important;background:transparent!important;border:0!important;width:100%}
.quick-actions button{display:inline-flex;align-items:center;justify-content:flex-start;width:72%;min-width:212px;max-width:100%;min-height:40px;border-radius:999px!important;border:1px solid #b4d0f7;background:#f3f8ff!important;color:#0756bd;font-size:13px;font-weight:650;padding:9px 14px;text-align:left;white-space:nowrap;box-shadow:none}
.quick-actions button span{display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px;width:20px;height:20px;margin-right:8px;background:transparent!important;border-radius:0}
.quick-actions .nx-icon{width:19px;height:19px}
.wa-composer{display:flex;align-items:center;gap:8px;background:#f7faff;min-height:60px;padding:7px 11px max(7px,env(safe-area-inset-bottom));border-top:1px solid #d5e5f9}
.composer-plus{appearance:none;display:grid;place-items:center;width:44px;min-width:44px;height:44px;border:0!important;background:transparent!important;color:#0865f5!important;font-size:30px;line-height:1;box-shadow:none!important}
.wa-composer input{min-width:0;flex:1;font-size:16px;border:1px solid #d4e4fa;border-radius:999px;padding:11px 13px;background:#fff}
.send{display:grid;place-items:center;width:44px;height:44px;min-width:44px;border:0;border-radius:50%;background:#0865f5!important;color:#fff!important}
.send .nx-icon{display:block;width:22px;height:22px;stroke:#fff;stroke-width:2}
@media(max-width:480px){
 html,body{width:100%;height:100%;overflow:hidden;background:#eaf2ff}
 .page{padding:0;width:100%;height:100dvh;min-height:0}
 .phone{max-width:none;width:100%;height:100dvh;min-height:0;border:0;border-radius:0;box-shadow:none}
 .wa-header{min-height:75px;flex:0 0 75px}
 .wa-thread{padding:16px 14px 18px}
 .wa-composer{min-height:60px}
}

/* Correção final: texto multilinha e faixa sem fundo cinza. */
.row.in .bubble{white-space:pre-line!important}
.quick-actions button{width:75%!important;font-size:15px!important;min-height:43px!important}
.wa-thread{background:linear-gradient(160deg,#f7faff 0%,#e7f1ff 60%,#e1efff 100%)!important}
.wa-composer{background:#e1efff!important;border-top:0!important}
.chips[hidden],.availability[hidden]{display:none!important}
