/* ==========================================================================
   BBAG Storefront — auctions, lots, prices realized.
   One stylesheet, loaded only where the storefront renders. Every value comes from the Blue Box theme's
   presets (theme.json) with a fallback, so the pages also look right under any other theme.
   Mobile first. Square corners. Gold only for the primary action and realized prices.
   ========================================================================== */

.bbag-sf {
	--sf-ink: var(--wp--preset--color--ink, #0b1f3a);
	--sf-navy: var(--wp--preset--color--navy, #1a3a6b);
	--sf-cobalt: var(--wp--preset--color--cobalt, #0e5c98);
	--sf-gold: var(--wp--preset--color--gold, #c5a253);
	--sf-gold-deep: var(--wp--preset--color--gold-deep, #b08e3e);
	--sf-gold-ink: var(--wp--preset--color--gold-ink, #806225);
	--sf-ivory: var(--wp--preset--color--ivory, #f4f1ea);
	--sf-mist: var(--wp--preset--color--mist, #f3f5f8);
	--sf-paper: var(--wp--preset--color--paper, #fff);
	--sf-slate: var(--wp--preset--color--slate, #56606f);
	--sf-line: var(--wp--preset--color--line, #dde2ea);
	--sf-success: var(--wp--preset--color--success, #1e6b45);
	--sf-display: var(--wp--preset--font-family--display, "Libre Bodoni", "Libre Bodoni Fallback", Didot, "Bodoni 72", Georgia, serif);
	--sf-sans: var(--wp--preset--font-family--sans, "Libre Franklin", "Libre Franklin Fallback", "Franklin Gothic", "Helvetica Neue", Arial, sans-serif);
	--sf-text: var(--wp--preset--font-size--base, 1.0625rem);
	--sf-small: var(--wp--preset--font-size--sm, 0.9375rem);
	--sf-xs: var(--wp--preset--font-size--xs, 0.875rem);
	--sf-lede: var(--wp--preset--font-size--md, 1.25rem);
	--sf-caps: var(--wp--custom--tracking--caps, 0.12em);
	--sf-ease: var(--wp--custom--ease--out, cubic-bezier(0.16, 1, 0.3, 1));
	--sf-header: var(--bluebox-header-h, 0px);
	--sf-section: clamp(2.75rem, 1.75rem + 3.5vw, 5rem);
	--bbag-sf-ratio: 4 / 3;

	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size, 1280px);
	margin-inline: auto;
	color: var(--sf-ink);
	font-family: var(--sf-sans);
	font-size: var(--sf-text);
	font-weight: 400;
	line-height: 1.6;
	text-align: left;
	-webkit-font-smoothing: antialiased;
}

.bbag-sf *,
.bbag-sf *::before,
.bbag-sf *::after {
	box-sizing: border-box;
}

.bbag-sf img {
	display: block;
	max-width: 100%;
	height: auto;
	border: 0;
	border-radius: 0;
}

.bbag-sf a {
	color: var(--sf-cobalt);
	text-underline-offset: 0.22em;
	text-decoration-thickness: 1px;
}

.bbag-sf a:hover {
	color: var(--sf-ink);
}

.bbag-sf :focus-visible {
	outline: 2px solid var(--sf-cobalt);
	outline-offset: 3px;
}

.bbag-sf p {
	margin: 0;
}

/* Component display rules must never override the hidden attribute. */
.bbag-sf [hidden] {
	display: none !important;
}

.bbag-sf .bbag-sf-icon {
	width: 1.25rem;
	height: 1.25rem;
	flex: none;
}

.bbag-sf .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ---------- Type ---------- */

.bbag-sf .bbag-sf-title {
	margin: 0;
	color: var(--sf-ink);
	font-family: var(--sf-display);
	font-size: clamp(2rem, 1.35rem + 2.6vw, 3.25rem);
	font-style: normal;
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.08;
	text-transform: none;
	text-wrap: balance;
}

.bbag-sf .bbag-sf-h2 {
	margin: 0 0 1.75rem;
	color: var(--sf-ink);
	font-family: var(--sf-display);
	font-size: clamp(1.75rem, 1.45rem + 1.1vw, 2.25rem);
	font-weight: 500;
	letter-spacing: -0.005em;
	line-height: 1.15;
	text-transform: none;
	text-wrap: balance;
}

.bbag-sf .bbag-sf-h2::after {
	content: "";
	display: block;
	width: 64px;
	height: 2px;
	margin-top: 0.9rem;
	background: var(--sf-gold);
}

.bbag-sf .bbag-sf-subhead {
	margin: 0 0 0.25rem;
	padding-bottom: 0.75rem;
	border-bottom: 2px solid var(--sf-ink);
	color: var(--sf-ink);
	font-family: var(--sf-sans);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	line-height: 1.3;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-lede {
	max-width: 62ch;
	color: var(--sf-slate);
	font-size: var(--sf-lede);
	line-height: 1.55;
	text-wrap: pretty;
}

.bbag-sf .bbag-sf-note {
	max-width: 60ch;
	color: var(--sf-slate);
	font-size: var(--sf-xs);
	line-height: 1.55;
}

.bbag-sf .bbag-sf-prose {
	max-width: 70ch;
	color: var(--sf-ink);
	font-size: var(--sf-text);
	line-height: 1.7;
}

.bbag-sf .bbag-sf-prose p,
.bbag-sf .bbag-sf-prose ul,
.bbag-sf .bbag-sf-prose ol,
.bbag-sf .bbag-sf-prose table,
.bbag-sf .bbag-sf-prose blockquote {
	margin: 0 0 0.75em;
}

.bbag-sf .bbag-sf-prose ul,
.bbag-sf .bbag-sf-prose ol {
	padding-left: 1.25em;
}

.bbag-sf .bbag-sf-prose strong,
.bbag-sf .bbag-sf-prose b {
	font-weight: 600;
}

.bbag-sf .bbag-sf-prose h3,
.bbag-sf .bbag-sf-prose h4,
.bbag-sf .bbag-sf-prose h5,
.bbag-sf .bbag-sf-prose h6 {
	margin: 1.5em 0 0.5em;
	color: var(--sf-ink);
	font-family: var(--sf-sans);
	font-size: 1.0625rem;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.4;
	text-transform: none;
}

.bbag-sf .bbag-sf-prose > :last-child {
	margin-bottom: 0;
}

.bbag-sf .bbag-sf-prose table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--sf-small);
}

.bbag-sf .bbag-sf-prose td,
.bbag-sf .bbag-sf-prose th {
	padding: 0.5rem;
	border-bottom: 1px solid var(--sf-line);
	text-align: left;
}

/* ---------- Status ---------- */

.bbag-sf .bbag-sf-status {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	margin: 0;
	color: var(--sf-ink);
	font-size: var(--sf-small);
	font-weight: 600;
	line-height: 1.4;
}

.bbag-sf .bbag-sf-status__dot {
	width: 0.5rem;
	height: 0.5rem;
	flex: none;
	border-radius: 50%;
	background: var(--sf-slate);
}

.bbag-sf .bbag-sf-status.is-live .bbag-sf-status__dot,
.bbag-sf .bbag-sf-status.is-closing .bbag-sf-status__dot {
	background: var(--sf-success);
	box-shadow: 0 0 0 3px rgb(30 107 69 / 0.16);
	animation: bbag-sf-pulse 2.4s var(--sf-ease) infinite;
}

.bbag-sf .bbag-sf-status.is-upcoming .bbag-sf-status__dot {
	background: var(--sf-cobalt);
}

.bbag-sf .bbag-sf-status.is-sold .bbag-sf-status__dot {
	background: var(--sf-gold);
}

@keyframes bbag-sf-pulse {
	0%, 100% { box-shadow: 0 0 0 3px rgb(30 107 69 / 0.16); }
	50% { box-shadow: 0 0 0 6px rgb(30 107 69 / 0.06); }
}

.bbag-sf .bbag-sf-status [data-bbag-countdown] {
	color: var(--sf-slate);
	font-weight: 500;
}

/* ---------- Buttons and links ---------- */

.bbag-sf .bbag-sf-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 3rem;
	padding: 0.95rem 1.5rem;
	border: 1px solid transparent;
	border-radius: 0;
	box-shadow: none;
	font-family: var(--sf-sans);
	font-size: var(--sf-xs);
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	/* A long label ("Get a complimentary auction estimate") takes two lines on a phone instead of running off the screen. */
	text-wrap: balance;
	cursor: pointer;
	transition: background-color 0.2s var(--sf-ease), color 0.2s var(--sf-ease), border-color 0.2s var(--sf-ease);
	-webkit-tap-highlight-color: transparent;
}

.bbag-sf .bbag-sf-btn--gold {
	background: var(--sf-gold);
	color: var(--sf-ink);
}

.bbag-sf .bbag-sf-btn--gold:hover,
.bbag-sf .bbag-sf-btn--gold:active {
	background: var(--sf-gold-deep);
	color: var(--sf-ink);
}

.bbag-sf .bbag-sf-btn--ink {
	background: var(--sf-ink);
	color: var(--sf-paper);
}

.bbag-sf .bbag-sf-btn--ink:hover {
	background: var(--sf-navy);
	color: var(--sf-paper);
}

.bbag-sf .bbag-sf-btn--outline {
	border-color: var(--sf-ink);
	background: transparent;
	color: var(--sf-ink);
}

.bbag-sf .bbag-sf-btn--outline:hover {
	background: var(--sf-ink);
	color: var(--sf-paper);
}

.bbag-sf .bbag-sf-btn--block {
	width: 100%;
}

.bbag-sf .bbag-sf-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.bbag-sf .bbag-sf-arrowlink,
.bbag-sf .bbag-sf-textlink {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--sf-ink);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	text-decoration: none;
	text-transform: uppercase;
}

/* A taller hit area for thumbs without moving anything: the padding is taken back by the margin. */
.bbag-sf .bbag-sf-arrowlink {
	padding-block: 0.75rem;
	margin-block: -0.75rem;
}

.bbag-sf .bbag-sf-arrowlink .bbag-sf-icon {
	transition: transform 0.25s var(--sf-ease);
}

.bbag-sf .bbag-sf-arrowlink:hover {
	color: var(--sf-gold-ink);
}

.bbag-sf .bbag-sf-arrowlink:hover .bbag-sf-icon {
	transform: translateX(3px);
}

.bbag-sf .bbag-sf-textlink {
	text-decoration: underline;
	text-underline-offset: 0.3em;
}

.bbag-sf .bbag-sf-iconbtn {
	display: inline-grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid var(--sf-line);
	border-radius: 0;
	background: transparent;
	color: inherit;
	cursor: pointer;
}

/* ---------- Page structure ---------- */

.bbag-sf .bbag-sf-crumbs {
	margin: 0 0 1.25rem;
	color: var(--sf-slate);
	font-size: var(--sf-xs);
}

.bbag-sf .bbag-sf-crumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bbag-sf .bbag-sf-crumbs li {
	margin: 0;
}

.bbag-sf .bbag-sf-crumbs li + li::before {
	content: "/";
	margin-right: 0.5rem;
	color: #9aa3b0;
}

.bbag-sf .bbag-sf-crumbs a {
	color: var(--sf-slate);
	text-decoration: none;
}

.bbag-sf .bbag-sf-crumbs a:hover {
	color: var(--sf-ink);
	text-decoration: underline;
}

.bbag-sf .bbag-sf-crumbs [aria-current] {
	color: var(--sf-ink);
}

/* Phones: one line of crumbs that trims the long names; lot pages rely on their back link instead. */
@media (max-width: 699px) {
	.bbag-sf .bbag-sf-crumbs ol {
		flex-wrap: nowrap;
		overflow: hidden;
		white-space: nowrap;
		line-height: 1.5;
	}

	.bbag-sf .bbag-sf-crumbs li {
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.bbag-sf .bbag-sf-crumbs li:first-child {
		flex: none;
	}

	.bbag-sf.bbag-sf--lot .bbag-sf-crumbs {
		display: none;
	}
}

.bbag-sf .bbag-sf-pagehead {
	display: grid;
	gap: 0.85rem;
	max-width: 60rem;
	margin: 0 0 clamp(1.75rem, 1rem + 2.5vw, 3rem);
}

.bbag-sf .bbag-sf-section {
	margin: var(--sf-section) 0 0;
}

.bbag-sf .bbag-sf-section__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem 2rem;
	margin: 0 0 1.75rem;
}

.bbag-sf .bbag-sf-section__head .bbag-sf-h2 {
	margin: 0;
}

/* Site search results: the matching lots sit right under the page head, and take no room when none match. */
.bbag-sf.bbag-sf--search {
	padding-block-start: var(--wp--preset--spacing--60, 3rem);
}

.bbag-sf--search > .bbag-sf-section:first-child {
	margin-top: 0;
}

.bbag-sf .bbag-sf-empty-state {
	padding: clamp(2rem, 1.25rem + 3vw, 3.5rem) 1.25rem;
	background: var(--sf-mist);
	text-align: center;
}

.bbag-sf .bbag-sf-empty-state .bbag-sf-h2::after {
	margin-inline: auto;
}

.bbag-sf .bbag-sf-empty-state p {
	max-width: 50ch;
	margin: 0 auto;
	color: var(--sf-slate);
}

.bbag-sf .bbag-sf-empty {
	color: var(--sf-slate);
}

.bbag-sf .bbag-sf-count {
	margin: 0 0 1rem;
	color: var(--sf-slate);
	font-size: var(--sf-xs);
}

.bbag-sf .bbag-sf-count:empty {
	display: none;
}

/* ---------- Facts (dl) ---------- */

.bbag-sf .bbag-sf-facts {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 2.25rem;
	margin: 0.25rem 0 0;
	padding: 0;
}

.bbag-sf .bbag-sf-facts div {
	min-width: 0;
}

.bbag-sf .bbag-sf-facts dt {
	margin: 0 0 0.3rem;
	color: var(--sf-slate);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	line-height: 1.2;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-facts dd {
	margin: 0;
	color: var(--sf-ink);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.35;
}

/* ---------- Lot cards ---------- */

.bbag-sf .bbag-sf-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.75rem 0.875rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bbag-sf .bbag-sf-grid > li {
	margin: 0;
	min-width: 0;
}

.bbag-sf .bbag-sf-card {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.bbag-sf .bbag-sf-card__media {
	position: relative;
	overflow: hidden;
	aspect-ratio: var(--bbag-sf-ratio);
	background: var(--sf-mist);
}

.bbag-sf .bbag-sf-card__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	/* If a photo fails to load, its description shows as a quiet caption rather than a headline. */
	font-size: 0.8125rem;
	line-height: 1.4;
	color: var(--sf-slate, #56606F);
	transition: transform 0.7s var(--sf-ease);
}

.bbag-sf .bbag-sf-card:hover .bbag-sf-card__media img {
	transform: scale(1.035);
}

.bbag-sf .bbag-sf-card__flag {
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	z-index: 1;
	padding: 0.35rem 0.5rem;
	background: var(--sf-paper);
	color: var(--sf-ink);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	line-height: 1;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 0.3rem;
	padding-top: 0.9rem;
}

.bbag-sf .bbag-sf-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.15rem 0.75rem;
	color: var(--sf-slate);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	line-height: 1.35;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-card__sale {
	display: -webkit-box;
	overflow: hidden;
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	text-transform: none;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.bbag-sf .bbag-sf-card__title {
	display: -webkit-box;
	margin: 0.1rem 0 0;
	overflow: hidden;
	color: var(--sf-ink);
	font-family: var(--sf-sans);
	font-size: 1rem;
	font-weight: 500;
	letter-spacing: 0;
	line-height: 1.4;
	text-transform: none;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.bbag-sf .bbag-sf-card__link {
	color: inherit;
	text-decoration: none;
}

.bbag-sf .bbag-sf-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
}

.bbag-sf .bbag-sf-card:hover .bbag-sf-card__link {
	text-decoration: underline;
	text-decoration-color: var(--sf-gold);
	text-decoration-thickness: 2px;
}

.bbag-sf .bbag-sf-card__link:focus-visible {
	outline: none;
}

.bbag-sf .bbag-sf-card:focus-within {
	outline: 2px solid var(--sf-cobalt);
	outline-offset: 4px;
}

.bbag-sf .bbag-sf-card__est {
	color: var(--sf-slate);
	font-size: var(--sf-xs);
}

.bbag-sf .bbag-sf-card__price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.2rem 0.5rem;
	margin-top: auto;
	padding-top: 0.45rem;
}

.bbag-sf .bbag-sf-card__label {
	color: var(--sf-slate);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-card__price strong {
	color: var(--sf-ink);
	font-size: 1.125rem;
	font-weight: 600;
	font-variant-numeric: lining-nums tabular-nums;
	line-height: 1.2;
}

.bbag-sf .bbag-sf-card__price strong.is-realized {
	color: var(--sf-gold-ink);
}

/* ---------- Auction cards and banner ---------- */

.bbag-sf .bbag-sf-agrid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bbag-sf .bbag-sf-agrid > li {
	margin: 0;
	min-width: 0;
}

.bbag-sf .bbag-sf-acard {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	border: 1px solid var(--sf-line);
	background: var(--sf-paper);
	transition: border-color 0.25s var(--sf-ease), box-shadow 0.25s var(--sf-ease);
}

.bbag-sf .bbag-sf-acard:hover {
	border-color: #b8c1ce;
	box-shadow: 0 18px 40px -24px rgb(11 31 58 / 0.45);
}

.bbag-sf .bbag-sf-acard:focus-within {
	outline: 2px solid var(--sf-cobalt);
	outline-offset: 3px;
}

.bbag-sf .bbag-sf-acard__media {
	overflow: hidden;
	aspect-ratio: 3 / 2;
	background: var(--sf-ink);
}

.bbag-sf .bbag-sf-acard__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.8s var(--sf-ease);
}

.bbag-sf .bbag-sf-acard:hover .bbag-sf-acard__media img {
	transform: scale(1.03);
}

.bbag-sf .bbag-sf-acard__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 0.6rem;
	padding: 1.25rem 1.25rem 1.4rem;
}

.bbag-sf .bbag-sf-acard__title {
	margin: 0.15rem 0 0;
	color: var(--sf-ink);
	font-family: var(--sf-display);
	font-size: 1.75rem;
	font-weight: 500;
	letter-spacing: -0.005em;
	line-height: 1.15;
	text-transform: none;
	text-wrap: balance;
}

.bbag-sf .bbag-sf-acard__facts {
	color: var(--sf-slate);
	font-size: var(--sf-small);
}

.bbag-sf .bbag-sf-acard__cta {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-top: auto;
	padding-top: 0.6rem;
	color: var(--sf-ink);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-acard:hover .bbag-sf-acard__cta .bbag-sf-icon {
	transform: translateX(3px);
}

.bbag-sf .bbag-sf-acard__cta .bbag-sf-icon {
	transition: transform 0.25s var(--sf-ease);
}

.bbag-sf .bbag-sf-banner {
	display: grid;
	margin: 0 0 var(--sf-section);
	background: var(--sf-ink);
	color: var(--sf-paper);
}

.bbag-sf.bbag-sf--banner .bbag-sf-banner,
.bbag-sf.bbag-sf--block .bbag-sf-banner {
	margin-bottom: 0;
}

.bbag-sf .bbag-sf-banner__media {
	position: relative;
	overflow: hidden;
	aspect-ratio: 3 / 2;
	background: #081629;
}

.bbag-sf .bbag-sf-banner__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.bbag-sf .bbag-sf-banner__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 1rem;
	padding: clamp(1.5rem, 1rem + 2.6vw, 3.5rem);
}

.bbag-sf .bbag-sf-banner .bbag-sf-status {
	color: #e8ecf3;
}

.bbag-sf .bbag-sf-banner__title {
	margin: 0;
	color: var(--sf-paper);
	font-family: var(--sf-display);
	font-size: clamp(2rem, 1.4rem + 2vw, 2.875rem);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.08;
	text-transform: none;
	text-wrap: balance;
}

.bbag-sf .bbag-sf-banner__title a {
	color: inherit;
	text-decoration: none;
}

.bbag-sf .bbag-sf-banner__title a:hover {
	text-decoration: underline;
	text-decoration-color: var(--sf-gold);
	text-decoration-thickness: 2px;
}

.bbag-sf .bbag-sf-banner__lede {
	max-width: 46ch;
	color: rgb(255 255 255 / 0.84);
	font-size: var(--sf-text);
	line-height: 1.6;
}

.bbag-sf .bbag-sf-banner .bbag-sf-facts dt {
	color: rgb(255 255 255 / 0.72);
}

.bbag-sf .bbag-sf-banner .bbag-sf-facts dd {
	color: var(--sf-paper);
}

.bbag-sf .bbag-sf-banner .bbag-sf-actions {
	margin-top: 0.5rem;
}

.bbag-sf .bbag-sf-banner .bbag-sf-btn--outline {
	border-color: rgb(255 255 255 / 0.8);
	color: var(--sf-paper);
}

.bbag-sf .bbag-sf-banner .bbag-sf-btn--outline:hover {
	background: var(--sf-paper);
	color: var(--sf-ink);
}

.bbag-sf .bbag-sf-banner :focus-visible {
	outline-color: var(--sf-gold);
}

/* ---------- Shortcuts ---------- */

.bbag-sf .bbag-sf-shortcuts {
	margin: var(--sf-section) 0 0;
}

.bbag-sf .bbag-sf-shortcuts ul {
	display: grid;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--sf-line);
	list-style: none;
}

.bbag-sf .bbag-sf-shortcuts li {
	margin: 0;
}

.bbag-sf .bbag-sf-shortcuts a {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 0.2rem 1rem;
	padding: 1.2rem 0.25rem;
	border-bottom: 1px solid var(--sf-line);
	color: var(--sf-ink);
	text-decoration: none;
}

.bbag-sf .bbag-sf-shortcuts__label {
	font-size: 1.0625rem;
	font-weight: 600;
}

.bbag-sf .bbag-sf-shortcuts__detail {
	grid-column: 1;
	color: var(--sf-slate);
	font-size: var(--sf-small);
}

.bbag-sf .bbag-sf-shortcuts .bbag-sf-icon {
	grid-row: 1 / span 2;
	grid-column: 2;
	align-self: center;
	transition: transform 0.25s var(--sf-ease);
}

.bbag-sf .bbag-sf-shortcuts a:hover .bbag-sf-icon {
	transform: translateX(3px);
}

/* ---------- Auction page ---------- */

.bbag-sf .bbag-sf-hero {
	display: grid;
	gap: 1.5rem;
	margin: 0 0 2rem;
}

.bbag-sf .bbag-sf-hero__media {
	overflow: hidden;
	aspect-ratio: 3 / 2;
	background: var(--sf-mist);
}

.bbag-sf .bbag-sf-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.bbag-sf .bbag-sf-hero__body {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.bbag-sf .bbag-sf-hero__body .bbag-sf-lede {
	font-size: var(--sf-text);
	line-height: 1.65;
}

.bbag-sf .bbag-sf-hero .bbag-sf-actions {
	margin-top: 0.5rem;
}

.bbag-sf .bbag-sf-about {
	margin: 0 0 var(--sf-section);
	border-top: 1px solid var(--sf-line);
}

.bbag-sf .bbag-sf-disclosure {
	border-bottom: 1px solid var(--sf-line);
}

.bbag-sf .bbag-sf-disclosure summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-height: 3.25rem;
	padding: 1rem 0;
	color: var(--sf-ink);
	font-size: 1.0625rem;
	font-weight: 600;
	list-style: none;
	cursor: pointer;
}

.bbag-sf .bbag-sf-disclosure summary::-webkit-details-marker {
	display: none;
}

.bbag-sf .bbag-sf-disclosure summary::after {
	content: "+";
	color: var(--sf-slate);
	font-size: 1.5rem;
	font-weight: 300;
	line-height: 1;
}

.bbag-sf .bbag-sf-disclosure[open] summary::after {
	content: "\2212";
}

.bbag-sf .bbag-sf-disclosure > .bbag-sf-prose {
	padding: 0 0 1.75rem;
}

/* ---------- Catalog: toolbar, filters, results ---------- */

.bbag-sf .bbag-sf-catalog {
	scroll-margin-top: calc(var(--sf-header) + 1rem);
}

.bbag-sf .bbag-sf-catalog__head {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	margin: 0 0 1.5rem;
}

.bbag-sf .bbag-sf-catalog__head .bbag-sf-h2 {
	margin: 0;
}

.bbag-sf .bbag-sf-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
}

.bbag-sf .bbag-sf-search {
	position: relative;
	display: flex;
	flex: 1 1 100%;
	align-items: center;
	margin: 0;
}

.bbag-sf .bbag-sf-search .bbag-sf-icon {
	position: absolute;
	left: 0.9rem;
	color: var(--sf-slate);
	pointer-events: none;
}

.bbag-sf input[type="search"],
.bbag-sf input[type="number"],
.bbag-sf select {
	min-height: 3rem;
	border: 1px solid var(--sf-line);
	border-radius: 0;
	background-color: var(--sf-paper);
	box-shadow: none;
	color: var(--sf-ink);
	font-family: var(--sf-sans);
	font-size: 1rem;
	line-height: 1.3;
}

.bbag-sf input[type="search"]:focus,
.bbag-sf input[type="number"]:focus,
.bbag-sf select:focus {
	border-color: var(--sf-ink);
}

.bbag-sf .bbag-sf-search input {
	width: 100%;
	padding: 0.7rem 1rem 0.7rem 2.75rem;
}

.bbag-sf .bbag-sf-sort {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding-left: 0.9rem;
	border: 1px solid var(--sf-line);
	background: var(--sf-paper);
}

.bbag-sf .bbag-sf-sort__label {
	color: var(--sf-slate);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-sort select {
	flex: 1;
	min-width: 0;
	padding: 0 2rem 0 0.25rem;
	border: 0;
	background-color: transparent;
	font-size: max(1rem, var(--sf-small)); /* under 16px, iPhones zoom the page when the menu opens */
	font-weight: 500;
}

.bbag-sf .bbag-sf-toolbar__filters:not([hidden]) {
	display: inline-flex;
}

.bbag-sf .bbag-sf-count-badge {
	display: inline-grid;
	place-items: center;
	min-width: 1.35rem;
	height: 1.35rem;
	padding: 0 0.3rem;
	background: var(--sf-ink);
	color: var(--sf-paper);
	font-size: 0.75rem;
	letter-spacing: 0;
}

.bbag-sf .bbag-sf-toolbar__filters:hover .bbag-sf-count-badge {
	background: var(--sf-paper);
	color: var(--sf-ink);
}

.bbag-sf .bbag-sf-catalog__layout {
	display: grid;
	gap: 1.75rem;
}

.bbag-sf .bbag-sf-filters__form {
	margin: 0;
	padding-top: 0.75rem;
	border-top: 2px solid var(--sf-ink);
}

.bbag-sf .bbag-sf-filters__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

/* The close button belongs to the phone and tablet sheet only. */
.bbag-sf .bbag-sf-filters__head .bbag-sf-iconbtn {
	display: none;
}

.bbag-sf .bbag-sf-filters__title {
	margin: 0;
	color: var(--sf-ink);
	font-family: var(--sf-sans);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	line-height: 2.75rem;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-fieldset {
	min-width: 0;
	margin: 0;
	padding: 1rem 0;
	border: 0;
	border-bottom: 1px solid var(--sf-line);
}

.bbag-sf .bbag-sf-fieldset legend {
	float: left;
	width: 100%;
	margin: 0 0 0.5rem;
	padding: 0;
	color: var(--sf-ink);
	font-size: var(--sf-small);
	font-weight: 600;
}

.bbag-sf .bbag-sf-fieldset legend + * {
	clear: left;
}

.bbag-sf .bbag-sf-tree,
.bbag-sf .bbag-sf-tree__sub {
	margin: 0;
	padding: 0;
	list-style: none;
}

.bbag-sf .bbag-sf-tree li {
	margin: 0;
}

.bbag-sf .bbag-sf-tree__sub {
	padding-left: 1.75rem;
}

.bbag-sf .bbag-sf-check {
	display: flex;
	align-items: flex-start;
	gap: 0.65rem;
	margin: 0;
	padding: 0.45rem 0;
	color: var(--sf-ink);
	font-size: var(--sf-small);
	line-height: 1.4;
	cursor: pointer;
}

.bbag-sf .bbag-sf-check input {
	width: 1.125rem;
	height: 1.125rem;
	flex: none;
	margin: 0.1rem 0 0;
	accent-color: var(--sf-ink);
}

.bbag-sf .bbag-sf-check__count {
	margin-left: auto;
	color: var(--sf-slate);
	font-size: var(--sf-xs);
	font-variant-numeric: tabular-nums;
}

.bbag-sf .bbag-sf-range {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.75rem;
}

.bbag-sf .bbag-sf-range label {
	margin: 0;
}

.bbag-sf .bbag-sf-range span {
	display: block;
	margin-bottom: 0.3rem;
	color: var(--sf-slate);
	font-size: var(--sf-xs);
}

.bbag-sf .bbag-sf-range input {
	width: 100%;
	padding: 0.5rem 0.75rem;
}

.bbag-sf .bbag-sf-filters__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem 1.5rem;
	padding-top: 1.25rem;
}

.bbag-sf .bbag-sf-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0 0 1.25rem;
	padding: 0;
	list-style: none;
}

.bbag-sf .bbag-sf-chips li {
	margin: 0;
}

.bbag-sf .bbag-sf-chips a {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	min-height: 2.25rem;
	padding: 0.35rem 0.6rem 0.35rem 0.75rem;
	border: 1px solid var(--sf-line);
	background: var(--sf-mist);
	color: var(--sf-ink);
	font-size: var(--sf-xs);
	text-decoration: none;
}

.bbag-sf .bbag-sf-chips a:hover {
	border-color: var(--sf-ink);
}

.bbag-sf .bbag-sf-chips .bbag-sf-icon {
	width: 0.9rem;
	height: 0.9rem;
}

.bbag-sf .bbag-sf-more {
	margin: 2.5rem 0 0;
	text-align: center;
}

.bbag-sf .bbag-sf-more .bbag-sf-btn[aria-busy="true"] {
	opacity: 0.6;
	pointer-events: none;
}

.bbag-sf .bbag-sf-pages {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.25rem 0.5rem;
	margin: 1.75rem 0 0;
	font-size: var(--sf-small);
}

.bbag-sf .bbag-sf-pages ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.bbag-sf .bbag-sf-pages li {
	margin: 0;
}

.bbag-sf .bbag-sf-pages a,
.bbag-sf .bbag-sf-pages [aria-current] {
	display: inline-grid;
	place-items: center;
	min-width: 2.75rem;
	min-height: 2.75rem;
	padding: 0 0.5rem;
	border: 1px solid transparent;
	color: var(--sf-ink);
	font-variant-numeric: tabular-nums;
	text-decoration: none;
}

.bbag-sf .bbag-sf-pages a:hover {
	border-color: var(--sf-line);
}

.bbag-sf .bbag-sf-pages [aria-current] {
	background: var(--sf-ink);
	color: var(--sf-paper);
}

.bbag-sf .bbag-sf-pages .bbag-sf-pages__step {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	font-weight: 600;
}

.bbag-sf .bbag-sf-pages__gap {
	display: inline-grid;
	place-items: center;
	min-width: 1.5rem;
	color: var(--sf-slate);
}

/* ---------- Prices realized ---------- */

.bbag-sf .bbag-sf-resultsfilter {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 0.85rem;
	margin: 0 0 2rem;
	padding: 1.25rem;
	background: var(--sf-ivory);
}

.bbag-sf .bbag-sf-field {
	display: block;
	min-width: 0;
	margin: 0;
}

.bbag-sf .bbag-sf-field > span {
	display: block;
	margin-bottom: 0.35rem;
	color: var(--sf-slate);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-field input,
.bbag-sf .bbag-sf-field select {
	width: 100%;
	padding: 0.5rem 2.25rem 0.5rem 0.75rem;
	text-overflow: ellipsis;
}

/* Secondary results filters: part of the form grid; folded behind a toggle on phones (script only). */
.bbag-sf .bbag-sf-resultsfilter__more {
	display: contents;
}

.bbag-sf .bbag-sf-resultsfilter__toggle {
	display: none;
}

@media (max-width: 699px) {
	.bbag-sf.is-enhanced .bbag-sf-resultsfilter {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.bbag-sf.is-enhanced .bbag-sf-resultsfilter .bbag-sf-field {
		grid-column: 1 / -1;
	}

	.bbag-sf.is-enhanced .bbag-sf-resultsfilter__toggle {
		display: inline-flex;
	}

	.bbag-sf.is-enhanced .bbag-sf-resultsfilter:not(.is-open) .bbag-sf-resultsfilter__more {
		display: none;
	}

	.bbag-sf.is-enhanced .bbag-sf-resultsfilter.is-open .bbag-sf-resultsfilter__toggle,
	.bbag-sf.is-enhanced .bbag-sf-resultsfilter.is-open [type="submit"] {
		order: 10;
	}
}

.bbag-sf .bbag-sf-results .bbag-sf-note {
	margin: 2rem 0 0;
}

/* ---------- Consign prompt ---------- */

.bbag-sf .bbag-sf-consign {
	display: grid;
	justify-items: start;
	gap: 1rem;
	margin: var(--sf-section) 0 0;
	padding: clamp(1.75rem, 1rem + 3vw, 3.5rem);
	background: var(--sf-ivory);
}

.bbag-sf .bbag-sf-consign .bbag-sf-h2 {
	margin-bottom: 0.25rem;
}

.bbag-sf .bbag-sf-consign p {
	max-width: 56ch;
	color: var(--sf-ink);
}

/* ---------- Lot page ---------- */

.bbag-sf.bbag-sf--lot {
	padding-bottom: 5.5rem;
}

.bbag-sf .bbag-sf-lotnav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin: 0 0 1rem;
	font-size: var(--sf-small);
}

.bbag-sf .bbag-sf-lotnav__back {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-width: 0;
	min-height: 2.75rem;
	color: var(--sf-ink);
	font-weight: 600;
	text-decoration: none;
}

.bbag-sf .bbag-sf-lotnav__back span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.bbag-sf .bbag-sf-lotnav__back:hover span {
	text-decoration: underline;
}

.bbag-sf .bbag-sf-lotnav__steps {
	display: flex;
	flex: none;
	align-items: center;
	gap: 0.35rem;
}

.bbag-sf .bbag-sf-lotnav__steps a {
	display: inline-flex;
	align-items: center;
	gap: 0.2rem;
	min-width: 2.75rem;
	min-height: 2.75rem;
	padding: 0 0.6rem;
	border: 1px solid var(--sf-line);
	color: var(--sf-ink);
	font-weight: 600;
	text-decoration: none;
}

.bbag-sf .bbag-sf-lotnav__steps a:hover {
	border-color: var(--sf-ink);
}

.bbag-sf .bbag-sf-lotnav__steps a span {
	display: none;
}

.bbag-sf .bbag-sf-lotnav__pos {
	color: var(--sf-slate);
	font-size: var(--sf-xs);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.bbag-sf .bbag-sf-lot {
	display: grid;
	gap: 1.5rem;
}

.bbag-sf .bbag-sf-lot__summary {
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	min-width: 0;
}

.bbag-sf .bbag-sf-lot__number {
	color: var(--sf-slate);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	line-height: 1;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-lot__title {
	font-size: clamp(1.75rem, 1.3rem + 1.8vw, 2.625rem);
	line-height: 1.12;
}

.bbag-sf .bbag-sf-figures {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
	gap: 1.25rem 2rem;
	margin: 0.4rem 0 0.25rem;
	padding: 1.25rem 0;
	border-top: 1px solid var(--sf-line);
	border-bottom: 1px solid var(--sf-line);
}

.bbag-sf .bbag-sf-figures:not(:has(div)) {
	display: none;
}

.bbag-sf .bbag-sf-figure {
	min-width: 0;
}

.bbag-sf .bbag-sf-figure dt {
	margin: 0 0 0.45rem;
	color: var(--sf-slate);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: var(--sf-caps);
	line-height: 1.2;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-figure dd {
	margin: 0;
	color: var(--sf-ink);
	font-family: var(--sf-display);
	font-size: clamp(1.75rem, 1.45rem + 1.1vw, 2.25rem);
	font-weight: 500;
	font-variant-numeric: lining-nums;
	letter-spacing: -0.01em;
	line-height: 1.1;
}

.bbag-sf .bbag-sf-figure dd small {
	display: block;
	margin-top: 0.4rem;
	color: var(--sf-slate);
	font-family: var(--sf-sans);
	font-size: var(--sf-xs);
	font-weight: 500;
	letter-spacing: 0;
}

.bbag-sf .bbag-sf-figure.is-realized dd {
	color: var(--sf-gold-ink);
	font-size: clamp(2.25rem, 1.7rem + 1.8vw, 3rem);
}

.bbag-sf .bbag-sf-figure.is-secondary dd {
	font-family: var(--sf-sans);
	font-size: 1.25rem;
	letter-spacing: 0;
}

.bbag-sf .bbag-sf-lot__actions {
	display: grid;
	gap: 0.75rem;
	margin-top: 0.4rem;
}

.bbag-sf .bbag-sf-lot__tools {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.bbag-sf .bbag-sf-tool:not([hidden]) {
	display: inline-flex;
}

.bbag-sf .bbag-sf-tool {
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-height: 2.75rem;
	padding: 0 1rem;
	border: 1px solid var(--sf-line);
	border-radius: 0;
	background: var(--sf-paper);
	color: var(--sf-ink);
	font-family: var(--sf-sans);
	font-size: var(--sf-xs);
	font-weight: 600;
	cursor: pointer;
	transition: border-color 0.2s var(--sf-ease);
}

.bbag-sf .bbag-sf-tool:hover {
	border-color: var(--sf-ink);
}

.bbag-sf .bbag-sf-tool[aria-pressed="true"] .bbag-sf-icon path {
	fill: currentColor;
}

.bbag-sf .bbag-sf-tool[aria-pressed="true"] {
	border-color: var(--sf-ink);
}

.bbag-sf .bbag-sf-tool__count:empty {
	display: none;
}

.bbag-sf .bbag-sf-tool__count {
	padding-left: 0.5rem;
	border-left: 1px solid var(--sf-line);
	font-variant-numeric: tabular-nums;
}

/* Gallery: native swipe (scroll snap), arrows and thumbnails on larger screens, tap to zoom. */
.bbag-sf .bbag-sf-gallery {
	position: relative;
	margin: 0;
}

.bbag-sf .bbag-sf-gallery--empty {
	display: grid;
	place-items: center;
	aspect-ratio: 4 / 3;
	background: var(--sf-mist);
	color: var(--sf-slate);
}

.bbag-sf .bbag-sf-gallery__stage {
	position: relative;
	background: var(--sf-mist);
}

.bbag-sf .bbag-sf-gallery__track {
	display: flex;
	margin: 0;
	padding: 0;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	list-style: none;
	outline: none;
}

.bbag-sf .bbag-sf-gallery__track::-webkit-scrollbar {
	display: none;
}

.bbag-sf .bbag-sf-gallery__slide {
	/* Positioned so each slide's screen-reader label stays inside the scrolling track; otherwise the
	   labels hang off the stage, one screen further right per photo, and phones can drag the page sideways. */
	position: relative;
	flex: 0 0 100%;
	margin: 0;
	aspect-ratio: 4 / 3;
	scroll-snap-align: center;
	scroll-snap-stop: always;
}

.bbag-sf .bbag-sf-gallery__zoom {
	display: block;
	width: 100%;
	height: 100%;
	cursor: zoom-in;
}

.bbag-sf .bbag-sf-gallery__zoom img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.bbag-sf .bbag-sf-gallery__nav:not([hidden]) {
	display: grid;
}

.bbag-sf .bbag-sf-gallery__nav {
	position: absolute;
	top: 50%;
	z-index: 2;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: rgb(255 255 255 / 0.92);
	color: var(--sf-ink);
	cursor: pointer;
	transform: translateY(-50%);
	transition: opacity 0.2s var(--sf-ease);
}

.bbag-sf .bbag-sf-gallery__nav.is-prev {
	left: 0.75rem;
}

.bbag-sf .bbag-sf-gallery__nav.is-next {
	right: 0.75rem;
}

.bbag-sf .bbag-sf-gallery__nav[disabled] {
	opacity: 0;
	pointer-events: none;
}

.bbag-sf .bbag-sf-gallery__count {
	position: absolute;
	right: 0.75rem;
	bottom: 0.75rem;
	z-index: 2;
	padding: 0.4rem 0.65rem;
	background: rgb(11 31 58 / 0.8);
	color: #fff;
	font-size: 0.8125rem;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	line-height: 1;
}

.bbag-sf .bbag-sf-gallery__hint {
	position: absolute;
	top: 0.75rem;
	right: 0.75rem;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	background: rgb(255 255 255 / 0.9);
	color: var(--sf-ink);
	pointer-events: none;
}

.bbag-sf .bbag-sf-gallery__thumbs {
	display: none;
	gap: 0.5rem;
	margin: 0.75rem 0 0;
	padding: 0 0 0.25rem;
	overflow-x: auto;
	list-style: none;
	scrollbar-width: thin;
}

.bbag-sf .bbag-sf-gallery__thumbs li {
	flex: none;
	margin: 0;
}

.bbag-sf .bbag-sf-gallery__thumbs a {
	display: block;
	width: 4.5rem;
	height: 4.5rem;
	border: 1px solid transparent;
	background: var(--sf-mist);
	opacity: 0.7;
	transition: opacity 0.2s var(--sf-ease), border-color 0.2s var(--sf-ease);
}

.bbag-sf .bbag-sf-gallery__thumbs a:hover,
.bbag-sf .bbag-sf-gallery__thumbs a[aria-current="true"] {
	opacity: 1;
}

.bbag-sf .bbag-sf-gallery__thumbs a[aria-current="true"] {
	border-color: var(--sf-ink);
}

.bbag-sf .bbag-sf-gallery__thumbs img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.bbag-sf .bbag-sf-lot__more {
	display: grid;
	gap: 2.5rem;
	margin: var(--sf-section) 0 0;
}

.bbag-sf .bbag-sf-specs {
	margin: 0;
	padding: 0;
}

.bbag-sf .bbag-sf-specs div {
	display: grid;
	grid-template-columns: minmax(7rem, 36%) minmax(0, 1fr);
	gap: 1rem;
	padding: 0.8rem 0;
	border-bottom: 1px solid var(--sf-line);
}

.bbag-sf .bbag-sf-specs dt {
	margin: 0;
	color: var(--sf-slate);
	font-size: var(--sf-small);
}

.bbag-sf .bbag-sf-specs dd {
	margin: 0;
	font-size: var(--sf-small);
	font-weight: 500;
	overflow-wrap: anywhere;
}

.bbag-sf .bbag-sf-steps {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.75rem;
	margin: var(--sf-section) 0 0;
}

.bbag-sf .bbag-sf-steps a {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	min-width: 0;
	padding: 1rem;
	border: 1px solid var(--sf-line);
	color: var(--sf-ink);
	text-decoration: none;
	transition: border-color 0.2s var(--sf-ease);
}

.bbag-sf .bbag-sf-steps a:hover {
	border-color: var(--sf-ink);
}

.bbag-sf .bbag-sf-steps__next {
	grid-column: 2;
	align-items: flex-end;
	text-align: right;
}

.bbag-sf .bbag-sf-steps__label {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	color: var(--sf-slate);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-steps__title {
	display: -webkit-box;
	overflow: hidden;
	font-weight: 500;
	line-height: 1.4;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

/* Sticky bid bar (phones): sits above the Blue Box app dock via --bluebox-dock-offset. */
.bbag-sf .bbag-sf-bar {
	position: fixed;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 80;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.7rem max(1rem, env(safe-area-inset-right, 0px)) calc(0.7rem + max(env(safe-area-inset-bottom, 0px), var(--bluebox-dock-offset, 0px))) max(1rem, env(safe-area-inset-left, 0px));
	border-top: 1px solid var(--sf-line);
	background: var(--sf-paper);
	box-shadow: 0 -12px 30px -20px rgb(11 31 58 / 0.4);
	transition: transform 0.35s var(--sf-ease);
}

.bbag-sf .bbag-sf-bar.is-tucked {
	transform: translateY(110%);
}

/* The price is the part that never gives way: beside a long label ("Complimentary estimate") it was cut
   to "$1,…" on a phone. The button takes two lines instead. */
.bbag-sf .bbag-sf-bar__figure {
	display: flex;
	flex: none;
	flex-direction: column;
	min-width: 0;
	max-width: 60%;
}

.bbag-sf .bbag-sf-bar__label {
	color: var(--sf-slate);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.bbag-sf .bbag-sf-bar strong {
	overflow: hidden;
	color: var(--sf-ink);
	font-size: 1.25rem;
	font-variant-numeric: lining-nums tabular-nums;
	font-weight: 600;
	line-height: 1.2;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.bbag-sf .bbag-sf-bar strong.is-realized {
	color: var(--sf-gold-ink);
}

.bbag-sf .bbag-sf-bar .bbag-sf-btn {
	flex: 0 1 auto;
	min-width: 0;
	padding-inline: 1.25rem;
}

/* Photo viewer */
.bbag-sf-zoom {
	position: fixed;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: #081629;
	color: #fff;
	font-family: var(--wp--preset--font-family--sans, "Libre Franklin", "Helvetica Neue", Arial, sans-serif);
	overscroll-behavior: contain;
}

.bbag-sf-zoom[open] {
	display: grid;
	grid-template-rows: auto minmax(0, 1fr);
}

.bbag-sf-zoom::backdrop {
	background: rgb(8 22 41 / 0.96);
}

.bbag-sf-zoom__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: max(0.75rem, env(safe-area-inset-top, 0px)) 1rem 0.75rem;
}

.bbag-sf-zoom__count,
.bbag-sf-zoom__hint {
	margin: 0;
	font-size: 0.875rem;
}

.bbag-sf-zoom__count {
	font-variant-numeric: tabular-nums;
	font-weight: 600;
}

.bbag-sf-zoom__hint {
	color: rgb(255 255 255 / 0.72);
}

.bbag-sf-zoom .bbag-sf-iconbtn {
	display: inline-grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid rgb(255 255 255 / 0.35);
	border-radius: 0;
	background: transparent;
	color: #fff;
	cursor: pointer;
}

.bbag-sf-zoom .bbag-sf-icon {
	width: 1.25rem;
	height: 1.25rem;
}

.bbag-sf-zoom :focus-visible {
	outline: 2px solid var(--wp--preset--color--gold, #c5a253);
	outline-offset: 3px;
}

.bbag-sf-zoom__stage {
	display: grid;
	place-items: center;
	min-height: 0;
	overflow: auto;
	overscroll-behavior: contain;
	touch-action: pan-x pan-y pinch-zoom;
}

.bbag-sf-zoom__stage img {
	display: block;
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	cursor: zoom-in;
	user-select: none;
	-webkit-user-drag: none;
}

.bbag-sf-zoom__stage.is-zoomed {
	place-items: start;
}

.bbag-sf-zoom__stage.is-zoomed img {
	max-width: none;
	max-height: none;
	cursor: zoom-out;
}

.bbag-sf-zoom__nav {
	position: fixed;
	top: 50%;
	display: grid;
	place-items: center;
	width: 3rem;
	height: 3rem;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: rgb(255 255 255 / 0.12);
	color: #fff;
	cursor: pointer;
	transform: translateY(-50%);
}

.bbag-sf-zoom__nav.is-prev {
	left: 0.75rem;
}

.bbag-sf-zoom__nav.is-next {
	right: 0.75rem;
}

.bbag-sf-zoom__nav:hover {
	background: rgb(255 255 255 / 0.22);
}

.bbag-sf-zoom__stage.is-zoomed ~ .bbag-sf-zoom__nav {
	opacity: 0.35;
}

/* Toast */
.bbag-sf .bbag-sf-toast {
	position: fixed;
	bottom: calc(6.25rem + var(--bluebox-dock-offset, 0px));
	left: 50%;
	z-index: 95;
	padding: 0.75rem 1.1rem;
	background: var(--sf-ink);
	color: var(--sf-paper);
	font-size: var(--sf-small);
	font-weight: 600;
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, 0.75rem);
	transition: opacity 0.25s var(--sf-ease), transform 0.25s var(--sf-ease);
}

.bbag-sf .bbag-sf-toast.is-visible {
	opacity: 1;
	transform: translate(-50%, 0);
}

/* Filter sheet on phones and tablets (only once the script is running). */
@media (max-width: 1023px) {
	.bbag-sf.is-enhanced .bbag-sf-filters {
		position: fixed;
		inset: 0;
		z-index: 100;
		display: none;
		align-items: flex-end;
		background: rgb(11 31 58 / 0.45);
	}

	.bbag-sf.is-enhanced .bbag-sf-filters.is-open {
		display: flex;
	}

	.bbag-sf.is-enhanced .bbag-sf-filters__form {
		width: 100%;
		max-height: min(88vh, 48rem);
		overflow-y: auto;
		padding: 0.5rem 1.25rem calc(1.25rem + env(safe-area-inset-bottom, 0px));
		border-top: 0;
		background: var(--sf-paper);
		animation: bbag-sf-sheet 0.35s var(--sf-ease);
	}

	.bbag-sf.is-enhanced .bbag-sf-filters__head {
		position: sticky;
		top: -0.5rem;
		z-index: 1;
		margin: -0.5rem -1.25rem 0;
		padding: 0.5rem 1.25rem;
		border-bottom: 1px solid var(--sf-line);
		background: var(--sf-paper);
	}

	.bbag-sf.is-enhanced .bbag-sf-filters__head .bbag-sf-iconbtn:not([hidden]) {
		display: inline-grid;
	}

	.bbag-sf.is-enhanced .bbag-sf-filters__foot {
		position: sticky;
		bottom: calc(-1.25rem - env(safe-area-inset-bottom, 0px));
		margin: 0 -1.25rem;
		padding: 1rem 1.25rem calc(1rem + env(safe-area-inset-bottom, 0px));
		border-top: 1px solid var(--sf-line);
		background: var(--sf-paper);
	}

	.bbag-sf.is-enhanced .bbag-sf-filters__foot .bbag-sf-btn {
		flex: 1;
	}
}

@keyframes bbag-sf-sheet {
	from { transform: translateY(24px); opacity: 0.6; }
	to { transform: none; opacity: 1; }
}

/* ---------- Larger screens ---------- */

@media (min-width: 600px) {
	.bbag-sf .bbag-sf-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 2.25rem 1.25rem;
	}

	.bbag-sf .bbag-sf-search {
		flex: 1 1 18rem;
	}

	.bbag-sf .bbag-sf-sort {
		flex: 0 1 auto;
	}

	.bbag-sf .bbag-sf-gallery__thumbs {
		display: flex;
	}

	.bbag-sf .bbag-sf-lotnav__steps a span {
		display: inline;
	}

	.bbag-sf .bbag-sf-resultsfilter {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.bbag-sf .bbag-sf-field--wide {
		grid-column: span 2;
	}

	.bbag-sf .bbag-sf-shortcuts ul {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 1rem;
		border-top: 0;
	}

	.bbag-sf .bbag-sf-shortcuts a {
		height: 100%;
		padding: 1.4rem 1.25rem;
		border: 1px solid var(--sf-line);
	}

	.bbag-sf .bbag-sf-shortcuts a:hover {
		border-color: var(--sf-ink);
	}

	.bbag-sf .bbag-sf-steps {
		gap: 1rem;
	}
}

@media (max-width: 599px) {
	.bbag-sf .bbag-sf-gallery {
		width: 100vw;
		margin-left: calc(50% - 50vw);
	}

	/* The arrow already says which way; the words stay for screen readers. */
	.bbag-sf .bbag-sf-steps__dir {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.bbag-sf .bbag-sf-lotnav__pos {
		display: none;
	}
}

@media (min-width: 700px) {
	.bbag-sf .bbag-sf-agrid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 2rem 1.5rem;
	}
}

@media (min-width: 900px) {
	.bbag-sf.bbag-sf--lot {
		padding-bottom: 0;
	}

	.bbag-sf .bbag-sf-bar {
		display: none;
	}

	.bbag-sf .bbag-sf-lot {
		grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
		gap: clamp(2rem, 4vw, 4.5rem);
		align-items: start;
	}

	.bbag-sf .bbag-sf-lot__summary {
		position: sticky;
		top: calc(var(--sf-header) + 1.5rem);
	}

	.bbag-sf .bbag-sf-lot__more {
		grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
		gap: clamp(2rem, 4vw, 4.5rem);
	}

	.bbag-sf .bbag-sf-hero {
		grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
		gap: clamp(2rem, 4vw, 4rem);
		align-items: center;
	}

	.bbag-sf .bbag-sf-banner {
		grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
		min-height: 26rem;
	}

	.bbag-sf .bbag-sf-banner.has-no-image {
		grid-template-columns: minmax(0, 1fr);
	}

	.bbag-sf .bbag-sf-banner__media {
		aspect-ratio: auto;
		min-height: 100%;
	}

	.bbag-sf .bbag-sf-catalog__head {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: flex-end;
		justify-content: space-between;
	}

	/* Wide enough for the search field, the sort menu, and the button on one row. */
	.bbag-sf .bbag-sf-toolbar {
		flex: 0 1 50rem;
		justify-content: flex-end;
	}
}

@media (min-width: 1024px) {
	.bbag-sf .bbag-sf-grid {
		grid-template-columns: repeat(var(--bbag-sf-cols, 4), minmax(0, 1fr));
		gap: 2.5rem 1.5rem;
	}

	.bbag-sf .bbag-sf-catalog__layout {
		grid-template-columns: 15.5rem minmax(0, 1fr);
		gap: 2.5rem;
		align-items: start;
	}

	.bbag-sf .bbag-sf-catalog__main .bbag-sf-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.bbag-sf .bbag-sf-filters {
		position: sticky;
		top: calc(var(--sf-header) + 1.5rem);
		max-height: calc(100vh - var(--sf-header) - 3rem);
		overflow-y: auto;
		scrollbar-width: thin;
	}

	.bbag-sf .bbag-sf-toolbar__filters {
		display: none !important;
	}

	.bbag-sf .bbag-sf-agrid {
		grid-template-columns: repeat(var(--bbag-sf-cols, 3), minmax(0, 1fr));
	}

	.bbag-sf .bbag-sf-resultsfilter {
		grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)) minmax(0, 1.3fr) auto;
		align-items: end;
	}

	.bbag-sf .bbag-sf-field--wide {
		grid-column: auto;
	}
}

@media (min-width: 1280px) {
	.bbag-sf .bbag-sf-catalog__main .bbag-sf-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (hover: none) and (max-width: 899px) {
	.bbag-sf .bbag-sf-gallery__nav {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bbag-sf *,
	.bbag-sf *::before,
	.bbag-sf *::after,
	.bbag-sf-zoom * {
		animation: none !important;
		transition: none !important;
		scroll-behavior: auto !important;
	}
}

@media print {
	.bbag-sf .bbag-sf-bar,
	.bbag-sf .bbag-sf-toolbar,
	.bbag-sf .bbag-sf-filters,
	.bbag-sf .bbag-sf-lot__tools,
	.bbag-sf .bbag-sf-gallery__nav,
	.bbag-sf .bbag-sf-gallery__thumbs,
	.bbag-sf .bbag-sf-more,
	.bbag-sf .bbag-sf-pages {
		display: none !important;
	}
}

/* ---------- Sections below the first screen ----------
   The lower sections (more auctions, recent results, a lot's details and its related lots) are laid out and
   painted only when they come near the viewport, which brings the first paint about a tenth of a second
   forward on a mid-range phone. A section treated this way clips whatever paints outside its box, so its box
   is made larger than its content at the sides and below (padding, taken back by an equal negative margin):
   room for a card's focus ring and hover shadow. The size is a stand-in until the section has been rendered once. Not used on the
   first section of the search page, which is the page's main content. In print everything is rendered. */
.bbag-sf .bbag-sf-section:not(.bbag-sf--search > :first-child),
.bbag-sf .bbag-sf-lot__more {
	content-visibility: auto;
	contain-intrinsic-size: auto 640px;
	margin: var(--sf-section) -12px -32px;
	padding: 0 12px 32px;
}
