/* TAI set-deal offer visibility — Hush branding
 * Palette: cream #fffcf5, ink #1c1340, blue #0554ff, pink #ff3ea5, lime #c6ff4f
 */

.tai-setdeal-banner {
	--hush-cream: #fffcf5;
	--hush-ink:   #1c1340;
	--hush-blue:  #0554ff;
	--hush-pink:  #ff3ea5;
	--hush-lime:  #c6ff4f;
	--hush-green: #8fd14f;
	--hush-line:  #ece7f5;
	--hush-line-2:#e3ddf0;
	--hush-ink-soft:#4a4364;
	--hush-r-md:  16px;
	--hush-r-lg:  24px;
	--hush-shadow-sm:0 2px 8px rgba(28,19,64,.05);
	--hush-shadow-md:0 10px 30px rgba(28,19,64,.08);
	--hush-ease:  cubic-bezier(.22,1,.36,1);
	font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ---------- Shop / archive ribbon ----------
 * Placement is handled by assets/offers.js, which moves the badge onto the
 * product thumbnail. CSS anchoring was tried and abandoned: themes emit the
 * loop hook in wildly different places, and the badge kept resolving against
 * the wrong positioned ancestor in carousels and column wrappers.
 *
 * Nothing here is load-bearing. The badge's positioning is inlined on the
 * element, and it ships `hidden` until the script places it, so a stripped or
 * cached-away stylesheet can never let it disturb a grid.
 */
.tai-setdeal-ribbon-wrap[hidden] {
	display: none !important;
}
.tai-setdeal-ribbon-wrap {
	pointer-events: none;
}
.tai-setdeal-ribbon {
	font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	letter-spacing: .01em;
}

/* ---------- Single product banner ---------- */
.tai-setdeal-banner {
	margin: 18px 0 22px;
	padding: 18px 20px;
	border: 1px solid var(--hush-line-2);
	border-radius: var(--hush-r-md);
	background: linear-gradient( 135deg, rgba( 5, 84, 255, .05 ) 0%, rgba( 255, 62, 165, .05 ) 100% );
	box-shadow: var(--hush-shadow-sm);
}

.tai-setdeal-banner__head {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 4px;
}
.tai-setdeal-banner__title {
	font-family: 'Fraunces', Georgia, serif;
	font-size: 17px;
	font-weight: 700;
	color: var(--hush-ink);
	line-height: 1.25;
}
.tai-setdeal-banner__save {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--hush-lime);
	color: var(--hush-ink);
	font-size: 12px;
	font-weight: 700;
}
.tai-setdeal-banner__sub {
	margin: 0 0 10px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--hush-ink-soft);
}

/* Live progress, injected by the companion popup plugin. */
.tai-setdeal-banner__progress[hidden] { display: none; }
.tai-setdeal-banner__progress {
	margin: 0 0 12px;
}
.tai-setdeal-banner__progress-text {
	display: block;
	margin-bottom: 7px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--hush-blue);
}
.tai-setdeal-banner__progress-text.is-complete {
	color: var(--hush-green);
}
.tai-setdeal-banner__track {
	height: 8px;
	border-radius: 999px;
	background: rgba( 28, 19, 64, .08 );
	overflow: hidden;
}
.tai-setdeal-banner__track > span {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: linear-gradient( 90deg, var(--hush-blue) 0%, var(--hush-pink) 100% );
	transition: width .45s cubic-bezier(.2,.8,.2,1);
}

/* ---------- Product chips (the rest of the set) ---------- */
.tai-setdeal-banner__items {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}
.tai-setdeal-chip {
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 220px;
	padding: 6px 12px 6px 6px;
	border: 1px solid var(--hush-line);
	border-radius: 999px;
	background: #fff;
	text-decoration: none;
	transition: border-color .35s var(--hush-ease), transform .35s var(--hush-ease), box-shadow .35s var(--hush-ease);
}
.tai-setdeal-chip:hover {
	border-color: var(--hush-blue);
	transform: translateY( -2px );
	box-shadow: var(--hush-shadow-md);
}
.tai-setdeal-chip.is-current {
	border-color: var(--hush-blue);
	background: var(--hush-blue-050, #eef2ff);
}
.tai-setdeal-chip img {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	object-fit: cover;
	flex: 0 0 auto;
}
.tai-setdeal-chip__name {
	font-size: 13px;
	font-weight: 600;
	color: var(--hush-ink);
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.tai-setdeal-chip.is-in-cart .tai-setdeal-chip__name::after {
	content: ' ✓';
	color: var(--hush-green);
}

/* ---------- Cart line badge ---------- */
.tai-bogo-setdeal-badge {
	font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
}

@media ( max-width: 480px ) {
	.tai-setdeal-chip { max-width: 100%; }
	.tai-setdeal-banner__items { flex-direction: column; }
}
