/* OHI — panier (tiroir, barre flottante, toasts). Classes .cart-* / .toast-* uniquement. */

/* ---------- Voile ---------- */
.cart-scrim{position:fixed;inset:0;z-index:120;background:rgba(30,26,32,.34);opacity:0;transition:opacity var(--dur) var(--ease)}
.cart-scrim.is-open{opacity:1}
.cart-scrim[hidden],.cart-drawer[hidden],.cart-bar[hidden]{display:none}

/* ---------- Tiroir (desktop : depuis la gauche = fin de lecture en RTL) ---------- */
.cart-drawer{position:fixed;z-index:121;inset-block:0;inset-inline-end:0;width:min(440px,100%);display:flex;flex-direction:column;
  background:var(--rice);color:var(--ink);font-family:var(--f-body);border-inline-start:1px solid var(--line);box-shadow:var(--shadow-2);
  transform:translateX(-100%);transition:transform .45s var(--ease);outline:none}
.cart-drawer.is-open{transform:none}
[dir="ltr"] .cart-drawer{transform:translateX(100%)}
[dir="ltr"] .cart-drawer.is-open{transform:none}

.cart-head{position:relative;display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-5) var(--sp-5) var(--sp-4);border-bottom:1px solid var(--line)}
.cart-grip{display:none}
.cart-titles{flex:1;min-width:0}
.cart-title{margin:0;font-family:var(--f-display);font-weight:500;font-size:var(--fs-xl);line-height:1.1;color:var(--ink)}
.cart-count{margin:var(--sp-1) 0 0;font-size:var(--fs-sm);color:var(--ink-3)}
.cart-close{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;transition:border-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.cart-close:hover{border-color:var(--plum);color:var(--plum)}
.cart-close:focus-visible,.cart-step:focus-visible,.cart-remove:focus-visible,.cart-sg-add:focus-visible,.cart-cta:focus-visible,.cart-bar:focus-visible{outline:2px solid var(--plum);outline-offset:2px}

.cart-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:var(--sp-4) var(--sp-5) var(--sp-5)}

/* ---------- Progression minimum livraison ---------- */
.cart-progress{margin:0 0 var(--sp-4);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);background:var(--washi)}
.cart-progress[hidden]{display:none}
.cart-progress-text{margin:0 0 var(--sp-2);font-size:var(--fs-sm);color:var(--ink-2)}
.cart-progress-text strong{color:var(--plum);font-weight:600}
.cart-progress-track{height:4px;border-radius:var(--r-pill);background:var(--line);overflow:hidden}
.cart-progress{position:relative}
.cart-progress-track{position:relative}
.cart-progress-fill{display:block;height:100%;width:100%;border-radius:inherit;background:var(--plum);transform:scaleX(0);transform-origin:right center;transition:transform .6s var(--ease),background-color .4s var(--ease)}
[dir="ltr"] .cart-progress-fill{transform-origin:left center}
.cart-progress.is-done .cart-progress-fill{background:var(--wasabi)}
.cart-progress.is-done .cart-progress-text strong{color:var(--nori)}
/* éclat quand le minimum est atteint : halo en anneau + petits traits, au bout de la barre */
.cart-progress::after{content:"";position:absolute;inset-inline-end:var(--sp-4);bottom:calc(var(--sp-3) - 6px);width:16px;height:16px;margin-inline-end:-8px;border-radius:50%;border:1.5px solid var(--wasabi);opacity:0;transform:scale(.3);pointer-events:none}
.cart-progress.is-burst::after{animation:cart-burst .7s var(--ease)}
.cart-progress.is-burst{animation:cart-glow .9s var(--ease)}
.cart-progress.is-burst .cart-progress-text strong{display:inline-block;animation:cart-pop .5s var(--ease)}
@keyframes cart-burst{0%{opacity:.9;transform:scale(.3)}100%{opacity:0;transform:scale(2.6)}}
@keyframes cart-glow{0%,100%{background:var(--washi)}30%{background:rgba(141,163,87,.18)}}

/* ---------- Lignes ---------- */
.cart-lines{list-style:none;margin:0;padding:0}
.cart-line{display:grid;grid-template-columns:64px 1fr;gap:var(--sp-3) var(--sp-4);padding:var(--sp-4) 0;border-bottom:1px solid var(--line)}
.cart-line:first-child{padding-top:var(--sp-2)}
.cart-lines.is-stagger .cart-line{animation:cart-line-in .5s var(--ease) both;animation-delay:calc(120ms + var(--i,0) * 60ms)}
@keyframes cart-line-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.cart-thumb{width:64px;height:64px;border-radius:var(--r-sm);object-fit:cover;background:var(--plum-soft);display:block}
.cart-info{min-width:0}
.cart-name-row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-3)}
.cart-name{margin:0;font-weight:500;font-size:var(--fs-md);line-height:1.3;color:var(--ink)}
.cart-line-total{flex:none;font-weight:600;font-size:var(--fs-sm);color:var(--ink);font-variant-numeric:tabular-nums}
.cart-details{margin:var(--sp-1) 0 0;font-size:var(--fs-xs);line-height:1.5;color:var(--ink-2)}
.cart-note{margin:var(--sp-1) 0 0;font-size:var(--fs-xs);color:var(--ink-3);font-style:italic}
.cart-controls{display:flex;align-items:center;justify-content:space-between;margin-top:var(--sp-3)}
.cart-stepper{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--paper)}
[dir="ltr"] .cart-stepper{flex-direction:row-reverse}
.cart-step{display:grid;place-items:center;width:40px;height:40px;border:0;background:none;color:var(--ink);border-radius:50%;cursor:pointer;transition:color var(--dur) var(--ease),background var(--dur) var(--ease)}
.cart-step:hover{color:var(--plum);background:var(--plum-soft)}
.cart-qty{min-width:1.6em;text-align:center;font-weight:600;font-size:var(--fs-sm);font-variant-numeric:tabular-nums}
.cart-remove{min-height:44px;padding:0 var(--sp-2);border:0;background:none;color:var(--ink-3);font:inherit;font-size:var(--fs-xs);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.cart-remove:hover{color:var(--plum)}

/* ---------- Suggestions ---------- */
.cart-suggest{margin-top:var(--sp-5)}
.cart-suggest[hidden]{display:none}
.cart-suggest-title{margin:0 0 var(--sp-3);font-family:var(--f-display);font-weight:500;font-size:var(--fs-lg);color:var(--ink)}
.cart-suggest-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3)}
.cart-sg{position:relative;display:flex;flex-direction:column;gap:var(--sp-1);padding:var(--sp-2);border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper)}
.cart-sg-img{width:100%;aspect-ratio:1;border-radius:var(--r-sm);object-fit:cover;background:var(--plum-soft);display:block}
.cart-sg-name{margin:0;font-size:var(--fs-xs);line-height:1.3;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}
.cart-sg-price{font-size:var(--fs-xs);color:var(--ink-2);font-variant-numeric:tabular-nums}
.cart-sg-add{position:absolute;top:var(--sp-1);inset-inline-end:var(--sp-1);display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:0;background:var(--plum);color:#fff;cursor:pointer;box-shadow:var(--shadow-1);transition:background var(--dur) var(--ease),transform .15s var(--ease)}
.cart-sg-add::before{content:"";position:absolute;inset:-4px}
.cart-sg-add:hover{background:var(--plum-deep)}
.cart-sg-add:active{transform:scale(.92)}

/* ---------- État vide ---------- */
.cart-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--sp-8) var(--sp-4) var(--sp-6)}
.cart-empty[hidden]{display:none}
.cart-empty-art{width:150px;height:auto;color:var(--ink-3);margin-bottom:var(--sp-5)}
.cart-drawer.is-open.is-empty .cart-empty-art path{stroke-dasharray:1;stroke-dashoffset:1;animation:cart-draw 1.1s var(--ease) .2s forwards}
.cart-drawer.is-open.is-empty .cart-empty-art path:nth-child(2n){animation-delay:.35s}
@keyframes cart-draw{to{stroke-dashoffset:0}}
.cart-empty-title{margin:0;font-family:var(--f-display);font-size:var(--fs-xl);color:var(--ink)}
.cart-empty-text{margin:var(--sp-2) 0 var(--sp-5);color:var(--ink-2);font-size:var(--fs-sm);max-width:26ch}

/* ---------- Pied collant ---------- */
.cart-foot{padding:var(--sp-4) var(--sp-5) calc(var(--sp-4) + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);background:var(--paper)}
.cart-foot[hidden]{display:none}
.cart-sub{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:var(--sp-3);font-size:var(--fs-sm);color:var(--ink-2)}
.cart-sub-value{font-size:var(--fs-lg);color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.cart-cta{display:flex;align-items:center;justify-content:center;gap:var(--sp-2);min-height:52px;padding:0 var(--sp-5);border-radius:var(--r-pill);background:var(--plum);color:#fff;font-weight:600;font-size:var(--fs-md);text-decoration:none;transition:background var(--dur) var(--ease)}
.cart-cta:hover{background:var(--plum-deep)}
.cart-cta-dot{opacity:.6}

/* ---------- Barre flottante ---------- */
.cart-bar{position:fixed;z-index:80;bottom:calc(var(--sp-4) + env(safe-area-inset-bottom,0px));inset-inline:16px;
  display:flex;align-items:center;gap:var(--sp-3);min-height:56px;padding:0 var(--sp-3) 0 var(--sp-5);border:0;border-radius:var(--r-pill);
  background:var(--plum);color:#fff;font-family:var(--f-body);font-size:var(--fs-md);text-align:start;cursor:pointer;box-shadow:var(--shadow-2);
  opacity:0;transform:translateY(130%);transition:transform .45s var(--ease),opacity .3s var(--ease),background var(--dur) var(--ease)}
.cart-bar.is-in{opacity:1;transform:none}
.cart-bar:hover{background:var(--plum-deep)}
.cart-bar-badge{position:relative;overflow:hidden;display:grid;place-items:center;min-width:32px;height:32px;padding:0 var(--sp-2);border-radius:var(--r-pill);background:var(--paper);color:var(--plum);font-weight:700;font-size:var(--fs-sm);font-variant-numeric:tabular-nums}
.cart-roll-num{display:block;transition:transform .4s var(--ease),opacity .3s var(--ease)}
.cart-roll-num.is-out{position:absolute;inset:0;display:grid;place-items:center}
.cart-roll-num.is-from-below,.cart-roll-num.is-to-below{transform:translateY(100%);opacity:0}
.cart-roll-num.is-from-above,.cart-roll-num.is-to-above{transform:translateY(-100%);opacity:0}
.cart-bar-label{font-weight:600}
.cart-bar-items{color:rgba(255,255,255,.75);font-size:var(--fs-sm)}
.cart-bar-items::before{content:"·";margin-inline-end:var(--sp-2)}
.cart-bar-total{margin-inline-start:auto;font-weight:600;font-variant-numeric:tabular-nums}
.cart-bar.is-bump{animation:cart-bump .5s var(--ease)}
.cart-bar.is-bump .cart-bar-badge{animation:cart-pop .5s var(--ease)}
@keyframes cart-bump{0%{transform:none}35%{transform:translateY(-6px)}65%{transform:translateY(1px)}100%{transform:none}}
@keyframes cart-pop{0%,100%{transform:none}40%{transform:scale(1.18)}}
.page-checkout .cart-bar,.page-thanks .cart-bar,.page-admin .cart-bar{display:none}

/* ---------- Toasts ---------- */
.toast-region{position:fixed;z-index:140;inset-inline:16px;bottom:calc(88px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;align-items:center;gap:var(--sp-2);pointer-events:none}
.page-checkout .toast-region,.page-thanks .toast-region,.page-admin .toast-region{bottom:calc(var(--sp-5) + env(safe-area-inset-bottom,0px))}
.toast{display:flex;align-items:center;gap:var(--sp-2);max-width:100%;padding:var(--sp-3) var(--sp-4);border-radius:var(--r-pill);background:var(--paper);color:var(--ink);border:1px solid var(--line);box-shadow:var(--shadow-2);font-family:var(--f-body);font-size:var(--fs-sm);
  opacity:0;transform:translateY(16px) scale(.96);transition:opacity .35s var(--ease),transform .45s var(--ease)}
.toast.is-in{opacity:1;transform:none}
.toast.is-out{opacity:0;transform:translateY(-6px) scale(.98);transition-duration:.3s}
.toast:has(.toast-thumb){padding-inline-start:var(--sp-2)}
.toast-thumb{flex:none;width:30px;height:30px;border-radius:50%;object-fit:cover;background:var(--plum-soft);transform:scale(.6) rotate(-12deg);transition:transform .5s var(--ease) .08s}
.toast.is-in .toast-thumb{transform:none}
.toast-mark{flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--plum-soft);color:var(--plum)}
.toast-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- Mobile : bottom sheet ---------- */
@media (max-width:719px){
  .cart-drawer{top:auto;inset-inline:0;width:100%;max-height:92vh;border-inline-start:0;border-radius:var(--r-lg) var(--r-lg) 0 0;transform:translateY(100%)}
  @supports (height:1dvh){.cart-drawer{max-height:92dvh}}
  .cart-drawer.is-open,[dir="ltr"] .cart-drawer.is-open{transform:none}
  [dir="ltr"] .cart-drawer{transform:translateY(100%)}
[dir="ltr"] .cart-drawer{transform:translateX(100%)}
[dir="ltr"] .cart-drawer.is-open{transform:none}
  .cart-head{padding:var(--sp-5) 16px var(--sp-3)}
  .cart-grip{display:block;position:absolute;top:8px;inset-inline:0;width:40px;height:4px;margin-inline:auto;border-radius:var(--r-pill);background:var(--line)}
  .cart-body{padding:var(--sp-3) 16px var(--sp-5)}
  .cart-foot{padding-inline:16px}
  .cart-drawer.is-empty{min-height:60vh}
  .cart-lines.is-stagger .cart-line{animation-duration:.4s;animation-delay:calc(140ms + var(--i,0) * 40ms)}
}

/* ---------- Desktop : barre discrète ---------- */
@media (min-width:720px){
  .cart-bar{inset-inline-start:auto;inset-inline-end:var(--sp-5);bottom:var(--sp-5);min-height:52px;gap:var(--sp-3);padding-inline:var(--sp-5) var(--sp-3);font-size:var(--fs-sm)}
  .cart-bar-total{margin-inline-start:var(--sp-2)}
  .toast-region{bottom:calc(var(--sp-5) + 68px)}
}

@media (prefers-reduced-motion:reduce){
  .cart-scrim,.cart-drawer,.cart-bar,.toast,.toast-thumb,.cart-progress-fill,.cart-roll-num{transition:none}
  .cart-bar.is-bump,.cart-bar.is-bump .cart-bar-badge,.cart-lines.is-stagger .cart-line,.cart-progress.is-burst,.cart-progress.is-burst::after,.cart-progress.is-burst .cart-progress-text strong{animation:none}
  .cart-drawer.is-open.is-empty .cart-empty-art path{animation:none;stroke-dashoffset:0}
}

/* Toast quand le tiroir est ouvert : en haut, pour ne pas masquer le total */
.cart-drawer.is-open ~ .toast-region{top:calc(var(--sp-4) + env(safe-area-inset-top,0px));bottom:auto}