/* ==========================================================================
   Astra Overrides — Imob Child Theme
   Sobrescreve variáveis e estilos padrão do Astra com o design system próprio
   ========================================================================== */

/* ── Previne scroll horizontal em todas as páginas ─────────────────────── */
body {
  overflow-x: hidden;
}

/* ── Variáveis do Astra remapeadas para nosso sistema ──────────────────── */
:root {
  --ast-global-color-0: var(--color-navy);
  --ast-global-color-1: var(--color-gold);
  --ast-global-color-2: var(--color-teal);
  --ast-global-color-3: var(--color-white);
  --ast-global-color-4: var(--color-gray-100);
  --ast-global-color-5: var(--color-gray-500);
  --ast-global-color-6: var(--color-text);
  --ast-global-color-7: var(--color-gray-200);
  --ast-global-color-8: var(--color-navy-80);

  --ast-body-font-family:    var(--font-primary);
  --ast-heading-font-family: var(--font-primary);
  --ast-body-font-size:      var(--fs-base);
  --ast-body-line-height:    var(--lh-relaxed);
  --ast-body-color:          var(--color-body);
  --ast-heading-color:       var(--color-heading);
  --ast-link-color:          var(--color-link);
  --ast-link-hover-color:    var(--color-link-hover);
}

/* ── Cancela header transparente do Astra em TODAS as páginas ──────────── */
/* A classe ast-inherit-site-logo-transparent faz o Astra tornar o header    */
/* transparente sobre o hero da homepage. Forçamos sempre branco sólido.     */
#masthead,
.imob-header,
.ast-inherit-site-logo-transparent #masthead,
.ast-inherit-site-logo-transparent .imob-header,
.ast-header-break-point #masthead,
.ast-header-break-point .imob-header {
  background-color: #ffffff !important;
  border-bottom: 2px solid var(--color-gold) !important;
}

/* Garante texto navy nos links da nav mesmo com Astra em modo transparente */
.ast-inherit-site-logo-transparent .imob-nav__menu .menu-item > a,
.imob-nav__menu .menu-item > a {
  color: var(--color-navy) !important;
}
.ast-inherit-site-logo-transparent .imob-nav__menu .menu-item > a:hover,
.ast-inherit-site-logo-transparent .imob-nav__menu .current-menu-item > a,
.imob-nav__menu .menu-item > a:hover,
.imob-nav__menu .current-menu-item > a,
.imob-nav__menu .current-menu-ancestor > a {
  color: var(--color-teal) !important;
}

/* ── Base ───────────────────────────────────────────────────────────────── */
body {
  font-family: var(--font-primary);
  font-size:   var(--fs-base);
  color:       var(--color-body);
  background-color: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ── Tipografia ─────────────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.ast-header-sections .site-title,
.ast-header-sections .site-description {
  font-family:    var(--font-primary);
  color:          var(--color-heading);
  letter-spacing: var(--ls-tight);
  line-height:    var(--lh-tight);
}

h1 { font-size: var(--fs-5xl); font-weight: var(--fw-bold); }
h2 { font-size: var(--fs-4xl); font-weight: var(--fw-bold); }
h3 { font-size: var(--fs-3xl); font-weight: var(--fw-semibold); }
h4 { font-size: var(--fs-2xl); font-weight: var(--fw-semibold); }
h5 { font-size: var(--fs-xl);  font-weight: var(--fw-medium); }
h6 { font-size: var(--fs-lg);  font-weight: var(--fw-medium); }

a {
  color:           var(--color-link);
  text-decoration: none;
  transition:      color var(--transition-fast);
}
a:hover { color: var(--color-link-hover); }

/* ── Header ─────────────────────────────────────────────────────────────── */
.site-header,
#masthead {
  background-color: #ffffff;
  border-bottom:    2px solid var(--color-gold);
  box-shadow:       var(--shadow-md);
}

.site-title a,
.site-title a:hover {
  color: var(--color-navy);
}

.site-description {
  color: var(--color-gray-500);
}

/* ── Navegação principal ────────────────────────────────────────────────── */
.main-navigation,
.ast-main-header-bar {
  background-color: transparent;
}

.main-navigation a,
.main-header-bar .main-navigation a,
#site-navigation .menu-item > a {
  font-family:    var(--font-primary);
  font-weight:    var(--fw-medium);
  font-size:      var(--fs-sm);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color:          var(--color-navy);
  padding:        var(--space-2) var(--space-4);
  transition:     color var(--transition-fast), border-color var(--transition-fast);
  border-bottom:  2px solid transparent;
}

.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a {
  color:        var(--color-teal);
  border-color: var(--color-teal);
}

/* Dropdown */
.main-navigation .sub-menu {
  background-color: var(--color-navy);
  border-top:       2px solid var(--color-gold);
  box-shadow:       var(--shadow-lg);
  border-radius:    0 0 var(--radius-lg) var(--radius-lg);
}

.main-navigation .sub-menu a {
  color:        var(--color-navy-20);
  border-bottom: none;
  font-size:    var(--fs-xs);
}

.main-navigation .sub-menu a:hover {
  color:            var(--color-gold);
  background-color: var(--color-navy-80);
  border-bottom:    none;
}

/* ── Botões ─────────────────────────────────────────────────────────────── */
.ast-button,
.wp-block-button__link,
button,
input[type="submit"],
input[type="button"] {
  font-family:    var(--font-primary);
  font-weight:    var(--fw-semibold);
  font-size:      var(--fs-sm);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  border-radius:  var(--radius-md);
  transition:     background-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);
  cursor:         pointer;
  border:         none;
  padding:        var(--space-3) var(--space-6);
}

/* Botão primário */
.ast-button,
.wp-block-button__link,
input[type="submit"] {
  background-color: var(--color-gold);
  color:            var(--color-navy);
}

.ast-button:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover {
  background-color: var(--color-gold-dark);
  color:            var(--color-navy);
  transform:        translateY(-1px);
  box-shadow:       var(--shadow-gold);
}

/* ── Footer ─────────────────────────────────────────────────────────────── */
.site-footer,
#colophon {
  background-color: var(--color-navy);
  color:            var(--color-navy-20);
  border-top:       2px solid var(--color-gold);
}

.site-footer a,
#colophon a {
  color: var(--color-gold);
}

.site-footer a:hover,
#colophon a:hover {
  color: var(--color-gold-light);
}

.footer-widget-area .widget-title {
  color:         var(--color-gold);
  font-size:     var(--fs-sm);
  font-weight:   var(--fw-semibold);
  letter-spacing:var(--ls-widest);
  text-transform:uppercase;
}

/* ── Sidebar / Widgets ──────────────────────────────────────────────────── */
.widget-title {
  font-size:     var(--fs-base);
  font-weight:   var(--fw-semibold);
  color:         var(--color-navy);
  letter-spacing:var(--ls-wide);
  text-transform:uppercase;
  border-bottom: 2px solid var(--color-gold);
  padding-bottom:var(--space-2);
  margin-bottom: var(--space-4);
}

/* ── Formulários ────────────────────────────────────────────────────────── */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
textarea,
select {
  font-family:   var(--font-primary);
  font-size:     var(--fs-base);
  color:         var(--color-text);
  border:        1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding:       var(--space-3) var(--space-4);
  transition:    border-color var(--transition-fast), box-shadow var(--transition-fast);
  width:         100%;
  background-color: var(--color-white);
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus {
  outline:       none;
  border-color:  var(--color-teal);
  box-shadow:    0 0 0 3px rgb(30 74 95 / 0.15);
}

/* ── Blocos do Gutenberg ────────────────────────────────────────────────── */
.wp-block-separator {
  border-color: var(--color-gold);
  opacity: 0.4;
}

.wp-block-quote {
  border-left: 4px solid var(--color-gold);
  background:  var(--color-gold-10);
  padding:     var(--space-6) var(--space-8);
  border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
}

/* ── Responsividade ─────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  h1 { font-size: var(--fs-4xl); }
  h2 { font-size: var(--fs-3xl); }
  h3 { font-size: var(--fs-2xl); }
}

@media (max-width: 480px) {
  h1 { font-size: var(--fs-3xl); }
  h2 { font-size: var(--fs-2xl); }
}

/* ── Garante layout vertical (bloco) para páginas de imóveis ────────────── */
/* Astra aplica display:flex ao .ast-container em alguns layouts,            */
/* colocando hero/filtros/cards lado a lado. Forçamos display:block.         */
.post-type-archive-imoveis #content,
.post-type-archive-imoveis .ast-container,
.single-imoveis #content,
.single-imoveis .ast-container,
.om-seo-landing #content,
.om-seo-landing .ast-container {
  display: block !important;
}

/* ── Layout full-width: elimina sidebar e libera ast-container ───────────── */
/*                                                                             */
/* A homepage (front-page.php) fecha o .ast-container logo após get_header()  */
/* e renderiza tudo fora dele — por isso já fica full-width naturalmente.      */
/*                                                                             */
/* Os demais templates (archive, single, seo-landing) ficam DENTRO do         */
/* .ast-container padrão do Astra, que tem max-width restrito.                */
/* A solução: max-width: none + padding: 0 no .ast-container nessas páginas.  */
/* Cada template controla a própria largura com om-fp-container internamente.  */

/* Libera o ast-container para full-width */
.om-seo-landing .ast-container,
.post-type-archive-imoveis .ast-container,
.single-imoveis .ast-container,
.om-archive-imoveis .ast-container,
.om-elp .ast-container,
.om-condominios .ast-container,
.single-edificios .ast-container,
.blog .ast-container,
.om-blog .ast-container,
.om-contato .ast-container,
.om-sobre .ast-container,
.om-lancamentos .ast-container,
.page-template-default .ast-container {
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
}

/* Remove sidebar e widget area */
.single-imoveis #secondary,
.post-type-archive-imoveis #secondary,
.om-archive-imoveis #secondary,
.om-seo-landing #secondary,
.om-elp #secondary,
.om-condominios #secondary,
.single-edificios #secondary,
.blog #secondary,
.om-blog #secondary,
.om-contato #secondary,
.om-sobre #secondary,
.om-lancamentos #secondary,
.page-template-default #secondary,
.single-imoveis .widget-area,
.post-type-archive-imoveis .widget-area,
.om-archive-imoveis .widget-area,
.om-seo-landing .widget-area,
.om-elp .widget-area,
.om-condominios .widget-area,
.single-edificios .widget-area,
.blog .widget-area,
.om-blog .widget-area,
.om-contato .widget-area,
.om-sobre .widget-area,
.om-lancamentos .widget-area,
.page-template-default .widget-area {
  display: none !important;
}

/* Content area ocupa 100% da largura */
.single-imoveis #primary,
.post-type-archive-imoveis #primary,
.om-archive-imoveis #primary,
.om-seo-landing #primary,
.om-elp #primary,
.om-condominios #primary,
.single-edificios #primary,
.blog #primary,
.om-blog #primary,
.om-contato #primary,
.om-sobre #primary,
.om-lancamentos #primary,
.page-template-default #primary,
.single-imoveis .content-area,
.post-type-archive-imoveis .content-area,
.om-archive-imoveis .content-area,
.om-seo-landing .content-area,
.om-elp .content-area,
.om-condominios .content-area,
.single-edificios .content-area,
.blog .content-area,
.om-blog .content-area,
.om-contato .content-area,
.om-sobre .content-area,
.om-lancamentos .content-area,
.page-template-default .content-area {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  padding: 0 !important;
}

/* Fundo branco global — sem background cinza do Astra */
body.page-template-default,
body.page-template-default #page,
body.page-template-default #content,
body.blog,
body.blog #page,
body.blog #content,
body.single-edificios,
body.single-edificios #page,
body.om-elp,
body.om-elp #page,
body.om-condominios,
body.om-condominios #page,
body.om-blog,
body.om-blog #page,
body.om-blog #content,
body.om-contato,
body.om-contato #page,
body.om-contato #content,
body.om-sobre,
body.om-sobre #page,
body.om-sobre #content,
body.om-lancamentos,
body.om-lancamentos #page,
body.om-lancamentos #content {
  background-color: var(--color-white) !important;
}

/* ── Páginas Elementor/Gutenberg: full-width fora do ast-container ────── */
/* om-contato, om-sobre, om-lancamentos fecham o ast-container via PHP    */
/* e o conteúdo Elementor renderiza diretamente em #page                  */
.om-contato .om-page-wrap,
.om-sobre .om-page-wrap,
.om-lancamentos .om-page-wrap {
  width: 100%;
  padding: 0;
  margin: 0;
  display: block;
}

/* Garante que seções Elementor se expandam ao viewport inteiro */
.om-contato .elementor-section,
.om-sobre .elementor-section,
.om-lancamentos .elementor-section {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Remove padding do wrapper do Astra que pode sobrar */
.om-contato #primary,
.om-sobre #primary,
.om-lancamentos #primary {
  padding: 0 !important;
  margin: 0 !important;
}

/* ── Elementor "Full Width" via body class que o Elementor adiciona ────── */
/* body.elementor-template-full-width é adicionado pelo Elementor quando    */
/* a página usa o template "Elementor Full Width" (elementor_header_footer). */
/* Garante que o ast-container não restrinja a largura do conteúdo.         */
body.elementor-template-full-width #content.site-content,
body.elementor-template-full-width .ast-container,
body.elementor-template-full-width #primary.content-area,
body.elementor-template-full-width .content-area,
body.elementor-template-full-width .site-main {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  float: none !important;
}

/* ── Oculta header/footer hardcoded dentro do widget HTML ───────────────── */
/* As páginas lancamentos/contato/sobre têm um widget HTML com header e footer  */
/* próprios. Como forçamos o template header-footer, o WP renderiza o header e  */
/* footer reais do tema. O header/footer do widget devem ser ocultados.          */
body.om-lancamentos .elementor-widget-html .topbar,
body.om-lancamentos .elementor-widget-html .header,
body.om-lancamentos .elementor-widget-html .footer,
body.om-lancamentos .elementor-widget-html .floating-wa,
body.om-contato     .elementor-widget-html .topbar,
body.om-contato     .elementor-widget-html .header,
body.om-contato     .elementor-widget-html .footer,
body.om-contato     .elementor-widget-html .floating-wa,
body.om-sobre       .elementor-widget-html .topbar,
body.om-sobre       .elementor-widget-html .header,
body.om-sobre       .elementor-widget-html .footer,
body.om-sobre       .elementor-widget-html .floating-wa {
  display: none !important;
}

/* ── Elementor Canvas template: e-con-boxed fix ─────────────────────────── */
/* As páginas lancamentos/contato/sobre usam o template Canvas               */
/* (body.elementor-template-canvas). O Astra NÃO cria #content/.ast-container*/
/* nesse template — logo o CSS acima não tem efeito.                         */
/* O que cria as margens cinzas laterais é o container raiz do Elementor:    */
/* <div class="e-con e-con-boxed e-parent"> que tem <div class="e-con-inner">*/
/* com max-width restrita. Solução: forçar 100% no .e-con-inner de containers*/
/* raiz (e-parent) nessas páginas.                                           */
body.om-lancamentos .e-con.e-parent.e-con-boxed > .e-con-inner,
body.om-contato     .e-con.e-parent.e-con-boxed > .e-con-inner,
body.om-sobre       .e-con.e-parent.e-con-boxed > .e-con-inner,
body.elementor-template-canvas .e-con.e-parent.e-con-boxed > .e-con-inner {
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ── Galeria single imóvel — previne override do Astra em height:auto ───── */
/* Astra aplica .site-content img { height: auto } com especificidade 0,1,1  */
/* que ganha de .om-gallery__main-img { height: 100% } (0,1,0). Necessário ! */
.om-gallery__main-img {
  height: 100% !important;
  max-width: none !important;
}
.om-gallery__thumb img {
  height: 100% !important;
  max-width: none !important;
}
/* Cards de imóveis nas páginas de listagem e home */
/* Fix definitivo: position absolute derrota o height:auto do Astra */
.om-lanc-card__img-wrap {
  position: relative !important;
  overflow: hidden !important;
}
.om-lanc-card__img-wrap .om-lanc-card__img,
.om-lanc-card__img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
}
.om-fp-card__img,
.om-imovel-card__image {
  height: 100% !important;
  max-height: none !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* ── Rodapé Astra: bloqueio total — todas as páginas ────────────────────── */
/* Nossos templates controlam o próprio footer; o Astra não deve renderizar   */
/* nenhum elemento de rodapé extra.                                           */
#colophon,
footer.site-footer,
.ast-footer-html-div,
.ast-small-footer,
[class*="ast-footer-widget"],
.home #colophon,
.home footer.site-footer,
.home .ast-footer-html-div,
.home [class*="ast-footer"] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Evita fundo cinza aparecendo abaixo do rodapé */
body.home,
body.home #page {
  background-color: var(--color-navy);
}
