/*
 * AquaNetica Marketplace — browse, single listing, submission form, my listings.
 *
 * VALUES are ported from aquanetica-consultants/consultants.css (which ports
 * them from ocnark's directory.css), so the marketplace is visually one product
 * with /find-a-consultant/ and /directory/: same tokens, 16px card radius,
 * teal-washed banners, 260px sticky filter sidebar, 960/640 breakpoints.
 *
 * CLASS NAMES are namespaced aqnm-* with zero shared selectors — SiteGround
 * Optimizer combines stylesheets, and shared names have already broken the
 * consultant plugin once (see the header of consultants.css). Identical visual
 * language, no shared selector, no generic names.
 *
 * No framework, no build step.
 */

.aqnm-root, .aqnm-root *, .aqnm-root *::before, .aqnm-root *::after {
	box-sizing: border-box;
}

.aqnm-section, .aqnm-listing, .aqnm-form-section, .aqnm-my-listings {
	--c-teal: #15807d;        /* fills */
	--c-teal-ink: #15807d;    /* text — lightens on dark, fills do not */
	--c-teal-hover: #0d6b68;
	--c-bg: #f8fafc;
	--c-surface: #fff;
	--c-border: #e2e8f0;
	--c-card-border: #e6eef0;
	--c-panel-border: #e3eceb;
	--c-border-strong: #cbd5e1;
	--c-heading: #0b1320;
	--c-text: #0f172a;
	--c-body: #475569;
	--c-muted: #64748b;
	--c-chip: #f1f5f9;
	--c-banner: linear-gradient(135deg, #eaf5f4 0%, #d6e9e7 100%);
}

/* ========================================================================
 * Section, header, toolbar — directory parity
 * ===================================================================== */

.aqnm-section { padding: 64px 0; background: var(--c-bg); color: var(--c-text); }
/* ========================================================================
 * THE CONTENT SHELL
 *
 * One gutter scale for every top-level wrapper, matching feed.css exactly, so
 * a member moving between /list-feed/ and /my-account/my-listings/ does not
 * see the content shift sideways.
 *
 * These account sections declared `padding: 32px 0` and took their horizontal
 * margin from whatever wrapped them. Measured on the block theme used for
 * testing that is 14px on a phone; on a theme that supplies none it is zero
 * and the cards sit on the edge of the glass. The gutter is ours to own.
 *
 * width:100%, never 100vw: 100vw includes the desktop scrollbar and overflows
 * the page by its width.
 * ===================================================================== */

.aqnm-root {
	--aqnm-gutter: 16px;
}
@media (min-width: 640px)  { .aqnm-root { --aqnm-gutter: 20px; } }
@media (min-width: 960px)  { .aqnm-root { --aqnm-gutter: 24px; } }
@media (min-width: 1280px) { .aqnm-root { --aqnm-gutter: 32px; } }

.aqnm-section .aqnm-container,
.aqnm-listing-container,
.aqnm-form-wrap,
.aqnm-my-listings,
.aqnm-msg,
.aqnm-ntf-page {
	width: 100%;
	margin-inline: auto;
	padding-inline: var(--aqnm-gutter);
}

@supports (padding: max(0px)) {
	.aqnm-section .aqnm-container,
	.aqnm-listing-container,
	.aqnm-form-wrap,
	.aqnm-my-listings,
	.aqnm-msg,
	.aqnm-ntf-page {
		padding-inline:
			max(var(--aqnm-gutter), env(safe-area-inset-left))
			max(var(--aqnm-gutter), env(safe-area-inset-right));
	}
}

.aqnm-section .aqnm-container { max-width: 1200px; }

.aqnm-dir-header { text-align: center; max-width: 760px; margin: 0 auto 32px; }
.aqnm-dir-eyebrow {
	display: inline-block; font-size: 12px; letter-spacing: .12em;
	text-transform: uppercase; color: var(--c-teal-ink); font-weight: 700;
	margin-bottom: 12px;
}
.aqnm-dir-header h2 { font-size: clamp(28px, 4vw, 40px); line-height: 1.15; margin: 0 0 12px; color: var(--c-heading); }
.aqnm-dir-header p { font-size: 16px; line-height: 1.55; color: var(--c-body); margin: 0; }
.aqnm-dir-cta { margin-top: 18px; }
.aqnm-dir-cta .aqnm-btn { width: auto; padding-left: 22px; padding-right: 22px; }

.aqnm-dir-toolbar {
	display: grid; grid-template-columns: 1fr auto auto;
	gap: 12px; margin-bottom: 24px; align-items: center;
}
.aqnm-dir-search-wrap { position: relative; }
.aqnm-dir-search-icon {
	position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
	color: var(--c-muted); pointer-events: none;
}
.aqnm-dir-search {
	width: 100%; height: 52px; padding: 0 14px 0 40px;
	border: 1px solid var(--c-border); background: var(--c-surface);
	color: var(--c-text); border-radius: 10px; font: inherit; font-size: 15px;
	transition: border-color .15s, box-shadow .15s;
}
.aqnm-dir-search:focus { outline: none; border-color: var(--c-teal); box-shadow: 0 0 0 3px rgba(21,128,125,.15); }
.aqnm-dir-sort {
	height: 44px; border: 1px solid var(--c-border); background: var(--c-surface);
	color: var(--c-text); border-radius: 10px; padding: 0 12px;
	font: inherit; font-size: 14px; cursor: pointer;
}
.aqnm-dir-filter-toggle {
	display: none; align-items: center; gap: 6px; height: 44px; padding: 0 14px;
	background: var(--c-surface); color: var(--c-text);
	border: 1px solid var(--c-border); border-radius: 10px;
	font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
}

.aqnm-dir-layout { display: grid; grid-template-columns: 260px 1fr; gap: 32px; align-items: start; }
.aqnm-dir-main { display: flex; flex-direction: column; }
.aqnm-dir-main > .aqnm-dir-loadmore { align-self: center; }

/* ========================================================================
 * Filters sidebar
 * ===================================================================== */

.aqnm-dir-filters {
	position: sticky; top: 24px;
	background: var(--c-surface); border: 1px solid var(--c-panel-border);
	border-radius: 16px; padding: 20px;
	box-shadow: 0 8px 24px rgba(14,31,51,.05);
	max-height: calc(100vh - 48px); overflow-y: auto;
}
.aqnm-dir-filters-head { display: none; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.aqnm-dir-filters-close {
	background: none; border: 0; font-size: 28px; line-height: 1; cursor: pointer;
	color: var(--c-muted); width: 44px; height: 44px;
}
.aqnm-filter-group { padding: 12px 0; border-top: 1px solid var(--c-chip); border-left: 0; border-right: 0; border-bottom: 0; margin: 0; }
.aqnm-filter-group:first-of-type { padding-top: 0; border-top: 0; }
.aqnm-filter-title {
	font-size: 13.5px; font-weight: 700; text-transform: uppercase;
	letter-spacing: .08em; color: var(--c-text); margin-bottom: 10px; padding: 0;
}
.aqnm-filter-chip {
	display: flex; align-items: center; gap: 8px; padding: 5px 0;
	font-size: 14px; color: var(--c-body); cursor: pointer; line-height: 1.3;
	min-height: 32px;
}
.aqnm-filter-chip input[type=checkbox] { width: 16px; height: 16px; accent-color: var(--c-teal); cursor: pointer; flex-shrink: 0; }
.aqnm-filter-chip:hover span { color: var(--c-teal-ink); }
.aqnm-price-inputs { display: flex; align-items: center; gap: 8px; color: var(--c-muted); }
.aqnm-price-inputs input {
	width: 100%; min-width: 0; height: 40px; padding: 0 10px;
	border: 1px solid var(--c-border); background: var(--c-surface);
	color: var(--c-text); border-radius: 8px; font: inherit; font-size: 14px;
}
.aqnm-price-inputs input:focus { outline: none; border-color: var(--c-teal); box-shadow: 0 0 0 3px rgba(21,128,125,.15); }
.aqnm-dir-clear {
	margin-top: 16px; width: 100%; min-height: 44px;
	background: var(--c-chip); border: 0; color: var(--c-body);
	padding: 10px 14px; border-radius: 8px;
	font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
}
.aqnm-dir-clear:hover { background: var(--c-border); color: var(--c-text); }

/* ========================================================================
 * Cards
 * ===================================================================== */

/*
 * Scan grid (1.3.7): two columns on a phone from ~360px, three at tablet,
 * four on a desktop, so a member sees several listings at once instead of
 * one card per screen. Explicit breakpoints, not auto-fill: auto-fill with a
 * 260px minimum collapsed to a single column at 390 and was the whole
 * problem.
 */
.aqnm-dir-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
@media (min-width: 768px) { .aqnm-dir-grid { gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .aqnm-dir-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
/* Below ~360px two columns stop being legible; one is the honest answer. */
@media (max-width: 359px) { .aqnm-dir-grid { grid-template-columns: minmax(0, 1fr); } }

.aqnm-card {
	display: flex; flex-direction: column;
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-radius: 14px; overflow: hidden; text-decoration: none; color: inherit;
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
	box-shadow: 0 6px 18px rgba(14,31,51,.05);
}
/* The whole card is the link, so it owns the focus ring and the hover. */
.aqnm-card:focus-visible { outline: 2px solid var(--c-teal); outline-offset: 2px; }
.aqnm-root a.aqnm-card, .aqnm-root a.aqnm-card:link,
.aqnm-root a.aqnm-card:visited { color: inherit; text-decoration: none; }
.aqnm-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(15,23,42,.08); border-color: var(--c-border-strong); }

/*
 * DELIBERATE DIVERGENCE from the consultant card's 72px header strip: a
 * listing leads with the item photo, so the band is a 160px photo window with
 * the teal wash underneath as the no-photo fallback — the same mechanism the
 * company card uses for banner images, at equipment-friendly height. The
 * condition ribbon sits bottom-right exactly where "Featured" sits on the
 * other cards.
 */
/*
 * A fixed aspect ratio (not a fixed height) keeps every row aligned at any
 * column count; background-size:cover crops to fill rather than letterboxing.
 */
.aqnm-card-banner {
	position: relative; display: block; width: 100%;
	aspect-ratio: 4 / 3;
	background: var(--c-banner); background-size: cover; background-position: center;
}
.aqnm-card .aqnm-card-ribbon {
	position: absolute; bottom: 8px; right: 8px;
	display: inline-block; width: auto; height: auto;
	background: var(--c-teal); color: #fff;
	font-size: 11px; font-weight: 700; text-transform: uppercase;
	letter-spacing: .05em; padding: 4px 10px; border-radius: 4px;
	box-shadow: 0 2px 6px rgba(0,0,0,.18); line-height: 1.2;
}
.aqnm-card .aqnm-card-ribbon-sold { background: #3730a3; }

.aqnm-card-body {
	padding: 10px 12px 12px; display: flex; flex-direction: column;
	flex: 1 1 auto; gap: 3px; position: relative;
}
/* Two lines maximum, then an ellipsis, so a long title cannot shove the
   price and location out of alignment with the neighbouring card. */
.aqnm-card-name {
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14.5px; font-weight: 700; margin: 0;
	color: var(--c-heading); line-height: 1.3;
}
.aqnm-card-price { margin: 0; font-size: 14.5px; font-weight: 700; color: var(--c-teal-ink); }
.aqnm-card-place {
	margin: 0; font-size: 12.5px; color: var(--c-muted); line-height: 1.35;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.aqnm-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 12px; color: var(--c-muted); margin-bottom: 12px; }
.aqnm-card-country { display: inline-flex; align-items: center; gap: 4px; }
.aqnm-card-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.aqnm-card-tag {
	display: inline-block; background: var(--c-chip); color: var(--c-body);
	font-size: 11px; font-weight: 600; padding: 4px 8px; border-radius: 6px;
}

/* Stacked, full width — the consultant card's action row, verbatim. */
.aqnm-card-actions {
	display: flex; flex-direction: column; gap: 8px;
	margin-top: auto; padding-top: 4px;
}
.aqnm-btn {
	width: 100%; min-height: 44px;
	display: inline-flex; align-items: center; justify-content: center;
	padding: 10px 14px; border-radius: 10px;
	font: inherit; font-size: 13.5px; font-weight: 600; text-align: center;
	text-decoration: none; cursor: pointer; border: 1px solid transparent;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
	transition: background .15s, color .15s, border-color .15s;
}
.aqnm-btn-primary { background: var(--c-teal); border-color: var(--c-teal); color: #fff; }
.aqnm-btn-primary:hover { background: var(--c-teal-hover); border-color: var(--c-teal-hover); color: #fff; }
.aqnm-btn-quiet { background: var(--c-chip); border-color: transparent; color: var(--c-body); }
.aqnm-btn-quiet:hover { background: var(--c-border); color: var(--c-text); }
.aqnm-btn-secondary { background: var(--c-surface); border-color: var(--c-teal-ink); color: var(--c-teal-ink); }
.aqnm-btn-secondary:hover { background: var(--c-teal); border-color: var(--c-teal); color: #fff; }

/* Zero-result capture panel — a next step, not an apology. */
.aqnm-dir-empty {
	padding: 40px 24px; text-align: center; color: var(--c-body);
	background: var(--c-surface); border: 1px dashed var(--c-border-strong);
	border-radius: 14px; margin-top: 16px;
}
.aqnm-dir-empty-lead { margin: 0 0 6px; font-size: 17px; color: var(--c-heading); }
.aqnm-dir-empty-q { display: block; font-size: 14px; color: var(--c-muted); margin-top: 4px; }
.aqnm-dir-empty p { margin: 0 0 18px; }
.aqnm-dir-empty .aqnm-dir-empty-cta { width: auto; padding-left: 22px; padding-right: 22px; }

.aqnm-dir-loadmore {
	display: inline-block; margin: 28px auto 0;
	background: var(--c-teal); color: #fff; border: 0;
	padding: 9px 20px; min-height: 44px;
	font: inherit; font-size: 14px; font-weight: 600; border-radius: 8px;
	cursor: pointer; transition: background .15s, transform .15s;
}
.aqnm-dir-loadmore:hover { background: var(--c-teal-hover); transform: translateY(-1px); }

/* Flex beats [hidden]{display:none}; same override as the other directories. */
.aqnm-section .aqnm-card[hidden],
.aqnm-section .aqnm-dir-loadmore[hidden],
.aqnm-section .aqnm-dir-empty[hidden],
.aqnm-section .aqnm-dir-empty-q[hidden] { display: none !important; }

/* Status + condition badges. */
.aqnm-badge { display: inline-block; border-radius: 6px; padding: 3px 8px; font-size: 11px; font-weight: 700; letter-spacing: .02em; }
.aqnm-badge-live      { background: #dcfce7; color: #166534; }
.aqnm-badge-pending   { background: #fef3c7; color: #92400e; }
.aqnm-badge-sold      { background: #e0e7ff; color: #3730a3; }
.aqnm-badge-expired   { background: #e2e8f0; color: #475569; }
.aqnm-badge-withdrawn { background: #fee2e2; color: #991b1b; }
.aqnm-badge-cond-new          { background: #dcfce7; color: #166534; }
.aqnm-badge-cond-like_new     { background: #dcfce7; color: #166534; }
.aqnm-badge-cond-used_working { background: #e0f2fe; color: #075985; }
.aqnm-badge-cond-for_parts    { background: #fef3c7; color: #92400e; }

.screen-reader-text {
	position: absolute; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px,1px,1px,1px); white-space: nowrap;
}

/*
 * Fine print — the marketplace disclaimers. Muted but readable (--c-muted
 * clears AA at this size on both themes); one or two lines, linking out to
 * the terms rather than pasting legal text inline.
 */
.aqnm-fineprint { font-size: 12.5px; line-height: 1.55; color: var(--c-muted); margin: 0; }
.aqnm-fineprint a, .aqnm-terms-link { color: var(--c-teal-ink); font-weight: 600; text-decoration: none; }
.aqnm-fineprint a:hover, .aqnm-terms-link:hover { text-decoration: underline; }
.aqnm-dir-fineprint { margin-top: 14px; }
.aqnm-form-fineprint { margin: 4px 0 16px; }

/* Back bar on the single listing — plain links, existing type ramp. */
.aqnm-backbar {
	display: flex; align-items: center; justify-content: space-between;
	gap: 12px; margin-bottom: 18px; flex-wrap: wrap;
}
.aqnm-backlink {
	display: inline-flex; align-items: center; gap: 6px; min-height: 44px;
	color: var(--c-body); font-size: 14px; font-weight: 600; text-decoration: none;
}
.aqnm-backlink:hover { color: var(--c-teal-ink); }
.aqnm-backbar .aqnm-terms-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 12.5px; }

/*
 * Visible focus for every interactive element — keyboard users get the same
 * teal affordance everywhere. :focus-visible so mouse clicks stay clean.
 */
.aqnm-root a:focus-visible,
.aqnm-root button:focus-visible,
.aqnm-root input:focus-visible,
.aqnm-root select:focus-visible,
.aqnm-root textarea:focus-visible,
.aqnm-root [role="tab"]:focus-visible {
	outline: 2px solid var(--c-teal); outline-offset: 2px;
}

/* ========================================================================
 * Single listing
 * ===================================================================== */

.aqnm-listing { padding: 48px 0 64px; background: var(--c-bg); color: var(--c-text); }
.aqnm-listing-container { max-width: 1200px; }

.aqnm-listing-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr); gap: 40px; align-items: start; }
.aqnm-listing-main { min-width: 0; }

.aqnm-gallery { margin-bottom: 28px; }
.aqnm-gallery-main {
	border-radius: 16px; overflow: hidden;
	background: var(--c-banner);
	border: 1px solid var(--c-card-border);
}
.aqnm-gallery-main img { width: 100%; height: auto; max-height: 560px; object-fit: contain; display: block; background: var(--c-surface); }
.aqnm-gallery-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.aqnm-gallery-thumb {
	width: 72px; height: 72px; padding: 0; border-radius: 10px; overflow: hidden;
	border: 2px solid transparent; background: var(--c-chip); cursor: pointer;
	flex: none;
}
.aqnm-gallery-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.aqnm-gallery-thumb.is-active { border-color: var(--c-teal); }
.aqnm-gallery-thumb:focus-visible { outline: 2px solid var(--c-teal); outline-offset: 2px; }

.aqnm-listing-head { margin-bottom: 20px; }
.aqnm-listing-title { margin: 0 0 10px; font-size: clamp(26px, 3.4vw, 36px); line-height: 1.15; color: var(--c-heading); font-weight: 700; }
.aqnm-listing-pricebar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.aqnm-listing-price { font-size: 22px; font-weight: 700; color: var(--c-teal-ink); }

.aqnm-listing-facts {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 14px 20px; margin: 0 0 8px; padding: 18px;
	background: var(--c-surface); border: 1px solid var(--c-card-border); border-radius: 14px;
}
.aqnm-listing-facts > div { min-width: 0; }
.aqnm-listing-facts dt {
	font-size: 11px; font-weight: 700; text-transform: uppercase;
	letter-spacing: .06em; color: var(--c-muted); margin: 0 0 2px;
}
.aqnm-listing-facts dd { margin: 0; font-size: 14.5px; color: var(--c-text); overflow-wrap: anywhere; }

.aqnm-listing-main h2 {
	margin: 28px 0 12px; font-size: 20px; font-weight: 700; color: var(--c-heading);
}
.aqnm-listing-desc p { margin: 0 0 14px; line-height: 1.7; color: var(--c-body); font-size: 15.5px; }

.aqnm-listing-side { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 16px; }
.aqnm-seller-card, .aqnm-enquiry-card {
	border: 1px solid var(--c-border); border-radius: 14px;
	background: var(--c-surface); padding: 22px;
	box-shadow: 0 1px 2px rgba(15,23,42,.04);
}
.aqnm-seller-card h2, .aqnm-enquiry-card h2 { margin: 0 0 8px; font-size: 16px; font-weight: 700; color: var(--c-heading); }
.aqnm-seller-name { margin: 0 0 2px; font-size: 17px; font-weight: 700; color: var(--c-text); }
.aqnm-seller-since { margin: 0; font-size: 13px; color: var(--c-muted); }

.aqnm-enquiry-card .aqnm-btn { width: 100%; min-height: 48px; font-size: 14px; margin-top: 8px; }
.aqnm-enquiry-gate-note { margin: 0 0 6px; font-size: 13.5px; color: var(--c-body); line-height: 1.5; }
.aqnm-enquiry-note { margin: 10px 0 0; font-size: 12px; color: var(--c-muted); line-height: 1.5; }

/* --------------------------------------------------------------------------
 * Biosecurity disclosure (1.5.0)
 *
 * Shares the sidebar card shell so it reads as part of the listing, not as a
 * platform annotation. Deliberately no green, no tick, no shield and no
 * status colour: AquaNetica verifies none of this, and any of those would say
 * otherwise. Every value is carried by its WORDS, so the block survives
 * greyscale, dark mode and colour blindness identically.
 * ------------------------------------------------------------------------ */

.aqnm-bio-card {
	border: 1px solid var(--c-border); border-radius: 14px;
	background: var(--c-surface); padding: 22px;
	box-shadow: 0 1px 2px rgba(15,23,42,.04);
}
.aqnm-bio-card h2 { margin: 0 0 10px; font-size: 16px; font-weight: 700; color: var(--c-heading); }
.aqnm-bio-list { display: grid; gap: 12px; margin: 0; }
.aqnm-bio-list > div { min-width: 0; }
.aqnm-bio-list dt {
	font-size: 11px; font-weight: 700; text-transform: uppercase;
	letter-spacing: .06em; color: var(--c-muted); margin: 0 0 2px;
}
.aqnm-bio-list dd { margin: 0; font-size: 14.5px; color: var(--c-text); overflow-wrap: anywhere; }
/* Verbatim liability line. Muted, but never smaller than the fine print
   elsewhere: it has to stay readable to be worth anything. */
.aqnm-bio-disclaimer {
	margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--c-border);
	font-size: 12.5px; line-height: 1.5; color: var(--c-muted);
}

/* Browse facet footnote, same wording as the listing block. */
.aqnm-filter-note { display: block; margin: 6px 0 0; font-size: 12px; line-height: 1.45; color: var(--c-muted); }

/* The submission step. The nudge is the one emphasised line, because the
   thing being encouraged is answering at all. */
.aqnm-bio-intro { margin-top: 0; }
.aqnm-bio-nudge {
	margin: 0 0 18px; padding: 10px 12px;
	font-size: 13.5px; line-height: 1.5; font-weight: 600; color: var(--c-teal-ink);
	background: var(--c-chip); border-radius: 10px;
}
.aqnm-bio-when { margin-bottom: 18px; }
.aqnm-bio-month-row { margin-bottom: 6px; }
.aqnm-bio-never { padding-top: 0; }
.aqnm-bio-restriction legend { line-height: 1.45; }
.aqnm-bio-restriction .aqnm-form-checks { margin-top: 8px; }
.aqnm-filter-chip input[type=radio] { width: 16px; height: 16px; accent-color: var(--c-teal); cursor: pointer; flex-shrink: 0; }
/* A disabled month pair still has to read as present, just inactive. */
.aqnm-bio-month:disabled, .aqnm-bio-year:disabled { opacity: .55; cursor: not-allowed; }
/* .aqnm-form-field sets display:block, which beats the UA [hidden] rule, so
   the conditional reveal needs the same override .aqnm-other-field already
   carries. Without it the field shows before the JS runs, and shows
   permanently with JS off. */
.aqnm-bio-disinfectant[hidden] { display: none !important; }

/* Origin (1.5.1). Same reveal pattern and the same [hidden] override as the
   disinfectant field above: .aqnm-form-row sets display:flex, which beats the
   UA [hidden] rule, so without this the two selects show before the JS runs
   and show permanently with JS off. */
.aqnm-bio-origin { margin-top: 18px; }
.aqnm-bio-origin legend { line-height: 1.45; }
.aqnm-bio-origin-toggle { padding-top: 0; margin-bottom: 10px; }
.aqnm-bio-origin-fields[hidden] { display: none !important; }
.aqnm-bio-origin > small { display: block; margin-top: 6px; font-size: 12px; line-height: 1.45; color: var(--c-muted); }

/* The quiet Phase-3B line under the sidebar cards. */
.aqnm-sourcing-line { margin: 0; font-size: 13.5px; color: var(--c-muted); line-height: 1.55; }
.aqnm-sourcing-line a { color: var(--c-teal-ink); font-weight: 600; text-decoration: none; }
.aqnm-sourcing-line a:hover { text-decoration: underline; }

/* Sold / expired banner. */
.aqnm-listing-closed {
	display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px;
	padding: 18px 20px; margin-bottom: 24px;
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-left: 4px solid var(--c-teal); border-radius: 12px;
}
.aqnm-listing-closed p { margin: 0; flex: 1 1 280px; color: var(--c-body); font-size: 14.5px; line-height: 1.5; }
.aqnm-listing-closed .aqnm-btn { width: auto; padding-left: 18px; padding-right: 18px; }
.aqnm-listing-closed-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* ========================================================================
 * Forms — submission + enquiry, one set of controls
 * ===================================================================== */

.aqnm-form-section { padding: 48px 0 64px; background: var(--c-bg); color: var(--c-text); }
.aqnm-form-wrap { max-width: 760px; }
.aqnm-form-title { margin: 0 0 8px; font-size: clamp(24px, 3vw, 32px); color: var(--c-heading); }
.aqnm-form-sub { margin: 0 0 24px; color: var(--c-body); font-size: 15px; line-height: 1.55; }

.aqnm-form, .aqnm-enquiry-form { display: block; }
.aqnm-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.aqnm-form-price-row { grid-template-columns: 1fr auto auto; align-items: end; }
.aqnm-form-field { display: block; margin: 0 0 16px; }
.aqnm-form-field > span, .aqnm-form-field > legend {
	display: block; font-size: 13.5px; font-weight: 600; color: var(--c-text); margin: 0 0 6px;
}
.aqnm-form-field small { display: block; margin-top: 6px; font-size: 12.5px; color: var(--c-muted); line-height: 1.5; }
.aqnm-form input[type=text], .aqnm-form input[type=number], .aqnm-form input[type=search],
.aqnm-form select, .aqnm-form textarea,
.aqnm-enquiry-form textarea {
	width: 100%; min-height: 46px; padding: 10px 14px;
	border: 1px solid var(--c-border); background: var(--c-surface);
	color: var(--c-text); border-radius: 10px; font: inherit; font-size: 15px;
	transition: border-color .15s, box-shadow .15s;
}
.aqnm-form textarea, .aqnm-enquiry-form textarea { min-height: 0; line-height: 1.55; }
.aqnm-form input:focus, .aqnm-form select:focus, .aqnm-form textarea:focus,
.aqnm-enquiry-form textarea:focus {
	outline: none; border-color: var(--c-teal); box-shadow: 0 0 0 3px rgba(21,128,125,.15);
}
.aqnm-form input[type=file] { width: 100%; min-height: 44px; padding: 11px 0; font-size: 14px; color: var(--c-body); }
.aqnm-form fieldset { border: 0; padding: 0; margin: 0 0 16px; }
.aqnm-form-checks { display: flex; flex-wrap: wrap; gap: 0 18px; }
/* The long tag tail: always visible at desktop, behind the toggle on phones. */
.aqnm-tags-toggle {
	display: none; margin: 6px 0 2px; min-height: 44px; padding: 0 4px;
	background: none; border: 0; color: var(--c-teal-ink);
	font: inherit; font-size: 13.5px; font-weight: 600; cursor: pointer;
	align-items: center;
}
.aqnm-tags-toggle:hover { text-decoration: underline; }
@media (max-width: 640px) {
	.aqnm-tags-toggle:not([hidden]) { display: inline-flex; }
	.aqnm-tags-toggle:not([hidden]) ~ .aqnm-form-checks-more { display: none; }
	.aqnm-tags-toggle:not([hidden]) ~ .aqnm-form-checks-more.is-open { display: flex; }
}
.aqnm-form-offers { align-self: center; padding-bottom: 12px; }
.aqnm-form-hint { margin: -8px 0 16px; font-size: 12.5px; color: var(--c-muted); }
.aqnm-form-submit { width: auto; min-height: 48px; padding-left: 26px; padding-right: 26px; font-size: 14.5px; }

.aqnm-form-photo-grid { display: flex; flex-wrap: wrap; gap: 10px; }
.aqnm-form-photo { width: 96px; text-align: center; font-size: 12px; color: var(--c-body); cursor: pointer; }
.aqnm-form-photo img { width: 96px; height: 96px; object-fit: cover; border-radius: 10px; display: block; margin-bottom: 4px; }
.aqnm-form-photo-remove { display: inline-flex; align-items: center; gap: 4px; }

.aqnm-form-notice { padding: 14px 16px; border-radius: 10px; margin: 0 0 20px; font-size: 14.5px; line-height: 1.5; }
.aqnm-form-notice a { font-weight: 600; }
.aqnm-form-notice-ok  { background: #dcfce7; color: #166534; border: 1px solid #86efac; }
.aqnm-form-notice-ok a { color: #166534; }
.aqnm-form-notice-err { background: #fee2e2; color: #991b1b; border: 1px solid #fca5a5; }

/* ------------------------------------------------------------------------
 * Submitted confirmation
 *
 * This state renders the notice and NOTHING else — no form, no wrap of its
 * own before 1.4.5 — so the section trims its own padding here. Both boxes
 * collapse to their content; the tall grey band on a phone was 112px of
 * section padding around a short card, not a sized container.
 *
 * The three facts are list items so they are three lines on a 390px screen
 * rather than one eight-line paragraph, and the action is a real button:
 * bold text inside a green box does not read as tappable.
 * --------------------------------------------------------------------- */

.aqnm-form-section-done { padding: 32px 0 40px; }

.aqnm-form-done { display: flex; flex-direction: column; gap: 12px; padding: 18px; margin: 0; }
.aqnm-form-done-lead { margin: 0; font-size: 16px; font-weight: 700; line-height: 1.35; }
/* The theme strips list markers, which left the facts indented against
   nothing. Flush with the lead line instead, and role="list" on the element
   keeps the list semantics Safari drops when list-style goes. */
.aqnm-form-done-facts { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.aqnm-form-done-facts li { margin: 0; }

/* Two classes, so this beats `.aqnm-form-notice-ok a` (0,1,1) — which would
   otherwise repaint the button's label the green of the surrounding box. */
.aqnm-form-notice .aqnm-form-done-cta { width: 100%; min-height: 48px; margin-top: 4px; color: #fff; }
.aqnm-form-notice .aqnm-form-done-cta:hover,
.aqnm-form-notice .aqnm-form-done-cta:focus { color: #fff; }

@media (min-width: 641px) {
	.aqnm-form-notice .aqnm-form-done-cta { width: auto; align-self: flex-start; padding-left: 24px; padding-right: 24px; }
}

/* ========================================================================
 * Gate panel — the aqnc gate, re-namespaced
 * ===================================================================== */

.aqnm-gate { display: flex; justify-content: center; }
.aqnm-gate-panel {
	width: 100%; max-width: 520px; text-align: center;
	background: var(--c-surface); border: 1px solid var(--c-panel-border);
	border-radius: 16px; padding: 36px 32px;
	box-shadow: 0 8px 24px rgba(14,31,51,.05);
}
.aqnm-gate-icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 48px; height: 48px; margin-bottom: 16px;
	border-radius: 14px; background: var(--c-chip); color: var(--c-teal-ink);
}
.aqnm-gate-panel h2 { margin: 0 0 8px; font-size: 22px; line-height: 1.25; font-weight: 700; color: var(--c-heading); }
.aqnm-gate-panel p { margin: 0 0 22px; font-size: 15px; line-height: 1.6; color: var(--c-body); }
.aqnm-gate-actions { display: flex; flex-direction: column; gap: 10px; max-width: 320px; margin: 0 auto; }
.aqnm-gate-actions .aqnm-btn { min-height: 48px; font-size: 14.5px; }

/* ========================================================================
 * My listings
 * ===================================================================== */

.aqnm-my-listings { padding-block: 32px 48px; color: var(--c-text); }

/* Status tabs. Words, not colours, carry the state. */
.aqnm-my-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.aqnm-my-tab {
	min-height: 40px; padding: 8px 16px; border-radius: 999px;
	background: var(--c-chip); color: var(--c-body);
	border: 1px solid transparent; font: inherit; font-size: 13.5px;
	font-weight: 600; cursor: pointer;
	transition: background .15s, color .15s, border-color .15s;
}
.aqnm-my-tab:hover { background: var(--c-border); color: var(--c-text); }
.aqnm-my-tab.is-active { background: var(--c-teal); border-color: var(--c-teal); color: #fff; }

.aqnm-my-item[hidden] { display: none !important; }

/* My location card. */
.aqnm-my-location {
	margin-top: 28px; padding: 20px;
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-radius: 14px;
}
.aqnm-my-location h3 { margin: 0 0 6px; font-size: 16px; font-weight: 700; color: var(--c-heading); }
.aqnm-my-location > p { margin: 0 0 14px; font-size: 13.5px; color: var(--c-body); line-height: 1.55; }
.aqnm-location-save { width: auto; padding-left: 18px; padding-right: 18px; }

.aqnm-my-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.aqnm-my-head h2 { margin: 0; font-size: 22px; color: var(--c-heading); }
.aqnm-my-head .aqnm-btn { width: auto; padding-left: 18px; padding-right: 18px; }
.aqnm-my-head-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* Unread enquiries on a listing row — words carry the state, weight draws the eye. */
.aqnm-my-unread { margin: 0 0 4px; font-size: 13.5px; }
.aqnm-my-unread a { color: var(--c-teal-ink); font-weight: 700; text-decoration: none; }
.aqnm-my-unread a:hover { text-decoration: underline; }

/* My Account → Enquiries list. Same card language as everything else. */
.aqnm-enq { color: var(--c-text); }
.aqnm-enq, .aqnm-enq * { box-sizing: border-box; }
.aqnm-enq {
	--c-teal: #15807d; --c-teal-ink: #15807d; --c-teal-hover: #0d6b68;
	--c-surface: #fff; --c-border: #e2e8f0; --c-card-border: #e6eef0;
	--c-heading: #0b1320; --c-text: #0f172a; --c-body: #475569;
	--c-muted: #64748b; --c-chip: #f1f5f9; --c-border-strong: #cbd5e1;
}
.aqnm-enq-heading { margin: 0 0 16px; font-size: 20px; font-weight: 700; color: var(--c-heading); }
.aqnm-enq-list { list-style: none !important; margin: 0; padding: 0 !important; }
.aqnm-enq-item {
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-radius: 14px; padding: 16px 18px; margin: 0 0 12px;
}
.aqnm-enq-item-unread { border-left: 4px solid var(--c-teal); }
.aqnm-enq-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-bottom: 4px; }
.aqnm-enq-listing { font-size: 15px; font-weight: 700; }
.aqnm-enq-listing a { color: var(--c-text); text-decoration: none; }
.aqnm-enq-listing a:hover { color: var(--c-teal-ink); }
.aqnm-enq-meta { margin: 0 0 8px; font-size: 12.5px; color: var(--c-muted); }
.aqnm-enq-message { margin: 0 0 8px; font-size: 14.5px; line-height: 1.6; color: var(--c-body); white-space: pre-wrap; }
.aqnm-enq-hint { margin: 0; font-size: 12px; color: var(--c-muted); }
:root[data-theme="dark"] .aqnm-enq, body.is-dark .aqnm-enq {
	--c-teal-ink: #1a9e9a; --c-surface: #14161a;
	--c-border: rgba(255,255,255,.12); --c-card-border: rgba(255,255,255,.12);
	--c-heading: #f8fafc; --c-text: #f1f5f9; --c-body: #c3ccd8;
	--c-muted: #9aa4b2; --c-chip: rgba(255,255,255,.07);
	--c-border-strong: rgba(255,255,255,.24);
}
:root[data-theme="light"] .aqnm-enq, body.is-light .aqnm-enq {
	--c-teal-ink: #15807d; --c-surface: #fff;
	--c-border: #e2e8f0; --c-card-border: #e6eef0;
	--c-heading: #0b1320; --c-text: #0f172a; --c-body: #475569;
	--c-muted: #64748b; --c-chip: #f1f5f9; --c-border-strong: #cbd5e1;
}
.aqnm-my-empty {
	padding: 24px; border: 1px dashed var(--c-border-strong); border-radius: 12px;
	color: var(--c-muted); margin: 0; text-align: center;
}
.aqnm-my-list { list-style: none !important; margin: 0; padding: 0 !important; }
.aqnm-my-item {
	display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px;
	padding: 14px 0; border-top: 1px solid var(--c-chip);
}
.aqnm-my-item:first-child { border-top: 0; padding-top: 0; }
.aqnm-my-thumb { width: 64px; height: 64px; border-radius: 10px; overflow: hidden; flex: none; background: var(--c-banner); }
.aqnm-my-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.aqnm-my-thumb-empty { display: block; width: 100%; height: 100%; }
.aqnm-my-main { flex: 1 1 240px; min-width: 0; }
.aqnm-my-title { margin: 0 0 4px; font-size: 15.5px; font-weight: 700; color: var(--c-heading); }
.aqnm-my-title a { color: inherit; text-decoration: none; }
.aqnm-my-title a:hover { color: var(--c-teal-ink); }
.aqnm-my-meta { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--c-muted); }
.aqnm-my-side { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.aqnm-my-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.aqnm-my-actions .aqnm-btn { width: auto; min-height: 40px; padding: 8px 14px; font-size: 13px; }
.aqnm-my-actions form { margin: 0; }

/* ========================================================================
 * Responsive — 960 / 640, the directories' own breakpoints
 * ===================================================================== */

@media (max-width: 960px) {
	.aqnm-dir-layout { grid-template-columns: 1fr; }
	.aqnm-dir-toolbar { grid-template-columns: 1fr auto; }
	.aqnm-dir-sort { grid-column: 2; }
	.aqnm-dir-filter-toggle { display: inline-flex; grid-column: 2; grid-row: 1; }
	.aqnm-dir-search-wrap { grid-column: 1 / -1; }
	.aqnm-dir-filters {
		position: fixed; top: 0; left: 0;
		width: min(320px, 88vw); height: 100vh; height: 100dvh; max-height: none;
		border-radius: 0; transform: translateX(-100%);
		transition: transform .25s ease; z-index: 9999;
		box-shadow: 4px 0 24px rgba(0,0,0,.15);
	}
	.aqnm-dir-filters.is-open { transform: translateX(0); }
	.aqnm-dir-filters-head { display: flex; }
	/* Out of flow, not merely overflow:hidden, or iOS scrolls the page behind
	 * the drawer. The JS writes the offset into body.style.top and restores
	 * the scroll on close. */
	body.aqnm-directory-locked {
		position: fixed;
		left: 0;
		right: 0;
		width: 100%;
		overflow: hidden;
	}

	.aqnm-listing-layout { grid-template-columns: 1fr; gap: 28px; }
	.aqnm-listing-side { position: static; }
}

@media (prefers-reduced-motion: reduce) {
	.aqnm-dir-filters { transition: none; }
	.aqnm-card:hover { transform: none; }
	.aqnm-card, .aqnm-btn, .aqnm-dir-loadmore { transition: none; }
}

@media (max-width: 640px) {
	.aqnm-section { padding: 40px 0; }
	.aqnm-dir-toolbar { grid-template-columns: 1fr; }
	.aqnm-dir-sort, .aqnm-dir-filter-toggle, .aqnm-dir-search-wrap { grid-column: 1; }
	/* 16px stops iOS zooming the page on focus — same deviation as aqnc. */
	.aqnm-dir-search, .aqnm-dir-sort,
	.aqnm-form input[type=text], .aqnm-form input[type=number],
	.aqnm-form select, .aqnm-form textarea, .aqnm-enquiry-form textarea { font-size: 16px; }
	.aqnm-card-actions { gap: 10px; padding-top: 6px; }
	.aqnm-btn { min-height: 48px; font-size: 14px; }
	/* 44px touch targets on phones — checkbox rows and the price pair included. */
	.aqnm-filter-chip { min-height: 44px; }
	.aqnm-price-inputs input { height: 44px; }
	.aqnm-my-tab { min-height: 44px; }
	.aqnm-my-actions .aqnm-btn { min-height: 44px; }
	.aqnm-card-body { padding: 10px 11px 12px; }
	.aqnm-card-name { font-size: 14px; }
	.aqnm-card-price { font-size: 14px; }
	.aqnm-card-place { font-size: 12px; }

	.aqnm-listing { padding: 32px 0 48px; }
	.aqnm-gallery-thumb { width: 60px; height: 60px; }
	.aqnm-listing-facts { grid-template-columns: 1fr 1fr; padding: 14px; }
	.aqnm-form-row, .aqnm-form-price-row { grid-template-columns: 1fr; }
	.aqnm-form-offers { padding-bottom: 0; }
	.aqnm-form-submit { width: 100%; }
	.aqnm-gate-panel { padding: 28px 20px; border-radius: 14px; }
	.aqnm-gate-panel h2 { font-size: 20px; }
	.aqnm-gate-actions { max-width: none; }
	.aqnm-my-side { align-items: flex-start; width: 100%; }
	.aqnm-my-actions { width: 100%; }
	.aqnm-my-actions .aqnm-btn { flex: 1 1 auto; }
}

/* ========================================================================
 * Dark
 * ===================================================================== */

/* Explicit theme classes win over the media query, for sites that toggle. */
:root[data-theme="light"] .aqnm-section, :root[data-theme="light"] .aqnm-listing,
:root[data-theme="light"] .aqnm-form-section, :root[data-theme="light"] .aqnm-my-listings,
body.is-light .aqnm-section, body.is-light .aqnm-listing,
body.is-light .aqnm-form-section, body.is-light .aqnm-my-listings {
	--c-teal-ink: #15807d; --c-bg: #f8fafc; --c-surface: #fff;
	--c-border: #e2e8f0; --c-card-border: #e6eef0; --c-panel-border: #e3eceb;
	--c-border-strong: #cbd5e1; --c-heading: #0b1320;
	--c-text: #0f172a; --c-body: #475569; --c-muted: #64748b; --c-chip: #f1f5f9;
	--c-banner: linear-gradient(135deg, #eaf5f4 0%, #d6e9e7 100%);
}
:root[data-theme="dark"] .aqnm-section, :root[data-theme="dark"] .aqnm-listing,
:root[data-theme="dark"] .aqnm-form-section, :root[data-theme="dark"] .aqnm-my-listings,
body.is-dark .aqnm-section, body.is-dark .aqnm-listing,
body.is-dark .aqnm-form-section, body.is-dark .aqnm-my-listings {
	--c-teal-ink: #1a9e9a; --c-bg: #0b0d10; --c-surface: #14161a;
	--c-border: rgba(255,255,255,.12); --c-card-border: rgba(255,255,255,.12);
	--c-panel-border: rgba(255,255,255,.12); --c-border-strong: rgba(255,255,255,.24);
	--c-heading: #f8fafc; --c-text: #f1f5f9; --c-body: #c3ccd8;
	--c-muted: #9aa4b2; --c-chip: rgba(255,255,255,.07);
	--c-banner: linear-gradient(135deg, #17272c 0%, #101c21 100%);
}

/* ========================================================================
 * Form steps (phones): progress header + Back/Next. Desktop shows all
 * steps as sections; these controls stay hidden there.
 * ===================================================================== */

.aqnm-step-heading {
	margin: 26px 0 14px; font-size: 17px; font-weight: 700; color: var(--c-heading);
	padding-top: 18px; border-top: 1px solid var(--c-border);
}
.aqnm-step:first-of-type .aqnm-step-heading { margin-top: 0; padding-top: 0; border-top: 0; }
.aqnm-step[hidden] { display: none !important; }

.aqnm-steps-progress { margin: 0 0 18px; }
.aqnm-steps-progress[hidden] { display: none !important; }
.aqnm-steps-label { margin: 0 0 8px; font-size: 14px; font-weight: 700; color: var(--c-heading); }
.aqnm-steps-bar {
	height: 6px; border-radius: 999px; background: var(--c-chip); overflow: hidden;
}
.aqnm-steps-bar-fill {
	display: block; height: 100%; width: 0; background: var(--c-teal);
	border-radius: 999px; transition: width .2s ease;
}
.aqnm-steps-nav { display: flex; gap: 10px; margin-top: 18px; }
.aqnm-steps-nav[hidden] { display: none !important; }
.aqnm-steps-nav .aqnm-btn { flex: 1 1 auto; min-height: 48px; }
.aqnm-step-back[hidden], .aqnm-step-next[hidden] { display: none !important; }
@media (max-width: 640px) {
	/* One step at a time: the section rule under the heading is noise here. */
	.aqnm-step-heading { border-top: 0; padding-top: 0; margin-top: 0; }
}

/* Draft-restored notice. */
.aqnm-draft-notice {
	display: flex; align-items: center; justify-content: space-between; gap: 10px;
	margin: 0 0 16px; padding: 10px 14px;
	background: var(--c-chip); border: 1px solid var(--c-border); border-radius: 10px;
	font-size: 13.5px; color: var(--c-body);
}
.aqnm-draft-notice[hidden] { display: none !important; }
.aqnm-draft-clear {
	min-height: 44px; padding: 0 12px; background: none; border: 0;
	color: var(--c-teal-ink); font: inherit; font-size: 13px; font-weight: 700;
	cursor: pointer; white-space: nowrap;
}
.aqnm-draft-clear:hover { text-decoration: underline; }

/* ========================================================================
 * Photo strip: instant thumbnails, cover marker, reorder, remove,
 * per-photo progress and per-photo errors.
 * ===================================================================== */

.aqnm-photo-strip {
	display: flex; flex-wrap: wrap; gap: 12px; margin: 4px 0 16px;
}
.aqnm-photo-strip[hidden] { display: none !important; }
.aqnm-strip-item {
	position: relative; width: 132px;
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-radius: 12px; padding: 6px; text-align: center;
}
.aqnm-strip-item img {
	width: 100%; height: 96px; object-fit: cover; border-radius: 8px; display: block;
	background: var(--c-chip);
}
.aqnm-strip-item-error { border-color: #b32d2e; width: 100%; max-width: 280px; }
.aqnm-strip-cover {
	position: absolute; top: 10px; left: 10px;
	background: var(--c-teal); color: #fff;
	font-size: 10px; font-weight: 700; text-transform: uppercase;
	letter-spacing: .05em; padding: 2px 7px; border-radius: 4px;
}
.aqnm-strip-progress {
	display: block; height: 5px; margin: 6px 2px 2px;
	border-radius: 999px; background: var(--c-chip); overflow: hidden;
}
.aqnm-strip-progress span {
	display: block; height: 100%; background: var(--c-teal); border-radius: 999px;
}
.aqnm-strip-error {
	margin: 6px 0 2px; font-size: 12px; line-height: 1.45; color: #b32d2e;
	overflow-wrap: anywhere;
}
.aqnm-strip-controls { display: flex; justify-content: center; gap: 2px; margin-top: 2px; }
.aqnm-strip-btn {
	min-width: 40px; min-height: 44px; padding: 0;
	background: none; border: 0; border-radius: 8px;
	color: var(--c-body); font: inherit; font-size: 16px; font-weight: 700;
	cursor: pointer;
}
.aqnm-strip-btn:hover { background: var(--c-chip); color: var(--c-teal-ink); }

/* ========================================================================
 * Notice card: one calm, dismissible card at the top of the account
 * surfaces. Server-rendered in place, so it never shifts the page.
 * ===================================================================== */

.aqnm-notice-card {
	--c-teal: #15807d; --c-teal-ink: #15807d; --c-teal-hover: #0d6b68;
	--c-surface: #fff; --c-border: #e2e8f0; --c-card-border: #e6eef0;
	--c-heading: #0b1320; --c-text: #0f172a; --c-body: #475569;
	--c-muted: #64748b; --c-chip: #f1f5f9; --c-border-strong: #cbd5e1;
	display: flex; align-items: flex-start; gap: 8px;
	width: 100%; margin: 0 0 20px;
	/* Left edge on the shell gutter so the notice lines up with the cards
	 * below it; the narrow right inset is where the dismiss control sits. */
	padding: 16px 8px 16px var(--aqnm-gutter, 16px);
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-left: 4px solid var(--c-teal); border-radius: 12px;
	color: var(--c-text);
}
.aqnm-notice-main { flex: 1 1 auto; min-width: 0; }
.aqnm-notice-label {
	margin: 0 0 4px; font-size: 11px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase; color: var(--c-teal-ink);
}
.aqnm-notice-text { margin: 0 0 12px; font-size: 14.5px; line-height: 1.5; color: var(--c-body); }
.aqnm-notice-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.aqnm-notice-actions .aqnm-btn {
	width: auto; min-height: 44px; padding-left: 16px; padding-right: 16px; font-size: 13.5px;
	background: var(--c-surface); border: 1px solid var(--c-teal-ink); color: var(--c-teal-ink);
	border-radius: 10px; display: inline-flex; align-items: center; text-decoration: none; font-weight: 600;
}
.aqnm-notice-actions .aqnm-btn:hover { background: var(--c-teal); border-color: var(--c-teal); color: #fff; }
.aqnm-notice-dismiss-form { flex: none; margin: -6px 0 0; }
.aqnm-notice-dismiss {
	width: 44px; height: 44px; padding: 0;
	background: none; border: 0; border-radius: 10px;
	color: var(--c-muted); font-size: 24px; line-height: 1; cursor: pointer;
}
.aqnm-notice-dismiss:hover { background: var(--c-chip); color: var(--c-text); }
.aqnm-notice-dismiss:focus-visible { outline: 2px solid var(--c-teal); outline-offset: 2px; }
@media (max-width: 640px) {
	.aqnm-notice-card { border-radius: 10px; padding: 14px 6px 14px var(--aqnm-gutter, 16px); }
	.aqnm-notice-actions { flex-direction: column; }
	.aqnm-notice-actions .aqnm-btn { width: 100%; justify-content: center; }
}
:root[data-theme="dark"] .aqnm-notice-card, body.is-dark .aqnm-notice-card {
	--c-teal-ink: #1a9e9a; --c-surface: #14161a;
	--c-border: rgba(255,255,255,.12); --c-card-border: rgba(255,255,255,.12);
	--c-heading: #f8fafc; --c-text: #f1f5f9; --c-body: #c3ccd8;
	--c-muted: #9aa4b2; --c-chip: rgba(255,255,255,.07);
	--c-border-strong: rgba(255,255,255,.24);
}
:root[data-theme="light"] .aqnm-notice-card, body.is-light .aqnm-notice-card {
	--c-teal-ink: #15807d; --c-surface: #fff;
	--c-border: #e2e8f0; --c-card-border: #e6eef0;
	--c-heading: #0b1320; --c-text: #0f172a; --c-body: #475569;
	--c-muted: #64748b; --c-chip: #f1f5f9; --c-border-strong: #cbd5e1;
}

/* Dark variants that previously rode in the OS-dark media block, now keyed
 * to the SITE's theme like everything else. */
:root[data-theme="dark"] .aqnm-badge-live, body.is-dark .aqnm-badge-live { background: rgba(34,197,94,.18); color: #86efac; }
:root[data-theme="dark"] .aqnm-badge-pending, body.is-dark .aqnm-badge-pending { background: rgba(245,158,11,.18); color: #fcd34d; }
:root[data-theme="dark"] .aqnm-badge-sold, body.is-dark .aqnm-badge-sold { background: rgba(99,102,241,.20); color: #c7d2fe; }
:root[data-theme="dark"] .aqnm-badge-expired, body.is-dark .aqnm-badge-expired { background: rgba(148,163,184,.18); color: #cbd5e1; }
:root[data-theme="dark"] .aqnm-badge-withdrawn, body.is-dark .aqnm-badge-withdrawn { background: rgba(239,68,68,.18); color: #fca5a5; }
:root[data-theme="dark"] .aqnm-badge-cond-new, body.is-dark .aqnm-badge-cond-new,
:root[data-theme="dark"] .aqnm-badge-cond-like_new, body.is-dark .aqnm-badge-cond-like_new { background: rgba(34,197,94,.18); color: #86efac; }
:root[data-theme="dark"] .aqnm-badge-cond-used_working, body.is-dark .aqnm-badge-cond-used_working { background: rgba(14,165,233,.18); color: #7dd3fc; }
:root[data-theme="dark"] .aqnm-badge-cond-for_parts, body.is-dark .aqnm-badge-cond-for_parts { background: rgba(245,158,11,.18); color: #fcd34d; }
:root[data-theme="dark"] .aqnm-form-notice-ok, body.is-dark .aqnm-form-notice-ok { background: rgba(34,197,94,.14); color: #86efac; border-color: rgba(34,197,94,.35); }
:root[data-theme="dark"] .aqnm-form-notice-ok a, body.is-dark .aqnm-form-notice-ok a { color: #86efac; }
/* The confirmation CTA is a filled teal button, not notice-coloured link text.
   The rule directly above is (0,3,1); this is (0,4,0), so it wins on class
   count. The light-mode override earlier in the file cannot reach this far. */
:root[data-theme="dark"] .aqnm-form-notice .aqnm-form-done-cta,
body.is-dark .aqnm-form-notice .aqnm-form-done-cta { color: #fff; }
:root[data-theme="dark"] .aqnm-form-notice-err, body.is-dark .aqnm-form-notice-err { background: rgba(239,68,68,.14); color: #fca5a5; border-color: rgba(239,68,68,.35); }
:root[data-theme="dark"] .aqnm-strip-error, body.is-dark .aqnm-strip-error { color: #fca5a5; }
:root[data-theme="dark"] .aqnm-strip-item-error, body.is-dark .aqnm-strip-item-error { border-color: rgba(239,68,68,.55); }
:root[data-theme="dark"] .aqnm-card:hover, body.is-dark .aqnm-card:hover { box-shadow: 0 10px 24px rgba(0,0,0,.5); }
:root[data-theme="dark"] .aqnm-gallery-main img, body.is-dark .aqnm-gallery-main img { background: #101316; }
:root[data-theme="dark"] .aqnm-gate-panel, body.is-dark .aqnm-gate-panel { box-shadow: 0 8px 24px rgba(0,0,0,.45); }

/* Sent-enquiries heading gets breathing room below the received list. */
.aqnm-enq-sent-heading { margin-top: 28px; }

/* ========================================================================
 * Edit mode: inline field errors + the save success panel
 * ===================================================================== */

.aqnm-inline-error,
.aqnm-form-field .aqnm-inline-error {
	display: block; margin-top: 6px;
	font-size: 13px; font-weight: 600; line-height: 1.5; color: #b32d2e;
}
:root[data-theme="dark"] .aqnm-inline-error, body.is-dark .aqnm-inline-error,
:root[data-theme="dark"] .aqnm-form-field .aqnm-inline-error, body.is-dark .aqnm-form-field .aqnm-inline-error { color: #fca5a5; }

.aqnm-save-panel {
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-left: 4px solid var(--c-teal); border-radius: 14px;
	padding: 26px 24px;
}
.aqnm-save-headline { margin: 0 0 8px; font-size: 22px; font-weight: 700; color: var(--c-heading); }
.aqnm-save-body { margin: 0 0 18px; font-size: 15px; line-height: 1.6; color: var(--c-body); }
.aqnm-save-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.aqnm-save-actions .aqnm-btn { width: auto; min-height: 48px; padding-left: 20px; padding-right: 20px; }
@media (max-width: 640px) {
	.aqnm-save-panel { padding: 20px 18px; }
	.aqnm-save-actions { flex-direction: column; }
	.aqnm-save-actions .aqnm-btn { width: 100%; }
}

/* ========================================================================
 * Button label lockdown (1.3.3).
 *
 * A member reported the header's List-an-item button rendering as a teal
 * block with an invisible label at rest, legible only on hover, logged in
 * only. The logged-out cascade computes correctly, and the logged-in one
 * (uncombined CSS plus member-only stylesheets) cannot be inspected from
 * outside, so rather than chase the one winning rule, every state of every
 * button variant is pinned here at (0,3,1) specificity: a theme needs an
 * !important or four-deep link selector to take a label from us again. No
 * control may rely on hover to be readable.
 * ===================================================================== */

.aqnm-root a.aqnm-btn.aqnm-btn-primary,
.aqnm-root a.aqnm-btn.aqnm-btn-primary:link,
.aqnm-root a.aqnm-btn.aqnm-btn-primary:visited,
.aqnm-root button.aqnm-btn.aqnm-btn-primary {
	background: var(--c-teal); border-color: var(--c-teal); color: #fff;
}
.aqnm-root a.aqnm-btn.aqnm-btn-primary:hover,
.aqnm-root a.aqnm-btn.aqnm-btn-primary:focus,
.aqnm-root a.aqnm-btn.aqnm-btn-primary:active,
.aqnm-root button.aqnm-btn.aqnm-btn-primary:hover,
.aqnm-root button.aqnm-btn.aqnm-btn-primary:focus,
.aqnm-root button.aqnm-btn.aqnm-btn-primary:active {
	background: var(--c-teal-hover); border-color: var(--c-teal-hover); color: #fff;
}

.aqnm-root a.aqnm-btn.aqnm-btn-secondary,
.aqnm-root a.aqnm-btn.aqnm-btn-secondary:link,
.aqnm-root a.aqnm-btn.aqnm-btn-secondary:visited,
.aqnm-root button.aqnm-btn.aqnm-btn-secondary {
	background: var(--c-surface); border-color: var(--c-teal-ink); color: var(--c-teal-ink);
}
.aqnm-root a.aqnm-btn.aqnm-btn-secondary:hover,
.aqnm-root a.aqnm-btn.aqnm-btn-secondary:focus,
.aqnm-root a.aqnm-btn.aqnm-btn-secondary:active,
.aqnm-root button.aqnm-btn.aqnm-btn-secondary:hover,
.aqnm-root button.aqnm-btn.aqnm-btn-secondary:focus,
.aqnm-root button.aqnm-btn.aqnm-btn-secondary:active {
	background: var(--c-teal); border-color: var(--c-teal); color: #fff;
}

.aqnm-root a.aqnm-btn.aqnm-btn-quiet,
.aqnm-root a.aqnm-btn.aqnm-btn-quiet:link,
.aqnm-root a.aqnm-btn.aqnm-btn-quiet:visited,
.aqnm-root button.aqnm-btn.aqnm-btn-quiet {
	background: var(--c-chip); border-color: transparent; color: var(--c-body);
}
.aqnm-root a.aqnm-btn.aqnm-btn-quiet:hover,
.aqnm-root a.aqnm-btn.aqnm-btn-quiet:focus,
.aqnm-root a.aqnm-btn.aqnm-btn-quiet:active,
.aqnm-root button.aqnm-btn.aqnm-btn-quiet:hover,
.aqnm-root button.aqnm-btn.aqnm-btn-quiet:focus,
.aqnm-root button.aqnm-btn.aqnm-btn-quiet:active {
	background: var(--c-border); border-color: transparent; color: var(--c-text);
}

/* ========================================================================
 * Stepped create form at every width (1.3.4).
 *
 * The wizard now runs on phone, tablet and desktop alike, one code path.
 * Wide screens get the steps ROOM rather than a stretched phone layout:
 * a narrower measure, generous vertical rhythm, and Back/Next pinned to
 * the bottom of the step so they are reachable without scrolling past a
 * long field set.
 * ===================================================================== */

@media (min-width: 641px) {
	/* Comfortable reading measure for a single-purpose step. */
	.aqnm-form[data-edit-mode] .aqnm-step { max-width: none; }
	.aqnm-form:not([data-edit-mode]) .aqnm-step {
		max-width: 640px; margin-left: auto; margin-right: auto;
	}
	.aqnm-form:not([data-edit-mode]) .aqnm-steps-progress,
	.aqnm-form:not([data-edit-mode]) .aqnm-steps-nav,
	.aqnm-form:not([data-edit-mode]) .aqnm-draft-notice {
		max-width: 640px; margin-left: auto; margin-right: auto;
	}
	/* One step at a time reads better with air around it. */
	.aqnm-form:not([data-edit-mode]) .aqnm-step-heading { font-size: 20px; margin-bottom: 20px; }
	.aqnm-form:not([data-edit-mode]) .aqnm-form-field { margin-bottom: 22px; }
	.aqnm-form:not([data-edit-mode]) .aqnm-steps-nav { margin-top: 24px; }
	/* Buttons sit side by side with room; never full-bleed on a wide screen. */
	.aqnm-form:not([data-edit-mode]) .aqnm-steps-nav .aqnm-btn {
		/* width:auto is load-bearing: .aqnm-btn is width:100% by default,
		   which would stretch a lone Next across the whole step. */
		width: auto; flex: 0 1 auto; min-width: 160px;
	}
	.aqnm-form:not([data-edit-mode]) .aqnm-step-next { margin-left: auto; }
}

/* The Other-category capture. */
.aqnm-other-field[hidden] { display: none !important; }

/* Enquiry rows: the remembered title of a deleted listing, and the
   per-member hide control. */
.aqnm-enq-gone { color: var(--c-muted); font-weight: 600; }
.aqnm-enq-hide-form { margin: 10px 0 0; }
.aqnm-enq .aqnm-btn.aqnm-enq-hide {
	width: auto; min-height: 44px; padding: 8px 14px; font-size: 13px;
}

/* ========================================================================
 * Share control (1.3.5)
 *
 * One button, two behaviours: the OS share sheet on a phone, clipboard on
 * a desktop. The confirmation is WORDS in a live region beside it, never a
 * colour change or an icon swap.
 * ===================================================================== */

.aqnm-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.aqnm-share .aqnm-btn.aqnm-share-btn {
	width: auto; min-height: 44px; padding: 8px 16px;
	display: inline-flex; align-items: center; gap: 8px;
	font-size: 13.5px;
}
.aqnm-share-said {
	font-size: 13px; font-weight: 600; color: var(--c-teal-ink); line-height: 1.4;
}
/* On the listing page the control sits under the sidebar cards. */
.aqnm-share-listing { margin: 0 0 4px; }
/* In a My Listings row it joins the existing action cluster. */
.aqnm-share-row { display: inline-flex; }
.aqnm-my-actions .aqnm-share-row .aqnm-btn { min-height: 44px; }
@media (max-width: 640px) {
	.aqnm-share-row { width: 100%; }
	.aqnm-my-actions .aqnm-share-row .aqnm-btn { width: 100%; justify-content: center; }
}

/* ========================================================================
 * Messaging — thread list, thread view, reply box, report control (1.4.0)
 *
 * Same token block as .aqnm-enq, which this replaces, so the surface did not
 * change colour when the model underneath it did.
 *
 * Site theme only, never prefers-color-scheme: the OS media query is what
 * produced a light page under a dark panel in 1.3.0.
 * ===================================================================== */

.aqnm-msg {
	--c-teal: #15807d; --c-teal-ink: #15807d; --c-teal-hover: #0d6b68;
	--c-surface: #fff; --c-border: #e2e8f0; --c-card-border: #e6eef0;
	--c-heading: #0b1320; --c-text: #0f172a; --c-body: #475569;
	--c-muted: #64748b; --c-chip: #f1f5f9; --c-border-strong: #cbd5e1;
	--c-mine: #eef6f6;
	--c-warn-bg: #fffbeb; --c-warn-border: #fde68a; --c-warn-text: #78350f;
}
:root[data-theme="dark"] .aqnm-msg, body.is-dark .aqnm-msg {
	--c-teal-ink: #1a9e9a; --c-surface: #14161a;
	--c-border: rgba(255,255,255,.12); --c-card-border: rgba(255,255,255,.12);
	--c-heading: #f8fafc; --c-text: #f1f5f9; --c-body: #c3ccd8;
	--c-muted: #9aa4b2; --c-chip: rgba(255,255,255,.07);
	--c-border-strong: rgba(255,255,255,.24);
	--c-mine: rgba(26,158,154,.12);
	--c-warn-bg: rgba(245,158,11,.12); --c-warn-border: rgba(245,158,11,.34); --c-warn-text: #fcd34d;
	color-scheme: dark;
}
:root[data-theme="light"] .aqnm-msg, body.is-light .aqnm-msg {
	--c-teal-ink: #15807d; --c-surface: #fff;
	--c-border: #e2e8f0; --c-card-border: #e6eef0;
	--c-heading: #0b1320; --c-text: #0f172a; --c-body: #475569;
	--c-muted: #64748b; --c-chip: #f1f5f9; --c-border-strong: #cbd5e1;
	--c-mine: #eef6f6;
	--c-warn-bg: #fffbeb; --c-warn-border: #fde68a; --c-warn-text: #78350f;
}

.aqnm-msg-heading { margin: 0 0 16px; font-size: 20px; font-weight: 700; color: var(--c-heading); }

/* --- Buying / Selling tabs --- */
.aqnm-msg-tabs {
	display: flex; flex-wrap: wrap; gap: 8px;
	margin: 0 0 18px; border-bottom: 1px solid var(--c-border);
}
.aqnm-msg-tabs a.aqnm-msg-tab,
.aqnm-msg-tabs a.aqnm-msg-tab:link,
.aqnm-msg-tabs a.aqnm-msg-tab:visited {
	display: inline-flex; align-items: center; gap: 8px;
	min-height: 44px; padding: 10px 16px;
	border: 1px solid transparent; border-bottom: none;
	border-radius: 10px 10px 0 0;
	font-size: 14.5px; font-weight: 600; color: var(--c-body);
	text-decoration: none; margin-bottom: -1px;
}
.aqnm-msg-tabs a.aqnm-msg-tab:hover,
.aqnm-msg-tabs a.aqnm-msg-tab:focus { color: var(--c-teal-ink); background: var(--c-chip); }
.aqnm-msg-tabs a.aqnm-msg-tab-on,
.aqnm-msg-tabs a.aqnm-msg-tab-on:link,
.aqnm-msg-tabs a.aqnm-msg-tab-on:visited {
	background: var(--c-surface); color: var(--c-teal-ink);
	border-color: var(--c-border); border-bottom: 1px solid var(--c-surface);
}
/* Unread stated in words, never a bare number in a dot. */
.aqnm-msg-tab-new {
	display: inline-block; padding: 2px 8px; border-radius: 6px;
	background: #fef3c7; color: #92400e; font-size: 11px; font-weight: 700;
}
:root[data-theme="dark"] .aqnm-msg-tab-new, body.is-dark .aqnm-msg-tab-new {
	background: rgba(245,158,11,.18); color: #fcd34d;
}

/* --- Thread list --- */
.aqnm-th-list { list-style: none !important; margin: 0; padding: 0 !important; }
.aqnm-th-item {
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-radius: 14px; margin: 0 0 12px; overflow: hidden;
}
.aqnm-th-item-unread { border-left: 4px solid var(--c-teal); }
.aqnm-th-list a.aqnm-th-link,
.aqnm-th-list a.aqnm-th-link:link,
.aqnm-th-list a.aqnm-th-link:visited {
	display: block; padding: 16px 18px; min-height: 44px;
	text-decoration: none; color: var(--c-text);
}
.aqnm-th-list a.aqnm-th-link:hover,
.aqnm-th-list a.aqnm-th-link:focus { background: var(--c-chip); }
.aqnm-th-head {
	display: flex; flex-wrap: wrap; align-items: center;
	justify-content: space-between; gap: 8px 12px;
}
.aqnm-th-title {
	font-size: 15px; font-weight: 700; color: var(--c-text);
	overflow-wrap: anywhere;
}
.aqnm-th-party { display: block; margin-top: 4px; font-size: 12.5px; color: var(--c-muted); }
.aqnm-th-preview {
	display: block; margin-top: 8px; font-size: 14px; line-height: 1.55;
	color: var(--c-body); overflow-wrap: anywhere;
}
.aqnm-th-when { display: block; margin-top: 8px; font-size: 12px; color: var(--c-muted); }

/* --- Thread view --- */
.aqnm-th-back { margin: 0 0 14px; font-size: 14px; }
.aqnm-th-back a { color: var(--c-teal-ink); text-decoration: none; font-weight: 600; }
.aqnm-th-back a:hover { text-decoration: underline; }

.aqnm-th-listing {
	display: flex; gap: 14px; align-items: flex-start;
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-radius: 14px; padding: 14px 16px; margin: 0 0 14px;
}
.aqnm-th-thumb { flex: 0 0 auto; line-height: 0; }
.aqnm-th-thumb img { width: 72px; height: 72px; object-fit: cover; border-radius: 10px; display: block; }
.aqnm-th-listing-text { min-width: 0; }
.aqnm-th-listing-title { margin: 0 0 6px; font-size: 15.5px; font-weight: 700; overflow-wrap: anywhere; }
.aqnm-th-listing-title a { color: var(--c-text); text-decoration: none; }
.aqnm-th-listing-title a:hover { color: var(--c-teal-ink); }
.aqnm-th-listing-meta { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.aqnm-th-listing-price { font-size: 14px; font-weight: 700; color: var(--c-teal-ink); }

/* The safety notice. Permanent, not dismissible, no close control. */
.aqnm-th-safety {
	display: block; margin: 0 0 16px; padding: 12px 14px;
	background: var(--c-warn-bg); border: 1px solid var(--c-warn-border);
	border-radius: 12px; color: var(--c-warn-text);
	font-size: 13px; line-height: 1.55;
}
.aqnm-th-safety-label { font-weight: 700; }

/* Load earlier: a plain link, never a scroller. */
.aqnm-msg-earlier { margin: 0 0 12px; text-align: center; }
.aqnm-msg-earlier .aqnm-btn { width: auto; }

/* --- Messages --- */
.aqnm-msg-list { list-style: none !important; margin: 0 0 18px; padding: 0 !important; }
.aqnm-msg-item {
	border: 1px solid var(--c-card-border); border-radius: 14px;
	padding: 12px 14px; margin: 0 0 10px; max-width: 85%;
	background: var(--c-surface);
}
.aqnm-msg-theirs { margin-right: auto; }
.aqnm-msg-mine { margin-left: auto; background: var(--c-mine); border-color: var(--c-border); }
.aqnm-msg-new { border-left: 4px solid var(--c-teal); }
.aqnm-msg-meta {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px;
	margin: 0 0 6px; font-size: 12px; color: var(--c-muted);
}
.aqnm-msg-who { font-weight: 700; color: var(--c-body); }
.aqnm-msg-body {
	font-size: 14.5px; line-height: 1.6; color: var(--c-text);
	/* Long unbroken strings, typically a pasted URL, must wrap rather than
	   push the thread sideways. URLs are plain text here on purpose. */
	overflow-wrap: anywhere;
}

/* --- Reply box ---
 * Deliberately NOT sticky or fixed. A pinned composer is what breaks when
 * the iOS keyboard opens: the visual viewport shrinks, a fixed bar lands
 * under the keyboard and the send button becomes unreachable. In normal flow
 * the browser scrolls the focused field into view and Send stays beneath it.
 */
.aqnm-reply {
	background: var(--c-surface); border: 1px solid var(--c-card-border);
	border-radius: 14px; padding: 16px; margin: 0 0 16px;
}
.aqnm-reply .aqnm-btn { width: auto; }

/*
 * Inputs are styled HERE, not inherited.
 *
 * The existing field rules are keyed to .aqnm-form / .aqnm-enquiry-form, so a
 * new surface gets browser defaults: a white box with black text sitting on a
 * dark page. Caught in verification at 390 dark. Any future messaging surface
 * with an input must be added to this selector list.
 */
.aqnm-reply textarea,
.aqnm-report-form select,
.aqnm-report-form textarea {
	width: 100%; min-height: 46px; padding: 10px 14px;
	border: 1px solid var(--c-border); background: var(--c-surface);
	color: var(--c-text); border-radius: 10px; font: inherit; font-size: 15px;
	transition: border-color .15s, box-shadow .15s;
}
.aqnm-reply textarea, .aqnm-report-form textarea { min-height: 0; line-height: 1.55; }
.aqnm-reply textarea:focus,
.aqnm-report-form select:focus,
.aqnm-report-form textarea:focus {
	outline: none; border-color: var(--c-teal); box-shadow: 0 0 0 3px rgba(21,128,125,.15);
}
.aqnm-msg .aqnm-form-field > span {
	display: block; font-size: 13.5px; font-weight: 600; color: var(--c-text); margin: 0 0 6px;
}

/* --- Archive control, and the archived-thread note (1.4.1) --- */
.aqnm-th-actions {
	display: flex; flex-wrap: wrap; gap: 8px;
	padding: 0 18px 14px; margin-top: -6px;
}
.aqnm-th-actions-foot { padding: 0; margin: 0 0 12px; }
.aqnm-th-archive-form, .aqnm-th-delete-form { margin: 0; }
/* Destructive, so it reads as destructive on hover rather than looking like
   its neighbour. Not red at rest: the resting state is a quiet row action. */
.aqnm-th-actions .aqnm-th-delete:hover,
.aqnm-th-actions .aqnm-th-delete:focus {
	background: #fee2e2; color: #991b1b;
}
:root[data-theme="dark"] .aqnm-th-actions .aqnm-th-delete:hover,
body.is-dark .aqnm-th-actions .aqnm-th-delete:hover,
:root[data-theme="dark"] .aqnm-th-actions .aqnm-th-delete:focus,
body.is-dark .aqnm-th-actions .aqnm-th-delete:focus {
	background: rgba(239,68,68,.18); color: #fca5a5;
}
.aqnm-th-actions .aqnm-btn { width: auto; min-height: 44px; font-size: 13.5px; }
.aqnm-th-archived-note {
	margin: 0 0 14px; padding: 10px 14px;
	background: var(--c-chip); border-radius: 10px;
	color: var(--c-body); font-size: 13px; line-height: 1.55;
}

/* --- Privacy line above the reply box ---
 * Sits above the field so it can still change what someone types, and is
 * quiet enough not to compete with the safety notice at the top of the thread.
 */
.aqnm-reply-privacy {
	margin: 0 0 8px; font-size: 12.5px; line-height: 1.55; color: var(--c-muted);
}

/* --- Report control --- */
.aqnm-report { margin: 16px 0 0; }
.aqnm-report .aqnm-report-toggle {
	display: inline-flex; align-items: center; min-height: 44px;
	padding: 10px 0; cursor: pointer;
	font-size: 13.5px; font-weight: 600; color: var(--c-muted);
}
.aqnm-report .aqnm-report-toggle:hover { color: var(--c-teal-ink); }
.aqnm-report-form {
	border: 1px solid var(--c-card-border); border-radius: 12px;
	padding: 14px 16px; margin-top: 6px; background: var(--c-surface);
}
.aqnm-report-form .aqnm-btn { width: auto; }

/* ========================================================================
 * Structured quote card — RFQ threads
 *
 * Presentation of meta the feed vertical already stores. It carries four
 * commercial values and a supplier name; it has never carried an address for
 * either party, and it must not start.
 * ===================================================================== */

.aqnm-quote-card {
	border: 1px solid var(--c-panel-border); border-left: 3px solid var(--c-teal);
	border-radius: 12px; background: var(--c-surface);
	padding: 16px 18px; margin: 0 0 16px;
}
.aqnm-quote-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin: 0 0 12px; }
.aqnm-quote-label {
	font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
	color: #fff; background: var(--c-teal); border-radius: 999px; padding: 3px 10px;
}
.aqnm-quote-who { font-size: 14px; font-weight: 600; color: var(--c-body); }
.aqnm-quote-rows { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; margin: 0; }
.aqnm-quote-rows > div {
	display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
	padding: 8px 0; border-top: 1px solid var(--c-chip);
}
.aqnm-quote-rows dt { font-size: 13.5px; color: var(--c-muted); }
.aqnm-quote-rows dd {
	margin: 0; font-size: 14.5px; font-weight: 700; color: var(--c-text);
	text-align: right; font-variant-numeric: tabular-nums;
}
.aqnm-quote-note { font-size: 12.5px; line-height: 1.5; color: var(--c-muted); margin: 12px 0 0; }

/* ========================================================================
 * NOTIFICATIONS (1.7.0) — bell, panel, page
 *
 * The bell replaces the 1.4.1 badge in the same header slot, beside Ask and
 * Account. Everything here is scoped to its own class prefix so it cannot
 * reach into the theme header it is a guest in.
 * ===================================================================== */

/*
 * THE BELL LIVES OUTSIDE .aqnm-root.
 *
 * Everything else this plugin renders sits inside a .aqnm-root container and
 * inherits its box-sizing reset. The bell does not: it is injected into the
 * theme's own header, so it needs its own. Without this the mobile sheet's
 * 1px border pushed it to 392px in a 390px viewport and clipped two pixels
 * off the right edge. Found by measuring, not by reading.
 */
.aqnm-bell-wrap, .aqnm-bell-wrap *, .aqnm-bell-wrap *::before, .aqnm-bell-wrap *::after {
	box-sizing: border-box;
}

.aqnm-bell-wrap { position: relative; display: inline-flex; }

/* 44px square at every size. A header control that is comfortable on a
 * desktop and 32px on a phone is the usual way this goes wrong. */
.aqnm-bell {
	position: relative; display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0;
	background: none; border: 0; border-radius: 999px;
	color: inherit; cursor: pointer; line-height: 0;
}
.aqnm-bell:hover { color: var(--c-teal, #15807d); }
.aqnm-bell:focus-visible { outline: 2px solid var(--c-teal, #15807d); outline-offset: 2px; }
.aqnm-bell-icon { display: block; }

/* A NUMBER, never a bare coloured dot: a dot says something is waiting
 * without saying how much, and says nothing at all to a screen reader. */
.aqnm-bell-pill {
	position: absolute; top: 2px; right: 0;
	min-width: 18px; height: 18px; padding: 0 5px;
	display: inline-flex; align-items: center; justify-content: center;
	background: #b3261e; color: #fff; border-radius: 999px;
	font-size: 11px; font-weight: 700; line-height: 1;
	font-variant-numeric: tabular-nums;
}
.aqnm-bell-pill[hidden] { display: none !important; }

.aqnm-bell-panel {
	position: absolute; top: calc(100% + 8px); right: 0; z-index: 1000;
	/* No vw cap. 100vw includes the desktop scrollbar, and the cap could
	 * never bind anyway: below 640 the panel becomes a full-width sheet, and
	 * above it 360px always fits inside 608px of room. */
	width: 360px;
	background: var(--c-surface, #fff); color: var(--c-text, #0f172a);
	border: 1px solid var(--c-border, #e2e8f0); border-radius: 14px;
	box-shadow: 0 16px 40px rgba(15,23,42,.16);
	overflow: hidden;
}
.aqnm-bell-panel[hidden] { display: none !important; }
.aqnm-bell-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--c-chip, #f1f5f9); }
.aqnm-bell-title { margin: 0; font-size: 15px; font-weight: 700; }
.aqnm-bell-close { width: 44px; height: 44px; margin: -12px -12px -12px 0; border: 0; background: none; font-size: 24px; line-height: 1; color: var(--c-muted, #64748b); cursor: pointer; }
.aqnm-bell-close:focus-visible { outline: 2px solid var(--c-teal, #15807d); outline-offset: -2px; }
.aqnm-bell-body { max-height: 60vh; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.aqnm-bell-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px; border-top: 1px solid var(--c-chip, #f1f5f9); }
.aqnm-bell-readall, .aqnm-bell-all {
	min-height: 44px; display: inline-flex; align-items: center;
	background: none; border: 0; padding: 0;
	font: inherit; font-size: 13.5px; font-weight: 600;
	color: var(--c-teal-ink, #15807d); text-decoration: none; cursor: pointer;
}
.aqnm-bell-readall:focus-visible, .aqnm-bell-all:focus-visible { outline: 2px solid var(--c-teal, #15807d); outline-offset: 2px; border-radius: 4px; }

/* ---- Items, shared by the panel and the page ---- */

.aqnm-ntf-list { list-style: none; margin: 0; padding: 0; }
.aqnm-ntf-item { border-bottom: 1px solid var(--c-chip, #f1f5f9); }
.aqnm-ntf-item:last-child { border-bottom: 0; }
.aqnm-ntf-link { display: block; padding: 12px 16px; text-decoration: none; color: inherit; }
.aqnm-ntf-link:hover { background: var(--c-chip, #f1f5f9); }
.aqnm-ntf-link:focus-visible { outline: 2px solid var(--c-teal, #15807d); outline-offset: -2px; }
.aqnm-ntf-summary { display: block; font-size: 14.5px; line-height: 1.4; color: var(--c-text, #0f172a); }
.aqnm-ntf-item.is-unread .aqnm-ntf-summary { font-weight: 700; }
.aqnm-ntf-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; font-size: 12.5px; color: var(--c-muted, #64748b); }
.aqnm-ntf-source { font-weight: 600; }
/* Unread is a WORD as well as a weight. Neither the colour nor the boldness
 * is load-bearing on its own. */
.aqnm-ntf-new {
	font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
	background: var(--c-teal, #15807d); color: #fff; border-radius: 3px; padding: 2px 6px;
}
.aqnm-ntf-empty { margin: 0; padding: 24px 16px; text-align: center; font-size: 14px; color: var(--c-muted, #64748b); }

/* ---- The full page ---- */

.aqnm-ntf-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
.aqnm-ntf-filter {
	min-height: 44px; display: inline-flex; align-items: center; gap: 6px; padding: 0 16px;
	border: 1px solid var(--c-border, #e2e8f0); border-radius: 999px;
	background: var(--c-surface, #fff); color: var(--c-body, #475569);
	font-size: 14px; font-weight: 600; text-decoration: none;
}
.aqnm-ntf-filter.is-active { background: var(--c-teal, #15807d); border-color: var(--c-teal, #15807d); color: #fff; }
.aqnm-ntf-filter:focus-visible { outline: 2px solid var(--c-teal, #15807d); outline-offset: 2px; }
.aqnm-ntf-filter-count { font-variant-numeric: tabular-nums; font-weight: 700; }
.aqnm-ntf-page .aqnm-ntf-list { border: 1px solid var(--c-border, #e2e8f0); border-radius: 14px; overflow: hidden; background: var(--c-surface, #fff); }

@media (max-width: 640px) {
	.aqnm-msg-item { max-width: 100%; }
	/*
	 * On a phone the popover becomes a bottom sheet. A 360px dropdown pinned
	 * to the right of a 390px viewport is a cramped column with nowhere to go;
	 * a sheet gets the full width and its own scroll.
	 */
	.aqnm-bell-panel {
		position: fixed; top: auto; right: 0; bottom: 0; left: 0;
		width: 100%; max-width: none;
		border-radius: 16px 16px 0 0;
		padding-bottom: env(safe-area-inset-bottom, 0px);
		max-height: 80vh; display: flex; flex-direction: column;
	}
	.aqnm-bell-body { max-height: none; flex: 1 1 auto; }
	/*
	 * LOCKING THE PAGE BEHIND THE SHEET.
	 *
	 * overflow:hidden on body does not stop iOS Safari scrolling the page
	 * behind a fixed sheet; only taking body out of flow does. The offset the
	 * JS writes into body.style.top is what stops that from teleporting the
	 * reader to the top, and it is restored on close. Same pair as the feed
	 * filter drawer, for the same reason.
	 */
	body.aqnm-bell-open {
		position: fixed;
		left: 0;
		right: 0;
		width: 100%;
		overflow: hidden;
	}
	.aqnm-quote-rows { grid-template-columns: 1fr; }
	/*
	 * Three tabs plus an unread phrase do not fit 390. Wrapping put Archived
	 * on a centred second line, which read as a mistake rather than a tab, so
	 * the row scrolls sideways inside itself instead. The words stay (a bare
	 * number would be the thing this release is trying not to do) and the
	 * page itself still never scrolls horizontally.
	 */
	.aqnm-msg-tabs { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
	.aqnm-msg-tabs::-webkit-scrollbar { display: none; }
	.aqnm-msg-tabs a.aqnm-msg-tab { flex: 0 0 auto; justify-content: center; }
	/* The FORM is the flex item, not the button inside it. Setting the button
	   to 100% alone sizes it against a shrink-to-fit form, which is how this
	   rendered at ~206px instead of full width. Both have to stretch. */
	.aqnm-th-actions .aqnm-th-archive-form,
	.aqnm-th-actions .aqnm-th-delete-form { width: 100%; }
	.aqnm-th-actions .aqnm-btn { width: 100%; }
	.aqnm-th-thumb img { width: 56px; height: 56px; }
	.aqnm-reply .aqnm-btn, .aqnm-report-form .aqnm-btn { width: 100%; }
}

/* ========================================================================
 * RFQ marketplace (1.8.0): request-a-quote card, technical documents,
 * specifications, video link. Same tokens as everything above.
 * ===================================================================== */

.aqnm-badge-cond-refurbished { background: #e0f2f1; color: #0f5132; }

.aqnm-rfq-card {
	background: var(--c-surface); border: 1px solid var(--c-panel-border); border-radius: 16px;
	padding: 20px; margin: 0 0 16px;
}
.aqnm-rfq-card h2 { margin: 0 0 12px; font-size: 17px; color: var(--c-heading); }
.aqnm-rfq-btn.aqnm-btn { display: flex; width: 100%; min-height: 52px; font-size: 15.5px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; }
.aqnm-rfq-note { margin: 12px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--c-body); }

.aqnm-listing-specs { display: grid; gap: 0; margin: 0 0 24px; border: 1px solid var(--c-border); border-radius: 12px; overflow: hidden; }
.aqnm-listing-specs > div { display: grid; grid-template-columns: minmax(120px, 38%) 1fr; gap: 12px; padding: 10px 14px; border-top: 1px solid var(--c-border); font-size: 14px; }
.aqnm-listing-specs > div:first-child { border-top: 0; }
.aqnm-listing-specs > div:nth-child(odd) { background: var(--c-chip); }
.aqnm-listing-specs dt { margin: 0; color: var(--c-muted); font-weight: 600; }
.aqnm-listing-specs dd { margin: 0; color: var(--c-text); overflow-wrap: anywhere; }
.aqnm-listing-specs .aqnm-spec-plain { grid-template-columns: 1fr; }

.aqnm-video-line { margin: 0 0 24px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.aqnm-video-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 1px solid var(--c-teal); border-radius: 999px; color: var(--c-teal-ink); font-weight: 600; font-size: 14px; text-decoration: none; }
.aqnm-video-link:hover { background: var(--c-teal); color: #fff; }
.aqnm-video-hint { font-size: 12.5px; color: var(--c-muted); }

.aqnm-docs { margin: 0 0 24px; }
.aqnm-docs h2 { margin: 0 0 12px; }
.aqnm-doc-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.aqnm-doc { margin: 0; }
.aqnm-doc-link {
	display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 10px 14px;
	border: 1px solid var(--c-border); border-radius: 12px; background: var(--c-surface);
	color: var(--c-text); text-decoration: none; font-size: 14px;
}
a.aqnm-doc-link:hover { border-color: var(--c-teal); }
.aqnm-doc-icon { flex: 0 0 auto; color: var(--c-teal-ink); display: inline-flex; }
.aqnm-doc-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.aqnm-doc-type { font-weight: 700; color: var(--c-heading); }
.aqnm-doc-name { font-size: 13px; color: var(--c-body); overflow-wrap: anywhere; }
.aqnm-doc-meta { flex: 0 0 auto; font-size: 12px; color: var(--c-muted); white-space: nowrap; }
.aqnm-doc-locked .aqnm-doc-link { background: var(--c-chip); color: var(--c-muted); border-style: dashed; }
.aqnm-doc-locked .aqnm-doc-icon { color: var(--c-muted); }
.aqnm-doc-unlock { display: inline-block; margin: 6px 0 0 44px; font-size: 13px; font-weight: 600; color: var(--c-teal-ink); }
.aqnm-doc-note { margin: 10px 0 0; font-size: 12.5px; color: var(--c-muted); }

@media (max-width: 640px) {
	.aqnm-listing-specs > div { grid-template-columns: 1fr; gap: 2px; }
	.aqnm-doc-meta { display: none; }
	.aqnm-doc-unlock { margin-left: 0; }
}

/* The RFQ form page: product panel, legends, terms, honeypot, confirmation. */
.aqnm-rfq-product {
	display: flex; gap: 16px; align-items: flex-start; margin: 0 0 24px; padding: 16px;
	border: 1px solid var(--c-panel-border); border-radius: 16px; background: var(--c-surface);
}
.aqnm-rfq-product-photo { flex: 0 0 96px; width: 96px; height: 96px; border-radius: 10px; overflow: hidden; background: var(--c-chip); }
.aqnm-rfq-product-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.aqnm-rfq-product-facts { flex: 1 1 auto; min-width: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.aqnm-rfq-product-facts > div { min-width: 0; }
.aqnm-rfq-product-facts > div:first-child { grid-column: 1 / -1; }
.aqnm-rfq-product-facts dt { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--c-muted); }
.aqnm-rfq-product-facts dd { margin: 2px 0 0; font-size: 14px; color: var(--c-text); overflow-wrap: anywhere; }
.aqnm-rfq-product-facts dd a { color: var(--c-teal-ink); font-weight: 600; text-decoration: none; }
.aqnm-form-legend { display: block; margin: 8px 0 12px; font-size: 16px; font-weight: 700; color: var(--c-heading); }
.aqnm-rfq-terms { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.5; color: var(--c-text); }
.aqnm-rfq-terms input { flex: 0 0 auto; width: 20px; height: 20px; margin: 2px 0 0; }
.aqnm-rfq-terms a { color: var(--c-teal-ink); font-weight: 600; }
.aqnm-rfq-terms.is-invalid { color: #b32d2e; }
.aqnm-rfq-form [aria-invalid="true"] { border-color: #b32d2e !important; box-shadow: 0 0 0 3px rgba(179, 45, 46, .15); }
.aqnm-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.aqnm-rfq-number { margin: 0 0 12px; font-size: 18px; font-weight: 700; color: var(--c-teal-ink); }
.aqnm-rfq-submit.aqnm-btn { text-transform: uppercase; letter-spacing: .02em; font-weight: 700; }

@media (max-width: 640px) {
	.aqnm-rfq-product { padding: 14px; }
	.aqnm-rfq-product-photo { flex-basis: 72px; width: 72px; height: 72px; }
	.aqnm-rfq-product-facts { grid-template-columns: 1fr; gap: 6px; }
	.aqnm-rfq-submit.aqnm-btn { width: 100%; }
}

/* The buyer's quote page. */
.aqnm-rq-card { margin: 0 0 20px; padding: 20px; border: 1px solid var(--c-panel-border); border-radius: 16px; background: var(--c-surface); }
.aqnm-rq-rows { margin: 0; display: grid; gap: 0; }
.aqnm-rq-rows > div { display: grid; grid-template-columns: minmax(120px, 36%) 1fr; gap: 12px; padding: 10px 0; border-top: 1px solid var(--c-border); font-size: 15px; }
.aqnm-rq-rows > div:first-child { border-top: 0; padding-top: 0; }
.aqnm-rq-rows dt { margin: 0; color: var(--c-muted); font-weight: 600; font-size: 13.5px; }
.aqnm-rq-rows dd { margin: 0; color: var(--c-text); overflow-wrap: anywhere; }
.aqnm-rq-rows .aqnm-rq-total { background: var(--c-chip); margin: 4px -20px 0; padding: 12px 20px; border-top: 0; border-radius: 0; }
.aqnm-rq-rows .aqnm-rq-total dt { color: var(--c-heading); font-size: 15px; }
.aqnm-rq-rows .aqnm-rq-total dd { font-size: 20px; font-weight: 800; color: var(--c-teal-ink); }
.aqnm-rq-pdf { margin: 16px 0 0; }
.aqnm-rq-statement { margin: 16px 0 0; padding: 12px 14px; border-radius: 10px; background: #fff8e6; border: 1px solid #f3dfa5; color: #6b4e00; font-size: 13.5px; line-height: 1.5; }
.aqnm-rq-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 20px; }
.aqnm-rq-actions .aqnm-btn { min-height: 52px; padding-left: 26px; padding-right: 26px; font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; }
.aqnm-rq-accept-note { flex: 1 0 100%; margin: 4px 0 0; font-size: 13px; line-height: 1.5; color: var(--c-body); }
.aqnm-ask { margin: 0 0 20px; border: 1px solid var(--c-border); border-radius: 12px; background: var(--c-surface); }
.aqnm-ask-summary { cursor: pointer; padding: 14px 16px; font-weight: 700; color: var(--c-heading); list-style: none; }
.aqnm-ask-summary::-webkit-details-marker { display: none; }
.aqnm-ask-summary::before { content: "+"; display: inline-block; width: 20px; color: var(--c-teal-ink); }
.aqnm-ask[open] .aqnm-ask-summary::before { content: "\2013"; }
.aqnm-ask-form { padding: 0 16px 16px; }
@media (max-width: 640px) {
	.aqnm-rq-card { padding: 16px; }
	.aqnm-rq-rows > div { grid-template-columns: 1fr; gap: 2px; }
	.aqnm-rq-rows .aqnm-rq-total { margin-left: -16px; margin-right: -16px; padding-left: 16px; padding-right: 16px; }
	.aqnm-rq-actions .aqnm-btn { width: 100%; }
}

/* ========================================================================
 * 1.8.1: EVERY control in the listing-page enquiry card and on the RFQ and
 * quote forms gets the plugin's field box.
 *
 * The 1.4.0 rules were keyed to the input types the wizard used (text,
 * number, search) and to the enquiry card's textarea alone. Anything else
 * fell through to the browser default: a 143px inset box at 13.3px, which
 * iOS zooms on focus. The live site's "Request a price" card injects a
 * name and an email input into .aqnm-enquiry-card client-side, and the RFQ
 * form uses email, tel and date inputs; all of them landed there.
 *
 * Attribute selectors, not a type list: the rule covers whatever control a
 * future card puts in. Hidden, checkbox, radio and file inputs are the
 * only exclusions. 16px at EVERY breakpoint on these two surfaces, so a
 * phone never zooms; the wizard keeps its own sizing.
 * ===================================================================== */

.aqnm-enquiry-card input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]),
.aqnm-enquiry-card select, .aqnm-enquiry-card textarea,
.aqnm-enquiry-form input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]),
.aqnm-enquiry-form select, .aqnm-enquiry-form textarea,
.aqnm-rfq-form input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]),
.aqnm-rfq-form select, .aqnm-rfq-form textarea,
.aqnm-ask-form input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=file]),
.aqnm-ask-form select, .aqnm-ask-form textarea {
	display: block; width: 100%; max-width: 100%; box-sizing: border-box;
	min-height: 46px; padding: 10px 14px; margin: 0;
	border: 1px solid var(--c-border); border-radius: 10px; background: var(--c-surface);
	color: var(--c-text); font: inherit; font-size: 16px; line-height: 1.4;
	-webkit-appearance: none; appearance: none;
	transition: border-color .15s, box-shadow .15s;
}
.aqnm-enquiry-card textarea, .aqnm-enquiry-form textarea, .aqnm-rfq-form textarea, .aqnm-ask-form textarea { line-height: 1.55; resize: vertical; }
.aqnm-enquiry-card select, .aqnm-rfq-form select, .aqnm-ask-form select {
	padding-right: 38px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
	background-repeat: no-repeat; background-position: right 14px center;
}
.aqnm-enquiry-card input:focus, .aqnm-enquiry-card select:focus, .aqnm-enquiry-card textarea:focus,
.aqnm-enquiry-form input:focus, .aqnm-enquiry-form select:focus, .aqnm-enquiry-form textarea:focus,
.aqnm-rfq-form input:focus, .aqnm-rfq-form select:focus, .aqnm-rfq-form textarea:focus,
.aqnm-ask-form input:focus, .aqnm-ask-form select:focus, .aqnm-ask-form textarea:focus {
	outline: none; border-color: var(--c-teal); box-shadow: 0 0 0 3px rgba(21, 128, 125, .15);
}
.aqnm-enquiry-card input[type=file], .aqnm-rfq-form input[type=file] { width: 100%; min-height: 44px; padding: 10px 0; font-size: 16px; color: var(--c-body); }
.aqnm-enquiry-card .aqnm-form-field { margin: 0 0 14px; }
.aqnm-enquiry-card .aqnm-form-field > span { display: block; margin: 0 0 6px; font-size: 13.5px; font-weight: 600; color: var(--c-text); }
/* The site-level price-request feedback box lives inside the card too. */
.aqnm-enquiry-card .aqn-price-feedback { margin: 0 0 12px; padding: 12px 14px; border-radius: 10px; background: #e8f5f0; color: #0f5132; font-size: 14px; line-height: 1.5; }
.aqnm-enquiry-card .aqn-price-feedback.is-error { background: #fde8e8; color: #991b1b; }
.aqnm-enquiry-card .aqn-price-feedback p { margin: 4px 0 0; }

/* 1.8.2: the attachments control is a real button, and the theme's page
 * title stays out of the RFQ pages (they carry their own heading). */
.aqnm-rfq-form input[type=file] { padding: 6px 0; min-height: 48px; line-height: 1.4; }
.aqnm-rfq-form input[type=file]::file-selector-button,
.aqnm-rfq-form input[type=file]::-webkit-file-upload-button {
	-webkit-appearance: none; appearance: none; cursor: pointer;
	margin: 0 12px 0 0; padding: 0 18px; min-height: 40px;
	border: 1px solid var(--c-teal); border-radius: 999px; background: var(--c-surface);
	color: var(--c-teal-ink); font: inherit; font-size: 14px; font-weight: 600;
	transition: background-color .15s, color .15s;
}
.aqnm-rfq-form input[type=file]::file-selector-button:hover,
.aqnm-rfq-form input[type=file]::-webkit-file-upload-button:hover { background: var(--c-teal); color: #fff; }
.aqnm-rfq-form input[type=file]:focus-visible { outline: 3px solid rgba(21, 128, 125, .3); outline-offset: 2px; border-radius: 8px; }
body.aqnm-notitle .page-header, body.aqnm-notitle .entry-header > .entry-title:empty { display: none; }
/* 1.10.0: themes that print a fallback ("Untitled") for an emptied title. Only on
   pages whose own renderer carries the h1 (the RFQ pages and the market doors). */
body.aqnm-notitle.page .entry-header { display: none; }

/* ========================================================================
 * 1.10.0 THE MARKETPLACE SPLIT: hub, doors, supplier products, RFP,
 * supplier application. The directory's own tokens and card look; no new
 * design system, no icons.
 * ===================================================================== */

.aqnm-dir-header h1 { font-size: clamp(28px, 4vw, 40px); line-height: 1.15; margin: 0 0 12px; color: var(--c-heading); }

/* Breadcrumb: Marketplace › Used equipment */
.aqnm-crumbs {
	display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
	margin: 0 0 18px; font-size: 13.5px; color: var(--c-muted);
}
.aqnm-crumbs a { display: inline-flex; align-items: center; min-height: 44px; color: var(--c-body); font-weight: 600; text-decoration: none; }
.aqnm-crumbs a:hover { color: var(--c-teal-ink); }
.aqnm-crumbs [aria-current] { color: var(--c-text); }

/* Hub: three doors. One column on a phone, three from 768. */
.aqnm-hub-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; max-width: 1040px; margin: 0 auto; }
@media (min-width: 768px) { .aqnm-hub-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } }
.aqnm-root a.aqnm-hub-card, .aqnm-root a.aqnm-hub-card:visited {
	position: relative; display: flex; flex-direction: column; gap: 6px;
	padding: 22px 22px 20px; min-height: 150px;
	background: var(--c-surface); border: 1px solid var(--c-card-border); border-radius: 14px;
	box-shadow: 0 6px 18px rgba(14,31,51,.05); color: inherit; text-decoration: none;
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.aqnm-root a.aqnm-hub-card::before {
	content: ""; position: absolute; left: 0; top: 0; right: 0; height: 6px;
	border-radius: 14px 14px 0 0; background: var(--c-banner);
}
.aqnm-root a.aqnm-hub-card:hover { transform: translateY(-3px); border-color: var(--c-border-strong); box-shadow: 0 10px 24px rgba(15,23,42,.08); }
.aqnm-root a.aqnm-hub-card:focus-visible { outline: 2px solid var(--c-teal); outline-offset: 2px; }
.aqnm-hub-card-title { font-size: 20px; font-weight: 700; color: var(--c-heading); line-height: 1.25; }
.aqnm-hub-card-line { font-size: 14.5px; color: var(--c-body); }
.aqnm-hub-card-count { margin-top: auto; padding-top: 10px; font-size: 14px; font-weight: 700; color: var(--c-teal-ink); }
.aqnm-hub-card-go { position: absolute; right: 20px; bottom: 18px; font-size: 20px; color: var(--c-teal-ink); }
.aqnm-hub-sell { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 28px auto 0; max-width: 1040px; }
.aqnm-hub-sell .aqnm-btn { width: auto; padding-left: 22px; padding-right: 22px; }
.aqnm-hub-fineprint { text-align: center; margin-top: 14px; }
.aqnm-section.aqnm-hub { padding-bottom: 40px; }

/* New equipment page */
.aqnm-new-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.aqnm-tiles { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 24px; }
.aqnm-root a.aqnm-tile, .aqnm-root a.aqnm-tile:visited {
	display: inline-flex; flex-direction: column; justify-content: center; min-height: 56px;
	padding: 8px 14px; border: 1px solid var(--c-card-border); border-radius: 10px;
	background: var(--c-surface); color: var(--c-text); text-decoration: none;
}
.aqnm-root a.aqnm-tile:hover { border-color: var(--c-teal); }
.aqnm-tile-name { font-weight: 700; font-size: 14px; }
.aqnm-tile-count { font-size: 12px; color: var(--c-muted); }
.aqnm-new-empty {
	max-width: 760px; margin: 0 auto 8px; padding: 24px;
	background: var(--c-surface); border: 1px solid var(--c-panel-border); border-radius: 14px; text-align: center;
}
.aqnm-new-empty h2 { margin: 0 0 6px; font-size: 20px; color: var(--c-heading); }
.aqnm-new-empty p { margin: 0; color: var(--c-body); }
.aqnm-new-rfp {
	max-width: 760px; margin: 32px auto 0; padding: 24px var(--aqnm-gutter);
	background: var(--c-surface); border: 1px solid var(--c-panel-border); border-radius: 14px;
	scroll-margin-top: 90px;
}
@media (min-width: 640px) { .aqnm-new-rfp { padding: 28px 28px 12px; } }
.aqnm-new-rfp > h2 { margin: 0 0 6px; font-size: 22px; color: var(--c-heading); }
.aqnm-new-rfp > p { margin: 0 0 18px; color: var(--c-body); }
#aqnm-new-products { scroll-margin-top: 90px; }
.aqnm-card-cta { margin-top: 6px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--c-teal-ink); }
.aqnm-related { margin-top: 36px; }
.aqnm-related h2 { font-size: 20px; color: var(--c-heading); margin: 0 0 14px; }

/*
 * Supplier product: REQUEST A QUOTE as a bar on phones. This page carries no
 * form (see supplier-product.php), so a fixed bar cannot sit over a field
 * under the iOS keyboard. The page reserves the bar's height at the bottom.
 */
.aqnm-sticky-cta { display: none; }
@media (max-width: 767px) {
	.aqnm-supplier-product.has-sticky-cta { padding-bottom: 84px; }
	.aqnm-sticky-cta {
		display: flex; align-items: center; gap: 12px;
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
		padding: 10px max(16px, env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
		background: var(--c-surface); border-top: 1px solid var(--c-border);
		box-shadow: 0 -6px 18px rgba(14,31,51,.08);
	}
	.aqnm-sticky-cta-name { flex: 1 1 auto; min-width: 0; font-size: 13.5px; font-weight: 700; color: var(--c-heading); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.aqnm-sticky-cta .aqnm-btn { width: auto; flex: 0 0 auto; padding-left: 18px; padding-right: 18px; }
}

/* Supplier application */
.aqnm-supapp-intro { margin: 0 0 22px; color: var(--c-body); }
.aqnm-supapp-intro h2 { font-size: 17px; color: var(--c-heading); margin: 18px 0 8px; }
.aqnm-supapp-intro ol { margin: 0 0 12px 20px; padding: 0; }
.aqnm-supapp-intro li { margin: 0 0 4px; }
.aqnm-supapp-not { font-size: 14px; }
.aqnm-supapp-catgrid { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.aqnm-supapp-cats.is-invalid .aqnm-supapp-catgrid { outline: 2px solid #b32d2e; outline-offset: 4px; border-radius: 8px; }

/* 1.10.0 type scale inside the new surfaces: themes set <p> and <li> large. */
.aqnm-new-rfp > p, .aqnm-supapp-intro p, .aqnm-supapp-intro li { font-size: 15px; line-height: 1.55; }
.aqnm-new-rfp .aqnm-form-fineprint, .aqnm-supapp .aqnm-form-fineprint, .aqnm-rfp-form .aqnm-form-fineprint { font-size: 13px; line-height: 1.5; color: var(--c-muted); }
.aqnm-root .aqnm-form input[type=url] {
	width: 100%; min-height: 46px; padding: 11px 14px; font: inherit; font-size: 16px;
	border: 1px solid var(--c-border); border-radius: 10px; background: var(--c-surface); color: var(--c-text);
}
.aqnm-listing-facts dd a { color: var(--c-teal-ink); font-weight: 600; }

/* ========================================================================
 * 1.10.1 Hub card images. The illustration fills the card width at the
 * top, rounded to the card's own top corners; the text panel below is
 * unchanged. The box carries the aspect ratio (inline, from the attachment
 * size), so nothing shifts while the image loads.
 * ===================================================================== */
.aqnm-root a.aqnm-hub-card.has-media { padding-top: 0; overflow: hidden; }
.aqnm-root a.aqnm-hub-card.has-media::before { display: none; }
.aqnm-hub-card-media {
	display: block; position: relative; overflow: hidden;
	margin: 0 -22px 14px; width: calc(100% + 44px);
	border-radius: 13px 13px 0 0;   /* the card's 14px less its 1px border */
	background: var(--c-banner);
}
.aqnm-hub-card-media img.aqnm-hub-card-img { display: block; border-radius: 0; box-shadow: none; }

/* 1.10.2 hub card copy: a small label, title, one line, and the CTA as real
   text at the foot of the card. The whole card is the one link. */
.aqnm-hub-card-label { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--c-muted); }
.aqnm-hub-card-cta { margin-top: auto; padding-top: 12px; font-size: 14.5px; font-weight: 700; color: var(--c-teal-ink); }
.aqnm-root a.aqnm-hub-card:hover .aqnm-hub-card-cta,
.aqnm-root a.aqnm-hub-card:focus-visible .aqnm-hub-card-cta { text-decoration: underline; text-underline-offset: 3px; }
.aqnm-root a.aqnm-hub-card:hover { border-color: var(--c-teal); }
.aqnm-root a.aqnm-hub-card:focus-visible { outline: 3px solid var(--c-teal); outline-offset: 3px; }
@media (hover: none) { .aqnm-root a.aqnm-hub-card:hover { transform: none; } }
.aqnm-root a.aqnm-hub-card:active { transform: translateY(-1px); border-color: var(--c-teal); }
/* Themes style a:focus and a:hover (underline, background). The card is one
   big link: keep its own surface and no underline on the whole block. */
.aqnm-root .aqnm-hub-grid a.aqnm-hub-card, .aqnm-root .aqnm-hub-grid a.aqnm-hub-card:hover,
.aqnm-root .aqnm-hub-grid a.aqnm-hub-card:focus:not(.aqnm-x), .aqnm-root .aqnm-hub-grid a.aqnm-hub-card:focus-visible:not(.aqnm-x),
.aqnm-root .aqnm-hub-grid a.aqnm-hub-card:active {
	background: var(--c-surface); color: inherit; text-decoration: none; box-shadow: 0 6px 18px rgba(14,31,51,.05);
}
.aqnm-root .aqnm-hub-grid a.aqnm-hub-card:hover, .aqnm-root .aqnm-hub-grid a.aqnm-hub-card:focus-visible:not(.aqnm-x) { box-shadow: 0 10px 24px rgba(15,23,42,.10); }
.aqnm-hub-card-cta span[aria-hidden] { display: inline-block; font-size: 1.15em; line-height: 1; transition: transform .18s ease; }
.aqnm-root a.aqnm-hub-card:hover .aqnm-hub-card-cta span[aria-hidden] { transform: translateX(3px); }

/* 1.11.0: supplier application pathway. Questions for a pathway not chosen
   are hidden (the display:block above would otherwise defeat [hidden]),
   and the countries list is a real multi-select, not a one-line control. */
.aqnm-supapp [data-aqnm-path][hidden] { display: none; }
.aqnm-supapp .aqnm-supapp-feed { margin: 0 0 4px; }
.aqnm-supapp select[multiple] { height: auto; min-height: 180px; padding: 6px; }

/* ========================================================================
 * 1.11.2: product page navigation. A back link to the product's own list
 * (the "Back to Feed & Nutrition" style: teal, 44px tap target), then
 * Marketplace › section › product on ONE line. The two links never shrink;
 * the product name takes what is left and truncates with an ellipsis, so
 * the trail never wraps or scrolls sideways on a phone.
 * ===================================================================== */
.aqnm-backlink.aqnm-backlink-section { color: var(--c-teal-ink, #15807d); }
.aqnm-backlink.aqnm-backlink-section:hover { text-decoration: underline; }
.aqnm-crumbs.aqnm-crumbs-product { flex-wrap: nowrap; min-width: 0; max-width: 100%; margin: -10px 0 16px; overflow: hidden; }
.aqnm-crumbs-product > a, .aqnm-crumbs-product > span[aria-hidden] { flex: 0 0 auto; white-space: nowrap; }
.aqnm-crumbs-product .aqnm-crumbs-current { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--c-text, #0f172a); }
.aqnf-backbar + .aqnm-crumbs-product { margin-top: -14px; }

/* 1.11.2: One-off order or Recurring supply on a feed quote request. */
.aqnm-root .aqnm-recur-choice { border: 1px solid var(--c-border); border-radius: 12px; padding: 14px 16px 6px; margin: 4px 0 18px; background: var(--c-surface); min-width: 0; }
.aqnm-root .aqnm-recur-choice > legend { padding: 0 6px; font-weight: 600; font-size: 14px; color: var(--c-text); }
.aqnm-root .aqnm-recur-options { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 2px 0 10px; }
.aqnm-root .aqnm-recur-option { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 15px; color: var(--c-text); cursor: pointer; }
.aqnm-root .aqnm-recur-option input { width: 20px; height: 20px; margin: 0; accent-color: var(--c-teal, #15807d); }
.aqnm-root .aqnm-recur-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 16px; }
@media (min-width: 640px) { .aqnm-root .aqnm-recur-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.aqnm-root .aqnm-recur-note { margin: 0 0 12px; font-size: 13px; color: var(--c-muted); }
.aqnm-root [data-aqnm-recur-panel][hidden], .aqnm-root [data-aqnm-one-off-only][hidden] { display: none !important; }