/* OPENCLAW_DIALOG_HIGHLIGHT_V1 */

/* Aba Falar com OpenClaw */
#ocDirectChatTab,
#ocDialogTab,
button:has(+ #ocDialogVisiblePanel),
.oc-tab:has(+ #ocDialogVisiblePanel){
  background:linear-gradient(135deg,#F59E0B,#FACC15) !important;
  color:#081225 !important;
  border:2px solid rgba(250,204,21,.65) !important;
  box-shadow:0 0 0 3px rgba(245,158,11,.16),0 12px 34px rgba(245,158,11,.25) !important;
  font-weight:950 !important;
}

/* Painel inteiro */
#ocDialogVisiblePanel{
  border:2px solid rgba(245,158,11,.38) !important;
  box-shadow:
    0 22px 80px rgba(0,0,0,.40),
    0 0 0 1px rgba(255,255,255,.04),
    0 0 35px rgba(245,158,11,.08) !important;
}

/* Badge do campo */
.oc-dialog-visible-badge{
  background:rgba(245,158,11,.20) !important;
  border:1px solid rgba(245,158,11,.55) !important;
  color:#FACC15 !important;
  box-shadow:0 0 24px rgba(245,158,11,.12) !important;
}

/* Campo de texto */
#ocDialogVisibleMessage{
  border:2px solid rgba(245,158,11,.35) !important;
  background:#081225 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03) !important;
}

#ocDialogVisibleMessage:focus{
  border-color:#FACC15 !important;
  box-shadow:
    0 0 0 3px rgba(245,158,11,.25),
    0 0 26px rgba(245,158,11,.16) !important;
}

/* Botão principal: Enviar e delegar tarefa */
#ocDialogVisibleSend,
#ocDirectSend,
#ocRequestForm button[type="submit"]{
  background:linear-gradient(135deg,#F59E0B,#FACC15) !important;
  color:#081225 !important;
  border:2px solid rgba(250,204,21,.70) !important;
  border-radius:14px !important;
  min-height:54px !important;
  padding:15px 22px !important;
  font-size:16px !important;
  font-weight:950 !important;
  letter-spacing:-.02em !important;
  box-shadow:
    0 0 0 4px rgba(245,158,11,.15),
    0 16px 42px rgba(245,158,11,.34),
    inset 0 1px 0 rgba(255,255,255,.24) !important;
  transform:translateY(0) !important;
  position:relative !important;
  overflow:hidden !important;
}

#ocDialogVisibleSend::before,
#ocDirectSend::before{
  content:"🚀 ";
}

#ocDialogVisibleSend:hover,
#ocDirectSend:hover,
#ocRequestForm button[type="submit"]:hover{
  background:linear-gradient(135deg,#FACC15,#F59E0B) !important;
  color:#081225 !important;
  transform:translateY(-2px) scale(1.01) !important;
  box-shadow:
    0 0 0 5px rgba(245,158,11,.20),
    0 20px 54px rgba(245,158,11,.42),
    inset 0 1px 0 rgba(255,255,255,.30) !important;
}

/* Botões secundários mais visíveis */
#ocDialogVisibleClear,
#ocDialogVisibleShow,
#ocDirectClear,
#ocDirectShowTasks{
  border:1px solid rgba(148,163,184,.35) !important;
  background:#13203A !important;
  color:#CBD5E1 !important;
  font-weight:850 !important;
}

#ocDialogVisibleClear:hover,
#ocDialogVisibleShow:hover,
#ocDirectClear:hover,
#ocDirectShowTasks:hover{
  border-color:#F59E0B !important;
  color:#FFFFFF !important;
  background:#1A2A4A !important;
}

/* Chamada visual abaixo do título */
#ocDialogVisiblePanel .oc-dialog-visible-subtitle::after{
  content:"\\A\\A👉 Digite a demanda e clique no botão amarelo para delegar ao OpenClaw.";
  white-space:pre-line;
  color:#FACC15;
  font-weight:850;
}

/* Micro animação sutil no CTA */
@keyframes ocCtaPulse{
  0%{box-shadow:0 0 0 4px rgba(245,158,11,.14),0 16px 42px rgba(245,158,11,.30)}
  50%{box-shadow:0 0 0 7px rgba(245,158,11,.22),0 20px 54px rgba(245,158,11,.42)}
  100%{box-shadow:0 0 0 4px rgba(245,158,11,.14),0 16px 42px rgba(245,158,11,.30)}
}

#ocDialogVisibleSend{
  animation:ocCtaPulse 2.4s ease-in-out infinite;
}

@media(max-width:560px){
  #ocDialogVisibleSend,
  #ocDirectSend,
  #ocRequestForm button[type="submit"]{
    width:100% !important;
    min-height:58px !important;
    font-size:15px !important;
  }
}
