/* CHUB Cart & Checkout Upsells — matches cannabishub.co (Flatsome) palette */
.chub-upsells {
	--cu-accent: #e2963a;      /* nav bar orange */
	--cu-accent-dark: #c97d22;
	--cu-ink: #1a1a1a;
	--cu-green: #8dc63f;       /* rewards box green */
	--cu-border: #e5e5e5;
	--cu-muted: #777;
	--cu-card: 150px;          /* compact card width */
	--cu-gap: 10px;

	margin: 0 0 24px;
	padding: 14px 14px 12px;
	border: 1px solid var(--cu-border);
	border-top: 3px solid var(--cu-accent);
	border-radius: 4px;
	background: #fff;
	clear: both;
}

.chub-upsells__head { margin-bottom: 10px; text-align: center; }
.chub-upsells__title {
	margin: 0;
	font-size: 1em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .02em;
	color: var(--cu-ink);
}
.chub-upsells__sub { margin: 2px 0 0; font-size: .8em; color: var(--cu-muted); }

/* Row is capped at 5 compact cards wide and centred; extra products scroll. */
.chub-upsells__viewport {
	position: relative;
	max-width: calc(5 * var(--cu-card) + 4 * var(--cu-gap));
	margin: 0 auto;
}

.chub-upsells__track {
	display: flex;
	gap: var(--cu-gap);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding: 2px 2px 4px;
}
.chub-upsells__track::-webkit-scrollbar { display: none; }

.chub-upsells__card {
	flex: 0 0 calc((100% - 4 * var(--cu-gap)) / 5); /* max 5 per row */
	min-width: 0;
	box-sizing: border-box;
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 6px 6px 8px;
	border: 1px solid var(--cu-border);
	border-radius: 4px;
	background: #fff;
	transition: box-shadow .15s ease, border-color .15s ease;
}
.chub-upsells__card:hover { border-color: var(--cu-accent); box-shadow: 0 2px 8px rgba(0,0,0,.08); }

.chub-upsells__img { display: block; width: 100%; margin-bottom: 6px; }
.chub-upsells__img img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 3px;
	margin: 0 !important;
}

.chub-upsells__name {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	font-size: .7em;
	line-height: 1.3;
	font-weight: 600;
	text-transform: uppercase;
	color: var(--cu-ink) !important;
	text-decoration: none !important;
}
.chub-upsells__name:hover { color: var(--cu-accent-dark) !important; }

.chub-upsells__price { margin: 3px 0 5px; font-weight: 700; font-size: .85em; line-height: 1.3; color: var(--cu-ink); }
.chub-upsells__price del { opacity: .5; font-weight: 400; margin-right: 4px; }
.chub-upsells__price ins { text-decoration: none; }
.chub-upsells__price .amount { color: var(--cu-ink); }

/* Options dropdown (variable products) — overrides Flatsome's full-height select styling */
.chub-upsells select.chub-upsells__size {
	display: block;
	width: 100%;
	max-width: none;
	height: 28px !important;
	min-height: 0 !important;
	margin: 0 0 6px !important;
	padding: 0 20px 0 6px !important;
	border: 1px solid var(--cu-border) !important;
	border-radius: 3px !important;
	background-color: #fff;
	background-position: right 4px center !important;
	box-shadow: none !important;
	color: var(--cu-ink);
	font-size: .7em !important;
	font-weight: 600;
	line-height: 26px !important;
	text-transform: uppercase;
	cursor: pointer;
}
.chub-upsells select.chub-upsells__size:focus { border-color: var(--cu-accent) !important; outline: none; }
.chub-upsells select.chub-upsells__size:disabled { opacity: .6; cursor: wait; }
.chub-upsells__size-single { display: block; margin: 0 0 6px; font-size: .68em; font-weight: 600; text-transform: uppercase; color: var(--cu-muted); line-height: 28px; }

.chub-upsells__add {
	display: flex !important;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	margin: auto 0 0 !important;
	width: 100%;
	max-width: none !important;
	min-height: 28px;
	padding: 4px 8px !important;
	border: 0 !important;
	border-radius: 3px !important;
	background: var(--cu-accent) !important;
	color: #fff !important;
	font-size: .7em !important;
	font-weight: 700;
	line-height: 1.5 !important;
	text-transform: uppercase;
	letter-spacing: .03em;
	text-align: center;
	text-decoration: none !important;
	cursor: pointer;
	transition: background .15s ease;
}
.chub-upsells__add:hover { background: var(--cu-accent-dark) !important; }
.chub-upsells__add:focus-visible { outline: 2px solid var(--cu-ink); outline-offset: 2px; }
.chub-upsells__add.is-link { background: var(--cu-ink) !important; }
.chub-upsells__add.is-loading { opacity: .7; cursor: wait; pointer-events: none; }
.chub-upsells__add.is-added { background: var(--cu-green) !important; cursor: default; pointer-events: none; }

/* Arrows — desktop only, only when there are more than 5 products */
.chub-upsells__nav {
	display: none;
	position: absolute;
	top: 32%;
	z-index: 2;
	width: 28px;
	height: 28px;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid var(--cu-border) !important;
	border-radius: 50% !important;
	background: #fff !important;
	color: var(--cu-ink) !important;
	font-size: 18px !important;
	line-height: 24px !important;
	box-shadow: 0 2px 6px rgba(0,0,0,.12);
	cursor: pointer;
}
.chub-upsells__nav--prev { left: -12px; }
.chub-upsells__nav--next { right: -12px; }
.chub-upsells.has-overflow .chub-upsells__nav { display: block; }
.chub-upsells.at-start .chub-upsells__nav--prev,
.chub-upsells.at-end .chub-upsells__nav--next { display: none; }

/* Tablet: 4 across */
@media (max-width: 849px) {
	.chub-upsells__card { flex-basis: calc((100% - 3 * var(--cu-gap)) / 4); }
}

/* Phone: ~3 across with a peek of the next card (swipe hint) */
@media (max-width: 549px) {
	.chub-upsells { --cu-gap: 8px; padding: 12px 10px 10px; margin-bottom: 18px; }
	.chub-upsells__card { flex-basis: 34%; }
	.chub-upsells__nav { display: none !important; }
	.chub-upsells__title { font-size: .95em; }
	.chub-upsells select.chub-upsells__size { height: 32px !important; line-height: 30px !important; font-size: 14px !important; padding: 0 16px 0 4px !important; } /* 14px+ stops iOS zoom-on-tap */
	.chub-upsells__add { min-height: 32px; }
}