/* shop.css — shared Shopify cart UI for the redesigned pages (index drop + /merch).
   Uses the design tokens each page already defines (--void/--cream/--amber/--navy2/
   --line/--muted/--display). Cart classes are namespaced .ycart* to avoid collisions. */

/* size / variant buttons (live on the cream product cards).
   1px hairline to match the redesign's border discipline (it was 1.5px, which read heavy
   next to the hairline-bordered cards). */
.ysizes{display:flex;flex-wrap:wrap;gap:.45rem;}
.ysize{font-family:var(--display);font-size:.92rem;letter-spacing:.03em;cursor:pointer;min-width:2.5rem;
  text-align:center;padding:.4rem .6rem;border:1px solid rgba(44,54,64,.22);border-radius:999px;
  background:transparent;color:var(--navy2);
  transition:background .18s ease,color .18s ease,border-color .18s ease;}
.ysize:hover{border-color:var(--amber);color:#b9762a;}
.ysize[aria-pressed="true"]{background:var(--navy2);color:var(--cream);border-color:var(--navy2);}
.ysize[disabled]{opacity:.32;cursor:not-allowed;text-decoration:line-through;}
.ysize:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}

/* the pcard media can now hold a real product image */
.pcard__media img,.feature__media img{width:100%;height:100%;object-fit:cover;display:block;}

/* loading + empty states inside a product container */
.yshop-msg{grid-column:1/-1;text-align:center;font-family:var(--display);color:#5a6470;font-size:1.05rem;padding:1.5rem;}
.yshop-msg a{color:var(--navy2);text-underline-offset:3px;}

/* floating cart button (bottom-right FAB, clear of the top bar; shown once cart has items) */
.ycart-btn{position:fixed;right:clamp(1rem,4vw,2rem);bottom:1.3rem;z-index:75;font-family:var(--display);
  font-size:1rem;cursor:pointer;background:var(--navy2);color:var(--cream);border:1px solid rgba(241,239,232,.22);
  border-radius:999px;padding:.7rem 1.2rem;display:flex;align-items:center;gap:.55rem;
  box-shadow:0 10px 30px rgba(0,0,0,.4);opacity:0;pointer-events:none;transform:translateY(10px);
  transition:opacity .3s ease,transform .3s ease,background .2s ease;}
.ycart-btn.show{opacity:1;pointer-events:auto;transform:none;}
.ycart-btn:hover{background:var(--amber);color:var(--void);}
.ycart-btn__n{min-width:1.3rem;height:1.3rem;padding:0 .35rem;border-radius:999px;background:var(--amber);
  color:var(--void);font-size:.8rem;display:grid;place-items:center;font-variant-numeric:tabular-nums;}

/* cart drawer */
.ycart{position:fixed;inset:0;z-index:96;visibility:hidden;}
.ycart.open{visibility:visible;}
.ycart__scrim{position:absolute;inset:0;background:rgba(13,17,23,.55);opacity:0;transition:opacity .3s ease;}
.ycart.open .ycart__scrim{opacity:1;}
.ycart__panel{position:absolute;top:0;right:0;height:100%;width:min(380px,92vw);background:var(--cream);
  color:var(--navy2);display:flex;flex-direction:column;transform:translateX(100%);
  transition:transform .32s cubic-bezier(.4,0,.2,1);box-shadow:-8px 0 30px rgba(13,17,23,.3);}
.ycart.open .ycart__panel{transform:none;}
.ycart__head{display:flex;align-items:center;justify-content:space-between;padding:1.3rem 1.3rem 1rem;
  border-bottom:1px solid rgba(44,54,64,.15);}
.ycart__title{font-family:var(--display);font-size:1.3rem;}
.ycart__close{background:none;border:none;font-family:var(--display);font-size:1.6rem;line-height:1;
  color:var(--navy2);cursor:pointer;padding:.2rem .4rem;}
.ycart__items{flex:1;overflow-y:auto;padding:1rem 1.3rem;display:flex;flex-direction:column;gap:1rem;}
.ycart__empty{color:#5a6470;text-align:center;margin-top:2rem;}
.ylitem{display:flex;gap:.9rem;align-items:center;}
.ylitem img{width:56px;height:56px;object-fit:cover;border-radius:4px;background:#e2ded3;}
.ylitem__info{flex:1;font-size:.95rem;}
.ylitem__sub{color:#6b6e6a;font-size:.85rem;}
.ylitem__qty{display:flex;align-items:center;gap:.5rem;margin-top:.3rem;}
.ylitem__qty button{font-family:var(--display);width:1.7rem;height:1.7rem;cursor:pointer;
  border:1px solid rgba(44,54,64,.3);background:transparent;color:var(--navy2);border-radius:4px;}
.ycart__foot{padding:1.1rem 1.3rem 1.5rem;border-top:1px solid rgba(44,54,64,.15);}
.ycart__total{display:flex;justify-content:space-between;font-family:var(--display);font-size:1.1rem;margin-bottom:1rem;}
.ycart__err{color:#9b3b3b;font-size:.85rem;margin-bottom:.7rem;}
.ycart__go{width:100%;font-family:var(--display);font-size:1.1rem;cursor:pointer;background:var(--navy2);
  color:var(--cream);border:none;border-radius:999px;padding:.85rem;transition:background .2s ease;}
.ycart__go:hover:not(:disabled){background:var(--amber);color:var(--void);}
.ycart__go:disabled{opacity:.5;cursor:not-allowed;}

.ycart-btn:focus-visible,.ycart__close:focus-visible,.ycart__go:focus-visible,
.ylitem__qty button:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}

@media (prefers-reduced-motion:reduce){
  .ycart-btn,.ycart__scrim,.ycart__panel{transition:none!important;}
}