/* Gráfica Anúncios — Chat público responsivo / Hermes Agent
   Carregado depois do CSS principal para prevalecer em produção e APP_DEBUG. */

.site-chat-toggle{
  z-index:2147482990!important;
  max-width:calc(100vw - 24px)!important;
}

.site-chat-box{
  position:fixed!important;
  z-index:2147483000!important;
  top:auto!important;
  bottom:max(12px,env(safe-area-inset-bottom))!important;
  right:max(12px,env(safe-area-inset-right))!important;
  left:auto!important;
  width:min(420px,calc(100vw - 24px))!important;
  height:min(720px,calc(100dvh - 24px))!important;
  max-height:calc(100dvh - 24px)!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-radius:18px!important;
  isolation:isolate!important;
  box-shadow:0 28px 90px rgba(7,32,65,.34)!important;
  overscroll-behavior:contain;
}
.site-chat-box[hidden]{display:none!important}
.site-chat-box.chat-pos-left{
  left:max(12px,env(safe-area-inset-left))!important;
  right:auto!important;
}

.site-chat-head{
  position:relative!important;
  z-index:3!important;
  flex:0 0 auto!important;
  min-height:64px!important;
  padding:10px 14px!important;
  gap:10px!important;
}
.site-chat-head>div{min-width:0!important}
.site-chat-head strong,
.site-chat-head small{
  display:block!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.site-chat-head button{
  min-width:36px!important;
  min-height:36px!important;
  display:grid!important;
  place-items:center!important;
}

.site-chat-body{
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
  padding:12px 14px!important;
  background:#fff!important;
}
.site-chat-body>[data-chat-start]:not([hidden]){
  display:block!important;
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable;
  padding:1px 3px 4px 0!important;
}
.site-chat-body>[data-chat-status]{
  flex:0 0 auto!important;
  margin-top:7px!important;
  line-height:1.3!important;
}
.site-chat-body h3{
  font-size:1rem!important;
  line-height:1.25!important;
  margin-bottom:5px!important;
}
.site-chat-welcome{
  margin:0 0 8px!important;
  font-size:.91rem!important;
  line-height:1.42!important;
  color:#334155!important;
}

#site-chat-start-form{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:8px!important;
  min-width:0!important;
}
#site-chat-start-form>.mb-2{margin-bottom:0!important}
#site-chat-start-form .form-control{
  min-width:0!important;
  width:100%!important;
  border-radius:9px!important;
}
#site-chat-start-form input.form-control:not([type=file]){
  min-height:38px!important;
}
#site-chat-start-form textarea.form-control{
  min-height:54px!important;
  max-height:120px!important;
  resize:vertical!important;
}
#site-chat-start-form input[type=file]{
  font-size:.78rem!important;
  line-height:1.45!important;
}
#site-chat-start-form button[type=submit]{
  position:sticky!important;
  bottom:0!important;
  z-index:2!important;
  min-height:40px!important;
  margin-top:1px!important;
  border-radius:10px!important;
  box-shadow:0 -7px 16px rgba(255,255,255,.88)!important;
}

.site-chat-agent-only-note{
  display:flex!important;
  align-items:flex-start!important;
  gap:8px!important;
  padding:8px 10px!important;
  border-radius:10px!important;
  background:rgba(13,110,253,.07)!important;
  border:1px solid rgba(13,110,253,.12)!important;
  font-size:.78rem!important;
  line-height:1.38!important;
  color:#4f6278!important;
}
.site-chat-agent-only-note i{
  flex:0 0 auto!important;
  color:var(--chat-color)!important;
  margin-top:1px!important;
}

.site-chat-conversation:not([hidden]){
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 auto!important;
  min-height:0!important;
  gap:9px!important;
  overflow:hidden!important;
}
.site-chat-new{flex:0 0 auto!important}
.site-chat-thread{
  flex:1 1 auto!important;
  min-height:100px!important;
  height:auto!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable;
  padding-right:3px!important;
}
.site-chat-reply{
  flex:0 0 auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 42px 42px!important;
  gap:7px!important;
  align-items:end!important;
  padding-top:9px!important;
  background:#fff!important;
}
.site-chat-reply textarea{
  min-width:0!important;
  width:100%!important;
  max-height:100px!important;
  resize:none!important;
}
.site-chat-reply .btn{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
}

.site-chat-agent-fallback{
  width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto;background:rgba(255,255,255,.18);color:#fff;font-size:18px
}
.site-chat-toggle .site-chat-agent-fallback{
  background:#fff;color:var(--chat-color);box-shadow:0 2px 8px rgba(0,0,0,.12)
}
.site-chat-agent-fallback--head{width:40px;height:40px}

/* Quando o painel está aberto, o botão flutuante não cobre campos nem o botão de envio. */
body:has(.site-chat-box:not([hidden])) .site-chat-toggle{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Notebooks / janelas com pouca altura */
@media (min-width:768px) and (max-height:720px){
  .site-chat-box{
    bottom:8px!important;
    height:calc(100dvh - 16px)!important;
    max-height:calc(100dvh - 16px)!important;
  }
  .site-chat-head{min-height:56px!important;padding:8px 12px!important}
  .site-chat-body{padding:9px 11px!important}
  .site-chat-welcome{font-size:.84rem!important;line-height:1.34!important}
  .site-chat-agent-only-note{padding:6px 8px!important;font-size:.72rem!important}
  #site-chat-start-form{gap:6px!important}
  #site-chat-start-form input.form-control:not([type=file]){min-height:34px!important}
  #site-chat-start-form textarea.form-control{min-height:46px!important}
}

/* Tablet */
@media (max-width:991.98px){
  .site-chat-box{
    right:10px!important;
    bottom:10px!important;
    width:min(430px,calc(100vw - 20px))!important;
    height:calc(100dvh - 20px)!important;
    max-height:calc(100dvh - 20px)!important;
  }
  .site-chat-box.chat-pos-left{left:10px!important;right:auto!important}
}

/* Celular: painel praticamente full-screen e independente da barra inferior do site. */
@media (max-width:767.98px){
  .site-chat-box,
  .site-chat-box.chat-pos-left{
    top:max(8px,env(safe-area-inset-top))!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    left:max(8px,env(safe-area-inset-left))!important;
    right:max(8px,env(safe-area-inset-right))!important;
    width:auto!important;
    height:auto!important;
    max-height:none!important;
    border-radius:15px!important;
  }
  .site-chat-head{min-height:56px!important;padding:8px 10px!important}
  .site-chat-head img{width:36px!important;height:36px!important}
  .site-chat-agent-fallback--head{width:36px!important;height:36px!important}
  .site-chat-body{padding:9px!important}
  .site-chat-body h3{font-size:.95rem!important}
  .site-chat-welcome{font-size:.84rem!important}
  .site-chat-message{max-width:92%!important;font-size:.86rem!important}
  .site-chat-reply{grid-template-columns:minmax(0,1fr) 40px 40px!important;gap:6px!important}
  .site-chat-reply .btn{width:40px!important;height:40px!important;min-width:40px!important}
  #site-chat-start-form button[type=submit]{min-height:42px!important}
}

@media (max-width:380px){
  .site-chat-box,
  .site-chat-box.chat-pos-left{
    top:max(5px,env(safe-area-inset-top))!important;
    bottom:max(5px,env(safe-area-inset-bottom))!important;
    left:max(5px,env(safe-area-inset-left))!important;
    right:max(5px,env(safe-area-inset-right))!important;
    border-radius:12px!important;
  }
  .site-chat-body{padding:7px!important}
  .site-chat-reply{grid-template-columns:minmax(0,1fr) 38px 38px!important}
  .site-chat-reply .btn{width:38px!important;height:38px!important;min-width:38px!important}
}


/* 2026-09-02 — etapa compacta + atalhos de produtos */
.site-chat-box.chat-stage-start{
  height:auto!important;
  max-height:calc(100dvh - 24px)!important;
}
.site-chat-box.chat-stage-start .site-chat-body{
  flex:0 1 auto!important;
  max-height:calc(100dvh - 88px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
.site-chat-box.chat-stage-start .site-chat-body>[data-chat-start]:not([hidden]){
  flex:0 1 auto!important;
  overflow:visible!important;
  padding-bottom:1px!important;
}
.site-chat-box.chat-stage-start [data-chat-status]{
  margin-top:6px!important;
}
.site-chat-box.chat-stage-conversation{
  height:min(720px,calc(100dvh - 24px))!important;
}

.site-chat-quick-products{
  display:grid;
  gap:5px;
  min-width:0;
  margin:0 0 1px;
}
.site-chat-quick-title{
  color:#64748b;
  font-size:.7rem;
  font-weight:850;
  line-height:1.1;
}
.site-chat-quick-list{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  min-width:0;
}
.site-chat-quick-chip{
  appearance:none;
  border:1px solid color-mix(in srgb,var(--chat-color,#0d6efd) 22%,#dbe5ef);
  border-radius:999px;
  background:color-mix(in srgb,var(--chat-color,#0d6efd) 7%,#fff);
  color:#12345b;
  min-height:28px;
  max-width:100%;
  padding:4px 9px;
  font-size:.72rem;
  font-weight:850;
  line-height:1.15;
  white-space:normal;
  text-align:center;
  cursor:pointer;
  transition:transform .15s ease,border-color .15s ease,background .15s ease;
}
.site-chat-quick-chip:hover,
.site-chat-quick-chip:focus-visible{
  transform:translateY(-1px);
  border-color:var(--chat-color,#0d6efd);
  background:color-mix(in srgb,var(--chat-color,#0d6efd) 12%,#fff);
}
.site-chat-quick-chip.is-selected,
.site-chat-quick-chip[aria-pressed="true"]{
  border-color:var(--chat-color,#0d6efd);
  background:var(--chat-color,#0d6efd);
  color:#fff;
  box-shadow:0 2px 8px color-mix(in srgb,var(--chat-color,#0d6efd) 22%,transparent);
}
.site-chat-quick-chip.is-selected:hover,
.site-chat-quick-chip[aria-pressed="true"]:focus-visible{
  background:color-mix(in srgb,var(--chat-color,#0d6efd) 88%,#000);
}
.site-chat-quick-products--conversation{
  flex:0 0 auto;
  padding-top:1px;
}

@media (min-width:768px) and (max-height:720px){
  .site-chat-box.chat-stage-start{
    height:auto!important;
    max-height:calc(100dvh - 16px)!important;
  }
  .site-chat-box.chat-stage-start .site-chat-body{
    max-height:calc(100dvh - 72px)!important;
  }
  .site-chat-box.chat-stage-conversation{
    height:calc(100dvh - 16px)!important;
  }
}

@media (max-width:767.98px){
  .site-chat-box.chat-stage-start,
  .site-chat-box.chat-stage-start.chat-pos-left{
    top:auto!important;
    height:auto!important;
    max-height:calc(100dvh - 16px)!important;
  }
  .site-chat-box.chat-stage-start .site-chat-body{
    max-height:calc(100dvh - 80px)!important;
  }
  .site-chat-box.chat-stage-conversation,
  .site-chat-box.chat-stage-conversation.chat-pos-left{
    top:max(8px,env(safe-area-inset-top))!important;
    bottom:max(8px,env(safe-area-inset-bottom))!important;
    height:auto!important;
    max-height:none!important;
  }
  .site-chat-quick-title{font-size:.68rem}
  .site-chat-quick-chip{font-size:.7rem;min-height:27px;padding:4px 8px}
}

/* Gestão visual restaurada — posição do botão e foto */
.site-chat-toggle.chat-launch-right{
  right:max(12px,env(safe-area-inset-right))!important;
  left:auto!important;
}
.site-chat-toggle.chat-launch-left{
  left:max(12px,env(safe-area-inset-left))!important;
  right:auto!important;
}
.site-chat-toggle.chat-launch-center{
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
}
.site-chat-toggle.chat-launch-center:hover{
  transform:translateX(-50%) translateY(-3px)!important;
}
.site-chat-toggle.chat-avatar-right>img,
.site-chat-toggle.chat-avatar-right>.site-chat-agent-fallback{
  order:2;
}
.site-chat-toggle.chat-avatar-right>span:last-child{
  order:1;
}
.site-chat-head.chat-avatar-right>div{
  order:1;
}
.site-chat-head.chat-avatar-right>img,
.site-chat-head.chat-avatar-right>.site-chat-agent-fallback{
  order:2;
}
.site-chat-head.chat-avatar-right>button{
  order:3;
  margin-left:auto!important;
}

@media (max-width:575.98px){
  .site-chat-toggle.chat-launch-center{
    max-width:calc(100vw - 16px)!important;
  }
}

/* ============================================================
   Coordenador definitivo de componentes fixos
   Privacidade/Termos reserva espaço real antes do Chat.
   A altura é medida pelo privacy-notice.js, portanto funciona
   mesmo quando o texto, viewport ou barra mobile mudarem.
   ============================================================ */
:root{
  --ga-privacy-ui-reserve:0px;
}
body.ga-privacy-notice-active .site-chat-toggle{
  bottom:calc(var(--ga-privacy-ui-reserve, 0px) + 10px)!important;
}
body.ga-privacy-notice-active .site-chat-box,
body.ga-privacy-notice-active .site-chat-box.chat-pos-left{
  top:auto!important;
  bottom:calc(var(--ga-privacy-ui-reserve, 0px) + 8px)!important;
  height:min(720px,calc(100dvh - var(--ga-privacy-ui-reserve, 0px) - 20px))!important;
  max-height:calc(100dvh - var(--ga-privacy-ui-reserve, 0px) - 20px)!important;
}
@media (max-width:991.98px){
  body.ga-privacy-notice-active .site-chat-box,
  body.ga-privacy-notice-active .site-chat-box.chat-pos-left{
    height:min(680px,calc(100dvh - var(--ga-privacy-ui-reserve, 0px) - 18px))!important;
    max-height:calc(100dvh - var(--ga-privacy-ui-reserve, 0px) - 18px)!important;
  }
}
@media (max-width:767.98px){
  body.ga-privacy-notice-active .site-chat-toggle{
    bottom:calc(var(--ga-privacy-ui-reserve, 0px) + 8px)!important;
  }
  body.ga-privacy-notice-active .site-chat-box,
  body.ga-privacy-notice-active .site-chat-box.chat-pos-left{
    top:max(8px,env(safe-area-inset-top))!important;
    bottom:calc(var(--ga-privacy-ui-reserve, 0px) + 6px)!important;
    height:auto!important;
    max-height:none!important;
  }
}