/**
 * Australian address entry.
 *
 * One stylesheet for every address on the site. Laid out as a single line
 * because that is how the address is written — CARLTON VIC 3053 — with the
 * suburb taking the room because it is the part people think in.
 *
 * Written against the theme tokens with fallbacks, so it looks right inside the
 * office, the contractor portal and the public calculator without any of them
 * needing to know about it.
 */

.bm-address {
	--a-ink: var(--bm-text, #0d3164);
	--a-muted: var(--bm-text-muted, #54687f);
	--a-rule: var(--bm-border-interactive, #54687f);
	--a-focus: var(--bm-border-focus, #056a72);
	--a-raised: #fff;
	--a-sunken: var(--bm-surface-sunken, #eff3f7);
	--a-warn: #8a5a00;

	margin-block-end: 0.85rem;
}

.bm-address__legend {
	margin: 0 0 0.5rem;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--a-muted);
}

/* Suburb wide, state narrow, postcode narrow — the shape of the address. */
.bm-address__row {
	display: grid;
	gap: 0.6rem;
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 30rem) {
	.bm-address__row { grid-template-columns: minmax(0, 1fr) 5.5rem 6rem; }
}

.bm-address__field {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	margin: 0;
	min-inline-size: 0;
}

.bm-address__field label {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--a-muted);
}

.bm-address__field input,
.bm-address__field select {
	font: inherit;
	font-size: 0.9375rem;
	padding: 0.65rem 0.9rem;
	border: 1px solid var(--a-rule);
	border-radius: var(--bm-radius-pill, 999px);
	background: var(--a-raised);
	color: var(--a-ink);
	inline-size: 100%;
	box-sizing: border-box;
}

.bm-address__field input:focus-visible,
.bm-address__field select:focus-visible {
	outline: 2px solid var(--a-focus);
	outline-offset: 1px;
	border-color: var(--a-focus);
}

/* --- the listbox ---------------------------------------------------------- */

.bm-address__list {
	position: absolute;
	inset-block-start: 100%;
	inset-inline: 0;
	z-index: 40;
	margin: 0.25rem 0 0;
	padding: 0.25rem;
	list-style: none;
	background: var(--a-raised);
	border: 1px solid var(--bm-border-subtle, #cbd5e0);
	border-radius: 14px;
	box-shadow: 0 12px 32px rgb(6 23 47 / 14%);
	max-block-size: 15rem;
	overflow-y: auto;
}

.bm-address__list[hidden] { display: none; }

.bm-address__option {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.5rem 0.7rem;
	border-radius: 9px;
	cursor: pointer;
	font-size: 0.9375rem;
}

.bm-address__option:hover,
.bm-address__option[aria-selected="true"] {
	background: var(--bm-ink-800, #0d3164);
	color: #fff;
}

.bm-address__option-suburb { font-weight: 600; }

.bm-address__option-meta {
	font-size: 0.8125rem;
	color: var(--a-muted);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.bm-address__option:hover .bm-address__option-meta,
.bm-address__option[aria-selected="true"] .bm-address__option-meta { color: rgb(255 255 255 / 78%); }

/* --- what the postcode turned out to be ----------------------------------- */

.bm-address__status {
	display: block;
	min-block-size: 1.1em;
	font-size: 0.8125rem;
	line-height: 1.35;
	color: var(--a-muted);
}

.bm-address__status[data-warn] { color: var(--a-warn); font-weight: 600; }

.bm-address__hint {
	margin: 0.35rem 0 0;
	font-size: 0.8125rem;
	color: var(--a-muted);
}

/* The status sits under the suburb box, which is where the answer belongs, so
   it must not push the row about as it appears and disappears. */
.bm-address__field--suburb { align-self: start; }

@media (prefers-reduced-motion: reduce) {
	.bm-address * { transition-duration: 0.01ms !important; }
}

/* ============================================================================
 * MOBILE ADAPTATION
 * ============================================================================
 * This file carries the worst defect the audit found, and it is one number.
 *
 * The six controls below are set to 0.9375rem — 15px. iOS Safari zooms the
 * viewport whenever a control under 16px takes focus, and it does not zoom back
 * when focus leaves. The visitor is left part-way through the questionnaire at
 * about 1.3x, with a horizontal scrollbar and a layout they did not ask for,
 * and the only way out is a pinch they have no reason to know about.
 *
 * These are step 2 of the calculator, which is reachable from nine of the ten
 * public templates, and step 3 of the contractor application. So this is not a
 * corner of the site: it is on the primary conversion path and on the
 * recruitment path, and it was measured on the live site rather than inferred.
 *
 * The desktop value is left exactly as it was. 15px is a deliberate visual
 * choice there and nothing about a mouse makes it a problem, so the fix lives
 * inside a max-width query and desktop renders identically.
 * ========================================================================== */

@media (max-width: 79.99rem) {

	.bm-address__field input,
	.bm-address__field select {
		font-size: 1rem;
	}

	/* The suburb list is required — step 2 cannot be passed without picking
	   from it — and each row was about 41px. */
	.bm-address__option {
		min-block-size: var(--bm-tap-min, 2.75rem);
		align-items: center;
		font-size: 1rem;
	}

	/* 15rem of listbox is 240px, and it opens downward from a field that the
	   soft keyboard has already pushed up: on a 320x568 screen with the
	   keyboard showing there are roughly 270px of usable height, so most of the
	   list renders under the keyboard. Bounding it to the dynamic viewport
	   keeps the whole list reachable, and dvh is the unit that tracks the
	   browser chrome instead of ignoring it. */
	.bm-address__list {
		max-block-size: min(15rem, 40dvh);
		overscroll-behavior: contain;
	}
}