/* 2026-09-29 Frausto's cart: Shopify's standard cart drawer (items, subtotal, checkout), dressed as Frausto's.
   Brand colors only (black, white, tan). CTA rule: no periods, arrows only on hover. */
.fc{--fc-ink:#000;--fc-paper:#fff;--fc-tan:#C9BCAC;--fc-tan-rgb:201 188 172;--fc-ease:cubic-bezier(.16,1,.3,1);--fc-display:"Rye",Georgia,serif;--fc-body:"Libre Franklin",system-ui,sans-serif;position:fixed;inset:0;z-index:1000;visibility:hidden;pointer-events:none;font:400 16px/1.5 var(--fc-body);color:var(--fc-ink)}
.fc.is-open{visibility:visible;pointer-events:auto}
.fc *{box-sizing:border-box}
.fc-scrim{position:absolute;inset:0;background:rgb(0 0 0 / .55);opacity:0;transition:opacity .4s var(--fc-ease)}
.fc.is-open .fc-scrim{opacity:1}
.fc-panel{position:absolute;top:0;right:0;bottom:0;width:min(440px,100%);display:flex;flex-direction:column;background:var(--fc-paper);box-shadow:-18px 0 40px rgb(0 0 0 / .25);transform:translateX(104%);transition:transform .55s var(--fc-ease)}
.fc.is-open .fc-panel{transform:none}

/* head: a black band with a papel picado fringe */
.fc-head{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px 16px 22px;background:var(--fc-ink);color:var(--fc-paper)}
.fc-head::after{content:"";position:absolute;left:0;right:0;top:100%;height:10px;background:radial-gradient(circle at 12px 0,var(--fc-ink) 9px,#0000 9.5px) 0 0/24px 10px repeat-x}
.fc-head h2{margin:0;font:400 1.6rem/1.1 var(--fc-display);display:flex;align-items:center;gap:12px}
.fc-head h2 span{display:inline-grid;place-items:center;min-width:28px;height:28px;padding:0 7px;border-radius:14px;background:var(--fc-tan);color:var(--fc-ink);font:600 .85rem/1 var(--fc-body)}
.fc-head h2 span:empty{display:none}
.fc-x{display:grid;place-items:center;width:46px;height:46px;border:0;border-radius:12px;background:var(--fc-tan);color:var(--fc-ink);cursor:pointer;transition:transform .3s var(--fc-ease)}
.fc-x svg{transition:transform .4s var(--fc-ease)}
@media (hover:hover){.fc-x:hover svg{transform:rotate(90deg)}}
.fc-x:focus-visible,.fc-go:focus-visible,.fc-q button:focus-visible,.fc-rm:focus-visible,.fc-tile button:focus-visible{outline:3px solid var(--fc-tan);outline-offset:2px}

/* body */
.fc-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:30px 22px 22px}
.fc-promo{margin:0 0 18px;padding:12px 14px;border:2px dashed var(--fc-ink);border-radius:12px;background:rgb(var(--fc-tan-rgb) / .3);font-weight:600;text-align:center}
.fc-promo:empty{display:none}
.fc-msg{display:flex;align-items:center;gap:8px;width:max-content;max-width:100%;margin:0 0 16px;padding:8px 14px 8px 10px;border-radius:999px;background:var(--fc-tan);font-size:.88rem;font-weight:600;animation:fc-in .4s var(--fc-ease) both}
.fc-msg::before{content:"";flex:none;width:18px;height:18px;border-radius:50%;background:var(--fc-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat}
.fc-msg:empty{display:none}
.fc-lines{list-style:none;margin:0;padding:0;display:grid;gap:16px}

/* a line: the size card's label frame and tan offset shadow */
.fc-line{position:relative;display:grid;grid-template-columns:84px minmax(0,1fr) auto;gap:14px;align-items:start;padding:14px;border:2px solid var(--fc-ink);border-radius:14px;box-shadow:4px 4px 0 var(--fc-tan);background:var(--fc-paper);animation:fc-in .5s var(--fc-ease) both}
.fc-line::before{content:"";position:absolute;inset:5px;border:1px solid rgb(0 0 0 / .18);border-radius:10px;pointer-events:none}
.fc-line.is-busy{opacity:.55}
.fc-img{width:84px;height:84px;border-radius:10px;background:var(--fc-tan);border:4px solid #fff;box-shadow:0 0 0 1px rgb(0 0 0 / .14),0 6px 12px rgb(0 0 0 / .18);rotate:-3deg;overflow:hidden}
.fc-img img{display:block;width:100%;height:100%;object-fit:contain;padding:6px}
.fc-info{min-width:0;display:grid;gap:2px}
.fc-name{font:400 1.12rem/1.2 var(--fc-display)}
.fc-meta{font-size:.88rem;color:rgb(0 0 0 / .66)}
.fc-low{font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.fc-ctl{display:flex;align-items:center;gap:12px;margin-top:8px}
.fc-q{display:inline-flex;align-items:center;border:2px solid var(--fc-ink);border-radius:10px}
.fc-q button{width:36px;height:38px;border:0;background:none;color:var(--fc-ink);font:600 1.15rem/1 var(--fc-body);cursor:pointer}
.fc-q button:disabled{opacity:.3;cursor:default}
.fc-q output{min-width:2ch;text-align:center;font-weight:600;font-variant-numeric:tabular-nums}
.fc-rm{border:0;background:none;padding:6px 0;color:rgb(0 0 0 / .6);font:600 .78rem/1 var(--fc-body);letter-spacing:.08em;text-transform:uppercase;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.fc-rm:hover{color:var(--fc-ink)}
.fc-price{text-align:right;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.fc-price s{display:block;font-weight:400;font-size:.85rem;color:rgb(0 0 0 / .5)}

/* empty + add another size: tan tile card */
.fc-empty{text-align:center;padding:10px 0 4px}
.fc-empty h3{margin:0 0 6px;font:400 1.4rem/1.2 var(--fc-display)}
.fc-empty p{margin:0 0 18px;color:rgb(0 0 0 / .66)}
.fc-up{margin-top:24px;padding:18px 16px 16px;border-radius:14px;background:var(--fc-tan) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cg fill='none' stroke='%23000' stroke-opacity='.11' stroke-width='1.2'%3E%3Cpath d='M20 8c3 4 3 8 0 12-3-4-3-8 0-12zM20 32c3-4 3-8 0-12-3 4-3 8 0 12zM8 20c4-3 8-3 12 0-4 3-8 3-12 0zM32 20c-4-3-8-3-12 0 4 3 8 3 12 0z'/%3E%3Ccircle cx='20' cy='20' r='2'/%3E%3C/g%3E%3C/svg%3E") 0 0/44px 44px;position:relative}
.fc-up::before{content:"";position:absolute;inset:7px;border:1.5px solid rgb(0 0 0 / .45);border-radius:9px;pointer-events:none}
.fc-up h3{position:relative;margin:0 0 12px;font:400 1.1rem/1.2 var(--fc-display);text-align:center}
.fc-empty .fc-up{margin-top:0}
.fc-tiles{position:relative;display:grid;gap:10px}
.fc-tile{display:flex;align-items:center;gap:12px;padding:10px 10px 10px 12px;border:2px solid var(--fc-ink);border-radius:12px;background:var(--fc-paper);text-align:left}
.fc-tile img{width:44px;height:44px;object-fit:contain;flex:none}
.fc-tile div{flex:1;min-width:0;display:grid}
.fc-tile b{font:400 1rem/1.2 var(--fc-display)}
.fc-tile span{font-size:.84rem;color:rgb(0 0 0 / .66)}
.fc-tile button{flex:none;min-height:42px;padding:0 16px;border:2px solid var(--fc-ink);border-radius:10px;background:var(--fc-ink);color:var(--fc-paper);font:600 .8rem/1 var(--fc-body);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;transition:background-color .25s,color .25s}
@media (hover:hover){.fc-tile button:hover{background:var(--fc-paper);color:var(--fc-ink)}}

/* foot: totals + checkout, always in view */
.fc-foot{position:relative;padding:16px 22px calc(18px + env(safe-area-inset-bottom));border-top:2px solid var(--fc-ink);background:var(--fc-paper)}
.fc-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.fc-save{font-weight:600;margin-bottom:4px}
.fc-save[hidden]{display:none}
.fc-sub span{font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:.85rem}
.fc-sub b{font:400 1.6rem/1 var(--fc-display);font-variant-numeric:tabular-nums}
.fc-note{margin:6px 0 14px;font-size:.84rem;color:rgb(0 0 0 / .62)}
.fc-go{position:relative;display:flex;align-items:center;justify-content:center;gap:0;width:100%;min-height:58px;padding:16px 24px;border:2px solid var(--fc-ink);border-radius:10px;background:var(--fc-ink);color:var(--fc-paper);font:600 1rem/1 var(--fc-body);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background-color .3s var(--fc-ease),color .3s var(--fc-ease),gap .35s var(--fc-ease)}
.fc-go .arr{display:inline-block;width:0;overflow:hidden;opacity:0;transform:translateX(-8px);transition:width .35s var(--fc-ease),opacity .3s var(--fc-ease),transform .35s var(--fc-ease)}
@media (hover:hover){.fc-go:hover{gap:10px}.fc-go:hover .arr{width:1em;opacity:1;transform:none}}
.fc-go:disabled{opacity:.5;cursor:default}
.fc-trust{display:flex;align-items:center;justify-content:center;gap:8px;margin:12px 0 0;font-size:.84rem;color:rgb(0 0 0 / .7)}
.fc-trust svg{flex:none}
.fc.is-empty .fc-foot{display:none}

/* header count bubble + product page Add To Cart */
.fc-badge{position:absolute;top:5px;right:5px;z-index:3;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--ink,#000);color:var(--paper,#fff);font:600 .72rem/1 "Libre Franklin",system-ui,sans-serif;pointer-events:none}
.fc-badge:empty{display:none}
.fc-badge.is-bump{animation:fc-bump .5s var(--fc-ease,ease)}
.pp-cart{position:relative}
.pp-cart .fc-badge{top:2px;right:0;background:var(--tan,#C9BCAC);color:var(--ink,#000)}
.pp-btn.pp-btn--line{background:var(--paper,#fff);color:var(--ink,#000)}
@media (hover:hover){.pp-btn.pp-btn--line:hover{background:var(--ink,#000);color:var(--paper,#fff)}}
.pp-add{width:100%;margin-top:12px}
[data-fc-sold]{opacity:.45;pointer-events:none}
[aria-busy="true"]{cursor:progress}

@keyframes fc-in{from{opacity:0;transform:translateY(12px)}}
@keyframes fc-bump{40%{transform:scale(1.35)}}
@media (max-width:480px){.fc-panel{width:100%}.fc-body{padding-inline:16px}.fc-foot{padding-inline:16px}.fc-line{grid-template-columns:70px minmax(0,1fr) auto;gap:12px}.fc-img{width:70px;height:70px}}
@media (prefers-reduced-motion:reduce){.fc-panel,.fc-scrim,.fc-line,.fc-badge{transition:none!important;animation:none!important}}
