/* SITE-SHARED.CSS — estilos dos componentes de site-shared.js (toasts, newsletter, foco, ajustes) */

/* Avisos flutuantes (substituem alert()) */
.site-toasts {
  position: fixed;
  left: 50%;
  bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  z-index: 10050;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  width: min(92vw, 420px);
  pointer-events: none;
}
.site-toast {
  pointer-events: auto;
  background: #1a1a1a;
  color: #fff;
  border-left: 4px solid #FFAB00;
  border-radius: 8px;
  padding: .85rem 1.1rem;
  font-size: .92rem;
  line-height: 1.4;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .28);
  animation: siteToastIn .25s ease;
}
.site-toast-success { border-left-color: #2e7d32; }
.site-toast-error { border-left-color: #c62828; }
.site-toast.saindo { opacity: 0; transition: opacity .3s ease; }
@keyframes siteToastIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 991px) {
  /* acima da barra de ações fixa do celular */
  .site-toasts { bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px)); }
}

/* Resultado da inscrição na newsletter */
.newsletter-status { margin: .5rem 0 0; font-size: .85rem; min-height: 1.2em; }
.newsletter-status.ok { color: #4caf50; }
.newsletter-status.erro { color: #ff6b6b; }
.footer-newsletter-disclaimer a { color: inherit; text-decoration: underline; }

/* Miniaturas do detalhe agora são <button> (acessível pelo teclado) */
button.gallery-thumb { border: 0; padding: 0; background: none; cursor: pointer; }

/* Foco visível para quem navega pelo teclado */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid #FFAB00;
  outline-offset: 2px;
}

/* Páginas legais (privacidade/termos) */
.legal-page { padding: 8rem 0 4rem; }
.legal-page h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); margin-bottom: .5rem; }
.legal-page h2 { font-size: 1.3rem; margin-top: 2.2rem; }
.legal-page p, .legal-page li { line-height: 1.75; color: #333; }
.legal-page .legal-meta { color: #777; font-size: .9rem; }
.legal-page .legal-aviso { background: #fff8e1; border-left: 4px solid #FFAB00; padding: 1rem 1.25rem; border-radius: 6px; margin: 1.5rem 0; }
.legal-page ul { list-style: disc; padding-left: 1.4rem; margin-bottom: 1rem; }
.legal-page li { margin-bottom: .35rem; }

/* Aviso de cookies (só aparece se CONFIG.analytics.ga4Id estiver preenchido) */
.cookie-banner {
  position: fixed; left: 1rem; right: 1rem; bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  z-index: 10040; max-width: 760px; margin: 0 auto;
  background: #111; color: #eee; border: 1px solid rgba(255, 171, 0, .4); border-radius: 10px;
  padding: 1rem 1.25rem; display: flex; gap: 1rem; align-items: center; flex-wrap: wrap;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .35); font-size: .9rem;
}
.cookie-banner p { margin: 0; flex: 1 1 320px; }
.cookie-banner a { color: #FFAB00; }
.cookie-banner-acoes { display: flex; gap: .5rem; }
@media (max-width: 991px) { .cookie-banner { bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px)); } }

/* Q2: enquanto o conteúdo carrega, o rodapé fica oculto (antes ele aparecia no topo e "pulava" — CLS 0,9) */
body.carregando .footer-luxury { display: none; }

/* J5/CDC: registro da incorporação e aviso de imagens ilustrativas (página do empreendimento) */
.emp-aviso-legal { font-size: .8rem; color: #777; border-top: 1px solid rgba(0,0,0,.08); padding-top: .75rem; margin-top: 1.25rem; }

/* Redes sociais sem perfil cadastrado ficam ocultas (atributo hidden vence o display:flex) */
.footer-social-link[hidden], .social-btn[hidden] { display: none !important; }

/* Rodapé: frase da marca na fonte de destaque, sem o itálico serifado (fora do Manual de Marca) */
.footer-luxury .footer-brand-tagline {
  font-family: 'Antonio', 'Montserrat', sans-serif !important;
  font-style: normal !important;
  font-weight: 300 !important;
  font-size: clamp(20px, 2.2vw, 30px) !important;
  line-height: 1.3 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .88) !important;
  max-width: 760px !important;
}

/* Newsletter do rodapé: a seta fica dentro do campo também no celular
   (o mobile antigo a jogava para baixo, ainda deslocada para cima, por cima do campo) */
.footer-luxury .footer-newsletter-form button[type="submit"] {
  position: absolute !important;
  right: 0;
  top: 50%;
  width: 44px !important;
  height: 44px;
  padding: 0 !important;
  display: grid !important;
  place-items: center;
}
.footer-luxury .footer-newsletter-form input[type="email"] { padding-right: 48px !important; }

/* Imagens não crescem ao passar o mouse (pedido do cliente, 03/11): cards, blog, galeria, plantas e "Sobre" */
.card-empreendimento:hover .card-empreendimento-image,
.card-empreendimento:hover .card-empreendimento-image img,
.card-blog:hover .card-blog-image img,
.blog-card:hover .blog-card-image img,
.blog-card-v2:hover .bcard-img,
.blog-featured-card:hover .blog-featured-img,
.featured-post-card:hover .featured-post-image img,
.image-zoom-container:hover .image-zoom,
.gallery-grid a:hover,
.gallery-grid a:hover img,
.gallery-item:hover img,
.planta-card:hover .planta-card-image img,
#empreendimentosGrid .card-empreendimento:hover .card-empreendimento-image,
#empreendimentosGrid .card-empreendimento:hover .card-empreendimento-image img,
.empreendimentos-list .card-empreendimento:hover .card-empreendimento-image,
.empreendimentos-list .card-empreendimento:hover .card-empreendimento-image img,
.hover-scale:hover {
  transform: none !important;
}

/* Botões dourados: o efeito antigo deslizava uma camada (::before) por cima do texto no hover e o deixava ilegível,
   inclusive no "Agende sua visita" do topo. Agora o hover só troca as cores, com o texto sempre visível. */
.btn-primary::before { display: none !important; }
.header .btn-primary,
#mobileNav .btn-primary {
  background: transparent !important;
  color: #FBB017 !important;
  border: 1px solid #FBB017 !important;
  transition: background-color .25s ease, color .25s ease !important;
}
.header .btn-primary:hover, .header .btn-primary:focus-visible,
#mobileNav .btn-primary:hover, #mobileNav .btn-primary:focus-visible {
  background: #FBB017 !important;
  color: #0A0A0A !important;
  border-color: #FBB017 !important;
}
.btn-primary:not(.btn-lg):not(.filled):hover { background: #FBB017 !important; color: #0A0A0A !important; border-color: #FBB017 !important; }

/* Formulários: a mensagem de erro só aparece depois de tentar enviar (uma regra antiga a deixava sempre visível) */
.invalid-feedback { display: none !important; }
.was-validated .form-control:invalid ~ .invalid-feedback,
.was-validated .form-select:invalid ~ .invalid-feedback,
.was-validated .form-check-input:invalid ~ .invalid-feedback,
.form-control.is-invalid ~ .invalid-feedback,
.form-select.is-invalid ~ .invalid-feedback,
[aria-invalid="true"] ~ .invalid-feedback { display: block !important; }

/* Blog: grade escondida quando só existe o post em destaque */
.blog-grid-section[hidden] { display: none !important; }

/* Títulos nunca quebram palavra com hífen automático ("CO-MEÇA"); a regra antiga ligava hyphens:auto no celular */
/* :not(#_) dá peso de id: vence a regra antiga ".blog-hero h1 { hyphens: auto !important }" do celular */
:is(h1, h2, h3, h4, .blog-hero-title, .post-hero-title, .hero-v2__title, .card-empreendimento-title):not(#_) {
  -webkit-hyphens: manual !important;
  hyphens: manual !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

/* Rodapé: redes sociais dentro da 1ª coluna (antes um ícone solitário numa faixa abaixo do rodapé) */
.footer-luxury .footer-redes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.footer-luxury .footer-redes .footer-social-link {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  width: auto !important;
  height: auto !important;
  min-height: 44px;
  padding: 0 16px !important;
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 0 !important;
  color: #fff !important;
  font-family: 'Montserrat', sans-serif;
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  text-decoration: none;
  transform: none !important;
  transition: border-color .25s ease, color .25s ease;
}
.footer-luxury .footer-redes .footer-social-link i { font-size: 16px; color: #FBB017; }
.footer-luxury .footer-redes .footer-social-link:hover { border-color: #FBB017 !important; color: #FBB017 !important; }
.footer-luxury .footer-redes .footer-social-link[hidden] { display: none !important; }

/* Rodapé: títulos das colunas alinhados ao texto e sem o tracinho dourado embaixo (tick decorativo) */
.footer-luxury .footer-col-title { padding: 0 !important; margin-left: 0 !important; text-indent: 0 !important; margin-bottom: 20px !important; }
.footer-luxury .footer-col-title::before, .footer-luxury .footer-col-title::after { display: none !important; }

/* Celular: textos do menu lateral e da barra fixa com contraste suficiente */
#mobileNav .mobile-nav-footer p { color: rgba(243, 239, 230, .62) !important; }
#mobileBottomBar .mbb-phone, #mobileBottomBar .mbb-phone span, #mobileBottomBar .mbb-phone i { color: rgba(243, 239, 230, .85) !important; }