/* ==========================================================================
   Vapeera Custom — WooCommerce presentation layer
   Loaded on shop, product, cart, checkout, account pages and the homepage.
   Builds on WooCommerce's default stylesheets (kept enabled for checkout safety).
   ========================================================================== */

/* 1. Product grid & cards (woocommerce/content-product.php)
   ========================================================================== */
.woocommerce ul.products,
.woocommerce-page ul.products {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--vc-space-3);
	margin: 0 0 var(--vc-space-6);
	padding: 0;
	list-style: none;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
	display: none;
}

@media (min-width: 640px) {
	.woocommerce ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--vc-space-4);
	}
}

@media (min-width: 1024px) {
	.woocommerce ul.products.columns-4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.woocommerce ul.products.columns-5 {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
}

/* Reset WooCommerce's float-based li.product layout. */
.woocommerce ul.products li.product {
	position: relative;
	display: flex;
	width: auto !important;
	margin: 0 !important;
	padding: 0;
	float: none !important;
}

/* Card: white panel with an inset image tile; lifts on hover. */
.vc-pcard {
	--vc-pcard-pad: var(--vc-space-3);
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	border: 1px solid var(--vc-line);
	border-radius: 18px;
	background: var(--vc-surface);
	box-shadow: 0 1px 2px rgb(2 28 36 / 4%);
	transition: transform 0.25s var(--vc-ease), border-color 0.25s, box-shadow 0.25s;
}

@media (hover: hover) {
	.vc-pcard:hover {
		border-color: var(--vc-primary-soft);
		box-shadow: 0 2px 6px rgb(2 28 36 / 6%), 0 18px 40px -12px rgb(22 100 111 / 30%);
		transform: translateY(-4px);
	}
}

.vc-pcard:focus-within {
	border-color: var(--vc-primary-soft);
	box-shadow: 0 0 0 3px rgb(58 162 177 / 22%);
}

@media (prefers-reduced-motion: reduce) {
	.vc-pcard,
	.vc-pcard__img {
		transition: none;
	}

	.vc-pcard:hover {
		transform: none;
	}
}

/* Media: framed tile inset from the card edge. */
.vc-pcard__media {
	position: relative;
	aspect-ratio: 1;
	margin: 6px 6px 0;
	overflow: hidden;
	border-radius: 13px;
	background:
		radial-gradient(90% 70% at 50% 45%, #fff 0%, #fff 55%, transparent 100%),
		linear-gradient(160deg, #f5fafb 0%, var(--vc-primary-tint) 100%);
}

.vc-pcard__image-link {
	position: absolute;
	inset: 0;
	display: block;
}

.woocommerce ul.products li.product .vc-pcard__img,
.vc-pcard__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 8%;
	object-fit: contain;
	mix-blend-mode: multiply;
	transition: opacity 0.3s var(--vc-ease), transform 0.5s var(--vc-ease);
}

.vc-pcard__img--alt {
	opacity: 0;
}

/* Touch screens never show the hover image; display:none also stops the lazy image downloading. */
@media (hover: none) {
	.vc-pcard__img--alt {
		display: none;
	}
}

@media (hover: hover) {
	.vc-pcard:hover .vc-pcard__img--alt {
		opacity: 1;
	}

	.vc-pcard:hover .vc-pcard__img:not(.vc-pcard__img--alt):has(+ .vc-pcard__img--alt) {
		opacity: 0;
	}

	.vc-pcard:hover .vc-pcard__img {
		transform: scale(1.06);
	}
}

.vc-pcard__badges {
	position: absolute;
	top: var(--vc-space-2);
	left: var(--vc-space-2);
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	pointer-events: none;
}

.vc-badge {
	display: inline-block;
	padding: 0.2rem 0.55rem;
	border-radius: var(--vc-radius-pill);
	background: var(--vc-ink);
	color: #fff;
	font-size: 0.72rem;
	font-weight: 750;
	line-height: 1.35;
}

.vc-badge--sale {
	background: var(--vc-accent);
}

.vc-badge--featured {
	background: var(--vc-primary-ink);
}

.vc-badge--out {
	background: var(--vc-muted);
}

.vc-pcard .vc-badge {
	padding: 0.25rem 0.6rem;
	font-family: var(--vc-font-heading);
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.01em;
	box-shadow: 0 4px 10px -4px rgb(2 28 36 / 45%);
}

.vc-pcard .vc-badge--sale {
	background: linear-gradient(135deg, #e04450 0%, var(--vc-accent) 100%);
}

.vc-pcard .vc-badge--featured {
	background: linear-gradient(135deg, var(--vc-primary-deep) 0%, var(--vc-primary-ink) 100%);
}

/* Multi-buy offer badges (Vapeera Core, rendered server-side after the price). */
.vc-offer-badges {
	margin: var(--vc-space-2) 0 0;
}

.vc-offer-badges__title {
	display: flex;
	align-items: center;
	gap: 4px;
	margin: 0 0 4px;
	color: var(--vc-primary-ink);
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.vc-offer-badges__list {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* WooCommerce's list clearfix pseudos would be flex items (an extra gap before the first chip). */
.vc-offer-badges__list::before,
.vc-offer-badges__list::after {
	display: none !important;
}

.vc-offer-badges__item {
	padding: 0.15rem 0.5rem;
	border: 1px solid var(--vc-primary);
	border-radius: var(--vc-radius-pill);
	background: var(--vc-surface);
	color: var(--vc-primary-ink);
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.4;
	white-space: nowrap;
}

.vc-offer-badges__item.is-best-value {
	border-color: var(--vc-primary-deep);
	background: var(--vc-primary-deep);
	color: #fff;
}

.vc-offer-badges--single {
	margin: var(--vc-space-3) 0;
}

.vc-offer-badges--single .vc-offer-badges__item {
	padding: 0.25rem 0.7rem;
	font-size: var(--vc-text-sm);
}

/* In the card: a tinted panel so the offer reads as one block. */
.vc-pcard .vc-offer-badges {
	margin: 2px 0 0;
	padding: 7px 8px 8px;
	border: 1px dashed rgb(58 162 177 / 55%);
	border-radius: 11px;
	background: linear-gradient(135deg, #eef8fa 0%, var(--vc-primary-tint) 100%);
}

.woocommerce ul.products li.product .vc-pcard .vc-offer-badges__list {
	margin: 0;
}

.vc-pcard .vc-offer-badges__title {
	margin-bottom: 5px;
	font-size: 0.72rem;
	letter-spacing: 0.08em;
}

.vc-pcard .vc-offer-badges__item {
	padding: 0.1rem 0.45rem;
	border-color: rgb(58 162 177 / 60%);
	font-size: 0.72rem;
}

.vc-pcard .vc-offer-badges__item.is-best-value {
	border-color: transparent;
	background: linear-gradient(135deg, var(--vc-primary-deep) 0%, var(--vc-primary-ink) 100%);
}

/* Multi-buy lines in the basket / checkout / mini cart (WooCommerce item data). */
.variation .variation-OfferApplied,
.variation .variation-Yousave {
	color: var(--vc-success);
	font-weight: 700;
}

/* Wishlist (YITH) — icon-only button in the corner. */
.vc-pcard__wishlist {
	position: absolute;
	top: var(--vc-space-2);
	right: var(--vc-space-2);
	z-index: 3;
}

.vc-pcard__wishlist .yith-wcwl-add-to-wishlist {
	margin: 0;
}

.vc-pcard__wishlist a {
	display: inline-flex;
	width: 36px;
	height: 36px;
	align-items: center;
	justify-content: center;
	border: 1px solid rgb(2 28 36 / 6%);
	border-radius: 50%;
	background: rgb(255 255 255 / 94%);
	box-shadow: 0 4px 12px -4px rgb(2 28 36 / 25%);
	color: var(--vc-ink);
	font-size: 0;
	text-decoration: none;
	transition: background-color 0.2s, color 0.2s, transform 0.2s var(--vc-ease);
}

.vc-pcard__wishlist a:hover,
.vc-pcard__wishlist a:focus-visible {
	background: var(--vc-accent);
	color: #fff;
	transform: scale(1.06);
}

.vc-pcard__wishlist a svg,
.vc-pcard__wishlist a i,
.vc-pcard__wishlist a img {
	width: 18px;
	height: 18px;
	margin: 0 !important;
	font-size: 18px;
}

.vc-pcard__wishlist a span,
.vc-pcard__wishlist .feedback,
.vc-pcard__wishlist .separator,
.vc-pcard__wishlist .view-wishlist {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

/* Body */
.vc-pcard__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 6px;
	padding: var(--vc-space-3) var(--vc-pcard-pad) var(--vc-pcard-pad);
}

/* Brand + stock on one line. */
.vc-pcard__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--vc-space-2);
	min-height: 20px;
}

.vc-pcard__brand {
	min-width: 0;
	margin: 0;
	overflow: hidden;
	color: var(--vc-primary-deep);
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.09em;
	text-overflow: ellipsis;
	text-transform: uppercase;
	white-space: nowrap;
}

.vc-pcard__meta .vc-stock {
	flex: none;
	margin-left: auto;
	padding: 2px 7px 2px 6px;
	border-radius: var(--vc-radius-pill);
	background: rgb(21 128 61 / 9%);
	font-size: 0.72rem;
	font-weight: 700;
	white-space: nowrap;
}

.vc-pcard__meta .vc-stock::before {
	width: 6px;
	height: 6px;
	box-shadow: 0 0 0 2px rgb(21 128 61 / 18%);
}

.vc-pcard__meta .vc-stock--low,
.vc-pcard__meta .vc-stock--backorder {
	background: rgb(180 83 9 / 10%);
}

.vc-pcard__meta .vc-stock--out {
	background: var(--vc-surface-alt);
}

.woocommerce ul.products li.product .vc-pcard__title,
.vc-pcard__title {
	min-height: calc(2 * 1.35em);
	margin: 0;
	padding: 0;
	font-family: var(--vc-font-heading);
	font-size: 0.95rem;
	font-weight: 650;
	letter-spacing: -0.005em;
	line-height: 1.35;
}

.vc-pcard__title a {
	display: -webkit-box;
	overflow: hidden;
	color: var(--vc-ink);
	text-decoration: none;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	transition: color 0.2s;
}

.vc-pcard:hover .vc-pcard__title a {
	color: var(--vc-primary-deep);
}

/* Whole card clickable via the title link. */
.vc-pcard__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

/* Option count ("42 flavours") on the image: the variable-product cue. */
.vc-pcard__options {
	position: absolute;
	left: var(--vc-space-2);
	bottom: var(--vc-space-2);
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	max-width: calc(100% - var(--vc-space-4));
	margin: 0;
	padding: 0.2rem 0.6rem 0.2rem 0.5rem;
	overflow: hidden;
	border: 1px solid rgb(2 28 36 / 6%);
	border-radius: var(--vc-radius-pill);
	background: rgb(255 255 255 / 92%);
	box-shadow: 0 4px 12px -6px rgb(2 28 36 / 30%);
	color: var(--vc-ink-soft);
	font-size: 0.7rem;
	font-weight: 650;
	line-height: 1.4;
	pointer-events: none;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

.vc-pcard__options-icon {
	flex: none;
	color: var(--vc-primary-deep);
}

.vc-pcard__options span {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.vc-pcard__rating {
	display: flex;
	align-items: center;
	gap: 4px;
}

.vc-pcard__rating .star-rating {
	float: none;
	margin: 0;
	font-size: 0.8rem;
}

.vc-pcard__reviews {
	color: var(--vc-muted);
	font-size: 0.75rem;
}

/* Price + saving amount */
/* Saving chip always on its own line: when it fitted beside short prices only, cards in one row got uneven blank space above the button. */
.vc-pcard__pricing {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
}

.woocommerce ul.products li.product .vc-pcard__price,
.vc-pcard__price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0 6px;
	margin: 0;
	color: var(--vc-ink);
	font-family: var(--vc-font-heading);
	font-size: 1.2rem;
	font-weight: 800;
	letter-spacing: -0.01em;
	line-height: 1.2;
}

.vc-pcard__price del {
	order: 2;
	color: var(--vc-muted);
	font-family: var(--vc-font);
	font-size: 0.72em;
	font-weight: 500;
	letter-spacing: 0;
	opacity: 1;
}

.vc-pcard__price ins {
	order: 1;
	color: var(--vc-accent);
	text-decoration: none;
}

/* Saving amount ("Save £3.00 (25%)"), shared by cards and the product page. */
.vc-saving {
	color: var(--vc-danger);
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.3;
}

.vc-pcard .vc-saving {
	padding: 2px 8px;
	border-radius: var(--vc-radius-pill);
	background: rgb(198 47 58 / 9%);
	color: var(--vc-accent);
	font-size: 0.7rem;
	font-weight: 750;
	white-space: nowrap;
}

/* Stock pill, shared by cards and the product page. */
.vc-stock {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	font-size: 0.78rem;
	font-weight: 600;
}

span.vc-stock {
	display: inline-flex;
}

.vc-stock::before {
	content: "";
	flex-shrink: 0;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
}

.vc-stock--in { color: var(--vc-success); }
.vc-stock--low { color: #b45309; }
.vc-stock--backorder { color: #b45309; }
.vc-stock--out { color: var(--vc-muted); }

/* Actions sit above the full-card link overlay. */
.vc-pcard__actions {
	position: relative;
	z-index: 2;
	margin-top: auto;
	padding-top: var(--vc-space-2);
}

.woocommerce ul.products li.product .vc-pcard__actions .button,
.vc-pcard__actions .button {
	display: flex;
	gap: 8px;
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 0.5rem 0.75rem;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 12px;
	background: var(--vc-ink);
	color: #fff;
	font-family: var(--vc-font-heading);
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	transition: background 0.2s, box-shadow 0.2s, transform 0.15s;
}

/* Basket icon before the label. */
.woocommerce ul.products li.product .vc-pcard__actions .button::before,
.vc-pcard__actions .button::before {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 7h12l1 13H5L6 7Z'/%3E%3Cpath d='M9 10V6a3 3 0 0 1 6 0v4'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 7h12l1 13H5L6 7Z'/%3E%3Cpath d='M9 10V6a3 3 0 0 1 6 0v4'/%3E%3C/svg%3E") center / contain no-repeat;
}

.woocommerce ul.products li.product .vc-pcard__actions .button:hover,
.woocommerce ul.products li.product .vc-pcard__actions .button:focus-visible,
.vc-pcard:hover .vc-pcard__actions .button {
	background: linear-gradient(135deg, var(--vc-primary-deep) 0%, var(--vc-primary-ink) 100%);
	box-shadow: 0 8px 18px -8px rgb(22 100 111 / 70%);
	color: #fff;
}

.woocommerce ul.products li.product .vc-pcard__actions .button:active {
	transform: scale(0.98);
}

.woocommerce ul.products li.product .vc-pcard__actions .button.loading {
	opacity: 0.7;
}

.woocommerce ul.products li.product .vc-pcard__actions .button.loading::after {
	position: static;
	margin-left: 4px;
}

.woocommerce ul.products li.product .vc-pcard__actions .button.added::after {
	margin-left: 2px;
}

.vc-pcard__actions .added_to_cart {
	display: block;
	margin-top: 6px;
	color: var(--vc-primary-deep);
	font-size: 0.8rem;
	font-weight: 700;
	text-align: center;
}

.vc-pcard--stock-out .vc-pcard__img {
	opacity: 0.55;
	filter: grayscale(0.4);
}

.woocommerce ul.products li.product .vc-pcard--stock-out .vc-pcard__actions .button,
.vc-pcard--stock-out .vc-pcard__actions .button {
	background: var(--vc-surface-alt);
	box-shadow: inset 0 0 0 1px var(--vc-line);
	color: var(--vc-ink-soft);
}

@media (max-width: 479px) {
	.vc-pcard {
		--vc-pcard-pad: var(--vc-space-2);
		border-radius: 14px;
	}

	.vc-pcard__media {
		margin: 4px 4px 0;
		border-radius: 11px;
	}

	.vc-pcard__body {
		gap: 5px;
		padding-top: var(--vc-space-2);
	}

	.woocommerce ul.products li.product .vc-pcard__title,
	.vc-pcard__title {
		font-size: 0.84rem;
	}

	.woocommerce ul.products li.product .vc-pcard__price,
	.vc-pcard__price {
		font-size: 1.05rem;
	}

	.vc-pcard__options {
		font-size: 0.7rem;
	}

	/* Two cards a row: the stock pill would crowd the brand, so it wraps under it as dot + word. */
	.vc-pcard__meta {
		flex-wrap: wrap;
		gap: 2px 6px;
	}

	.vc-pcard__meta .vc-stock {
		margin-left: 0;
		padding: 0;
		background: none;
	}

	.vc-pcard .vc-offer-badges {
		padding: 6px;
	}

	.woocommerce ul.products li.product .vc-pcard__actions .button,
	.vc-pcard__actions .button {
		min-height: 42px;
		padding-inline: 0.5rem;
		font-size: 0.8rem;
	}
}

.woocommerce span.onsale {
	position: absolute;
	top: var(--vc-space-3);
	left: var(--vc-space-3);
	z-index: 2;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0.2rem 0.6rem;
	border-radius: var(--vc-radius-pill);
	background: var(--vc-accent);
	color: #fff;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1.4;
}

.woocommerce .star-rating {
	color: #f59e0b;
}

/* Horizontal product rail (homepage). [class*="columns-"] outranks WooCommerce's
   ".woocommerce ul.products.columns-N" grid templates, which would squash the first cards. */
.vc-rail__track ul.products,
.vc-rail__track ul.products[class*="columns-"] {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(200px, 46%);
	grid-template-columns: none;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
	padding-bottom: var(--vc-space-2);
	margin-bottom: 0;
}

.vc-rail__track ul.products li.product {
	scroll-snap-align: start;
}

@media (min-width: 768px) {
	.vc-rail__track ul.products,
	.vc-rail__track ul.products[class*="columns-"] {
		grid-auto-columns: calc((100% - 3 * var(--vc-space-5)) / 4);
		grid-template-columns: none;
	}
}

.vc-rail__controls {
	display: flex;
	align-items: center;
	gap: var(--vc-space-2);
}

.vc-rail__btn {
	display: inline-flex;
	width: 40px;
	height: 40px;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--vc-line);
	border-radius: 50%;
	background: var(--vc-surface);
}

.vc-rail__btn--prev .vc-icon {
	transform: rotate(180deg);
}

.vc-rail__btn:disabled {
	opacity: 0.4;
	cursor: default;
}

/* 2. Archive layout lives in shop.css (product archives only).
   ========================================================================== */

/* 3. Single product styles live in product.css (product pages only).
   ========================================================================== */

/* 4. Notices
   ========================================================================== */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	border-top: 0;
	border-left: 4px solid var(--vc-primary);
	border-radius: var(--vc-radius-sm);
	background: var(--vc-surface-alt);
	color: var(--vc-ink);
}

.woocommerce-error {
	border-left-color: var(--vc-danger);
}

.woocommerce-message::before,
.woocommerce-info::before {
	color: var(--vc-primary-deep);
}

/* WooCommerce paints ".woocommerce a.button" grey, which outranks the theme's .button. These are the
   buttons with no rule of their own ("View basket" in notices, "Order again", "Add payment method",
   "Confirm email address"): colours and shape only, so layout rules elsewhere still apply. */
.woocommerce .woocommerce-message a.button,
.woocommerce .woocommerce-info a.button,
.woocommerce .woocommerce-error a.button,
.woocommerce .order-again a.button,
.woocommerce-account .woocommerce-MyAccount-content > a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--vc-radius-pill);
	background: var(--vc-primary-deep);
	color: #fff;
	font-weight: 650;
}

.woocommerce .woocommerce-message a.button:hover,
.woocommerce .woocommerce-message a.button:focus-visible,
.woocommerce .woocommerce-info a.button:hover,
.woocommerce .woocommerce-info a.button:focus-visible,
.woocommerce .woocommerce-error a.button:hover,
.woocommerce .woocommerce-error a.button:focus-visible,
.woocommerce .order-again a.button:hover,
.woocommerce .order-again a.button:focus-visible,
.woocommerce-account .woocommerce-MyAccount-content > a.button:hover,
.woocommerce-account .woocommerce-MyAccount-content > a.button:focus-visible {
	background: var(--vc-primary-ink);
	color: #fff;
}

/* 5. Cart, account (light touch — WooCommerce markup untouched)
   ========================================================================== */
.woocommerce table.shop_table {
	border-radius: var(--vc-radius);
	border-color: var(--vc-line);
}

.woocommerce-cart .cart-collaterals .cart_totals {
	float: none;
	width: 100%;
}

/* Checkout styles live in checkout.css (checkout, order-pay and order-received pages). */

/* My Account styles live in account.css (account pages only). */

/* 6. Quantity steppers (assets/js/quantity.js) — product page and basket
   ========================================================================== */
.woocommerce .quantity.vc-qty {
	align-items: stretch;
	overflow: hidden;
	border: 1px solid var(--vc-line);
	border-radius: var(--vc-radius-pill);
	background: var(--vc-surface);
}

.woocommerce .quantity.vc-qty .qty {
	width: 3.2rem;
	min-height: 52px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	font-weight: 700;
	text-align: center;
	-moz-appearance: textfield;
}

.woocommerce .quantity.vc-qty .qty::-webkit-inner-spin-button,
.woocommerce .quantity.vc-qty .qty::-webkit-outer-spin-button {
	margin: 0;
	-webkit-appearance: none;
}

.vc-qty__btn {
	width: 44px;
	border: 0;
	background: transparent;
	color: var(--vc-ink);
	font-size: 1.25rem;
	line-height: 1;
}

.vc-qty__btn:hover {
	background: var(--vc-surface-alt);
}

/* 7. Order details + customer addresses (order received and My Account › View order)
   ========================================================================== */
.woocommerce-order-details,
.woocommerce-customer-details {
	margin-bottom: var(--vc-space-5);
	padding: var(--vc-space-5);
	border: 1px solid var(--vc-line);
	border-radius: var(--vc-radius);
	background: var(--vc-surface);
}

.woocommerce-order-details__title,
.woocommerce-column__title {
	margin: 0 0 var(--vc-space-3);
	font-size: var(--vc-h3);
}

.woocommerce .woocommerce-order-details table.shop_table {
	margin: 0;
	border: 0;
}

.woocommerce .woocommerce-order-details table.shop_table th,
.woocommerce .woocommerce-order-details table.shop_table td {
	padding: var(--vc-space-3) 0;
	border-top: 0;
	border-bottom: 1px solid var(--vc-line);
}

.woocommerce .woocommerce-order-details table.shop_table td.product-total,
.woocommerce .woocommerce-order-details table.shop_table tfoot td {
	text-align: right;
}

.woocommerce .woocommerce-order-details table.shop_table tfoot th {
	color: var(--vc-ink-soft);
	font-weight: 600;
}

.woocommerce .woocommerce-order-details table.shop_table tfoot tr:last-child th,
.woocommerce .woocommerce-order-details table.shop_table tfoot tr:last-child td {
	border-bottom: 0;
}