/* ============================================================
   WooCommerce Product Bundle Widgets for Elementor
   Author: Mohsin S Vahora — https://www.linkedin.com/in/mohsin-s-vahora/
   Version: 2.2.0
   ============================================================ */

.xws-fbt-wrap *, .xws-list-wrap * { box-sizing: border-box; }

/* ── FBT: Wrapper ────────────────────────────────────────────── */
.xws-fbt-wrap { width: 100%; }

.xws-fbt-heading {
	font-size: 1rem; font-weight: 700;
	letter-spacing: .05em; text-transform: uppercase;
	margin: 0 0 20px; text-align: center;
}

/* ── FBT: Images row ─────────────────────────────────────────── */
.xws-fbt-images-row {
	display: flex; align-items: center;
	justify-content: center; flex-wrap: wrap; gap: 16px;
	margin-bottom: 20px;
}

.xws-fbt-thumb { flex-shrink: 0; line-height: 0; }

.xws-fbt-thumb img {
	width: 120px; height: 120px;
	object-fit: cover; display: block;
	transition: opacity .25s, filter .25s;
}

.xws-fbt-thumb.xws-unchecked img { opacity: .35; filter: grayscale(50%); }

.xws-fbt-plus {
	font-size: 1.4rem; font-weight: 300;
	line-height: 1; color: #555; flex-shrink: 0; user-select: none;
}

/* ── FBT: Total ──────────────────────────────────────────────── */
.xws-fbt-total { font-size: .95rem; margin: 0 0 14px; text-align: left; }

/* ── FBT: Button ─────────────────────────────────────────────── */
.xws-fbt-btn {
	display: block; width: 100%; padding: 16px 24px;
	font-size: .8rem; font-weight: 700; letter-spacing: .1em;
	text-transform: uppercase; text-align: center; cursor: pointer;
	border: none; transition: background-color .2s, color .2s;
	margin-bottom: 20px; line-height: 1.3;
}
.xws-fbt-btn:disabled { opacity: .7; cursor: not-allowed; }
.xws-fbt-btn:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* ── FBT: Checklist ──────────────────────────────────────────── */
.xws-fbt-checklist { display: flex; flex-direction: column; gap: 10px; }

.xws-fbt-check-row { display: flex; align-items: center; gap: 10px; }

.xws-fbt-checkbox { width: 16px; height: 16px; flex-shrink: 0; cursor: pointer; }

.xws-fbt-check-label {
	display: flex; align-items: center; gap: 8px;
	flex: 1; cursor: pointer; font-size: .875rem;
}

.xws-fbt-check-label .xws-name {
	text-decoration: none; color: inherit; transition: opacity .2s;
}
.xws-fbt-check-label .xws-name:hover { text-decoration: underline; }

.xws-fbt-check-label .xws-price { margin-left: auto; font-weight: 600; white-space: nowrap; }
.xws-fbt-check-label .xws-price .price { font-size: 1em; }

/* ── Editor notice ───────────────────────────────────────────── */
.xws-empty-notice {
	padding: 16px; background: #fff3cd;
	border: 1px dashed #ffc107; border-radius: 4px;
	color: #856404; font-size: .875rem; line-height: 1.5; text-align: center;
}

/* ============================================================
   UPSELL / CROSS-SELL LIST
   ============================================================ */
.xws-list-wrap { width: 100%; }

.xws-list-heading {
	font-size: 1rem; font-weight: 700;
	letter-spacing: .05em; text-transform: uppercase;
	margin: 0 0 4px; text-align: center;
}

.xws-list-subheading {
	font-size: .85rem; margin: 0 0 16px;
	text-align: center; color: #666;
}

.xws-list-items { display: flex; flex-direction: column; }

.xws-list-row {
	display: flex; align-items: center; gap: 16px;
	padding: 14px 0; transition: background-color .2s;
}

.xws-list-row + .xws-list-row { border-top: 1px solid #e8e8e8; }

.xws-list-img {
	flex-shrink: 0; display: block;
	line-height: 0; overflow: hidden;
}

.xws-list-img img {
	width: 70px; height: 70px; object-fit: cover;
	display: block; transition: transform .3s;
}
.xws-list-row:hover .xws-list-img img { transform: scale(1.05); }

.xws-list-info {
	flex: 1; min-width: 0;
	display: flex; flex-direction: column; gap: 4px;
}

.xws-list-name {
	display: block; font-size: .875rem; font-weight: 500;
	text-decoration: none; color: inherit;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
	transition: opacity .2s;
}
.xws-list-name:hover { opacity: .7; }

.xws-list-price .price { font-size: .875rem; font-weight: 700; }
.xws-list-price .price del { font-weight: 400; opacity: .5; margin-right: 4px; }

/* ── Cart icon button ────────────────────────────────────────── */
.xws-list-cart-btn {
	flex-shrink: 0; display: inline-flex;
	align-items: center; justify-content: center;
	width: 44px; height: 44px; min-width: 44px;
	cursor: pointer; text-decoration: none;
	transition: background-color .2s, border-color .2s, transform .15s;
}
.xws-list-cart-btn:hover { transform: scale(1.08); }
.xws-list-cart-btn svg { width: 20px; height: 20px; display: block; pointer-events: none; }
.xws-list-cart-btn.added svg { animation: xws-pop .35s ease; }

@keyframes xws-pop {
	0%  { transform: scale(1); }
	50% { transform: scale(1.35); }
	100%{ transform: scale(1); }
}

/* ── Star rating ─────────────────────────────────────────────── */
.xws-star-rating { overflow: hidden; position: relative; height: 1em; line-height: 1; font-size: .8em; font-family: star, serif; width: 5.4em; }
.xws-star-rating::before { content: "\53\53\53\53\53"; opacity: .2; float: left; position: absolute; top: 0; left: 0; }
.xws-star-rating span { overflow: hidden; float: left; position: absolute; top: 0; left: 0; padding-top: 1.5em; }
.xws-star-rating span::before { content: "\53\53\53\53\53"; top: 0; left: 0; position: absolute; color: #d4af37; }

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 480px) {
	.xws-fbt-thumb img { width: 80px; height: 80px; }
	.xws-fbt-plus { font-size: 1rem; }
	.xws-list-img img { width: 56px; height: 56px; }
}
