:root{
  --bg:var(--theme-bg,#F3F4F6);
  --black:var(--theme-text,#111111);
  --line:var(--theme-border,#E5E7EB);
  --line2:var(--theme-border,#E7E7E7);
  --muted:var(--theme-muted,#6B7280);
  --muted2:var(--theme-muted,#9CA3AF);
  --soft:var(--surface-alt,#F8F8F8);
  --green:var(--success,#2E7D32);
  --greenSoft:color-mix(in srgb,var(--success,#2E7D32) 10%,white);
  --red:var(--danger,#C62828);
  --redSoft:color-mix(in srgb,var(--danger,#C62828) 9%,white);
  --orange:var(--brand,#FF7A00);
  --amber:var(--warning,#D97706);
  --amberSoft:color-mix(in srgb,var(--warning,#D97706) 9%,white);
}

*{box-sizing:border-box}
html,body{height:100%}
html{background:var(--bg)}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--black);
  background:var(--bg);
  overflow:hidden;
}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}

.material-symbols-rounded{
  font-variation-settings:'FILL' 0,'wght' 500,'GRAD' 0,'opsz' 24;
  line-height:1;
}

.app-shell{
  height:100vh;
  display:flex;
  background:var(--bg);
}

/* LEFT – Windows POS ile aynı yapı */
.category-panel{
  width:210px;
  min-width:210px;
  height:100vh;
  background:var(--black);
  color:#fff;
  display:flex;
  flex-direction:column;
}
.category-head{
  height:82px;
  padding:0 16px;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:21px;
  font-weight:800;
}
.category-head .material-symbols-rounded{font-size:25px}
.category-list{
  flex:1;
  overflow:auto;
  padding:0 10px 14px;
  scrollbar-width:thin;
  scrollbar-color:#444 transparent;
}
.category-button{
  width:100%;
  min-height:51px;
  margin-bottom:7px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.06);
  border-radius:14px;
  background:rgba(255,255,255,.05);
  color:#fff;
  display:flex;
  align-items:center;
  gap:10px;
  text-align:left;
  transition:all 230ms cubic-bezier(.22,.61,.36,1);
}
.category-button:hover{background:rgba(255,255,255,.095)}
.category-button .dot{
  width:6px;height:6px;border-radius:50%;
  background:rgba(255,255,255,.38);
  transition:all 230ms cubic-bezier(.22,.61,.36,1);
}
.category-button .name{
  flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-size:16px;font-weight:600;
}
.category-button .material-symbols-rounded{
  font-size:20px;color:rgba(255,255,255,.38);
  transform:rotate(-18deg);
  transition:all 230ms cubic-bezier(.22,.61,.36,1);
}
.category-button.active{
  background:#fff;
  color:#000;
  border-color:#fff;
  box-shadow:0 5px 14px rgba(0,0,0,.18);
}
.category-button.active .dot{background:#000}
.category-button.active .name{font-weight:800}
.category-button.active .material-symbols-rounded{
  color:#000;transform:rotate(0);
}

/* CENTER */
.product-panel{
  flex:1;
  min-width:0;
  height:100vh;
  display:flex;
  flex-direction:column;
}
.product-toolbar{
  height:82px;
  min-height:82px;
  padding:0 22px;
  display:flex;
  align-items:center;
  gap:16px;
}
.toolbar-title-wrap{flex:1;min-width:0}
.product-toolbar h1{
  margin:0;
  color:var(--black);
  font-size:25px;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  animation:titleIn 250ms ease-out;
}
@keyframes titleIn{
  from{opacity:0;transform:translateX(8px)}
  to{opacity:1;transform:translateX(0)}
}
.toolbar-actions{display:flex;align-items:center;gap:12px}
.search-box{
  width:330px;height:48px;
  display:flex;align-items:center;
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  transition:border-color 150ms ease,box-shadow 150ms ease;
}
.search-box:focus-within{
  border-color:#000;
  box-shadow:0 0 0 .4px #000;
}
.search-box>.material-symbols-rounded{
  margin-left:13px;
  color:var(--muted);
}
.search-box input{
  width:100%;min-width:0;
  border:0;outline:0;background:transparent;
  padding:0 8px 0 10px;
  color:var(--theme-dark,#111111);
}
.search-clear{
  width:42px;height:46px;border:0;background:transparent;
  display:grid;place-items:center;color:#555;
}
.product-count{
  padding:8px 13px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  color:var(--muted);
  font-weight:700;
  white-space:nowrap;
}
.mobile-cart-button{display:none}

.products-scroll{
  flex:1;
  min-height:0;
  overflow:auto;
}
.product-wrap{
  padding:8px 20px 20px;
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  align-items:flex-start;
}
.empty-products{
  width:100%;height:55vh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;color:#777;font-weight:700;font-size:18px;
}
.empty-products .material-symbols-rounded{font-size:54px;color:#aaa}

/* Product card – 4 adet / satır, Windows ile aynı */
.product-card{
  width:calc((100% - 42px)/4);
  position:relative;
  background:#fff;
  border:1px solid var(--line2);
  border-radius:18px;
  box-shadow:0 4px 10px rgba(0,0,0,.055);
  overflow:hidden;
  transition:
    width 260ms cubic-bezier(.22,.61,.36,1),
    border-color 260ms cubic-bezier(.22,.61,.36,1),
    box-shadow 260ms cubic-bezier(.22,.61,.36,1),
    transform 180ms ease;
}
.product-card:hover{
  border-color:var(--black);
  box-shadow:0 4px 10px rgba(0,0,0,.10);
}
.product-card.expanded{
  width:calc(((100% - 42px)/4)*2 + 14px);
  border-color:#000;
  border-width:1.4px;
  box-shadow:0 8px 22px rgba(0,0,0,.12);
}
.product-main{
  min-height:168px;
  padding:16px;
  cursor:pointer;
  user-select:none;
  display:grid;
  grid-template-columns:minmax(0,1fr) 112px;
  gap:14px;
  align-items:stretch;
}
.product-main-info{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.product-main-top{flex:1;min-height:0}
.product-name{
  margin:0;
  font-size:18px;
  line-height:1.12;
  font-weight:900;
  color:var(--black);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.product-description{
  margin-top:8px;
  color:#7B7B7B;
  font-size:13px;
  line-height:1.28;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.product-main-bottom{
  margin-top:16px;
  display:flex;align-items:flex-end;gap:10px;
}
.product-price{
  flex:1;
  font-size:20px;
  font-weight:900;
}
.product-media{
  display:flex;
  align-items:stretch;
}
.product-image-frame{
  position:relative;
  width:100%;
  min-height:118px;
  border:1px solid #ECECEC;
  border-radius:16px;
  overflow:hidden;
  background:linear-gradient(135deg,#FFF4E8 0%,#FFFDF8 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
.product-image,
.product-image-placeholder{
  width:100%;
  height:100%;
  min-height:118px;
  display:block;
}
.product-image{
  object-fit:cover;
  background:#F8F8F8;
}
.product-image-placeholder{
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 30% 20%,rgba(255,255,255,.85),rgba(255,255,255,0) 35%),
    linear-gradient(135deg,#FFE7C7 0%,#FFF8EE 100%);
}
.product-image-emoji{
  font-size:42px;
  filter:drop-shadow(0 6px 12px rgba(0,0,0,.08));
}
.product-add-fab{
  position:absolute;
  right:8px;
  bottom:8px;
  width:34px;height:34px;
  border-radius:999px;
  background:var(--theme-dark,#111111);color:#fff;
  display:grid;place-items:center;
  box-shadow:0 6px 16px rgba(0,0,0,.18);
  transition:transform 180ms ease,background-color 180ms ease;
}
.product-add-fab .material-symbols-rounded{font-size:21px}
.product-card:hover .product-add-fab{background:#000;transform:scale(1.04)}
.product-expand-icon{display:none}
.product-card.expanded .product-expand-icon{transform:none}

/* Inline detail */
.product-inline{
  border-top:1px solid var(--line);
  background:#fff;
  max-height:0;
  opacity:0;
  overflow:hidden;
  transition:max-height 350ms cubic-bezier(.22,.61,.36,1),opacity 180ms ease;
}
.product-card.expanded .product-inline{
  max-height:780px;
  opacity:1;
}
.inline-inner{padding:12px 14px 14px}
.option-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}
.option-tab{
  height:39px;
  border-radius:12px;
  border:1px solid;
  background:#fff;
  font-weight:900;
  display:flex;align-items:center;justify-content:center;gap:6px;
  transition:all 160ms ease;
}
.option-tab .material-symbols-rounded{font-size:18px}
.option-tab.extra{color:#000;border-color:#000}
.option-tab.mit{color:var(--green);border-color:var(--green)}
.option-tab.ohne{color:var(--red);border-color:var(--red)}
.option-tab.extra.active{background:#000;color:#fff}
.option-tab.mit.active{background:var(--green);color:#fff}
.option-tab.ohne.active{background:var(--red);color:#fff}
.option-tab.hidden-tab{display:none}

.option-search{
  margin-top:8px;
  height:38px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  display:flex;align-items:center;
}
.option-search .material-symbols-rounded{font-size:18px;color:var(--muted);margin-left:10px}
.option-search input{
  width:100%;height:100%;
  border:0;outline:0;background:transparent;padding:0 10px;
  font-size:13px;
}

.option-list{
  max-height:160px;
  overflow:auto;
  margin-top:9px;
  padding-right:2px;
}
.option-section-title{
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  margin-bottom:7px;
}
.option-row{
  min-height:42px;
  margin-bottom:7px;
  padding:7px 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#F8F8F8;
  display:flex;align-items:center;gap:8px;
  transition:all 150ms ease;
}
.option-row:hover{border-color:#aaa}
.option-row.selected.mit{
  background:var(--greenSoft);
  border-color:var(--green);
}
.option-row.selected.ohne{
  background:var(--redSoft);
  border-color:var(--red);
}
.option-row.selected.extra{
  background:#F3F4F6;
  border-color:var(--theme-dark,#111111);
}
.option-row .option-name{
  flex:1;min-width:0;font-size:13px;font-weight:800;
}
.option-row .option-price{
  color:#555;font-size:12px;font-weight:900;white-space:nowrap;
}
.check-circle{
  width:22px;
  height:22px;
  border:1.5px solid #9CA3AF;
  border-radius:5px;
  background:#fff;
  display:grid;
  place-items:center;
  flex:none;
  transition:
    background-color 140ms ease,
    border-color 140ms ease,
    transform 140ms ease;
}

/* SINGLE = yuvarlak radio */
.check-circle.radio-look{
  border-radius:50%;
}

/* MULTI + diğer seçimler = köşeli checkbox */
.check-circle.checkbox-look{
  border-radius:5px;
}

.option-row.selected .check-circle{
  background:var(--theme-dark,#111111);
  border-color:var(--theme-dark,#111111);
  color:#fff;
}

.option-row.selected.mit .check-circle{
  background:var(--green);
  border-color:var(--green);
}

.option-row.selected.ohne .check-circle{
  background:var(--red);
  border-color:var(--red);
}

/* SINGLE seçildiğinde tik yerine radio noktası */
.option-row.selected .check-circle.radio-look{
  background:#fff;
  border-color:var(--theme-dark,#111111);
  box-shadow:inset 0 0 0 1px var(--theme-dark,#111111);
}

.option-row.selected.mit .check-circle.radio-look{
  background:#fff;
  border-color:var(--green);
  box-shadow:inset 0 0 0 1px var(--green);
}

.option-row.selected.ohne .check-circle.radio-look{
  background:#fff;
  border-color:var(--red);
  box-shadow:inset 0 0 0 1px var(--red);
}

.radio-dot{
  width:11px;
  height:11px;
  border-radius:50%;
  background:var(--theme-dark,#111111);
}

.option-row.selected.mit .radio-dot{
  background:var(--green);
}

.option-row.selected.ohne .radio-dot{
  background:var(--red);
}

.check-circle .material-symbols-rounded{
  font-size:16px;
  font-weight:800;
}

.quantity-box{
  margin-top:6px;
  padding:4px 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#F7F7F7;
  display:flex;align-items:center;
}
.quantity-box>.label{
  flex:1;font-size:14px;font-weight:900;
}
.icon-qty{
  width:36px;height:36px;border:0;background:transparent;
  display:grid;place-items:center;color:var(--theme-dark,#111111);
}
.icon-qty:disabled{opacity:.3}
.qty-value{
  width:42px;height:30px;
  border:1px solid #D1D5DB;
  border-radius:10px;
  background:#fff;
  display:grid;place-items:center;
  font-size:17px;font-weight:900;
}

.inline-total{
  margin-top:5px;
  width:100%;
  padding:6px 10px;
  background:var(--orange);
  color:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  display:flex;align-items:center;
}
.inline-total span{font-size:14px;font-weight:900}
.inline-total strong{margin-left:auto;font-size:18px;font-weight:900}

.product-note{
  margin-top:6px;
  height:40px;
  border:1px solid #D1D5DB;
  border-radius:12px;
  background:#FFFBEB;
  display:flex;align-items:center;
}
.product-note .material-symbols-rounded{margin-left:10px;color:#555;font-size:20px}
.product-note input{
  width:100%;height:100%;border:0;outline:0;background:transparent;
  padding:0 10px;font-size:13px;
}

.inline-actions{
  margin-top:6px;
  display:grid;grid-template-columns:1fr 2fr;gap:10px;
}
.cancel-inline,.finish-inline{
  height:42px;border-radius:12px;font-weight:900;border:1px solid #D1D5DB;
}
.cancel-inline{background:#fff;color:#000}
.finish-inline{
  background:#000;color:#fff;border-color:#000;
  display:flex;align-items:center;justify-content:center;gap:7px;
}

/* POS bottom action bar görünümünün web uyarlaması */
.web-bottom-bar{
  min-height:69px;
  padding:10px 20px 14px;
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.web-bottom-chip{
  min-height:45px;
  padding:0 10px;
  border:1px solid #D1D5DB;
  border-radius:14px;
  background:#fff;
  display:flex;align-items:center;justify-content:center;gap:8px;
  font-size:12px;font-weight:900;
}
.web-bottom-chip.primary{
  background:#000;color:#fff;border-color:#000;
}
.web-bottom-chip .material-symbols-rounded{font-size:20px}

/* RIGHT CART */
.cart-panel{
  width:370px;
  min-width:370px;
  height:100vh;
  background:#fff;
  border-left:1px solid #eee;
  display:flex;
  flex-direction:column;
}
.cart-head{
  height:72px;
  min-height:72px;
  padding:0 20px;
  background:var(--theme-dark,#111111);
  color:#fff;
  display:flex;align-items:center;
}
.cart-head-title{
  flex:1;
  font-size:22px;
  font-weight:900;
}
.cart-count{
  min-width:35px;
  padding:7px 11px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  text-align:center;
  font-weight:800;
  transition:all 220ms ease;
}
.cart-mobile-close{display:none}

.cart-body{
  flex:1;
  min-height:0;
  overflow:auto;
  padding:14px;
}
.empty-cart{
  height:100%;
  display:flex;align-items:center;justify-content:center;flex-direction:column;
  text-align:center;
}
.empty-cart-icon{
  width:70px;height:70px;border-radius:50%;
  background:#F3F4F6;color:#9CA3AF;
  display:grid;place-items:center;
}
.empty-cart-icon .material-symbols-rounded{font-size:34px}
.empty-cart strong{
  margin-top:14px;
  color:#4B5563;
  font-size:17px;
  font-weight:800;
}
.empty-cart span{
  margin-top:5px;
  color:#9CA3AF;
  font-size:13px;
}

.cart-line{
  padding:12px;
  margin-bottom:9px;
  background:#F8F8F8;
  border:1px solid var(--line2);
  border-radius:15px;
  animation:cartIn 180ms ease-out;
}
@keyframes cartIn{
  from{opacity:0;transform:translateY(4px) scale(.99)}
  to{opacity:1;transform:none}
}
.cart-line-head{
  display:flex;align-items:flex-start;gap:10px;
}
.cart-line-name{
  flex:1;min-width:0;
  font-size:15px;font-weight:800;
}
.cart-line-total{
  white-space:nowrap;font-weight:900;
}
.cart-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.cart-chip{
  padding:4px 8px;border-radius:999px;
  background:#EDEDED;color:#555;
  font-size:11px;font-weight:700;
}
.cart-chip.mit{
  background:var(--greenSoft);color:var(--green);
  border:1px solid #A5D6A7;font-weight:800;
}
.cart-chip.ohne{
  background:var(--redSoft);color:var(--red);
  border:1px solid #EF9A9A;font-weight:800;
}
.cart-note{
  margin-top:7px;padding:7px 9px;
  border:1px solid #FED7AA;
  border-radius:10px;
  background:#FFF7ED;
  color:#9A3412;
  display:flex;gap:6px;
  font-size:11px;font-weight:800;
}
.cart-note .material-symbols-rounded{font-size:16px}
.cart-line-actions{
  margin-top:11px;
  display:flex;align-items:center;
}
.round-cart-button{
  width:34px;height:34px;
  border:0;border-radius:50%;
  background:#000;color:#fff;
  display:grid;place-items:center;
}
.round-cart-button .material-symbols-rounded{font-size:19px}
.cart-qty{
  min-width:42px;text-align:center;font-size:16px;font-weight:900;
  transition:transform 160ms ease;
}
.cart-unit{
  margin-left:auto;
  color:#8A8A8A;
  font-size:11px;font-weight:700;
}
.cart-action-icon{
  width:38px;height:34px;border:0;background:transparent;
  display:grid;place-items:center;color:#000;
}
.cart-action-icon.delete{color:#ff5252}

.cart-bottom{
  padding:8px 14px 10px;
  border-top:1px solid #eee;
  background:#fff;
}
.order-type-row{
  display:grid;grid-template-columns:1fr 1fr;gap:8px;
}
.order-type-button{
  height:38px;
  border:1px solid #E2E2E2;
  border-radius:10px;
  background:#F7F7F7;
  color:#000;
  display:flex;align-items:center;justify-content:center;gap:5px;
  font-size:11px;font-weight:900;
  transition:all 200ms ease;
}
.order-type-button .material-symbols-rounded{font-size:17px}
.order-type-button.active{
  background:var(--theme-dark,#111111);color:#fff;border-color:#000;
}

.requested-time-card{
  width:100%;
  margin-top:4px;
  padding:6px 10px;
  border:1px solid var(--line);
  border-radius:13px;
  background:#F9FAFB;
  color:var(--theme-dark,#111111);
  display:flex;align-items:center;gap:9px;
}
.requested-time-card>.material-symbols-rounded{font-size:16px;color:#374151}
.requested-time-card .time-title{
  flex:1;text-align:left;
  color:var(--muted);
  font-size:11px;font-weight:900;
}
.requested-time-card strong{font-size:13px;font-weight:900}
.requested-time-card .chevron{font-size:20px;color:var(--muted)}

.customer-card{
  width:100%;
  margin-top:5px;
  padding:7px 10px;
  border-radius:14px;
  border:1px solid var(--line);
  background:#F3F4F6;
  display:flex;align-items:center;gap:8px;
  color:var(--theme-dark,#111111);text-align:left;
  transition:all 200ms ease;
}
.customer-card.warning{
  background:#FFF7ED;
  border-color:#F59E0B;
}
.customer-card.warning .customer-main-icon,
.customer-card.warning .customer-text strong{color:#D97706}
.customer-main-icon{font-size:24px}
.customer-text{
  flex:1;min-width:0;display:flex;flex-direction:column;
}
.customer-text strong{font-weight:900}
.customer-text small{
  margin-top:2px;color:var(--muted);font-size:10px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

.order-note-field{
  height:40px;
  margin-top:6px;
  border:1px solid #D1D5DB;
  border-radius:12px;
  background:#FFFBEB;
  display:flex;align-items:center;
}
.order-note-field .material-symbols-rounded{margin-left:10px;font-size:18px;color:#555}
.order-note-field input{
  width:100%;height:100%;border:0;outline:0;background:transparent;padding:0 9px;font-size:12px;
}

.total-row{
  margin-top:7px;
  display:flex;align-items:center;justify-content:space-between;
}
.total-row span{
  color:var(--muted);font-size:15px;font-weight:800;
}
.total-row strong{
  font-size:21px;font-weight:900;
  animation:totalPop 180ms ease;
}
@keyframes totalPop{
  0%{transform:scale(.96)}
  100%{transform:scale(1)}
}

.payment-row{
  margin-top:8px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
}
.payment-button{
  height:42px;
  border:1.2px solid #E2E2E2;
  border-radius:10px;
  background:#F7F7F7;
  color:#000;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1px;
  font-size:10px;font-weight:900;
  transition:all 200ms ease;
}
.payment-button .material-symbols-rounded{font-size:17px}
.payment-button.active{
  background:#000;color:#fff;border-color:#000;
}

.finish-order-button{
  width:100%;height:46px;
  margin-top:7px;
  border:0;border-radius:15px;
  background:#000;color:#fff;
  display:flex;align-items:center;justify-content:center;gap:9px;
  font-size:15px;font-weight:900;letter-spacing:.25px;
}
.finish-order-button:disabled{
  background:#E5E7EB;color:#9CA3AF;cursor:not-allowed;
}
.finish-order-button .material-symbols-rounded{font-size:19px}

/* Dialogs – Flutter AlertDialog görünümü */
.dialog-backdrop{
  position:fixed;inset:0;z-index:100;
  background:rgba(0,0,0,.38);
  display:grid;place-items:center;
  padding:20px;
  animation:fadeIn 140ms ease;
}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.dialog-card{
  width:min(520px,calc(100vw - 30px));
  max-height:92vh;
  overflow:auto;
  background:#fff;
  border-radius:18px;
  box-shadow:0 20px 60px rgba(0,0,0,.22);
  transform-origin:center;
  animation:dialogIn 180ms cubic-bezier(.22,.61,.36,1);
}
@keyframes dialogIn{
  from{opacity:0;transform:scale(.96) translateY(8px)}
  to{opacity:1;transform:none}
}
.dialog-title{
  padding:22px 24px 10px;
  display:flex;align-items:center;gap:10px;
  font-size:20px;font-weight:900;
}
.dialog-content{padding:10px 24px 18px}
.dialog-actions{
  padding:10px 18px 16px;
  display:flex;align-items:center;justify-content:flex-end;gap:8px;
}
.text-button,.filled-dialog-button{
  min-height:40px;
  border-radius:10px;
  padding:0 14px;
  font-weight:900;
}
.text-button{border:0;background:transparent;color:var(--theme-dark,#111111)}
.filled-dialog-button{
  border:0;background:#000;color:#fff;
  display:flex;align-items:center;gap:5px;
}
.sofort-button{
  width:100%;height:54px;
  border:0;border-radius:12px;
  background:#F3F4F6;color:#000;
  display:flex;align-items:center;justify-content:center;gap:8px;
  font-size:16px;font-weight:900;
}
.sofort-button.active{background:#000;color:#fff}
.dialog-section-title{
  margin-top:16px;
  color:var(--muted);
  font-size:12px;font-weight:900;letter-spacing:.5px;
}
.time-grid{
  margin-top:10px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
}
.time-button{
  height:44px;
  border:1px solid #D1D5DB;
  border-radius:12px;
  background:#fff;color:#000;
  font-weight:900;
}
.time-button.active{background:#000;color:#fff;border-color:#000}

.customer-dialog-card{width:min(680px,calc(100vw - 30px))}
.customer-form{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.customer-form label{
  display:flex;flex-direction:column;gap:6px;
  font-size:12px;font-weight:800;
}
.customer-form label.full{grid-column:1/-1}
.customer-form input{
  height:44px;
  border:1px solid #D1D5DB;
  border-radius:12px;
  padding:0 12px;
  outline:0;
}
.customer-form input:focus{border-color:#000;box-shadow:0 0 0 .5px #000}

.success-dialog-card{width:min(430px,calc(100vw - 30px))}
.success-title .material-symbols-rounded{color:#16a34a}
.success-content{display:flex;flex-direction:column}
.success-label{
  margin-top:10px;
  color:var(--muted);
  font-weight:700;
  font-size:13px;
}
.success-order-number{margin-top:4px;font-size:19px;font-weight:900}
.success-value{margin-top:4px;font-size:18px;font-weight:900}
.success-total{margin-top:4px;font-size:22px;font-weight:900}

.toast{
  position:fixed;
  left:50%;bottom:22px;z-index:200;
  transform:translateX(-50%);
  max-width:min(600px,calc(100vw - 30px));
  padding:12px 16px;
  background:var(--theme-dark,#111111);color:#fff;
  border-radius:12px;
  box-shadow:0 8px 30px rgba(0,0,0,.22);
  font-weight:800;
}

/* responsive */
@media(max-width:1350px){
  .product-card{width:calc((100% - 28px)/3)}
  .product-card.expanded{width:calc(((100% - 28px)/3)*2 + 14px)}
  .search-box{width:280px}
}
@media(max-width:1120px){
  body{overflow:auto}
  .app-shell{min-height:100vh;height:auto}
  .category-panel{width:180px;min-width:180px;position:sticky;top:0}
  .cart-panel{
    position:fixed;z-index:70;right:0;top:0;
    transform:translateX(105%);
    box-shadow:-15px 0 40px rgba(0,0,0,.16);
    transition:transform 220ms ease;
  }
  .cart-panel.open{transform:translateX(0)}
  .cart-mobile-close{
    display:grid;place-items:center;
    margin-left:8px;width:34px;height:34px;border:0;border-radius:9px;
    background:rgba(255,255,255,.12);color:#fff;
  }
  .mobile-cart-button{
    display:flex;align-items:center;gap:4px;
    height:42px;padding:0 10px;border:0;border-radius:11px;background:var(--theme-dark,#111111);color:#fff;font-weight:900;
  }
}
@media(max-width:820px){
  .app-shell{display:block}
  .category-panel{
    position:static;
    width:100%;height:auto;min-width:0;
  }
  .category-head{height:62px}
  .category-list{
    display:flex;gap:7px;
    overflow:auto;
    padding:0 10px 10px;
  }
  .category-button{
    width:auto;min-width:max-content;margin:0;
    padding:0 13px;
  }
  .category-button .material-symbols-rounded{display:none}
  .product-panel{height:auto;min-height:calc(100vh - 62px)}
  .product-toolbar{
    height:auto;min-height:82px;
    padding:12px 14px;
    align-items:flex-start;
    flex-direction:column;
  }
  .toolbar-title-wrap{width:100%}
  .toolbar-actions{width:100%}
  .search-box{width:auto;flex:1}
  .product-count{display:none}
  .products-scroll{overflow:visible}
  .product-wrap{padding:8px 12px 100px}
  .product-card{width:calc((100% - 14px)/2)}
  .product-card.expanded{width:100%}
  .web-bottom-bar{display:none}
}
@media(max-width:520px){
  .product-card{width:100%}
  .product-card.expanded{width:100%}
  .customer-form{grid-template-columns:1fr}
  .customer-form label.full{grid-column:auto}
  .time-grid{grid-template-columns:repeat(3,1fr)}
  .cart-panel{width:min(370px,100vw);min-width:0}
}

/* v3: Required / Single / Multi / Variationen */
.option-tabs-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.option-tab.variation{color:#C2410C;border-color:#EA580C}
.option-tab.variation.active{background:#EA580C;color:#fff}
.option-row.selected.variation{
  background:#FFF7ED;
  border-color:#EA580C;
}
.option-row.selected.variation .check-circle{
  background:#EA580C;
  border-color:#EA580C;
}
.radio-look{border-radius:50%}
.required-heading span,.required-star{color:#DC2626;font-weight:900}
.group-option-list{max-height:250px}
.modifier-group-block{
  border:1px solid #E5E7EB;
  border-radius:13px;
  padding:10px;
  margin-bottom:9px;
  background:#fff;
}
.modifier-group-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:flex-start;
  margin-bottom:8px;
}
.modifier-group-title{font-size:13px;font-weight:900;color:var(--theme-dark,#111111)}
.modifier-group-rule{margin-top:2px;font-size:10px;font-weight:700;color:#6B7280}
.modifier-group-counter{
  flex:none;
  padding:4px 7px;
  border:1px solid #E5E7EB;
  border-radius:999px;
  background:#F9FAFB;
  color:#6B7280;
  font-size:10px;
  font-weight:900;
}
.cart-chip.variation{
  background:#FFF7ED;
  color:#9A3412;
  border:1px solid #FDBA74;
  font-weight:800;
}
@media(max-width:620px){
  .option-tabs-4{grid-template-columns:1fr 1fr}
}
.option-tabs-1{grid-template-columns:1fr}
.option-tabs-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.option-tabs-3{grid-template-columns:repeat(3,minmax(0,1fr))}


/* v4: Produkt-Auswahl als Popup */
body.product-modal-open{overflow:hidden}

.product-dialog-backdrop{
  position:fixed;
  inset:0;
  z-index:320;
  padding:22px;
  background:rgba(0,0,0,.48);
  display:grid;
  place-items:center;
  animation:fadeIn 150ms ease;
}

.product-dialog-card{
  width:min(760px,calc(100vw - 32px));
  height:min(88vh,860px);
  background:#fff;
  border-radius:22px;
  box-shadow:0 28px 80px rgba(0,0,0,.30);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  animation:productDialogIn 210ms cubic-bezier(.22,.61,.36,1);
}

@keyframes productDialogIn{
  from{opacity:0;transform:translateY(12px) scale(.965)}
  to{opacity:1;transform:none}
}

.product-dialog-head{
  flex:none;
  padding:20px 22px 16px;
  border-bottom:1px solid #E5E7EB;
  background:#fff;
  display:flex;
  align-items:flex-start;
  gap:16px;
}

.product-dialog-title-wrap{flex:1;min-width:0}
.product-dialog-eyebrow{
  color:#6B7280;
  font-size:10px;
  line-height:1;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.product-dialog-head h2{
  margin:6px 0 0;
  color:var(--theme-dark,#111111);
  font-size:25px;
  line-height:1.12;
  font-weight:900;
}

.product-dialog-description{
  margin-top:7px;
  color:#7B7B7B;
  font-size:13px;
  line-height:1.4;
}

.product-dialog-close{
  width:42px;
  height:42px;
  flex:none;
  border:1px solid #E5E7EB;
  border-radius:13px;
  background:#F9FAFB;
  color:var(--theme-dark,#111111);
  display:grid;
  place-items:center;
  transition:all 160ms ease;
}
.product-dialog-close:hover{
  background:var(--theme-dark,#111111);
  border-color:var(--theme-dark,#111111);
  color:#fff;
}

.product-dialog-body{
  flex:1;
  min-height:0;
  overflow:auto;
  padding:0;
  scroll-behavior:smooth;
  overscroll-behavior:contain;
}

.product-popup-inner{
  padding:16px 20px 22px;
}

.product-dialog-body .group-option-list{
  max-height:none;
  overflow:visible;
}

.product-dialog-body .modifier-group-block{
  scroll-margin:100px 0 120px;
}

.product-dialog-body [data-size-block]{
  scroll-margin:100px 0 120px;
  border:1px solid transparent;
  border-radius:14px;
  padding:1px;
  transition:background-color 180ms ease,border-color 180ms ease,box-shadow 180ms ease;
}

.product-dialog-body .option-list{
  max-height:none;
  overflow:visible;
}

.product-dialog-body .option-tabs{
  position:sticky;
  top:0;
  z-index:4;
  margin:0 -4px 0;
  padding:4px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(6px);
}

.popup-quantity-box{margin-top:13px}
.popup-product-note{margin-top:8px}

.product-dialog-footer{
  flex:none;
  padding:12px 18px 16px;
  border-top:1px solid #E5E7EB;
  background:#fff;
  display:grid;
  grid-template-columns:170px 1fr;
  gap:12px;
  align-items:stretch;
  box-shadow:0 -8px 24px rgba(0,0,0,.04);
}

.product-dialog-total{
  padding:8px 12px;
  border:1px solid #E5E7EB;
  border-radius:14px;
  background:#F7F7F7;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.product-dialog-total span{
  color:#6B7280;
  font-size:10px;
  font-weight:900;
  letter-spacing:.05em;
}
.product-dialog-total strong{
  margin-top:2px;
  color:var(--theme-dark,#111111);
  font-size:20px;
  font-weight:900;
}

.product-dialog-add{
  min-height:56px;
  border:0;
  border-radius:15px;
  background:var(--theme-dark,#111111);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font-size:15px;
  font-weight:900;
  letter-spacing:.2px;
  transition:transform 150ms ease,background-color 150ms ease;
}
.product-dialog-add:hover{background:#000}
.product-dialog-add:active{transform:scale(.988)}
.product-dialog-add .material-symbols-rounded{font-size:21px}

.validation-error{
  border-color:#DC2626!important;
  background:#FEF2F2!important;
  box-shadow:0 0 0 3px rgba(220,38,38,.12)!important;
  animation:validationShake 340ms ease;
}
@keyframes validationShake{
  0%,100%{transform:translateX(0)}
  25%{transform:translateX(-5px)}
  50%{transform:translateX(5px)}
  75%{transform:translateX(-3px)}
}

/* Popup açıldığı için kart artık genişlemez. */
.product-card.expanded{
  width:calc((100% - 42px)/4);
  border-color:var(--theme-dark,#111111);
  border-width:1px;
  box-shadow:0 4px 10px rgba(0,0,0,.10);
}
.product-card.expanded .product-expand-icon{transform:none}

@media(max-width:760px){
  .product-dialog-backdrop{
    padding:0;
    align-items:end;
  }
  .product-dialog-card{
    width:100%;
    height:94vh;
    max-height:none;
    border-radius:22px 22px 0 0;
  }
  .product-dialog-head{
    padding:17px 16px 13px;
  }
  .product-dialog-head h2{font-size:21px}
  .product-popup-inner{padding:14px 14px 20px}
  .product-dialog-footer{
    padding:10px 12px max(12px,env(safe-area-inset-bottom));
    grid-template-columns:130px 1fr;
    gap:8px;
  }
  .product-dialog-total{padding:7px 9px}
  .product-dialog-total strong{font-size:17px}
  .product-dialog-add{
    min-height:54px;
    font-size:13px;
  }
}

@media(max-width:480px){
  .product-dialog-footer{
    grid-template-columns:1fr;
  }
  .product-dialog-total{
    min-height:48px;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
  }
  .product-dialog-total strong{margin:0}
}


/* v5: Required görsel kuralları ve otomatik akış */
.required-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}

.required-section-head .option-section-title{
  margin:0;
}

.modifier-group-status-wrap{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:wrap;
}

.required-status{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:4px 8px;
  border-radius:999px;
  font-size:9px;
  line-height:1;
  font-weight:900;
  letter-spacing:.035em;
  white-space:nowrap;
  border:1px solid transparent;
}

.required-status.pending{
  color:#B91C1C;
  background:#FEF2F2;
  border-color:#FECACA;
}

.required-status.completed{
  color:#047857;
  background:#ECFDF5;
  border-color:#A7F3D0;
}

.required-status.optional{
  color:#6B7280;
  background:#F3F4F6;
  border-color:#E5E7EB;
}

.modifier-group-block.required-complete{
  border-color:#BBF7D0;
  background:#FCFFFD;
}

.required-section.required-complete{
  border-color:#BBF7D0!important;
  background:#FCFFFD!important;
}

.required-next-focus{
  border-color:#16A34A!important;
  box-shadow:0 0 0 3px rgba(22,163,74,.14)!important;
  animation:requiredNextPulse 650ms ease;
}

@keyframes requiredNextPulse{
  0%{transform:scale(.995)}
  50%{transform:scale(1.008)}
  100%{transform:scale(1)}
}

/*
  Görsel kural:
  - Sadece REQUIRED + SINGLE => yuvarlak radio
  - MULTI ve OPTIONAL/SINGLE dahil diğer bütün seçimler => köşeli kare + tik
*/
.check-circle.checkbox-look{
  border-radius:5px!important;
}

.check-circle.radio-look{
  border-radius:50%!important;
}

.option-row.selected .check-circle.checkbox-look{
  color:#fff;
}

.option-row.selected.variation .check-circle.radio-look{
  background:#fff;
  border-color:#EA580C;
  box-shadow:inset 0 0 0 1px #EA580C;
}

.option-row.selected.variation .radio-dot{
  background:#EA580C;
}

@media(max-width:560px){
  .modifier-group-head{
    align-items:flex-start;
  }

  .modifier-group-status-wrap{
    max-width:170px;
  }

  .required-status{
    font-size:8px;
  }
}


/* v11: popup miktar kontrolü + alt orta mobil sepet */
.popup-quantity-box{display:none!important}

.product-dialog-footer{
  grid-template-columns:132px minmax(0,1fr);
  gap:10px;
}
.product-footer-qty{
  min-height:56px;
  border:1px solid #D1D5DB;
  border-radius:15px;
  background:#F7F7F7;
  display:grid;
  grid-template-columns:42px 1fr 42px;
  align-items:center;
  padding:5px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}
.product-footer-qty-button{
  width:42px;height:44px;
  border:0;border-radius:11px;
  background:#fff;color:var(--theme-dark,#111111);
  font-size:25px;font-weight:800;
  line-height:1;
  display:grid;place-items:center;
  box-shadow:0 1px 3px rgba(0,0,0,.08);
  transition:transform 80ms ease,background-color 120ms ease;
  touch-action:manipulation;
}
.product-footer-qty-button:active{transform:scale(.92);background:#ECECEC}
.product-footer-qty-button:disabled{opacity:.28;box-shadow:none}
.product-footer-qty-value{
  min-width:30px;
  text-align:center;
  font-size:19px;
  font-weight:950;
  font-variant-numeric:tabular-nums;
}
.product-dialog-add{
  justify-content:space-between;
  padding:0 16px;
}
.product-dialog-add-main{display:flex;align-items:center;gap:9px;min-width:0}
.product-dialog-add-total{
  margin-left:14px;
  font-size:15px;
  font-weight:950;
  white-space:nowrap;
}

@media(max-width:1120px){
  .mobile-cart-button{
    position:fixed;
    left:50%;right:auto;top:auto;
    bottom:max(18px,env(safe-area-inset-bottom));
    transform:translateX(-50%);
    z-index:68;
    height:52px;
    min-width:210px;
    padding:0 22px;
    justify-content:center;
    gap:9px;
    border-radius:999px;
    box-shadow:0 12px 34px rgba(0,0,0,.24);
    font-size:14px;
    white-space:nowrap;
  }
  .mobile-cart-button .material-symbols-rounded{font-size:22px}
  .mobile-cart-button:active{transform:translateX(-50%) scale(.97)}
}

@media(max-width:480px){
  .product-dialog-footer{
    grid-template-columns:118px minmax(0,1fr)!important;
    gap:8px;
  }
  .product-footer-qty{grid-template-columns:36px 1fr 36px;min-height:54px;padding:4px}
  .product-footer-qty-button{width:36px;height:44px;font-size:23px}
  .product-footer-qty-value{font-size:18px}
  .product-dialog-add{min-height:54px;padding:0 12px;font-size:12px}
  .product-dialog-add-main{gap:6px}
  .product-dialog-add .material-symbols-rounded{font-size:19px}
  .product-dialog-add-total{font-size:12px;margin-left:8px}
}


/* v13: Warenkorb feedback */
.toast.cart-added-toast{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:min(330px,calc(100vw - 30px));
  background:var(--theme-dark,#111111);
  padding:12px 15px;
  border-radius:15px;
  animation:cartToastIn 180ms ease-out;
}
.cart-added-icon{
  color:#4ade80;
  font-size:27px;
  flex:0 0 auto;
}
.cart-added-copy{
  display:flex;
  flex-direction:column;
  line-height:1.2;
}
.cart-added-copy strong{font-size:14px;font-weight:900}
.cart-added-copy small{margin-top:3px;color:#d1d5db;font-size:12px;font-weight:700}
.mobile-cart-button.cart-pop{animation:cartButtonPop 480ms ease}
@keyframes cartToastIn{
  from{opacity:0;transform:translateX(-50%) translateY(10px) scale(.97)}
  to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}
}
@keyframes cartButtonPop{
  0%,100%{transform:translateX(-50%) scale(1)}
  42%{transform:translateX(-50%) scale(1.09)}
}

/* v16 - selections directly on product cards, highlighted in orange */
.product-cart-lines{
  border-top:1px solid #FFB56B;
  background:#FFF0E0;
  padding:10px 11px 11px;
}
.product-cart-lines-title{
  display:flex;
  align-items:center;
  gap:6px;
  margin:0 2px 7px;
  color:var(--brand,#FF7A00);
  font-size:10px;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.product-cart-lines-title .material-symbols-rounded{font-size:16px}
.product-cart-line{
  width:100%;
  border:1px solid #FFC58A;
  background:#FFF9F3;
  border-radius:11px;
  padding:8px 9px;
  margin-top:6px;
  display:flex;
  align-items:center;
  gap:9px;
  text-align:left;
  color:var(--theme-dark,#111111);
  transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease,background .12s ease;
}
.product-cart-line:hover{
  border-color:#FF8A1F;
  box-shadow:0 3px 10px rgba(255,122,0,.18);
}
.product-cart-line:active{transform:scale(.985);background:#FFE0C2}
.product-cart-line-copy{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}
.product-cart-line-copy strong{
  font-size:11.5px;
  line-height:1.3;
  font-weight:850;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.product-cart-line-copy small{font-size:9.5px;color:#8a8a8a;font-weight:700}
.product-cart-line-qty{
  flex:none;
  min-width:34px;
  height:28px;
  padding:0 8px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:var(--brand,#FF7A00);
  color:#fff;
  font-size:12px;
  font-weight:950;
}

/* v21: required UX, card-line delete, mobile sheet polish, organized cart chips */
.required-inline-badge{
  display:inline-flex;
  align-items:center;
  min-height:19px;
  margin-left:6px;
  padding:3px 6px;
  border-radius:999px;
  background:#FFF0E2;
  border:1px solid #FFC48C;
  color:#E96800!important;
  font-size:8px;
  line-height:1;
  font-weight:950;
  letter-spacing:.025em;
  text-transform:none;
  vertical-align:1px;
}
.product-dialog-add.is-incomplete{
  background:#D1D5DB;
  color:#6B7280;
  box-shadow:none;
  cursor:pointer;
}
.product-dialog-add.is-incomplete:hover{background:#C9CDD3;color:#5F6670}
.product-dialog-add.is-incomplete .product-dialog-add-total{color:#6B7280}
.product-dialog-add.is-ready{
  background:var(--theme-dark,#111111);
  color:#fff;
  box-shadow:0 7px 18px rgba(0,0,0,.13);
}
.product-dialog-body{
  scroll-behavior:smooth;
}
.modifier-group-block,.required-section{
  scroll-margin-top:18px;
}
.required-next-focus{
  animation:requiredNextPulseV21 820ms cubic-bezier(.22,.61,.36,1)!important;
}
@keyframes requiredNextPulseV21{
  0%{transform:scale(.985);box-shadow:0 0 0 0 rgba(255,122,0,0)}
  45%{transform:scale(1.008);box-shadow:0 0 0 4px rgba(255,122,0,.15)}
  100%{transform:scale(1);box-shadow:0 0 0 3px rgba(22,163,74,.14)}
}

.product-cart-line{
  position:relative;
  padding-right:7px;
  cursor:pointer;
}
.product-cart-line-remove{
  flex:none;
  width:28px;
  height:28px;
  border:0;
  border-radius:50%;
  background:#FFE2D6;
  color:#D83A00;
  display:grid;
  place-items:center;
  font-size:20px;
  line-height:1;
  font-weight:700;
  transition:transform .12s ease,background .12s ease,color .12s ease;
}
.product-cart-line-remove:hover{background:#FFD1BF;color:#B92D00}
.product-cart-line-remove:active{transform:scale(.9)}

.cart-chip-group{
  margin-top:8px;
  padding-top:7px;
  border-top:1px dashed #E5E7EB;
}
.cart-chip-group:first-of-type{border-top:0;padding-top:0}
.cart-chip-group-label{
  margin-bottom:5px;
  display:flex;
  align-items:center;
  gap:4px;
  color:#737373;
  font-size:9px;
  font-weight:900;
  letter-spacing:.045em;
  text-transform:uppercase;
}
.cart-chip-group-label .material-symbols-rounded{font-size:14px}
.cart-chip.extra{
  background:#FFF4E8;
  color:#A94800;
  border:1px solid #FFC58F;
  font-weight:800;
}

.product-dialog-drag-handle{display:none}

/* Popup opening: slightly stronger scale/fade, still quick */
.product-dialog-card{
  animation:productDialogInV21 230ms cubic-bezier(.22,.61,.36,1);
  transform-origin:center center;
}
@keyframes productDialogInV21{
  from{opacity:0;transform:translateY(18px) scale(.945)}
  72%{opacity:1;transform:translateY(-1px) scale(1.004)}
  to{opacity:1;transform:none}
}

@media(max-width:760px){
  .product-dialog-card{
    position:relative;
    animation:productSheetInV21 260ms cubic-bezier(.22,.61,.36,1);
    transform-origin:center bottom;
  }
  .product-dialog-drag-handle{
    height:18px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    flex:none;
  }
  .product-dialog-drag-handle span{
    width:42px;
    height:4px;
    border-radius:999px;
    background:#D1D5DB;
  }
  .product-dialog-head{padding-top:12px}
  @keyframes productSheetInV21{
    from{opacity:0;transform:translateY(38px) scale(.985)}
    to{opacity:1;transform:none}
  }
}

/* v22 - full UX upgrade */
.product-name-row{display:flex;align-items:flex-start;gap:8px}.product-name-row .product-name{flex:1;min-width:0}
.product-status-badge{flex:none;padding:4px 7px;border-radius:999px;background:#FFF0E0;color:var(--brand,#FF7A00);border:1px solid #FFC58F;font-size:9px;font-weight:950;text-transform:uppercase}
.product-price small{font-size:11px;color:#777;font-weight:850;margin-right:2px}
.cart-head{gap:8px}.cart-head-title{flex:1}.cart-clear-button{width:34px;height:34px;border:0;border-radius:10px;background:#FFF1F0;color:#D93025;display:grid;place-items:center}.cart-clear-button:hover{background:#FFE2DF}.cart-clear-button .material-symbols-rounded{font-size:19px}
.minimum-progress{margin-top:7px;padding:9px 10px;border:1px solid #FFD2A6;border-radius:12px;background:#FFF7ED}.minimum-progress-copy{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#9A4C00;font-size:10px;font-weight:900}.minimum-progress-track{height:6px;margin-top:7px;border-radius:999px;background:#FFE0C2;overflow:hidden}.minimum-progress-track span{display:block;height:100%;width:0;background:var(--brand,#FF7A00);border-radius:inherit;transition:width .28s ease}.minimum-progress.complete{background:#F0FDF4;border-color:#BBF7D0}.minimum-progress.complete .minimum-progress-copy{color:#15803D}.minimum-progress.complete .minimum-progress-track{background:#DCFCE7}.minimum-progress.complete .minimum-progress-track span{background:#22C55E}
.checkout-totals{margin-top:7px;padding:8px 10px;border:1px solid #ECECEC;border-radius:12px;background:#FAFAFA}.checkout-totals>div{display:flex;align-items:center;justify-content:space-between;padding:3px 0;font-size:11px}.checkout-totals span{color:#777}.checkout-totals strong{font-size:12px}
.finish-order-button{position:relative;overflow:hidden}.finish-order-button.loading .material-symbols-rounded{animation:sendSpin .8s linear infinite}.finish-order-button.loading .material-symbols-rounded{font-size:0}.finish-order-button.loading .material-symbols-rounded:after{content:'';display:block;width:17px;height:17px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%}@keyframes sendSpin{to{transform:rotate(360deg)}}
.form-section-title{display:flex;align-items:center;gap:6px;margin-top:3px;padding-top:4px;color:#555;font-size:11px;font-weight:950;letter-spacing:.06em;text-transform:uppercase}.form-section-title .material-symbols-rounded{font-size:17px;color:var(--theme-dark,#111111)}.customer-form .field-error{min-height:13px;color:#D93025;font-size:10px;font-weight:750}.customer-form input.field-invalid{border-color:#EF4444;background:#FEF2F2;box-shadow:0 0 0 2px rgba(239,68,68,.08)}.customer-form input.field-valid{border-color:#22C55E;background:#F7FFF9}
.success-dialog-card{overflow:hidden}.success-title{justify-content:center;padding-top:24px}.success-title>.material-symbols-rounded{display:none}.success-content{text-align:center;align-items:center}.success-hero-icon{width:70px;height:70px;border-radius:50%;background:#ECFDF3;color:#16A34A;display:grid;place-items:center;margin:2px auto 10px}.success-hero-icon .material-symbols-rounded{font-size:42px}.success-message{max-width:330px;color:#666;font-size:13px;line-height:1.45;margin-bottom:8px}.success-actions{justify-content:center;padding:8px 24px 24px}.success-actions .filled-dialog-button{width:100%;justify-content:center;min-height:46px}
@media(max-width:760px){.category-button.active{scroll-margin-inline:35vw}.cart-clear-button{display:grid}.customer-form{grid-template-columns:1fr}.customer-form label.full,.form-section-title.full{grid-column:auto}.product-main{grid-template-columns:minmax(0,1fr) 96px;gap:12px;min-height:156px}.product-image-frame,.product-image,.product-image-placeholder{min-height:102px}.product-image-emoji{font-size:36px}.product-main-bottom{margin-top:14px}}


/* v28 - mobile product sheet: drag down to dismiss */
@media(max-width:760px){
  .product-dialog-drag-handle,
  .product-dialog-head{
    touch-action:none;
  }
  .product-dialog-drag-handle{
    height:26px;
    cursor:grab;
  }
  .product-dialog-drag-handle span{
    width:46px;
    height:5px;
    background:#C9CDD3;
  }
  .product-dialog-card.is-dragging{
    animation:none!important;
    transform:translateY(var(--sheet-drag-y,0px))!important;
    opacity:var(--sheet-drag-opacity,1);
    transition:none!important;
    will-change:transform,opacity;
  }
  .product-dialog-card.is-snap-back{
    animation:none!important;
    transform:translateY(0)!important;
    opacity:1!important;
    transition:transform 250ms cubic-bezier(.22,.61,.36,1),opacity 220ms ease!important;
  }
  .product-dialog-card.is-swipe-closing{
    animation:none!important;
    transform:translateY(110vh)!important;
    opacity:.15!important;
    transition:transform 235ms cubic-bezier(.4,0,.9,.35),opacity 190ms ease!important;
  }
}

/* v29 - mobile food list image layout inspired by modern delivery apps */
@media(max-width:760px){
  .product-wrap{
    display:block;
    padding:0 14px 105px;
  }

  .product-card,
  .product-card.expanded{
    width:100%;
    margin:0;
    border:0;
    border-bottom:1px solid #ECECEC;
    border-radius:0;
    box-shadow:none;
    overflow:visible;
    background:#fff;
  }

  .product-card:hover{
    border-color:#ECECEC;
    box-shadow:none;
  }

  .product-main{
    min-height:164px;
    padding:18px 10px 18px 2px;
    grid-template-columns:minmax(0,1fr) 124px;
    gap:16px;
    align-items:center;
  }

  .product-main-info{
    min-height:128px;
    justify-content:flex-start;
  }

  .product-main-top{flex:0 1 auto}

  .product-name-row{
    align-items:flex-start;
  }

  .product-name{
    font-size:17px;
    line-height:1.18;
    -webkit-line-clamp:2;
  }

  .product-description{
    margin-top:8px;
    font-size:13px;
    line-height:1.34;
    color:#777;
    -webkit-line-clamp:3;
  }

  .product-main-bottom{
    margin-top:15px;
  }

  .product-price{
    font-size:18px;
    line-height:1;
    font-weight:950;
  }

  .product-price small{
    font-size:10px;
  }

  .product-media{
    width:124px;
    height:124px;
    align-self:center;
    overflow:visible;
  }

  .product-image-frame{
    width:124px;
    height:124px;
    min-height:124px;
    border:1px solid #E5E5E5;
    border-radius:15px;
    overflow:visible;
    background:transparent;
    box-shadow:none;
  }

  .product-image,
  .product-image-placeholder{
    width:100%;
    height:100%;
    min-height:124px;
    border-radius:14px;
    overflow:hidden;
  }

  .product-image{
    object-fit:cover;
  }

  .product-image-placeholder{
    background:linear-gradient(135deg,#FFF0DA 0%,#FFF9F1 100%);
  }

  .product-image-emoji{
    font-size:43px;
  }

  .product-add-fab{
    right:-4px;
    bottom:-4px;
    width:43px;
    height:43px;
    background:#fff;
    color:var(--theme-dark,#111111);
    border:1px solid #DADADA;
    box-shadow:0 3px 9px rgba(0,0,0,.16);
    z-index:4;
  }

  .product-add-fab .material-symbols-rounded{
    font-size:29px;
    font-weight:400;
  }

  .product-card:hover .product-add-fab{
    background:#fff;
    color:var(--theme-dark,#111111);
    transform:none;
  }

  .product-main:active .product-add-fab{
    transform:scale(.94);
  }

  .product-cart-lines{
    margin:0 0 12px;
    border-top:0;
    border-radius:12px;
  }
}

@media(max-width:390px){
  .product-main{
    grid-template-columns:minmax(0,1fr) 112px;
    gap:13px;
  }
  .product-media,
  .product-image-frame{
    width:112px;
    height:112px;
    min-height:112px;
  }
  .product-image,
  .product-image-placeholder{min-height:112px}
}


/* v32 - default monochrome fallback image */
.product-image.product-image-default{
  object-fit:contain;
  background:transparent;
  padding:14px;
}
@media(max-width:760px){
  .product-image.product-image-default{
    padding:10px;
  }
}


/* v33 - sticky mobile categories + scrollspy */
@media(max-width:820px){
  .category-panel{
    position:sticky!important;
    top:0;
    z-index:70;
    box-shadow:0 4px 14px rgba(0,0,0,.13);
  }
  .category-head{display:none}
  .category-list{
    min-height:58px;
    padding:8px 10px;
    align-items:center;
    background:var(--theme-dark,#111111);
    scrollbar-width:none;
  }
  .category-list::-webkit-scrollbar{display:none}
  .category-button{
    min-height:42px;
    border-radius:999px;
    background:#272727;
    border-color:#333;
    transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;
  }
  .category-button.active{
    background:var(--brand,#FF7A00);
    color:#fff;
    border-color:var(--brand,#FF7A00);
    box-shadow:0 4px 12px rgba(255,122,0,.28);
  }
  .category-button.active .dot{background:#fff}
  .mobile-category-section{
    width:100%;
    scroll-margin-top:72px;
    padding-top:6px;
  }
  .mobile-category-title{
    margin:12px 4px 10px;
    font-size:22px;
    line-height:1.15;
    font-weight:950;
    color:var(--theme-dark,#111111);
  }
  .mobile-category-products{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    width:100%;
  }
}
@media(max-width:520px){
  .mobile-category-products{gap:0}
}

/* v36 - no product image: keep the whole image area pure white */
.product-image-frame:has(.product-image-default){
  background:#fff;
}
.product-image.product-image-default{
  background:#fff!important;
}


/* v38 — compact product options, faster cart editing, professional checkout */
.product-dialog-body{
  padding:10px 16px 12px;
}
.product-dialog-body .option-tabs{
  gap:6px;
  margin-bottom:7px;
}
.product-dialog-body .option-tab{
  min-height:38px;
  padding:6px 8px;
  border-radius:10px;
  font-size:10.5px;
}
.product-dialog-body .option-tab .material-symbols-rounded{font-size:17px}
.product-dialog-body .option-search{
  height:34px;
  margin-top:5px;
  border-radius:10px;
}
.product-dialog-body .option-list{
  margin-top:6px;
}
.product-dialog-body .modifier-group-block,
.product-dialog-body [data-size-block]{
  margin-bottom:8px;
  padding:9px 10px;
  border-radius:12px;
}
.product-dialog-body .modifier-group-head,
.product-dialog-body .required-section-head{
  margin-bottom:6px;
  gap:8px;
}
.product-dialog-body .modifier-group-title,
.product-dialog-body .required-heading{
  font-size:11.5px;
  line-height:1.2;
}
.product-dialog-body .modifier-group-rule{
  margin-top:2px;
  font-size:9.5px;
}
.product-dialog-body .required-inline-badge,
.product-dialog-body .required-status,
.product-dialog-body .modifier-group-counter{
  font-size:8.5px;
  padding:3px 6px;
}
.product-dialog-body .option-row{
  min-height:34px;
  margin-bottom:4px;
  padding:5px 8px;
  border-radius:9px;
  gap:7px;
}
.product-dialog-body .option-row:last-child{margin-bottom:0}
.product-dialog-body .option-row .option-name{font-size:12px}
.product-dialog-body .option-row .option-price{font-size:10.5px}
.product-dialog-body .check-circle{
  width:19px;
  height:19px;
}
.product-dialog-body .radio-dot{width:9px;height:9px}
.product-dialog-body .check-circle .material-symbols-rounded{font-size:14px}
.product-dialog-body .size-quick-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
.product-dialog-body .size-quick-list .option-row{margin:0}
.product-dialog-body .popup-product-note{
  min-height:38px;
  margin-top:7px;
  border-radius:10px;
}
.product-dialog-head{padding-bottom:12px}
.product-dialog-description{margin-top:3px}

.cart-line{
  cursor:pointer;
  transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease,background .14s ease;
}
.cart-line:hover{
  border-color:#FFB064;
  background:#FFFDFC;
  box-shadow:0 4px 14px rgba(255,122,0,.08);
}
.cart-line:active{transform:scale(.992)}
.cart-line-name-wrap{flex:1;min-width:0}
.cart-line-edit-hint{
  margin-top:3px;
  display:flex;
  align-items:center;
  gap:3px;
  color:#A0A0A0;
  font-size:9px;
  font-weight:750;
}
.cart-line-edit-hint .material-symbols-rounded{font-size:12px}
.cart-line-actions{
  padding-top:7px;
  border-top:1px solid #ECECEC;
}
.cart-action-icon[data-cart-edit]{
  border:1px solid #E5E7EB;
  border-radius:9px;
  background:#fff;
}

.checkout-section-label{
  display:flex;
  align-items:center;
  gap:6px;
  margin:3px 1px 7px;
  color:#6B7280;
  font-size:10px;
  font-weight:950;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.checkout-section-label.compact{margin-top:10px}
.checkout-section-label .material-symbols-rounded{font-size:16px;color:var(--theme-dark,#111111)}
.order-type-row,
.payment-row{
  padding:5px;
  background:#F3F4F6;
  border:1px solid #E9EAEC;
  border-radius:13px;
  gap:5px;
}
.order-type-button,
.payment-button{
  background:transparent;
  border-color:transparent;
  box-shadow:none;
}
.order-type-button.active,
.payment-button.active{
  box-shadow:0 2px 8px rgba(0,0,0,.14);
}
.requested-time-card,
.customer-card{
  border-radius:13px;
  border-color:#E5E7EB;
  background:#fff;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}
.requested-time-card:hover,
.customer-card:hover{border-color:#BFC3C9}
.order-note-field{
  margin-top:7px;
  border-radius:12px;
  background:#FAFAFA;
}
.checkout-totals{
  margin-top:10px;
  padding:10px 12px;
  border-radius:13px;
  background:#F8F8F8;
}
.checkout-totals>div{padding:4px 0}
.total-row{
  margin-top:6px;
  padding:10px 12px;
  border-radius:13px;
  background:var(--theme-dark,#111111);
  color:#fff;
}
.total-row span{color:#D1D5DB}
.total-row strong{color:#fff}
.finish-order-button{
  height:50px;
  margin-top:10px;
  border-radius:13px;
  box-shadow:0 8px 20px rgba(0,0,0,.12);
}
.finish-order-button:disabled{box-shadow:none}
.customer-dialog-card .dialog-title{
  padding-bottom:5px;
}
.customer-form{
  gap:9px 11px;
}
.customer-form input{
  height:42px;
  border-radius:10px;
}
.form-section-title{
  margin-top:7px;
  padding:8px 0 2px;
  border-top:1px solid #F0F0F0;
}
.form-section-title:first-child{border-top:0;margin-top:0;padding-top:0}

@media(max-width:760px){
  .product-dialog-body{padding:8px 12px 10px}
  .product-dialog-body .modifier-group-block,
  .product-dialog-body [data-size-block]{padding:8px}
  .product-dialog-body .size-quick-list{grid-template-columns:1fr 1fr}
  .product-dialog-body .option-row{min-height:33px}
  .checkout-section-label{margin-top:5px}
}

/* v39 — keep final checkout action visible */
.cart-bottom{
  flex:0 1 auto;
  min-height:0;
  max-height:calc(100vh - 72px);
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px));
}
.finish-order-button{
  position:sticky;
  bottom:0;
  z-index:12;
  margin-top:10px;
  box-shadow:0 -8px 18px rgba(255,255,255,.96),0 8px 20px rgba(0,0,0,.12);
}
.finish-order-button:disabled{
  box-shadow:0 -8px 18px rgba(255,255,255,.96);
}
@media(max-width:1120px){
  .cart-bottom{
    max-height:calc(100dvh - 72px);
    padding-bottom:calc(12px + env(safe-area-inset-bottom, 0px));
  }
  .finish-order-button{
    bottom:0;
  }
}


/* v42 - restaurant site navigation */
:root{--site-header-h:68px}
body{padding-top:var(--site-header-h)}
.site-header{
  position:fixed;inset:0 0 auto 0;height:var(--site-header-h);z-index:140;
  background:rgba(255,255,255,.96);backdrop-filter:blur(14px);
  border-bottom:1px solid #E9E9E9;
  display:flex;align-items:center;gap:22px;padding:0 24px;
  box-shadow:0 4px 18px rgba(0,0,0,.045);
}
.site-brand{display:flex;align-items:center;gap:10px;color:var(--theme-dark,#111111);text-decoration:none;min-width:190px}
.site-brand-mark{width:38px;height:38px;border-radius:12px;background:var(--theme-dark,#111111);color:#fff;display:grid;place-items:center;font-weight:950;font-size:18px}
.site-brand-copy{display:flex;flex-direction:column;line-height:1.05}.site-brand-copy strong{font-size:16px}.site-brand-copy small{margin-top:4px;color:#8A8A8A;font-size:10px;font-weight:750}
.site-nav{display:flex;align-items:center;justify-content:center;gap:5px;flex:1}
.site-nav-link{height:40px;padding:0 15px;border:0;border-radius:999px;background:transparent;color:#666;font-size:13px;font-weight:850;transition:.18s ease}
.site-nav-link:hover{background:#F3F3F3;color:var(--theme-dark,#111111)}.site-nav-link.active{background:var(--theme-dark,#111111);color:#fff}
.site-nav-order{height:42px;padding:0 15px;border:0;border-radius:12px;background:var(--brand,#FF7A00);color:#fff;display:flex;align-items:center;gap:7px;font-size:12px;font-weight:950;box-shadow:0 7px 18px rgba(255,122,0,.22)}
.site-nav-order .material-symbols-rounded{font-size:19px}
.site-mobile-nav{display:none}
.app-shell{height:calc(100vh - var(--site-header-h))}
.category-panel,.product-panel,.cart-panel{height:calc(100vh - var(--site-header-h))}
@media(max-width:1120px){.app-shell{min-height:calc(100vh - var(--site-header-h));height:auto}.category-panel{top:var(--site-header-h)}.cart-panel{top:var(--site-header-h);height:calc(100vh - var(--site-header-h))}}

.site-sheet-backdrop{position:fixed;inset:var(--site-header-h) 0 0 0;z-index:150;background:rgba(17,17,17,.42);display:flex;justify-content:flex-end;animation:siteFade .18s ease}
.site-sheet{width:min(460px,100%);height:100%;background:#fff;box-shadow:-18px 0 44px rgba(0,0,0,.16);display:flex;flex-direction:column;animation:siteSheetIn .24s cubic-bezier(.22,.61,.36,1)}
.site-sheet-head{padding:22px 22px 17px;border-bottom:1px solid #eee;display:flex;align-items:center;justify-content:space-between}.site-sheet-head small{color:var(--brand,#FF7A00);font-size:10px;font-weight:950;letter-spacing:.08em}.site-sheet-head h2{margin:4px 0 0;font-size:27px}.site-sheet-close{width:40px;height:40px;border:0;border-radius:12px;background:#F3F3F3;display:grid;place-items:center}
.site-sheet-body{padding:20px 22px;overflow:auto}.site-info-hero{padding:17px;border-radius:17px;background:var(--theme-dark,#111111);color:#fff;display:flex;gap:13px;align-items:flex-start}.site-info-hero>.material-symbols-rounded{font-size:30px}.site-info-hero strong{font-size:18px}.site-info-hero p{margin:6px 0 0;color:#D1D1D1;font-size:12px;line-height:1.45}.site-info-grid{display:grid;gap:9px;margin-top:14px}.site-info-grid>div{padding:14px;border:1px solid #E9E9E9;border-radius:14px;display:grid;grid-template-columns:30px 1fr;column-gap:8px}.site-info-grid>div>.material-symbols-rounded{grid-row:1/3;color:var(--brand,#FF7A00)}.site-info-grid strong{font-size:13px}.site-info-grid small{margin-top:3px;color:#777;font-size:11px;line-height:1.4}
.site-contact-card{border:1px solid #E8E8E8;border-radius:16px;overflow:hidden}.site-contact-row{display:flex;align-items:center;gap:12px;padding:15px;border-bottom:1px solid #EEE}.site-contact-row:last-child{border-bottom:0}.site-contact-row>.material-symbols-rounded{width:38px;height:38px;border-radius:11px;background:color-mix(in srgb,var(--brand,#FF7A00) 10%,white);color:var(--brand,#FF7A00);display:grid;place-items:center}.site-contact-row div{display:flex;flex-direction:column;gap:3px}.site-contact-row small{color:#888;font-size:10px;font-weight:800}.site-contact-row strong{font-size:13px}.site-contact-note{margin:12px 2px 0;color:#888;font-size:11px;line-height:1.45}
@keyframes siteFade{from{opacity:0}to{opacity:1}}@keyframes siteSheetIn{from{transform:translateX(100%)}to{transform:none}}

@media(max-width:820px){
  :root{--site-header-h:58px}
  body{padding-top:var(--site-header-h);padding-bottom:64px}
  .site-header{height:var(--site-header-h);padding:0 12px}.site-brand{min-width:0;flex:1}.site-brand-mark{width:36px;height:36px}.site-brand-copy small{display:none}.site-nav,.site-nav-order{display:none}
  .site-mobile-nav{position:fixed;left:0;right:0;bottom:0;height:64px;z-index:145;background:#fff;border-top:1px solid #E7E7E7;display:grid;grid-template-columns:repeat(5,1fr);padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -6px 20px rgba(0,0,0,.06)}
  .site-mobile-nav button{border:0;background:transparent;color:#8A8A8A;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}.site-mobile-nav button .material-symbols-rounded{font-size:21px}.site-mobile-nav button small{font-size:9px;font-weight:850}.site-mobile-nav button.active{color:var(--brand,#FF7A00)}
  .app-shell{height:auto;min-height:calc(100vh - var(--site-header-h) - 64px)}
  .product-panel{height:auto;min-height:calc(100vh - var(--site-header-h) - 64px)}
  .category-panel{top:var(--site-header-h)!important;height:auto}
  .site-sheet-backdrop{inset:var(--site-header-h) 0 64px 0;align-items:flex-end}.site-sheet{width:100%;height:auto;max-height:82vh;border-radius:22px 22px 0 0;animation:siteSheetUp .24s cubic-bezier(.22,.61,.36,1)}
  @keyframes siteSheetUp{from{transform:translateY(100%)}to{transform:none}}
  .mobile-cart-button{bottom:76px}
}

/* v43 - product popup must stay above site navigation */
.product-dialog-backdrop{
  z-index:320 !important;
}
.product-dialog-card{
  position:relative;
  z-index:321;
}
body.product-dialog-open .site-header,
body.product-dialog-open .site-mobile-nav{
  pointer-events:none;
}

/* v44 - cart / checkout action above site navigation */
@media(max-width:1120px){
  .cart-panel{
    z-index:220 !important;
  }
}
@media(max-width:820px){
  .cart-panel{
    top:var(--site-header-h) !important;
    bottom:64px !important;
    height:auto !important;
    max-height:none !important;
  }
  .cart-panel.open{
    z-index:220 !important;
  }
  .cart-bottom{
    padding-bottom:calc(14px + env(safe-area-inset-bottom, 0px));
  }
  .checkout-page-button,
  .finish-order-button{
    position:sticky;
    bottom:0;
    z-index:222;
  }
}

/* v47 profile navigation */
.site-nav a.site-nav-link{text-decoration:none;display:flex;align-items:center;justify-content:center}
.site-mobile-nav>a{border:0;background:transparent;color:inherit;text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font:inherit}
.site-mobile-nav>a .material-symbols-rounded{font-size:21px}.site-mobile-nav>a small{font-size:9px;font-weight:800}

@media(max-width:760px){.site-mobile-nav>a{color:#8A8A8A}.site-mobile-nav>a:active{color:var(--brand,#FF7A00)}}


/* v58 - detailed admin controlled colors */
html,body,.app-shell{background:var(--theme-bg,#F3F4F6);color:var(--theme-text,#111111)}
.site-header{background:var(--header-bg,#fff)!important;color:var(--header-text,#111)!important;border-color:var(--theme-border,#E5E7EB)!important}.site-header a,.site-header button,.site-brand-copy strong{color:var(--header-text,#111)}.site-nav-order,.site-brand-mark{background:var(--brand,#FF7A00)!important;color:var(--brand-text,#fff)!important}.site-nav-link.active{color:var(--brand,#FF7A00)!important}
.category-panel{background:var(--sidebar-bg,#111)!important;color:var(--sidebar-text,#fff)!important}.category-button{color:var(--sidebar-text,#fff)!important;border-color:color-mix(in srgb,var(--sidebar-text,#fff) 7%,transparent)!important}.category-button .dot{background:color-mix(in srgb,var(--sidebar-text,#fff) 40%,transparent)!important}.category-button.active{background:var(--category-active-bg,#fff)!important;color:var(--category-active-text,#111)!important;border-color:var(--category-active-bg,#fff)!important}.category-button.active .dot{background:var(--category-active-text,#111)!important}.category-button.active .material-symbols-rounded{color:var(--category-active-text,#111)!important}
.product-panel,.product-toolbar{background:var(--theme-bg,#F3F4F6)!important;color:var(--theme-text,#111)!important}.product-toolbar{border-color:var(--theme-border,#E5E7EB)!important}.search-box,.option-search{background:var(--search-bg,#fff)!important;border-color:var(--theme-border,#E5E7EB)!important}.search-box input,.option-search input{background:transparent!important;color:var(--search-text,#111)!important}.search-box>.material-symbols-rounded,.option-search>.material-symbols-rounded{color:var(--theme-muted,#777)!important}
.product-card{background:var(--product-card-bg,#fff)!important;color:var(--product-card-text,#111)!important;border-color:var(--theme-border,#E5E7EB)!important}.product-card p,.product-description,.product-cart-line-copy small{color:var(--theme-muted,#777)!important}.product-add-fab{background:var(--brand,#FF7A00)!important;color:var(--brand-text,#fff)!important}.product-card:hover .product-add-fab{background:var(--brand,#FF7A00)!important}
.product-inline,.product-option-area,.option-row,.product-cart-line{border-color:var(--theme-border,#E5E7EB)!important}.option-row,.product-cart-line{background:var(--surface-alt,#FAFAFA)!important;color:var(--theme-text,#111)!important}.option-row.selected,.product-cart-line{border-color:color-mix(in srgb,var(--brand,#FF7A00) 45%,var(--theme-border,#E5E7EB))!important}.required-badge,.required-status.done{background:color-mix(in srgb,var(--brand,#FF7A00) 12%,white)!important;color:var(--brand,#FF7A00)!important}
.cart-panel,.cart-head,.cart-body,.cart-bottom{background:var(--cart-bg,#fff)!important;color:var(--theme-text,#111)!important;border-color:var(--theme-border,#E5E7EB)!important}.cart-line{border-color:var(--theme-border,#E5E7EB)!important;background:var(--surface,#fff)!important}.cart-chip{background:var(--surface-alt,#FAFAFA)!important;color:var(--theme-text,#111)!important;border-color:var(--theme-border,#E5E7EB)!important}.cart-action-icon.delete,.cart-clear-button{color:var(--danger,#D93025)!important}.mobile-cart-button,.checkout-button,.cart-checkout-button,.web-bottom-chip.primary{background:var(--cart-button-bg,#111)!important;color:var(--cart-button-text,#fff)!important}.cart-count{background:var(--brand,#FF7A00)!important;color:var(--brand-text,#fff)!important}
.product-dialog-card,.dialog-card,.site-sheet{background:var(--popup-bg,#fff)!important;color:var(--theme-text,#111)!important}.dialog-backdrop,.product-dialog-backdrop,.site-sheet-backdrop{background:color-mix(in srgb,var(--overlay,#111) 48%,transparent)!important}.product-dialog-head,.dialog-title,.site-sheet-head{border-color:var(--theme-border,#E5E7EB)!important}.site-sheet-close,.icon-button,.round-cart-button{background:var(--surface-alt,#FAFAFA)!important;color:var(--theme-text,#111)!important}.filled-dialog-button,.product-dialog-add{background:var(--brand,#FF7A00)!important;color:var(--brand-text,#fff)!important}
input,textarea,select,.customer-form input,.customer-form textarea{background:var(--input-bg,#fff)!important;color:var(--input-text,#111)!important;border-color:var(--theme-border,#E5E7EB)!important}.site-info-grid>div,.site-contact-card{background:var(--surface,#fff)!important;border-color:var(--theme-border,#E5E7EB)!important}.site-info-hero{background:var(--theme-dark,#111)!important;color:var(--theme-dark-text,#fff)!important}
.site-mobile-nav{background:var(--bottom-nav-bg,#fff)!important;border-color:var(--theme-border,#E5E7EB)!important}.site-mobile-nav button,.site-mobile-nav>a{color:var(--bottom-nav-text,#8A8A8A)!important}.site-mobile-nav button.active,.site-mobile-nav>a:active{color:var(--brand,#FF7A00)!important}
.toast,.cart-added-toast{background:var(--theme-dark,#111)!important;color:var(--theme-dark-text,#fff)!important}.success-hero-icon{color:var(--success,#16A34A)!important}.customer-card.warning,.checkout-minimum:not(.ok){color:var(--warning,#D97706)!important}.error,.invalid-message{color:var(--danger,#D93025)!important}


/* v62 - cart navigation remains usable */
@media(max-width:820px){
  .site-mobile-nav{
    z-index:240 !important;
  }
  .cart-panel,
  .cart-panel.open{
    z-index:220 !important;
    bottom:64px !important;
    height:auto !important;
  }
}


/* v64 - toast / cart feedback must always stay above every overlay */
.toast,
#toast,
.app-toast,
.cart-toast,
.added-toast,
.notification-toast{
  position: fixed !important;
  z-index: 999999 !important;
  pointer-events: none;
}

@media (max-width:820px){
  .toast,
  #toast,
  .app-toast,
  .cart-toast,
  .added-toast,
  .notification-toast{
    left: 50% !important;
    right: auto !important;
    bottom: calc(82px + env(safe-area-inset-bottom, 0px)) !important;
    transform: translateX(-50%) !important;
    max-width: calc(100vw - 28px) !important;
  }
}

/* v70 checkout login gate */
.checkout-page-button.loading{opacity:.72;pointer-events:none}
.checkout-page-button.loading .material-symbols-rounded{animation:v70Spin .75s linear infinite}
@keyframes v70Spin{to{transform:rotate(360deg)}}


/* v75 - favorites + last order */
.product-media{position:relative}.product-favorite{position:absolute;z-index:5;top:7px;right:7px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.94);color:#555;display:grid;place-items:center;cursor:pointer;box-shadow:0 5px 16px rgba(0,0,0,.12);backdrop-filter:blur(6px)}.product-favorite .material-symbols-rounded{font-size:20px}.product-favorite.active{color:#e11d48}.product-favorite.active .material-symbols-rounded{font-variation-settings:'FILL' 1}
.last-order-quick{margin:12px 14px 0;padding:12px 13px;display:flex;align-items:center;gap:11px;border:1px solid var(--line,#e5e7eb);border-radius:15px;background:var(--surface,#fff);box-shadow:0 6px 18px rgba(0,0,0,.04)}.last-order-quick.hidden{display:none}.last-order-quick-icon{width:40px;height:40px;display:grid;place-items:center;flex:none;border-radius:12px;background:color-mix(in srgb,var(--orange,#FF7A00) 10%,white);color:var(--orange,#FF7A00)}.last-order-quick-copy{min-width:0;flex:1}.last-order-quick-copy small,.last-order-quick-copy strong,.last-order-quick-copy span{display:block}.last-order-quick-copy small{font-size:8px;font-weight:950;letter-spacing:.08em;color:var(--muted,#777)}.last-order-quick-copy strong{font-size:12px;margin-top:2px}.last-order-quick-copy span{margin-top:2px;font-size:9px;color:var(--muted,#777)}.last-order-quick button{min-height:40px;padding:0 12px;border:0;border-radius:11px;background:var(--orange,#FF7A00);color:var(--brand-text,#fff);font-size:9px;font-weight:950;display:flex;align-items:center;gap:6px;cursor:pointer}.last-order-quick button .material-symbols-rounded{font-size:17px}
@media(max-width:720px){.last-order-quick{margin:9px 10px 0;align-items:flex-start;flex-wrap:wrap}.last-order-quick-copy{padding-top:2px}.last-order-quick button{width:100%;justify-content:center}}


/* v80 shop status + legal */
.shop-status-banner{margin:10px 14px 0;padding:10px 12px;border:1px solid var(--line,#e5e7eb);border-radius:13px;background:var(--surface,#fff);display:flex;align-items:center;gap:10px}.shop-status-banner.hidden{display:none}.shop-status-banner>.material-symbols-rounded{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;flex:none}.shop-status-banner strong,.shop-status-banner small{display:block}.shop-status-banner strong{font-size:10px}.shop-status-banner small{margin-top:2px;font-size:8.5px;color:var(--muted,#777)}.shop-status-banner.open>.material-symbols-rounded{background:color-mix(in srgb,var(--success,#16A34A) 10%,white);color:var(--success,#16A34A)}.shop-status-banner.closed>.material-symbols-rounded{background:color-mix(in srgb,var(--warning,#D97706) 10%,white);color:var(--warning,#D97706)}
.site-legal-links{display:flex;justify-content:center;gap:14px;padding:11px 12px 18px}.site-legal-links a{font-size:8px;color:var(--muted,#777);text-decoration:none}.site-legal-links a:hover{text-decoration:underline}
@media(max-width:720px){.shop-status-banner{margin:8px 10px 0}.site-legal-links{padding-bottom:78px}}


/* v84 - mobile visual redesign inspired by reference */
@media(max-width:820px){
  body{
    background:#fff;
  }
  .site-header{display:none!important}
  .app-shell{
    min-height:100vh;
    background:#fff;
  }
  .product-panel,
  .products-scroll,
  .product-wrap{
    background:#fff!important;
  }
  .product-toolbar{
    position:sticky;
    top:0;
    z-index:85;
    background:#fff!important;
    padding:12px 10px 10px;
    border-bottom:1px solid #EEEEEE;
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 40px;
    gap:8px;
    align-items:center;
  }
  .toolbar-title-wrap{display:none!important}
  .product-count{display:none!important}
  .toolbar-actions{display:contents}
  .search-box{
    grid-column:2;
    width:100%!important;
    min-width:0;
    height:48px;
    background:#F5F2EC!important;
    border:0!important;
    border-radius:999px;
    padding:0 14px;
    box-shadow:none!important;
  }
  .search-box>.material-symbols-rounded{font-size:26px;color:#F57C00!important}
  .search-box input{font-size:15px;font-weight:700}
  .search-box input::placeholder{color:#888;opacity:1}
  .mobile-cart-button{display:none!important}
  .product-toolbar::before{
    content:'arrow_back';
    font-family:'Material Symbols Rounded';
    width:40px;height:40px;
    display:grid;place-items:center;
    font-size:30px;
    color:#F57C00;
    grid-column:1;
    justify-self:start;
  }
  .product-toolbar::after{
    content:'tune';
    font-family:'Material Symbols Rounded';
    width:40px;height:40px;
    display:grid;place-items:center;
    font-size:27px;
    color:#444;
    grid-column:3;
    justify-self:end;
    background:#F6F6F6;
    border-radius:50%;
  }

  .category-panel{
    top:71px!important;
    z-index:80;
    background:#fff!important;
    box-shadow:none!important;
    border-bottom:1px solid #EDEDED;
  }
  .category-list{
    min-height:58px;
    padding:8px 10px;
    background:#fff!important;
    border-top:0;
    gap:10px;
  }
  .category-button{
    min-height:44px;
    padding:0 18px;
    background:#fff!important;
    color:#454545!important;
    border:0!important;
    border-radius:999px;
    font-weight:800;
    box-shadow:none!important;
  }
  .category-button .dot{display:none!important}
  .category-button .material-symbols-rounded{display:none!important}
  .category-button .name{
    font-size:17px;
    font-weight:800;
    color:inherit;
  }
  .category-button.active{
    background:#222!important;
    color:#fff!important;
  }
  .mobile-category-section{
    scroll-margin-top:132px;
    padding-top:0;
  }
  .mobile-category-title{
    margin:16px 0 12px;
    padding:0 18px;
    font-size:23px;
    font-weight:950;
  }
  .mobile-category-products{gap:0}

  .product-card,
  .product-card.expanded{
    width:100%!important;
    border:0!important;
    border-bottom:1px solid #ECECEC!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:none!important;
    overflow:visible;
  }
  .product-main{
    min-height:152px;
    padding:18px 12px 18px 18px;
    grid-template-columns:minmax(0,1fr) 122px;
    gap:16px;
    align-items:start;
  }
  .product-main-info{min-height:116px}
  .product-name{
    font-size:17px;
    line-height:1.22;
    font-weight:900;
    -webkit-line-clamp:2;
  }
  .product-description{
    margin-top:7px;
    font-size:12px;
    line-height:1.35;
    color:#757575!important;
    -webkit-line-clamp:2;
  }
  .product-main-bottom{margin-top:14px}
  .product-price{
    font-size:18px;
    font-weight:950;
    color:#333;
  }
  .product-price small{
    font-size:10px;
    font-weight:800;
    text-transform:lowercase;
  }
  .product-media{width:122px;height:122px;position:relative}
  .product-favorite{display:none!important}
  .product-image-frame{
    width:122px;height:122px;min-height:122px;
    border:1px solid #E9E3DB;
    border-radius:16px;
    overflow:visible;
    background:#fff!important;
  }
  .product-image,.product-image-placeholder{
    width:100%;height:100%;min-height:122px;
    border-radius:16px;
    overflow:hidden;
    background:#fff;
  }
  .product-image{object-fit:cover}
  .product-image.product-image-default{
    padding:14px;
    background:transparent!important;
    opacity:.65;
  }
  .product-add-fab{
    right:-6px;
    top:-6px;
    bottom:auto;
    width:44px;height:44px;
    background:#fff!important;
    color:#F57C00!important;
    border:1px solid #E2DED8;
    box-shadow:0 4px 10px rgba(0,0,0,.12);
  }
  .product-add-fab .material-symbols-rounded{font-size:30px}

  .product-cart-lines{
    padding:0 14px 14px;
    margin:0;
    background:#fff;
    border-top:0!important;
  }
  .product-cart-lines-title{display:none!important}
  .product-cart-line{
    position:relative;
    margin-top:10px;
    border:0!important;
    border-radius:18px;
    background:#F5F2EC!important;
    padding:18px 82px 18px 18px;
    align-items:flex-start;
    min-height:86px;
  }
  .product-cart-line-copy strong{
    display:block;
    font-size:16px;
    line-height:1.45;
    color:#4A4A4A;
    font-weight:500;
  }
  .product-cart-line-copy small{display:none!important}
  .product-cart-line-qty{
    position:absolute;
    right:18px;
    top:18px;
    width:36px;height:36px;
    display:grid;place-items:center;
    border-radius:50%;
    background:#262626;
    color:#fff;
    font-weight:900;
    font-size:18px;
  }
  .product-cart-line-remove{
    position:absolute;
    right:14px;bottom:12px;
    width:30px;height:30px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 2px 6px rgba(0,0,0,.08);
  }

  .cart-panel{
    top:auto!important;
    right:0;left:0;bottom:0;
    width:100%!important;
    height:calc(100vh - 68px);
    border-radius:24px 24px 0 0;
    box-shadow:0 -12px 32px rgba(0,0,0,.18);
  }
  .cart-head{
    background:#fff!important;
    color:#111!important;
    border-bottom:1px solid #EEE;
  }
  .cart-mobile-close{background:#F3F3F3!important;color:#111!important}
  .cart-bottom{
    background:#fff!important;
    border-top:1px solid #ECECEC;
  }

  .mobile-cart-button,
  .checkout-page-button,
  .finish-order-button,
  .cart-checkout-button{
    background:#F57C00!important;
    color:#fff!important;
  }
  .mobile-cart-button{
    display:flex!important;
    position:fixed;
    left:14px;right:14px;
    bottom:calc(14px + env(safe-area-inset-bottom, 0px));
    transform:none!important;
    height:54px;
    min-width:0;
    width:auto;
    justify-content:space-between;
    padding:0 18px;
    border-radius:999px;
    box-shadow:0 10px 26px rgba(245,124,0,.34);
    z-index:72;
    font-size:17px;
    font-weight:900;
  }
  .mobile-cart-button .material-symbols-rounded{font-size:26px}
  .mobile-cart-button::before{
    content:attr(data-count);
    display:none;
  }
  #mobileCartCount{
    display:flex;
    align-items:center;
    gap:10px;
    margin-left:auto;
    font-size:0;
  }
  #mobileCartCount::before{
    content:'Warenkorb';
    font-size:18px;
    font-weight:900;
    color:#fff;
  }
  #mobileCartCount::after{
    content:attr(data-total);
    font-size:16px;
    font-weight:900;
    color:#fff;
  }
  .mobile-cart-button.has-items::after{
    content:attr(data-items);
    position:absolute;
    left:44px;
    top:8px;
    width:30px;height:30px;
    border-radius:50%;
    background:#262626;
    color:#fff;
    display:grid;place-items:center;
    font-size:16px;
    font-weight:900;
    box-shadow:0 2px 6px rgba(0,0,0,.18);
  }

  .product-dialog-backdrop{
    align-items:flex-end;
    padding:0;
  }
  .product-dialog-card{
    width:100vw;
    height:100vh;
    max-height:none;
    border-radius:0;
    box-shadow:none;
    animation:none;
  }
  .product-dialog-drag-handle{display:none!important}
  .product-dialog-head{
    padding:14px 14px 12px;
    gap:10px;
    align-items:center;
    position:sticky;
    top:0;
    z-index:5;
    background:#fff;
  }
  .product-dialog-eyebrow{display:none!important}
  .product-dialog-head h2{font-size:18px;margin:0}
  .product-dialog-description{display:none!important}
  .product-dialog-close{
    order:-1;
    width:34px;height:34px;
    background:transparent!important;
    border:0!important;
    padding:0;
    border-radius:0;
  }
  .product-dialog-close .material-symbols-rounded{
    font-size:28px;
    color:#F57C00;
  }
  .product-popup-inner{
    padding:0 0 16px;
  }
  .popup-product-hero{
    padding:0 0 14px;
    background:#fff;
  }
  .popup-product-hero-media{padding:0 16px}
  .popup-product-hero-frame{
    width:100%;
    aspect-ratio:1 / 0.94;
    border-radius:24px;
    overflow:hidden;
    background:#fff;
  }
  .popup-product-hero-frame .product-image,
  .popup-product-hero-frame .product-image-placeholder{
    min-height:unset;
    height:100%;
    border-radius:24px;
  }
  .popup-product-hero-copy{
    padding:14px 16px 0;
  }
  .popup-product-hero-name-row{
    display:flex;
    align-items:center;
    gap:10px;
  }
  .popup-product-hero-name-row h3{
    margin:0;
    flex:1;
    font-size:17px;
    line-height:1.25;
    font-weight:950;
  }
  .popup-product-hero-info{
    width:32px;height:32px;
    display:grid;place-items:center;
    border:2px solid #333;
    border-radius:50%;
    font-size:18px;
    color:#333;
  }
  .popup-product-hero-price{
    margin-top:6px;
    font-size:18px;
    font-weight:950;
    color:#222;
  }
  .popup-product-hero-price small{font-size:11px;font-weight:800;text-transform:lowercase}
  .popup-product-hero-description{
    margin:8px 0 0;
    color:#666;
    font-size:13px;
    line-height:1.38;
  }
  .required-section,
  .modifier-group-block{
    border-radius:0!important;
    border-left:0!important;
    border-right:0!important;
    border-top:1px solid #ECECEC!important;
    border-bottom:0!important;
    background:#fff!important;
    padding:0!important;
    margin:0!important;
    box-shadow:none!important;
  }
  .required-section-head,
  .modifier-group-head{
    padding:18px 16px;
    min-height:72px;
    align-items:center;
  }
  .modifier-group-title,
  .option-section-title{
    font-size:18px;
    font-weight:950;
  }
  .required-inline-badge{
    background:#D90429!important;
    color:#fff!important;
    border-radius:8px;
    padding:4px 8px;
    font-size:11px;
    font-weight:900;
    vertical-align:middle;
  }
  .modifier-group-rule,
  .required-status,
  .modifier-group-counter{
    font-size:12px;
  }
  .option-search{
    margin:0 16px 12px;
    border-radius:16px;
    background:#F6F6F6!important;
  }
  .product-dialog-body .option-row,
  .size-quick-list .option-row{
    min-height:72px;
    margin:0!important;
    padding:0 16px;
    border-top:1px solid #F0F0F0;
    border-radius:0!important;
    box-shadow:none!important;
    background:#fff!important;
  }
  .product-dialog-body .option-row:first-child,
  .size-quick-list .option-row:first-child{border-top:1px solid #ECECEC}
  .option-name{
    font-size:15px;
    font-weight:900;
  }
  .option-price{
    font-size:14px;
    color:#666;
    font-weight:800;
  }
  .check-circle{
    width:34px;height:34px;
    border-width:2px!important;
    margin-right:10px;
  }
  .option-row.selected .check-circle.checkbox-look,
  .option-row.selected .check-circle.radio-look{
    background:#F57C00!important;
    border-color:#F57C00!important;
    color:#fff!important;
    box-shadow:none!important;
  }
  .option-row.selected.variation .check-circle.radio-look{
    background:#fff!important;
    border-color:#F57C00!important;
  }
  .option-row.selected.variation .radio-dot{background:#F57C00!important}
  .popup-product-note{
    margin:12px 16px 0!important;
    border-radius:16px;
    background:#F5F5F5;
  }
  .product-dialog-footer{
    grid-template-columns:112px minmax(0,1fr)!important;
    gap:10px;
    padding:12px 14px calc(12px + env(safe-area-inset-bottom, 0px));
    box-shadow:0 -8px 20px rgba(0,0,0,.06);
  }
  .product-dialog-total{display:none!important}
  .product-footer-qty{
    min-height:54px;
    border:0!important;
    border-radius:16px;
    background:#F3F0EA!important;
    padding:4px;
    box-shadow:none!important;
    grid-template-columns:36px 1fr 36px;
  }
  .product-footer-qty-button{
    width:36px;height:44px;
    border-radius:12px;
    background:#fff!important;
    box-shadow:none!important;
    font-size:24px;
  }
  .product-dialog-add{
    min-height:54px!important;
    border-radius:18px!important;
    padding:0 18px!important;
    justify-content:space-between!important;
    font-size:16px;
    font-weight:900;
    background:#F57C00!important;
  }
  .product-dialog-add-total{
    margin-left:12px;
    font-size:18px;
  }
  .product-dialog-add.is-incomplete{
    background:#D9D9D9!important;
    color:#8A8A8A!important;
  }
}


/* v85 - product popup opening + sticky visible footer */
@keyframes productSheetBackdropFade{
  from{opacity:0}
  to{opacity:1}
}
@keyframes productSheetUpMobile{
  from{transform:translateY(28px) scale(.985);opacity:0}
  to{transform:translateY(0) scale(1);opacity:1}
}

@media(max-width:820px){
  .product-dialog-backdrop{
    align-items:flex-end!important;
    justify-content:center;
    padding:0;
    background:rgba(17,17,17,.42)!important;
    animation:productSheetBackdropFade .18s ease;
  }
  .product-dialog-card{
    width:100vw;
    height:min(94vh, calc(100vh - 6px));
    max-height:min(94vh, calc(100vh - 6px));
    border-radius:24px 24px 0 0;
    overflow:hidden;
    box-shadow:0 -14px 36px rgba(0,0,0,.18);
    animation:productSheetUpMobile .24s cubic-bezier(.22,.61,.36,1);
    display:flex;
    flex-direction:column;
  }
  .product-dialog-drag-handle{
    display:flex!important;
    flex:none;
    justify-content:center;
    align-items:center;
    padding:8px 0 4px;
    background:#fff;
  }
  .product-dialog-drag-handle span{
    width:46px;
    height:5px;
    border-radius:999px;
    background:#D8D8D8;
    display:block;
  }
  .product-dialog-head{
    flex:none;
    padding:8px 14px 12px;
  }
  .product-dialog-body{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom:10px;
  }
  .product-popup-inner{
    padding-bottom:12px;
  }
  .product-dialog-footer{
    position:sticky;
    bottom:0;
    z-index:9;
    flex:none;
    margin-top:auto;
    background:#fff!important;
    border-top:1px solid #ECECEC!important;
    box-shadow:0 -10px 24px rgba(0,0,0,.08);
    padding:12px 14px calc(12px + env(safe-area-inset-bottom, 0px))!important;
  }
  .product-dialog-add,
  .product-footer-qty{
    min-height:56px!important;
  }
}


/* v86 - polished popup motion + cart button above mobile navigation */
@keyframes productHeroFrameIn{
  from{opacity:0;transform:translateY(8px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes productHeroImageIn{
  from{opacity:.35;transform:scale(1.045)}
  to{opacity:1;transform:scale(1)}
}

@media(max-width:820px){
  .product-dialog-backdrop{
    backdrop-filter:blur(9px);
    -webkit-backdrop-filter:blur(9px);
    transition:opacity .24s ease, backdrop-filter .24s ease, -webkit-backdrop-filter .24s ease, background-color .24s ease;
  }
  .product-dialog-backdrop.is-closing{
    opacity:0!important;
    backdrop-filter:blur(0)!important;
    -webkit-backdrop-filter:blur(0)!important;
    background:rgba(17,17,17,0)!important;
    pointer-events:none;
  }
  .product-dialog-backdrop.is-opening .popup-product-hero-frame{
    animation:productHeroFrameIn .42s cubic-bezier(.22,.61,.36,1) both;
  }
  .product-dialog-backdrop.is-opening .popup-product-hero-frame .product-image{
    animation:productHeroImageIn .55s cubic-bezier(.22,.61,.36,1) both;
    transform-origin:center center;
  }
  .product-dialog-backdrop.is-closing .popup-product-hero-frame{
    transform:scale(.985);
    opacity:.72;
    transition:transform .22s ease,opacity .18s ease;
  }

  /* Bottom navigation is 64px high. Keep the cart CTA clearly above it. */
  .mobile-cart-button{
    bottom:calc(78px + env(safe-area-inset-bottom, 0px))!important;
    z-index:170!important;
  }

  /* The cart drawer itself must also finish above the mobile navigation. */
  .cart-panel{
    bottom:64px!important;
    height:calc(100vh - 64px)!important;
    z-index:220!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .product-dialog-backdrop,
  .product-dialog-card,
  .popup-product-hero-frame,
  .popup-product-hero-frame .product-image{
    animation:none!important;
    transition:none!important;
  }
}


/* v87 - search below categories, sticky categories, remove top icons */
@media(max-width:820px){
  .category-panel{
    position:sticky!important;
    top:0!important;
    z-index:140!important;
    width:100%!important;
    height:auto!important;
    min-width:0!important;
    background:#fff!important;
    border-bottom:1px solid #ECECEC;
  }
  .category-head{display:none!important}
  .category-list{
    min-height:60px;
    padding:10px 10px 10px!important;
  }

  .product-toolbar{
    position:relative!important;
    top:auto!important;
    z-index:40!important;
    display:block!important;
    padding:10px 12px 12px!important;
    border-bottom:1px solid #F1F1F1;
    background:#fff!important;
  }
  .product-toolbar::before,
  .product-toolbar::after{
    content:none!important;
    display:none!important;
  }
  .toolbar-actions{
    display:block!important;
    width:100%!important;
  }
  .search-box{
    grid-column:auto!important;
    width:100%!important;
    margin:0!important;
  }

  .mobile-category-section{
    scroll-margin-top:76px!important;
  }
}


/* v88 - popup footer controls styled like reference */
@media(max-width:820px){
  .product-dialog-footer{
    grid-template-columns:102px minmax(0,1fr)!important;
    gap:12px!important;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom, 0px))!important;
    background:#fff!important;
  }
  .product-footer-qty{
    min-height:56px!important;
    border-radius:18px!important;
    background:#F3F0EA!important;
    grid-template-columns:32px 1fr 32px!important;
    gap:0!important;
    padding:0 6px!important;
    align-items:center!important;
  }
  .product-footer-qty-button{
    width:32px!important;
    height:44px!important;
    border-radius:12px!important;
    background:transparent!important;
    box-shadow:none!important;
    border:0!important;
    color:#343434!important;
    font-size:24px!important;
    font-weight:500!important;
  }
  .product-footer-qty-button:active{transform:scale(.94)!important;background:rgba(0,0,0,.04)!important}
  .product-footer-qty-value{
    font-size:24px!important;
    line-height:1!important;
    font-weight:900!important;
    color:#2A2A2A!important;
    text-align:center!important;
  }
  .product-dialog-add{
    min-height:56px!important;
    border-radius:22px!important;
    padding:0 22px!important;
    justify-content:center!important;
    gap:8px!important;
    font-size:18px!important;
    font-weight:900!important;
    letter-spacing:0!important;
    box-shadow:none!important;
  }
  .product-dialog-add-main{
    display:flex!important;
    align-items:center!important;
    gap:0!important;
    min-width:0!important;
  }
  .product-dialog-add .material-symbols-rounded{display:none!important}
  .product-dialog-add-total{
    margin-left:8px!important;
    font-size:18px!important;
    font-weight:900!important;
    line-height:1!important;
    color:inherit!important;
  }
  .product-dialog-add.is-incomplete{
    background:#D8D8D8!important;
    color:#8F8F8F!important;
  }
}


/* v89 - compact quantity + cart icon add button */
@media(max-width:820px){
  .product-dialog-footer{
    grid-template-columns:86px minmax(0,1fr)!important;
    gap:10px!important;
  }
  .product-footer-qty{
    min-height:50px!important;
    height:50px!important;
    border-radius:16px!important;
    grid-template-columns:27px 1fr 27px!important;
    padding:0 4px!important;
  }
  .product-footer-qty-button{
    width:27px!important;
    height:38px!important;
    font-size:20px!important;
    border-radius:10px!important;
  }
  .product-footer-qty-value{
    font-size:20px!important;
    font-weight:900!important;
  }
  .product-dialog-add{
    min-height:50px!important;
    height:50px!important;
    border-radius:20px!important;
    padding:0 18px!important;
  }
  .product-dialog-add-main{gap:0!important}
  .product-dialog-add .material-symbols-rounded{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:22px!important;
    line-height:1!important;
  }
  #productDialogAddText{display:none!important}
  .product-dialog-add-total{
    margin-left:10px!important;
    font-size:17px!important;
  }
}


/* v90 - wider, lower quantity control with larger touch targets */
@media(max-width:820px){
  .product-dialog-footer{
    grid-template-columns:118px minmax(0,1fr)!important;
    gap:10px!important;
  }

  .product-footer-qty{
    min-height:46px!important;
    height:46px!important;
    border-radius:15px!important;
    grid-template-columns:42px 1fr 42px!important;
    padding:0 3px!important;
  }

  .product-footer-qty-button{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
    border-radius:12px!important;
    font-size:30px!important;
    font-weight:500!important;
    line-height:1!important;
    display:grid!important;
    place-items:center!important;
    touch-action:manipulation;
  }

  .product-footer-qty-value{
    font-size:21px!important;
    font-weight:900!important;
  }

  .product-dialog-add{
    min-height:46px!important;
    height:46px!important;
  }
}


/* v91 - hide empty mobile cart CTA + no X on product option summaries */
@media(max-width:820px){
  .mobile-cart-button.cart-empty{display:none!important}
  .product-cart-line{padding-right:68px!important}
  .product-cart-line-qty{right:18px!important;top:50%!important;bottom:auto!important;transform:translateY(-50%)!important}
}


/* v92 - mobile cart always full screen + scrollable content */
@media(max-width:820px){
  .cart-panel{
    position:fixed!important;
    inset:0!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    width:100vw!important;
    min-width:0!important;
    height:100vh!important;
    height:100dvh!important;
    max-height:100vh!important;
    max-height:100dvh!important;
    border-radius:0!important;
    border:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    background:var(--cart-bg,#fff)!important;
    z-index:260!important;
  }

  .cart-panel.open{
    z-index:260!important;
  }

  .cart-head{
    flex:0 0 auto!important;
    min-height:64px!important;
    height:64px!important;
    padding-top:env(safe-area-inset-top,0px)!important;
    box-sizing:content-box!important;
    position:relative!important;
    z-index:3!important;
  }

  .cart-body{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
    padding:14px 14px 24px!important;
  }

  .cart-bottom{
    flex:0 0 auto!important;
    position:relative!important;
    bottom:auto!important;
    z-index:4!important;
    width:100%!important;
    margin:0!important;
    padding:10px 14px calc(12px + env(safe-area-inset-bottom,0px))!important;
    border-top:1px solid #ECECEC!important;
    background:#fff!important;
    box-shadow:0 -8px 22px rgba(0,0,0,.06)!important;
  }

  .checkout-page-button,
  .finish-order-button{
    position:relative!important;
    bottom:auto!important;
  }

  body:has(.cart-panel.open){
    overflow:hidden!important;
  }

  body:has(.cart-panel.open) .site-mobile-nav,
  body:has(.cart-panel.open) .mobile-cart-button{
    visibility:hidden!important;
    pointer-events:none!important;
  }
}


/* v93 - cart flush to top and bottom, no background showing */
@media(max-width:820px){
  .cart-panel,
  .cart-panel.open{
    inset:0!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    right:0!important;
    width:100vw!important;
    height:100vh!important;
    height:100dvh!important;
    max-height:100vh!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:#fff!important;
  }

  .cart-head{
    position:sticky!important;
    top:0!important;
    margin:0!important;
    border-radius:0!important;
    background:#fff!important;
    border-bottom:1px solid #ECECEC!important;
  }

  .cart-body{
    padding:14px 14px 12px!important;
    background:#fff!important;
  }

  .cart-bottom{
    position:sticky!important;
    bottom:0!important;
    left:0!important;
    right:0!important;
    margin:0!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:none!important;
    border-top:1px solid #ECECEC!important;
  }

  .cart-checkout-button,
  .checkout-page-button,
  .finish-order-button{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  body:has(.cart-panel.open),
  html:has(.cart-panel.open){
    background:#fff!important;
    overflow:hidden!important;
  }
}


/* v95 - natural swipe-down sheet from almost anywhere */
@media(max-width:820px){
  .product-dialog-card{overscroll-behavior-y:contain!important}
  .product-dialog-body{overscroll-behavior-y:contain!important}
  .product-dialog-card.is-dragging{cursor:grabbing}
  .product-dialog-card.is-dragging .product-dialog-body{overflow-y:hidden!important}
}


/* v96 - product card plus button style like reference */
@media(max-width:820px){
  .product-media{
    width:122px;
    height:122px;
    position:relative;
    overflow:visible;
  }

  .product-add-fab{
    top:auto!important;
    left:auto!important;
    right:-4px!important;
    bottom:10px!important;
    width:50px!important;
    height:50px!important;
    border-radius:50%!important;
    background:#fff!important;
    color:#353535!important;
    border:1px solid #E7E1DA!important;
    box-shadow:0 6px 18px rgba(0,0,0,.14)!important;
    display:grid!important;
    place-items:center!important;
    transform:none!important;
  }

  .product-add-fab .material-symbols-rounded{
    font-size:34px!important;
    font-weight:400!important;
    line-height:1!important;
    color:#3A3A3A!important;
  }

  .product-card:hover .product-add-fab,
  .product-main:active .product-add-fab{
    background:#fff!important;
    color:#353535!important;
    transform:translateY(0) scale(1.02)!important;
  }
}


/* v97 - compact mobile menu: about four products visible per screen */
@media(max-width:820px){
  .mobile-category-title{
    margin:10px 0 5px!important;
    padding:0 14px!important;
    font-size:19px!important;
    line-height:1.15!important;
  }

  .product-main{
    min-height:118px!important;
    padding:10px 12px 10px 14px!important;
    grid-template-columns:minmax(0,1fr) 94px!important;
    gap:12px!important;
    align-items:center!important;
  }

  .product-main-info{
    min-height:94px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
  }

  .product-name{
    font-size:15px!important;
    line-height:1.18!important;
    font-weight:900!important;
    -webkit-line-clamp:2!important;
  }

  .product-description{
    margin-top:4px!important;
    font-size:11.5px!important;
    line-height:1.22!important;
    -webkit-line-clamp:2!important;
  }

  .product-main-bottom{
    margin-top:7px!important;
  }

  .product-price{
    font-size:16px!important;
    line-height:1.1!important;
    font-weight:950!important;
  }

  .product-price small{
    font-size:9px!important;
  }

  .product-media{
    width:94px!important;
    height:94px!important;
    min-width:94px!important;
  }

  .product-image-frame,
  .product-image,
  .product-image-placeholder{
    width:94px!important;
    height:94px!important;
    min-height:94px!important;
    border-radius:13px!important;
  }

  .product-image.product-image-default{
    padding:11px!important;
  }

  .product-add-fab{
    right:-3px!important;
    bottom:7px!important;
    width:42px!important;
    height:42px!important;
    border-radius:50%!important;
    box-shadow:0 4px 12px rgba(0,0,0,.14)!important;
  }

  .product-add-fab .material-symbols-rounded{
    font-size:30px!important;
  }

  .product-cart-lines{
    padding:0 10px 10px!important;
  }

  .product-cart-line{
    margin-top:7px!important;
    min-height:68px!important;
    padding:12px 58px 12px 14px!important;
    border-radius:14px!important;
  }

  .product-cart-line-copy strong{
    font-size:14px!important;
    line-height:1.3!important;
  }

  .product-cart-line-copy small{
    font-size:11px!important;
    line-height:1.25!important;
  }
}


/* v98 - smaller add button, inset bottom-right */
@media(max-width:820px){
  .product-add-fab{
    right:6px!important;
    bottom:6px!important;
    width:36px!important;
    height:36px!important;
    border-radius:50%!important;
    box-shadow:0 4px 10px rgba(0,0,0,.14)!important;
  }

  .product-add-fab .material-symbols-rounded{
    font-size:24px!important;
    line-height:1!important;
  }
}


/* v99 - keep image frame visible on all four sides */
@media(max-width:820px){
  .product-image-frame{
    border:0!important;
    padding:1px!important;
    background:#E9E3DB!important;
    overflow:hidden!important;
    border-radius:13px!important;
  }

  .product-image,
  .product-image-placeholder{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    border-radius:12px!important;
    display:block!important;
  }

  .product-image{
    object-fit:cover!important;
  }
}


/* v101 - no-image interior must stay pure white; keep v99 frame unchanged */
@media(max-width:820px){
  .product-image.product-image-default{
    background:#fff!important;
  }
  .product-image-frame:has(.product-image-default){
    background:#E9E3DB!important;
  }
}


/* v103 - restore v99 no-image icon, force pure-white interior */
@media(max-width:820px){
  .product-image.product-image-default{
    background:#FFFFFF!important;
    opacity:1!important;
  }
  .product-image-frame:has(.product-image-default){
    background:#E9E3DB!important;
  }
}


/* v104 - compact variant summary boxes under product cards */
@media(max-width:820px){
  .product-cart-lines{
    padding:0 10px 10px!important;
  }

  .product-cart-line{
    margin-top:6px!important;
    min-height:54px!important;
    padding:10px 48px 10px 12px!important;
    border-radius:12px!important;
    background:#F6F3EE!important;
  }

  .product-cart-line-copy{
    gap:0!important;
  }

  .product-cart-line-copy strong{
    font-size:12.5px!important;
    line-height:1.32!important;
    font-weight:500!important;
    color:#4B4B4B!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
  }

  .product-cart-line-copy small{
    display:none!important;
  }

  .product-cart-line-qty{
    width:26px!important;
    height:26px!important;
    right:12px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    font-size:13px!important;
    font-weight:900!important;
  }
}


/* v111 - modern light toasts */
.toast,
#toast,
.app-toast,
.cart-toast,
.added-toast,
.notification-toast{
  position:fixed!important;
  left:50%!important;
  bottom:calc(22px + env(safe-area-inset-bottom,0px))!important;
  transform:translateX(-50%) translateY(0)!important;
  z-index:10000!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:12px!important;
  min-height:54px!important;
  max-width:min(calc(100vw - 28px), 520px)!important;
  width:max-content!important;
  padding:12px 16px!important;
  padding-left:14px!important;
  border-radius:18px!important;
  border:1px solid rgba(255,122,0,.18)!important;
  background:rgba(255,255,255,.94)!important;
  color:#202020!important;
  box-shadow:0 12px 34px rgba(0,0,0,.12)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:850!important;
  letter-spacing:0!important;
  overflow:hidden!important;
  animation:modernToastIn .22s cubic-bezier(.22,.61,.36,1)!important;
}
.toast::before,
#toast::before,
.app-toast::before,
.cart-toast::before,
.added-toast::before,
.notification-toast::before{
  content:'notifications';
  font-family:'Material Symbols Rounded';
  font-weight:normal;
  font-style:normal;
  font-size:20px;
  line-height:1;
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:color-mix(in srgb,var(--brand,#FF7A00) 16%, white)!important;
  color:var(--brand,#FF7A00)!important;
}
.toast.cart-added-toast,
.cart-added-toast{
  border-color:rgba(34,197,94,.16)!important;
  background:rgba(255,255,255,.96)!important;
}
.toast.cart-added-toast::before,
.cart-added-toast::before{
  content:'check_circle';
  background:rgba(34,197,94,.14)!important;
  color:#16A34A!important;
}
.toast.hidden,
#toast.hidden,
.app-toast.hidden,
.cart-toast.hidden,
.added-toast.hidden,
.notification-toast.hidden{display:none!important}
@keyframes modernToastIn{
  from{opacity:0;transform:translateX(-50%) translateY(12px) scale(.98)}
  to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}
}
@media(max-width:820px){
  .toast,
  #toast,
  .app-toast,
  .cart-toast,
  .added-toast,
  .notification-toast{
    bottom:calc(86px + env(safe-area-inset-bottom,0px))!important;
    max-width:calc(100vw - 22px)!important;
    width:auto!important;
    min-height:50px!important;
    padding:11px 14px!important;
    gap:10px!important;
    border-radius:16px!important;
    font-size:12.5px!important;
  }
  .toast::before,
  #toast::before,
  .app-toast::before,
  .cart-toast::before,
  .added-toast::before,
  .notification-toast::before{
    width:28px;
    height:28px;
    flex-basis:28px;
    font-size:18px;
  }
}

/* v112 - cart-added item count text black */
.toast.cart-added-toast .cart-added-copy small{color:#111!important;}

/* v113 - prevent Material Symbols ligature names flashing before icon font loads */
html.material-symbols-loading .material-symbols-rounded{visibility:hidden!important}


/* v120 - required state wording/focus polish */
.product-dialog-body .required-status.pending{
  color:#9A4300!important;
  background:#FFF0DF!important;
  border:1.5px solid #FF9A3D!important;
  font-size:9.5px!important;
  padding:4px 8px!important;
  box-shadow:0 2px 8px rgba(255,122,0,.10)!important;
}
.product-dialog-body .required-status.completed{
  color:#08783F!important;
  background:#EAF8EF!important;
  border:1.5px solid #8FD7AC!important;
  font-size:9.5px!important;
  padding:4px 8px!important;
  box-shadow:0 2px 8px rgba(22,163,74,.08)!important;
}
.product-dialog-body .validation-error{
  border:2px solid var(--brand,#FF7A00)!important;
  background:#FFF7EF!important;
  box-shadow:0 0 0 5px rgba(255,122,0,.18),0 12px 28px rgba(255,122,0,.12)!important;
  animation:requiredAttentionV120 1.35s ease-in-out 2!important;
}
@keyframes requiredAttentionV120{
  0%,100%{transform:scale(1);box-shadow:0 0 0 4px rgba(255,122,0,.12),0 10px 24px rgba(255,122,0,.08)}
  50%{transform:scale(1.012);box-shadow:0 0 0 8px rgba(255,122,0,.22),0 14px 32px rgba(255,122,0,.15)}
}