/* eThobe cart drawer. The drawer itself is still the Kalles one (markup in
   components/kalles/drawers/mini-cart.html and kalles/mini-cart-content.html,
   behaviour in kalles/cart) — this only dresses it in the eThobe palette and
   type. Every rule is under #t4s-mini_cart so the Kalles rules it replaces
   (most of them #t4s-mini_cart plus classes) lose on specificity. */

#t4s-mini_cart{
  --bg:#faf7f1;
  --panel:#f1ead9;
  --ink:#231d12;
  --muted:#6f6552;
  --accent:#9a7733;
  --accent-deep:#7a5d24;
  --line:#e6ddc8;
  --card:#ffffff;
  --display:'Marcellus','Times New Roman',serif;
  --body:'Jost','Segoe UI',Arial,sans-serif;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--body);
}
#t4s-mini_cart *{font-family:inherit}
@media (min-width:641px){
  #t4s-mini_cart{width:400px}
}

/* header */
#t4s-mini_cart .t4s-drawer__header{min-height:64px;padding-left:24px;border-bottom:1px solid var(--line);background:var(--bg)}
#t4s-mini_cart .t4s-drawer__header span{font-family:var(--display);font-size:21px;font-weight:400;text-transform:none;letter-spacing:.01em;color:var(--ink)}
#t4s-mini_cart .t4s-drawer__close{width:56px;height:56px;color:var(--ink)}
#t4s-mini_cart .t4s-drawer__close:hover{background:var(--panel);color:var(--accent-deep)}

/* items */
#t4s-mini_cart .t4s-mini_cart__item{padding:18px 24px;border-bottom:1px solid var(--line);align-items:flex-start !important}
#t4s-mini_cart .t4s-mini_cart__img{border:1px solid var(--line);background:var(--card)}
#t4s-mini_cart .t4s-mini_cart__title{font-family:var(--display);font-size:16px;line-height:1.35;color:var(--ink);white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#t4s-mini_cart .t4s-mini_cart__title:hover{color:var(--accent-deep)}
#t4s-mini_cart .t4s-cart_meta_variant{margin:6px 0 4px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
#t4s-mini_cart .t4s-mini_cart__meta .t4s-cart_price{font-size:15px;font-weight:600;color:var(--accent-deep)}
#t4s-mini_cart .t4s-mini_cart__meta .t4s-cart_price del{margin-right:8px;font-size:13px;font-weight:400;color:var(--muted)}
#t4s-mini_cart .t4s-mini_cart__meta .t4s-cart_price ins{text-decoration:none;color:var(--accent-deep)}

/* quantity: the same box as the product page */
#t4s-mini_cart .t4s-mini_cart__actions{margin-top:12px;gap:14px}
#t4s-mini_cart .t4s-mini_cart__actions .t4s-quantity-cart-item{width:116px;height:40px;border:1px solid var(--line);border-radius:0;background:var(--card)}
#t4s-mini_cart .t4s-mini_cart__actions .t4s-quantity-cart-item button{color:var(--muted)}
#t4s-mini_cart .t4s-mini_cart__actions .t4s-quantity-cart-item button:hover{color:var(--accent-deep);background:none}
#t4s-mini_cart .t4s-mini_cart__actions .t4s-quantity-cart-item input[type=number]{font-size:15px;font-weight:600;color:var(--ink)}
#t4s-mini_cart .t4s-mini_cart__edit,
#t4s-mini_cart .t4s-mini_cart__remove{color:var(--muted)}
#t4s-mini_cart .t4s-mini_cart__edit:hover,
#t4s-mini_cart .t4s-mini_cart__remove:hover{color:var(--accent-deep)}

/* shipping estimate / coupon buttons */
#t4s-mini_cart .t4s-mini_cart__tool{background:var(--bg);border-top:0}
#t4s-mini_cart .t4s-mini_cart__tool > div{background:var(--card);border:1px solid var(--line);box-shadow:none;color:var(--accent-deep)}
#t4s-mini_cart .t4s-mini_cart__tool > div:hover{border-color:var(--accent);background:var(--card)}

/* footer */
#t4s-mini_cart .t4s-drawer__bottom{padding:20px 24px 18px;background:var(--bg);border-top:1px solid var(--line)}
#t4s-mini_cart .t4s-cart-total{margin-bottom:6px}
#t4s-mini_cart .t4s-cart-total strong{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
#t4s-mini_cart .t4s-cart__totalPrice{font-family:var(--display);font-size:24px;font-weight:400;color:var(--accent-deep)}
#t4s-mini_cart .t4s-cart__tax{margin:0 0 16px;font-size:12.5px;color:var(--muted)}
#t4s-mini_cart .t4s-cart_discounts{color:var(--accent-deep);font-size:13px}

/* buttons: View Cart outlined in ink, Check Out in the Add to Cart gold.
   Kalles forces its own font on .t4s-btn-base with !important. */
#t4s-mini_cart .t4s-btn-base{font-family:var(--body) !important}
#t4s-mini_cart .t4s-drawer__bottom .t4s-btn__cart,
#t4s-mini_cart .t4s-drawer__bottom .t4s-btn__checkout,
#t4s-mini_cart .t4s-btn-cart__emty{min-height:50px;border-radius:0;font-family:var(--body);font-size:14px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;transition:background .2s,color .2s,border-color .2s}
#t4s-mini_cart .t4s-drawer__bottom .t4s-btn__cart{--btn-color:var(--ink);--btn-background:transparent;--btn-border:var(--ink);--btn-color-hover:#fff;--btn-background-hover:var(--ink);--btn-border-hover:var(--ink);background-color:transparent;border:1px solid var(--ink);color:var(--ink);margin-bottom:10px}
#t4s-mini_cart .t4s-drawer__bottom .t4s-btn__cart:hover{background-color:var(--ink);color:#fff}
#t4s-mini_cart .t4s-drawer__bottom .t4s-btn__checkout,
#t4s-mini_cart .t4s-btn-cart__emty{--btn-color:#fff;--btn-background:var(--accent);--btn-border:var(--accent);--btn-color-hover:#fff;--btn-background-hover:var(--accent-deep);--btn-border-hover:var(--accent-deep);background-color:var(--accent);border:1px solid var(--accent);color:#fff}
#t4s-mini_cart .t4s-drawer__bottom .t4s-btn__checkout:hover,
#t4s-mini_cart .t4s-btn-cart__emty:hover{background-color:var(--accent-deep);border-color:var(--accent-deep);color:#fff}

/* empty cart */
#t4s-mini_cart .t4s-mini_cart__emty{padding:40px 24px;color:var(--muted)}
#t4s-mini_cart .t4s-mini_cart__emty svg{fill:var(--accent)}
#t4s-mini_cart .t4s-mini_cart__emty p:first-of-type{font-family:var(--display);font-size:20px;color:var(--ink)}
#t4s-mini_cart .t4s-btn-cart__emty{padding:0 28px}
