/* Store Cart page — the Package Booking and Cart design.

   StoreEngine owns this page's markup, so everything here is scoped to its
   own cart classes and only loads where the cart list table is on the page.
   Two-column layout: line items left, StoreEngine's own coupon + totals +
   checkout column right (left as StoreEngine styles it). */

/* Items left, coupon + totals + checkout in a 340px column on the right. */
.wp-block-columns:has(> .wp-block-column > .storeengine-apply-coupon-form-shortcode) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 40px;
	align-items: start;
}

.wp-block-columns:has(> .wp-block-column > .storeengine-apply-coupon-form-shortcode) > .wp-block-column {
	flex-basis: auto !important;
	min-width: 0;
}

.wp-block-columns:has(> .wp-block-column > .storeengine-apply-coupon-form-shortcode) > .wp-block-column:has(> .storeengine-apply-coupon-form-shortcode) {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

/* The list sits in a nested 2/3 column of its own; let it take the whole cell. */
.wp-block-column:has(> .storeengine-cart-list-table-shortcode) {
	flex-basis: 100% !important;
	min-width: 0;
}

/* Empty spacer columns left over from the page layout. */
.wp-block-columns:has(.storeengine-cart-list-table-shortcode) .wp-block-column:empty {
	display: none;
}

@media (max-width: 900px) {
	.wp-block-columns:has(> .wp-block-column > .storeengine-apply-coupon-form-shortcode) {
		grid-template-columns: minmax(0, 1fr);
		gap: 28px;
	}
}

/* Line items: one bordered card per line, as tall as its content and flat. */
.storeengine-cart-list-table-shortcode,
.wp-block-column:has(> .storeengine-cart-list-table-shortcode),
.wp-block-columns:has(.storeengine-cart-list-table-shortcode) {
	height: auto;
	min-height: 0;
	align-items: flex-start;
	box-shadow: none;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-table,
.storeengine-cart-list-table-shortcode .storeengine-cart-table__body,
.storeengine-cart-list-table-shortcode .storeengine-cart-table__body-td,
.storeengine-cart-list-table-shortcode .storeengine-cart-product {
	height: auto;
	min-height: 0;
	box-shadow: none;
}

.storeengine-cart-list-table-shortcode {
	--gembk-cart-accent: var(--gembk-pkg-accent, var(--gembk-c-primary, #006bff));
}

.storeengine-cart-list-table-shortcode .storeengine-cart-table,
.storeengine-cart-list-table-shortcode .storeengine-cart-table__body {
	display: block;
	width: 100%;
	min-width: 0;
	overflow: visible;
	border: 0;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-table__body {
	display: flex;
	flex-direction: column;
	gap: 16px;
	container-type: inline-size;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-table__row {
	--gembk-cart-pad: 16px;
	--gembk-cart-thumb: 96px;
	--gembk-cart-gap: 20px;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: var(--gembk-cart-pad);
	flex: 0 0 auto;
	align-self: flex-start;
	width: 100%;
	height: auto !important;
	min-height: 0 !important;
	overflow: hidden;
	border: 1px solid #dfe1e5;
	border-radius: 12px;
	background: #fff;
	box-shadow: none !important;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-table__body-td {
	display: block;
	width: auto;
	padding: 0;
	border: 0;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-table__body-td:first-child {
	width: 100%;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-product {
	display: flex;
	align-items: flex-start;
	gap: var(--gembk-cart-gap);
}

.storeengine-cart-list-table-shortcode .storeengine-cart-product__thumbnail {
	flex: none;
	width: var(--gembk-cart-thumb);
	height: var(--gembk-cart-thumb);
	overflow: hidden;
	border-radius: 10px;
	background: #c7e4fb;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-product__thumbnail a,
.storeengine-cart-list-table-shortcode .storeengine-cart-product__thumbnail img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-product__content {
	flex: 1;
	min-width: 0;
	max-width: none;
	display: flex;
	flex-direction: column;
	/* StoreEngine sets `wrap` on this column; a wrapping column container
	   sizes its line from leftover space and blows the card up to several
	   hundred pixels once a collapsed <details> is inside it. */
	flex-wrap: nowrap;
	gap: 10px;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-product-title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: normal;
	text-transform: none;
	color: #131d2b;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-product-title a {
	color: inherit;
	text-decoration: none;
}

/* Quantity · line total · remove. */
.storeengine-cart-list-table-shortcode .storeengine-cart-product-quantity-wrap {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
}

.storeengine-cart-list-table-shortcode .storeengine-quantity-input {
	order: 1;
	display: flex;
	align-items: center;
	overflow: hidden;
	border: 1px solid #dfe1e5;
	border-radius: 8px;
}

.storeengine-cart-list-table-shortcode .storeengine-cart-item-subtotal {
	order: 2;
	min-width: 88px;
	font-size: 16px;
	font-weight: 700;
	color: #131d2b;
}

.storeengine-cart-list-table-shortcode .storeengine-remove-cart-item {
	order: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 6px;
	color: #d92d20;
	text-decoration: none;
}

.storeengine-cart-list-table-shortcode .storeengine-remove-cart-item:hover {
	background: #fef3f2;
}

.storeengine-cart-list-table-shortcode .storeengine-quantity-input__btn {
	width: 36px;
	height: 38px;
	border: 0;
	border-radius: 0;
	background: #fff;
	color: #374151;
	cursor: pointer;
}

.storeengine-cart-list-table-shortcode .storeengine-quantity-input__btn.decrement {
	background: #f3f4f6;
}

.storeengine-cart-list-table-shortcode .storeengine-quantity-input__btn:disabled {
	opacity: 0.4;
	cursor: default;
}

.storeengine-cart-list-table-shortcode .storeengine-quantity-input__input {
	width: 44px;
	height: 38px;
	padding: 0;
	border: 0;
	background: transparent;
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	-moz-appearance: textfield;
}

.storeengine-cart-list-table-shortcode .storeengine-quantity-input__input::-webkit-outer-spin-button,
.storeengine-cart-list-table-shortcode .storeengine-quantity-input__input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* The unit price repeats the line total on a package; the card already shows it. */
.storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-product-price,
.storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-product-price-wrap,
.storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-item-data {
	display: none;
}

/* Room wide enough: the controls sit top-right of the card, as in the design. */
@container (min-width: 640px) {
	.storeengine-cart-list-table-shortcode .storeengine-cart-table__body-td:last-child {
		position: absolute;
		top: var(--gembk-cart-pad);
		right: var(--gembk-cart-pad);
	}

	.storeengine-cart-list-table-shortcode .storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-product-title,
	.storeengine-cart-list-table-shortcode .gembk-cart-pkg__meta,
	.storeengine-cart-list-table-shortcode .gembk-cart-pkg__toggle {
		max-width: calc(100% - 310px);
	}
}

/* An open list is the last thing in the card: let it meet the bottom edge. */
.storeengine-cart-list-table-shortcode .storeengine-cart-table__row:has(.gembk-cart-pkg__details[open]) {
	padding-bottom: 0;
}

/* StoreEngine drops the top border of the first row and the bottom border of
   the last one; the card needs all four sides. */
.storeengine-cart-list-table-shortcode .storeengine-cart-table .storeengine-cart-table__row:first-child,
.storeengine-cart-list-table-shortcode .storeengine-cart-table .storeengine-cart-table__row:last-child {
	border: 1px solid #dfe1e5;
}

/* Package line. */
.gembk-cart-pkg__badge {
	padding: 2px 9px;
	border-radius: 10px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: var(--gembk-cart-accent, #006bff);
	background: color-mix(in srgb, var(--gembk-cart-accent, #006bff) 8%, #fff);
}

.gembk-cart-pkg {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.gembk-cart-pkg__meta {
	font-size: 13px;
	color: #575e6c;
}

.gembk-cart-pkg__toggle {
	display: flex;
	align-items: center;
	align-self: flex-start;
	gap: 6px;
	width: fit-content;
	font-size: 13px;
	font-weight: 600;
	color: var(--gembk-cart-accent, #006bff);
	cursor: pointer;
	list-style: none;
}

.gembk-cart-pkg__toggle::-webkit-details-marker {
	display: none;
}

.gembk-cart-pkg__toggle svg {
	transition: transform 0.2s;
}

.gembk-cart-pkg__details[open] .gembk-cart-pkg__toggle svg {
	transform: rotate(180deg);
}

.gembk-cart-pkg__hide,
.gembk-cart-pkg__details[open] .gembk-cart-pkg__show {
	display: none;
}

.gembk-cart-pkg__details[open] .gembk-cart-pkg__hide {
	display: inline;
}

/* Accordion: collapsed means no box at all, so the card is only as tall as
   its header. The list never reserves height while closed. */
.gembk-cart-pkg__details {
	height: auto;
	min-height: 0;
}

.gembk-cart-pkg__details:not([open]) > .gembk-cart-pkg__list {
	display: none;
}

/* The included items run edge to edge under the whole card, like the design.
   Shifted with `left` + a wider box rather than negative side margins: those
   leave the line's measured height too tall, so the card grew a blank strip. */
.gembk-cart-pkg__list {
	--gembk-cart-bleed: calc(var(--gembk-cart-pad) + var(--gembk-cart-thumb) + var(--gembk-cart-gap));
	position: relative;
	left: calc(var(--gembk-cart-bleed) * -1);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	width: calc(100% + var(--gembk-cart-bleed) + var(--gembk-cart-pad));
	max-width: none;
	/* Starts at least 16px below the thumbnail, which is taller than the header text. */
	margin: max(16px, calc(var(--gembk-cart-thumb) - 64px)) 0 0;
	padding: 6px var(--gembk-cart-pad);
	list-style: none;
	border-top: 1px solid #dfe1e5;
	background: #f6f7f8;
	animation: gembkCartFade 0.2s ease;
}

.gembk-cart-pkg__item {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px 16px;
	margin: 0;
	padding: 10px 0;
}

.gembk-cart-pkg__item + .gembk-cart-pkg__item {
	border-top: 1px solid #dfe1e5;
}

.gembk-cart-pkg__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 24px;
	height: 24px;
	border-radius: 6px;
	color: var(--gembk-cart-accent, #006bff);
	background: color-mix(in srgb, var(--gembk-cart-accent, #006bff) 8%, #fff);
}

.gembk-cart-pkg__icon.is-appointment {
	color: #b54708;
	background: #fef0c7;
}

.gembk-cart-pkg__info {
	flex: 1 1 130px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.gembk-cart-pkg__name {
	font-size: 13px;
	font-weight: 500;
	color: #131d2b;
}

.gembk-cart-pkg__sub {
	font-size: 12px;
	color: #575e6c;
}

.gembk-cart-pkg__facets {
	display: flex;
	flex-wrap: wrap;
	flex: 0 1 auto;
	gap: 8px 16px;
}

.gembk-cart-pkg__facet {
	display: flex;
	align-items: center;
	gap: 7px;
	min-width: 64px;
	font-size: 13px;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
	color: #374151;
}

.gembk-cart-pkg__facet.is-date {
	min-width: 104px;
}

.gembk-cart-pkg__facet.is-time {
	min-width: 160px;
}

.gembk-cart-pkg__facet svg {
	flex-shrink: 0;
	color: #575e6c;
}

@keyframes gembkCartFade {
	from {
		opacity: 0;
		transform: translateY(5px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@container (max-width: 639px) {
	.storeengine-cart-list-table-shortcode .storeengine-cart-table__row {
		--gembk-cart-pad: 16px;
		--gembk-cart-thumb: 72px;
	}

	.gembk-cart-pkg__facets {
		flex-basis: 100%;
	}
}

/* Mini cart drawer: the same package line, kept compact. The drawer is only
   ~400px wide, so the thumbnail shrinks, the controls stay in their own
   column and the included items stack as a plain list instead of bleeding
   to the card edges. */
.storeengine-mini-cart-drawer-content .storeengine-cart-table,
.storeengine-mini-cart-drawer-content .storeengine-cart-table__body {
	display: block;
	width: 100%;
	min-width: 0;
	border: 0;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-table__body {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-table__row {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 12px;
	height: auto;
	border: 1px solid #dfe1e5;
	border-radius: 10px;
	box-shadow: none;
	background: #fff;
}

/* StoreEngine drops the first row's top and the last row's bottom border. */
.storeengine-mini-cart-drawer-content .storeengine-cart-table .storeengine-cart-table__row:first-child,
.storeengine-mini-cart-drawer-content .storeengine-cart-table .storeengine-cart-table__row:last-child {
	border: 1px solid #dfe1e5;
}

/* A single booking line: date, time and who-with stack as label / value rows
   instead of one run-on line of dot-separated text. */
.storeengine-mini-cart-drawer-content .storeengine-cart-item-data {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 3px;
	margin: 2px 0 0;
	font-size: 12px;
	line-height: 1.4;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-item-data li {
	display: flex;
	flex-wrap: wrap;
	gap: 0 6px;
	margin: 0;
	padding: 0;
	overflow-wrap: anywhere;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-item-data li::after {
	content: none !important;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-item-data li b {
	font-weight: 600;
	color: #575e6c;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-item-data li span {
	color: #131d2b;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-table__body-td {
	display: block;
	padding: 0;
	border: 0;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-table__body-td:first-child {
	flex: 1;
	min-width: 0;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-product {
	align-items: flex-start;
	gap: 12px;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-product__thumbnail {
	flex: none;
	width: 56px;
	height: 56px;
	overflow: hidden;
	border-radius: 8px;
	background: #c7e4fb;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-product__thumbnail a,
.storeengine-mini-cart-drawer-content .storeengine-cart-product__thumbnail img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-product__content {
	flex: 1;
	min-width: 0;
	max-width: none;
	flex-wrap: nowrap;
	gap: 6px;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-product__content .storeengine-cart-product-title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	max-width: none;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-product-title a {
	font-size: 14px;
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: normal;
	text-transform: none;
	text-decoration: none;
	color: #131d2b;
}

/* The plain rows and unit price repeat what the card already says. */
.storeengine-mini-cart-drawer-content .storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-item-data,
.storeengine-mini-cart-drawer-content .storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-product-price,
.storeengine-mini-cart-drawer-content .storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-product-price-wrap {
	display: none;
}

.storeengine-mini-cart-drawer-content .gembk-cart-pkg {
	gap: 6px;
}

.storeengine-mini-cart-drawer-content .gembk-cart-pkg__meta {
	font-size: 12px;
}

.storeengine-mini-cart-drawer-content .gembk-cart-pkg__toggle {
	font-size: 12px;
}

.storeengine-mini-cart-drawer-content .gembk-cart-pkg__list {
	/* Same edge-to-edge trick as the cart page: step back over the thumbnail
	   (56px) and its gap (12px) so the list spans the whole card. */
	--gembk-cart-bleed: 68px;
	left: calc(var(--gembk-cart-bleed) * -1);
	width: calc(100% + var(--gembk-cart-bleed));
	margin: 4px 0 12px;
	padding: 4px 10px;
	border: 1px solid #dfe1e5;
	border-radius: 8px;
}

/* An open list is the last thing in the card: let it meet the bottom edge. */
.storeengine-mini-cart-drawer-content .storeengine-cart-table__row:has(.gembk-cart-pkg__details[open]) {
	padding-bottom: 0;
	overflow: hidden;
}

.storeengine-mini-cart-drawer-content .gembk-cart-pkg__item {
	gap: 6px 10px;
	padding: 8px 0;
}

.storeengine-mini-cart-drawer-content .gembk-cart-pkg__facets {
	flex-basis: 100%;
	gap: 4px 12px;
}

.storeengine-mini-cart-drawer-content .gembk-cart-pkg__facet,
.storeengine-mini-cart-drawer-content .gembk-cart-pkg__facet.is-date,
.storeengine-mini-cart-drawer-content .gembk-cart-pkg__facet.is-time {
	min-width: 0;
	font-size: 12px;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-product-quantity-wrap {
	flex-direction: column;
	align-items: flex-end;
	gap: 8px;
}

/* Package line in the drawer: qty / price / remove float top-right, so the
   included-items list can open underneath them at the card's full width. */
.storeengine-mini-cart-drawer-content .storeengine-cart-table__row:has(.gembk-cart-pkg) {
	position: relative;
	min-height: 116px;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-table__body-td:last-child {
	position: absolute;
	top: 12px;
	right: 12px;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-table__body-td:first-child {
	width: 100%;
}

.storeengine-mini-cart-drawer-content .storeengine-cart-table__row:has(.gembk-cart-pkg) .storeengine-cart-product__content {
	/* Room for the controls column. */
	padding-right: 164px;
}

.storeengine-mini-cart-drawer-content .gembk-cart-pkg__list {
	/* Thumbnail + gap on the left, the controls column on the right. */
	width: calc(100% + var(--gembk-cart-bleed) + 164px);
	margin-top: 24px;
}

.storeengine-mini-cart-drawer-content .gembk-cart-pkg__toggle {
	white-space: nowrap;
}
