/**
 * Side cart (woocommerce/cart/mini-cart.php, inc/side-cart.php): the Shoptimizer cart drawer after the
 * "Koszyk boczny" mockup. Heading, free shipping bar and footer stay in place, only the products and the
 * products that fit scroll. The footer is a short receipt: products, coupons and delivery in a panel, the sum
 * to pay under it. Colours: assets/css/tokens.css; the checkout button is the darker red of the accent
 * (--sz-accent-strong), because white on #e94b32 is below 4.5:1.
 */

/* ------------------------------------------------------------------
   Drawer frame: 440 px on wider screens, the whole screen on phones (Shoptimizer below 480 px)
   ------------------------------------------------------------------ */
@media (min-width: 481px) {
	.shoptimizer-mini-cart-wrap {
		right: -440px;
		width: 440px;
	}
}
.shoptimizer-mini-cart-wrap .cart-drawer-heading {
	/* The template prints its own heading with the number of products. */
	display: none;
}
.shoptimizer-mini-cart-wrap .close-drawer {
	z-index: 20;
	top: 9px;
	right: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
}
.shoptimizer-mini-cart-wrap .close-drawer:hover {
	background: var(--sz-bg2);
}
.shoptimizer-mini-cart-wrap .close-drawer:focus-visible {
	outline: 2px solid var(--sz-navy);
	outline-offset: -2px;
}
.shoptimizer-mini-cart-wrap .close-drawer span {
	width: 24px;
	height: 24px;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart {
	overflow: hidden;
	height: 100%;
	margin-top: 0;
	padding: 0;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart_content {
	min-height: 0;
	height: 100%;
	font-size: 14px;
	line-height: 1.45;
	color: var(--sz-ink);
}

/* ------------------------------------------------------------------
   Heading
   ------------------------------------------------------------------ */
.sz-cart-head {
	display: flex;
	flex: none;
	align-items: baseline;
	gap: 10px;
	padding: 18px 64px 16px 20px;
	border-bottom: 1px solid var(--sz-line);
}
.shoptimizer-mini-cart-wrap .sz-cart-head__title {
	margin: 0;
	font-family: Poppins, sans-serif;
	font-size: 19px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--sz-navy);
}
.sz-cart-head__count {
	font-size: 13.5px;
	color: var(--sz-mute);
}

/* ------------------------------------------------------------------
   Free shipping bar, always visible above the products: navy with a truck below the threshold, green
   with a tick after it; with a coupon a note says which amount the threshold counts
   ------------------------------------------------------------------ */
.sz-cart-ship {
	flex: none;
	padding: 12px 20px 14px;
	background: var(--sz-bg2);
}
.shoptimizer-mini-cart-wrap .sz-cart-ship p {
	margin: 0;
}
.shoptimizer-mini-cart-wrap .sz-cart-ship .sz-cart-ship__text {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--sz-ink);
}
.sz-cart-ship__text .amount {
	font-weight: 700;
}
.shoptimizer-mini-cart-wrap .sz-cart-ship .sz-cart-ship__note {
	padding-left: 26px;
	font-size: 12.5px;
	color: var(--sz-mute);
}
.sz-cart-ship__bar {
	overflow: hidden;
	height: 8px;
	margin-top: 8px;
	background: #dfe3ec;
	border-radius: 99px;
}
.sz-cart-ship__bar span {
	display: block;
	height: 100%;
	background: var(--sz-navy);
	border-radius: inherit;
}
.sz-cart-ship.is-free {
	background: var(--sz-ok-bg-soft);
}
.shoptimizer-mini-cart-wrap .sz-cart-ship.is-free .sz-cart-ship__text {
	font-weight: 600;
	color: var(--sz-ok);
}
.sz-cart-ship.is-free .sz-cart-ship__bar span {
	background: var(--sz-ok);
}
.shoptimizer-mini-cart-wrap .sz-icon {
	flex: none;
	width: 18px;
	height: 18px;
	fill: none;
	stroke: var(--sz-navy);
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.sz-cart-ship.is-free .sz-icon {
	stroke: var(--sz-ok);
}

/* ------------------------------------------------------------------
   Products: the only part that scrolls, together with the products that fit
   ------------------------------------------------------------------ */
.sz-cart-scroll {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 0 20px;
	scrollbar-width: thin;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-items {
	flex: none;
	overflow: visible;
	height: auto;
	margin: 0;
	padding: 0;
}
.shoptimizer-mini-cart-wrap .woocommerce-mini-cart.sz-cart-items::before {
	display: none;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart li.sz-cart-item {
	display: grid;
	grid-template-columns: 80px minmax(0, 1fr) auto;
	gap: 14px;
	overflow: visible;
	padding: 16px 0;
	border-bottom: 1px solid var(--sz-line);
	font-size: 14px;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart li.sz-cart-item:last-child {
	border-bottom: 1px solid var(--sz-line);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart li.sz-cart-item a {
	margin: 0;
}
.sz-cart-item__image {
	display: block;
	align-self: start;
	padding: 4px;
	background: #fff;
	border: 1px solid var(--sz-line);
	border-radius: var(--sz-radius);
}
.shoptimizer-mini-cart-wrap .product_list_widget .sz-cart-item__image img {
	float: none;
	width: 100%;
	max-width: 100%;
	height: auto;
	aspect-ratio: 1;
	margin: 0;
	object-fit: contain;
}
.sz-cart-item__body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart li.sz-cart-item .sz-cart-item__name {
	display: -webkit-box;
	overflow: hidden;
	font-size: 14px;
	line-height: 1.4;
	color: var(--sz-ink);
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart li.sz-cart-item .sz-cart-item__name:hover {
	color: var(--sz-navy);
	text-decoration: underline;
}
.sz-cart-item__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 16px;
}
.sz-cart-item__actions > .woocommerce-Price-amount {
	/* Shoptimizer prints the unit price before its quantity buttons; the price stands on the right. */
	display: none;
}
.sz-cart-item__actions .shoptimizer-custom-quantity-mini-cart_container {
	display: flex;
}
.shoptimizer-mini-cart-wrap .sz-cart-item__actions .shoptimizer-custom-quantity-mini-cart {
	width: auto;
	margin: 0;
	padding: 0;
	border: 1px solid var(--sz-field);
	border-radius: var(--sz-radius);
	box-shadow: none;
}
.shoptimizer-mini-cart-wrap .sz-cart-item__actions .shoptimizer-custom-quantity-mini-cart_button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	font-size: 18px;
	line-height: 1;
	color: var(--sz-navy);
	background: transparent;
	border: 0;
	cursor: pointer;
}
.shoptimizer-mini-cart-wrap .sz-cart-item__actions .shoptimizer-custom-quantity-mini-cart_button:hover {
	background: var(--sz-bg2);
}
.shoptimizer-mini-cart-wrap .sz-cart-item__actions .shoptimizer-custom-quantity-mini-cart input {
	width: 34px;
	height: 36px;
	font-size: 14px;
	font-weight: 600;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .product_list_widget li a.remove.sz-cart-item__remove {
	position: static;
	width: auto;
	height: auto;
	font-size: 13px;
	color: var(--sz-mute);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .product_list_widget li a.remove.sz-cart-item__remove::before {
	display: none;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .product_list_widget li a.remove.sz-cart-item__remove:hover {
	color: var(--sz-ink);
}
.sz-cart-item__price {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	text-align: right;
	white-space: nowrap;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-item__price .amount {
	font-size: 14.5px;
	font-weight: 700;
	color: var(--sz-ink);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-item__unit,
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-item__unit .amount {
	font-size: 12px;
	font-weight: 400;
	color: var(--sz-mute);
}
/* The unit price under the name of an item and of a product that fits (decision 54). */
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-item__unit-price,
.shoptimizer-mini-cart-wrap .sz-cart-suggest__unit {
	font-size: 12px;
	line-height: 16px;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-item__unit-price {
	margin-top: 2px;
}

/* ------------------------------------------------------------------
   Products that fit
   ------------------------------------------------------------------ */
.sz-cart-suggest {
	padding: 18px 0 20px;
}
.shoptimizer-mini-cart-wrap .sz-cart-suggest__title {
	margin: 0 0 10px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--sz-ink);
}
.sz-cart-suggest__list {
	display: grid;
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-suggest__item {
	display: grid;
	grid-template-columns: 52px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	margin: 0;
	padding: 0;
	border: 0;
}
.sz-cart-suggest__image img {
	display: block;
	width: 52px;
	height: 52px;
	margin: 0;
	object-fit: contain;
}
.sz-cart-suggest__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.shoptimizer-mini-cart-wrap .sz-cart-suggest__name {
	display: -webkit-box;
	overflow: hidden;
	font-size: 13px;
	line-height: 1.35;
	color: var(--sz-ink);
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.shoptimizer-mini-cart-wrap .sz-cart-suggest__name:hover {
	color: var(--sz-navy);
	text-decoration: underline;
}
.shoptimizer-mini-cart-wrap .sz-cart-suggest__price .amount {
	font-size: 13.5px;
	font-weight: 700;
	color: var(--sz-ink);
}
.sz-cart-suggest__badge {
	align-self: flex-start;
	padding: 1px 8px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--sz-ok);
	background: var(--sz-ok-bg-soft);
	border-radius: 99px;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button.sz-cart-suggest__add {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	margin: 0;
	padding: 0 14px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--sz-navy);
	white-space: nowrap;
	background: #fff;
	border: 1.5px solid var(--sz-navy);
	border-radius: var(--sz-radius);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button.sz-cart-suggest__add:hover {
	color: #fff;
	background: var(--sz-navy);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button.sz-cart-suggest__add.loading {
	opacity: 0.6;
}
.shoptimizer-mini-cart-wrap .sz-cart-suggest .added_to_cart {
	/* The drawer refreshes with the product in the list; WooCommerce's "view cart" link is not needed. */
	display: none;
}

/* ------------------------------------------------------------------
   Footer, fixed at the bottom
   ------------------------------------------------------------------ */
.sz-cart-foot {
	flex: none;
	padding: 14px 20px 16px;
	background: #fff;
	box-shadow: 0 -6px 16px rgba(20, 20, 20, 0.07);
}
/* Summary: one grey panel read as a receipt. The rows that add up (products, coupon tag with a remove
   button, delivery) are quiet; the sum to pay closes the panel under a line and is the only strong text. */
.sz-cart-sum {
	padding: 8px 14px 12px;
	background: var(--sz-bg2);
	border-radius: 8px;
}
.sz-cart-sum__rows {
	display: grid;
	gap: 2px;
	font-size: 13.5px;
	color: var(--sz-ink2);
}
.sz-cart-sum__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 28px;
}
.sz-cart-sum__row > span:first-child {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 8px;
	min-width: 0;
}
.sz-cart-sum__row > span:last-child {
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.sz-cart-sum__row .amount {
	font-weight: 400;
	color: inherit;
}
.sz-cart-sum__row.is-discount > span:last-child,
.sz-cart-sum__row.is-discount .amount,
.sz-cart-sum__row.is-free > span:last-child {
	font-weight: 600;
	color: var(--sz-ok-ink);
}
.sz-cart-sum__code {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
	min-height: 28px;
	padding: 0 2px 0 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--sz-ok-ink);
	overflow-wrap: anywhere;
	background: #fff;
	border: 1px solid #b9d8bc;
	border-radius: var(--sz-radius);
}
.shoptimizer-mini-cart-wrap .sz-cart-sum__code .sz-icon {
	width: 14px;
	height: 14px;
	stroke: var(--sz-ok);
	stroke-width: 2;
}
/* The cross is small, its touch area is 44 px. */
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.sz-cart-sum__remove {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: -8px -10px;
	border-radius: 50%;
}
.shoptimizer-mini-cart-wrap .sz-cart-sum__remove .sz-icon {
	stroke: var(--sz-ink2);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.sz-cart-sum__remove:hover .sz-icon {
	stroke: var(--sz-ink);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.sz-cart-sum__remove:focus-visible {
	outline: 2px solid var(--sz-navy);
	outline-offset: -8px;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.sz-cart-sum__remove.is-busy {
	opacity: 0.5;
	pointer-events: none;
}
.sz-cart-sum__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-top: 8px;
	padding-top: 10px;
	font-family: Poppins, sans-serif;
	border-top: 1px solid #d5dae5;
	font-size: 16px;
	font-weight: 600;
	color: var(--sz-ink);
}
.sz-cart-sum__total > span:last-child {
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.sz-cart-sum__total .amount {
	font-size: 24px;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: inherit;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button.sz-cart-foot__checkout {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	min-height: 52px;
	margin: 12px 0 0;
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	background: var(--sz-accent-strong);
	border: 0;
	border-radius: var(--sz-radius);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button.sz-cart-foot__checkout::after {
	content: "\2192";
	font-size: 18px;
	line-height: 1;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button.sz-cart-foot__checkout:hover {
	background: #b5301b;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button:focus-visible {
	outline: 2px solid var(--sz-navy);
	outline-offset: 2px;
}
/* The quiet way to the cart page under the button (code, keeping a product for later, the full list) */
.shoptimizer-mini-cart-wrap .sz-cart-foot .sz-cart-foot__view {
	margin: 10px 0 0;
	font-size: 13.5px;
	text-align: center;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-foot .sz-cart-foot__view a {
	display: inline-flex;
	align-items: center;
	min-height: 28px;
	margin: 0;
	padding: 0;
	font-weight: 500;
	color: var(--sz-navy);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-foot .sz-cart-foot__view a:hover {
	color: var(--sz-ink);
}
.shoptimizer-mini-cart-wrap .sz-cart-foot .sz-cart-foot__dispatch {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 10px 0 0;
	font-size: 13px;
	color: var(--sz-ink2);
}

/* ------------------------------------------------------------------
   Empty cart
   ------------------------------------------------------------------ */
.sz-cart-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 48px 24px;
	text-align: center;
}
.sz-cart-empty__icon {
	width: 56px;
	height: 56px;
	margin-bottom: 6px;
	fill: none;
	stroke: var(--sz-mute);
	stroke-width: 1.4;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.shoptimizer-mini-cart-wrap .sz-cart-empty__title {
	margin: 0;
	font-size: 17px;
	font-weight: 600;
	color: var(--sz-ink);
}
.sz-cart-empty__text {
	margin: 0;
	font-size: 14px;
	color: var(--sz-ink2);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button.sz-cart-empty__button {
	margin: 14px 0 0;
	padding: 12px 24px;
	font-size: 15px;
	font-weight: 600;
	color: #fff;
	background: var(--sz-navy);
	border: 0;
	border-radius: var(--sz-radius);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button.sz-cart-empty__button:hover {
	background: #1f2b50;
}
/* Ways out of the empty cart: the departments from the header menu. */
.shoptimizer-mini-cart-wrap .sz-cart-empty__links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0 24px;
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-empty__links li {
	margin: 0;
	padding: 0;
	border: 0;
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-empty__links a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 44px;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--sz-navy);
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-empty__links a::after {
	content: "\2192";
}
.shoptimizer-mini-cart-wrap .widget_shopping_cart .sz-cart-empty__links a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ------------------------------------------------------------------
   Phones: 72 px pictures, 44 px quantity buttons; below 400 px the price goes under the name, so a long
   price does not squeeze the name into a narrow column
   ------------------------------------------------------------------ */
@media (max-width: 400px) {
	.shoptimizer-mini-cart-wrap .widget_shopping_cart li.sz-cart-item {
		grid-template-columns: 72px minmax(0, 1fr);
		grid-template-areas:
			"image name"
			"image price"
			"image actions";
		row-gap: 6px;
	}
	.sz-cart-item__image {
		grid-area: image;
	}
	.sz-cart-item__body {
		display: contents;
	}
	.shoptimizer-mini-cart-wrap .widget_shopping_cart li.sz-cart-item .sz-cart-item__name {
		grid-area: name;
	}
	.sz-cart-item__body > dl.variation {
		grid-column: 2;
	}
	.sz-cart-item__price {
		grid-area: price;
		flex-direction: row;
		align-items: baseline;
		justify-content: flex-start;
		gap: 8px;
	}
	.sz-cart-item__actions {
		grid-area: actions;
	}
}

@media (max-width: 480px) {
	.shoptimizer-mini-cart-wrap .widget_shopping_cart li.sz-cart-item {
		grid-template-columns: 72px minmax(0, 1fr) auto;
		gap: 12px;
	}
	.shoptimizer-mini-cart-wrap .sz-cart-item__actions .shoptimizer-custom-quantity-mini-cart_button {
		width: 44px;
		height: 44px;
	}
	.shoptimizer-mini-cart-wrap .sz-cart-item__actions .shoptimizer-custom-quantity-mini-cart input {
		height: 44px;
	}
	.shoptimizer-mini-cart-wrap .widget_shopping_cart a.button.sz-cart-suggest__add {
		min-height: 44px;
	}
}
