/*
 * The bag (/cart) — loaded only on that page (Cart::index passes it to the
 * header as a page style). Matches the checkout page's look.
 */

#cart-page { --line:#e3dcd4; --muted:#655d5b; --accent:#0c99f2; padding-top:24px; padding-bottom:40px; }

/* ---- Empty bag --------------------------------------------------------- */
.cart-empty { position:relative; }
.cart-empty img { width:100%; border-radius:14px; }
.cart-empty-text { position:absolute; top:50%; left:6%; transform:translateY(-50%); max-width:45%; }
.cart-empty-text h1 { font-size:clamp(1.4rem, 3vw, 2.6rem); color:#4f6390; margin-bottom:18px; }
.cart-empty-text .btn { margin:0 8px 8px 0; }

/* ---- Items ------------------------------------------------------------- */
.cart-heading { font-size:1.8rem; margin-bottom:16px; }
.cart-count { font-size:1rem; font-weight:400; color:var(--muted); }
.cart-items { list-style:none; padding:0; margin:0 0 12px; }
.cart-item { display:flex; gap:18px; padding:18px; margin-bottom:14px; border:1px solid var(--line); border-radius:14px; background:#fff; transition:opacity .2s; }
.cart-item.is-saving { opacity:.6; }
.cart-item-image { width:120px; height:120px; object-fit:contain; border-radius:10px; background:#faf6f1; flex:0 0 auto; }
.cart-item-main { flex:1; min-width:0; display:flex; flex-direction:column; }
.cart-item-head { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.cart-item-title { font-size:1.1rem; font-weight:600; margin:0; }
.cart-item-total { font-weight:700; font-size:1.1rem; white-space:nowrap; }
.cart-item-note { margin:4px 0 0; color:#b26a00; font-size:.88rem; }
.cart-item-contents { list-style:none; padding:0; margin:8px 0 0; max-width:360px; color:var(--muted); font-size:.9rem; }
.cart-item-contents li { display:flex; justify-content:space-between; gap:8px; padding:1px 0; }
.cart-item-qty { white-space:nowrap; }
.cart-item-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; margin-top:auto; padding-top:12px; }
.cart-item-each { color:var(--muted); font-size:.9rem; }
.cart-item-links { margin-left:auto; display:flex; gap:16px; }
.cart-edit, .cart-remove { border:0; background:none; padding:4px 0; font-size:.92rem; text-decoration:none; color:var(--accent); }
.cart-remove { color:#c62828; }
.cart-edit:hover, .cart-remove:hover { text-decoration:underline; }
.cart-item-error { margin:8px 0 0; color:#c62828; font-size:.9rem; }

/* quantity stepper */
.cart-stepper { display:inline-flex; align-items:center; border:1px solid #bdb3aa; border-radius:999px; overflow:hidden; }
.cart-step { width:38px; height:38px; border:0; background:#fff; color:#231816; }
.cart-step:hover { background:#f4efe9; }
.cart-qty { width:44px; height:38px; border:0; text-align:center; font-weight:600; -moz-appearance:textfield; }
.cart-qty::-webkit-outer-spin-button, .cart-qty::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
.cart-stepper button:disabled, .cart-qty:disabled { background:#fff; }

.cart-continue { display:inline-block; margin-top:4px; text-decoration:none; }

/* ---- Summary ----------------------------------------------------------- */
.cart-summary { position:sticky; top:90px; border:1px solid var(--line); border-radius:14px; padding:18px 20px; background:#fbf7f1; }
.cart-summary-title { font-size:1.15rem; margin-bottom:10px; }
.cart-summary dl { margin:0 0 10px; }
.cart-summary dl > div { display:flex; justify-content:space-between; padding:6px 0; }
.cart-summary dt { font-weight:400; }
.cart-summary dd { margin:0; }
.cart-summary-muted { color:var(--muted); }
.cart-summary-total { border-top:1px solid var(--line); margin-top:4px; font-size:1.2rem; font-weight:700; }
.cart-summary-note { color:var(--muted); font-size:.85rem; }
.cart-mobile-bar { display:none; }

@media (max-width: 991.98px) {
    .cart-summary { position:static; }
    /* phones and tablets: the total and Checkout stay at the bottom of the screen */
    .cart-mobile-bar { display:flex; justify-content:space-between; align-items:center; gap:12px; position:fixed; left:0; right:0; bottom:0; z-index:1000; padding:10px 16px; background:#231816; color:#fff; }
    .cart-mobile-bar strong { margin-left:6px; font-size:1.1rem; }
    #cart-page { padding-bottom:80px; }
    /* hidden while typing: with the keyboard open, phones move fixed bars with the page (tmwv2.js) */
    .keyboard-open .cart-mobile-bar { display:none; }
}
@media (max-width: 575.98px) {
    #cart-page { padding-left:16px; padding-right:16px; }
    .cart-heading { font-size:1.5rem; }
    .cart-item { gap:12px; padding:14px; }
    .cart-item-image { width:80px; height:80px; }
    .cart-item-links { margin-left:0; width:100%; }
    .cart-empty-text { position:static; transform:none; max-width:none; text-align:center; padding:16px 0; }
}
