/* =====================================================
   HEALIO — slide-out cart drawer

   Desktop shows the panel with a supplies rail attached to its left edge, so
   the add-ons are visible without scrolling past the line items. Below
   1080px the rail folds into a horizontal strip inside the panel, and below
   560px the panel goes full width.
   ===================================================== */

.hc-drawer{position:fixed;inset:0;z-index:1200;display:block}
.hc-drawer[hidden]{display:none !important}
body.hc-locked{overflow:hidden}

.hc-scrim{position:absolute;inset:0;background:rgba(43,10,20,.44);opacity:0;transition:opacity .3s ease}
.hc-drawer.is-open .hc-scrim{opacity:1}

.hc-shell{position:absolute;top:0;right:0;height:100%;display:flex;align-items:stretch;transform:translateX(102%);transition:transform .34s cubic-bezier(.22,.61,.36,1);max-width:100%}
.hc-drawer.is-open .hc-shell{transform:none}
.hc-shell.is-busy{pointer-events:none}
.hc-shell.is-busy .hc-panel{opacity:.72}

/* ---------- Supplies rail ---------- */
.hc-rail{width:184px;flex:0 0 184px;background:linear-gradient(180deg,var(--blush-soft),var(--cream));border-right:1px solid var(--line);padding:22px 14px;overflow-y:auto;overscroll-behavior:contain}
.hc-rail__head{margin:0 0 16px;font-family:var(--font-display);font-size:16px;line-height:1.2;color:var(--wine);text-align:center}
.hc-rail__list{display:flex;flex-direction:column;gap:12px}

/* ---------- Panel ---------- */
.hc-panel{width:424px;flex:0 0 424px;max-width:100vw;background:var(--paper);display:flex;flex-direction:column;box-shadow:-30px 0 60px -30px rgba(43,10,20,.4);transition:opacity .2s ease}

.hc-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 20px 16px;border-bottom:1px solid var(--line)}
.hc-head__title{font-family:var(--font-display);font-size:20px;font-weight:480;line-height:1.1;margin:0;color:var(--wine)}
.hc-head__title span{color:var(--mauve)}
.hc-close{width:34px;height:34px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);background:#fff;border-radius:50%;color:var(--wine);cursor:pointer;transition:border-color .2s ease,color .2s ease,transform .2s ease}
.hc-close svg{width:16px;height:16px}
.hc-close:hover{border-color:var(--rose);color:var(--berry);transform:rotate(90deg)}

/* ---------- Free shipping progress ---------- */
.hc-ship{padding:14px 20px 16px;background:var(--cream);border-bottom:1px solid var(--line)}
.hc-ship__msg{margin:0 0 9px;font-size:13px;line-height:1.4;color:var(--mauve)}
.hc-ship__msg strong{color:var(--berry);font-weight:700}
.hc-ship__track{height:6px;border-radius:999px;background:rgba(43,10,20,.08);overflow:hidden}
.hc-ship__fill{height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,var(--blush),var(--rose));transition:width .45s cubic-bezier(.22,.61,.36,1)}
.hc-ship.is-qualified .hc-ship__fill{background:linear-gradient(90deg,#5bbd8b,#3f9d6b)}
.hc-ship.is-qualified .hc-ship__msg strong{color:#2f7a52}
.hc-ship__scale{display:flex;justify-content:space-between;margin-top:6px;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mauve);opacity:.8}

/* ---------- Body ---------- */
.hc-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 20px 20px}

.hc-items{list-style:none;margin:0;padding:0}
.hc-item{display:flex;align-items:flex-start;gap:12px;padding:16px 0;border-bottom:1px solid var(--line);transition:opacity .2s ease}
.hc-item.is-going{opacity:.4}
.hc-item__media{flex:0 0 60px;width:60px;height:60px;border-radius:12px;overflow:hidden;background:linear-gradient(160deg,var(--blush-soft),#fff);display:block}
.hc-item__media img{width:100%;height:100%;object-fit:cover}
.hc-item__main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:5px}
.hc-item__name{font-size:14.5px;font-weight:600;color:var(--wine);text-decoration:none;line-height:1.3}
.hc-item__name:hover{color:var(--berry)}
.hc-item__variant{align-self:flex-start;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--berry);background:var(--blush-soft);border-radius:999px;padding:3px 9px}
.hc-item__row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:3px}
.hc-item__prices{display:flex;align-items:baseline;gap:7px;white-space:nowrap}
.hc-item__was{font-size:12.5px;color:var(--mauve);text-decoration:line-through;opacity:.8}
.hc-item__now{font-size:15px;font-weight:700;color:var(--wine)}
.hc-item__saved{align-self:flex-start;font-size:11.5px;font-weight:600;color:#2f7a52}
.hc-item__x{flex:0 0 auto;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border:0;background:none;color:var(--mauve);border-radius:50%;cursor:pointer;transition:background .2s ease,color .2s ease}
.hc-item__x svg{width:13px;height:13px}
.hc-item__x:hover{background:var(--blush-soft);color:var(--berry)}

.hc-qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:#fff}
.hc-qty__btn{width:28px;height:28px;border:0;background:none;color:var(--berry);font-size:15px;line-height:1;cursor:pointer;transition:background .2s ease}
.hc-qty__btn:hover{background:var(--blush-soft)}
.hc-qty__n{min-width:26px;text-align:center;font-size:13.5px;font-weight:600;color:var(--wine)}

.hc-empty{text-align:center;padding:52px 10px 40px}
.hc-empty__title{font-family:var(--font-display);font-size:22px;margin:0 0 8px;color:var(--wine)}
.hc-empty__sub{margin:0 0 22px;font-size:13.5px;color:var(--mauve);line-height:1.55}
.hc-empty__cta{display:inline-block;background:var(--rose);color:#fff;text-decoration:none;font-size:13.5px;font-weight:600;border-radius:999px;padding:12px 26px;transition:background .2s ease}
.hc-empty__cta:hover{background:var(--berry)}

/* Upsell strip — the rail's stand-in once the rail no longer fits. */
.hc-strip{display:none;margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.hc-strip__head{margin:0 0 12px;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--berry)}
.hc-strip__list{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.hc-strip__list .hc-up{flex:0 0 138px;scroll-snap-align:start}

/* ---------- Upsell card (used by both rail and strip) ---------- */
.hc-up{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 10px}
.hc-up__media{display:block;width:64px;height:64px;border-radius:10px;overflow:hidden;background:linear-gradient(160deg,var(--blush-soft),#fff)}
.hc-up__media img{width:100%;height:100%;object-fit:cover}
.hc-up__name{font-size:12px;font-weight:600;line-height:1.3;color:var(--wine);text-decoration:none}
.hc-up__name:hover{color:var(--berry)}
.hc-up__dose{display:block;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mauve);margin-top:2px}
.hc-up__price{font-size:12.5px;font-weight:700;color:var(--wine)}
.hc-up__was{font-weight:500;color:var(--mauve);text-decoration:line-through;font-size:11px}
.hc-up__add{width:100%;margin-top:2px;border:1px solid var(--rose);background:#fff;color:var(--berry);border-radius:999px;padding:7px 10px;font-family:var(--font-body);font-size:12px;font-weight:600;cursor:pointer;transition:background .2s ease,color .2s ease,opacity .2s ease}
.hc-up__add:hover{background:var(--rose);color:#fff}
.hc-up__add.is-loading{opacity:.55;pointer-events:none}
.hc-up__add.is-added{background:#3f9d6b;border-color:#3f9d6b;color:#fff;pointer-events:none}

/* ---------- Footer ---------- */
.hc-foot{flex:0 0 auto;border-top:1px solid var(--line);padding:16px 20px 20px;background:var(--paper);box-shadow:0 -18px 30px -26px rgba(43,10,20,.45)}

.hc-coupon{margin:0 0 12px}
.hc-coupon__toggle{list-style:none;cursor:pointer;font-size:12.5px;color:var(--mauve);display:flex;align-items:center;gap:6px}
.hc-coupon__toggle::-webkit-details-marker{display:none}
.hc-coupon__toggle::after{content:"+";margin-left:auto;font-size:15px;color:var(--berry)}
.hc-coupon[open] .hc-coupon__toggle::after{content:"\2212"}
.hc-coupon__row{display:flex;gap:8px;margin-top:10px}
.hc-coupon__input{flex:1 1 auto;min-width:0;border:1px solid var(--line);border-radius:999px;padding:10px 16px;font-family:var(--font-body);font-size:13px;color:var(--wine)}
.hc-coupon__input:focus{outline:none;border-color:var(--rose)}
.hc-coupon__apply{flex:0 0 auto;border:0;background:var(--wine);color:#fff;border-radius:999px;padding:10px 20px;font-family:var(--font-body);font-size:12.5px;font-weight:600;cursor:pointer;transition:background .2s ease}
.hc-coupon__apply:hover{background:var(--berry)}
.hc-coupon__msg{margin:8px 0 0;font-size:12px}
.hc-coupon__msg.is-ok{color:#2f7a52}
.hc-coupon__msg.is-bad{color:var(--berry)}

.hc-saved{margin:0 0 10px;padding:9px 14px;border-radius:12px;background:rgba(63,157,107,.1);color:#2f7a52;font-size:13px;text-align:center}
.hc-saved b{font-weight:700}

.hc-sub{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:14px;color:var(--mauve)}
.hc-sub b{font-size:22px;font-weight:700;color:var(--wine);font-family:var(--font-body)}
.hc-note{margin:2px 0 14px;font-size:11.5px;color:var(--mauve)}

.hc-cta{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;background:var(--rose);color:#fff;text-decoration:none;border-radius:999px;padding:16px 22px;font-size:14.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;transition:background .2s ease,transform .2s ease,box-shadow .2s ease}
.hc-cta svg{width:16px;height:16px}
.hc-cta:hover{background:var(--berry);transform:translateY(-1px);box-shadow:0 16px 28px -18px rgba(142,36,68,.9)}
.hc-view{display:block;text-align:center;margin-top:11px;font-size:12.5px;color:var(--mauve);text-decoration:underline;text-underline-offset:3px}
.hc-view:hover{color:var(--berry)}

.hc-trust{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-family:var(--font-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--mauve)}

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .hc-rail{display:none}
  .hc-strip{display:block}
}
@media (max-width:560px){
  .hc-panel{width:100vw;flex-basis:100vw}
  .hc-head{padding:16px 16px 14px}
  .hc-ship{padding:12px 16px 14px}
  .hc-body{padding:4px 16px 16px}
  .hc-foot{padding:14px 16px calc(16px + env(safe-area-inset-bottom))}
  .hc-head__title{font-size:18px}
  .hc-cta{padding:15px 20px}
}
/* Short viewports: the footer is the first thing that has to give up height,
   so the reassurance row goes before anything the visitor acts on. At 720px
   (a common laptop) the footer was taking more room than the item list. */
@media (max-height:780px){
  .hc-trust{display:none}
  .hc-foot{padding-top:14px}
}
@media (max-height:620px){
  .hc-ship__scale{display:none}
  .hc-coupon{margin-bottom:8px}
}

@media (prefers-reduced-motion:reduce){
  .hc-shell,.hc-scrim,.hc-ship__fill{transition:none}
}

/* Author display rules beat the UA [hidden] rule regardless of specificity, so
   anything JS toggles with .hidden has to opt back out explicitly. */
.hc-strip[hidden],.hc-rail[hidden],.hc-foot[hidden],.hc-ship[hidden],.hc-items[hidden],.hc-empty[hidden]{display:none !important}