/* [novo-visual-conv] Conversas (WhatsApp IA) e Ficha do cliente no visual do mockup. So aparencia. */

/* ---------- Conversas ---------- */
html.nv1-on #pg-atendimento .ph{padding:20px 28px !important}
html.nv1-on #wa-w{height:calc(100vh - var(--header-h) - 77px);margin:0 20px 20px;border:1px solid #1E2748;border-radius:20px;overflow:hidden;background:#0C1122}
html.nv1-on #wa-lp{width:330px;background:#10162B !important;border-right:1px solid #1E2748 !important}
html.nv1-on .wa-lh{font-family:Sora,system-ui,sans-serif;font-size:16px !important;font-weight:600 !important;color:#fff !important;padding:16px 18px !important;border-bottom:1px solid #1B2346 !important}
html.nv1-on #wa-lp select{min-height:40px;border-radius:12px !important}
html.nv1-on #wa-cls{padding:6px}
html.nv1-on .wa-ci{border:1px solid transparent !important;border-radius:14px;margin:2px 0;padding:12px !important;transition:background .15s ease}
html.nv1-on .wa-ci:hover{background:#121A34 !important}
html.nv1-on .wa-ci.on{background:rgba(98,80,232,.16) !important;border-color:rgba(98,80,232,.45) !important;border-left-width:1px !important}
html.nv1-on .wa-av{width:40px !important;height:40px !important;background:#1C2547 !important;color:#DAD6FF !important;font-weight:700 !important}
html.nv1-on .wa-nm{font-size:14px !important;color:#EDF0FF !important}
html.nv1-on .wa-pv{font-size:12.5px !important;color:#AEB6DA !important}
html.nv1-on .wa-ub{width:20px !important;height:20px !important;background:#6250E8 !important;font-size:11px !important;font-weight:700}
html.nv1-on #wa-nb button{border-color:#2A3460 !important;color:#AEB6DA !important;border-radius:12px !important;min-height:40px}

html.nv1-on #wa-cp,html.nv1-on #wa-nc{background:#0C1122 !important}
html.nv1-on #wa-nc{color:#8A93BD !important}
html.nv1-on .wa-ch{background:#0E1428 !important;border-bottom:1px solid #1B2346 !important;padding:14px 18px !important;flex-wrap:wrap}
html.nv1-on .wa-ch-av{width:42px !important;height:42px !important;background:#1C2547 !important;color:#DAD6FF !important;font-weight:700 !important}
html.nv1-on .wa-ch-n{font-size:15px !important;font-weight:700 !important;color:#fff !important}
html.nv1-on .wa-ch-p{font-size:12px !important;color:#AEB6DA !important}
html.nv1-on .wa-sid{background:rgba(61,214,140,.14) !important;color:#6FE3AC !important;font-weight:600 !important;padding:5px 12px !important}

/* mensagens: cliente a esquerda, Melissa (e a equipe) a direita, como no WhatsApp do escritorio */
html.nv1-on #wa-ms{background:#090D1A !important;padding:18px !important;gap:10px !important}
html.nv1-on #ct #wa-ms .wm{border-radius:16px !important;font-size:14px !important;line-height:1.5 !important;padding:10px 14px !important;box-shadow:none !important;animation:nvc-rise .3s ease both}
html.nv1-on #ct #wa-ms .wm.usr{align-self:flex-start !important;background:#161E3A !important;border:1px solid #232D52 !important;color:#EDF0FF !important;border-radius:16px 16px 16px 4px !important}
html.nv1-on #ct #wa-ms .wm.bot{align-self:flex-end !important;background:rgba(98,80,232,.2) !important;border:1px solid rgba(98,80,232,.4) !important;color:#EDF0FF !important;border-radius:16px 16px 4px 16px !important}
html.nv1-on #ct #wa-ms .wm.hum{background:rgba(90,176,255,.14) !important;border-color:rgba(90,176,255,.4) !important}
html.nv1-on #ct #wa-ms .wm .wm-aut{color:#8CC8FF !important}
html.nv1-on #ct #wa-ms .wmt{color:#8A93BD !important}
html.nv1-on #ct #wa-ms .wa-dia-sep{background:#161E3A !important;color:#C7CDEB !important;box-shadow:none !important;border-radius:999px !important}
html.nv1-on #ct #wa-ms #wa-ty{align-self:flex-end !important;background:rgba(98,80,232,.2) !important;border:1px solid rgba(98,80,232,.4) !important;border-radius:16px 16px 4px 16px !important}
html.nv1-on .td span{background:#A99FF2 !important}
html.nv1-on #wa-ia{background:#0E1428 !important;border-top:1px solid #1B2346 !important;padding:12px 14px !important;align-items:center !important}
html.nv1-on #wa-in{min-height:44px;border-radius:14px !important;background:#0C1122 !important;border:1px solid #232D52 !important;color:#EDF0FF !important;font-size:14px !important;padding:11px 14px !important}
html.nv1-on #wa-sn{width:44px !important;height:44px !important;border-radius:12px !important;background:#6250E8 !important}
@keyframes nvc-rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---------- Ficha do cliente (janela) ---------- */
html.nv1-on #cp-modal{background:rgba(5,8,18,.75) !important;backdrop-filter:blur(2px)}
html.nv1-on #cp-modal > div{border-radius:22px !important;border-color:#2A3460 !important;box-shadow:0 24px 60px rgba(0,0,0,.6) !important}
html.nv1-on #cp-modal [style*="font-size:16px;font-weight:700"]{font-family:Sora,system-ui,sans-serif !important;font-size:20px !important}
html.nv1-on #cp-modal [style*="border-radius:10px;border:2px solid"]{border-radius:14px !important}
html.nv1-on #cp-modal a,html.nv1-on #cp-modal button{border-radius:10px !important}

/* ---------- celular ---------- */
@media (max-width:820px){
  html.nv1-on #wa-w{margin:0;border-radius:0;border:0;height:calc(100dvh - 56px - 57px)}
  html.nv1-on #wa-lp{width:100% !important}
  html.nv1-on #pg-atendimento .ph{padding:12px 14px !important}
  html.nv1-on #ct #wa-ms .wm{max-width:86% !important}
  html.nv1-on #cp-modal{padding:0 !important;align-items:stretch !important}
  html.nv1-on #cp-modal > div{width:100% !important;max-width:100% !important;height:100% !important;border-radius:0 !important}
  html.nv1-on #cp-modal [style*="grid-template-columns:260px"]{display:block !important;overflow-y:auto !important}
  html.nv1-on #cp-modal [style*="grid-template-columns:260px"] > div{border-right:0 !important;overflow:visible !important}
  html.nv1-on #cp-modal [style*="display:flex;gap:8px;padding:4px 0"]{overflow-x:auto;padding-top:12px !important}
  html.nv1-on #cp-modal [style*="display:flex;gap:8px;padding:4px 0"] > div{flex:0 0 92px !important}
  html.nv1-on #cp-modal [style*="justify-content:space-between;align-items:center;margin-bottom:14px"]{flex-wrap:wrap;gap:10px}
}
@media (prefers-reduced-motion:reduce){html.nv1-on #ct #wa-ms .wm{animation:none !important}}
