/* WhatsApp / YCloud — UI isolada para tema claro e escuro */
.whatsapp-view{
  --wa-bg:#08131f;
  --wa-panel:#0f1d2b;
  --wa-panel-2:#132334;
  --wa-panel-soft:#17293b;
  --wa-border:#26394b;
  --wa-border-soft:#1d3042;
  --wa-text:#e8eef5;
  --wa-muted:#93a4b6;
  --wa-green:#20b86a;
  --wa-green-strong:#159757;
  --wa-green-soft:rgba(32,184,106,.13);
  --wa-blue:#4f8cff;
  --wa-blue-soft:rgba(79,140,255,.12);
  --wa-red:#fb7185;
  --wa-red-soft:rgba(251,113,133,.12);
  --wa-shadow:0 22px 60px rgba(0,0,0,.24);
  min-width:0;
}
html[data-theme="light"] .whatsapp-view{
  --wa-bg:#f3f7fb;
  --wa-panel:#ffffff;
  --wa-panel-2:#f8fafc;
  --wa-panel-soft:#eef4f8;
  --wa-border:#d7e1ea;
  --wa-border-soft:#e5ebf1;
  --wa-text:#172033;
  --wa-muted:#66778a;
  --wa-green:#13a363;
  --wa-green-strong:#0b8850;
  --wa-green-soft:#e8f8f0;
  --wa-blue:#2f7de1;
  --wa-blue-soft:#eaf2ff;
  --wa-red:#dc3545;
  --wa-red-soft:#fdecef;
  --wa-shadow:0 18px 45px rgba(15,23,42,.08);
}

.whatsapp-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px}
.whatsapp-header h1{margin:0 0 5px!important;color:var(--wa-text)!important}
.whatsapp-header p{margin:0;color:var(--wa-muted)!important}
.whatsapp-actions{display:flex;gap:8px;align-items:center}
.whatsapp-actions .btn{border-color:var(--wa-border)!important;background:var(--wa-panel)!important;color:var(--wa-text)!important}

.whatsapp-config{
  margin:0 0 14px;padding:11px 14px;border:1px solid #b9791f;
  background:rgba(185,121,31,.12);color:#f1bd68;border-radius:12px;
  font-size:11px;font-weight:700;line-height:1.45
}
.whatsapp-config.ok{border-color:rgba(32,184,106,.38);background:var(--wa-green-soft);color:#62d69b}
html[data-theme="light"] .whatsapp-config.ok{color:#176b42}

.whatsapp-shell{
  display:grid;grid-template-columns:330px minmax(0,1fr);
  height:min(735px,calc(100vh - 200px));min-height:590px;
  background:var(--wa-panel);border:1px solid var(--wa-border);
  border-radius:18px;overflow:hidden;box-shadow:var(--wa-shadow)
}
.whatsapp-sidebar{
  display:flex;flex-direction:column;min-width:0;
  border-right:1px solid var(--wa-border);background:var(--wa-panel)
}
.whatsapp-toolbar{
  padding:14px;border-bottom:1px solid var(--wa-border);
  display:grid;gap:11px;background:var(--wa-panel)
}
.whatsapp-search{position:relative;display:block}
.whatsapp-search i,.whatsapp-search svg{
  position:absolute;left:12px;top:50%;transform:translateY(-50%);
  width:16px;height:16px;color:var(--wa-muted);z-index:2
}
.whatsapp-search input{
  width:100%;height:42px;padding:0 12px 0 38px!important;
  border:1px solid var(--wa-border)!important;border-radius:11px!important;
  background:var(--wa-panel-2)!important;color:var(--wa-text)!important;
  outline:none!important;box-shadow:none!important;font-size:12px
}
.whatsapp-search input::placeholder{color:var(--wa-muted)!important}
.whatsapp-search input:focus{border-color:var(--wa-blue)!important;box-shadow:0 0 0 3px var(--wa-blue-soft)!important}

.whatsapp-filter-row{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none}
.whatsapp-filter-row::-webkit-scrollbar{display:none}
.whatsapp-filter{
  border:1px solid transparent;background:transparent;color:var(--wa-muted);
  border-radius:9px;padding:7px 9px;font-size:10px;font-weight:750;
  white-space:nowrap;cursor:pointer;transition:.16s ease
}
.whatsapp-filter:hover{background:var(--wa-panel-soft);color:var(--wa-text)}
.whatsapp-filter.active{background:var(--wa-blue-soft);color:var(--wa-blue);border-color:rgba(79,140,255,.25)}

.whatsapp-conversation-list{overflow:auto;min-height:0;flex:1;background:var(--wa-panel)}
.whatsapp-conversation{
  width:100%;border:0;border-bottom:1px solid var(--wa-border-soft);
  background:transparent;padding:13px 14px;text-align:left;
  display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:10px;
  cursor:pointer;color:var(--wa-text);transition:.16s ease;position:relative
}
.whatsapp-conversation:hover{background:var(--wa-panel-2)}
.whatsapp-conversation.active{background:var(--wa-blue-soft)}
.whatsapp-conversation.active::before{
  content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;
  border-radius:0 3px 3px 0;background:var(--wa-blue)
}
.whatsapp-avatar{
  width:42px;height:42px;border-radius:12px;
  background:var(--wa-green-soft);color:#35c77b;
  display:grid;place-items:center;font-weight:850;font-size:14px;
  border:1px solid rgba(32,184,106,.18)
}
html[data-theme="light"] .whatsapp-avatar{color:#0e8c53}
.whatsapp-conversation-main{min-width:0}
.whatsapp-conversation-top{display:flex;gap:8px;align-items:center}
.whatsapp-conversation-top strong{
  font-size:12px;color:var(--wa-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.whatsapp-conversation-main p{
  margin:5px 0 0;color:var(--wa-muted);font-size:10px;line-height:1.35;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.whatsapp-conversation-meta{
  display:grid;justify-items:end;align-content:start;gap:7px;
  color:var(--wa-muted);font-size:9px
}
.whatsapp-unread{
  min-width:20px;height:20px;padding:0 6px;border-radius:999px;
  background:var(--wa-green);color:#fff;display:grid;place-items:center;
  font-size:9px;font-weight:850
}

.whatsapp-chat{min-width:0;display:flex;flex-direction:column;background:var(--wa-bg);color:var(--wa-text)}
.whatsapp-chat-stage{display:flex;flex-direction:column;min-height:0;flex:1;height:100%}
.whatsapp-empty{
  margin:auto;text-align:center;color:var(--wa-muted);max-width:360px;padding:30px
}
.whatsapp-empty h3{color:var(--wa-text)!important;margin:8px 0 4px;font-size:18px}
.whatsapp-empty p{margin:0;line-height:1.55}
.whatsapp-empty i,.whatsapp-empty svg{width:42px;height:42px;margin-bottom:10px;color:var(--wa-green)}

.whatsapp-chat-head{
  min-height:72px;padding:12px 16px;border-bottom:1px solid var(--wa-border);
  background:var(--wa-panel);display:flex;justify-content:space-between;
  gap:14px;align-items:center
}
.whatsapp-chat-person{min-width:145px}
.whatsapp-chat-person strong{
  display:block;font-size:14px;color:var(--wa-text);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis
}
.whatsapp-chat-person span{display:block;color:var(--wa-muted);font-size:10px;margin-top:4px}
.whatsapp-chat-controls{display:flex;gap:7px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.whatsapp-chat-controls select,
.whatsapp-chat-controls button{
  height:36px;border:1px solid var(--wa-border)!important;border-radius:9px!important;
  background:var(--wa-panel-2)!important;color:var(--wa-text)!important;
  padding:0 10px;font-size:10px;font-weight:700;box-shadow:none!important
}
.whatsapp-chat-controls select{padding-right:28px}
.whatsapp-chat-controls button{cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.whatsapp-chat-controls button:hover{border-color:var(--wa-blue)!important;background:var(--wa-blue-soft)!important}
.whatsapp-chat-controls .whatsapp-ticket-btn{
  background:var(--wa-blue-soft)!important;color:#7db0ff!important;border-color:rgba(79,140,255,.3)!important
}
html[data-theme="light"] .whatsapp-chat-controls .whatsapp-ticket-btn{color:#1d5fc9!important}
.whatsapp-chat-controls .whatsapp-ticket-btn svg{width:14px;height:14px}
.whatsapp-chat-controls .whatsapp-ticket-btn[hidden]{display:none!important}

.whatsapp-messages{
  flex:1;min-height:0;overflow:auto;padding:22px 24px;
  display:flex;flex-direction:column;gap:9px;
  background-color:var(--wa-bg);
  background-image:radial-gradient(circle at 1px 1px,rgba(148,163,184,.09) 1px,transparent 0);
  background-size:22px 22px
}
.whatsapp-message{
  max-width:min(72%,660px);padding:10px 12px 8px;border-radius:14px;
  border:1px solid var(--wa-border);box-shadow:0 5px 14px rgba(0,0,0,.08);
  animation:waMessageIn .16s ease-out
}
@keyframes waMessageIn{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}
.whatsapp-message.entrada{
  align-self:flex-start;background:var(--wa-panel);border-bottom-left-radius:4px;color:var(--wa-text)
}
.whatsapp-message.saida{
  align-self:flex-end;background:#0f6b4a;border-color:#187c59;border-bottom-right-radius:4px;color:#f1fff8
}
html[data-theme="light"] .whatsapp-message.saida{background:#daf7e7;border-color:#b7e7cc;color:#153b2b}
.whatsapp-message p{margin:0;font-size:12px;line-height:1.55;white-space:pre-wrap;word-break:break-word}
.whatsapp-message footer{display:flex;justify-content:flex-end;gap:6px;margin-top:5px;font-size:8px;opacity:.7}

.whatsapp-compose{
  padding:12px 14px 10px;border-top:1px solid var(--wa-border);
  background:var(--wa-panel);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px
}
.whatsapp-compose textarea{
  resize:none;min-height:46px;max-height:118px;
  border:1px solid var(--wa-border)!important;border-radius:12px!important;
  background:var(--wa-panel-2)!important;color:var(--wa-text)!important;
  padding:12px 13px!important;outline:none!important;box-shadow:none!important;
  line-height:1.4
}
.whatsapp-compose textarea::placeholder{color:var(--wa-muted)!important}
.whatsapp-compose textarea:focus{border-color:var(--wa-green)!important;box-shadow:0 0 0 3px var(--wa-green-soft)!important}
.whatsapp-compose button{
  min-width:112px;border:0!important;border-radius:12px!important;
  background:var(--wa-green)!important;color:#fff!important;font-weight:800;
  display:flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;
  padding:0 16px;transition:.16s ease;box-shadow:0 8px 18px rgba(32,184,106,.17)!important
}
.whatsapp-compose button:hover:not(:disabled){background:var(--wa-green-strong)!important;transform:translateY(-1px)}
.whatsapp-compose button:disabled{opacity:.65;cursor:not-allowed;transform:none}
.whatsapp-compose-note{grid-column:1/-1;font-size:9px;color:var(--wa-muted);padding-left:2px}

.whatsapp-spinner{
  width:14px;height:14px;border:2px solid rgba(255,255,255,.38);
  border-top-color:#fff;border-radius:50%;display:inline-block;
  animation:waSpin .7s linear infinite
}
@keyframes waSpin{to{transform:rotate(360deg)}}

.whatsapp-status-bar{
  margin-top:10px;padding:9px 12px;font-size:10px;color:var(--wa-muted);
  border:1px solid var(--wa-border);background:var(--wa-panel);
  border-radius:10px;min-height:34px;display:flex;align-items:center;
  transition:.16s ease
}
.whatsapp-status-bar.is-error{color:#ff9aaa;border-color:rgba(251,113,133,.34);background:var(--wa-red-soft)}
.whatsapp-status-bar.is-success{color:#66dca0;border-color:rgba(32,184,106,.34);background:var(--wa-green-soft)}
html[data-theme="light"] .whatsapp-status-bar.is-error{color:#b42336}
html[data-theme="light"] .whatsapp-status-bar.is-success{color:#176b42}

#whatsappBadge{
  margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:var(--wa-green);color:#fff;font-size:9px;font-weight:800;display:inline-grid;place-items:center
}
#whatsappBadge:empty{display:none}

.helpdesk-modulos{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 20px}
.helpdesk-modulos .btn{min-height:40px;padding:9px 14px;display:inline-flex;align-items:center;gap:8px}
.helpdesk-modulos .btn svg{width:16px;height:16px}
.helpdesk-modulos .btn[hidden]{display:none!important}

@media(max-width:1100px){
  .whatsapp-shell{grid-template-columns:300px minmax(0,1fr)}
  .whatsapp-chat-head{align-items:flex-start;flex-direction:column}
  .whatsapp-chat-person{width:100%}
  .whatsapp-chat-controls{width:100%;justify-content:flex-start}
}
@media(max-width:860px){
  .whatsapp-shell{grid-template-columns:1fr;height:auto;min-height:0}
  .whatsapp-sidebar{border-right:0;min-height:300px;max-height:390px}
  .whatsapp-chat{min-height:560px;border-top:1px solid var(--wa-border)}
}
@media(max-width:720px){
  .helpdesk-modulos{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:16px}
  .helpdesk-modulos .btn{min-width:0;width:100%;justify-content:center}
}
@media(max-width:600px){
  .whatsapp-header{align-items:stretch;flex-direction:column}
  .whatsapp-actions{width:100%}.whatsapp-actions .btn{flex:1}
  .whatsapp-shell{border-radius:14px}
  .whatsapp-chat-controls select,.whatsapp-chat-controls button{flex:1}
  .whatsapp-messages{padding:14px}
  .whatsapp-message{max-width:88%}
  .whatsapp-compose{grid-template-columns:1fr}
  .whatsapp-compose button{min-height:44px}
  .whatsapp-compose-note{grid-column:auto}
}


/* Correção estrutural: empty state e conversa ativa nunca podem coexistir visualmente. */
#whatsappVazio.hidden,
#whatsappChatAtivo.hidden,
.whatsapp-empty.hidden,
.whatsapp-chat-stage.hidden{
  display:none!important;
}

.whatsapp-chat{
  min-height:0;
  overflow:hidden;
}

#whatsappChatAtivo{
  flex:1;
  min-height:0;
  height:auto;
}

#whatsappChatAtivo:not(.hidden){
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
}

#whatsappMensagens{
  min-height:0;
  overflow-y:auto;
}

.whatsapp-chat-head,
.whatsapp-compose{
  flex-shrink:0;
}

@media(max-width:860px){
  #whatsappChatAtivo:not(.hidden){
    min-height:520px;
  }
}


/* Authenticated media previews; scoped to WhatsApp. */
.whatsapp-view .wa-media{min-width:0;width:min(320px,100%);overflow-wrap:anywhere}
.whatsapp-view .wa-media img,.whatsapp-view .wa-media video{display:block;max-width:100%;max-height:340px;border-radius:12px;object-fit:contain}
.whatsapp-view .wa-media audio{display:block;width:100%;max-width:100%;min-width:0}
.whatsapp-view .wa-media .wa-sticker{width:160px;height:160px;object-fit:contain}
.whatsapp-view .wa-image-button{display:block;background:transparent;padding:0;border:0;cursor:zoom-in;max-width:100%;border-radius:12px}
.whatsapp-view .wa-media-button,.wa-lightbox .wa-media-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 14px;margin:4px;border:1px solid #719ac5;border-radius:10px;background:#123253;color:#fff;cursor:pointer;text-decoration:none;font:inherit}
.whatsapp-view .wa-media-button:focus-visible,.whatsapp-view .wa-image-button:focus-visible,.wa-lightbox button:focus-visible{outline:3px solid #60a5fa;outline-offset:3px}
.whatsapp-view .wa-media-loading{min-height:120px;border-radius:12px;background:var(--wa-soft);color:var(--wa-text);display:grid;place-items:center}
.whatsapp-view .wa-media svg{width:20px;height:20px;vertical-align:middle}
.wa-lightbox{width:min(960px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:16px;border:1px solid #45617c;border-radius:18px;background:#0d1d30;color:#f0f6ff;overflow:auto}
.wa-lightbox::backdrop{background:rgb(0 9 20 / .8);backdrop-filter:blur(4px)}
.wa-lightbox-inner{display:flex;flex-direction:column;align-items:center;gap:12px}
.wa-lightbox-inner button{align-self:flex-end}
.wa-lightbox img{display:block;max-width:100%;max-height:72dvh;object-fit:contain}
.wa-lightbox p{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%}
body.light-mode .wa-lightbox,body[data-theme="light"] .wa-lightbox,html[data-theme="light"] .wa-lightbox{background:#fff;color:#102a43;border-color:#cfdae6}
@media(max-width:640px){.whatsapp-view .whatsapp-message:has(.wa-media){max-width:96%;min-width:0}.wa-lightbox{padding:10px}.whatsapp-view .wa-media{width:min(280px,100%)}}