/**
 * DeShop — mini-cart.css
 *
 * Mini cart drawer, quick view modal and quantity steppers. Loaded on
 * every page while WooCommerce is active (the header cart is global).
 *
 * @package DeShop
 */

/* Mini cart --------------------------------------------------------------------- */

.mini-cart {
	width: min(440px, 100vw);
}

.mini-cart .ds-drawer__head {
	flex-shrink: 0;
}

.mini-cart__content {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-height: 0;
}

.mini-cart__items {
	flex: 1;
	margin: 0;
	padding: var(--ds-space-md) var(--ds-space-lg);
	overflow-y: auto;
	overscroll-behavior: contain;
	list-style: none;
}

.mini-cart__item {
	display: grid;
	grid-template-columns: 76px minmax(0, 1fr);
	gap: var(--ds-space-md);
	padding-block: var(--ds-space-md);
	border-bottom: 1px solid var(--ds-border);
	transition: opacity var(--ds-dur-fast) var(--ds-ease);
}

.mini-cart__item:first-child {
	padding-top: 0;
}

.mini-cart__item.is-updating {
	opacity: 0.5;
	pointer-events: none;
}

.mini-cart__thumb {
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border-radius: var(--ds-radius-sm);
	background: var(--ds-muted);
}

.mini-cart__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mini-cart__info {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	font-size: var(--ds-fs-sm);
}

.mini-cart__name {
	font-weight: 500;
	line-height: 1.35;
}

.mini-cart__name a {
	color: var(--ds-text);
	text-decoration: none;
}

.mini-cart__info .variation {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0 6px;
	margin: 0;
	color: var(--ds-text-muted);
	font-size: var(--ds-fs-xs);
}

.mini-cart__info .variation dd,
.mini-cart__info .variation p {
	margin: 0;
}

.mini-cart__price {
	color: var(--ds-text-muted);
	font-variant-numeric: tabular-nums;
}

.mini-cart__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ds-space-sm);
	margin-top: var(--ds-space-xs);
}

.mini-cart__remove {
	--_fg: var(--ds-text-muted);
	font-size: var(--ds-fs-xs);
	font-weight: 500;
}

.mini-cart__remove:hover {
	--_fg: var(--ds-sale);
}

.mini-cart__progress {
	padding: var(--ds-space-md) var(--ds-space-lg);
	background: var(--ds-muted);
	font-size: var(--ds-fs-sm);
}

.mini-cart__bar {
	height: 6px;
	margin-top: var(--ds-space-xs);
	overflow: hidden;
	border-radius: var(--ds-radius-full);
	background: var(--ds-surface);
}

.mini-cart__bar span {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--ds-primary);
	transition: width var(--ds-dur-slow) var(--ds-ease);
}

.mini-cart__foot {
	display: flex;
	flex-direction: column;
	gap: var(--ds-space-sm);
	padding: var(--ds-space-md) var(--ds-space-lg) calc(var(--ds-space-md) + var(--ds-safe-bottom));
	border-top: 1px solid var(--ds-border);
	background: var(--ds-surface);
}

.mini-cart__subtotal {
	display: flex;
	justify-content: space-between;
	font-size: var(--ds-fs-md);
}

.mini-cart__note {
	color: var(--ds-text-muted);
	font-size: var(--ds-fs-xs);
}

.mini-cart__buttons {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--ds-space-sm);
}

.mini-cart__empty {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--ds-space-md);
	padding: var(--ds-space-2xl) var(--ds-space-lg);
	color: var(--ds-text-muted);
	text-align: center;
}

.mini-cart__empty-icon {
	display: grid;
	place-items: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: var(--ds-primary-soft);
	color: var(--ds-primary);
}

/* Quantity steppers ---------------------------------------------------------------- */

.ds-qty--sm {
	height: 36px;
}

.ds-qty--sm .ds-qty__btn {
	width: 32px;
	font-size: 1rem;
}

.ds-qty--sm input {
	width: 2.25rem;
	font-size: var(--ds-fs-sm);
}

/* WooCommerce quantity box enhanced by cart.js. */
.quantity.ds-qty {
	display: inline-flex;
	align-items: stretch;
	height: 48px;
}

.quantity.ds-qty .qty {
	width: 3rem;
	min-height: 0;
	height: 100%;
	padding: 0;
	border: 0;
	border-radius: 0;
	text-align: center;
	-moz-appearance: textfield;
}

.quantity.ds-qty .qty:focus {
	box-shadow: none;
}

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

/* Quick view -------------------------------------------------------------------------- */

.quick-view .ds-modal__dialog {
	width: min(920px, 100%);
}

.quick-view__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 768px) {
	.quick-view__grid {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}
}

.quick-view__media {
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--ds-muted);
}

@media (max-width: 767.98px) {
	.quick-view__media {
		height: 45vh;
		aspect-ratio: auto;
	}
}

.quick-view__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.quick-view__summary {
	display: flex;
	flex-direction: column;
	gap: var(--ds-space-sm);
	padding: var(--ds-space-xl);
}

.quick-view__title {
	font-size: var(--ds-fs-2xl);
	outline: 0;
}

.quick-view__price {
	margin: 0;
	font-size: var(--ds-fs-lg);
	font-weight: 600;
}

.quick-view__excerpt {
	color: var(--ds-text-muted);
	font-size: var(--ds-fs-sm);
}

.quick-view form.cart {
	display: flex;
	gap: var(--ds-space-sm);
	margin-top: var(--ds-space-xs);
}

.quick-view form.cart .single_add_to_cart_button {
	flex: 1;
}

.quick-view__more {
	align-self: flex-start;
	margin-top: var(--ds-space-xs);
	font-size: var(--ds-fs-sm);
}

.quick-view__loading {
	display: grid;
	gap: var(--ds-space-md);
	padding: var(--ds-space-xl);
}

.quick-view__loading .ds-skeleton:first-child {
	height: 280px;
}

.quick-view__loading .ds-skeleton:last-child {
	width: 60%;
	height: 24px;
}

/* Card quick view button: visible on hover (desktop). Hidden on phones. */
.ds-product-card__qv {
	width: 40px;
	height: 40px;
}

@media (hover: hover) and (min-width: 768px) {
	.ds-product-card__qv {
		opacity: 0;
		transform: translateY(-4px);
		transition:
			opacity var(--ds-dur) var(--ds-ease),
			transform var(--ds-dur) var(--ds-ease);
	}

	.ds-product-card:hover .ds-product-card__qv,
	.ds-product-card__qv:focus-visible {
		opacity: 1;
		transform: none;
	}
}

@media (max-width: 767.98px) {
	.ds-product-card__qv {
		display: none;
	}
}