.hexdisplay-quick-buy-host,
.hexdisplay-quick-buy-host * {
	box-sizing: border-box;
}

.hex-quick-buy {
	--hdp-ink: #10233f;
	--hdp-copy: #40516a;
	--hdp-muted: #6c7a90;
	--hdp-blue: #1769d2;
	padding: 1.35rem;
	border: 1px solid #c8d7e8;
	border-radius: 1.4rem;
	background: rgba(255, 255, 255, 0.95);
	box-shadow: 0 24px 70px rgba(20, 42, 71, 0.12);
	color: var(--hdp-ink);
	font-family: "Inter", sans-serif;
}

.hex-quick-buy__eyebrow {
	margin: 0 0 0.3rem !important;
	color: var(--hdp-blue) !important;
	font-size: 0.67rem !important;
	font-weight: 800;
	letter-spacing: 0.12em;
	line-height: 1.3 !important;
	text-transform: uppercase;
}

.hex-quick-buy h2 {
	margin: 0;
	color: var(--hdp-ink);
	font-family: "Montserrat", sans-serif;
	font-size: 1.65rem;
	letter-spacing: -0.035em;
	line-height: 1.1;
}

.hex-quick-buy__intro {
	margin: 0.45rem 0 0.85rem !important;
	color: var(--hdp-copy) !important;
	font-size: 0.78rem !important;
	line-height: 1.45 !important;
}

.hex-quick-buy__colors {
	display: grid;
	gap: 0.35rem;
}

.hex-quick-buy__row {
	display: grid;
	grid-template-columns: 1.15rem minmax(0, 1fr) auto;
	gap: 0.55rem;
	align-items: center;
	min-height: 2.15rem;
	margin-inline: -0.45rem;
	padding: 0.22rem 0.45rem;
	border: 1px solid transparent;
	border-radius: 0.72rem;
	transition: border-color 150ms ease, background-color 150ms ease, box-shadow 150ms ease;
}

.hex-quick-buy__row.is-selected {
	border-color: #9bc5f5;
	background: linear-gradient(90deg, #eaf4ff, #f7fbff);
	box-shadow: inset 3px 0 0 var(--hdp-blue);
}

.hex-quick-buy__swatch {
	position: relative;
	display: grid;
	place-items: center;
	width: 1.15rem;
	aspect-ratio: 1;
	border: 1px solid rgba(16, 35, 63, 0.2);
	border-radius: 50%;
	background: var(--swatch);
	box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.35);
}

.hex-quick-buy__swatch span {
	opacity: 0;
	color: #fff;
	font: 900 0.65rem/1 sans-serif;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65);
	transform: scale(0.65);
	transition: opacity 150ms ease, transform 150ms ease;
}

.hex-quick-buy__row.is-selected .hex-quick-buy__swatch span {
	opacity: 1;
	transform: scale(1);
}

.hex-quick-buy__row.is-selected .hex-quick-buy__label {
	color: #0f58ae;
}

.hex-quick-buy__label {
	color: var(--hdp-ink);
	font-size: 0.8rem;
	font-weight: 700;
}

.hex-quick-buy__stepper {
	display: grid;
	grid-template-columns: 1.85rem 2.1rem 1.85rem;
	overflow: hidden;
	border: 1px solid #c9d5e2;
	border-radius: 0.55rem;
	background: #fff;
}

.hex-quick-buy__stepper button,
.hex-quick-buy__stepper input {
	width: 100%;
	height: 1.9rem;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--hdp-ink);
	font: inherit;
	text-align: center;
}

.hex-quick-buy__row.is-selected .hex-quick-buy__stepper {
	border-color: #78ace7;
	box-shadow: 0 3px 10px rgba(23, 105, 210, 0.1);
}

.hex-quick-buy__row.is-selected .hex-quick-buy__stepper input {
	background: #1769d2;
	color: #fff;
}

.hex-quick-buy__stepper button {
	cursor: pointer;
	font-size: 1rem;
	font-weight: 800;
}

.hex-quick-buy__stepper button:hover,
.hex-quick-buy__stepper button:focus-visible {
	background: #edf5ff;
}

.hex-quick-buy__stepper input {
	border-inline: 1px solid #dbe3ec;
	font-size: 0.75rem;
	font-weight: 750;
	-moz-appearance: textfield;
}

.hex-quick-buy__stepper input::-webkit-inner-spin-button {
	-webkit-appearance: none;
}

.hex-quick-buy__summary {
	display: inline-flex;
	align-items: baseline;
	justify-content: flex-start;
	gap: 0.38rem;
	margin-top: 0.85rem;
	padding-top: 0.75rem;
	border-top: 1px solid #e0e7ef;
	color: var(--hdp-muted);
	font-size: 0.76rem;
	width: 100%;
}

.hex-quick-buy__summary strong {
	color: var(--hdp-ink);
}

.hex-quick-buy__equation {
	display: inline-flex;
	align-items: baseline;
	gap: 0.38rem;
	white-space: nowrap;
}

.hex-quick-buy__equals {
	color: #7390ad;
	font-weight: 900;
}

.hex-quick-buy__bay-equivalent {
	white-space: nowrap;
}

.hex-quick-buy__value {
	margin-top: 0.65rem;
	padding: 0.75rem 0.85rem;
	border: 1px solid #b9d7f8;
	border-radius: 0.8rem;
	background: #f0f7ff;
}

.hex-quick-buy__value[hidden] {
	display: none;
}

.hex-quick-buy__value p,
.hex-quick-buy__value small {
	margin: 0 !important;
}

.hex-quick-buy__value p:first-child {
	color: #0f58ae !important;
	font-size: 0.9rem !important;
}

.hex-quick-buy__value p:nth-child(2) {
	margin-top: 0.15rem !important;
	color: var(--hdp-ink) !important;
	font-size: 0.72rem !important;
}

.hex-quick-buy__value .hex-quick-buy__volume {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: start;
	gap: 0.75rem;
	margin-top: 0.45rem !important;
	padding-top: 0.45rem;
	border-top: 1px solid #c9def4;
	color: #435d7a !important;
	font-size: 0.68rem !important;
	font-weight: 750;
}

.hex-quick-buy__value .hex-quick-buy__volume.is-active {
	color: #167344 !important;
	padding: 0.55rem 0.65rem;
	border: 1px solid #a9ddc2;
	border-radius: 0.65rem;
	background: linear-gradient(135deg, #edfbf3, #f7fff9);
}

.hex-quick-buy__volume > span {
	line-height: 1.3;
}

.hex-quick-buy__volume > [data-volume-label] {
	padding-top: 0.12rem;
	white-space: nowrap;
}

.hex-quick-buy__reward {
	display: grid;
	gap: 0.22rem;
	width: 9.75rem;
	text-align: right;
}

.hex-quick-buy__reward > strong {
	color: #08733e;
	font: 850 1.18rem/1 "Montserrat", sans-serif;
	letter-spacing: -0.025em;
	text-shadow: 0 2px 10px rgba(8, 115, 62, 0.18);
}

.hex-quick-buy__reward > small {
	color: #167344;
	font-size: 0.62rem;
	font-weight: 800;
	line-height: 1.25;
}

@media (max-width: 390px) {
	.hex-quick-buy__value .hex-quick-buy__volume {
		grid-template-columns: 1fr;
	}

	.hex-quick-buy__volume > [data-volume-label] {
		white-space: normal;
	}

	.hex-quick-buy__reward {
		width: 100%;
		text-align: left;
	}
}

.hex-quick-buy__reward > [hidden] {
	display: none;
}

.hex-quick-buy__volume[hidden] {
	display: none;
}

.hex-quick-buy__value .hex-quick-buy__next-tier {
	margin-top: 0.45rem !important;
	padding: 0.55rem 0.65rem;
	border: 1px solid #bdd6f2;
	border-radius: 0.65rem;
	background: #f6faff;
	color: #174f91 !important;
	font-size: 0.68rem !important;
	font-weight: 750;
	line-height: 1.4 !important;
}

.hex-quick-buy__next-tier > strong {
	display: block;
	margin-bottom: 0.3rem;
	font-size: 0.65rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.hex-quick-buy__next-tier-table {
	display: grid;
	grid-template-columns: minmax(3.75rem, 1fr) auto auto;
	gap: 0.18rem 0.7rem;
	align-items: baseline;
}

.hex-quick-buy__next-tier-table > :nth-child(3n + 2) {
	color: #435d7a;
	font-weight: 650;
}

.hex-quick-buy__next-tier-table > b {
	text-align: right;
	white-space: nowrap;
}

.hex-quick-buy__next-tier[hidden] {
	display: none;
}

.hex-quick-buy__value small {
	display: block;
	margin-top: 0.35rem !important;
	color: var(--hdp-copy);
	font-size: 0.66rem;
	line-height: 1.35;
}

.hex-quick-buy__submit {
	width: 100%;
	min-height: 2.8rem;
	margin-top: 0.75rem;
	border: 0;
	border-radius: 0.65rem;
	background: linear-gradient(180deg, #267ce1, #1455aa);
	box-shadow: 0 10px 22px rgba(20, 85, 170, 0.22);
	color: #fff;
	cursor: pointer;
	font-family: "Montserrat", sans-serif;
	font-size: 0.78rem;
	font-weight: 800;
}

.hex-quick-buy__submit:disabled {
	cursor: not-allowed;
	opacity: 0.55;
}

.hex-quick-buy__status {
	min-height: 1em;
	margin: 0.4rem 0 0 !important;
	color: #9b2c2c !important;
	font-size: 0.7rem !important;
	line-height: 1.35 !important;
}

.hex-quick-buy__designer {
	display: block;
	color: var(--hdp-blue);
	font-size: 0.72rem;
	font-weight: 750;
	text-align: center;
	text-decoration: underline !important;
	text-underline-offset: 0.18em;
}

/* Dismissible storefront drawer. */
.hexdisplay-quick-buy-host {
	position: fixed;
	z-index: 99990;
	inset: 0;
	pointer-events: none;
}

.hex-quick-buy-launcher {
	position: fixed;
	z-index: 2;
	right: 0;
	top: 48%;
	display: flex;
	align-items: center;
	gap: 0.55rem;
	padding: 0.82rem 0.9rem 0.82rem 1.05rem;
	border: 1px solid #2b78dc;
	border-right: 0;
	border-radius: 999px 0 0 999px;
	background: linear-gradient(180deg, #267ce1, #1455aa);
	box-shadow: 0 14px 34px rgba(20, 85, 170, 0.28);
	color: #fff;
	cursor: pointer;
	font: 800 0.78rem/1 "Montserrat", sans-serif;
	pointer-events: auto;
	writing-mode: initial;
	transform: translateY(-50%);
}

.hex-quick-buy-launcher span:last-child {
	color: #fff;
	font-size: 1.05rem;
	transition: transform 160ms ease;
}

.hex-quick-buy-launcher:hover,
.hex-quick-buy-launcher:focus-visible {
	background: linear-gradient(180deg, #3388ea, #1760bd);
}

.hex-quick-buy-launcher:hover span:last-child,
.hex-quick-buy-launcher:focus-visible span:last-child {
	transform: translateX(-0.18rem);
}

.hex-quick-buy-backdrop {
	position: fixed;
	z-index: 0;
	inset: 0;
	background: rgba(8, 24, 45, 0.28);
	opacity: 0;
	pointer-events: none;
	transition: opacity 220ms ease;
}

.hexdisplay-quick-buy-host .hex-quick-buy {
	position: fixed;
	z-index: 1;
	top: clamp(7.4rem, 9vw, 9rem);
	right: 0;
	bottom: auto;
	width: min(29rem, calc(100vw - 2rem));
	height: auto;
	max-height: calc(100dvh - 9rem);
	overflow-y: auto;
	padding: clamp(1.5rem, 3vh, 2.25rem);
	border-width: 1px 0 1px 1px;
	border-radius: 1.35rem 0 0 1.35rem;
	box-shadow: -28px 0 70px rgba(20, 42, 71, 0.18);
	pointer-events: auto;
	transform: translateX(105%);
	transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.hex-quick-buy__close {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	min-height: 2.35rem;
	padding: 0.55rem 0.75rem;
	border: 1px solid #c9d7e6;
	border-radius: 999px;
	background: #f6f9fc;
	color: #10233f;
	cursor: pointer;
	font: 750 0.72rem/1 "Montserrat", sans-serif;
}

.hex-quick-buy__close span:last-child {
	font: 400 1.15rem/0.8 sans-serif;
}

.hex-quick-buy__close:hover,
.hex-quick-buy__close:focus-visible {
	border-color: #1769d2;
	background: #fff;
}

.hex-quick-buy__heading {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.35rem;
}

.hexdisplay-quick-buy-host.is-open .hex-quick-buy {
	transform: translateX(0);
}

.hexdisplay-quick-buy-host.is-open .hex-quick-buy-backdrop {
	opacity: 1;
	pointer-events: auto;
}

.hexdisplay-quick-buy-host.is-open .hex-quick-buy-launcher {
	opacity: 0;
	pointer-events: none;
}

@media (max-width: 700px) {
	.hex-quick-buy-launcher {
		top: auto;
		bottom: 5.25rem;
		right: 1rem;
		border: 1px solid #1769d2;
		border-radius: 999px;
		background: #1455aa;
		color: #fff;
		writing-mode: initial;
		transform: none;
	}

	.hex-quick-buy-launcher span:last-child {
		color: #fff;
	}

	.hexdisplay-quick-buy-host .hex-quick-buy {
		top: auto;
		bottom: 0;
		width: 100%;
		height: auto;
		max-height: 88dvh;
		padding: 1.25rem 1.15rem;
		border-width: 1px 0 0;
		border-radius: 1.25rem 1.25rem 0 0;
		transform: translateY(105%);
	}

	.hexdisplay-quick-buy-host.is-open .hex-quick-buy {
		transform: translateY(0);
	}

	html.has-quick-buy-drawer .trp-floating-switcher {
		opacity: 0;
		pointer-events: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hexdisplay-quick-buy-host .hex-quick-buy,
	.hex-quick-buy-backdrop {
		transition: none;
	}
}