/* ═══════════════════════════════════════════════════════════════
   Just Biryani — On-site ordering (cart, item options, checkout)
   Loaded via a single <link> in index.html — delete that line to remove
   all of this. Uses the site's existing custom properties (--yellow,
   --maroon, --red, --gold, --green, --cream, --ink, --brown-soft, --sans)
   so it always matches the current theme.
═══════════════════════════════════════════════════════════════ */

/* ── floating cart button ── */
.jbcart-fab{position:fixed;z-index:150;right:18px;bottom:18px;display:none;align-items:center;gap:8px;
  background:var(--red);color:var(--cream);border:none;font-family:var(--sans);font-weight:800;
  font-size:13px;letter-spacing:.5px;text-transform:uppercase;padding:13px 19px;border-radius:999px;
  box-shadow:4px 4px 0 var(--maroon);cursor:pointer;transition:transform .15s ease;
  bottom:calc(18px + env(safe-area-inset-bottom,0px));}
.jbcart-fab.show{display:inline-flex;}
.jbcart-fab:active{transform:translate(2px,2px);}
.jbcart-fab__count{background:var(--yellow);color:var(--maroon);border-radius:999px;min-width:22px;height:22px;
  display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;padding:0 6px;}

/* ── menu card foot ──
   The card's own "ORDER \2192" anchor is reused as the on-site trigger. Injecting a
   second button beside it overflowed the flex row on phones and clipped both, so the
   foot now holds exactly two things: a price block and one button. */
.card__foot{gap:12px;flex-wrap:nowrap;align-items:center;}
.card__pricewrap{display:flex;flex-direction:column;gap:3px;min-width:0;}
/* Always its own line, so a card with a stock note and one without still line up. */
.card__from{display:block;font-size:10px;font-weight:800;letter-spacing:1px;line-height:1.1;
  color:var(--brown-soft);text-transform:uppercase;}
.card .card__price{white-space:nowrap;line-height:1.05;}
.card__stock{font-size:10px;font-weight:800;letter-spacing:.06em;line-height:1.2;
  text-transform:uppercase;color:var(--brown-soft);}
.card__stock:empty{display:none;}
.card__stock.is-low{color:var(--red);}
.card .card__order{flex:0 0 auto;white-space:nowrap;cursor:pointer;}
.card .card__order--off{background:rgba(95,26,24,.14);color:rgba(95,26,24,.6);
  box-shadow:none;cursor:not-allowed;}
.card--soldout .card__media img{filter:grayscale(1);opacity:.5;}
.card--added .card__order{background:var(--green);color:#fff;}

/* ── the card turns over to show its options ──
   Sending people to the drawer to pick a spice level pushed them out of the menu, so
   ordering a second item felt like starting again. The options live on the back of the
   card instead. Height is set in JS at flip time because the back is absolutely
   positioned — without it the card would keep the front's height and clip the list. */
.card{display:block;perspective:1600px;transition:transform .45s cubic-bezier(.2,.8,.2,1),
  box-shadow .45s ease,height .5s cubic-bezier(.2,.8,.2,1);}
.card__flip{position:relative;transform-style:preserve-3d;width:100%;
  transition:transform .55s cubic-bezier(.2,.8,.2,1);}
.card__front{display:flex;flex-direction:column;min-height:100%;
  backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.card__back{position:absolute;inset:0;display:flex;flex-direction:column;
  background:var(--cream);transform:rotateY(180deg);
  backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.card.flipped .card__flip{transform:rotateY(180deg);height:100%;}
.card.flipped .card__front{height:100%;}
.card.flipped:hover{transform:none;}
/* one card growing must not stretch its neighbours */
.menu__grid{align-items:start;}
@media (max-width:640px){ .card__front{flex-direction:row;align-items:stretch;} }

.cardopt__head{display:flex;align-items:center;gap:10px;flex:0 0 auto;
  padding:12px 15px;background:var(--maroon);}
.cardopt__title{flex:1;min-width:0;font-family:var(--sans);font-weight:900;font-size:14px;
  letter-spacing:.4px;text-transform:uppercase;color:var(--yellow);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cardopt__x{flex:0 0 auto;width:30px;height:30px;border-radius:50%;cursor:pointer;padding:0;
  background:transparent;border:2px solid rgba(251,245,233,.4);color:var(--cream);
  font-size:13px;line-height:1;}
.cardopt__body{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px 15px 4px;}
.cardopt__body .jbc-group{margin-bottom:15px;}
/* A card is narrower than the drawer, so the group name and its rule stack rather than
   fighting each other for one line. */
.cardopt__body .jbc-group__head{flex-direction:column;align-items:flex-start;gap:2px;margin-bottom:7px;}
.cardopt__body .jbc-group__rule{font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;}
.cardopt__body .jbc-opt{padding:10px 12px;margin-bottom:6px;}
.cardopt__body .jbc-opt__name{font-size:14px;}
.cardopt__body .jbc-flag{font-size:12px;padding:8px 10px;margin-bottom:12px;}
.cardopt__foot{flex:0 0 auto;display:flex;align-items:center;gap:10px;
  padding:11px 15px;border-top:1.5px solid rgba(95,26,24,.15);background:var(--cream);}
.cardopt__foot .jbc-qty{flex:0 0 auto;}
.cardopt__add{flex:1 1 auto;min-width:0;height:42px;border:none;border-radius:999px;
  cursor:pointer;background:var(--red);color:var(--cream);font-family:var(--sans);
  font-size:13px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;
  box-shadow:3px 3px 0 var(--maroon);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cardopt__add:active{transform:translate(1px,1px);}
.cardopt__add[disabled]{background:rgba(95,26,24,.2);color:rgba(95,26,24,.65);
  box-shadow:none;cursor:not-allowed;}
@media (prefers-reduced-motion:reduce){
  .card,.card__flip{transition:none;}
}

/* ── overlay + drawer ── */
.jbc-overlay{position:fixed;inset:0;z-index:300;background:rgba(20,8,7,.55);backdrop-filter:blur(3px);
  display:none;opacity:0;transition:opacity .25s ease;}
.jbc-overlay.open{display:block;}
.jbc-overlay.in{opacity:1;}
.jbc-panel{position:fixed;z-index:301;top:0;right:0;height:100%;height:100dvh;width:min(440px,100vw);
  background:var(--cream);box-shadow:-12px 0 40px rgba(20,8,7,.25);
  transform:translateX(100%);transition:transform .3s cubic-bezier(.2,.8,.2,1);
  display:flex;flex-direction:column;font-family:var(--sans);}
.jbc-panel.open{transform:translateX(0);}
/* Once the slide-in finishes, remove the transform completely. A transformed ancestor
   breaks pointer hit-testing for the cross-origin Square card iframe (field visible but
   unclickable). transition:none is required — otherwise it interpolates to an identity
   matrix, which still counts as a transform. */
.jbc-panel.open.settled{transform:none;transition:none;}

.jbc-head{display:flex;align-items:center;gap:10px;padding:16px var(--pad,20px);
  border-bottom:2px solid var(--maroon);background:var(--maroon);color:var(--cream);flex:0 0 auto;}
.jbc-head h3{flex:1;margin:0;font-weight:900;font-size:17px;text-transform:uppercase;letter-spacing:.5px;
  color:var(--yellow);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.jbc-back,.jbc-close{background:transparent;border:2px solid rgba(251,245,233,.4);color:var(--cream);
  width:34px;height:34px;min-width:34px;border-radius:50%;font-size:15px;line-height:1;cursor:pointer;padding:0;}
.jbc-back{font-size:20px;}
.jbc-back[hidden]{display:none!important;}

.jbc-body{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:18px var(--pad,20px);}
.jbc-foot{flex:0 0 auto;padding:14px var(--pad,20px);border-top:1.5px solid rgba(95,26,24,.15);
  background:var(--cream);padding-bottom:calc(14px + env(safe-area-inset-bottom,0px));}

/* ── item options sheet ── */
.jbc-itemblurb{margin:0 0 16px;font-size:14px;line-height:1.55;font-weight:600;color:var(--brown-soft);}
.jbc-group{margin-bottom:20px;}
.jbc-group__head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:8px;}
.jbc-group__name{font-size:12px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;color:var(--maroon);}
.jbc-group__rule{font-size:11px;font-weight:700;color:var(--brown-soft);}
.jbc-opt{display:flex;align-items:center;gap:11px;padding:12px 14px;margin-bottom:7px;background:#fff;
  border:2px solid rgba(95,26,24,.16);border-radius:13px;cursor:pointer;transition:border-color .15s ease;}
.jbc-opt:hover{border-color:rgba(95,26,24,.4);}
.jbc-opt input{width:19px;height:19px;accent-color:var(--red);margin:0;flex:0 0 auto;cursor:pointer;}
.jbc-opt:has(input:checked){border-color:var(--red);background:#fff8f2;}
.jbc-opt__name{flex:1;font-size:14.5px;font-weight:700;color:var(--ink);}
.jbc-opt__price{font-size:13.5px;font-weight:800;color:var(--maroon);}

.jbc-qtyrow{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;
  font-size:12px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase;color:var(--maroon);}
.jbc-qty{display:inline-flex;align-items:center;gap:4px;background:var(--maroon);border-radius:999px;padding:3px;}
.jbc-qty button{width:32px;height:32px;border:none;background:transparent;color:var(--yellow);
  font-size:17px;font-weight:900;cursor:pointer;border-radius:50%;line-height:1;}
.jbc-qty b{color:var(--cream);font-size:14px;min-width:22px;text-align:center;}
.jbc-qty--sm{padding:2px;}
.jbc-qty--sm button{width:27px;height:27px;font-size:15px;}
.jbc-qty--sm b{font-size:13px;min-width:18px;}
.jbc-qty button[disabled]{opacity:.32;cursor:not-allowed;}

/* ── cart lines ── */
.jbc-line{display:flex;align-items:flex-start;gap:12px;padding:14px 0;border-bottom:1px solid rgba(95,26,24,.12);}
.jbc-line__main{flex:1;min-width:0;}
.jbc-line__name{font-weight:800;color:var(--maroon);font-size:14.5px;}
.jbc-line__opts{font-size:12.5px;color:var(--brown-soft);font-weight:600;margin-top:3px;line-height:1.45;}
.jbc-line.needs-fix{background:rgba(177,18,38,.05);border-left:3px solid var(--red);
  padding-left:11px;margin-left:-14px;}
.jbc-line__fix{margin-top:5px;font-size:12px;font-weight:800;color:var(--red);
  letter-spacing:.02em;line-height:1.35;}
.jbc-line__edit{margin-top:6px;background:none;border:none;padding:0;cursor:pointer;font-family:var(--sans);
  font-size:11.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--red);
  border-bottom:1.5px solid var(--red);}
.jbc-line__right{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex:0 0 auto;}
.jbc-line__sub{font-weight:900;color:var(--ink);font-size:14.5px;}
.jbc-empty{text-align:center;padding:56px 10px;color:var(--brown-soft);font-weight:600;font-size:14px;}
.jbc-empty span{display:block;font-size:38px;margin-bottom:10px;}

/* ── totals bar + buttons ──
   Subtotal / tax / total used to be three stacked rows plus a rule, which on a short
   phone pushed the card field off screen. Uber Eats and DoorDash both collapse this to
   a single line above the CTA and keep the itemised list in a tap-to-open summary. */
.jbc-bar{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px;
  font-size:12px;font-weight:700;color:var(--brown-soft);}
.jbc-bar__l{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.jbc-bar__r{flex:0 0 auto;font-size:11px;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;color:var(--maroon);}
.jbc-bar__r b{margin-left:6px;font-size:19px;font-weight:900;letter-spacing:0;color:var(--ink);}
.jbc-btn{display:block;width:100%;text-align:center;background:var(--red);color:var(--cream);border:none;
  font-family:var(--sans);font-weight:800;font-size:14px;letter-spacing:.5px;text-transform:uppercase;
  padding:15px;border-radius:999px;box-shadow:4px 4px 0 var(--maroon);cursor:pointer;}
.jbc-btn:active{transform:translate(1px,1px);}
.jbc-btn[disabled]{opacity:.55;cursor:not-allowed;box-shadow:2px 2px 0 var(--maroon);}
.jbc-btn--ghost{background:transparent;color:var(--maroon);box-shadow:none;
  border:2px solid var(--maroon);margin-top:9px;}
/* Compact secondary action — a second full-height button made the footer tall enough
   to squeeze the card field off screen on short viewports. */
.jbc-linkbtn{display:block;width:100%;margin-top:10px;background:none;border:none;cursor:pointer;
  font-family:var(--sans);font-size:12.5px;font-weight:800;letter-spacing:1px;text-transform:uppercase;
  color:var(--maroon);padding:6px 4px;text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1.5px;text-decoration-color:rgba(95,26,24,.35);}
.jbc-linkbtn:hover{color:var(--red);}
.jbc-body > .jbc-linkbtn{margin-top:16px;}

/* ── form fields ── */
.jbc-field{margin-bottom:14px;}
.jbc-field label{display:block;font-size:11px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--maroon);margin-bottom:6px;}
.jbc-field input,.jbc-field select{width:100%;box-sizing:border-box;padding:12px 13px;border-radius:12px;
  border:2px solid rgba(95,26,24,.25);background:#fff;color:var(--ink);
  font-family:var(--sans);font-size:16px;font-weight:600;}  /* 16px stops iOS zoom-on-focus */
.jbc-field input:focus,.jbc-field select:focus{outline:none;border-color:var(--maroon);}
.jbc-row2{display:grid;grid-template-columns:1fr 1fr;gap:11px;}
#jbcCardContainer{padding:12px 13px;border-radius:12px;border:2px solid rgba(95,26,24,.25);
  background:#fff;min-height:48px;}
.jbc-note{font-size:12px;color:var(--brown-soft);font-weight:600;line-height:1.5;margin:8px 0 0;}
.jbc-error{background:rgba(177,18,38,.08);border:1.5px solid var(--red);color:var(--red);font-size:13px;
  font-weight:700;padding:11px 13px;border-radius:12px;margin-bottom:13px;display:none;}
.jbc-error.show{display:block;}

/* ── pay row: Apple Pay / Google Pay / Place order, side by side ──
   One line of controls keeps the footer short enough that the card field is never
   pushed off a small phone screen. */
.jbc-cta{display:flex;align-items:stretch;gap:8px;}
.jbc-cta .jbc-btn{flex:1 1 auto;min-width:0;height:48px;padding:0 12px;font-size:13.5px;
  letter-spacing:.3px;display:flex;align-items:center;justify-content:center;
  box-shadow:3px 3px 0 var(--maroon);white-space:nowrap;}
.jbc-wallets{display:flex;flex-direction:row;align-items:stretch;gap:8px;flex:0 0 auto;}
.jbc-wallets:empty{display:none;}
.jbc-wallet-btn{width:92px;height:48px;border-radius:999px;overflow:hidden;}
.jbc-applepay{display:block;width:92px;height:48px;border:none;border-radius:999px;cursor:pointer;
  -webkit-appearance:-apple-pay-button;appearance:-apple-pay-button;
  -apple-pay-button-type:plain;-apple-pay-button-style:black;}
/* Two wallets plus the button is a lot for a narrow phone — tighten the wallet width. */
@media (max-width:400px){
  .jbc-wallet-btn,.jbc-applepay{width:80px;}
  .jbc-cta{gap:6px;}
  .jbc-cta .jbc-btn{font-size:12.5px;padding:0 8px;}
}

/* ── confirmation ── */
.jbc-confirm{text-align:center;padding:18px 4px;}
.jbc-confirm__check{width:62px;height:62px;border-radius:50%;background:var(--green);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:29px;margin:0 auto 16px;}
.jbc-confirm h4{font-size:20px;font-weight:900;color:var(--maroon);margin:0 0 8px;text-transform:uppercase;}
.jbc-confirm p{color:var(--brown-soft);font-weight:600;font-size:14px;margin:0 0 4px;}
.jbc-confirm .code{display:inline-block;margin-top:14px;background:var(--yellow);color:var(--maroon);
  font-weight:900;letter-spacing:1.5px;padding:10px 18px;border-radius:999px;}
.jbc-confirm a{color:var(--maroon);font-weight:800;}

.jbc-spinner{display:inline-block;width:15px;height:15px;border:2.5px solid rgba(251,245,233,.4);
  border-top-color:var(--cream);border-radius:50%;animation:jbc-spin .7s linear infinite;
  vertical-align:-2px;margin-right:8px;}
@keyframes jbc-spin{to{transform:rotate(360deg);}}

/* ── checkout sections ── */
.jbc-sec{margin:0 0 18px;}
.jbc-sec + .jbc-sec{padding-top:16px;border-top:1.5px solid rgba(95,26,24,.12);}
.jbc-sec__t{font-size:11px;font-weight:900;letter-spacing:1.6px;text-transform:uppercase;
  color:var(--maroon);margin-bottom:11px;}
.jbc-addr{margin:4px 0 0;font-size:12px;font-weight:600;color:var(--brown-soft);}
.jbc-zipfield{margin:12px 0 0;max-width:190px;}

/* ── collapsed order summary (tap to expand) ── */
.jbc-summary{border:2px solid rgba(95,26,24,.16);border-radius:14px;background:#fff;overflow:hidden;}
.jbc-summary > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;
  padding:13px 15px;font-size:11px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--maroon);}
.jbc-summary > summary::-webkit-details-marker{display:none;}
.jbc-summary__n{margin-left:auto;font-size:13px;font-weight:800;letter-spacing:0;
  text-transform:none;color:var(--ink);}
.jbc-summary > summary::after{content:"\25BE";font-size:11px;color:var(--maroon);
  transition:transform .2s ease;}
.jbc-summary[open] > summary::after{transform:rotate(180deg);}
.jbc-summary__body{padding:2px 15px 10px;border-top:1px solid rgba(95,26,24,.12);}
.jbc-sumline{display:flex;align-items:flex-start;gap:10px;padding:9px 0;font-size:13px;
  font-weight:700;color:var(--ink);}
.jbc-sumline__q{flex:0 0 auto;min-width:22px;font-weight:900;color:var(--maroon);}
.jbc-sumline__n{flex:1;min-width:0;}
.jbc-sumline__n em{display:block;margin-top:2px;font-style:normal;font-size:11.5px;
  font-weight:600;color:var(--brown-soft);line-height:1.4;}
.jbc-sumline__p{flex:0 0 auto;font-weight:900;}

/* ── stock notices ── */
.jbc-flag{background:rgba(212,160,23,.16);border:1.5px solid rgba(212,160,23,.55);
  color:var(--maroon);font-size:12.5px;font-weight:700;line-height:1.45;
  padding:9px 12px;border-radius:11px;margin:0 0 14px;}
.jbc-capnote{margin:-5px 0 9px;font-size:11.5px;font-weight:700;color:var(--brown-soft);text-align:right;}
.jbc-soldout{text-align:center;padding:44px 10px;}
.jbc-soldout span{display:block;font-size:38px;margin-bottom:12px;}
.jbc-soldout b{display:block;margin-bottom:8px;font-size:17px;font-weight:900;
  text-transform:uppercase;color:var(--maroon);}
.jbc-soldout p{margin:0;font-size:13.5px;font-weight:600;line-height:1.55;color:var(--brown-soft);}

@media (max-width:480px){
  .jbc-panel{width:100vw;}
  .jbc-body{padding:16px 18px;}
  .jbc-foot{padding:12px 18px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));}
}
/* Short viewports: shrink the footer so the card field is never squeezed off screen. */
@media (max-height:700px){
  .jbc-bar{margin-bottom:8px;font-size:11.5px;}
  .jbc-bar__r b{font-size:17px;}
  .jbc-sec{margin-bottom:14px;}
  .jbc-sec + .jbc-sec{padding-top:13px;}
  .jbc-btn{padding:13px;}
  .jbc-field{margin-bottom:11px;}
}

/* ══════════ JB-DRINKS-2026-09-06 — the add-a-drink strip ══════════
   Shown on the cart and the checkout screen. A horizontal scroller so three (or five)
   drinks never push the Pay button below the fold on a small phone. */
.jbc-adds{margin:16px 0 14px;}
.jbc-adds__t{font-size:11px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase;
  color:var(--maroon);margin:0 0 9px;}
.jbc-adds__row{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 6px;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.jbc-adds__row::-webkit-scrollbar{display:none;}
.jbc-add{flex:0 0 auto;min-width:118px;display:flex;flex-direction:column;align-items:flex-start;
  gap:3px;padding:11px 12px;border-radius:14px;cursor:pointer;text-align:left;
  background:#fff;border:2px solid rgba(95,26,24,.16);font-family:var(--sans);
  transition:transform .12s ease,border-color .12s ease;}
.jbc-add:hover{border-color:rgba(95,26,24,.4);}
.jbc-add:active{transform:scale(.97);}
.jbc-add__n{font-size:13px;font-weight:800;color:var(--maroon);line-height:1.25;}
.jbc-add__p{font-size:13px;font-weight:900;color:var(--ink);}
.jbc-add__b{margin-top:3px;font-size:10.5px;font-weight:900;letter-spacing:.8px;
  text-transform:uppercase;color:var(--red);}

/* ══════════ JB-WHEN-2026-09-07 — say when, unmissably ══════════
   A pickup three hours out gets the loud treatment; one twenty minutes away gets the
   quiet one. Same component, two temperatures. */
.jbc-when{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:12px 0 6px;
  padding:11px 13px;border-radius:12px;background:rgba(95,26,24,.06);
  border:1.5px solid rgba(95,26,24,.14);}
.jbc-when__tag{font-size:10px;font-weight:900;letter-spacing:1.3px;text-transform:uppercase;
  color:var(--brown-soft);flex:0 0 100%;}
.jbc-when__main{font-size:15px;font-weight:900;color:var(--maroon);}
.jbc-when__rel{font-size:12.5px;font-weight:700;color:var(--brown-soft);}
.jbc-when.is-far{background:rgba(212,160,23,.18);border-color:rgba(212,160,23,.6);}
.jbc-when.is-far .jbc-when__tag{color:var(--maroon);}
.jbc-when.is-far .jbc-when__rel{color:var(--maroon);}

/* the same fact, riding directly above the pay button */
.jbc-whenbar{font-size:12px;font-weight:800;letter-spacing:.2px;color:var(--brown-soft);
  padding:0 2px 6px;}
.jbc-whenbar:empty{display:none;}
.jbc-whenbar.is-far{color:var(--maroon);}

/* set expectations in the cart, before any card details are typed */
.jbc-hint{margin:14px 0 0;padding:11px 13px;border-radius:12px;font-size:12.5px;
  font-weight:700;line-height:1.5;color:var(--brown-soft);
  background:rgba(95,26,24,.05);border:1.5px solid rgba(95,26,24,.12);}
.jbc-hint b{color:var(--maroon);}
.jbc-hint.is-far{background:rgba(212,160,23,.16);border-color:rgba(212,160,23,.5);color:var(--maroon);}

/* the pickup row: the day label carries a date now, so give it the wider column */
.jbc-sec .jbc-row2.jbc-row2--pickup{grid-template-columns:1.25fr 1fr;}

/* ══════════ JB-NOTE-2026-09-07 — a note for the kitchen ══════════ */
.jbc-notebtn{margin:2px 0 0;}
.jbc-notewrap{margin-top:10px;}
.jbc-notewrap textarea{width:100%;resize:vertical;min-height:74px;font-family:var(--sans);
  font-size:15px;font-weight:600;color:var(--ink);background:#fff;
  border:2px solid rgba(95,26,24,.2);border-radius:12px;padding:10px 12px;line-height:1.45;}
.jbc-notewrap textarea:focus{outline:none;border-color:var(--maroon);}
.jbc-notewrap textarea::placeholder{color:rgba(95,26,24,.42);font-weight:600;}
.jbc-count{margin-top:4px;text-align:right;font-size:11px;font-weight:800;
  letter-spacing:.4px;color:var(--brown-soft);font-variant-numeric:tabular-nums;}
.jbc-donenote{margin-top:10px;font-size:13.5px;line-height:1.5;color:var(--brown-soft);}
.jbc-donenote b{color:var(--maroon);font-weight:800;}

/* ══════════ JB-WALLET-2026-09-07 — the field that needs attention ══════════ */
.jbc-field input.is-bad,.jbc-field select.is-bad,.jbc-notewrap textarea.is-bad{
  border-color:var(--red);box-shadow:0 0 0 3px rgba(177,18,38,.16);}
.jbc-walletnote{margin:12px 0 0;padding:10px 13px;border-radius:12px;font-size:12.5px;
  font-weight:700;line-height:1.5;color:var(--brown-soft);
  background:rgba(95,26,24,.05);border:1.5px solid rgba(95,26,24,.12);}
.jbc-walletnote[hidden]{display:none!important;}