/* 购物车抽屉(scripts/cart.js 注入)。移植自现役站 styles.css 的 .cart-* 规则,颜色/字体全部换本站 token。
   z-index 压在 header(header.css)之上。2026-08-30。 */

.cart-overlay {
  position: fixed; inset: 0;
  background: rgba(42, 29, 21, .4);
  opacity: 0; visibility: hidden;
  transition: opacity 220ms ease, visibility 0s linear 220ms;
  z-index: 1199;
}
.cart-overlay.is-open { opacity: 1; visibility: visible; transition: opacity 220ms ease; }

.cart-drawer {
  position: fixed; top: 0; right: 0;
  height: 100dvh; width: min(420px, 92vw);
  display: flex; flex-direction: column;
  background: var(--color-bg);
  color: var(--color-ink);
  box-shadow: -16px 0 40px rgba(42, 29, 21, .12);
  transform: translateX(100%);
  transition: transform 280ms cubic-bezier(.22, 1, .36, 1);
  z-index: 1200;
}
.cart-drawer.is-open { transform: translateX(0); }
.cart-drawer[inert] { pointer-events: none; }

.cart-drawer__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 24px 24px 12px;
  border-bottom: 1px solid var(--color-border);
}
.cart-drawer__title { font-family: var(--font-brand); font-size: 26px; font-weight: 400; letter-spacing: .02em; }
.cart-close {
  width: 36px; height: 36px;
  border: 1px solid var(--color-ink); border-radius: 999px;
  background: var(--color-white); color: var(--color-ink);
  font-size: 20px; line-height: 1; cursor: pointer;
}
.cart-error {
  margin: 12px 24px 0; padding: 10px 12px;
  font-size: 12px; line-height: 1.5;
  border: 1px solid var(--color-main-deep); border-radius: 8px;
  background: var(--band-rose);
}
.cart-lines { flex: 1; overflow-y: auto; margin: 0; padding: 16px 24px; list-style: none; }
.cart-line {
  display: grid; grid-template-columns: 72px 1fr; gap: 14px;
  padding: 14px 0;
  border-bottom: 1px solid var(--color-border);
}
.cart-line:last-child { border-bottom: 0; }
.cart-line__img { display: block; width: 72px; height: 72px; border-radius: 12px; background: var(--color-white); overflow: hidden; }
.cart-line__img img { width: 100%; height: 100%; object-fit: cover; }
.cart-line__body h4 { font-size: 14px; font-weight: 700; line-height: 1.4; }
.cart-line__body h4 a { color: inherit; text-decoration: none; }
.cart-line__note { margin-top: 4px; font-size: 11px; line-height: 1.4; color: var(--color-muted); }
.cart-line__row { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; }
.cart-line__row strong { font-size: 14px; letter-spacing: .045em; }
.cart-qty {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px;
  border: 1px solid var(--color-border-2); border-radius: 999px;
  background: var(--color-white);
}
.cart-qty button {
  width: 26px; height: 26px;
  border: 0; border-radius: 999px;
  background: transparent; color: var(--color-ink);
  font-size: 15px; cursor: pointer;
}
.cart-qty button:hover { background: var(--color-tint); }
.cart-qty span { min-width: 22px; text-align: center; font-size: 12px; font-weight: 700; }
.cart-line__remove {
  margin-top: 8px;
  border: 0; background: none;
  color: var(--color-muted);
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  cursor: pointer;
}
.cart-line__remove:hover { color: var(--color-ink); }
.cart-empty { padding: 24px; text-align: center; font-size: 13px; color: var(--color-muted); }
.cart-drawer__foot { padding: 16px 24px 24px; border-top: 1px solid var(--color-border); }
.cart-subtotal { display: flex; justify-content: space-between; margin-bottom: 12px; font-size: 15px; }
.cart-subtotal strong { letter-spacing: .045em; }
.cart-checkout {
  display: block; width: 100%;
  padding: 16px;
  border-radius: 999px;
  background: var(--color-ink-soft); color: var(--color-white);
  font-size: 14px; font-weight: 700; letter-spacing: .045em; text-align: center; text-decoration: none;
  transition: background .3s;
}
.cart-checkout:hover { background: var(--color-muted); }
.cart-checkout.is-disabled { opacity: .4; pointer-events: none; }
.cart-note { margin-top: 10px; font-size: 11px; line-height: 1.5; color: var(--color-muted); }

body.cart-open { overflow: hidden; }

/* 页头 pill 计数:0 时藏;加购按钮忙态 */
.cart-button__count.is-hidden { display: none; }
[data-add-to-cart].is-busy { opacity: .6; pointer-events: none; }
