/*
 * Ecom Theme — cart drawer, cart & checkout blocks, My Account.
 */

/* ---------- Drawer from the right ---------- */

.drawer--right .drawer__panel {
	left: auto;
	right: 0;
	width: min(420px, 100vw);
	animation-name: slide-in-right;
}

@keyframes slide-in-right { from { transform: translateX(100%); } }

.drawer__head h2.drawer__title { margin: 0; font-size: 20px; }
.cart-drawer__count { font-family: var(--font-body); font-size: 15px; font-weight: 400; color: var(--color-muted); }

.cart-drawer .drawer__panel { position: absolute; }

.cart-drawer.is-busy .cart-drawer__content { opacity: .55; pointer-events: none; transition: opacity .15s; }

.cart-drawer__notice {
	margin: 0;
	padding: 10px 20px;
	background: color-mix(in srgb, var(--color-sale) 10%, var(--color-bg));
	color: var(--color-sale);
	font-size: 14px;
}

.cart-drawer__content {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-height: 0;
}

.cart-drawer__scroll {
	flex: 1;
	overflow-y: auto;
	padding: 0 20px 20px;
	overscroll-behavior: contain;
}

.cart-drawer__empty {
	display: grid;
	justify-items: center;
	gap: 12px;
	padding: 48px 20px 24px;
	text-align: center;
	color: var(--color-muted);
}

.cart-drawer__empty .icon { color: var(--color-border); }
.cart-drawer__empty p { margin: 0; font-size: 16px; }
.cart-drawer__content > .cart-upsells { padding: 0 20px 20px; }

/* Free delivery bar */
.ship-bar {
	margin: 16px 0 4px;
	padding: 12px 14px;
	border-radius: var(--radius);
	background: var(--color-surface);
}

.ship-bar__msg {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 8px;
	font-size: 14px;
}

.ship-bar__msg .icon { color: var(--color-brand); }

.ship-bar__track {
	height: 6px;
	border-radius: 999px;
	background: var(--color-border);
	overflow: hidden;
}

.ship-bar__track span {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--color-brand);
	transition: width .5s var(--ease);
}

.ship-bar.is-done { background: color-mix(in srgb, #127a3c 9%, var(--color-bg)); }
.ship-bar.is-done .ship-bar__msg,
.ship-bar.is-done .ship-bar__msg .icon { color: #127a3c; font-weight: 500; }
.ship-bar.is-done .ship-bar__track span { background: #127a3c; }

.ship-bar--page { margin: 0 0 24px; }

/* Items */
.cart-items {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cart-item {
	position: relative;
	display: grid;
	grid-template-columns: 76px 1fr auto;
	gap: 14px;
	padding: 16px 0;
	border-bottom: 1px solid var(--color-border);
	transition: opacity .2s;
}

.cart-item.is-removing { opacity: .35; }

.cart-item__img img {
	display: block;
	width: 76px;
	height: 92px;
	object-fit: cover;
	border-radius: calc(var(--radius) * .7);
	background: var(--color-surface);
}

.cart-item__info { display: grid; align-content: start; gap: 4px; min-width: 0; }

.cart-item__name {
	margin: 0;
	padding-right: 4px;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.35;
}

.cart-item__name a { text-decoration: none; }

.cart-item__meta { font-size: 13px; color: var(--color-muted); }
.cart-item__meta dl.variation { display: flex; flex-wrap: wrap; gap: 0 6px; margin: 0; }
.cart-item__meta dl.variation dt,
.cart-item__meta dl.variation dd { margin: 0; padding: 0; float: none; font-weight: 400; }
.cart-item__meta dl.variation dd p { margin: 0; }

.cart-item__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: 6px;
}

.cart-item__price { font-weight: 600; font-size: 15px; }

.cart-qty {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-btn);
}

.cart-qty__btn {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
}

.cart-qty__btn:hover { background: var(--color-surface); }
.cart-qty__btn:disabled { opacity: .35; cursor: not-allowed; }
.cart-qty__value { min-width: 28px; font-size: 14px; font-weight: 600; text-align: center; }

.cart-item__remove {
	display: grid;
	place-items: center;
	align-self: start;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: none;
	color: var(--color-muted);
	cursor: pointer;
}

.cart-item__remove:hover { background: var(--color-surface); color: var(--color-text); }

/* Upsells */
.cart-upsells { margin-top: 20px; }

.cart-upsells__title {
	margin: 0 0 12px;
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.cart-upsells__list {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 132px;
	gap: 12px;
	margin: 0;
	padding: 0 0 6px;
	list-style: none;
	overflow-x: auto;
	scroll-snap-type: x proximity;
	scrollbar-width: thin;
}

.cart-upsell {
	display: grid;
	gap: 4px;
	align-content: start;
	scroll-snap-align: start;
}

.cart-upsell__img img {
	display: block;
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: calc(var(--radius) * .7);
	background: var(--color-surface);
}

.cart-upsell__name {
	display: -webkit-box;
	overflow: hidden;
	font-size: 13px;
	line-height: 1.3;
	text-decoration: none;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.cart-upsell__price { font-size: 13px; }
.cart-upsell__price del { display: none; }
.woocommerce .cart-upsell .button.cart-upsell__add,
.cart-upsell .button.cart-upsell__add { min-height: 32px; margin-top: 2px; font-size: 13px; }

/* Coupon */
.cart-coupon {
	margin-top: 20px;
	padding: 12px 14px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
}

.cart-coupon summary {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	list-style: none;
}

.cart-coupon summary::-webkit-details-marker { display: none; }
.cart-coupon__form { display: flex; gap: 8px; margin-top: 12px; }
.cart-coupon__form input { flex: 1; min-width: 0; min-height: 38px; padding: 6px 12px; text-transform: uppercase; }
.cart-coupon__applied { margin-top: 10px; }
.cart-coupon__applied .chip { cursor: pointer; font-weight: 600; font-size: 13px; }

/* Footer */
.cart-drawer__foot {
	display: grid;
	gap: 8px;
	padding: 16px 20px calc(16px + env(safe-area-inset-bottom));
	border-top: 1px solid var(--color-border);
	background: var(--color-bg);
}

.cart-drawer__line {
	display: flex;
	justify-content: space-between;
	font-size: 16px;
	font-weight: 600;
}

.cart-drawer__line--discount { font-size: 14px; font-weight: 500; color: #127a3c; }
.cart-drawer__hint { margin: 0; font-size: 13px; color: var(--color-muted); }
.woocommerce .button.cart-drawer__checkout,
.button.cart-drawer__checkout { width: 100%; min-height: 50px; font-size: 16px; }
.cart-drawer__view { justify-self: center; font-size: 14px; }

.cart-drawer__note {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin: 0;
	font-size: 12px;
	color: var(--color-muted);
}

/* WooCommerce's "View cart" link after AJAX add is redundant with the drawer. */
.woocommerce ul.products li.product .added_to_cart { display: none; }

/* ---------- Cart & checkout blocks ---------- */

.woocommerce-cart .site-main,
.woocommerce-checkout .site-main { padding-top: 32px; }

.woocommerce-cart .entry-title,
.woocommerce-checkout .entry-title { font-size: calc(clamp(26px, 3.4vw, 36px) * var(--heading-scale, 1)); }

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	font-family: var(--font-body);
	color: var(--color-text);
}

.wc-block-components-button:not(.is-link) {
	min-height: 50px;
	border-radius: var(--radius-btn) !important;
	background: var(--color-brand) !important;
	color: var(--color-brand-contrast) !important;
	font-family: var(--font-body);
	font-weight: 500;
	letter-spacing: .02em;
	box-shadow: none !important;
}

.wc-block-components-button:not(.is-link):hover { filter: brightness(1.12); }

.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-textarea {
	border-radius: var(--radius) !important;
	border-color: var(--color-border) !important;
	font-family: var(--font-body) !important;
}

.wc-block-components-text-input.is-active input:focus,
.wc-block-components-text-input input:focus {
	border-color: var(--color-brand) !important;
	box-shadow: 0 0 0 1px var(--color-brand) !important;
}

.wc-block-components-title,
.wc-block-components-checkout-step__title,
.wc-block-cart__totals-title {
	font-family: var(--font-heading) !important;
	font-weight: 600 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
}

.wc-block-components-product-name { font-weight: 500; text-decoration: none; }
.wc-block-components-product-badge { border-radius: calc(var(--radius) * .6); }
.wc-block-components-sale-badge { border-color: var(--color-sale) !important; color: var(--color-sale) !important; }

.wc-block-components-sidebar-layout .wc-block-components-sidebar .wc-block-components-panel,
.wc-block-components-sidebar-layout .wc-block-components-sidebar .wc-block-components-totals-wrapper { border-color: var(--color-border); }

.wp-block-woocommerce-checkout-order-summary-block,
.wc-block-cart .wc-block-cart__sidebar .wc-block-components-sidebar,
.wp-block-woocommerce-cart-totals-block {
	border-radius: var(--radius);
}

.wc-block-components-radio-control__option-checked,
.wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted {
	box-shadow: inset 0 0 0 2px var(--color-brand) !important;
}

.wc-block-components-radio-control__input:checked { border-color: var(--color-brand) !important; }
.wc-block-components-radio-control__input:checked::before { background: var(--color-brand) !important; }

.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
	background: var(--color-brand);
	border-color: var(--color-brand);
}

.wc-block-components-checkbox .wc-block-components-checkbox__mark { fill: var(--color-brand-contrast); }

.wc-block-components-totals-coupon-link,
.wc-block-components-checkout-return-to-cart-button { color: var(--color-brand); }

.wc-block-components-notice-banner { border-radius: var(--radius); }

/* ---------- Classic cart / checkout (when a store switches back to shortcodes) ---------- */

.woocommerce table.shop_table {
	border-color: var(--color-border);
	border-radius: var(--radius);
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td { border-color: var(--color-border); }

.woocommerce form .form-row label { font-size: 14px; font-weight: 500; }
.woocommerce form .form-row .input-text,
.woocommerce form .form-row select { border-radius: var(--radius); }

.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
	border-top-color: var(--color-brand);
	border-radius: var(--radius);
	background: var(--color-surface);
}

.woocommerce-message::before,
.woocommerce-info::before { color: var(--color-brand); }

/* ---------- My Account ---------- */

.woocommerce-account .site-main { padding-top: 32px; }

.woocommerce-account .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
}

/* The scrolling tab row must not widen the grid on phones. */
.woocommerce-account .woocommerce > * { min-width: 0; }

@media (min-width: 900px) {
	.woocommerce-account.logged-in .woocommerce {
		grid-template-columns: 240px minmax(0, 1fr);
		gap: 48px;
		align-items: start;
	}
}

.woocommerce-account .woocommerce::before,
.woocommerce-account .woocommerce::after { display: none; }

.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content {
	float: none;
	width: auto;
}

.woocommerce-MyAccount-navigation ul {
	display: grid;
	gap: 2px;
	margin: 0;
	padding: 8px;
	list-style: none;
	border-radius: var(--radius);
	background: var(--color-surface);
}

.woocommerce-MyAccount-navigation a {
	display: block;
	padding: 10px 14px;
	border-radius: calc(var(--radius) * .7);
	font-size: 15px;
	text-decoration: none;
}

.woocommerce-MyAccount-navigation a:hover { background: var(--color-bg); color: var(--color-text); }

.woocommerce-MyAccount-navigation .is-active a {
	background: var(--color-bg);
	color: var(--color-brand);
	font-weight: 600;
	box-shadow: 0 1px 3px rgb(0 0 0 / .06);
}

@media (max-width: 899px) {
	.woocommerce-MyAccount-navigation ul {
		display: flex;
		padding: 6px;
		overflow-x: auto;
		scrollbar-width: none;
	}
	.woocommerce-MyAccount-navigation li { flex-shrink: 0; }
	.woocommerce-MyAccount-navigation a { padding: 8px 12px; white-space: nowrap; font-size: 14px; }
}

.account-dashboard__hello {
	margin: 0;
	font-family: var(--font-heading);
	font-size: clamp(24px, 3vw, 32px);
	font-weight: var(--heading-weight);
}

.account-dashboard__sub { margin: 4px 0 24px; color: var(--color-muted); }

.account-order {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 24px;
	padding: 18px 20px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
}

.account-order p { margin: 0; }
.account-order__label { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--color-muted); }
.account-order__title { font-size: 17px; font-weight: 600; }
.account-order__meta { display: flex; align-items: center; gap: 10px; margin-top: 4px !important; font-size: 14px; }

.status-pill {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 999px;
	background: var(--color-surface);
	font-size: 12px;
	font-weight: 600;
}

.status-pill--completed { background: #e3f4e8; color: #127a3c; }
.status-pill--processing { background: #e6effc; color: #1d4ed8; }
.status-pill--on-hold,
.status-pill--pending { background: #fdf3dc; color: #92580b; }
.status-pill--cancelled,
.status-pill--failed { background: #fbe4e2; color: #b42318; }

.account-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.account-card {
	display: grid;
	gap: 4px;
	height: 100%;
	padding: 20px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	text-decoration: none;
	transition: border-color .2s, transform .2s;
}

.account-card:hover { border-color: var(--color-brand); transform: translateY(-2px); color: inherit; }

.account-card__icon {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	margin-bottom: 8px;
	border-radius: 50%;
	background: var(--color-surface);
	color: var(--color-brand);
}

.account-card__title { font-weight: 600; }
.account-card__text { font-size: 14px; color: var(--color-muted); }

/* Orders table */
.woocommerce-account .woocommerce-orders-table { border-radius: var(--radius); overflow: hidden; }
.woocommerce-account .woocommerce-orders-table .button { min-height: 34px; padding: 0 12px; font-size: 13px; }

/* Login / register */
.woocommerce-account:not(.logged-in) .woocommerce { max-width: 980px; margin-inline: auto; }

.woocommerce-account:not(.logged-in) .u-columns {
	display: grid;
	gap: 24px;
}

@media (min-width: 768px) {
	.woocommerce-account:not(.logged-in) .u-columns { grid-template-columns: 1fr 1fr; }
}

.woocommerce-account:not(.logged-in) .u-columns::before,
.woocommerce-account:not(.logged-in) .u-columns::after { display: none; }

.woocommerce-account:not(.logged-in) .u-column1,
.woocommerce-account:not(.logged-in) .u-column2 { float: none; width: auto; }

.woocommerce form.login,
.woocommerce form.register {
	margin: 0;
	padding: 28px;
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
}

.woocommerce-account:not(.logged-in) h2 { font-size: 24px; }
.woocommerce form.login .button,
.woocommerce form.register .button { width: 100%; margin-top: 8px; }
.woocommerce form .woocommerce-form-login__rememberme { display: block; margin-bottom: 8px; font-size: 14px; }
.woocommerce-LostPassword { margin: 12px 0 0; font-size: 14px; }

/* Free gift line and progress bar */
.cart-item__gift { display: inline-flex; align-items: center; gap: 6px; color: var(--color-brand); font-weight: 600; }
.gift-bar .ship-bar__track span { background: var(--color-accent, var(--color-brand)); }

/* Delivery + gift bars read as one card: no overlap, a hairline between them. */
.ship-bar:has(+ .gift-bar) { margin-bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.ship-bar + .gift-bar {
	margin-top: 0;
	border-top: 1px solid color-mix(in srgb, var(--color-text) 8%, transparent);
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

/* Once a goal is reached the full bar adds nothing; keep just the tick line. */
.ship-bar.is-done { padding-block: 10px; }
.ship-bar.is-done .ship-bar__msg { margin: 0; }
.ship-bar.is-done .ship-bar__track { display: none; }

/* Short screens: give the item list the room, trim the footer extras. */
@media (max-height: 760px) {
	.ship-bar { padding: 9px 12px; }
	.ship-bar__msg { font-size: 13px; margin-bottom: 6px; }
	.cart-drawer__foot { gap: 6px; padding-top: 12px; padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
	.cart-drawer__hint { display: none; }
	.woocommerce .button.cart-drawer__checkout,
	.button.cart-drawer__checkout { min-height: 46px; }
}

@media (max-height: 640px) {
	.cart-drawer__foot .payment-list,
	.cart-drawer__view { display: none; }
}
