/* Inês (widget da Escola ED): botão nas cores do Respiro.
   Só muda o aspeto. O widget continua a ser o mesmo script. */

#lara-chat-btn {
  width: auto !important;
  height: auto !important;
  padding: 5px 20px 5px 5px !important;
  gap: 12px;
  border-radius: 999px !important;
  background: var(--creme, #F7F3F0) !important;
  border: 1px solid var(--rosa-nevoa, #D8BFC4) !important;
  box-shadow: 0 10px 30px rgba(90, 38, 53, 0.16) !important;
  animation: ines-respira 4s cubic-bezier(0.37, 0, 0.18, 1) infinite !important;
}
#lara-chat-btn:hover {
  transform: translateY(-2px) !important;
  border-color: var(--mauve, #8E666C) !important;
  box-shadow: 0 14px 34px rgba(90, 38, 53, 0.22) !important;
}
#lara-chat-btn svg,
#lara-badge { display: none !important; }

/* a fotografia da Inês */
#lara-chat-btn::before {
  content: "";
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: url("https://colaboradores.escolaed.ai/avatares/F01.jpg") center 20% / cover no-repeat;
  box-shadow: 0 0 0 2px var(--creme, #F7F3F0), 0 0 0 3px var(--dusty-rose, #B9878F);
  flex-shrink: 0;
}
/* o convite ao lado */
#lara-chat-btn::after {
  content: "Pergunta à Inês";
  font-family: "Cormorant Garamond", Georgia, serif;
  font-style: italic;
  font-size: 1.2rem;
  color: var(--borgonha-ameixa, #723F4C);
  white-space: nowrap;
}

@keyframes ines-respira {
  0%, 100% { box-shadow: 0 10px 30px rgba(90, 38, 53, 0.16); }
  50%      { box-shadow: 0 10px 30px rgba(90, 38, 53, 0.16), 0 0 0 7px rgba(216, 191, 196, 0.35); }
}

/* o balão de "Tens alguma dúvida?" */
#lara-tooltip {
  bottom: 92px !important;
  background: #FFFFFF !important;
  color: var(--carvao, #343033) !important;
  border: 1px solid var(--rosa-nevoa, #D8BFC4) !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  box-shadow: 0 10px 30px rgba(90, 38, 53, 0.14) !important;
}
#lara-tooltip::after {
  background: #FFFFFF !important;
  border-color: var(--rosa-nevoa, #D8BFC4) !important;
}

#lara-tooltip { max-width: 240px !important; }

/* a janela da conversa, em creme em vez de escuro */
#lara-chat-box {
  bottom: 96px !important;
  background: var(--creme, #F7F3F0) !important;
  border: 1px solid var(--rosa-nevoa, #D8BFC4) !important;
  box-shadow: 0 20px 50px rgba(90, 38, 53, 0.22) !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
}
#lara-header {
  background: #FFFFFF !important;
  border-bottom: 1px solid var(--linha, rgba(89, 81, 86, 0.18)) !important;
}
#lara-avatar { background: var(--rosa-nevoa, #D8BFC4) !important; }
#lara-header-info h3 {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: 1.15rem !important;
  font-weight: 500 !important;
  color: var(--borgonha-profundo, #5A2635) !important;
}
#lara-header-info p { color: var(--cinza-ameixa, #595156) !important; }
#lara-header-info p::before { background: var(--dusty-rose, #B9878F) !important; }
#lara-close {
  background: transparent !important;
  color: var(--cinza-ameixa, #595156) !important;
}
#lara-close:hover { background: var(--creme-quente, #F2EBE6) !important; }

.lara-msg { font-size: 14px !important; }
.lara-msg.bot {
  background: #FFFFFF !important;
  border: 1px solid var(--linha, rgba(89, 81, 86, 0.18)) !important;
  color: var(--carvao, #343033) !important;
}
.lara-msg.user {
  background: var(--mauve, #8E666C) !important;
  color: #FBF8F6 !important;
}
.lara-msg a,
.lara-msg.bot a { color: var(--borgonha-ameixa, #723F4C) !important; }
.lara-typing span { background: var(--dusty-rose, #B9878F) !important; }

.lara-quick button {
  background: #FFFFFF !important;
  border: 1px solid var(--rosa-nevoa, #D8BFC4) !important;
  color: var(--borgonha-ameixa, #723F4C) !important;
}
.lara-quick button:hover {
  background: var(--creme-quente, #F2EBE6) !important;
  border-color: var(--mauve, #8E666C) !important;
  color: var(--borgonha-profundo, #5A2635) !important;
}

#lara-input-area {
  background: #FFFFFF !important;
  border-top: 1px solid var(--linha, rgba(89, 81, 86, 0.18)) !important;
}
#lara-input {
  background: var(--creme, #F7F3F0) !important;
  border: 1px solid var(--linha, rgba(89, 81, 86, 0.18)) !important;
  color: var(--carvao, #343033) !important;
}
#lara-input:focus { border-color: var(--mauve, #8E666C) !important; }
#lara-input::placeholder { color: #8C8288 !important; }
#lara-send { background: var(--mauve, #8E666C) !important; }
#lara-send:hover { background: var(--borgonha-ameixa, #723F4C) !important; }

/* no telemóvel fica só a fotografia, para não tapar a página */
@media (max-width: 600px) {
  #lara-chat-btn { padding: 4px !important; }
  #lara-chat-btn::after { display: none; }
  #lara-tooltip { bottom: 80px !important; }
}

@media (prefers-reduced-motion: reduce) {
  #lara-chat-btn { animation: none !important; }
}

/* 22 out 2026: o botão fixo leva o preço; menos espaçamento para caber numa linha no telemóvel */
.sticky-cta .btn { letter-spacing: 0.1em; padding-inline: 20px; }

/* 22 out 2026: o topo aparece logo, sem fade (quem chega de um anúncio no telemóvel não pode ver um ecrã vazio) */
.motion .hero .reveal { opacity: 1; transform: none; transition: none; }
