/* HHM unified Suitability Score component (Badge Unification, 21 Sept 2026).
   One design everywhere: opaque dark tile, bold gold ring, large white percentage centred in the ring,
   tier label in gold caps beneath -- matches .hhm-home's hhm_home_ring() on homepage-v2-preview.
   Selectors are body-prefixed and double-classed so they win over the legacy Customizer "Additional CSS"
   Section 14 glass-chip rules without editing that blob. */
body .hhm-suitability-ring.hhm-suitability-ring{
	--ring-arc:#e8c15a; --ring-label:#e8c15a;
	position:relative; display:flex; flex-direction:column; align-items:center; gap:4px;
	box-sizing:border-box; width:auto; height:auto; padding:8px 10px 7px; margin:0;
	background:#0e1013; border:1px solid rgba(232,193,90,.35); border-radius:12px;
	box-shadow:0 4px 14px rgba(0,0,0,.35); backdrop-filter:none; -webkit-backdrop-filter:none;
	color:#fff; text-align:center; line-height:1;
}
body .hhm-suitability-ring--silver.hhm-suitability-ring{--ring-arc:#d7dbe0;--ring-label:#d7dbe0;border-color:rgba(215,219,224,.35);}
body .hhm-suitability-ring--bronze.hhm-suitability-ring{--ring-arc:#d08a5b;--ring-label:#d08a5b;border-color:rgba(208,138,91,.4);}
body .hhm-suitability-ring .hhm-suitability-ring__dial{position:relative;width:72px;height:72px;flex:0 0 auto;}
body .hhm-suitability-ring .hhm-suitability-ring__svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);overflow:visible;}
body .hhm-suitability-ring .hhm-suitability-ring__track{fill:none;stroke:rgba(242,240,234,.16);stroke-width:8;}
body .hhm-suitability-ring .hhm-suitability-ring__fill{fill:none;stroke:var(--ring-arc);stroke-width:8;stroke-linecap:round;}
body .hhm-suitability-ring .hhm-suitability-ring__percent{
	position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
	font:800 20px/1 inherit;font-family:inherit;color:#fff;letter-spacing:-.02em;text-shadow:none;
}
body .hhm-suitability-ring .hhm-suitability-ring__label{
	display:block;position:static;font:800 9.5px/1.1 inherit;font-family:inherit;color:var(--ring-label);
	text-transform:uppercase;letter-spacing:.09em;text-shadow:none;white-space:nowrap;background:none;padding:0;
}
/* Listing card: sits top-right over the photo as a solid tile, never a translucent blob. */
body .hhm-suitability-ring--card.hhm-suitability-ring{position:absolute;top:10px;right:10px;z-index:5;width:auto;height:auto;padding:6px 8px 5px;}
body .hhm-suitability-ring--card .hhm-suitability-ring__dial{width:54px;height:54px;}
body .hhm-suitability-ring--card .hhm-suitability-ring__percent{font-size:15px;}
body .hhm-suitability-ring--card .hhm-suitability-ring__label{font-size:8px;}
/* Large: listing detail header + Find a Home intro. */
body .hhm-suitability-ring--large.hhm-suitability-ring{width:fit-content;margin:0 0 14px;position:relative;top:auto;right:auto;height:auto;padding:12px 16px 10px;gap:6px;}
body .hhm-suitability-ring--large .hhm-suitability-ring__dial{width:104px;height:104px;}
body .hhm-suitability-ring--large .hhm-suitability-ring__percent{font-size:30px;}
body .hhm-suitability-ring--large .hhm-suitability-ring__label{font-size:12px;}

/* ---- Agent Verified: one shield component everywhere (same SVG as homepage-v2-preview's .hhm-home .hhm-vbadge).
   Listing cards get a slightly larger instance; the label stays legible on the dark/photo background. ---- */
body .hhm-agent-verified-badge.hhm-card-badge{display:inline-flex;align-items:center;justify-content:center;background:#fff;border:0;border-radius:10px;padding:3px 6px 2px;box-shadow:0 2px 8px rgba(0,0,0,.3);width:auto;height:auto;}
/* one shield only, even where two partials render side by side (vendor profile header) */
body .hhm-agent-verified-badge + .hhm-agent-verified-badge{display:none;}
body .hhm-agent-verified-badge.hhm-card-badge .hhm-vbadge{width:38px;}
body .hhm-agent-verified-badge.hhm-card-badge .hhm-vbadge__label{font-size:7.5px;color:#111;}

/* ---- 1c (v2): Find a Home search bar + category pills, matching homepage-v2-preview's language --
   white interior, coloured glow border (Buy green, Rent blue, All Categories / Filter gold), logo before "Search". ---- */
body .hp-form--listing-search.hp-form{position:relative;background:#fff;border:1px solid rgba(20,17,12,.12);border-radius:999px;padding:6px 8px 6px 20px;box-shadow:0 8px 24px rgba(0,0,0,.14);}
body .hp-form--listing-search .hp-form__field--search{position:relative;background:transparent;}
body .hp-form--listing-search .hp-field--search{background:transparent;border:0;box-shadow:none;color:#14110c;font-size:1.05rem;padding-left:0;}
body .hp-form--listing-search .hp-field--search::placeholder{color:transparent;}
/* logo + "Search" label sits inside the input area, before where the visitor types; hidden once typing starts */
body .hp-form--listing-search .hp-form__field--search::before{content:"Search";position:absolute;left:0;top:50%;transform:translateY(-50%);pointer-events:none;
	padding-left:3rem;background:url(/wp-content/uploads/2026/07/search-button-logo.png) no-repeat left center/2.4rem 1.9rem;font-weight:700;font-size:1.15rem;letter-spacing:.015em;color:#14110c;}
body .hp-form--listing-search .hp-form__field--search:has(input:not(:placeholder-shown))::before,
body .hp-form--listing-search .hp-form__field--search:has(input:focus)::before{opacity:0;}
/* submit stays (Enter also submits) but is a quiet round arrow, not a gold block */
body .hp-form--listing-search .hp-form__button{width:44px;height:44px;min-width:0;padding:0;border-radius:50%;color:#fff;border:0;font-size:0;box-shadow:0 4px 12px rgba(0,0,0,.2);position:relative;background:#14110c url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center/22px;}
body .hp-form--listing-search .hp-form__button:hover{filter:brightness(1.4);}

body .hp-form--listing-filter .hp-form__field--radio label,
body .hp-form--listing-filter .hp-form__button{--c:#e8c15a;display:flex;align-items:center;justify-content:flex-start;margin:0 0 10px;padding:.55rem 1.15rem;border-radius:999px;background:#fff;color:#14110c;font-weight:600;
	border:1.5px solid color-mix(in srgb,var(--c) 85%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--c) 30%,transparent),0 4px 18px color-mix(in srgb,var(--c) 40%,transparent);cursor:pointer;transition:box-shadow .2s ease,transform .2s ease;}
body .hp-form--listing-filter .hp-form__button{justify-content:center;width:100%;}
body .hp-form--listing-filter .hp-form__field--radio ul ul li:nth-child(1) label{--c:#45b783;}
body .hp-form--listing-filter .hp-form__field--radio ul ul li:nth-child(2) label{--c:#4f8ff7;}
body .hp-form--listing-filter .hp-form__field--radio label:hover,
body .hp-form--listing-filter .hp-form__button:hover,
body .hp-form--listing-filter .hp-form__field--radio label:has(input:checked){background:#fff;transform:translateY(-1px);
	box-shadow:0 0 0 2px var(--c),0 8px 26px color-mix(in srgb,var(--c) 55%,transparent);}

/* PEA (trainee) status: small L-plate style tag, deliberately not a shield */
body .hhm-training-tag{display:inline-flex;align-items:center;gap:.35rem;margin-left:.5rem;padding:.12rem .55rem .12rem .2rem;border-radius:999px;background:#fff;border:1.5px solid #e8a33a;color:#8a5a08;font-size:.72rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;vertical-align:middle;white-space:nowrap;}
body .hhm-training-tag__l{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;border-radius:3px;background:#e8a33a;color:#fff;font-weight:800;font-size:.8rem;line-height:1;}

/* Firm/REA-level verification: same blue shield, GOLD tick (individual Agent Verified keeps the white tick). */
body .hhm-vbadge--firm .hhm-vbadge__check{stroke:#f2c94c;}
body .hhm-agent-verified-badge .hhm-vbadge--firm .hhm-vbadge__check{stroke:#f2c94c;}