/* BoseVN Bundle Products — storefront. Mobile first; tokens from bose.css. */

.bosevn-bundle {
	display: flex;
	flex-direction: column;
	gap: var(--bose-space-4, 16px);
	margin: 0 0 var(--bose-space-6, 24px);
	color: var(--bose-color-text-primary, #000);
}

.bosevn-bundle__items {
	display: flex;
	flex-direction: column;
	gap: var(--bose-space-3, 12px);
}

.bosevn-bundle__heading {
	margin: var(--bose-space-2, 8px) 0 0;
}

.bosevn-bundle__text > :last-child {
	margin-bottom: 0;
}

.bosevn-bundle__item {
	display: flex;
	align-items: flex-start;
	gap: var(--bose-space-3, 12px);
	padding: var(--bose-space-3, 12px);
	border: var(--bose-border-width-hairline, 1px) solid var(--bose-color-border-default, #ddd);
	border-radius: var(--bose-radius-sm, 3px);
	background: var(--bose-color-surface-default, #fff);
}

.bosevn-bundle__item--off {
	opacity: 0.55;
}

.bosevn-bundle__thumb {
	flex: 0 0 64px;
}

.bosevn-bundle__thumb img {
	display: block;
	width: 64px;
	height: 64px;
	object-fit: contain;
}

.bosevn-bundle__body {
	display: flex;
	flex: 1 1 0;
	flex-direction: column;
	gap: var(--bose-space-1, 4px);
	min-width: 0;
}

.bosevn-bundle__name {
	margin: 0;
	font-size: var(--bose-font-size-md, 16px);
	font-weight: 600;
}

.bosevn-bundle__name a {
	color: inherit;
	text-decoration: none;
}

.bosevn-bundle__times {
	color: var(--bose-color-text-secondary, #555);
	font-weight: 400;
	white-space: nowrap;
}

.bosevn-bundle__desc,
.bosevn-bundle__stock {
	color: var(--bose-color-text-secondary, #555);
	font-size: var(--bose-font-size-sm, 14px);
}

.bosevn-bundle__desc p {
	margin: 0;
}

.bosevn-bundle__attrs {
	display: flex;
	flex-direction: column;
	gap: var(--bose-space-2, 8px);
	margin-top: var(--bose-space-1, 4px);
}

.bosevn-bundle__attr {
	display: flex;
	flex-direction: column;
	gap: var(--bose-space-1, 4px);
	font-size: var(--bose-font-size-sm, 14px);
}

.bosevn-bundle__attr select {
	width: 100%;
	min-height: 44px;
}

.bosevn-bundle__price {
	font-size: var(--bose-font-size-sm, 14px);
}

.bosevn-bundle__qty {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
}

.bosevn-bundle__qty-input {
	width: 48px;
	min-height: 44px;
	text-align: center;
	-moz-appearance: textfield;
}

.bosevn-bundle__qty-input::-webkit-inner-spin-button,
.bosevn-bundle__qty-input::-webkit-outer-spin-button {
	margin: 0;
	-webkit-appearance: none;
}

.bosevn-bundle__step {
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	border: var(--bose-border-width-hairline, 1px) solid var(--bose-color-border-default, #ddd);
	background: var(--bose-color-surface-default, #fff);
	color: var(--bose-color-text-primary, #000);
	cursor: pointer;
}

.bosevn-bundle__total {
	font-size: var(--bose-font-size-lg, 18px);
	font-weight: 600;
}

.bosevn-bundle__total:empty {
	display: none;
}

.bosevn-bundle__notice {
	color: var(--bose-color-status-error, #c00);
	font-size: var(--bose-font-size-sm, 14px);
}

/* Narrow screens: quantity drops under the item body. */
.bosevn-bundle__item:has(.bosevn-bundle__qty) {
	flex-wrap: wrap;
}

.bosevn-bundle__item .bosevn-bundle__qty {
	flex-basis: 100%;
}

.bosevn-bundle__thumb ~ .bosevn-bundle__qty {
	padding-left: calc(64px + var(--bose-space-3, 12px));
}

@media (min-width: 768px) {
	.bosevn-bundle__item:has(.bosevn-bundle__qty) {
		flex-wrap: nowrap;
	}

	.bosevn-bundle__item .bosevn-bundle__qty {
		flex-basis: auto;
	}

	.bosevn-bundle__thumb ~ .bosevn-bundle__qty {
		padding-left: 0;
	}

	.bosevn-bundle__attrs {
		flex-direction: row;
		flex-wrap: wrap;
	}

	.bosevn-bundle__attr {
		flex: 1 1 160px;
	}

	/* Product tile grid: a true 2D layout. */
	.bosevn-bundle--grid-2 .bosevn-bundle__items,
	.bosevn-bundle--grid-3 .bosevn-bundle__items,
	.bosevn-bundle--grid-4 .bosevn-bundle__items {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.bosevn-bundle--grid-2 .bosevn-bundle__heading,
	.bosevn-bundle--grid-3 .bosevn-bundle__heading,
	.bosevn-bundle--grid-4 .bosevn-bundle__heading {
		grid-column: 1 / -1;
	}

	.bosevn-bundle--grid-2 .bosevn-bundle__item,
	.bosevn-bundle--grid-3 .bosevn-bundle__item,
	.bosevn-bundle--grid-4 .bosevn-bundle__item {
		flex-direction: column;
		flex-wrap: nowrap;
	}

	.bosevn-bundle--grid-2 .bosevn-bundle__thumb,
	.bosevn-bundle--grid-3 .bosevn-bundle__thumb,
	.bosevn-bundle--grid-4 .bosevn-bundle__thumb {
		flex-basis: auto;
	}

	.bosevn-bundle--grid-2 .bosevn-bundle__thumb img,
	.bosevn-bundle--grid-3 .bosevn-bundle__thumb img,
	.bosevn-bundle--grid-4 .bosevn-bundle__thumb img {
		width: 100%;
		height: auto;
		aspect-ratio: 1;
	}
}

@media (min-width: 1025px) {
	.bosevn-bundle--grid-3 .bosevn-bundle__items {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.bosevn-bundle--grid-4 .bosevn-bundle__items {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* Cart / mini cart / order rows of bundled members. Phones: WooCommerce's
   stacked cart; drop the member's empty remove/price/subtotal cells. */
@media (max-width: 768px) {
	.woocommerce table.shop_table_responsive tr.bosevn-bundle-child td.product-remove,
	.woocommerce table.shop_table_responsive tr.bosevn-bundle-child td.product-price,
	.woocommerce table.shop_table_responsive tr.bosevn-bundle-child td.product-subtotal {
		display: none;
	}
}

.woocommerce-mini-cart-item.bosevn-bundle-child {
	padding-left: var(--bose-space-8, 32px);
}

@media (min-width: 769px) {
	.woocommerce table.shop_table tr.bosevn-bundle-child td.product-name,
	.woocommerce table.shop_table tr.bosevn-bundle-child td.product-thumbnail {
		padding-left: var(--bose-space-8, 32px);
	}
}

.bosevn-bundle-cart__in {
	display: block;
	color: var(--bose-color-text-secondary, #555);
	font-size: var(--bose-font-size-xs, 12px);
}

.bosevn-bundle-cart__edit {
	display: table;
	margin-top: var(--bose-space-1, 4px);
	font-size: var(--bose-font-size-sm, 14px);
}

/* "Có trong các bộ". */
.bosevn-bundles-in {
	margin: var(--bose-space-6, 24px) 0;
}

.bosevn-bundles-in__title {
	margin: 0 0 var(--bose-space-3, 12px);
	font-weight: 600;
}

.bosevn-bundles-in__list {
	display: flex;
	flex-direction: column;
	gap: var(--bose-space-3, 12px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.bosevn-bundles-in__item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--bose-space-2, 8px);
}

.bosevn-bundles-in__link {
	display: flex;
	align-items: center;
	gap: var(--bose-space-3, 12px);
	min-height: 44px;
	color: inherit;
	text-decoration: none;
}

.bosevn-bundles-in__link img {
	width: 48px;
	height: 48px;
	object-fit: contain;
}
