/* Menu card (desktop) and ordering app (mobile). Builds on public.css. */
.sh_h2 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 19px; font-weight: 400; letter-spacing: 0.05em; text-transform: uppercase; margin: 0 0 20px; }
.sh_h3 { font-size: 15px; font-weight: 500; margin: 0 0 8px; padding: 0; }
.sh_note { font-size: 13px; color: #000; margin: 24px 0 0; }
.sh_table { font-size: 13px; margin: -8px 0 20px; }
.sh_wide { width: 100%; }

/* ---------- desktop menu card */
.sh_card .sh_card_lede { max-width: 640px; margin: 0 0 48px; }
.sh_card_cols { display: grid; grid-template-columns: 1fr 1fr; gap: 96px; align-items: start; }
.sh_card_cat { margin: 0 0 56px; }
.sh_card_group { margin: 0 0 28px; }
.sh_card_list { list-style: none; margin: 0; padding: 0; }
.sh_card_item { padding: 10px 0; border-bottom: 1px solid #e5e5e5; }
.sh_card_line { display: flex; align-items: baseline; gap: 12px; font-size: 15px; }
.sh_card_name { flex: 1 1 auto; }
.sh_card_size { flex: 0 0 64px; text-align: left; color: rgba(0,0,0,0.55); font-size: 13px; }
.sh_card_price { flex: 0 0 80px; text-align: right; font-variant-numeric: tabular-nums; }
.sh_card_intro { font-size: 13px; line-height: 1.5; color: rgba(0,0,0,0.6); margin: 4px 0 0; max-width: 52ch; }

/* ---------- mobile app */
.sh_app { padding: 24px 0 40px; }
.sh_tabs { position: sticky; top: 72px; z-index: 5; background: #fff; display: flex; gap: 24px; margin: 0 0 16px; padding: 12px 0; border-bottom: 1px solid #000; }
.sh_tab { background: none; border: 0; padding: 4px 0; font: inherit; font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase; color: #000; cursor: pointer; }
.sh_tab.is_active { text-decoration: underline; }
.sh_group { margin: 20px 0 8px; }
.sh_list { list-style: none; margin: 0; padding: 0; }
.sh_row { display: flex; align-items: center; gap: 12px; border-bottom: 1px solid #e5e5e5; }
.sh_row_main { flex: 1 1 auto; display: flex; flex-direction: column; padding: 14px 0; color: inherit; text-decoration: none; min-width: 0; }
.sh_row_main:hover { text-decoration: none; }
.sh_row_name { font-size: 15px; }
.sh_row_meta { font-size: 13px; color: rgba(0,0,0,0.6); margin-top: 2px; }
.sh_add { flex: 0 0 auto; width: 40px; height: 40px; border: 1px solid #000; background: #000; color: #fff; font-size: 20px; line-height: 1; cursor: pointer; border-radius: 0; }
.sh_add.is_added { background: #fff; color: #000; }

.sh_back { display: inline-block; font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase; margin: 0 0 20px; text-decoration: none; }
.sh_back::before { content: "← "; }
.sh_gallery { display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(-1 * clamp(16px, 4vw, 64px)) 24px; padding: 0 clamp(16px, 4vw, 64px); }
.sh_gallery img { flex: 0 0 100%; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; scroll-snap-align: center; }
.sh_detail_title { margin-bottom: 4px; }
.sh_detail_meta { font-size: 15px; margin: 0 0 20px; }
.sh_detail_intro { font-size: 15px; line-height: 1.6; margin: 0 0 16px; }
.sh_detail_text p { font-size: 15px; line-height: 1.6; margin: 0 0 12px; }
.sh_opt { border: 0; margin: 24px 0 0; padding: 0; }
.sh_choice { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid #e5e5e5; font-size: 15px; }
.sh_choice input { accent-color: #000; width: 18px; height: 18px; margin: 0; }
.sh_info { margin: 24px 0 0; }
.sh_info p { font-size: 14px; line-height: 1.6; margin: 0 0 8px; }
.sh_detail_actions { display: flex; gap: 12px; align-items: stretch; margin: 32px 0 0; }
.sh_add_btn { flex: 1 1 auto; }
.sh_qty { display: flex; align-items: center; border: 1px solid #000; }
.sh_qty button { width: 40px; height: 42px; border: 0; background: #fff; font-size: 18px; cursor: pointer; }
.sh_qty span { min-width: 28px; text-align: center; font-variant-numeric: tabular-nums; }
.sh_qty_small button { width: 32px; height: 32px; }
.sh_qty_small span { min-width: 22px; font-size: 14px; }

/* cart bar */
.sh_cartbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; padding: 20px clamp(16px, 4vw, 64px) calc(20px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #000; }
.sh_cartbar_title { font-size: 15px; letter-spacing: 0.05em; text-transform: uppercase; margin: 0 0 4px; }
.sh_cartbar_meta { font-size: 13px; color: rgba(0,0,0,0.6); margin: 0 0 14px; }
.sh_cartbar_btn { display: flex; width: 100%; height: 52px; }

body.sh_has_bar .pp_footer { padding-bottom: 180px; }

/* checkout + status */
.sh_lines { list-style: none; margin: 0 0 16px; padding: 0; border-top: 1px solid #000; }
.sh_line { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid #e5e5e5; }
.sh_line_main { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.sh_line_price { min-width: 64px; text-align: right; font-variant-numeric: tabular-nums; font-size: 15px; }
.sh_totals { display: grid; grid-template-columns: 1fr auto; gap: 6px 16px; margin: 0 0 32px; font-size: 15px; font-variant-numeric: tabular-nums; }
.sh_totals dt, .sh_totals dd { margin: 0; }
.sh_totals dd { text-align: right; }
.sh_totals .sh_total { font-weight: 700; padding-top: 6px; }
.sh_totals .sh_vat { font-size: 13px; color: rgba(0,0,0,0.6); }
.sh_pay { width: 100%; margin-top: 8px; }
.sh_form .sh_note { margin: -8px 0 16px; }
.sh_steps { list-style: none; margin: 8px 0 32px; padding: 0; counter-reset: s; }
.sh_steps li { position: relative; padding: 10px 0 10px 32px; font-size: 15px; color: rgba(0,0,0,0.4); counter-increment: s; }
.sh_steps li::before { content: counter(s); position: absolute; left: 0; top: 9px; width: 20px; height: 20px; border: 1px solid currentColor; font-size: 11px; display: flex; align-items: center; justify-content: center; }
.sh_steps li.is_done { color: #000; }
.sh_steps li.is_done::before { content: "✓"; }
.sh_steps li.is_current { color: #000; font-weight: 700; }
.sh_steps li.is_current::before { background: #000; color: #fff; border-color: #000; }

@media (min-width: 900px) {
  .sh_app, .sh_cartbar { display: none !important; }
}
@media (max-width: 899px) {
  .sh_card_cols { grid-template-columns: 1fr; gap: 0; }
}

.sh_card_price_label { font-size: 13px; color: rgba(0,0,0,0.6); }

/* a.bella logo rechtsboven, footer regel */
.sh_head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.sh_head .pp_h1 { margin-bottom: 20px; }
.sh_logo { display: inline-block; line-height: 0; margin: 40px 0 0; }
.sh_logo img { width: 53px; height: auto; display: block; }
.sh_logo + .sh_foot { margin-top: 12px; }
.sh_foot a { color: inherit; text-decoration: underline; }
.sh_foot a:hover { text-decoration: none; }

/* product onderdelen (bijv. hot dog toppings) */
.sh_card_incl, .sh_detail_incl { margin: 12px 0 0; }
.sh_card_incl dt, .sh_detail_incl dt { font-size: 13px; font-weight: 500; margin: 8px 0 0; }
.sh_card_incl dd, .sh_detail_incl dd { font-size: 13px; line-height: 1.5; color: rgba(0,0,0,0.6); margin: 2px 0 0; max-width: 52ch; }
.sh_detail_incl { margin: 8px 0 8px; }
.sh_detail_incl dt { font-size: 15px; }
.sh_detail_incl dd { font-size: 14px; }

/* mobiel: categorie koppen in All */
.sh_list_cat { margin: 32px 0 8px; }
.sh_list_cat:first-of-type { margin-top: 16px; }
/* productdetail: foto onder prijs, uitklappers */
.sh_detail .sh_gallery { margin-bottom: 20px; }
.sh_detail .sh_gallery img { aspect-ratio: 4 / 3; }
.sh_faq { margin: 40px 0 0; }
.sh_faq .pp_faq_item summary { font-size: 15px; }
.sh_faq .pp_faq_item p { font-size: 14px; line-height: 1.6; }
.sh_facts { display: grid; grid-template-columns: 90px 1fr; gap: 6px 12px; margin: 12px 0 0; font-size: 14px; }
.sh_facts dt { color: rgba(0,0,0,0.6); }
.sh_facts dd { margin: 0; }
.sh_faq a { color: inherit; text-decoration: underline; }
.sh_faq a:hover { text-decoration: none; }

/* mobiel: binnenkort beschikbaar, zelfde stijl als de cookie melding */
.sh_soon { position: fixed; inset: 0; z-index: 9990; background: rgba(0,0,0,0.05); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); display: flex; align-items: center; justify-content: center; padding: 16px; }
.sh_soon_modal { background: #fff; color: #000; max-width: 520px; width: calc(100% - 32px); padding: 36px; }
.sh_soon_title { margin: 0 0 16px; font-size: 19px; font-weight: 400; line-height: 1.3; text-transform: uppercase; }
.sh_soon_body { font-size: 15px; line-height: 1.5; margin: 0; }
html.sh_soon_open, html.sh_soon_open body { overflow: hidden; }

/* Checkout: same building blocks as the ticket flow */
.sh_checkout .sh_lines { border-top: 1px solid #e5e5e5; }
.sh_checkout .sh_table { margin: -8px 0 16px; }
.sh_ck_totals { margin: 16px 0 0; }
.sh_checkout .sh_note { margin: 0 0 8px; }
.sh_checkout .pp_wiz_actions { margin-top: 32px; }
.sh_checkout .pp_wiz_review_list { grid-template-columns: 1fr auto; }
.sh_checkout .pp_wiz_review_list dd { text-align: right; }
.sh_checkout .pp_wiz_review_list dd { margin-bottom: 0; }
.sh_checkout .pp_wiz_review_list dd.is_sep { border-top: 1px solid #e5e5e5; padding-top: 18px; margin-top: 14px; }
.sh_checkout .pp_wiz_review_list dt.sh_item { font-size: 15px; letter-spacing: 0; text-transform: none; padding-top: 0; }
.sh_checkout .pp_wiz_review_list dt.sh_item.is_sep { padding-top: 18px; margin-top: 14px; }

/* Mobile: only the category tabs stick to the top, the header scrolls away */
@media (max-width: 720px) { .sh_tabs { top: 0; padding: 8px 0; } }