/*
 * The cart page's chrome (Cart\CartPage): the count beside the title, the
 * notes under the fee and shipping lines, the sticky bar and the undo toast.
 * Everything here is printed by the plugin's own script; the theme adds no
 * rule for these classes.
 */

/* «Кошик  4 товари · 238 ₴» — the count is a footnote to the title. */
.gsl-cart-count {
	display: inline-block;
	margin-inline-start: var(--wp--preset--spacing--30);
	font-family: var(--wp--preset--font-family--fixel);
	font-size: var(--wp--preset--font-size--base);
	font-weight: 400;
	letter-spacing: 0;
	color: var(--wp--preset--color--muted);
	white-space: nowrap;
	vertical-align: 0.15em;
}

/* A note under a totals line: what one more small thing would change. */
/* «Товари (N)» drawn by cart-page.js when WooCommerce leaves its subtotal
   out; Woo's own totals classes give it the look of the line it replaces. */
.gsl-sum-goods {
	display: block;
}

/* The sum drawn while WooCommerce recounts (cart-page.js holdSums), in the
   skeleton's place — the skeleton itself goes, so the line keeps the
   figure's height and nothing under it moves. A line the store cannot
   answer keeps its last value, dimmed; «Разом» and «Товари» are live. */
.gsl-sum-held {
	opacity: 0.4;
}

.gsl-sum-held.is-live {
	opacity: 1;
}

.wc-block-components-totals-item:has(.gsl-sum-held) .wc-block-components-skeleton__element {
	display: none;
}

.gsl-sum-note {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-size: var(--wp--preset--font-size--label);
	line-height: 1.35;
	color: var(--wp--preset--color--gold-text);
}

/* The gift line in the list: cream, and neither a stepper nor a bin. Its
   quantity is always one and removing it here would only have GiftOfWeek put
   it back on the next recalculation — the strip's «змінити подарунок» is the
   honest control. The chain of Woo classes outranks the theme's white row. */
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row.gsl-row--gift {
	background: var(--wp--preset--color--cream);
}

.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row.gsl-row--gift .wc-block-components-quantity-selector,
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row.gsl-row--gift .wc-block-cart-item__remove-link {
	display: none;
}

/* ---- The sticky bar ---- */

.gsl-cartbar {
	position: fixed;
	inset-inline: 0;
	bottom: 0;
	z-index: 40;
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--40);
	padding: var(--wp--preset--spacing--30) var(--wp--custom--gutter);
	padding-bottom: calc(var(--wp--preset--spacing--30) + env(safe-area-inset-bottom, 0px));
	background: var(--wp--preset--color--base);
	border-top: 1px solid var(--wp--preset--color--border);
	box-shadow: 0 -6px 20px color-mix(in srgb, var(--wp--preset--color--ink) 8%, transparent);
}

.gsl-cartbar[hidden] {
	display: none;
}

.gsl-cartbar__state {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.15;
}

.gsl-cartbar__cap {
	font-size: var(--wp--preset--font-size--label);
	color: var(--wp--preset--color--muted);
	white-space: nowrap;
}

.gsl-cartbar__sum {
	font-size: var(--wp--preset--font-size--price);
	font-weight: 700;
	color: var(--wp--preset--color--ink);
	white-space: nowrap;
}

.gsl-cartbar__go {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	border-radius: var(--wp--custom--radius--medium);
	background: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--ink);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	text-decoration: none;
}

.gsl-cartbar__go:hover {
	background: var(--wp--preset--color--gold-hover);
	color: var(--wp--preset--color--ink);
}

/* The page keeps room under its last block while the bar is up. */
html.gsl-has-cartbar body {
	padding-bottom: 80px;
}

/* Desktop keeps the totals column sticky beside the list; a second bar
   there is noise. */
@media (min-width: 900px) {
	.gsl-cartbar {
		display: none;
	}
}

/* ---- The undo toast ---- */

.gsl-undo {
	position: fixed;
	left: var(--wp--custom--gutter);
	right: var(--wp--custom--gutter);
	bottom: calc(var(--wp--preset--spacing--40) + env(safe-area-inset-bottom, 0px));
	z-index: 41;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--30);
	max-width: 560px;
	margin-inline: auto;
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	border-radius: var(--wp--custom--radius--medium);
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--small);
	box-shadow: 0 8px 24px color-mix(in srgb, var(--wp--preset--color--ink) 25%, transparent);
}

.gsl-undo[hidden] {
	display: none;
}

/* Above the bar when both are up. */
html.gsl-has-cartbar .gsl-undo {
	bottom: calc(80px + var(--wp--preset--spacing--30) + env(safe-area-inset-bottom, 0px));
}

.gsl-undo__text {
	min-width: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.gsl-undo__restore {
	flex: none;
	min-height: 36px;
	padding: 0 var(--wp--preset--spacing--30);
	border: 0;
	border-radius: var(--wp--custom--radius--small);
	background: none;
	color: var(--wp--preset--color--gold);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	cursor: pointer;
}

.gsl-undo__restore:hover {
	color: var(--wp--preset--color--base);
}