.c3-cart-layer { position: fixed; z-index: var(--z-overlay); inset: 0; }
.c3-cart-layer[hidden] { display: none; }
.c3-cart-backdrop { position: absolute; inset: 0; background: var(--c3-overlay); opacity: 0; transition: opacity var(--motion-drawer) ease; }
body .c3-cart-layer .c3-cart-drawer { position: absolute; z-index: var(--z-drawer); top: 0; right: 0; bottom: 0; left: auto; display: flex; visibility: visible; width: 100vw; max-width: none; height: 100dvh; padding: 0; overflow: hidden; flex-direction: column; border-left: 1px solid var(--c3-border); background: var(--c3-white); box-shadow: none; transform: translateX(100%); transition: transform var(--motion-drawer) cubic-bezier(.22, 1, .36, 1); }
.c3-cart-layer.is-open .c3-cart-backdrop { opacity: 1; }
.c3-cart-layer.is-open .c3-cart-drawer { transform: translateX(0); }
.c3-cart-drawer__header { display: flex; min-height: 56px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--c3-border); padding-inline: var(--space-4); }
.c3-cart-drawer__header h2 { margin: 0; font-size: var(--fs-small); letter-spacing: .04em; }
.c3-cart-drawer__live { min-height: 0; padding-inline: var(--space-4); color: var(--c3-text-secondary); font-size: var(--fs-small); }
.c3-cart-drawer__fragment { display: flex; min-height: 0; flex: 1; flex-direction: column; }
.c3-shipping-progress { border-bottom: 1px solid var(--c3-border); padding: var(--space-4); }
.c3-shipping-progress > strong { display: block; margin-bottom: var(--space-3); font-size: var(--fs-small); }
.c3-shipping-progress__track { position: relative; height: 6px; border-radius: var(--radius-pill); background: var(--c3-border); }
.c3-shipping-progress__fill { display: block; height: 100%; border-radius: inherit; background: var(--c3-black); }
.c3-shipping-progress__marker { position: absolute; top: -3px; width: 1px; height: 12px; background: var(--c3-black); }
.c3-shipping-progress__labels { display: grid; grid-template-columns: 1fr 1fr 1fr; margin-top: var(--space-2); color: var(--c3-text-muted); font-size: 9px; }
.c3-shipping-progress__labels span:nth-child(2) { text-align: center; }
.c3-shipping-progress__labels span:last-child { text-align: right; }
.c3-cart-items { flex: 1; overflow-y: auto; padding-inline: var(--space-4); }
.c3-cart-item { display: grid; min-height: 84px; grid-template-columns: 64px 1fr auto; gap: var(--space-3); border-bottom: 1px solid var(--c3-border); padding-block: var(--space-3); }
.c3-cart-item__media { display: block; width: 64px; height: 64px; overflow: hidden; background: var(--c3-white); }
.c3-cart-item__media .c3-visual-photo,
.c3-cart-item__media img,
.c3-cart-item__image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; background: var(--c3-white); }
.c3-cart-item__placeholder { width: 64px; height: 64px; }
.c3-cart-item__body { min-width: 0; }
.c3-cart-item h3 { margin: 0; font-size: var(--fs-small); }
.c3-cart-item__variation { color: var(--c3-text-secondary); font-size: var(--fs-micro); }
.c3-cart-item__variation p { margin: 0; }
.c3-qty { display: inline-grid; height: 32px; grid-template-columns: 32px auto 32px; align-items: center; margin-top: var(--space-2); border: 1px solid var(--c3-border); border-radius: var(--radius-sm); }
.c3-qty button { width: 32px; height: 30px; padding: 0; background: transparent; }
.c3-qty span { min-width: 24px; text-align: center; }
.c3-cart-item__remove { margin-top: var(--space-2); padding: 0; background: transparent; font-size: 11px; text-decoration: underline; }
.c3-cart-upsell { display: grid; min-height: 76px; grid-template-columns: 56px 1fr auto; align-items: center; gap: var(--space-2); border-block: 1px solid var(--c3-border); padding: var(--space-2) var(--space-4); }
.c3-cart-upsell__media { width: 56px; height: 56px; overflow: hidden; background: var(--c3-white); }
.c3-cart-upsell__media img,
.c3-cart-upsell__image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; background: var(--c3-white); }
.c3-cart-upsell__content { display: grid; min-width: 0; font-size: var(--fs-micro); }
.c3-cart-summary { position: sticky; bottom: 0; display: grid; gap: var(--space-3); border-top: 1px solid var(--c3-border); padding: var(--space-4) var(--space-4) calc(var(--space-4) + env(safe-area-inset-bottom)); background: var(--c3-white); }
.c3-cart-summary > div { display: flex; justify-content: space-between; }
.c3-cart-summary p { margin: 0; color: var(--c3-text-secondary); font-size: var(--fs-micro); text-align: center; }
.c3-cart-summary .c3-text-link { text-align: center; }
.c3-cart-empty { display: grid; place-items: start; align-content: center; min-height: 70vh; padding: var(--space-8) var(--space-4); }
@media (min-width: 480px) { body .c3-cart-layer .c3-cart-drawer { width: min(420px, 100vw); max-width: 420px; box-shadow: -12px 0 32px rgba(0, 0, 0, .1); } }