/**
 * Mini-cart drawer overrides — must load after wc-blocks-style.
 */

/*
 * WooCommerce's own drawer CSS animates open via
 * `translateX(max(-100%, var(--neg-drawer-width)))` but never defines
 * --neg-drawer-width itself (core CSS assumes a theme will supply it,
 * mirroring --drawer-width below). Left undefined, that var() reference is
 * invalid at computed-value time, which resets the whole `transform` to its
 * initial value (`none`) instead of the intended slide position — the drawer
 * then has no reliable open transform to animate to or land on. Defining it
 * here (kept in lockstep with --drawer-width at each breakpoint) is what
 * actually fixes the drawer's geometry, independent of any timing issue.
 */
.wc-block-components-drawer {
	--drawer-width: var(--dhyan-width-drawer) !important;
	--neg-drawer-width: calc(-1 * var(--dhyan-width-drawer)) !important;
}

.wc-block-mini-cart__drawer .wc-block-components-drawer {
	width: var(--drawer-width) !important;
	max-width: 100vw !important;
}

.wc-block-mini-cart__drawer .wc-block-components-drawer__content,
.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents {
	box-sizing: border-box !important;
	max-width: 100vw !important;
	overflow-x: hidden !important;
}

.wc-block-mini-cart h2.wc-block-mini-cart__title {
	font-size: 1.125rem !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	margin: 0 !important;
	padding: 1rem 1.25rem !important;
	mask-image: none !important;
	background: var(--dhyan-color-background) !important;
	border-bottom: var(--dhyan-border-width) solid var(--dhyan-color-border) !important;
	z-index: var(--dhyan-z-base) !important;
}

.wc-block-mini-cart__items,
.wc-block-mini-cart__products-table {
	padding-left: 1rem !important;
	padding-right: 1rem !important;
}

.wc-block-mini-cart .wc-block-cart-items__header {
	display: none !important;
}

.wc-block-mini-cart .wc-block-cart-items__row {
	display: grid !important;
	grid-template-columns: 4.25rem minmax(0, 1fr) auto !important;
	grid-template-areas:
		'image product total'
		'image actions actions' !important;
	gap: 0.5rem 0.75rem !important;
	align-items: start !important;
	padding: 1rem 0 !important;
	border-bottom: var(--dhyan-border-width) solid var(--dhyan-color-border) !important;
}

.wc-block-mini-cart .wc-block-cart-items__row:last-child {
	border-bottom: 0 !important;
}

.wc-block-mini-cart .wc-block-cart-item__image {
	display: block !important;
	grid-area: image !important;
	width: auto !important;
	padding: 0 !important;
}

.wc-block-mini-cart .wc-block-cart-item__image img {
	width: 4.25rem !important;
	height: 4.25rem !important;
	border-radius: var(--dhyan-radius-sm) !important;
	border: var(--dhyan-border-width) solid var(--dhyan-color-border) !important;
	object-fit: cover !important;
}

.wc-block-mini-cart .wc-block-cart-item__product {
	display: block !important;
	grid-area: product !important;
	min-width: 0 !important;
	padding: 0 !important;
}

.wc-block-mini-cart .wc-block-cart-item__total {
	display: block !important;
	grid-area: total !important;
	width: auto !important;
	min-width: 0 !important;
	padding: 0 !important;
	text-align: right !important;
}

.wc-block-mini-cart .wc-block-cart-item__wrap {
	display: flex !important;
	flex-direction: column !important;
	gap: 0.375rem !important;
	min-width: 0 !important;
}

.wc-block-mini-cart .wc-block-components-product-name {
	display: block !important;
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	color: var(--dhyan-color-foreground) !important;
	text-decoration: none !important;
	word-break: break-word !important;
}

.wc-block-mini-cart .wc-block-components-product-name:hover {
	color: var(--dhyan-color-accent) !important;
}

.wc-block-mini-cart .wc-block-cart-item__product .wc-block-cart-item__prices,
.wc-block-mini-cart .wc-block-components-product-metadata,
.wc-block-mini-cart .wc-block-components-product-metadata__description,
.wc-block-mini-cart .wc-block-components-product-metadata__description * {
	display: none !important;
}

.wc-block-mini-cart .wc-block-cart-item__total .wc-block-components-product-price__value {
	font-size: 1rem !important;
	font-weight: 700 !important;
	color: var(--dhyan-color-foreground) !important;
}

.wc-block-mini-cart .wc-block-cart-item__quantity {
	display: flex !important;
	grid-area: actions !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 0.75rem !important;
	margin: 0 !important;
	padding-top: 0.25rem !important;
}

.wc-block-mini-cart .wc-block-components-quantity-selector,
.wc-block-mini-cart .wc-block-components-quantity-selector__input,
.wc-block-mini-cart .wc-block-components-quantity-selector__button {
	display: none !important;
}

.wc-block-mini-cart .wc-block-cart-item__remove-link {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 2.25rem !important;
	height: 2.25rem !important;
	margin-left: auto !important;
	padding: 0 !important;
	border: var(--dhyan-border-width) solid var(--dhyan-color-border) !important;
	border-radius: var(--dhyan-radius-sm) !important;
	background: var(--dhyan-color-background) !important;
	color: var(--dhyan-color-muted) !important;
}

.wc-block-mini-cart .wc-block-cart-item__remove-link:hover {
	border-color: rgb(var(--dhyan-color-danger-rgb) / 0.35) !important;
	background: rgb(var(--dhyan-color-danger-rgb) / 0.08) !important;
	color: var(--dhyan-color-danger) !important;
}

.wc-block-mini-cart .wc-block-cart-item__remove-link svg {
	width: 1.125rem !important;
	height: 1.125rem !important;
	fill: currentColor !important;
}

.wc-block-mini-cart__footer {
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 100% !important;
	padding: 1rem 1.25rem 1.25rem !important;
	border-top: var(--dhyan-border-width) solid var(--dhyan-color-border) !important;
	background: var(--dhyan-color-surface) !important;
}

.wc-block-mini-cart__footer .wc-block-mini-cart__footer-subtotal {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 1rem !important;
	margin-bottom: 0.5rem !important;
}

.wc-block-mini-cart__footer .wc-block-components-totals-item__label {
	font-size: 0.875rem !important;
	font-weight: 600 !important;
	color: var(--dhyan-color-foreground) !important;
}

.wc-block-mini-cart__footer .wc-block-components-totals-item__value {
	font-size: 1.125rem !important;
	font-weight: 700 !important;
	color: var(--dhyan-color-foreground) !important;
}

.wc-block-mini-cart__footer .wc-block-components-totals-item__description {
	display: block !important;
	margin: 0 0 1rem !important;
	font-size: 0.75rem !important;
	line-height: 1.5 !important;
	color: var(--dhyan-color-muted) !important;
}

.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions,
.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions > .block-editor-inner-blocks > .block-editor-block-list__layout {
	display: flex !important;
	flex-direction: column !important;
	gap: 0.625rem !important;
	width: 100% !important;
	max-width: 100% !important;
}

.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions > *,
.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions .wp-block-woocommerce-mini-cart-cart-button-block,
.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions .wp-block-woocommerce-mini-cart-checkout-button-block {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	flex: none !important;
}

.wc-block-mini-cart__footer .wc-block-components-button,
.wc-block-mini-cart__footer .wc-block-mini-cart__footer-cart,
.wc-block-mini-cart__footer .wc-block-mini-cart__footer-checkout {
	display: flex !important;
	width: 100% !important;
	max-width: 100% !important;
	min-height: 2.75rem !important;
	box-sizing: border-box !important;
}

.wc-block-mini-cart__footer .wc-block-mini-cart__footer-cart {
	border: var(--dhyan-border-width) solid var(--dhyan-color-border) !important;
	background: var(--dhyan-color-background) !important;
	color: var(--dhyan-color-foreground) !important;
}

.wc-block-mini-cart__footer .wc-block-mini-cart__footer-cart:hover {
	border-color: rgb(var(--dhyan-color-accent-rgb) / 0.4) !important;
	background: var(--dhyan-color-primary-soft) !important;
	color: var(--dhyan-color-accent) !important;
}

.wc-block-mini-cart__footer .wc-block-mini-cart__footer-checkout {
	border: 0 !important;
	background: var(--dhyan-color-accent) !important;
	color: var(--dhyan-color-background) !important;
}

.wc-block-mini-cart__footer .wc-block-mini-cart__footer-checkout:hover {
	background: var(--dhyan-color-primary-dark) !important;
	color: var(--dhyan-color-background) !important;
}

.wc-block-mini-cart__footer .wc-block-components-button__text {
	white-space: normal !important;
}

@media (min-width: 481px) {
	.wc-block-components-drawer {
		--drawer-width: var(--dhyan-width-drawer-fixed) !important;
		--neg-drawer-width: calc(-1 * var(--dhyan-width-drawer-fixed)) !important;
	}

	.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions,
	.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions > .block-editor-inner-blocks > .block-editor-block-list__layout {
		flex-direction: row !important;
	}

	.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions > *,
	.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions .wp-block-woocommerce-mini-cart-cart-button-block,
	.wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions .wp-block-woocommerce-mini-cart-checkout-button-block {
		flex: 1 1 0 !important;
		width: auto !important;
		min-width: 0 !important;
	}
}

@media (max-width: 480px) {
	.wc-block-components-drawer {
		--drawer-width: 100vw !important;
		--neg-drawer-width: -100vw !important;
	}
}