/* Cart drawer — parchment against the site's dark ink, like the book's own
 * pages. Loaded by index.html only; tokens come from the page's :root.
 *
 * Differences from the approved mockup, all deliberate and test-pinned:
 *  - the Audiobook is a $9.95 bump (2026-08-16), sold, never bundled free
 *  - order protection defaults ON (Brett, 2026-08-16): a visible toggle with
 *    its $3.95 always shown in the totals, one tap to remove
 *  - the set's anchor is 2 × $56.95 = $113.90, a price genuinely charged, not
 *    the mockup's invented $106.85
 */

.cartd-veil{
  position:fixed;inset:0;background:rgba(5,4,3,.62);backdrop-filter:blur(2px);
  opacity:0;pointer-events:none;transition:opacity .3s ease;z-index:120;
}
body.cartd-open .cartd-veil{opacity:1;pointer-events:auto}
body.cartd-open{overflow:hidden}

.cartd{
  position:fixed;top:0;right:0;bottom:0;width:min(440px,100vw);
  background:var(--cream);color:#171410;
  border-left:1px solid rgba(201,162,39,.5);
  box-shadow:-24px 0 60px rgba(0,0,0,.55);
  transform:translateX(105%);transition:transform .4s cubic-bezier(.22,.9,.3,1);
  z-index:130;display:flex;flex-direction:column;
  font-family:'EB Garamond',Georgia,serif;
}
body.cartd-open .cartd{transform:translateX(0)}

/* ---------- header ---------- */
.cartd-head{padding:10px 20px 7px;border-bottom:1px solid rgba(14,13,11,.14);background:#FBF8F1}
.cartd-head-row{display:flex;align-items:center;justify-content:space-between}
.cartd-brand{font-family:'Inter',sans-serif;font-size:10.5px;letter-spacing:.3em;color:var(--oxblood);text-transform:uppercase;font-weight:600}
.cartd-title{font-family:'Cormorant Garamond',Georgia,serif;font-size:19px;font-weight:600;margin-top:2px}
/* 44px, not 34x33 (2026-08-19): a mis-tap near close is a lost cart. */
.cartd-close{background:none;border:none;font-size:22px;line-height:1;color:#6b5f52;cursor:pointer;width:44px;height:44px;display:flex;align-items:center;justify-content:center;padding:0;margin-right:-8px;transition:color .15s}
.cartd-close:hover{color:var(--oxblood)}

/* ---------- free-shipping progress ---------- */
.cartd-ship{padding:6px 20px 2px}
.cartd-ship-label{font-size:14.5px;color:#6b5f52;text-align:center;margin-bottom:4px}
.cartd-ship-label b{color:var(--oxblood);font-weight:600}
.cartd-track{height:5px;background:rgba(14,13,11,.08);border:1px solid rgba(14,13,11,.12);border-radius:99px;overflow:hidden}
.cartd-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--gold-deep),var(--gold));transition:width .45s ease}

/* ---------- body ---------- */
.cartd-body{flex:1;overflow-y:auto;padding:6px 20px 4px}

.cartd-item{display:flex;gap:12px;padding:6px 0 8px;border-bottom:1px solid rgba(14,13,11,.14)}
.cartd-thumb{width:50px;height:auto;align-self:flex-start;flex:none;border:1px solid rgba(122,46,32,.5);border-radius:2px 5px 5px 2px;box-shadow:3px 4px 10px rgba(14,13,11,.28)}
.cartd-info{flex:1;min-width:0}
.cartd-name{font-family:'Cormorant Garamond',serif;font-size:19px;font-weight:700;line-height:1.2}
.cartd-meta{font-size:15px;color:#6b5f52;margin-top:3px}
.cartd-included{font-family:'Inter',sans-serif;font-size:14.5px;color:var(--oxblood);margin-top:4px;line-height:1.4}
.cartd-item-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:7px}
.cartd-qty{display:inline-flex;align-items:center;border:1px solid rgba(14,13,11,.2);background:#fff}
/* 44px, not 24px (2026-08-19): a mis-tap here is a wrong quantity. */
.cartd-qty button{width:44px;height:44px;background:none;border:none;font-size:19px;color:#171410;cursor:pointer;display:flex;align-items:center;justify-content:center}
.cartd-qty button:disabled{color:#c8bda9;cursor:default}
.cartd-qty span{width:34px;text-align:center;font-size:16.5px;font-family:'Inter',sans-serif}
.cartd-qty-limit{font-family:'Inter',sans-serif;font-size:14px;color:#6b5f52;margin-top:6px;letter-spacing:.03em}
/* Takes the width the stepper leaves and wraps inside it — flex:none let
   the 'free shipping - tax included' line set its own width and hang off the
   edge of the drawer once the type went up (2026-08-19). */
.cartd-price{font-family:'Inter',sans-serif;font-size:17px;font-weight:700;text-align:right;line-height:1.35;flex:1 1 auto;min-width:0}
.cartd-price small{display:block;font-weight:500;font-size:13.5px;color:#6b5f52;line-height:1.35;margin-top:2px}

/* ---------- bumps ---------- */
.cartd-bumps-head{margin:7px 0 2px;text-align:center;position:relative}
.cartd-bumps-head::before,.cartd-bumps-head::after{content:"";position:absolute;top:50%;width:22%;height:1px;background:rgba(14,13,11,.14)}
.cartd-bumps-head::before{left:0}.cartd-bumps-head::after{right:0}
.cartd-bumps-head span{font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-deep);font-weight:600}
.cartd-bumps-sub{text-align:center;font-size:14.5px;color:#6b5f52;margin-bottom:7px}

.cartd-bump{
  display:flex;gap:10px;align-items:flex-start;border:1px solid rgba(14,13,11,.16);
  background:#fff;padding:7px 10px;margin-bottom:6px;cursor:pointer;position:relative;
  transition:border-color .18s,box-shadow .18s,background .18s;
}
.cartd-bump:hover{border-color:var(--gold)}
.cartd-bump.checked{border-color:var(--gold);background:#FDFAF2;box-shadow:0 0 0 1px var(--gold)}
.cartd-bump input{position:absolute;opacity:0;pointer-events:none}
.cartd-check{
  flex:none;width:19px;height:19px;border:1.5px solid #b9ac93;background:#fff;
  display:flex;align-items:center;justify-content:center;transition:all .15s;
}
.cartd-bump.checked .cartd-check{background:var(--oxblood);border-color:var(--oxblood)}
.cartd-check svg{width:11px;height:11px;opacity:0;transition:opacity .15s}
.cartd-bump.checked .cartd-check svg{opacity:1}
/* Left rail: checkbox on top, the artwork under it — unboxed, its own
   shadow does the framing. */
.cartd-bump-left{flex:none;display:flex;flex-direction:column;align-items:center;gap:6px;}
.cartd-bump-thumb{width:38px;height:38px;object-fit:contain;}
.cartd-bump-info{flex:1;min-width:0}
.cartd-tag{
  display:inline-block;font-family:'Inter',sans-serif;font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cream);background:var(--gold-deep);padding:2px 6px;
  margin-bottom:2px;font-weight:600;
}
.cartd-tag.red{background:var(--oxblood)}
.cartd-bump-name{font-family:'Cormorant Garamond',serif;font-size:16.5px;font-weight:700;line-height:1.22}
.cartd-bump-desc{font-size:15px;color:#57493a;line-height:1.45;margin-top:3px}
.cartd-bump-price{flex:none;text-align:right;font-family:'Inter',sans-serif;font-size:16px;font-weight:700;margin-top:2px}
.cartd-bump-price .was{display:block;font-size:12.5px;font-weight:400;color:#6b5f52;text-decoration:line-through}
.cartd-bump-price .save{display:block;font-size:12px;color:var(--oxblood);letter-spacing:.03em;font-weight:600;margin-top:2px}

/* ---------- guarantee ---------- */
.cartd-guarantee{display:flex;gap:10px;align-items:center;background:#EFE7D6;border:1px solid rgba(14,13,11,.14);padding:7px 11px;margin:5px 0 2px}
.cartd-seal{
  flex:none;width:30px;height:30px;border-radius:50%;background:var(--oxblood);color:var(--gold-bright);
  display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;
  font-size:11px;font-weight:700;border:1.5px solid var(--gold);
  box-shadow:0 0 0 2px #EFE7D6,0 0 0 3px var(--gold);
}
.cartd-guarantee-text{font-size:15px;line-height:1.5}
.cartd-guarantee-text b{color:var(--oxblood)}

/* ---------- footer ---------- */
.cartd-foot{border-top:1px solid rgba(14,13,11,.14);padding:6px 20px 8px;background:#FBF8F1;box-shadow:0 -12px 24px rgba(14,13,11,.05)}

.cartd-protect{
  display:flex;align-items:center;gap:9px;padding:6px 10px;margin-bottom:6px;
  background:#EFE7D6;border-top:1px solid var(--gold);border-bottom:1px solid var(--gold);
  cursor:pointer;user-select:none;
}
.cartd-protect input{position:absolute;opacity:0;pointer-events:none}
.cartd-shield{flex:none;width:20px;height:20px;color:#cbbfa8;transition:color .2s}
.cartd-protect.on .cartd-shield{color:var(--gold-deep)}
.cartd-protect-text{flex:1;font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.45;color:#57493a}
.cartd-protect-text b{color:#171410;font-weight:600}
.cartd-protect-text .pp{color:var(--oxblood);margin-left:4px;white-space:nowrap;font-weight:600}
.cartd-switch{flex:none;width:36px;height:20px;border-radius:99px;background:#cbbfa8;position:relative;transition:background .2s}
.cartd-switch .knob{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(14,13,11,.35);transition:left .2s}
.cartd-protect.on .cartd-switch{background:var(--oxblood)}
.cartd-protect.on .cartd-switch .knob{left:18px}

.cartd-row{display:flex;justify-content:space-between;font-family:'Inter',sans-serif;font-size:15.5px;color:#57493a;padding:2.5px 0}
.cartd-row.total{font-family:'Cormorant Garamond',serif;font-size:19px;color:#171410;font-weight:600;padding-top:5px;margin-top:4px;border-top:1px solid rgba(14,13,11,.14)}
.cartd-row .free{color:var(--oxblood);font-weight:600;letter-spacing:.04em}

.cartd-checkout{
  display:block;width:100%;margin-top:6px;text-align:center;text-decoration:none;
  font-family:'Inter',sans-serif;background:var(--gold);color:#1c1509;
  border:1px solid rgba(14,13,11,.35);padding:13px;font-size:15.5px;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;cursor:pointer;
  transition:background .2s,transform .12s;
}
.cartd-checkout:hover{background:var(--gold-soft)}
.cartd-checkout:active{transform:translateY(1px)}
.cartd-trust{display:flex;justify-content:center;gap:14px;margin-top:6px;font-family:'Inter',sans-serif;font-size:11.5px;letter-spacing:.04em;color:#6b5f52}
.cartd-trust span{display:flex;align-items:center;gap:5px}
.cartd-trust svg{width:12px;height:12px;flex:none}

/* Digital edition in the cart: no qty, no bumps (no combined plans exist for
   them), no protection, no shipping — a download carries none of it. */
body.cartd-digital .cartd-qty,
body.cartd-digital .cartd-qty-limit,
body.cartd-digital .cartd-bumps-head,
body.cartd-digital .cartd-bumps-sub,
body.cartd-digital .cartd-bump,
body.cartd-digital .cartd-protect,
body.cartd-digital .cartd-ship,
body.cartd-digital #cartdShipRow{display:none}

/* Three bump cards fit an 812pt phone with the guarantee strip intact once
   the decorative bump tags came off (2026-08-17). Only the trust row still
   yields on short screens — it repeats what the guarantee strip says. */
@media (max-height:860px){.cartd-trust{display:none}}
@media (max-width:480px){.cartd{width:100vw}}

/* ============ instant checkout overlay (2026-08-18) ============
   Pre-booted /checkout rides in a fixed iframe parked off-screen (translated,
   not display:none, so it keeps rendering) and slides over on click. */
/* Parked with opacity, NOT translated off-screen: Chrome throttles rendering
   inside off-viewport iframes, which made the hidden checkout boot in slow
   motion. Invisible-but-in-viewport keeps the boot at full speed (2026-08-18). */
/* Parked state must be INERT, not merely invisible (2026-08-19). While it
   was only opacity:0 + pointer-events:none, this full-viewport iframe still
   sat on top of the page and mobile browsers kept routing touch and scroll
   gestures into it — the page looked normal and answered nothing.
   `visibility:hidden` takes it out of hit-testing and gesture routing on
   every engine; it flips instantly on open and only after the fade on close.
   No `will-change` either: that pinned a permanent full-screen GPU layer for
   a thing that is almost always parked. */
/* `visibility` is deliberately NOT transitioned. Delaying it to let a
   fade-out finish left the overlay computing `visible` after close, i.e.
   still able to eat taps — the precise failure this property is here to
   prevent. It flips synchronously with the class; the open still animates
   via opacity and transform. */
.ckov{
  position:fixed;inset:0;z-index:400;background:#F2E9D8;
  visibility:hidden;opacity:0;pointer-events:none;transform:translateX(4%);
  transition:transform .24s ease,opacity .24s ease;
}
.ckov.on{
  visibility:visible;opacity:1;pointer-events:auto;transform:none;
}
.ckov iframe{width:100%;height:100%;border:0;display:block;position:relative;z-index:1}

/* Parent-owned loading state (2026-08-19). The frame's own loader is inside
   the frame, so until that document loads there was nothing here but the
   cream background — a blank, scroll-locked screen. This covers the frame
   for exactly that gap, then hands off to the frame's own loader. */
.ckov-loading{
  position:absolute;inset:0;z-index:2;display:none;background:#F2E9D8;
  flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:32px;
}
.ckov.booting .ckov-loading{display:flex}
.ckov-mark{
  width:52px;height:52px;border-radius:50%;border:1.5px solid #C9A227;color:#8F6E14;
  display:flex;align-items:center;justify-content:center;
  font-family:'Cormorant Garamond',Georgia,serif;font-size:20px;font-weight:700;
}
.ckov-loading p{font-family:'EB Garamond',Georgia,serif;font-size:17px;color:#57493a;text-align:center}

/* Always reachable, above the frame, and a real 48px target — this is the
   only exit that does not depend on the frame having loaded. */
.ckov-close{
  position:absolute;top:10px;right:10px;z-index:3;
  width:48px;height:48px;border-radius:50%;
  background:rgba(251,248,241,.94);border:1px solid #E0D5BF;color:#57493a;
  font-size:20px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 10px rgba(35,20,10,.14);
}
.ckov-close:hover{color:#7A2E20}
body.ckov-open{overflow:hidden}
