/* ==========================================================================
   PurOstill V2 — cart drawer
   ========================================================================== */

.v2-cart-drawer {
	position: fixed; top: 0; right: 0; z-index: 130;
	width: min(420px, 92vw); height: 100vh;
	display: flex; flex-direction: column; overflow: hidden;
	background: var(--v2-surface);
	box-shadow: -12px 0 32px rgba(var(--v2-ink-rgb), .2);
	transform: translateX(101%);
	transition: transform .3s ease;
	visibility: hidden;
}
.v2-cart-drawer.is-open { transform: none; visibility: visible; }

.v2-cart-drawer__head {
	display: flex; align-items: center; justify-content: space-between;
	gap: 1rem; padding: 1.25rem 1.5rem;
	border-bottom: 1px solid var(--v2-line);
}
.v2-cart-drawer__title { margin: 0; font-size: 1.1rem; font-weight: 700; }

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

/* Empty ------------------------------------------------------------------- */

.v2-cart-drawer__empty {
	flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: .6rem; padding: 2rem 1.5rem; text-align: center;
}
.v2-cart-drawer__empty-icon {
	width: 64px; height: 64px; margin-bottom: .4rem;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px;
	background: rgba(var(--v2-accent-rgb), .1); color: var(--v2-accent);
}
.v2-cart-drawer__empty-title { font-size: 1.1rem; font-weight: 700; }
.v2-cart-drawer__empty .v2-btn { margin-top: .8rem; }

/* Free shipping bar -------------------------------------------------------- */

.v2-cart-drawer__ship { padding: 1rem 1.5rem; border-bottom: 1px solid var(--v2-line); }
.v2-cart-drawer__ship p { font-size: .88rem; color: var(--v2-muted); margin-bottom: .5rem; }
.v2-cart-drawer__ship.is-done p { color: var(--v2-ok); font-weight: 600; }
.v2-cart-drawer__bar { display: block; height: 6px; border-radius: 999px; background: var(--v2-line); overflow: hidden; }
.v2-cart-drawer__bar span { display: block; height: 100%; border-radius: 999px; background: var(--v2-accent); transition: width .3s ease; }
.v2-cart-drawer__ship.is-done .v2-cart-drawer__bar span { background: var(--v2-ok); }

/* Lines -------------------------------------------------------------------- */

.v2-cart-drawer__list {
	flex: 1; min-height: 0; overflow-y: auto;
	list-style: none; margin: 0; padding: 1rem 1.5rem;
	display: flex; flex-direction: column; gap: 1rem;
}

.v2-cart-line { display: flex; gap: .9rem; padding-bottom: 1rem; border-bottom: 1px solid var(--v2-line); }
.v2-cart-line:last-child { border-bottom: none; padding-bottom: 0; }

.v2-cart-line__media {
	width: 72px; height: 72px; flex: none;
	border-radius: .8rem; overflow: hidden;
	background: var(--v2-tint);
}
.v2-cart-line__media img { width: 100%; height: 100%; object-fit: contain; padding: .3rem; }

.v2-cart-line__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .45rem; }
.v2-cart-line__name { font-weight: 600; font-size: .95rem; line-height: 1.35; }
.v2-cart-line__meta { font-size: .8rem; color: var(--v2-muted); }
.v2-cart-line__row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.v2-cart-line__price { font-weight: 700; }

.v2-qty--sm button { width: 32px; height: 36px; }
.v2-qty--sm input { width: 40px; height: 36px; min-height: 36px; }

.v2-cart-line__remove {
	align-self: flex-start;
	padding: 0; border: none; background: none;
	color: var(--v2-muted); font-family: inherit; font-size: .8rem;
	text-decoration: underline; text-underline-offset: 3px; cursor: pointer;
}
.v2-cart-line__remove:hover { color: var(--v2-sale); }

/* Footer ------------------------------------------------------------------- */

.v2-cart-drawer__foot {
	padding: 1.25rem 1.5rem;
	border-top: 1px solid var(--v2-line);
	background: var(--v2-surface);
	display: flex; flex-direction: column; gap: .6rem;
}
.v2-cart-drawer__total { display: flex; justify-content: space-between; align-items: baseline; font-size: 1.05rem; }
.v2-cart-drawer__total strong { font-size: 1.25rem; }
.v2-cart-drawer__note { font-size: .8rem; color: var(--v2-muted); margin-bottom: .3rem; }

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

@media (max-width: 640px) { .v2-cart-drawer { width: 100vw; } }