*{
  margin:0;
  padding:0;
  box-sizing:border-box;
  font-family:Inter,Arial,sans-serif;
}

html, body{
  width:100%;
  height:100%;
  overflow:hidden;
  background:#fff;
}

/* CONTAINER PRINCIPAL */
#dom-chat{
  width:100vw;
  height:100dvh; /* viewport dinâmico (mobile) */
  display:flex;
  flex-direction:column;
  background:#fff;
}

/* HEADER */
.chat-header{
  background:#111827;
  color:#fff;
  padding:14px 16px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-shrink:0;

  /* Safe area (iPhone notch) */
  padding-top:calc(14px + env(safe-area-inset-top));
}

.chat-header img{
  height:32px;
}

/* CORPO DO CHAT */
.chat-body{
  flex:1;
  padding:16px;
  overflow-y:auto;
  background:#f9fafb;
  -webkit-overflow-scrolling:touch;
}

/* MENSAGENS */
.msg{
  margin-bottom:12px;
  max-width:85%;
  padding:10px 14px;
  border-radius:14px;
  font-size:14px;
  line-height:1.4;
  word-wrap:break-word;
}

.bot{
  background:#e5e7eb;
  color:#111827;
}

.user{
  background:#111827;
  color:#fff;
  margin-left:auto;
}

/* BOTÕES RÁPIDOS */
.quick-buttons{
  margin-top:8px;
}

.quick-buttons button{
  background:#111827;
  color:#fff;
  border:none;
  padding:10px 16px;
  border-radius:999px;
  font-size:13px;
  cursor:pointer;
  margin:6px 6px 0 0;
}

/* FOOTER */
.chat-footer{
  display:flex;
  border-top:1px solid #e5e7eb;
  background:#fff;
  flex-shrink:0;

  /* Safe area inferior (iPhone) */
  padding-bottom:env(safe-area-inset-bottom);
}

.chat-footer input{
  flex:1;
  padding:16px;
  border:none;
  outline:none;
  font-size:16px; /* evita zoom no iOS */
}

.chat-footer button{
  background:#111827;
  color:#fff;
  border:none;
  padding:0 22px;
  font-size:16px;
  cursor:pointer;
}