/*
 * Vanguard skin for Houzez pages (properties, search, agents, dashboard and existing pages).
 * Only fonts, colours and buttons, so Houzez layouts keep working. Colours and fonts come from
 * Vanguard Site → Design (CSS variables printed with this file). Finer colour control for Houzez
 * elements is under Houzez → Theme Options → Styling.
 */
body,
.houzez-body,
.form-control,
.btn,
.dropdown-menu,
.tooltip {
	font-family: var(--sans);
}
body {
	color: var(--ink);
}
h1, h2, h3, h4, h5, h6,
.page-title h1,
.property-title h1,
.item-title,
.item-title a,
.block-title-wrap h2,
.agent-name,
.agent-information .agent-name {
	font-family: var(--serif);
	font-weight: 500;
	letter-spacing: 0.01em;
	color: var(--ink);
}
.item-price,
.item-price-wrap .item-price,
.property-price-wrap .item-price,
.page-title-wrap .item-price,
.price,
.item-sub-price {
	color: var(--brown);
	font-family: var(--sans);
	font-weight: 600;
}
a:hover,
.item-title a:hover,
.breadcrumb a:hover {
	color: var(--gold);
}
.btn-primary,
.btn-primary:focus,
.btn-search,
.houzez-search-button,
.btn-primary-outlined:hover,
.agent-contact-form-wrap .btn-primary,
.property-form-wrap .btn-primary {
	background-color: var(--gold);
	border-color: var(--gold);
	color: #fff;
	border-radius: 999px;
	letter-spacing: 0.04em;
}
.btn-primary:hover,
.btn-search:hover,
.houzez-search-button:hover {
	background-color: var(--ink);
	border-color: var(--ink);
	color: #fff;
}
.btn-primary-outlined {
	border-color: var(--gold);
	color: var(--brown);
	border-radius: 999px;
}
.label-featured,
.label-status,
.hz-label {
	border-radius: 999px;
	letter-spacing: 0.03em;
}
.label-featured {
	background-color: var(--gold);
}
.page-title-wrap,
.property-wrap,
.listing-wrap,
.page-wrap {
	background-color: transparent;
}
body:not(.dashboard-page):not(.page-template-user_dashboard) {
	background-color: var(--paper);
}
.item-wrap .item-body,
.property-detail-wrap,
.block-wrap {
	border-radius: 10px;
}
.item-wrap img,
.listing-image-wrap img {
	border-radius: 10px 10px 0 0;
}

/* ---------- Menus and links: Vanguard brown, gold on hover and for the current page ----------
 * Houzez Theme Options paint links and the header menu light blue (#7ccaee); these rules win over that
 * without !important by being more specific. */
body a,
body .primary-text,
body .btn-clear,
body .breadcrumb a {
	color: var(--brown);
}
body a:hover,
body a:focus,
body .primary-text:hover,
body .breadcrumb a:hover {
	color: var(--ink);
}
body .header-main-wrap .main-nav a.nav-link,
body .header-main-wrap .btn-phone-number a,
body .header-v4 a.nav-link,
body .header-v4 .btn-phone-number a {
	color: var(--ink);
	font-family: var(--sans);
	font-weight: 500;
	letter-spacing: 0.06em;
	transition: color 0.2s ease;
}
body .header-main-wrap .main-nav a.nav-link:hover,
body .header-main-wrap .main-nav a.nav-link:focus,
body .header-main-wrap .main-nav .show > a.nav-link,
body .header-main-wrap .main-nav .current-menu-item > a.nav-link,
body .header-main-wrap .main-nav .current-menu-ancestor > a.nav-link,
body .header-v4 a.nav-link:hover,
body .header-v4 .current-menu-item > a.nav-link,
body .header-v4 .current-menu-ancestor > a.nav-link {
	color: var(--gold);
}
body .header-main-wrap .main-nav .dropdown-menu {
	border-top: 2px solid var(--gold);
	border-radius: 0 0 10px 10px;
}
body .header-main-wrap .main-nav .dropdown-menu a,
body .header-main-wrap .main-nav .dropdown-menu .dropdown-item {
	color: var(--ink);
	font-family: var(--sans);
}
body .header-main-wrap .main-nav .dropdown-menu a:hover,
body .header-main-wrap .main-nav .dropdown-menu .current-menu-item > a {
	color: var(--gold);
	background-color: var(--parchment);
}
/* Mobile menu. */
body .nav-mobile a,
body .offcanvas a,
body .mobile-nav a {
	color: var(--ink);
}
body .nav-mobile a:hover,
body .offcanvas a:hover,
body .mobile-nav a:hover {
	color: var(--gold);
}
/* Buttons keep their own text colour. */
body a.btn-primary,
body a.btn-primary:hover,
body .btn-primary a,
body a.label,
body .label a {
	color: #fff;
}

/* ---------- Blues Houzez hard-codes in css/main.css and css/styling-options.css (not covered by Theme Options) ---------- */
body .header-v4 a:hover,
body .header-v4 a:active,
body .header-main-wrap .main-nav .navbar-nav > li > a.nav-link:hover {
	background-color: rgba(184, 134, 47, 0.08);
}
body .beds-field-wrap .beds-label.beds-label-selected,
body .bath-field-wrap .beds-label.beds-label-selected,
body .search-expandable-label,
body .timeline-list-item.completed::before,
body .unit-plan-accordion-wrap .accordion-header {
	background-color: var(--gold);
}
body .timeline-list-item.completed .timeline-info::before,
body .timeline-info.completed::before {
	background-color: var(--gold);
	border-color: var(--gold);
}
body .property-mortgage-calculator-wrap-v2 .top-form-wrap {
	background-color: rgba(184, 134, 47, 0.1);
	border-color: rgba(184, 134, 47, 0.3);
}
body .property-mortgage-calculator-wrap-v2 .top-form-wrap input {
	border-color: rgba(184, 134, 47, 0.5);
}
body .developer-detail-page-v1 .developer-nav-wrap .nav-link.active,
body .agent-detail-page-v2 .agent-nav-wrap .nav-link.active {
	border-color: var(--gold);
	color: var(--gold);
}
body .agent-detail-page-v2 .listing-tabs .nav-link.active,
body .pointer-text .navbar-nav > .nav-item > a {
	color: var(--gold);
}

/* Map clusters: a gold circle instead of Houzez's blue cluster image (which staging loads from the Houzez demo site). */
body .houzez-osm-cluster,
body .cluster > div,
body .houzez-google-cluster {
	background-image: none !important;
	background-color: var(--gold) !important;
	border-radius: 50%;
	box-shadow: 0 0 0 6px rgba(184, 134, 47, 0.28);
	color: #fff !important;
	font-family: var(--sans);
	font-weight: 600;
}