/* Chatbot Itaú: convite, botão flutuante e janela do chat (iframe) */

/* Banner de cookies: no desktop vai para a esquerda (o canto direito é do chat) */
body .cookieConsentContainer { right:auto; left:30px }
@media (max-width:767px) {
  body .cookieConsentContainer { padding:12px 16px }
  body .cookieConsentContainer .cookieTitle a { font-size:16px; line-height:30px; padding-right:96px }
  body .cookieConsentContainer .cookieDesc p { font-size:11px; line-height:16px; margin-top:4px }
  body .cookieConsentContainer .cookieButton a {
    position:absolute;
    top:12px;
    right:16px;
    margin-top:0;
    padding:6px 18px;
    font-size:13px;
  }
}

/* Botão flutuante */
#itau-bf-launcher {
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:1001;
  width:64px;
  height:64px;
  border:0;
  border-radius:50%;
  background:#FF6200;
  box-shadow:0 6px 18px rgba(0,0,0,.25);
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:transform .15s, background .15s;
}
#itau-bf-launcher:hover { background:#F05C00; transform:scale(1.05) }

/* Janela do chat */
#itau-bf-chat {
  position:fixed;
  right:8px;
  bottom:8px;
  z-index:1001;
  width:424px;
  max-width:calc(100vw - 16px);
  height:640px;
  max-height:calc(100vh - 16px);
  max-height:calc(100dvh - 16px);
  border:0;
  background:transparent;
}
#itau-bf-chat[hidden],
#itau-bf-launcher[hidden],
#itau-bf-bubble[hidden] { display:none }
@media (max-width:767px) {
  #itau-bf-chat {
    top:0;
    right:0;
    bottom:0;
    width:100%;
    max-width:100%;
    height:100vh;
    height:100dvh; /* altura visível real, sem a barra do navegador */
    max-height:none;
    background:rgba(0,0,0,.45);
  }
}

/* Convite: card no desktop, pílula no mobile */
#itau-bf-bubble {
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:998; /* abaixo do banner de cookies (999) */
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  animation:itauBfIn .35s cubic-bezier(.2,.7,.2,1) both;
  transition:bottom .3s ease;
}
@keyframes itauBfIn { from { opacity:0; transform:translateY(12px) } to { opacity:1; transform:none } }
#itau-bf-bubble .bub-logo { width:40px; height:40px; border-radius:9px; flex:none }
#itau-bf-bubble .bub-desk {
  width:380px;
  background:#fff;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
#itau-bf-bubble .bub-head {
  display:flex;
  align-items:center;
  gap:12px;
  background:#FF6200;
  color:#fff;
  padding:14px 16px;
}
#itau-bf-bubble .bub-title { flex:1; line-height:1.25 }
#itau-bf-bubble .bub-title b { display:block; font-size:16px; font-weight:700 }
#itau-bf-bubble .bub-title .bub-sub { display:block; font-size:13px }
#itau-bf-bubble .bub-close {
  border:0;
  background:none;
  padding:6px;
  border-radius:8px;
  line-height:0;
  cursor:pointer;
}
#itau-bf-bubble .bub-close:hover { background:rgba(255,255,255,.15) }
#itau-bf-bubble .bub-body { padding:16px }
#itau-bf-bubble .bub-msg {
  background:#F2F3F5;
  color:#1F2933;
  border-radius:4px 16px 16px 16px;
  padding:14px 16px;
  font-size:14px;
  line-height:20px;
}
#itau-bf-bubble .bub-msg p { margin:0 }
#itau-bf-bubble .bub-msg p + p { margin-top:14px }
#itau-bf-bubble .bub-cta {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
  margin-top:14px;
  height:46px;
  border:1.5px solid #EC7000;
  border-radius:12px;
  background:#fff;
  color:#EC7000;
  font:600 15px/1 Inter,system-ui,sans-serif;
  cursor:pointer;
  transition:background .15s;
}
#itau-bf-bubble .bub-cta:hover { background:#FFF3E6 }
#itau-bf-bubble .bub-mob { display:none }
@media (max-width:767px) {
  #itau-bf-bubble { left:12px; right:12px; bottom:12px }
  #itau-bf-bubble .bub-desk { display:none }
  #itau-bf-bubble .bub-mob {
    display:flex;
    align-items:center;
    gap:12px;
    width:100%;
    border:0;
    border-radius:40px;
    background:#FF6200;
    color:#fff;
    padding:14px 22px 14px 16px;
    text-align:left;
    box-shadow:0 8px 24px rgba(0,0,0,.25);
    cursor:pointer;
  }
  #itau-bf-bubble .bub-mob .bub-title b { font-size:15px }
  #itau-bf-bubble .bub-mob .bub-title .bub-sub { font-size:12px; line-height:1.35; margin-top:2px }
}
@media (prefers-reduced-motion:reduce) {
  #itau-bf-bubble { animation:none }
}