/* Cart drawer rows: spacing lives on the lines themselves (the line wrapper replaced .cartd__items as the grid).
   Divider sits between lines with equal space either side, so nothing can touch it. */
[data-cart-lines] { display: block; }
.cartd__items .cline { gap: var(--space-md); padding-block: var(--space-lg); border-bottom: 0; }
.cartd__items .cline + .cline { border-top: var(--rule-hair) solid var(--color-rule); }
.cartd__items .cline:first-child { padding-top: var(--space-xs); }
.cartd__items .cline:last-child { padding-bottom: var(--space-xs); }
.cline__body { min-width: 0; }
.cartd__items .cline__name { display: block; font-size: var(--text-base); font-weight: var(--wt-mid); line-height: 1.3; text-decoration: none; }
.cartd__items a.cline__name:hover { text-decoration: underline; text-underline-offset: 3px; }
.cartd__items .opts { margin-top: var(--space-sm); }
/* Price and quantity share a row: price left, stepper right. */
.cline__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-xs) var(--space-sm); margin-top: var(--space-sm); }
.cartd__items .cline__price { margin: 0; font-size: var(--text-base); color: var(--color-ink); }
.cartd__items .cline__price small { display: block; white-space: nowrap; font-size: var(--text-xs); color: var(--color-muted); }
.cartd__items .cline__qty { margin-top: 0; }
.cartd__items .cline__remove { margin-top: -6px; }

/* Cart drawer: quantity steppers, option list, undo toast, cross-sell shelf. */
.cline__meta { list-style: none; margin: var(--space-2xs) 0 0; padding: 0; font-size: var(--text-xs); color: var(--color-muted); }
.cline__qty { display: inline-grid; grid-template-columns: 40px 2.25rem 40px; align-items: center; margin-top: var(--space-xs); border: var(--rule-hair) solid var(--color-rule-2); }
.cline__qty button { appearance: none; background: none; border: 0; padding: 0; width: 100%; min-height: 44px; display: grid; place-items: center; font-family: var(--font-mono); font-size: var(--text-base); line-height: 1; color: var(--color-ink); cursor: pointer; }
.cline__qty button:hover:not(:disabled) { background: var(--color-ink); color: var(--color-paper); }
.cline__qty button:disabled { color: var(--color-rule-2); cursor: not-allowed; }
.cline__qty output { text-align: center; font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: var(--text-xs); }
.cartd[aria-busy="true"] .cartd__items { opacity: .6; pointer-events: none; }

.cartd__lines + .cartd__shelf, .cartd__shelf { margin-top: var(--space-lg); display: grid; gap: var(--space-md); }
.cartd__shelf-title { font-family: var(--font-display); font-weight: var(--wt-hair); text-transform: uppercase; letter-spacing: var(--track-hair); font-size: var(--text-xs); color: var(--color-ink-2); padding-bottom: var(--space-xs); border-bottom: var(--rule-hair) solid var(--color-rule); }
.cline--rec .cline__name { display: block; text-decoration: none; }
.cline--rec .cline__name:hover { text-decoration: underline; text-underline-offset: 3px; }
.cline--rec .btn { align-self: center; }

.cartd__toast { position: absolute; inset: auto var(--space-md) 9rem; margin: 0; padding: var(--space-sm) var(--space-md); background: var(--color-ink); color: var(--color-paper); font-size: var(--text-xs); z-index: 1; }
.cartd__toast[hidden] { display: none; }
.cartd__toast button { appearance: none; background: none; border: 0; padding: 0; font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; min-height: 24px; }

/* Option breakdown on a configured cart line (drawer and cart page): collapsible, one line per answer. */
.opts { margin-top: var(--space-xs); border-top: var(--rule-hair) solid var(--color-rule); font-size: var(--text-xs); line-height: 1.35; }
.opts summary { display: flex; align-items: center; gap: var(--space-xs); min-height: 40px; cursor: pointer; list-style: none; font-weight: var(--wt-mid); color: var(--color-ink); }
.opts summary::-webkit-details-marker { display: none; }
.opts summary b { margin-left: auto; font-family: var(--font-mono); font-weight: var(--wt-mid); font-variant-numeric: tabular-nums; }
.opts summary::after { content: ""; flex: none; width: .4rem; height: .4rem; border-right: var(--rule-bold) solid currentColor; border-bottom: var(--rule-bold) solid currentColor; transform: rotate(45deg) translateY(-2px); }
.opts summary:not(:has(b))::after { margin-left: auto; }
.opts[open] summary::after { transform: rotate(-135deg); }
.opts ul { list-style: none; margin: 0 0 var(--space-xs); padding: 0; display: grid; gap: var(--space-xs); }
.opts li { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--space-sm); color: var(--color-ink); }
.opts li span { min-width: 0; overflow-wrap: anywhere; }
.opts li i { display: block; font-style: normal; color: var(--color-muted); }
.opts li b { flex: none; font-family: var(--font-mono); font-weight: var(--wt-mid); font-variant-numeric: tabular-nums; }
