/* ===================================================================
   BRAND COLORS - Site1 Real Estate
   ================================================================
   Primary color: #14324A (Navy/Petroleum Blue) — combina com o vermelho
   do tema (--theme-color) sem competir com ele como o verde fazia.
   Text on primary: #FFFFFF (White)
   ================================================================ */

/* ===================================================================
   INNER PAGE HERO (breadcumb-wrapper)
   ================================================================
   Altura reduzida (era --space:165px, ~330px de padding) e overlay na
   cor do tema (vermelho/laranja) em vez do gradiente preto padrão. */
.breadcumb-wrapper {
    --space: 90px !important;
}

.breadcumb-wrapper::before {
    background: linear-gradient(246deg, rgba(255, 65, 54, 0.75) 0%, rgba(180, 30, 20, 0.85) 100%) !important;
    opacity: 1 !important;
}

/* ===================================================================
   POPULAR BADGE (Venda/Aluguel) — lado a lado quando houver os dois
   ================================================================
   O tema original só previa 1 <p> por badge; quando o imóvel é venda
   E aluguel ao mesmo tempo, os dois <p> empilhavam verticalmente.
   A cor de fundo padrão do tema é cinza-escuro (rgba(3,6,14,.7));
   trocada para o azul-marinho da marca. */
.popular-list-1 .thumb-wrapper .popular-badge p {
    background: rgba(20, 50, 74, 0.85) !important;
}

.popular-badge {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.popular-badge-item {
    position: relative;
    display: inline-block;
}

.popular-badge-item img {
    position: absolute !important;
    top: -24px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 54px !important;
    height: 30px !important;
}

/* ===================================================================
   PROPERTY DESCRIPTION (card de imóvel) — não é um link de destaque
   ================================================================
   <a class="property-description"> herdava a cor vermelha padrão de
   link do tema, deixando a descrição inteira do card em vermelho. */
.property-description {
    color: var(--body-color, #554B4B) !important;
}

.property-description:hover {
    color: var(--title-color, #1A1A1A) !important;
}

/* ===================================================================
   SHOP TOP BAR (contagem + "Ordenar por") — espaçamento antes da grade
   ================================================================
   .shop-top-bar não existe no tema original; sem margin-bottom, o
   dropdown ficava colado no primeiro card de imóvel. */
.shop-top-bar {
    margin-bottom: 30px;
}

/* ===================================================================
   PROPERTY CARD — altura consistente entre cards da mesma linha
   ================================================================
   Imóveis sem descrição/m² deixavam o card mais baixo, desalinhando
   "Ver Mais"/preço entre cards vizinhos na mesma grade. */
.popular-list-1 {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.popular-list-1 .property-content {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.popular-list-1 .property-bottom {
    margin-top: auto;
}

/* ===================================================================
   FAVORITE (HEART) BUTTON ACTIVE STATE
   ================================================================
   O tema original não tinha um estado "ativo" para o botão de favorito
   (era um link estático para wishlist.html); o JS já alterna a classe
   .active e o ícone far/fas corretamente, só faltava o estilo visual. */
.icon-btn.heart.active {
    background-color: #e63950 !important;
    border-color: #e63950 !important;
    color: #fff !important;
}

.icon-btn.heart.active i {
    color: #fff !important;
}

/* ===================================================================
   CONTACT PREFERENCE RADIO BUTTONS
   ================================================================
   .btn-check + .btn-outline-secondary é Bootstrap puro, sem nenhuma
   re-tematização — o checkbox nativo do input ficava visível por cima
   do label em vez de oculto (padrão .btn-check depende de CSS do
   próprio Bootstrap que não está sendo aplicado corretamente aqui). */
.form-group .btn-check {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

/* Neutraliza o círculo genérico "input[type=radio] ~ label::before" do tema
   (style.css:1771), pensado para radios simples — aqui o label já é um
   .btn completo, o círculo extra sobrepunha o botão. */
.btn-group .btn-check ~ label.btn::before {
    display: none !important;
}

.form-group .btn-check + label.btn {
    border: 2px solid var(--th-border-color, #D8DDE1) !important;
    background: #fff !important;
    color: #1A1A1A !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
}

.form-group .btn-check:checked + label.btn {
    border-color: #14324A !important;
    background: #14324A !important;
    color: #fff !important;
}

/* ===================================================================
   DARK SURFACES (footer, header sticky, botão de contraste)
   ================================================================
   O tema usa --gray-color (#03060E, cinza quase preto) no rodapé e
   no header ao ficar fixo/sticky, e --black-color (#111827) no botão
   "Cadastre Seu Imóvel" (.bg-black) — trocados pelo azul-marinho. */
.footer-wrapper,
.sticky-wrapper.sticky {
    background-color: #14324A !important;
}

.bg-black {
    background-color: #14324A !important;
}

/* ===================================================================
   HEADER LOGO HEIGHT FIX
   ================================================================
   Logo300x100.png é entregue no tamanho nativo (300x100px) sem
   width/height no <img> nem max-height no tema, o que infla a
   altura da barra do header muito além do que o layout do tema
   (calibrado para uma logo baixa/larga) suporta. */
.header-logo img,
.th-header .header-logo img {
    max-height: 50px !important;
    width: auto !important;
}

.mobile-logo img {
    max-height: 36px !important;
    width: auto !important;
}

/* ===================================================================
   PRICE DISPLAYS
   ================================================================ */

/* Property card prices */
.property-boxarea .price-area p,
.property-content .price-area p,
.property-details .price,
.property-price h3 {
    background: #14324A !important;
    color: #fff !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    display: inline-block !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

/* Similar properties price */
.similar-property-card .price,
.property-card .price {
    background: #14324A !important;
    color: #fff !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    display: inline-block !important;
}

/* ===================================================================
   PRIMARY BUTTONS
   ================================================================ */

/* Main theme buttons */
.theme-btn1,
.theme-btn2,
.btn-primary {
    background: #14324A !important;
    color: #fff !important;
    border: 2px solid #14324A !important;
    transition: all 0.3s ease !important;
}

.theme-btn1:hover,
.theme-btn2:hover,
.btn-primary:hover {
    background: #0E2436 !important;
    border-color: #0E2436 !important;
    color: #fff !important;
}

/* Outline/Secondary buttons */
.btn-outline-primary {
    background: transparent !important;
    color: #14324A !important;
    border: 2px solid #14324A !important;
}

.btn-outline-primary:hover {
    background: #14324A !important;
    color: #fff !important;
    border-color: #14324A !important;
}

/* ===================================================================
   FORM SUBMIT BUTTONS
   ================================================================ */

/* Contact form and property interest forms (não inclui a barra de busca .search-area,
   que deve manter a cor vermelha/laranja padrão do tema) */
form button[type="submit"],
form .btn-submit {
    background: #14324A !important;
    color: #fff !important;
    border: 2px solid #14324A !important;
}

form button[type="submit"]:hover,
form .btn-submit:hover {
    background: #0E2436 !important;
    border-color: #0E2436 !important;
    color: #fff !important;
}

.search-area button[type="submit"] {
    background: var(--theme-color) !important;
    border-color: var(--theme-color) !important;
    color: #fff !important;
}

.search-area button[type="submit"]:hover {
    background: var(--theme-color) !important;
    border-color: var(--theme-color) !important;
    opacity: 0.9;
}

/* ===================================================================
   LINKS AND ACCENTS
   ================================================================ */

/* Primary text links */
.text-primary,
a.text-primary {
    color: #14324A !important;
}

.text-primary:hover,
a.text-primary:hover {
    color: #0E2436 !important;
}

/* Bootstrap primary overrides */
.bg-primary {
    background-color: #14324A !important;
}

.border-primary {
    border-color: #14324A !important;
}

/* ===================================================================
   SPECIFIC COMPONENT OVERRIDES
   ================================================================ */

/* Agent info widget buttons */
.agent-info-widget .btn-outline-primary,
.sidebar-widget .btn-outline-primary {
    border-color: #14324A !important;
    color: #14324A !important;
}

.agent-info-widget .btn-outline-primary:hover,
.sidebar-widget .btn-outline-primary:hover {
    background: #14324A !important;
    color: #fff !important;
}

/* Success button (WhatsApp) keeps green */
.btn-success {
    background: #25D366 !important;
    border-color: #25D366 !important;
    color: #fff !important;
}

.btn-success:hover {
    background: #1ea952 !important;
    border-color: #1ea952 !important;
}

/* ===================================================================
   FONT AWESOME FIXES
   ================================================================ */

/* Ensure Font Awesome font family is applied.
   O kit instalado em /template-assets/fonts/fontawesome/ é o Pro (fontawesome.min.css
   registra as famílias "Font Awesome 6 Pro", "Font Awesome 6 Brands" e
   "Font Awesome 6 Duotone" via @font-face), então usamos esses mesmos nomes aqui -
   usar "Font Awesome 6 Free" (kit gratuito, nunca carregado) fazia os ícones
   caírem no glifo ausente ("tofu"). */
.fa, .fas, .far, .fal, .fat, .fad, .fab,
.fa-solid, .fa-regular, .fa-light, .fa-thin, .fa-duotone, .fa-brands {
    font-family: "Font Awesome 6 Pro", "Font Awesome 6 Brands" !important;
    font-weight: 900;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

/* Duotone icons use their own dedicated family */
.fad, .fa-duotone {
    font-family: "Font Awesome 6 Duotone" !important;
    font-weight: 900 !important;
}

/* Regular style icons */
.far, .fa-regular {
    font-weight: 400 !important;
}

/* Brand icons */
.fab, .fa-brands {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

/* Light icons */
.fal, .fa-light {
    font-weight: 300 !important;
}

/* Thin icons */
.fat, .fa-thin {
    font-weight: 100 !important;
}

/* ===================================================================
   WIDGET HEADERS - Force white text
   ================================================================ */

/* Ensure widget headers have white text and consistent styling */
.agent-info-widget h4,
.contact-form-widget h4,
.sidebar-widget h4,
.share-widget h4,
.property-sidebar .agent-info-widget h4,
.property-sidebar .contact-form-widget h4,
.property-sidebar .sidebar-widget h4,
.property-sidebar .share-widget h4 {
    color: #ffffff !important;
    background: #14324A !important;
    padding: 1rem 1.5rem !important;
    font-weight: bold !important;
    border-radius: 12px 12px 0 0 !important;
    margin: -1.5rem -1.5rem 1rem -1.5rem !important;
    text-align: center !important;
}

/* ===================================================================
   MOBILE HEADER CIRCLE BUTTONS
   ================================================================ */

/* Circle buttons in mobile header */
.mobile-header .circle-button {
    background-color: #14324A !important;
}

.mobile-header .circle-button:hover {
    background-color: #0E2436 !important;
}

.mobile-header .circle-button svg path {
    fill: #fff !important;
}

/* ===================================================================
   SHARE BUTTONS (Compartilhar)
   ================================================================ */

/* Override share buttons to use brand color */
.share-widget .share-buttons a.facebook,
.share-widget .share-buttons a.twitter {
    background: #14324A !important;
    color: #fff !important;
}

.share-widget .share-buttons a.facebook:hover,
.share-widget .share-buttons a.twitter:hover {
    background: #0E2436 !important;
}

/* WhatsApp keeps its original green */
.share-widget .share-buttons a.whatsapp {
    background: #25d366 !important;
    color: white !important;
}

.share-widget .share-buttons a.whatsapp:hover {
    background: #1ea952 !important;
}

/* ===================================================================
   PRICE UNIFICATION - All prices use same style
   ================================================================ */

/* Price button style for Favoritos page */
.nm-btn {
    background: #14324A !important;
    color: #fff !important;
    border: none !important;
    transition: all 0.3s ease !important;
}

.nm-btn:hover {
    background: #0E2436 !important;
    color: #fff !important;
    text-decoration: none !important;
}