/* ═══════════ Winkelmand (knop + lade) ═══════════ */
.cart-fab {
  position: fixed;
  right: 22px;
  bottom: 92px;
  z-index: 245;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(26,26,26,.92);
  border: 1px solid rgba(212,167,60,.55);
  box-shadow: 0 6px 24px rgba(0,0,0,.45);
  display: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: border-color .4s, transform .4s var(--ease-lux);
}
.cart-fab.has-items { display: flex; animation: cartIn .6s var(--ease-lux); }
.cart-fab:hover { border-color: var(--goud-glans); transform: translateY(-2px); }
.cart-fab svg { width: 24px; height: 24px; fill: none; stroke: var(--goud-glans); stroke-width: 1.4; stroke-linejoin: round; }
.cart-count {
  position: absolute;
  top: -4px; right: -4px;
  min-width: 21px; height: 21px;
  border-radius: 11px;
  padding: 0 5px;
  background: linear-gradient(105deg, var(--goud), var(--goud-glans));
  color: #1a1a1a;
  font: 600 11px/21px var(--sans);
  text-align: center;
}
@keyframes cartIn { from { transform: scale(.4); opacity: 0; } to { transform: scale(1); opacity: 1; } }

.cart-veil {
  position: fixed; inset: 0; z-index: 300;
  background: rgba(8,8,6,.6);
  backdrop-filter: blur(3px);
  opacity: 0; pointer-events: none;
  transition: opacity .45s;
}
.cart-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 301;
  width: min(420px, 92vw);
  background: #17150f;
  border-left: 1px solid rgba(184,134,11,.4);
  display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform .55s var(--ease-lux);
}
body.cart-open .cart-veil { opacity: 1; pointer-events: auto; }
body.cart-open .cart-drawer { transform: none; }

.cart-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 24px 26px 18px;
  border-bottom: 1px solid rgba(184,134,11,.2);
}
.cart-title { font-family: var(--serif); font-size: 1.35rem; color: var(--ivoor); }
.cart-close {
  background: none; border: 0; cursor: pointer;
  color: var(--goud-licht); font-size: 28px; line-height: 1;
}
.cart-lines { list-style: none; margin: 0; padding: 8px 26px; overflow-y: auto; flex: 1; }
.cart-lines li {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "main price" "qty qty";
  gap: 8px 14px;
  padding: 16px 0;
  border-bottom: 1px solid rgba(184,134,11,.14);
}
.cart-line-main { grid-area: main; }
.cart-line-name { color: var(--ivoor); font-family: var(--serif); font-size: 1.02rem; }
.cart-line-meta { font-size: .74rem; letter-spacing: .08em; color: var(--tekst-dim); margin-top: 3px; }
.cart-line-price { grid-area: price; color: var(--goud-glans); font-weight: 600; font-size: .92rem; }
.cart-qty { grid-area: qty; display: inline-flex; align-items: center; gap: 12px; }
.cart-qty button {
  width: 28px; height: 28px;
  background: none; border: 1px solid rgba(212,167,60,.4);
  color: var(--goud-licht); cursor: pointer; font-size: 15px; line-height: 1;
}
.cart-qty span { min-width: 14px; text-align: center; color: var(--ivoor); font-size: .9rem; }
.cart-lines li.cart-empty { display: block; color: var(--tekst-dim); font-size: .9rem; border: 0; padding-top: 26px; }
.cart-foot { padding: 20px 26px 26px; border-top: 1px solid rgba(184,134,11,.2); }
.cart-sum { display: flex; justify-content: space-between; margin-bottom: 16px; color: var(--tekst); font-size: .9rem; }
.cart-sum b { color: var(--goud-glans); font-size: 1.05rem; }
.cart-go { display: block; text-align: center; }

@media (max-width: 720px) {
  .cart-fab { right: 16px; bottom: 78px; width: 50px; height: 50px; }
}
@media (prefers-reduced-motion: reduce) {
  .cart-drawer, .cart-veil { transition: none; }
  .cart-fab.has-items { animation: none; }
}

/* ═══════════ Maatkeuze op de resultaatkaarten ═══════════ */
.qr-buy {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin-top: 16px;
}
.qr-sizes { display: inline-flex; border: 1px solid rgba(184,134,11,.4); }
.qr-size {
  background: none; border: 0; cursor: pointer;
  padding: 9px 13px;
  font: 500 .76rem var(--sans);
  letter-spacing: .04em;
  color: var(--tekst);
  border-right: 1px solid rgba(184,134,11,.25);
  display: grid; gap: 2px; text-align: center;
  transition: background .3s, color .3s;
}
.qr-size:last-child { border-right: 0; }
.qr-size small { color: var(--tekst-dim); font-size: .7rem; }
.qr-size.is-selected { background: rgba(212,167,60,.16); color: var(--goud-glans); }
.qr-size.is-selected small { color: var(--goud-licht); }
.qr-size[disabled] { opacity: .35; cursor: not-allowed; }
.qr-add { padding: 12px 20px; font-size: 10.5px; }
.qr-add.is-added { pointer-events: none; }

.cart-free { margin: 0 0 10px; font-size: .8rem; color: var(--tekst-dim); }
.cart-free b { color: var(--goud-glans); font-weight: 500; }
.cart-free[hidden] { display: none; }
