/* ── CART PAGE CSS ── */
/* ── Cart thumbnail ── */
.ci-thumb{width:56px;height:56px;min-width:56px;max-width:56px;border-radius:10px;overflow:hidden;border:1px solid var(--b);background:var(--gl)}
.ci-thumb img{width:56px;height:56px;min-width:56px;max-width:56px;object-fit:cover;object-position:center;display:block}
.ci-thumb-emoji{width:56px;height:56px;min-width:56px;display:flex;align-items:center;justify-content:center;font-size:1.8rem;background:var(--gl);border-radius:10px}
/* ── Cart items ── */
.cart-empty{text-align:center;padding:4rem 5%;color:var(--m)}
.cart-empty .ce-icon{font-size:4rem;margin-bottom:1rem}
.cart-empty h2{font-family:'Bebas Neue',sans-serif;font-size:1.8rem;letter-spacing:1px;color:var(--t);margin-bottom:.5rem}
.cart-wrap{padding:2.5rem 5%;max-width:860px;margin:0 auto}
.cart-item{background:var(--w);border:1px solid var(--b);border-radius:16px;padding:1rem 1.2rem;display:grid;grid-template-columns:56px 1fr auto auto auto;align-items:center;gap:1rem;margin-bottom:.8rem;transition:box-shadow .2s}
.cart-item:hover{box-shadow:0 4px 18px rgba(0,0,0,.07)}
.ci-emoji{font-size:2.3rem;text-align:center}
.ci-name{font-weight:700;font-size:.88rem;margin-bottom:.18rem}
.ci-price{font-size:.78rem;color:var(--m)}
.ci-qty{display:flex;align-items:center;gap:.45rem}
.ci-qty button{background:none;border:1.5px solid var(--b);border-radius:50%;width:26px;height:26px;cursor:pointer;font-weight:700;font-size:.85rem;color:var(--g);display:flex;align-items:center;justify-content:center;transition:all .2s}
.ci-qty button:hover{background:var(--gl);border-color:var(--g)}
.ci-qty span{font-weight:700;min-width:22px;text-align:center;font-size:.88rem}
.ci-sub{font-family:'Bebas Neue',sans-serif;font-size:1.25rem;color:var(--g);min-width:90px;text-align:right}
.ci-del{background:none;border:none;cursor:pointer;color:#ccc;font-size:1.1rem;transition:color .2s;padding:.2rem}
.ci-del:hover{color:var(--red)}
.cart-summary{background:var(--w);border:1.5px solid var(--b);border-radius:20px;padding:1.8rem;margin-top:1.2rem}
.cs-row{display:flex;justify-content:space-between;font-size:.88rem;padding:.45rem 0;color:var(--m)}
.cs-row.total{font-weight:800;font-size:1.05rem;color:var(--t);border-top:1.5px solid var(--b);margin-top:.6rem;padding-top:.8rem}
.cs-val{font-family:'Bebas Neue',sans-serif;font-size:1.2rem;color:var(--g)}
.cs-row.total .cs-val{font-size:1.5rem}

/* Checkout form */
.checkout-section{background:var(--w);border:1.5px solid var(--b);border-radius:20px;padding:2rem;margin-top:1.5rem;display:none}
.checkout-section.visible{display:block}
.checkout-section h2{font-family:'Bebas Neue',sans-serif;font-size:1.6rem;letter-spacing:1.5px;color:var(--g);margin-bottom:.4rem}
.checkout-section p{font-size:.83rem;color:var(--m);margin-bottom:1.5rem}
.co-field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.9rem}
.co-field label{font-size:.77rem;font-weight:700;color:var(--t)}
.co-field label span{color:var(--red);margin-left:2px}
.co-field input,.co-field select{width:100%;padding:.65rem .85rem;border:1.5px solid var(--b);border-radius:10px;font-family:'Plus Jakarta Sans',sans-serif;font-size:.85rem;color:var(--t);background:var(--cream);outline:none;transition:border-color .2s}
.co-field input:focus,.co-field select:focus{border-color:var(--g);background:var(--w)}
.co-field.has-error input,.co-field.has-error select{border-color:var(--red);background:var(--redb)}
.co-field .e-msg{font-size:.7rem;color:var(--red);display:none}
.co-field.has-error .e-msg{display:block}
.pay-opts{display:flex;gap:.6rem;margin-bottom:.9rem}
.pay-o{flex:1}
.pay-o input{display:none}
.pay-o label{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.8rem;border:1.5px solid var(--b);border-radius:11px;cursor:pointer;font-size:.82rem;font-weight:600;color:var(--m);background:var(--cream);transition:all .2s;text-align:center}
.pay-o label .pi{font-size:1.5rem}
.pay-o input:checked + label{border-color:var(--g);background:var(--gl);color:var(--g)}
.order-success{text-align:center;padding:2rem 0}
.order-success .oi{font-size:3.5rem;margin-bottom:.8rem}
.order-success h3{font-family:'Bebas Neue',sans-serif;font-size:1.8rem;letter-spacing:1px;color:var(--g);margin-bottom:.4rem}
.order-success p{font-size:.85rem;color:var(--m);line-height:1.6}

/* ── Checkout summary thumbnail ── */
.sum-thumb{width:38px;height:38px;min-width:38px;border-radius:7px;overflow:hidden;border:1px solid var(--b);background:var(--gl);display:flex;align-items:center;justify-content:center;font-size:1.2rem}
.sum-thumb img{width:38px;height:38px;min-width:38px;object-fit:cover;object-position:center;display:block}
.sum-row{display:flex;align-items:center;gap:.7rem;justify-content:space-between;padding:.3rem 0;border-bottom:1px solid var(--b)}
.sum-row:last-of-type{border-bottom:none}
.sum-left{display:flex;align-items:center;gap:.6rem;flex:1;min-width:0}
.sum-name{font-size:.8rem;color:var(--m);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sum-price{font-size:.8rem;color:var(--m);white-space:nowrap;flex-shrink:0}

@media(max-width:640px){
  .cart-item{grid-template-columns:56px 1fr;row-gap:.4rem}
  .ci-sub{grid-column:2;text-align:left}
  .ci-qty{grid-column:2}
  .ci-del{grid-column:2;justify-self:start}
}