/* ============================================================
   H.USH — cart-drawer-da.css
   Reskin du drawer panier dans la direction artistique.
   ADDITIF : chargé en dernier (toutes pages). Markup & JS intacts.
   Gère les deux états d'ouverture : .is-open et .is-visible.
   ============================================================ */

:root{
  --cd-ink:#14140f; --cd-paper:#fbfaf7; --cd-bg:#f5f4f0;
  --cd-ink-2:rgba(20,20,15,.6); --cd-ink-3:rgba(20,20,15,.4);
  --cd-line:rgba(20,20,15,.14); --cd-line-2:rgba(20,20,15,.08);
  --cd-accent:#c8a35b; --cd-accent-d:#a9863f;
  --cd-display:"Playfair Display", Georgia, serif;
  --cd-sans:"Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
}

/* Overlay */
.cart-overlay{ background:rgba(20,20,15,.5) !important; backdrop-filter:blur(2px); }

/* Drawer shell */
.cart-drawer{
  width:min(440px, 100vw) !important;
  background:var(--cd-paper) !important;
  color:var(--cd-ink) !important;
  border-left:1px solid var(--cd-line) !important;
  box-shadow:-24px 0 60px rgba(20,20,15,.18) !important;
  border-radius:0 !important;
  font-family:var(--cd-sans);
  display:flex !important; flex-direction:column !important;
  padding:0 !important;
}

/* Header */
.cart-drawer__header,
.cart-drawer__head{
  display:flex !important; align-items:center !important; justify-content:space-between !important;
  padding:24px 26px !important;
  border-bottom:1px solid var(--cd-line) !important;
  background:transparent !important;
}
.cart-drawer__title{
  font-family:var(--cd-sans) !important;
  font-size:12px !important; font-weight:600 !important;
  letter-spacing:0.26em !important; text-transform:uppercase !important;
  color:var(--cd-ink) !important;
}
.cart-drawer__close{
  width:38px !important; height:38px !important; border-radius:50% !important;
  border:1px solid var(--cd-line) !important; background:transparent !important;
  color:var(--cd-ink) !important; font-size:18px !important; line-height:1 !important;
  display:grid !important; place-items:center !important; cursor:pointer;
  box-shadow:none !important;
  transition:background .3s, color .3s, border-color .3s !important;
}
.cart-drawer__close:hover{ background:var(--cd-ink) !important; color:var(--cd-paper) !important; border-color:var(--cd-ink) !important; transform:none !important; }

/* Body */
.cart-drawer__body{
  flex:1 !important; overflow-y:auto !important;
  padding:20px 26px !important; background:transparent !important;
}
.cart-drawer__empty{
  color:var(--cd-ink-2) !important;
  font-family:var(--cd-display) !important; font-size:20px !important;
  padding:24px 0 !important; text-align:left;
}

/* Items (injectés par le JS) — alignés sur la page panier.
   Padding symétrique 24px haut/bas → le trait reste centré dans la marge
   entre deux produits (12px d'air visuel de chaque côté du filet). */
.cart-item{
  display:flex !important; gap:14px !important; align-items:flex-start !important;
  padding:24px 0 !important; margin:0 !important;
  background:transparent !important; border:0 !important;
  border-bottom:1px solid var(--cd-line-2) !important;
  border-radius:0 !important; box-shadow:none !important;
  position:relative;
}
.cart-item:first-child{ padding-top:8px !important; }
.cart-item:last-child{ border-bottom:0 !important; padding-bottom:8px !important; }
.cart-item__img{
  width:74px !important; height:92px !important; flex:none !important;
  overflow:hidden; background:var(--cd-bg);
  border:1px solid var(--cd-line-2) !important;
  border-radius:0 !important;
}
.cart-item__img img{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:center 28% !important; display:block; border-radius:0 !important; }
.cart-item__info{ flex:1 !important; min-width:0; }
.cart-item__title{
  font-family:var(--cd-display) !important; font-size:18px !important; line-height:1.15 !important;
  color:var(--cd-ink) !important; margin-bottom:4px;
}
.cart-item__meta{
  font-size:10px !important; letter-spacing:0.18em !important; text-transform:uppercase !important;
  color:var(--cd-ink-3) !important; margin-bottom:12px;
}
.cart-item__bottom{ display:flex !important; align-items:center !important; justify-content:space-between !important; gap:12px; }
/* Sélecteur quantité — pilule sans bordure, ombre douce */
.cart-item__qty{
  display:inline-flex !important; align-items:center !important;
  border:0 !important; border-radius:999px !important; overflow:hidden;
  background:var(--cd-paper);
  box-shadow:0 1px 2px rgba(20,20,15,.08), 0 2px 9px rgba(20,20,15,.05) !important;
}
.cart-item__btn{
  width:32px !important; height:34px !important; border:0 !important; background:transparent !important;
  color:var(--cd-ink) !important; font-size:15px !important; cursor:pointer; line-height:1;
  box-shadow:none !important;
  transition:background .25s, color .25s;
}
.cart-item__btn:hover{ background:var(--cd-ink) !important; color:var(--cd-paper) !important; }
.cart-item__input{
  width:40px !important; height:34px !important; text-align:center !important;
  border:0 !important; background:transparent !important;
  box-shadow:none !important;
  background:transparent !important; color:var(--cd-ink) !important; font-size:13px !important;
  -moz-appearance:textfield;
}
.cart-item__input::-webkit-outer-spin-button,
.cart-item__input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.cart-item__price{
  font-size:14px !important; font-weight:600 !important; color:var(--cd-accent-d) !important;
  font-variant-numeric:tabular-nums;
}
.cart-item__remove{
  position:static !important; flex:none !important;
  width:34px !important; height:34px !important; border:0 !important; border-radius:50% !important;
  background:var(--cd-paper) !important;
  color:var(--cd-ink-2) !important; font-size:17px !important; line-height:1; cursor:pointer;
  display:grid !important; place-items:center !important; padding:0 !important; margin:0 !important;
  box-shadow:0 1px 2px rgba(20,20,15,.08), 0 2px 9px rgba(20,20,15,.05) !important;
  transition:color .25s, box-shadow .25s, transform .2s;
}
.cart-item__remove:hover{
  color:var(--cd-ink) !important; transform:translateY(-1px);
  box-shadow:0 2px 5px rgba(20,20,15,.12), 0 5px 16px rgba(20,20,15,.08) !important;
}

/* Footer */
.cart-drawer__footer,
.cart-drawer__foot{
  padding:22px 26px 26px !important;
  border-top:1px solid var(--cd-line) !important;
  background:transparent !important;
}
.cart-drawer__total{
  display:flex !important; align-items:baseline !important; justify-content:space-between !important;
  background:transparent !important; margin-bottom:18px !important; padding:0 !important;
}
.cart-drawer__total span{
  font-size:11px !important; letter-spacing:0.22em !important; text-transform:uppercase !important;
  color:var(--cd-ink-2) !important;
}
.cart-drawer__total strong{
  font-family:var(--cd-display) !important; font-size:26px !important; font-weight:500 !important;
  color:var(--cd-ink) !important; letter-spacing:-0.01em; white-space:nowrap;
}
.cart-drawer__actions{ display:flex !important; gap:12px !important; }
.cart-drawer__btn{
  flex:1 !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  height:auto !important; padding:15px 18px !important;
  border-radius:0 !important; box-shadow:none !important;
  font-family:var(--cd-sans) !important; font-size:11px !important; font-weight:600 !important;
  letter-spacing:0.18em !important; text-transform:uppercase !important;
  border:1px solid var(--cd-ink) !important;
  background:var(--cd-ink) !important; color:var(--cd-paper) !important;
  transition:background .35s, color .35s, border-color .35s !important;
}
.cart-drawer__btn:hover{
  background:var(--cd-accent) !important; border-color:var(--cd-accent) !important; color:var(--cd-ink) !important;
  transform:none !important; filter:none !important;
}
.cart-drawer__btn--ghost{
  background:transparent !important; color:var(--cd-ink) !important; border:1px solid var(--cd-line) !important;
}
.cart-drawer__btn--ghost:hover{
  background:var(--cd-ink) !important; color:var(--cd-paper) !important; border-color:var(--cd-ink) !important; filter:none !important;
}