/* ==========================================================================
   institucional_shared.css — código compartilhado por TODOS os institucionais
   (site do projeto, sites das empresas, site da Franchise).
   Importado por institucional_project.css e tenant_sites/shared.css.
   ========================================================================== */

/* ---- Botão flutuante de WhatsApp (bootstrap_vue/components/WhatsappFloatLead) ---- */
.wlf-fab {
  position: fixed; bottom: 1.5rem; right: 1.5rem; z-index: 1050;
  width: 56px; height: 56px; border-radius: 50%; border: none;
  background: #25D366; color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 20px rgba(37,211,102,.5);
  cursor: pointer; transition: transform .2s, box-shadow .2s;
}
.wlf-fab:hover { transform: scale(1.08); box-shadow: 0 6px 28px rgba(37,211,102,.7); }
.wlf-panel {
  position: fixed; bottom: 5.5rem; right: 1.5rem; z-index: 1049;
  width: 320px; border-radius: 1rem; overflow: hidden;
  box-shadow: var(--xbyte-shadow-lg, 0 24px 60px rgba(10,24,37,.14));
  background: var(--xbyte-surface, #fff);
  border: 1px solid var(--xbyte-line, rgba(15,34,51,.1));
}
.wlf-header {
  display: flex; align-items: center; gap: .75rem;
  padding: 1rem 1.25rem;
  background: var(--xbyte-navy, #0F2233);
  border-bottom: 2px solid var(--xbyte-gold, #BFA269);
  color: #fff;
  position: relative;
}
.wlf-header-icon {
  width: 40px; height: 40px; border-radius: 50%;
  background: rgba(37,211,102,.16);
  border: 1.5px solid rgba(37,211,102,.4);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.wlf-header-title { font-weight: 700; font-size: 1rem; line-height: 1.2; color: #fff; font-family: var(--xbyte-font-serif); }
.wlf-header-sub   { font-size: .78rem; color: rgba(234,240,246,.72); margin-top: .1rem; }
.wlf-close {
  position: absolute; top: .6rem; right: .75rem;
  background: none; border: none; color: rgba(234,240,246,.7);
  font-size: 1.1rem; cursor: pointer; line-height: 1; padding: .2rem .4rem;
}
.wlf-close:hover { color: #fff; }
.wlf-body { padding: 1.25rem; }
.wlf-label { font-size: .82rem; font-weight: 600; margin-bottom: .3rem; color:var(--jatix-ivory); }
.wlf-label .wlf-req { color: #B4483D; }
.wlf-input {
  width: 100%; padding: .55rem .75rem; border-radius: .5rem;
  border: 1.5px solid var(--xbyte-line, rgba(15,34,51,.15));
  background: var(--xbyte-bg-2, #F6F3EE);
  color:var(--jatix-ivory);
  font-size: .95rem; outline: none; transition: border-color .15s;
}
.wlf-input:focus { border-color: var(--xbyte-gold, #BFA269); box-shadow: 0 0 0 3px rgba(191,162,105,.18); }
.wlf-input::placeholder { color: var(--xbyte-ink-soft, #4d5c66); opacity: .7; }
.wlf-consent { display: flex; gap: .5rem; align-items: flex-start; margin-top: .75rem; }
.wlf-consent input { margin-top: 3px; flex-shrink: 0; accent-color: var(--xbyte-gold, #BFA269); }
.wlf-body .wlf-label { color: var(--xbyte-ink, #0F2233) !important; }
.wlf-body, .wlf-success { color: var(--xbyte-ink, #0F2233); }
.wlf-consent-label { font-size: .77rem; color: var(--xbyte-ink-soft, #4d5c66); line-height: 1.45; }
.wlf-consent-label a { color:var(--jatix-ivory); font-weight: 600; text-decoration: underline; }
.wlf-btn {
  display: flex; align-items: center; justify-content: center; gap: .5rem;
  width: 100%; padding: .7rem; margin-top: 1rem;
  border-radius: .5rem; border: none; cursor: pointer;
  background: var(--xbyte-gold, #BFA269); color:var(--jatix-ivory); font-weight: 700; font-size: .95rem;
  transition: background .15s;
}
.wlf-btn:hover:not(:disabled) { background: var(--xbyte-gold-bright, #d3b47f); }
.wlf-btn:disabled { opacity: .7; cursor: not-allowed; }
.wlf-hint { text-align: center; font-size: .73rem; color: var(--xbyte-ink-soft, #4d5c66); margin-top: .6rem; }
.wlf-error { font-size: .8rem; color: #B4483D; margin-top: .5rem; }
.wlf-success { padding: 2rem 1.25rem; text-align: center; }
.wlf-success p { color:var(--jatix-ivory); font-size: .9rem; margin: .75rem 0 0; }
.wlf-success small { color: var(--xbyte-ink-soft, #4d5c66); }
.wlf-pop-enter-active, .wlf-pop-leave-active { transition: opacity .2s, transform .2s; }
.wlf-pop-enter-from, .wlf-pop-leave-to { opacity: 0; transform: translateY(12px) scale(.97); }

@media (prefers-color-scheme: dark) {
  .wlf-panel { background: #1b2124; border-color: rgba(255,255,255,.08); }
  .wlf-input { background: #232c30; border-color: rgba(255,255,255,.12); color: #e7ebe9; }
  .wlf-label, .wlf-success p { color: #e7ebe9; }
  .wlf-body .wlf-label { color: #e7ebe9 !important; }
  .wlf-body, .wlf-success { color: #e7ebe9; }
}
