/**
 * PropertyMetrix Discover — Design override
 * Ensures full PM branding regardless of CMS database values.
 * Loaded last so these rules win.
 */

/* ── CSS variable reset (belt + suspenders) ───────────────────────────────── */
:root {
    --primary-color: #2137b8 !important;
    --hover-color:   #192da3 !important;
    --primary-font:  'Inter', 'Segoe UI', system-ui, sans-serif !important;
    --heading-font:  'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important;
}


/* ── Global typography ────────────────────────────────────────────────────── */
/* Scoped to text elements only — form/button excluded to avoid plugin corruption */
body,
p, span, a, li, td, th {
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.heading, .slider-content h1,
.section-title, .section-heading,
.flat-title, .widget-title {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important;
    letter-spacing: -0.025em;
}

/* Homzen-native form controls: apply PM font without breaking third-party plugins */
.tf-field input,
.tf-field select,
.tf-field textarea,
.tf-search-v2 input,
.tf-search-v2 select,
.flat-form-box input,
.flat-form-box select,
.flat-form-box textarea,
.header-search-form input,
.register-tab input,
.register-tab select,
.register-tab textarea,
.wg-find-locations input {
    font-family: 'Inter', 'Segoe UI', system-ui, sans-serif !important;
}

/* PM-branded buttons — scoped to Homzen theme classes only */
.tf-btn,
.btn-primary,
.flat-btn,
.mobile-add-listing-btn,
.mobile-signin-btn {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif !important;
}


/* ── Third-party plugin isolation ─────────────────────────────────────────── */
/* Mortgage calculator and announcement plugin retain their own font stack */
.mortgage-calculator,
.mortgage-calculator *,
.ae-anno-announcement-wrapper,
.ae-anno-announcement-wrapper * {
    font-family: inherit;
}


/* ── PropertyMetrix Platform Bar ─────────────────────────────────────────── */
.pm-platform-bar {
    background-color: #131828 !important;
    border-bottom:    1px solid rgba(255,255,255,0.06) !important;
    height:           36px !important;
    display:          flex !important;
    align-items:      center !important;
    position:         relative !important;
    z-index:          9999 !important;
    width:            100% !important;
}

.pm-platform-bar .container {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 15px;
}

.pm-platform-bar__inner {
    display:     flex !important;
    align-items: center !important;
    gap:         1rem !important;
    height:      100% !important;
}

.pm-platform-bar__brand {
    display:         flex !important;
    align-items:     center !important;
    gap:             0.375rem !important;
    text-decoration: none !important;
    flex-shrink:     0 !important;
}

.pm-platform-bar__mark {
    width:     20px !important;
    height:    20px !important;
    flex-shrink: 0 !important;
}

.pm-platform-bar__name {
    font-family:    'Plus Jakarta Sans', sans-serif !important;
    font-size:      0.75rem !important;
    font-weight:    700 !important;
    color:          #ffffff !important;
    letter-spacing: -0.01em !important;
    white-space:    nowrap !important;
}

.pm-platform-bar__sep {
    width:            1px !important;
    height:           16px !important;
    background-color: rgba(255,255,255,0.15) !important;
    flex-shrink:      0 !important;
}

.pm-platform-bar__modules {
    display:     flex !important;
    align-items: center !important;
    overflow:    hidden !important;
}

.pm-platform-bar__module {
    font-family:     'Inter', sans-serif !important;
    font-size:       0.6875rem !important;
    font-weight:     500 !important;
    color:           rgba(255,255,255,0.55) !important;
    text-decoration: none !important;
    padding:         0 0.625rem !important;
    height:          36px !important;
    display:         flex !important;
    align-items:     center !important;
    white-space:     nowrap !important;
    border-right:    1px solid rgba(255,255,255,0.05) !important;
    transition:      color 0.15s, background-color 0.15s !important;
}

.pm-platform-bar__module:hover {
    color:            rgba(255,255,255,0.9) !important;
    background-color: rgba(255,255,255,0.05) !important;
}

.pm-platform-bar__all {
    font-family:     'Inter', sans-serif !important;
    font-size:       0.6875rem !important;
    font-weight:     600 !important;
    color:           #f59e0b !important;
    text-decoration: none !important;
    padding:         0 0.75rem !important;
    height:          36px !important;
    display:         flex !important;
    align-items:     center !important;
    white-space:     nowrap !important;
    transition:      color 0.15s !important;
}

.pm-platform-bar__all:hover {
    color: #fbbf24 !important;
}

@media (max-width: 768px) {
    .pm-platform-bar__modules,
    .pm-platform-bar__sep { display: none !important; }
}

@media (max-width: 480px) {
    .pm-platform-bar__name { display: none !important; }
}


/* ── Fixed header offset for platform bar ─────────────────────────────────── */
.main-header.fixed-header {
    top: 36px !important;
}

/* Botble admin bar in use: shift everything down */
.show-admin-bar .pm-platform-bar {
    margin-top: 40px !important;
}

.show-admin-bar .main-header.fixed-header {
    top: 76px !important;
}


/* ── Announcement plugin — hide orphaned navigation arrows ───────────────── */
/* The prev/next arrow controls show as two stacked line-icons when there is  */
/* only one announcement. Hidden here; the text banner still displays.        */
.ae-anno-announcement__controls {
    display: none !important;
}

/* Keep the announcement text wrapper itself clean */
.ae-anno-announcement-wrapper {
    width: 100% !important;
}

.ae-anno-announcement__text,
.ae-anno-announcement__content {
    font-family: 'Inter', sans-serif !important;
    font-size: 0.8125rem !important;
    color: inherit !important;
}


/* ── Platform tag in top-header ───────────────────────────────────────────── */
.pm-platform-tag {
    display:         flex !important;
    align-items:     center !important;
    gap:             0.375rem !important;
    font-family:     'Plus Jakarta Sans', sans-serif !important;
    font-size:       0.6875rem !important;
    font-weight:     700 !important;
    color:           #2137b8 !important;
    text-decoration: none !important;
    padding:         0 0.5rem !important;
    border:          1px solid rgba(33,55,184,0.2) !important;
    border-radius:   9999px !important;
    height:          22px !important;
}

.pm-platform-tag:hover {
    border-color: rgba(33,55,184,0.45) !important;
}

.pm-platform-tag__dot {
    width:            6px !important;
    height:           6px !important;
    background-color: #f59e0b !important;
    border-radius:    50% !important;
    flex-shrink:      0 !important;
    animation:        pm-pulse-dot 2.5s ease-in-out infinite !important;
}

@keyframes pm-pulse-dot {
    0%, 100% { opacity: 1;    transform: scale(1); }
    50%       { opacity: 0.6; transform: scale(0.85); }
}


/* ── Header logo area ──────────────────────────────────────────────────────── */
.logo-box .logo img,
.nav-logo img {
    height: 36px !important;
    width: auto !important;
    max-height: 36px !important;
    display: block !important;
}

.logo-box .logo .pm-wordmark {
    display: inline-flex !important;
    align-items: center !important;
}


/* ── Header CTA button ────────────────────────────────────────────────────── */
.pm-header-cta,
.tf-btn.primary,
.tf-btn.style-1,
.tf-btn.style-2 {
    background-color: #2137b8 !important;
    border-color:     #2137b8 !important;
    color:            #ffffff !important;
    font-family:      'Plus Jakarta Sans', sans-serif !important;
    font-weight:      600 !important;
    box-shadow:       0 4px 12px 0 rgba(33,55,184,0.25) !important;
    transition:       background-color 0.2s, box-shadow 0.2s, transform 0.15s !important;
}

.pm-header-cta:hover,
.tf-btn.primary:hover,
.tf-btn.style-1:hover,
.tf-btn.style-2:hover {
    background-color: #192da3 !important;
    border-color:     #192da3 !important;
    color:            #ffffff !important;
    box-shadow:       0 6px 16px 0 rgba(33,55,184,0.35) !important;
    transform:        translateY(-1px) !important;
}


/* ── Hero banner: PM-branded fallback when no CMS image is set ────────────── */
.flat-slider {
    background-color: #131828 !important;
}

.flat-slider.home-1 {
    background-image: linear-gradient(135deg, #0d1333 0%, #2137b8 50%, #192da3 100%) !important;
    background-attachment: scroll !important;
    min-height: 600px !important;
}

/* Allow inline BG set by CMS to override the gradient */
.flat-slider.home-1[style*="background-image: url"] {
    background-image: var(--bg-img, none) !important;
}

.flat-slider.home-1 .overlay {
    background: linear-gradient(180deg, rgba(13,19,51,0.55) 0%, rgba(13,19,51,0.75) 100%) !important;
    opacity: 1 !important;
}

.flat-slider .slider-content .heading h1 {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: -0.04em !important;
}

/* Search box inside hero */
.flat-slider .tf-search-v2,
.flat-slider .flat-tab-panel {
    background: rgba(255,255,255,0.97) !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 40px rgba(0,0,0,0.18) !important;
}


/* ── Search / filter tabs ─────────────────────────────────────────────────── */
.nav-tab-filter .nav-link-item.active,
.flat-tab .tf-tab-active,
[role="tab"][aria-selected="true"],
.tf-tab.active {
    color:            #2137b8 !important;
    border-color:     #2137b8 !important;
}

.nav-tab-filter .nav-link-item.active .icon {
    color: #2137b8 !important;
}


/* ── Property cards: badges & price accents ───────────────────────────────── */
.badge-label,
.label-featured,
.property-status {
    background-color: #2137b8 !important;
    color: #ffffff !important;
}

.badge-sale,
.label-sale {
    background-color: #f59e0b !important;
    color: #131828 !important;
}

.price-list .tf-btn,
.property-card .price,
.property-price {
    color: #2137b8 !important;
}


/* ── Section headings — subtitle accent ──────────────────────────────────── */
.shortcode-content .sub-title,
.shortcode-content .flat-sub-title {
    color: #f59e0b !important;
    font-family: 'Inter', sans-serif !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
}


/* ── Mortgage Calculator — PM color override ──────────────────────────────── */
/* The plugin sets --mc-primary: #e31837 (Homzen red) as an inline style.     */
/* Overriding the CSS variable here recolors all derived elements at once.    */
.mortgage-calculator {
    --mc-primary: #2137b8 !important;
}

/* Belt-and-suspenders: direct element overrides in case var() not used */
.mortgage-calculator__submit,
.fob-mortgage-calculator .btn,
.fob-mortgage-calculator [type="submit"] {
    background-color: #2137b8 !important;
    border-color:     #2137b8 !important;
    color:            #ffffff !important;
}

.mortgage-calculator__submit:hover,
.fob-mortgage-calculator .btn:hover {
    background-color: #192da3 !important;
    border-color:     #192da3 !important;
}

/* Ensure calculator section spacing is intact */
.fob-mortgage-calculator,
.mortgage-calculator-container {
    margin-top: 0 !important;
    position: relative !important;
    overflow: visible !important;
}


/* ── Footer: PM-aligned ────────────────────────────────────────────────────── */
footer.footer a:hover {
    color: #f59e0b !important;
}

footer.footer .widget-title {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
}


/* ── Map markers ──────────────────────────────────────────────────────────── */
.boxmarker {
    background-color: #2137b8 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
}


/* ── Search suggestions ───────────────────────────────────────────────────── */
.search-suggestion .search-suggestion-item:hover {
    background-color: #2137b8 !important;
}


/* ── Dropdowns ────────────────────────────────────────────────────────────── */
.dropdown-item.active,
.dropdown-item:active {
    background-color: #2137b8 !important;
    color: #ffffff !important;
}


/* ── Pagination ───────────────────────────────────────────────────────────── */
.pagination .page-item.active .page-link {
    background-color: #2137b8 !important;
    border-color:     #2137b8 !important;
    color:            #ffffff !important;
}

.pagination .page-link:hover {
    color: #2137b8 !important;
}


/* ── Form controls: focus ring — scoped to theme containers ──────────────── */
.tf-field input:focus,
.tf-field select:focus,
.tf-field textarea:focus,
.flat-form-box input:focus,
.flat-form-box select:focus,
.flat-form-box textarea:focus,
.tf-search-v2 input:focus {
    border-color: #2137b8 !important;
    box-shadow:   0 0 0 3px rgba(33,55,184,0.15) !important;
    outline:      none !important;
}


/* ── Breadcrumb active item ───────────────────────────────────────────────── */
.breadcrumb-item.active,
.breadcrumb-item a:hover {
    color: #2137b8 !important;
}


/* ── Countdown elements ───────────────────────────────────────────────────── */
.coming-soon-countdown-inner li {
    background-color: #2137b8 !important;
}


/* ── Mobile platform module list ──────────────────────────────────────────── */
.pm-mobile-platform {
    padding:    1rem 0 !important;
    border-top: 1px solid #e2e6f0 !important;
    margin-top: 0.5rem !important;
}

.pm-mobile-platform__label {
    font-family:    'Plus Jakarta Sans', sans-serif !important;
    font-size:      0.6875rem !important;
    font-weight:    700 !important;
    color:          #6b7596 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    margin-bottom:  0.5rem !important;
}

.pm-mobile-platform__links {
    display:   flex !important;
    flex-wrap: wrap !important;
    gap:       0 !important;
}

.pm-mobile-platform__links a {
    font-family:     'Inter', sans-serif !important;
    font-size:       0.875rem !important;
    font-weight:     500 !important;
    color:           #363f5e !important;
    text-decoration: none !important;
    padding:         0.375rem 0.75rem !important;
    border-radius:   6px !important;
    transition:      background-color 0.15s, color 0.15s !important;
}

.pm-mobile-platform__links a:hover {
    background-color: rgba(33,55,184,0.08) !important;
    color:            #2137b8 !important;
}