/* =============================================================
 * Point4Homes — coming-soon theme overrides
 * Loaded AFTER styles.css so it can override existing rules.
 * Keeps existing layout/markup intact — only swaps colors,
 * fonts, and a handful of paddings/radii to match the
 * Coming Soon page aesthetic.
 * ============================================================= */

:root {
  /* Brand palette */
  --p4h-teal-900: #004D4D;
  --p4h-teal-800: #006565;
  --p4h-teal-700: #007A7A;
  --p4h-teal-600: #008080;
  --p4h-teal-100: #E0F5F5;
  --p4h-teal-50:  #F0FAFA;

  --p4h-sand-50:  #FDFDF0;
  --p4h-sand-100: #F5F5DC;
  --p4h-sand-200: #EFEFD7;
  --p4h-sand-300: #E4E4CC;
  --p4h-sand-800: #3E3E2E;
  --p4h-sand-900: #1B1D0E;

  --p4h-terracotta-600: #BF5025;
  --p4h-terracotta-500: #D4623A;

  --p4h-green-700: #006D3D;
  --p4h-green-100: #97F3B5;

  --p4h-error: #BA1A1A;
  --p4h-white: #FFFFFF;

  /* Semantic aliases */
  --p4h-bg:        var(--p4h-sand-50);
  --p4h-surface:   var(--p4h-white);
  --p4h-text:      var(--p4h-sand-900);
  --p4h-muted:     var(--p4h-sand-800);
  --p4h-border:    var(--p4h-sand-200);
  --p4h-primary:   var(--p4h-teal-800);
  --p4h-primary-h: var(--p4h-teal-700);

  --p4h-font-body:    'DM Sans', system-ui, -apple-system, "Segoe UI", sans-serif;
  --p4h-font-display: 'DM Serif Display', Georgia, serif;
}

/* ---------- Typography ---------- */
body,
.body,
input, select, textarea, button {
  font-family: var(--p4h-font-body) !important;
  color: var(--p4h-text);
}

body, .body { background-color: var(--p4h-bg); }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.heading-1, .heading-2, .heading-3, .heading-4, .heading-5, .heading-6,
.title, .tf-title, .section-title, .heading {
  font-family: var(--p4h-font-display) !important;
  color: var(--p4h-text);
  letter-spacing: -0.01em;
}

/* Dashboard cards / sidebar still want clean sans titles */
.p4h-sidebar h1, .p4h-sidebar h2, .p4h-sidebar h3, .p4h-sidebar h4, .p4h-sidebar h5, .p4h-sidebar h6,
.stat-card .stat-value,
.p4h-card h5, .p4h-card h6,
.widget-box-2 h5, .widget-box-2 h6 {
  font-family: var(--p4h-font-body) !important;
  letter-spacing: 0;
}

/* ---------- Primary color override (was #ED2027) ---------- */
.text-primary,
.text-primary i,
a.text-primary,
.tf-color,
.color-primary {
  color: var(--p4h-primary) !important;
}

a { color: var(--p4h-primary); }
a:hover { color: var(--p4h-primary-h); }

/* Buttons */
.tf-btn,
.btn-primary,
button.btn-primary {
  border-radius: 10px;
  font-weight: 600;
  transition: all .2s ease;
}
/* Base tf-btn (outline style) hover — override red from styles.css */
.tf-btn:hover {
  background-color: var(--p4h-teal-800) !important;
  border-color: var(--p4h-teal-800) !important;
  color: #fff !important;
}
.tf-btn.primary,
.tf-btn.style-1,
.btn-primary,
.tf-btn.bg-primary {
  background-color: var(--p4h-primary) !important;
  border-color: var(--p4h-primary) !important;
  color: #fff !important;
}
.tf-btn.primary:hover,
.tf-btn.style-1:hover,
.btn-primary:hover,
.tf-btn.bg-primary:hover {
  background-color: var(--p4h-primary-h) !important;
  border-color: var(--p4h-primary-h) !important;
  color: #fff !important;
  box-shadow: 0 8px 24px rgba(0,101,101,.18);
}

.tf-btn.style-2,
.tf-btn.btn-line,
.btn-outline-primary {
  background: transparent !important;
  color: var(--p4h-primary) !important;
  border: 1.5px solid var(--p4h-primary) !important;
}
.tf-btn.style-2:hover,
.tf-btn.btn-line:hover,
.btn-outline-primary:hover {
  background: var(--p4h-teal-100) !important;
  color: var(--p4h-teal-900) !important;
}

/* Background utility used in places */
.bg-primary, .bg-1 { background-color: var(--p4h-primary) !important; }
.bg-surface { background-color: var(--p4h-bg) !important; }

/* ---------- Header / nav ---------- */
.main-header,
.main-header.fixed-header {
  background: rgba(253, 253, 240, 0.96) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--p4h-border);
  box-shadow: none;
}
.main-header .navigation > li > a,
.main-menu .navigation > li > a {
  color: var(--p4h-sand-900) !important;
  font-weight: 500;
}
.main-header .navigation > li > a:hover,
.main-header .navigation > li.current > a,
.main-header .navigation > li.active > a,
.main-menu .navigation > li > a:hover {
  color: var(--p4h-primary) !important;
}
.main-header .navigation > li.dropdown2 > a::after,
.main-header .navigation > li.mega-dropdown > a::after {
  color: var(--p4h-primary);
}

/* Mobile menu nav link hover — override red from styles.css */
.mobile-menu .navigation li:hover > a,
.mobile-menu .navigation li.current > a,
.mobile-menu .navigation li.current li.current > a {
  color: var(--p4h-primary) !important;
}

/* Mega menu colors */
.mega-menu, .sub-menu {
  background: var(--p4h-white) !important;
  border: 1px solid var(--p4h-border) !important;
  border-radius: 10px;
  box-shadow: 0 12px 40px rgba(0, 77, 77, 0.08) !important;
}
.mega-menu .mega-col > a,
.mega-menu li > a,
.sub-menu li > a {
  color: var(--p4h-sand-900) !important;
}
.mega-menu .mega-col > a:hover,
.mega-menu li > a:hover,
.sub-menu li > a:hover {
  color: var(--p4h-primary) !important;
}
.mega-menu .mega-list li > a {
  color: var(--p4h-muted) !important;
  opacity: .85;
}
.mega-menu .mega-list li > a:hover {
  color: var(--p4h-primary) !important;
  opacity: 1;
}

/* Logo */
.logo-text { font-family: var(--p4h-font-display) !important; color: var(--p4h-teal-900) !important; letter-spacing: -0.02em; }
.logo-text .accent { color: var(--p4h-primary) !important; }

/* ---------- Property card / listing widget ---------- */
.homeya-box, .box-house, .tf-card {
  border-radius: 14px;
  border: 1px solid var(--p4h-border);
  background: var(--p4h-white);
  transition: all .25s ease;
}
.homeya-box:hover, .box-house:hover, .tf-card:hover {
  border-color: var(--p4h-teal-600);
  box-shadow: 0 12px 40px rgba(0, 101, 101, .10);
  transform: translateY(-2px);
}
.homeya-box .price,
.box-house .price,
.tf-card .price {
  color: var(--p4h-teal-800) !important;
  font-family: var(--p4h-font-display) !important;
}

.flag-tag,
.flag-tag.style-1 {
  background: var(--p4h-teal-100) !important;
  color: var(--p4h-teal-800) !important;
  border-radius: 100px;
  font-weight: 600;
  letter-spacing: .04em;
}
.flag-tag.style-2 {
  background: var(--p4h-terracotta-600) !important;
  color: #fff !important;
}

/* ---------- Hero / banner ---------- */
.tf-section-title .sub-title,
.section-tag,
.sub-heading {
  color: var(--p4h-primary) !important;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 700;
}

/* ---------- Forms ---------- */
.form-control, .nice-select, select.form-control, input.form-control, textarea.form-control {
  border: 1px solid var(--p4h-border);
  border-radius: 10px;
  background: var(--p4h-white);
  color: var(--p4h-text);
}
.form-control:focus, .nice-select:focus {
  border-color: var(--p4h-teal-600);
  box-shadow: 0 0 0 3px rgba(0,101,101,.12);
}

/* ---------- Footer (public) ---------- */
.footer, .footer-1, footer.footer {
  background: var(--p4h-sand-100) !important;
  border-top: 1px solid var(--p4h-border);
  color: var(--p4h-muted);
}
.footer h6, .footer h5, .footer .heading {
  color: var(--p4h-text) !important;
  font-family: var(--p4h-font-body) !important;
  font-weight: 700;
}
.footer a { color: var(--p4h-muted); }
.footer a:hover { color: var(--p4h-terracotta-600); }
.bottom, .footer-bottom {
  border-top: 1px solid var(--p4h-border) !important;
  color: var(--p4h-muted);
}

/* ---------- Pagination ---------- */
.wg-pagination .pagination li a,
.pagination li a {
  border-radius: 8px;
  color: var(--p4h-text);
  border: 1px solid var(--p4h-border);
}
.wg-pagination .pagination li.active a,
.wg-pagination .pagination li a:hover,
.pagination li.active a,
.pagination li a:hover {
  background: var(--p4h-primary) !important;
  color: #fff !important;
  border-color: var(--p4h-primary) !important;
}

/* ---------- Admin dashboard chrome ---------- */
.dashboard, .main-content, .main-content-inner {
  background: var(--p4h-bg);
}
.widget-box-2 {
  background: var(--p4h-white);
  border: 1px solid var(--p4h-border);
  border-radius: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.widget-box-2 h5, .widget-box-2 h6 {
  color: var(--p4h-text);
}

/* Tables in admin */
.dashboard table thead th,
table.table thead th {
  background: var(--p4h-sand-100);
  color: var(--p4h-sand-900);
  font-weight: 600;
  border-bottom: 1px solid var(--p4h-border);
}
.dashboard table tbody td,
table.table tbody td {
  border-color: var(--p4h-border);
}

/* Bootstrap link-button variants used in admin */
.btn-outline-primary {
  --bs-btn-color: var(--p4h-primary);
  --bs-btn-border-color: var(--p4h-primary);
  --bs-btn-hover-bg: var(--p4h-primary);
  --bs-btn-hover-border-color: var(--p4h-primary);
  --bs-btn-active-bg: var(--p4h-primary-h);
  --bs-btn-active-border-color: var(--p4h-primary-h);
}
.btn-success { --bs-btn-bg: var(--p4h-green-700); --bs-btn-border-color: var(--p4h-green-700); }
.btn-danger  { --bs-btn-bg: var(--p4h-error);     --bs-btn-border-color: var(--p4h-error); }

/* Bootstrap badges & alerts harmonized */
.badge.bg-primary { background-color: var(--p4h-primary) !important; }
.badge.bg-success { background-color: var(--p4h-green-700) !important; }
.badge.bg-warning { background-color: #F4A100 !important; color: #1B1D0E !important; }
.badge.bg-danger  { background-color: var(--p4h-error) !important; }

.alert-info, .alert-primary {
  background: var(--p4h-teal-50);
  color: var(--p4h-teal-900);
  border-color: var(--p4h-teal-100);
}
.alert-success { background: #E8F8EE; color: #064d2a; border-color: var(--p4h-green-100); }
.alert-warning { background: #FFF7E0; color: #6b4900; border-color: #FAE3A0; }
.alert-danger  { background: #FDECEC; color: #6b1010; border-color: #F5C2C2; }

/* ---------- Marketplace dashboard (agency/base.html) ---------- */
/* Re-skin --navy / --accent CSS vars to teal palette */
:root {
  --navy: var(--p4h-teal-900);
  --accent: var(--p4h-teal-100);
}
.p4h-sidebar {
  background: var(--p4h-teal-900) !important;
}
.p4h-sidebar .brand {
  font-family: var(--p4h-font-display) !important;
  letter-spacing: -0.02em;
  font-size: 1.25rem !important;
}
.p4h-sidebar .brand span { color: var(--p4h-teal-100) !important; }
.p4h-sidebar nav a { transition: background .15s, color .15s; }
.p4h-sidebar nav a:hover,
.p4h-sidebar nav a.active {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
  border-left: 3px solid var(--p4h-teal-100);
  padding-left: calc(1.5rem - 3px);
}

.p4h-main { background: var(--p4h-bg); }
.stat-card,
.p4h-card {
  background: var(--p4h-white);
  border: 1px solid var(--p4h-border);
  border-radius: 14px;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.stat-card .stat-value {
  color: var(--p4h-teal-800);
  font-family: var(--p4h-font-display) !important;
}
.p4h-topbar { background: var(--p4h-teal-900) !important; }
.p4h-topbar .brand { font-family: var(--p4h-font-display); letter-spacing: -0.02em; }
.p4h-topbar .brand span { color: var(--p4h-teal-100); }

/* Refined status pills */
.status-pill { letter-spacing: .04em; text-transform: uppercase; font-size: .68rem; }
.badge-active            { background:#D8F5E3 !important; color:#064D2A !important; }
.badge-draft             { background:#FFF1C2 !important; color:#6B4900 !important; }
.badge-sold              { background:#FCE2E2 !important; color:#7A1212 !important; }
.badge-archived          { background: var(--p4h-sand-200) !important; color: var(--p4h-muted) !important; }
.badge-pending_approval  { background:#FDE2A0 !important; color:#7A4A00 !important; }
.badge-new               { background: var(--p4h-teal-100) !important; color: var(--p4h-teal-900) !important; }
.badge-contacted         { background:#E2E8FB !important; color:#1F2D6B !important; }
.badge-converted         { background: var(--p4h-green-100) !important; color: var(--p4h-green-700) !important; }
.badge-closed            { background: var(--p4h-sand-200) !important; color: var(--p4h-muted) !important; }

/* =============================================================
 *  Round 2 — sweep remaining red highlights + screenshot fixes
 * ============================================================= */

/* ---------- Footer (was dark; we made it light, fix text colors) ---------- */
.footer .fw-7,
.footer .text-white,
.footer h5, .footer h6,
.footer .footer-cl-1 .text-white,
.footer .footer-cl-2 .text-white,
.footer .footer-cl-3 .text-white,
.footer .footer-cl-4 .text-white {
  color: var(--p4h-sand-900) !important;
  font-family: var(--p4h-font-display) !important;
  font-weight: 400 !important;
  font-size: 1.15rem;
  letter-spacing: -0.01em;
}
.footer .text-variant-2,
.footer .text-variant-1,
.footer .caption-1 {
  color: var(--p4h-muted) !important;
  opacity: .85;
}
.footer .navigation-menu-footer li a,
.footer .navigation-menu-footer li a.text-variant-2 {
  color: var(--p4h-muted) !important;
}
.footer .navigation-menu-footer li a:hover {
  color: var(--p4h-primary) !important;
}
.footer .navigation-menu-footer li a:hover::before,
.footer .navigation-menu-footer li a::before {
  background: var(--p4h-primary) !important;
}
/* Footer social icons */
.footer .box-icon.social,
.footer .box-icon.w-40 {
  background: var(--p4h-white) !important;
  border: 1px solid var(--p4h-border) !important;
  color: var(--p4h-teal-800) !important;
}
.footer .box-icon.social:hover,
.footer .box-icon.w-40.social:hover {
  background: var(--p4h-teal-800) !important;
  border-color: var(--p4h-teal-800) !important;
  color: #fff !important;
}
.footer .box-icon i { color: inherit !important; }
.footer .content-footer-bottom .menu-bottom a {
  color: var(--p4h-muted) !important;
}
.footer .content-footer-bottom .menu-bottom a:hover {
  color: var(--p4h-primary) !important;
}
.footer .copyright { color: var(--p4h-muted) !important; opacity: .7; }
.footer .bottom-footer,
.footer .content-footer-bottom { border-top-color: var(--p4h-border) !important; }

/* "Follow Us" header label */
.footer .content-footer-top, .footer .content-footer-top * { color: var(--p4h-muted) !important; }
.footer .content-footer-top .box-icon { color: var(--p4h-teal-800) !important; }

/* ---------- Scroll-to-top progress button ---------- */
.progress-wrap { background: var(--p4h-white) !important; }
.progress-wrap::after { color: var(--p4h-primary) !important; }
.progress-wrap svg path { stroke: var(--p4h-primary) !important; }

/* ---------- Property type / category icon tiles ---------- */
/* Default tile already light; suppress red active/featured states */
.homeya-categories.style-1 .box-icon,
.homeya-categories.style-1.active .box-icon,
.homeya-categories.style-1:hover .box-icon,
.homeya-categories-v2.active,
.homeya-categories-v2:hover {
  background: var(--p4h-teal-100) !important;
  border-color: var(--p4h-teal-100) !important;
  color: var(--p4h-teal-800) !important;
}
.homeya-categories.style-1.active .box-icon i,
.homeya-categories.style-1:hover .box-icon i,
.homeya-categories.style-1 .box-icon i {
  color: var(--p4h-teal-800) !important;
}
/* Active / hovered category title stays dark */
.homeya-categories.style-1.active .title,
.homeya-categories.style-1:hover .title { color: var(--p4h-sand-900) !important; }

/* Generic box-icon hover (used in many places) */
.box-icon { color: var(--p4h-teal-800); }
.homeya-box .images-group .box-icon,
.wrap-property-v2 .box-inner-right .content-property .pricing-property .box-icon {
  background: rgba(255,255,255,.92) !important;
  color: var(--p4h-teal-800) !important;
}
.homeya-box .images-group .box-icon:hover,
.wrap-property-v2 .box-inner-right .content-property .pricing-property .box-icon:hover,
.box-icon.social:hover,
.contact-info .box .box-social .item:hover {
  background: var(--p4h-teal-800) !important;
  border-color: var(--p4h-teal-800) !important;
  color: #fff !important;
}

/* Compare / favorite badge active state — was yellow gold, keep teal */
.p4h-cmp-btn.cmp-active span { color: var(--p4h-teal-800) !important; }

/* ---------- Carousel / swiper navigation arrows ---------- */
.box-navigation .navigation,
.single-property-gallery .box-navigation .navigation {
  background: var(--p4h-white) !important;
  border: 1px solid var(--p4h-border) !important;
  color: var(--p4h-teal-800) !important;
}
.box-navigation .navigation:hover,
.box-navigation .navigation.swiper-button-disabled,
.single-property-gallery .box-navigation .navigation:hover,
.single-property-gallery .box-navigation .navigation.swiper-button-disabled {
  background: var(--p4h-teal-800) !important;
  border-color: var(--p4h-teal-800) !important;
  color: #fff !important;
}
.sw-pagination .swiper-pagination-bullet-active {
  background-color: var(--p4h-teal-800) !important;
}
.sw-pagination .swiper-pagination-bullet { border-color: var(--p4h-teal-700); }

/* ---------- Single-property overview info icons (Property Type / Bedrooms / Year Built) ---------- */
.single-property-overview .info-box .item .box-icon,
.header-property-detail .content-bottom .icon-box .item .box-icon,
.header-property-detail .content-bottom .icon-box .item,
.flat-slider-detail-v1 .icon-box .item {
  background: var(--p4h-white) !important;
  border: 1px solid var(--p4h-border) !important;
  color: var(--p4h-teal-800) !important;
  border-radius: 12px;
}
.single-property-overview .info-box .item .box-icon i,
.single-property-overview .info-box .item i,
.header-property-detail .content-bottom .icon-box .item i,
.flat-slider-detail-v1 .icon-box .item i {
  color: var(--p4h-teal-800) !important;
}
.single-property-overview .info-box .item:hover .box-icon,
.header-property-detail .content-bottom .icon-box .item:hover,
.flat-slider-detail-v1 .icon-box .item:hover,
.flat-slider-detail-v1 .icon-box .item.active {
  background: var(--p4h-teal-100) !important;
  border-color: var(--p4h-teal-100) !important;
  color: var(--p4h-teal-800) !important;
}

/* ---------- Property card feature icons (bed/bath/m²) ---------- */
.homeya-box .meta-info .item i,
.homeya-box .meta-info .item .icon,
.homeya-box .content-info i,
.homeya-box .content-info .icon,
.box-house i, .box-house .icon,
.tf-card i, .tf-card .icon,
.features-info i, .features-info .icon,
.flat-content-property .meta-info i,
.flat-content-property .meta-info .icon {
  color: var(--p4h-teal-800) !important;
}

/* ---------- Search / Find Properties sidebar ---------- */
.widget-filter-search,
.widget-filter-search.bg-surface,
.flat-filter-form,
.flat-tab-form.widget-filter-search {
  background: var(--p4h-sand-100) !important;
  border: 1px solid var(--p4h-border) !important;
  border-radius: 14px;
}
.widget-filter-search .nav-tab-form .nav-tab-item .nav-link-item.active,
.widget-filter-search .nav-link-item.active,
.flat-tab-form .nav-tab-form.style-3 .nav-link-item.active,
.flat-tab-form .nav-tab-form.style-3 .nav-link-item:hover,
.nav-tab-recommended .nav-link-item.active,
.nav-tab-recommended .nav-link-item:hover {
  background-color: var(--p4h-teal-800) !important;
  color: #fff !important;
}

/* Loan calculator / similar surfaces use bg-surface */
.bg-surface { background: var(--p4h-sand-100) !important; }

/* ---------- Header property detail flag-tag hover ---------- */
.header-property-detail .content-top .flag-tag:hover {
  background: var(--p4h-teal-700) !important;
  color: #fff !important;
}
.flag-tag, .flag-tag.primary, .flag-tag.style-2 { color: var(--p4h-teal-900); }
.flag-tag.primary { background: var(--p4h-teal-100) !important; color: var(--p4h-teal-800) !important; }

/* Single-property text accents (price, "for sale" pill, etc.) */
.single-property-overview .info-box .item .title,
.header-property-detail .content-bottom .icon-box .item .title { color: var(--p4h-teal-800) !important; }
.header-property-detail .price, .single-property-overview .price { color: var(--p4h-teal-800) !important; }

/* ---------- Search box / search form ---------- */
.search-box .search-field:focus { border-color: var(--p4h-teal-600) !important; }
.search-box .btn-search,
.btn-search {
  background: var(--p4h-teal-800) !important;
  border-color: var(--p4h-teal-800) !important;
  color: #fff !important;
}
.btn-search:hover { background: var(--p4h-teal-700) !important; border-color: var(--p4h-teal-700) !important; }

/* ---------- Form inputs (icon at right edge of "Your Name" was red square) ---------- */
.form-contact .icon, .contact-form .icon, .tf-input-icon {
  background: transparent !important; color: var(--p4h-muted) !important;
}
.contact-form button[type=submit],
.form-contact button[type=submit] {
  background: var(--p4h-teal-800) !important;
  color: #fff !important;
  border-color: var(--p4h-teal-800) !important;
}

/* ---------- Tabs / pricing / category-single ---------- */
.flat-categories-single .cate-single-tab li:hover .cate-single-item,
.flat-categories-single .cate-single-tab li.active .cate-single-item {
  border-color: var(--p4h-teal-700) !important;
}
.box-pricing.active, .box-pricing:hover {
  background: var(--p4h-teal-800) !important;
  color: #fff !important;
}
.box-pricing.active *, .box-pricing:hover * { color: #fff !important; }
.box-pricing.active .price, .box-pricing:hover .price { color: var(--p4h-teal-100) !important; }

/* ---------- Misc red sweepers (catch-all) ---------- */
.box-location-v3.active, .box-location-v3:hover,
.box-service.style-2.active .tf-btn, .box-service.style-2:hover .tf-btn,
.box-agent:hover .content .icon-phone,
.box-agent.style-2:hover .tf-btn,
.flat-banner-about .banner-video .btn-video .icon,
.tf-sw-partner .partner-item:hover svg path,
.wd-navigation .nav-item:hover, .wd-navigation .nav-item.active,
.flat-pagination .page-numbers.current, .flat-pagination .page-numbers:hover,
.blog-tag:hover, .blog-tag.primary,
.flat-account .btn-login-social:hover {
  background: var(--p4h-teal-800) !important;
  border-color: var(--p4h-teal-800) !important;
  color: #fff !important;
}
.tf-sw-partner .partner-item:hover svg path { fill: var(--p4h-teal-800) !important; }

.box-service.style-4 .icon-box .icon,
.btn-view .icon,
.box-fieldset label span,
.show-mb span,
.header-account .dropdown-menu .dropdown-item:hover,
.canvas-menu .menu-outer .nav-link.current,
.canvas-menu .menu-outer .nav-link:hover,
.canvas-menu .menu-outer .sub-nav-menu .sub-nav-link.current,
.canvas-menu .menu-outer .sub-nav-menu .sub-nav-link:hover,
.box-agent .box-img .agent-social li:hover .icon,
.single-property-video .img-video .btn-video .icon,
.widget-box-2 .title span {
  color: var(--p4h-primary) !important;
}

/* tab indicator underlines, accent strips */
.flat-tab .nav-tabs .nav-link.active::after,
.tf-tab-content .tab-active::after,
.navigation-menu-footer li a:hover::before { background: var(--p4h-primary) !important; }

/* checkboxes / radios */
.tf-checkbox.primary:checked,
.tf-radio:checked,
.tf-checkbox.primary:checked:after {
  border-color: var(--p4h-primary) !important;
  background-color: var(--p4h-primary) !important;
}

/* mobile nav burger — all three lines (span + ::before/::after) green */
.mobile-button span,
.mobile-button::before,
.mobile-button::after { background-color: var(--p4h-primary) !important; }

/* "for sale" / category chips on cards (FOR SALE / CONDO / 5TH AVENUE) */
.flag-tag, .flag-tag.style-1, .flag-tag.primary {
  background: var(--p4h-teal-100) !important;
  color: var(--p4h-teal-800) !important;
}

/* Loading boxes preloader */
.boxes .box > div { --background: var(--p4h-teal-800) !important; }

/* Editor button row ("Edit Property") already uses .tf-btn primary -> teal */

/* =============================================================
 *  Round 3 — property-detail surface + footer gradient
 * ============================================================= */

/* Property detail header card: was white, blend into page */
.flat-property-detail .header-property-detail,
.header-property-detail {
  background-color: transparent !important;
  box-shadow: none !important;
}
.header-property-detail .content-top { border-color: var(--p4h-border) !important; }
.header-property-detail .content-bottom { border-color: var(--p4h-border) !important; }

/* Single-property overview block — same: blend into page */
.single-property-overview,
.widget-box-header-single,
.widget-box-header-single .single-property-overview {
  background: transparent !important;
}
.flat-property-detail .single-property-overview {
  padding: 24px 0;
}

/* Section page background (most flat-section-* wrappers) */
.flat-property-detail,
.flat-section,
.flat-section-v2,
.flat-section-v3,
.flat-section-v4,
.flat-section-v5,
.flat-section-v6,
.tf-section {
  background: var(--p4h-bg);
}

/* ---------- Footer gradient (subtle, blurred) ----------
   Layered behind the sand-100 base so the colour remains
   readable but the whole strip picks up the warmer,
   atmospheric look of the coming-soon page.            */
.footer, .footer-1, footer.footer {
  position: relative;
  background:
    radial-gradient(60% 80% at 12% 0%, rgba(0, 101, 101, 0.18) 0%, rgba(0, 101, 101, 0) 60%),
    radial-gradient(50% 70% at 95% 100%, rgba(191, 80, 37, 0.12) 0%, rgba(191, 80, 37, 0) 60%),
    radial-gradient(40% 60% at 70% 30%, rgba(0, 77, 77, 0.10) 0%, rgba(0, 77, 77, 0) 70%),
    var(--p4h-sand-100) !important;
  overflow: hidden;
  isolation: isolate;
}
.footer::before {
  content: "";
  position: absolute;
  inset: -40px;
  background:
    radial-gradient(circle at 20% 10%, rgba(0, 77, 77, 0.22), transparent 45%),
    radial-gradient(circle at 80% 90%, rgba(0, 109, 61, 0.14), transparent 50%);
  filter: blur(60px);
  z-index: -1;
  pointer-events: none;
}
.footer .container { position: relative; z-index: 1; }

/* =============================================================
 *  Header user menu (logged-in state)
 * ============================================================= */
.p4h-user-menu { position: relative; display: inline-block; }
.p4h-user-trigger {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 6px 14px 6px 6px;
  background: var(--p4h-white);
  border: 1px solid var(--p4h-border);
  border-radius: 100px;
  cursor: pointer;
  font-family: var(--p4h-font-body);
  color: var(--p4h-text);
  transition: all .2s;
}
.p4h-user-trigger:hover {
  border-color: var(--p4h-teal-600);
  box-shadow: 0 4px 14px rgba(0, 101, 101, .10);
}
.p4h-avatar {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: var(--p4h-teal-100);
  color: var(--p4h-teal-800);
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: .9rem;
  object-fit: cover;
  flex-shrink: 0;
  letter-spacing: 0;
}
.p4h-avatar--admin { background: var(--p4h-sand-900); color: var(--p4h-sand-50); }
img.p4h-avatar { padding: 0; }
.p4h-user-meta {
  display: flex; flex-direction: column; line-height: 1.1;
  text-align: left; max-width: 160px;
}
.p4h-user-name {
  font-weight: 600; font-size: .85rem; color: var(--p4h-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.p4h-user-role {
  font-size: .65rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--p4h-muted); opacity: .8;
}
.p4h-user-caret {
  color: var(--p4h-muted); font-size: .7rem; margin-left: 2px;
}

.p4h-user-dropdown {
  position: absolute; top: calc(100% + 8px); right: 0;
  min-width: 220px;
  background: var(--p4h-white);
  border: 1px solid var(--p4h-border);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 77, 77, 0.10);
  list-style: none; margin: 0; padding: 6px;
  opacity: 0; visibility: hidden;
  transform: translateY(-4px);
  transition: all .18s ease;
  z-index: 1000;
}
.p4h-user-menu.open .p4h-user-dropdown,
.p4h-user-menu:hover .p4h-user-dropdown {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.p4h-user-dropdown li { margin: 0; }
.p4h-user-dropdown a {
  display: block; padding: 9px 14px; border-radius: 8px;
  color: var(--p4h-text) !important; text-decoration: none;
  font-size: .9rem; transition: background .15s;
}
.p4h-user-dropdown a:hover {
  background: var(--p4h-teal-50);
  color: var(--p4h-teal-800) !important;
}

@media (max-width: 768px) {
  .p4h-user-meta { display: none; }
  .p4h-user-trigger { padding: 4px; }
  .p4h-user-caret { display: none; }
  /* Anchor to the right edge of the trigger and cap the width so the
     dropdown never spills past the viewport on small screens. */
  .p4h-user-dropdown {
    right: 0; left: auto;
    min-width: 0;
    width: max-content;
    max-width: calc(100vw - 32px);
  }
}

/* Price + currency unit on the single-property header. Give the currency
   label breathing room and align it to the price baseline so it reads
   "$245,000 USD" instead of being jammed against the figure. */
.header-property-detail .box-price { gap: 6px; }
.header-property-detail .box-price .price-unit {
  align-self: flex-end;
  margin-bottom: 4px;
  font-weight: 600;
  color: var(--p4h-muted);
  letter-spacing: .02em;
}
.header-property-detail .box-price .price-secondary {
  padding-left: 14px;
  color: var(--p4h-muted);
  align-self: flex-end;
  margin-bottom: 3px;
}

/* Listing card price strip — keep the currency label off the figure
   ("$1,800,000 USD" not "$1,800,000USD"). */
.card-price { gap: 5px; }
.card-price .price-unit {
  font-weight: 600;
  color: var(--p4h-muted);
  letter-spacing: .02em;
}

/* Agent card in the single-property "Request More Info" panel — a clean
   centered stack (avatar on top, then name, phone, action links) instead of
   the cramped inline flow. Overrides the generic .box-avatar flex-row rule. */
.single-property-contact .box-avatar.agent-card {
  flex-direction: row;
  align-items: center;
  text-align: left;
  flex-wrap: nowrap;
  gap: 16px;
}
.single-property-contact .box-avatar.agent-card .avatar { flex-shrink: 0; }
.agent-card__info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  min-width: 0;
  flex: 1;
}
.agent-card__name {
  margin-bottom: 0 !important;
  font-weight: 700;
  font-size: 1.15rem;
}
.agent-card__phone {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--p4h-teal-800) !important;
  font-weight: 600;
  text-decoration: none;
}
.agent-card__phone:hover { color: var(--p4h-teal-600) !important; }
.agent-card__phone .icon { font-size: 1rem; }
.agent-card__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-top: 2px;
}
.agent-card__whatsapp {
  display: inline-flex;
  align-items: center;
  background: #25d366;
  color: #fff !important;
  font-size: .78rem;
  font-weight: 600;
  padding: 5px 14px;
  border-radius: 100px;
  text-decoration: none !important;
  line-height: 1;
  transition: filter .18s ease;
}
.agent-card__whatsapp:hover { filter: brightness(.95); }
.agent-card .agent-agency-tag { margin-top: 0; }

/* Agency mini-tag in the single-property "Request More Info" panel */
.agent-agency-tag {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 8px;
  padding: 3px 10px 3px 3px;
  background: var(--p4h-white);
  border: 1px solid var(--p4h-border);
  border-radius: 100px;
  text-decoration: none !important;
  color: var(--p4h-muted) !important;
  font-size: .72rem;
  line-height: 1;
  transition: all .18s ease;
  max-width: 100%;
}
.agent-agency-tag:hover {
  border-color: var(--p4h-teal-600);
  color: var(--p4h-teal-800) !important;
  box-shadow: 0 4px 12px rgba(0,101,101,.10);
}
.agent-agency-tag img,
.agent-agency-tag__fallback {
  width: 22px; height: 22px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--p4h-teal-100);
  color: var(--p4h-teal-800);
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: .7rem;
  flex-shrink: 0;
}
.agent-agency-tag__name {
  font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 180px;
}

/* =============================================================
 *  Round 4 — single-property white card removal + $ icon
 * ============================================================= */

/* The .widget-box-header-single wrapper was the actual white card
   behind both the FEATURES strip and the Overview block. Make it
   blend into the page so the section dividers do the framing. */
.widget-box-header-single {
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Condo-fees uses .icon-dollar which doesn't exist in the icomoon
   set — render a $ glyph instead. */
.icon-dollar { font-family: var(--p4h-font-display); font-style: normal; }
.icon-dollar::before {
  content: "$";
  font-family: var(--p4h-font-display);
  font-weight: 700;
  font-size: 1.4em;
  line-height: 1;
  color: var(--p4h-teal-800);
}

/* The global .info-box rule (styles.css:5192) painted every block
   white. Inside the single-property header + overview we want it to
   blend into the page. */
.header-property-detail .info-box,
.header-property-detail .content-bottom .info-box,
.single-property-overview .info-box,
.single-property-overview .info-box .item {
  background: transparent !important;
  box-shadow: none !important;
}

/* Smaller, better-aligned $ icon for Condo Fees */
.icon-dollar::before {
  font-size: 1.05em;
  font-weight: 800;
  letter-spacing: -0.02em;
}

/* Homepage "Try Searching For" property tiles — recolour the
   animated hover/active fill from red to teal. */
.homeya-categories::before {
  background-color: var(--p4h-teal-800) !important;
}
.homeya-categories.active .icon-box .icon,
.homeya-categories:hover .icon-box .icon,
.homeya-categories.active .content h6,
.homeya-categories.active .content p,
.homeya-categories:hover .content h6,
.homeya-categories:hover .content p {
  color: #fff !important;
}

/* ---------- Home hero: rotating-word caret + subtitle pairing ----------
   The vendor `animate.css` paints a 6px wide #ED2027 (legacy red) bar to
   the right of the rotating word. Slim it to a 2px caret and retune to
   the Point4Homes teal so it matches the rebranded palette.
   The `home-2` subtitle picks up DM Sans 400 by default which reads
   heavy next to the DM Serif Display heading; drop to 300 and tone the
   inline brand name from <b>=700 down to 500. */
.animationtext.clip .cd-words-wrapper::after {
  width: 2px;
  top: 12%;
  height: 76%;
  background-color: var(--p4h-primary);
  border-radius: 1px;
}

.flat-slider.home-2 .slider-content .heading .subtitle {
  font-family: var(--p4h-font-body);
  font-weight: 300;
  letter-spacing: 0;
}
.flat-slider.home-2 .slider-content .heading .subtitle b,
.flat-slider.home-2 .slider-content .heading .subtitle strong {
  font-weight: 500;
}

/* =============================================================
 *  Listing card — agency attribution + image gap fix
 * ============================================================= */

/* The property type chip ("CONDO") is overlaid on the card image. The card
   image is an inline <img>, which leaves a baseline descender gap below it —
   that gap renders as a thin white line at the bottom of the photo. Making
   the image a block element removes the gap. */
.homeya-box .images-style img {
  display: block;
}

/* Small agency badge in the bottom strip of each listing card. */
.p4h-card-agency {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  color: var(--p4h-text);
  text-decoration: none;
  transition: color .2s ease;
}
.p4h-card-agency:hover { color: var(--p4h-primary); }
.p4h-card-agency__avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  background: var(--p4h-sand-100);
  border: 1px solid var(--p4h-border);
}
.p4h-card-agency__avatar--fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  color: var(--p4h-teal-800);
  background: var(--p4h-teal-100);
}
.p4h-card-agency__name {
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---------------------------------------------------------------------------
   Agency / agent "about" rich text (TinyMCE basic formatting output)
   Renders paragraphs and lists from the sanitized about/bio HTML.
--------------------------------------------------------------------------- */
.p4h-about-richtext > :first-child { margin-top: 0; }
.p4h-about-richtext > :last-child  { margin-bottom: 0; }
.p4h-about-richtext p              { margin: 0 0 .85em; }
.p4h-about-richtext ul,
.p4h-about-richtext ol             { margin: 0 0 .85em; padding-left: 1.4em; }
.p4h-about-richtext li             { margin-bottom: .3em; }
.p4h-about-richtext blockquote {
  margin: 0 0 .85em;
  padding-left: 1em;
  border-left: 3px solid var(--p4h-border, #e5e7eb);
  color: var(--p4h-text-muted, #6b7280);
}
