/*
 * AuctionForge skin — single lot page.
 *
 * AuctionForge's own templates/single-lot.php, wrapped by auctionforge/single-lot.php, which only
 * swaps the photo banner for the original catalogue header (.sb-lot-sale). Everything else is the
 * plugin's markup, dressed here in the original site's language:
 *
 *   white .container.wrapper band   archive icon · sale title (→ catalogue) · date
 *   grey .wrapper_alt band          "Lot 20" + lot navigation (prev / catalogue / next, Lot # GO)
 *                                   left: lot title, the bid box (an original .bordered box with
 *                                   form.colourful labels and fields and an original .button),
 *                                   description, share icons, terms / increments / inquiry links
 *                                   right: gallery and thumbnails
 *
 * This file loads on every AuctionForge page, so every rule is scoped to the lot page:
 * body.single-lot, #single-lot or .sb-lot-sale. AuctionForge's inline "bidspirit-custom-styles"
 * block prints after this file with !important colours and fonts, hence the html/body/#id prefixes
 * and the !important on the declarations that block also sets.
 */

/* ------------------------------------------------------------------------------------------------
 * 1. Sale header — the original catalogue header, compact (no buttons, no venue map)
 * --------------------------------------------------------------------------------------------- */

.sb-lot-sale {
	background: #fff;
}
.sb-lot-sale .container.wrapper {
	padding-bottom: 0.3125rem;
}
.sb-lot-sale .h1 {
	margin-bottom: 1.25rem;
}
.sb-lot-sale .h1 a {
	color: inherit;
	font-weight: inherit;
}
.sb-lot-sale .h1 a:hover,
.sb-lot-sale .h1 a:focus {
	color: var(--sb-teal);
}
/* As .auctions.view h1 small on the original catalogue. */
.sb-lot-sale .h1 small {
	display: block;
	text-transform: none;
}
.sb-lot-sale #userFront:has(*) {
	margin: -0.3125rem 0 1.25rem;
}

/* ------------------------------------------------------------------------------------------------
 * 2. The lot band — grey like the catalogue's "Order of Sale" (.container.wrapper_alt), laid on
 *    the original grid: .container padding, a 93.75rem .row and .625rem column gutters.
 * --------------------------------------------------------------------------------------------- */

body.single-lot #content-wrapper {
	background: var(--sb-band);
}
html body #single-lot.bp-container {
	max-width: none;
	padding: 2.5rem 0;
	font-family: var(--sb-font-body) !important;
}
#single-lot > .bp-single-lot.bp-row {
	max-width: 93.75rem;
	margin: 0 auto;
	gap: 0;
}
#single-lot > .bp-single-lot > .bp-col {
	padding: 0 0.625rem;
}

/* AuctionForge's account notices (#bp-notice-block, above the lot) and this sale's approval state
   (#auctionApprovalInfo, top of the lot) take no room while its JS leaves them empty, and sit on the
   grid when it fills them. Their look (the original pale box, the "Participate" box) is shared with
   the list and catalogue pages, in account.css. */
body.single-lot #bp-notice-block:empty {
	margin: 0;
}
#single-lot .bp-single-lot > .bp-content:has(> #auctionApprovalInfo:empty) {
	display: none;
}
body.single-lot #bp-notice-block:not(:empty) {
	box-sizing: border-box;
	max-width: 93.75rem;
	margin: 0 auto;
	padding: 2.5rem 0.625rem 0;
}
/* The lot band's own top padding would double the gap under a notice. */
body.single-lot #bp-notice-block:not(:empty) + #single-lot.bp-container {
	padding-top: 1.25rem;
}
body.single-lot #bp-notice-block .bp-container {
	max-width: none;
	padding: 0;
}
body.single-lot #bp-notice-block .bp-row {
	margin: 0;
}
#single-lot .bp-single-lot > .bp-content.bp-add-padding:has(> #auctionApprovalInfo) {
	margin: 0 0 1.25rem !important;
	padding: 0 0.625rem;
}

/* ------------------------------------------------------------------------------------------------
 * 3. Head row — "Lot 20" and the lot navigation
 * --------------------------------------------------------------------------------------------- */

html body #single-lot .bp-single-lot .bp-single-lot__head {
	align-items: center;
	flex-wrap: wrap;
	gap: 0.625rem 1.25rem;
	margin: 0 0 1.25rem;
	padding-bottom: 0.9375rem;
	border-bottom: 1px solid #d7dad6;
	color: var(--sb-navy) !important;
	font-family: var(--sb-font-heading) !important;
	font-size: 1rem;
	text-transform: none;
}
#single-lot .bp-single-lot__head .bp-title {
	margin: 0;
	font-family: var(--sb-font-heading);
	font-size: 1.5625rem;
	font-weight: 500;
	line-height: 1.4;
	color: var(--sb-navy);
}

/* prev / back to the catalogue / next: the original pagination's teal squares. */
#single-lot .bp-single-lot__head > div,
#single-lot .bp-single-lot__head .bp-tools {
	flex-wrap: wrap;
	max-width: 100%;
}
#single-lot .bp-single-lot__head .bp-tools {
	gap: 0.3125rem;
	padding: 0;
}
#single-lot .bp-tools .bp-tools__item {
	width: 2.375rem;
	height: 2.375rem;
	margin: 0;
	border-radius: 0.3125rem;
	background: var(--sb-teal);
	transition: background-color 250ms linear;
}
#single-lot .bp-tools .bp-tools__item:hover,
#single-lot .bp-tools .bp-tools__item:focus {
	background: var(--sb-navy-dark);
}
#single-lot .bp-tools .bp-tools__item:focus-visible {
	outline: 2px solid var(--sb-navy-dark);
	outline-offset: 2px;
}
#single-lot .bp-tools .bp-tools__item::before {
	width: 100%;
	height: 100%;
	background-image: none;
	font: normal normal normal 0.9375rem/2.375rem FontAwesome;
	color: #fff;
	text-align: center;
	-webkit-font-smoothing: antialiased;
}
/* The links keep AuctionForge's own text ("prev", "Back to the catalogue", "next") as their
   accessible name; the glyphs get empty alt text where the browser supports it. */
#single-lot .bp-tools .bp-tools__prev::before {
	content: "\f053"; /* fa-chevron-left */
	content: "\f053" / "";
}
#single-lot .bp-tools .bp-tools__all::before {
	content: "\f00a"; /* fa-th */
	content: "\f00a" / "";
	font-size: 1rem;
}
#single-lot .bp-tools .bp-tools__next::before {
	content: "\f054"; /* fa-chevron-right */
	content: "\f054" / "";
}

/* AuctionForge's "Lot # / Go" jump (ajax/GoToLot.php injects it with !important inline styles):
   a contact-form field and an original .button. */
html body #single-lot .af-goto-lot {
	flex: 0 1 auto !important;
	flex-wrap: wrap;
	max-width: 100% !important;
	gap: 0.3125rem;
	margin: 0 0 0 0.3125rem !important;
	font-size: 1rem !important;
}
html body #single-lot .af-goto-lot .lgl-input {
	box-sizing: border-box;
	width: 5.5rem !important;
	height: 2.375rem !important;
	padding: 0 0.46875rem !important;
	border: 1px solid #89a0b2 !important;
	border-radius: 5px !important;
	background: #fff !important;
	color: var(--sb-navy-dark) !important;
	font-family: var(--sb-font-body) !important;
	font-size: 1rem !important;
}
html body #single-lot .af-goto-lot .lgl-input:focus {
	border-color: var(--sb-navy-dark) !important;
	outline: none;
	box-shadow: 0 0 0 3px rgba(73, 158, 170, 0.3) !important;
}
html body #single-lot .af-goto-lot .lgl-btn {
	height: 2.375rem !important;
	padding: 0 1.25rem !important;
	border: 0 !important;
	border-radius: 0.3125rem !important;
	background: var(--sb-teal) !important;
	color: #fff !important;
	font-family: var(--sb-font-ui) !important;
	font-size: 0.9375rem !important;
	font-weight: 600;
	text-transform: uppercase;
	transition: background-color 200ms linear;
}
html body #single-lot .af-goto-lot .lgl-btn:hover,
html body #single-lot .af-goto-lot .lgl-btn:focus {
	background: var(--sb-navy-dark) !important;
}
html body #single-lot .af-goto-lot .lgl-msg {
	color: #b20000 !important;
	font-family: var(--sb-font-body);
	font-size: 0.8125rem !important;
}

/* ------------------------------------------------------------------------------------------------
 * 4. Columns and the lot title
 * --------------------------------------------------------------------------------------------- */

#single-lot .bp-single-lot__body {
	align-items: flex-start;
}
#single-lot .bp-single-lot .bp-single-lot__body .bp-body__gallery {
	padding-left: 2.5rem;
	margin-bottom: 1.25rem;
}
#single-lot .bp-single-lot .bp-single-lot__body .bp-desc {
	margin-bottom: 1.25rem;
	color: var(--sb-navy);
}
#single-lot .bp-single-lot .bp-single-lot__body .bp-desc h1 {
	margin: 0;
	font-size: 2.25rem;
	line-height: 1.25;
	color: var(--sb-navy);
	overflow-wrap: anywhere;
}

/* ------------------------------------------------------------------------------------------------
 * 5. The bid box — an original .bordered (.white-bg) box
 * --------------------------------------------------------------------------------------------- */

#single-lot .bp-single-lot .lot-actions-wrp.bp-control {
	position: relative;
	margin-bottom: 1.25rem;
	border: 2px solid #fff;
	border-radius: 0.125rem;
	background: #fff;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.65);
}
#single-lot .bp-single-lot .bp-control.bp-control_nopadding .bp-control__inner {
	padding: 1.25rem 1.25rem 0.9375rem;
}
#single-lot .bp-single-lot .bp-control.bp-control_nopadding #preSale-section.bp-control__inner {
	padding: 0;
}
#single-lot #bidFormSection {
	position: relative;
}

/* Favourites heart, top right of the box. */
html body #single-lot #bidFormSection .bp__wishlist {
	top: 1rem;
	right: 1rem;
	width: 1.75rem;
	height: 1.75rem;
	background-size: 1.25rem auto;
	background-repeat: no-repeat;
}

/* Countdown: an original heading line. */
#single-lot .bp-single-lot .bp-control .bp-control__title {
	margin: 0 0 1.25rem;
	padding-right: 2.5rem;
	font-family: var(--sb-font-heading);
	font-size: 1.375rem;
	font-weight: 500;
	line-height: 1.4;
	color: var(--sb-navy);
}

/* Bid amount and BID: a form.colourful label over a contact-form field, then an original .button. */
#single-lot #auctionIsLive-section {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 0.625rem;
	margin: 0 0 0.9375rem;
}
#single-lot #auctionIsLive-section:not(:has(*)) {
	display: none;
}
#single-lot .bp-single-lot .bp-control #auctionIsLive-section .bp-form-group__inline {
	width: auto;
	max-width: none;
	margin: 0;
	gap: 0;
}
#single-lot .bp-single-lot .bp-control #auctionIsLive-section .bp-form-group__inline:has(select) {
	display: block;
	flex: 1 1 12rem;
	max-width: 22rem;
}
#single-lot .bp-single-lot .bp-control #auctionIsLive-section .bp-form-group__inline:not(:has(select)) {
	flex: 0 0 auto;
}
#single-lot .bp-from .bp-form-group .bp-form-group__label {
	display: block;
	width: auto;
	margin: 0 0 0.3rem;
	font-family: var(--sb-font-nav);
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.2;
	color: var(--sb-navy-dark);
	text-transform: uppercase;
}

/* The bid amount (select2): the contact form's text field, at the catalogue toolbar's height. */
#single-lot .bp-control .select2-container--default .select2-selection--single {
	box-sizing: border-box;
	height: 2.5rem;
	max-height: none;
	border: 1px solid #89a0b2;
	border-radius: 5px;
	background: #fff;
}
#single-lot .bp-control .select2-container--default .select2-selection--single .select2-selection__rendered {
	padding: 0 2rem 0 0.625rem;
	font-family: var(--sb-font-body);
	font-size: 1rem;
	font-weight: 400;
	line-height: 2.375rem;
	color: var(--sb-navy-dark);
}
#single-lot .bp-control .select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 0;
	right: 0.375rem;
	width: 1.25rem;
	height: 2.375rem;
	transform: none;
}
#single-lot .bp-control .select2-container--default .select2-selection--single .select2-selection__arrow b {
	border-top-color: var(--sb-navy-dark);
}
#single-lot .bp-control .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	border-color: transparent transparent var(--sb-navy-dark);
}
#single-lot .bp-control .select2-container--default.select2-container--focus .select2-selection--single,
#single-lot .bp-control .select2-container--default.select2-container--open .select2-selection--single {
	border-color: var(--sb-navy-dark);
	outline: none;
	box-shadow: 0 0 0 3px rgba(73, 158, 170, 0.3);
}
/* Square the edge the open list joins. */
#single-lot .bp-control .select2-container--default.select2-container--open.select2-container--below .select2-selection--single {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}
#single-lot .bp-control .select2-container--default.select2-container--open.select2-container--above .select2-selection--single {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

/* BID (and "Buy now", "To auction"): the original .button, at the bid field's height. ("Participate
   in this auction" is styled with the other approval states, in account.css.) */
html body #single-lot .bp-control .bp-btn.bp-btn-default {
	display: inline-block;
	box-sizing: border-box;
	height: 2.5rem;
	min-width: 8.75rem;
	margin: 0;
	padding: 0 1.875rem;
	border: 0;
	border-radius: 0.3125rem;
	background-color: var(--sb-teal) !important;
	color: #fff !important;
	font-family: var(--sb-font-ui);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 2.5rem;
	letter-spacing: 0;
	text-align: center;
	text-transform: uppercase;
	transition: background-color 200ms linear;
}
html body #single-lot .bp-control .bp-btn.bp-btn-default:focus-visible {
	outline: 2px solid var(--sb-navy-dark);
	outline-offset: 2px;
}
html body #single-lot .bp-control .bp-btn.bp-btn-default:hover,
html body #single-lot .bp-control .bp-btn.bp-btn-default:focus {
	border: 0;
	background-color: var(--sb-navy-dark) !important;
	color: #fff !important;
}

/* Start price / estimate / buyer's premium / VAT: original body text, values in navy. */
#single-lot .bp-single-lot .bp-control .bp-control__desc {
	color: var(--sb-text);
	font-family: var(--sb-font-body);
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.4;
}
#single-lot .bp-single-lot .bp-control #bidFormSection .bp-control__desc {
	padding-top: 0.9375rem;
	border-top: 1px solid #d7dad6;
}
#single-lot .bp-single-lot .bp-control .bp-control__desc p {
	margin: 0 0 0.3125rem;
	color: var(--sb-text);
	font-family: var(--sb-font-body);
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.4;
}
#single-lot .bp-single-lot .bp-control .bp-control__desc p > span {
	color: var(--sb-navy);
	font-weight: 700;
}
#single-lot .bp-single-lot .bp-control .bp-control__desc .vat-field > span {
	color: var(--sb-text);
	font-weight: 400;
}
html body #single-lot #af-total-incl.bp-control__total {
	margin-bottom: 0.625rem;
	font-size: 0.9375rem;
}
/* Links: the original teal, bold (AuctionForge underlines "Log in" in the text colour, !important). */
html body #single-lot .bp-control__desc a,
html body #single-lot #af-total-incl a.af-total-login {
	color: var(--sb-teal) !important;
	font-weight: 700;
	text-decoration: none !important;
}
html body #single-lot .bp-control__desc a:hover,
html body #single-lot .bp-control__desc a:focus,
html body #single-lot #af-total-incl a.af-total-login:hover,
html body #single-lot #af-total-incl a.af-total-login:focus {
	color: var(--sb-navy-dark) !important;
}

/* "Buy now" (pre-/post-sale buyout, BidSpirit Shop) under the bid form, in the same box. */
#single-lot #preSale-section.wrp-buyout-block {
	border-top: 1px solid #d7dad6;
}
#single-lot #preSale-section.wrp-buyout-block:empty {
	border-top: 0;
}
#single-lot #preSale-section .bp-compact-form,
#single-lot #preSale-section > .buyout-block {
	padding: 0.9375rem 1.25rem 1.25rem;
}
#single-lot #preSale-section .bp-compact-form > p {
	margin: 0 0 0.625rem;
}
#single-lot #preSale-section .buyout-block {
	flex-wrap: wrap;
	align-items: center;
	gap: 0.625rem;
}
#single-lot #preSale-section .buyout-block .buyout-block__inner {
	align-items: center;
	gap: 0.3125rem;
	width: auto;
	max-width: none;
	height: auto;
	padding: 0;
	border: 0;
}
#single-lot #preSale-section .buyout-block__label p {
	margin: 0;
}
#single-lot #preSale-section .buyout-block__price strong,
#single-lot #preSale-section .buyout-block__price p {
	margin: 0;
	color: var(--sb-navy);
	font-family: var(--sb-font-heading);
	font-size: 1.375rem;
	font-weight: 500;
}

/* ------------------------------------------------------------------------------------------------
 * 6. Leading bid / sold / not sold notices (#leadingBid, #soldBid): an original navy band.
 *    AuctionForge's settings paint every notice navy; the outbid and winning ones get the original
 *    red and dark teal back so they stand out.
 * --------------------------------------------------------------------------------------------- */

#single-lot .bp-single-lot .bp-control__notice_wrp:not(.hidden):has(.bp-control__notice:not(.bp-p-0)) {
	margin-bottom: 1.25rem;
}
html body #single-lot .bp-single-lot .bp-control__notice {
	padding: 0.9375rem 1.25rem;
	border-radius: 0.125rem;
	background-color: var(--sb-navy-dark) !important;
	align-items: baseline;
	gap: 0 0.625rem;
}
html body #single-lot .bp-single-lot .bp-control__notice.bp-p-0 {
	padding: 0;
}
html body #single-lot .bp-single-lot .bp-control__notice.bp-bg-red {
	background-color: #7f0000 !important;
}
html body #single-lot .bp-single-lot .bp-control__notice.bp-bg-green {
	background-color: var(--sb-teal-dark) !important;
}
html body #single-lot .bp-single-lot .bp-control__notice.bp-bg-gray {
	background-color: #8097ab !important;
}
html body #single-lot .bp-single-lot .bp-control__notice .bp-title {
	margin: 0;
	color: #fff;
	font-family: var(--sb-font-nav);
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.4;
	text-transform: uppercase;
}
html body #single-lot .bp-single-lot .bp-control__notice .bp-title.bp-subtitle {
	flex-basis: 100%;
	font-family: var(--sb-font-body);
	text-transform: none;
}
html body #single-lot .bp-single-lot .bp-control__notice .bp-bid {
	margin-left: 0.3125rem;
	color: #fff !important;
	font-family: var(--sb-font-heading);
	font-size: 1.5625rem;
	font-weight: 500;
	text-transform: none;
}

/* ------------------------------------------------------------------------------------------------
 * 7. Description — original body copy under an original heading
 * --------------------------------------------------------------------------------------------- */

html body #single-lot .bp-single-lot .bp-single-lot__body .bp-body__main .bp-body__main_content {
	margin-top: 0.625rem;
	color: var(--sb-text) !important;
	font-family: var(--sb-font-body);
	font-size: 0.9375rem;
	line-height: 1.4;
}
#single-lot .bp-single-lot .bp-body__main_content > .title {
	margin: 0 0 0.625rem;
	font-family: var(--sb-font-heading);
	font-size: 1.375rem;
	font-weight: 400;
	line-height: 1.4;
	color: rgba(8, 37, 62, 0.8);
}
#single-lot .bp-body__main_content .body {
	margin-bottom: 0;
}
#single-lot .bp-single-lot .bp-body__main_content .body p {
	margin: 0 0 1.25rem;
	color: var(--sb-text);
	font-size: 0.9375rem;
	line-height: 1.4;
}
#single-lot .bp-single-lot .bp-body__main_content .body p + p {
	margin-top: 0;
}

/* ------------------------------------------------------------------------------------------------
 * 8. Share icons and the terms / increments / inquiry links (original list bullets)
 * --------------------------------------------------------------------------------------------- */

#single-lot #wrpLotTools {
	margin-top: 0.625rem;
	padding-top: 1.25rem;
	border-top: 1px solid #d7dad6;
}
#single-lot #wrpLotTools > .title {
	margin: 0 0 0.625rem;
	color: var(--sb-navy-dark);
	font-family: var(--sb-font-nav);
	font-size: 0.875rem;
	line-height: 1.2;
	text-transform: uppercase;
}
#single-lot #wrpLotTools > .title strong {
	font-weight: 400;
}
#single-lot .bp-share-btn-list {
	gap: 0.5rem;
	margin-bottom: 1.25rem;
}
#single-lot .bp-share-btn-list .share-btn__link {
	display: inline-block;
	line-height: 0;
}
#single-lot .bp-share {
	width: 2rem;
	height: 2rem;
	transition: none;
}
#single-lot .bp-share svg {
	width: 2rem;
	height: 2rem;
	fill: var(--sb-slate);
	transition: fill 250ms linear;
}
#single-lot .bp-share svg path {
	fill: inherit;
}
#single-lot .bp-share:hover {
	transform: none;
}
#single-lot .bp-share:hover svg,
#single-lot .bp-share:hover svg path,
#single-lot .share-btn__link:focus .bp-share svg {
	fill: var(--sb-teal);
}
#single-lot .bp-share-btn-list .share-btn__link.share-btn__link-active {
	background-color: var(--sb-teal);
	font-family: var(--sb-font-ui);
}
#single-lot .bp-info ul.bp-info__item {
	margin: 0;
}
#single-lot .bp-info .bp-info__elem {
	margin-bottom: 0.3125rem;
	font-family: var(--sb-font-body);
	font-size: 0.9375rem;
}

/* ------------------------------------------------------------------------------------------------
 * 9. Gallery — the picture in an original .bordered frame, teal arrows, framed thumbnails
 * --------------------------------------------------------------------------------------------- */

#single-lot .bp-body__gallery .bp-gallery-top {
	box-sizing: border-box;
	max-height: none;
	border: 2px solid #fff;
	border-radius: 0.125rem;
	background: #fff;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.65);
}
/* AuctionForge's 4:3 slides run past its own 577px max-height once the gallery is wider than
   770px (a stacked tablet layout), cutting the foot off every picture: cap the slide instead. */
#single-lot .bp-body__gallery .bp-gallery-top .swiper-wrapper .swiper-slide:not(.bp-swiper-slide_youtube) {
	padding-bottom: min(75%, 36rem);
}
#single-lot .bp-body__gallery .swiper-button-next.swiper-button-white,
#single-lot .bp-body__gallery .swiper-button-prev.swiper-button-white {
	width: 2.5rem;
	height: 2.5rem;
	margin-top: -1.25rem;
	border: 0;
	border-radius: 0.3125rem;
	background-color: var(--sb-teal);
	box-shadow: none;
	transition: background-color 250ms linear;
}
#single-lot .bp-body__gallery .swiper-button-next.swiper-button-white:hover,
#single-lot .bp-body__gallery .swiper-button-prev.swiper-button-white:hover {
	background-color: var(--sb-navy-dark);
}
#single-lot .bp-body__gallery .swiper-button-next.swiper-button-white::after,
#single-lot .bp-body__gallery .swiper-button-prev.swiper-button-white::after {
	font-family: FontAwesome;
	font-size: 1rem;
	text-shadow: none;
	-webkit-font-smoothing: antialiased;
}
#single-lot .bp-body__gallery .swiper-button-prev.swiper-button-white::after {
	content: "\f053";
}
#single-lot .bp-body__gallery .swiper-button-next.swiper-button-white::after {
	content: "\f054";
}
#single-lot .bp-body__gallery .bp-gallery-thumbs {
	max-height: none;
	padding: 0.625rem 0.125rem 0.125rem;
}
/* A fixed height: AuctionForge's 16%-of-the-gallery-width thumbs outgrow the thumb strip's 143px
   max-height on a stacked tablet layout and lose their bottom edge. */
#single-lot .bp-body__gallery .bp-gallery-thumbs .swiper-slide {
	box-sizing: border-box;
	height: clamp(3.75rem, 16vw, 5.625rem);
	padding-bottom: 0;
	border: 2px solid #fff;
	border-radius: 0.125rem;
	background-color: #fff;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.35);
	opacity: 0.6;
	transition: opacity 250ms linear, border-color 250ms linear;
}
#single-lot .bp-body__gallery .bp-gallery-thumbs .swiper-slide:hover {
	opacity: 1;
}
#single-lot .bp-body__gallery .bp-gallery-thumbs .swiper-slide-thumb-active {
	border-color: var(--sb-teal);
	opacity: 1;
}

/* ------------------------------------------------------------------------------------------------
 * 10. The bid amount list — select2 appends it to <body>. default.css gives every <li> the original
 *     teal bullet, which lands on top of each amount: take it off, and draw the list like the
 *     catalogue toolbar's and the modal fields' (navy edge, striped-row tint for the chosen amount,
 *     teal under the pointer).
 * --------------------------------------------------------------------------------------------- */

body.single-lot > .select2-container--open .select2-dropdown {
	border: 1px solid var(--sb-navy-dark);
	border-radius: 0 0 5px 5px;
	background: #fff;
	overflow: hidden;
}
body.single-lot > .select2-container--open .select2-dropdown--above {
	border-radius: 5px 5px 0 0;
}
body.single-lot > .select2-container .select2-results__option {
	position: static;
	padding: 0.5rem 0.625rem;
	color: var(--sb-navy-dark);
	font-family: var(--sb-font-body);
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.3;
}
body.single-lot > .select2-container .select2-results__option::before,
body.single-lot > .select2-container .select2-results__option::after {
	content: none;
	display: none;
}
body.single-lot > .select2-container--default .select2-results__option[aria-selected=true] {
	background-color: var(--sb-row);
}
body.single-lot > .select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: var(--sb-teal);
	color: #fff;
}

/* ------------------------------------------------------------------------------------------------
 * 11. Responsive
 * --------------------------------------------------------------------------------------------- */

@media only screen and (min-width: 73.75rem) {
	html body #single-lot.bp-container {
		padding-left: 2.5rem;
		padding-right: 2.5rem;
	}
	body.single-lot #bp-notice-block:not(:empty) {
		max-width: 98.75rem;
		padding-left: 3.125rem;
		padding-right: 3.125rem;
	}
}
@media screen and (max-width: 1023px) {
	#single-lot .bp-single-lot .bp-single-lot__body .bp-body__gallery {
		padding-left: 0;
	}
}
@media screen and (max-width: 767px) {
	.sb-lot-sale .h1 {
		font-size: 1.875rem;
	}
	#single-lot .bp-single-lot .bp-single-lot__body .bp-desc h1 {
		font-size: 1.875rem;
	}
	#single-lot .bp-single-lot .bp-control .bp-control__title {
		font-size: 1.25rem;
	}
}
@media screen and (max-width: 576px) {
	/* "Lot not found" under the field rather than past the edge of the screen. */
	html body #single-lot .af-goto-lot .lgl-msg:not(:empty) {
		flex-basis: 100%;
	}
	#single-lot .bp-single-lot .bp-control #auctionIsLive-section .bp-form-group__inline:has(select),
	#single-lot .bp-single-lot .bp-control #auctionIsLive-section .bp-form-group__inline:not(:has(select)) {
		flex: 1 1 100%;
		max-width: none;
	}
	html body #single-lot .bp-control .bp-btn.bp-btn-default {
		width: 100%;
		height: 3rem;
		line-height: 3rem;
		font-size: 1.125rem;
	}
	#single-lot .bp-single-lot .bp-control.bp-control_nopadding .bp-control__inner {
		padding: 0.9375rem 0.9375rem 0.625rem;
	}
}