/* שתייה (סרגל לרוחב, קבלה, סיכום) ותשלום */

/* ----- כפתור "להוסיף שתייה" בקבלה ובפס התחתון ----- */
.drinks-btn{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin:10px 0 0;padding:10px 18px;border-radius:999px;cursor:pointer;font-weight:700;font-size:15px;color:var(--ink);background:var(--paper);box-shadow:inset 0 0 0 2px var(--line)}
.drinks-btn[aria-expanded="true"]{box-shadow:inset 0 0 0 2px var(--green)}
.drinks-btn:focus-visible,.bar-drinks:focus-visible,.ds-close:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
@media (hover:hover){.drinks-btn:hover{box-shadow:inset 0 0 0 2px var(--green)}}
.d-badge{min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--red);color:var(--red-ink);font-size:13px;font-weight:700;display:inline-grid;place-items:center;line-height:1}
.d-badge[hidden]{display:none}
.bar-info{min-width:0;flex:1}
.bar-drinks{all:unset;box-sizing:border-box;position:relative;flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:23px;cursor:pointer;background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--line)}
.bar-drinks .d-badge{position:absolute;top:-4px;inset-inline-end:-4px;min-width:20px;height:20px;font-size:12px}

/* ----- שורות שתייה בקבלה ----- */
.drink-lines{border-bottom:0;margin-top:10px;padding-bottom:0}
.drink-lines li{align-items:center}
.drink-lines .price{gap:8px}
.qty.sm button{width:30px;height:30px;font-size:16px}
.qty.sm .qty-n{min-width:18px;font-size:14px}

/* ----- הסרגל ----- */
.drinks-sheet{position:fixed;inset-inline:0;bottom:0;z-index:40;background:var(--surface);border-top:1px solid var(--line);border-radius:22px 22px 0 0;box-shadow:0 -14px 34px -10px rgba(0,0,0,.35);padding:12px 0 calc(12px + env(safe-area-inset-bottom,0px))}
.drinks-sheet[hidden]{display:none}
.ds-head{display:flex;align-items:center;gap:12px;max-width:1280px;margin:0 auto;padding:0 16px 8px}
.ds-head h2{margin:0;font-family:var(--font-display);font-weight:400;font-size:22px}
.ds-head h2:focus{outline:none}
.ds-sum{flex:1;font-size:14.5px;font-weight:500;color:var(--ink-soft);display:inline-block;transform-origin:right center}
.ds-close{all:unset;box-sizing:border-box;cursor:pointer;padding:9px 20px;border-radius:999px;font-weight:700;font-size:15px;background:var(--green);color:#fff}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .ds-close{color:#16210A}}
:root[data-theme="dark"] .ds-close{color:#16210A}

.drinks-row{list-style:none;margin:0 auto;padding:18px 16px 6px;max-width:1280px;display:flex;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:16px;-webkit-overflow-scrolling:touch}
.drinks-row::-webkit-scrollbar{height:6px}
.drinks-row::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.dk{flex:none;width:114px;scroll-snap-align:start;display:grid;justify-items:center;gap:3px;padding:10px 6px 10px;border-radius:16px;background:var(--bg);border:2px solid transparent;text-align:center;transition:border-color .15s,background .15s}
.dk.on{border-color:var(--green);background:var(--green-soft)}
.dk-pic{--ph:118px;position:relative;width:64px;height:var(--ph);display:grid;place-items:end center}
.dk-svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 5px 4px rgba(0,0,0,.22))}
.dk-photo{max-width:100%;height:calc(var(--ph) * var(--s,1));width:auto;object-fit:contain;filter:drop-shadow(0 5px 4px rgba(0,0,0,.22))}
.dk-badge{position:absolute;top:-10px;inset-inline-end:-14px;background:var(--red);color:var(--red-ink);font-weight:700;font-size:13px;border-radius:999px;padding:1px 8px}
.dk-badge:empty{display:none}
.dk-name{font-size:14px;font-weight:700;line-height:1.2;min-height:2.4em;display:grid;place-items:center}
.dk-price{font-size:12.5px;color:var(--ink-soft);white-space:nowrap}
.dk-qty{margin-top:4px}
.dk-qty button{width:34px;height:34px}
.dk-ghost{position:fixed;z-index:70;pointer-events:none;display:grid;place-items:end center}

/* בסיכום: שורה קומפקטית */
.sum-drinks{min-width:0;margin:4px 0 14px;padding:12px 0 2px;border-top:1.5px dashed var(--line)}
.sum-drinks h3{margin:0;font-size:16px}
.drinks-row.compact{padding:12px 2px 4px;scroll-padding-inline:2px}
.drinks-row.compact .dk{width:104px}
.drinks-row.compact .dk-pic{--ph:92px;width:52px}

/* בזמן שהסרגל פתוח: מקום בתחתית כדי שאפשר יהיה לגלול עד הסוף */
body.drinks-open{padding-bottom:330px}
body.drinks-open .bar{visibility:hidden}

/* ----- תשלום ----- */
.pay{margin:4px 0 0;padding:0;border:0;min-width:0}
.pay legend{font-size:14px;font-weight:500;padding:0;margin-bottom:6px}
.pay-opts{display:grid;gap:8px}
.pay-opt{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);cursor:pointer}
.pay-opt input{position:absolute;opacity:0;pointer-events:none}
.pay-ico{font-size:22px;text-align:center}
.pay-txt b{display:block;font-size:15px}
.pay-txt small{display:block;font-size:12.5px;color:var(--ink-soft)}
.pay-check{width:22px;height:22px;border-radius:50%;border:2px solid var(--line)}
.pay-opt:has(input:checked){border-color:var(--green);background:var(--green-soft)}
.pay-opt:has(input:checked) .pay-check{border:7px solid var(--green)}
.pay-opt:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}
.pay-opt.off{cursor:not-allowed;opacity:.62}
.pay-soon{font-size:12px;font-weight:700;color:var(--ink-soft);border:1px solid var(--line);border-radius:999px;padding:1px 8px}
.pay-secure{display:flex;align-items:center;justify-content:center;gap:6px;margin:8px 0 0;font-size:12.5px;color:var(--ink-soft)}
.pay-err{text-align:center}

@media (prefers-reduced-motion: reduce){.dk,.drinks-btn{transition:none}}
@media (min-width:960px){
  .dk{width:132px}
  .dk-pic{--ph:132px;width:72px}
  body.drinks-open{padding-bottom:350px}
}

/* פס תחתון: מה בהזמנה בשורה קטנה, הסכום מתחת */
.bar-info{display:grid;line-height:1.25}
.bar-count{font-size:13.5px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
