
.zz100-menu *{box-sizing:border-box;font-family:inherit;}
.zz100-menu h2,.zz100-menu h3,.zz100-menu h4{font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;}
.zz100-menu{max-width:1200px;margin:0 auto;padding:0 16px 16px;}
/* Sidebar visuals; geometry is defined in the CSS-only layout section below. */
.zz100-menu .zz-sidebar{border-right:1px solid #e5e7eb;padding:16px 0;background:#f5f5f5;scrollbar-width:none;-ms-overflow-style:none;}
.zz100-menu .zz-sidebar::-webkit-scrollbar{display:none;}
.zz100-menu.zz-dark .zz-sidebar{border-right-color:#333;background:#222;}
.zz100-menu .zz-sidebar-title{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#9ca3af;padding:0 20px 12px;}
.zz100-menu .zz-sidebar-link{display:block;width:100%;text-align:left;background:none;border:none;padding:10px 20px;font-size:.78rem;color:#374151;cursor:pointer;border-bottom:1px solid #f3f4f6;line-height:1.4;}
.zz100-menu .zz-sidebar-link:last-child{border-bottom:none;}
.zz100-menu .zz-sidebar-link:hover,.zz100-menu .zz-sidebar-link.zz-active{color:var(--zz-price-color,#ab8b65);font-weight:600;}
.zz100-menu.zz-dark .zz-sidebar-link{color:#ccc;border-bottom-color:#2a2a2a;}
.zz100-menu.zz-dark .zz-sidebar-link:hover,.zz100-menu.zz-dark .zz-sidebar-link.zz-active{color:var(--zz-price-color,#ab8b65);}
@media(min-width:700px){
.zz100-menu .zz-cat-menu-wrap{display:none;}
}
@media(max-width:699px){
.zz100-menu .zz-sidebar{display:none;}
.zz100-menu .zz-content{padding:0;}
}
.zz100-menu.zz-dark{background:#1a1a1a;color:#e5e5e5;}
.zz100-menu .zz-sticky{position:sticky;top:0;z-index:10000;background:#fff;padding:12px 16px 0;}
.zz100-menu.zz-dark .zz-sticky{background:#1a1a1a;}
.zz100-menu .zz-sticky-spacer{display:none;}
.zz100-menu .zz-sticky-clip{display:none;}
.zz100-menu .zz-toolbar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:10px;align-items:center;}
.zz100-menu .zz-search{flex:1;min-width:180px;padding:9px 14px;border:1px solid #d1d5db;font-size:.9rem;outline:none;background:#fff;color:#111;}
.zz100-menu .zz-search:focus{border-color:#ab8b65;outline:2px solid rgba(171,139,101,.2);}
.zz100-menu.zz-dark .zz-search{background:#2a2a2a;border-color:#444;color:#e5e5e5;}
.zz100-menu .zz-lang-btn{padding:7px 14px;border:1px solid #ab8b65;background:#fff;font-size:.82rem;cursor:pointer;font-weight:600;color:#ab8b65;}
.zz100-menu .zz-lang-btn:hover{background:#ab8b65;color:#fff;}
.zz100-menu.zz-dark .zz-lang-btn{background:#2a2a2a;border-color:#ab8b65;color:#ab8b65;}
.zz100-menu .zz-pdf-btn{padding:7px 14px;border:1px solid #d1d5db;background:#fff;font-size:.82rem;cursor:pointer;font-weight:600;color:#374151;display:inline-flex;align-items:center;gap:5px;}
.zz100-menu .zz-pdf-btn:hover{background:#f9fafb;}
.zz100-menu .zz-pdf-btn:disabled{opacity:.5;cursor:not-allowed;}
.zz100-menu.zz-dark .zz-pdf-btn{background:#2a2a2a;border-color:#444;color:#e5e5e5;}
.zz100-menu.zz-dark .zz-pdf-btn:hover{background:#333;}
.zz100-menu .zz-cat-menu-wrap{position:relative;}
.zz100-menu .zz-cat-menu-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:1px solid #d1d5db;background:#fff;color:#374151;cursor:pointer;flex-shrink:0;}
.zz100-menu.zz-dark .zz-cat-menu-btn{background:#2a2a2a;border-color:#444;color:#e5e5e5;}
.zz100-menu .zz-cat-menu-btn:hover{background:#f9fafb;}
.zz100-menu.zz-dark .zz-cat-menu-btn:hover{background:#333;}
.zz100-menu .zz-cat-menu-icon{display:flex;flex-direction:column;gap:3px;width:14px;}
.zz100-menu .zz-cat-menu-icon span{display:block;height:2px;background:currentColor;border-radius:2px;}
.zz100-menu .zz-cat-dropdown{position:absolute;top:calc(100% + 4px);left:0;min-width:220px;z-index:200;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 4px 16px rgba(0,0,0,.1);overflow-y:auto;max-height:260px;}
.zz100-menu.zz-dark .zz-cat-dropdown{background:#1e1e1e;border-color:#333;}
.zz100-menu .zz-cat-dropdown.zz-hidden{display:none!important;}
.zz100-menu .zz-cat-nav-btn{display:flex;align-items:center;gap:10px;padding:11px 16px;width:100%;border:none;background:transparent;font-size:.88rem;color:#374151;cursor:pointer;text-align:left;border-bottom:1px solid #f3f4f6;}
.zz100-menu .zz-cat-nav-btn:last-child{border-bottom:none;}
.zz100-menu .zz-cat-nav-btn:hover{background:#f9fafb;}
.zz100-menu.zz-dark .zz-cat-nav-btn{color:#e5e5e5;border-bottom-color:#2a2a2a;}
.zz100-menu.zz-dark .zz-cat-nav-btn:hover{background:#2a2a2a;}
.zz100-menu .zz-filter-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;}
.zz100-menu .zz-chip{padding:5px;border:1px solid #d1d5db;font-size:.8rem;cursor:pointer;background:#fff;color:#374151;transition:all .15s;}
.zz100-menu .zz-chip:hover,.zz100-menu .zz-chip.zz-on{background:#ab8b65;color:#fff;border-color:#ab8b65;}
.zz100-menu.zz-dark .zz-chip{background:#2a2a2a;border-color:#555;color:#ccc;}
.zz100-menu.zz-dark .zz-chip.zz-on{background:#e5e5e5;color:#111;border-color:#e5e5e5;}
.zz100-menu .zz-allergen-toggle{padding:5px;border:1px solid #d1d5db;border-radius:0;font-size:.8rem;cursor:pointer;display:inline-flex;align-items:center;gap:5px;background:#fff;color:#374151;transition:all .15s;}
.zz100-menu .zz-allergen-toggle.zz-on-red{background:#7a5e3a;color:#fff;border-color:#7a5e3a;}
.zz100-menu.zz-dark .zz-allergen-toggle{background:#2a2a2a;border-color:#444;color:#e5e5e5;}
.zz100-menu .zz-allergen-panel{padding:12px;border:1px solid #e5e7eb;border-radius:0;margin-top:8px;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px;}
.zz100-menu .zz-allergen-panel.zz-hidden{display:none!important;}
.zz100-menu .zz-a-chip{padding:5px 10px;border:1px solid #d1d5db;border-radius:0;font-size:.75rem;cursor:pointer;background:#fff;color:#374151;}
.zz100-menu .zz-a-chip.zz-on{background:#7a5e3a;color:#fff;border-color:#7a5e3a;}
.zz100-menu .zz-badge-toggle{padding:5px;border:1px solid #d1d5db;border-radius:0;font-size:.8rem;cursor:pointer;display:inline-flex;align-items:center;gap:5px;background:#fff;color:#374151;transition:all .15s;}
.zz100-menu .zz-badge-toggle.zz-on-badge{background:#ab8b65;color:#fff;border-color:#ab8b65;}
.zz100-menu.zz-dark .zz-badge-toggle{background:#2a2a2a;border-color:#444;color:#e5e5e5;}
.zz100-menu .zz-badge-panel{padding:12px;border:1px solid #e5e7eb;border-radius:0;margin-top:8px;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px;}
.zz100-menu .zz-badge-panel.zz-hidden{display:none!important;}
.zz100-menu .zz-b-chip{padding:5px 10px;border:1px solid #d1d5db;border-radius:0;font-size:.75rem;cursor:pointer;background:#fff;color:#374151;}
.zz100-menu .zz-b-chip.zz-on{background:#ab8b65;color:#fff;border-color:#ab8b65;}
.zz100-menu.zz-dark .zz-b-chip{background:#2a2a2a;border-color:#444;color:#ccc;}
.zz100-menu.zz-dark .zz-b-chip.zz-on{background:#ab8b65;color:#fff;border-color:#ab8b65;}
.zz100-menu .zz-hidden-count{font-size:.78rem;color:#9ca3af;margin-top:6px;}
.zz100-menu .zz-sticky-border{border-bottom:1px solid #e5e7eb;margin-bottom:16px;}
.zz100-menu.zz-dark .zz-sticky-border{border-bottom-color:#333;}
/* No card effect: no border, no background, no border-radius on sections */
.zz100-menu .zz-category{margin-bottom:5px;border:none;border-radius:0;overflow:visible;}
.zz100-menu .zz-cat-hdr{display:flex;align-items:center;gap:10px;padding:10px 0;cursor:pointer;background:transparent;border:none;width:100%;text-align:left;font-size:.95rem;font-weight:700;color:#111;user-select:none;margin:0;}
@media(min-width:700px){.zz100-menu .zz-cat-hdr[aria-expanded="true"]{padding-top:28px;}}
.zz100-menu.zz-dark .zz-cat-hdr{background:transparent;color:#e5e5e5;}
.zz100-menu .zz-cat-hdr-title{font-size:24px!important;font-weight:700!important;margin:0;padding:0;flex:1;text-align:center;color:var(--zz-price-color,#ab8b65)!important;}
/* No hover background on title */
.zz100-menu .zz-cat-hdr:hover{background:transparent;}
.zz100-menu .zz-cat-count{font-size:.72rem;font-weight:400;color:#9ca3af;margin-left:auto;}
/* +/- toggle button with light grey background, at the left replacing the icon */
.zz100-menu .zz-cat-arrow{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;min-width:24px;background:none;border-radius:4px;font-size:1rem;font-weight:400;line-height:1;color:#555;margin-right:10px;margin-left:0;transition:background .15s;}
.zz100-menu.zz-dark .zz-cat-arrow{background:#2a2a2a;color:#aaa;}
/* Separator div below title */
.zz100-menu .zz-cat-sep{height:8px;border-top:1px solid #e0dede;border-bottom:1px solid #e0dede;margin-bottom:0;}
.zz100-menu.zz-dark .zz-cat-sep{border-color:#3a3a3a;}
.zz100-menu .zz-dish-list{display:flex;flex-direction:column;margin-top:0;}
/* Dish row: body on left (flex), then price, then image on right */
.zz100-menu .zz-dish{background:transparent;padding:14px 0;display:flex;align-items:flex-start;gap:12px;border-bottom:1px solid #f3f4f6;}
.zz100-menu .zz-dish:last-child{border-bottom:none;}
.zz100-menu.zz-dark .zz-dish{background:transparent;border-bottom-color:#2a2a2a;}
/* Square photos on the right */
.zz100-menu .zz-dish-img{width:80px;height:80px;min-width:80px;object-fit:cover;border-radius:0;order:3;flex-shrink:0;}
/* Light grey placeholder when no image */
.zz100-menu .zz-dish-img-ph{display:block;width:80px;height:80px;min-width:80px;background:#f7f7f7;order:3;flex-shrink:0;}
/* Body takes available space (order 1) */
.zz100-menu .zz-dish-body{flex:1;min-width:0;order:1;}
.zz100-menu .zz-dish-name{font-size:1.05rem;margin:0 0 3px;line-height:1.3;}
.zz100-menu.zz-dark .zz-dish-name{color:#e5e5e5;}
.zz100-menu .zz-dish-desc{font-size:.8rem;color:#6b7280;margin-bottom:6px;line-height:1.4;}
/* Price column right after body (order 2), aligned to body not to image */
.zz100-menu .zz-dish-price-col{display:flex;flex-direction:column;align-items:flex-start;min-width:60px;max-width:80px;padding-top:2px;order:2;margin-right:4px;}
.zz100-menu .zz-dish-price{font-size:.85rem;font-weight:700;color:var(--zz-price-color,#ab8b65);letter-spacing:-.01em;white-space:nowrap;margin:0;}
.zz100-menu.zz-dark .zz-dish-price{color:var(--zz-price-color,#ab8b65);}
.zz100-menu .zz-price-unit{font-size:.5rem;color:#9ca3af;text-transform:uppercase;}
.zz100-menu .zz-price-secondary{font-size:.78rem;color:#6b7280;margin-top:3px;white-space:nowrap;}
.zz100-menu .zz-badges{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:4px;}
.zz100-menu .zz-badge{font-size:.68rem;padding:2px 7px;border:1px solid #e5e7eb;border-radius:999px;background:#f9fafb;color:#6b7280;}
.zz100-menu .zz-allergens-txt{font-size:.71rem;color:#9ca3af;margin-top:3px;}
.zz100-menu .zz-empty{text-align:center;padding:32px;color:#9ca3af;font-size:.9rem;}
.zz100-menu .zz-error{text-align:center;padding:40px;color:#ef4444;font-size:.9rem;}
.zz100-menu .zz-alcohol-badge{font-size:.7rem;color:#7c3aed;margin-left:4px;vertical-align:middle;}
.zz100-menu .zz-loader{padding:24px 16px;}
.zz100-menu .zz-skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:zz-shimmer 1.4s infinite;border-radius:6px;}
.zz100-menu.zz-dark .zz-skeleton{background:linear-gradient(90deg,#2a2a2a 25%,#333 50%,#2a2a2a 75%);background-size:200% 100%;}
@keyframes zz-shimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
.zz100-menu .zz-sk-bar{height:36px;margin-bottom:12px;}
.zz100-menu .zz-sk-chip-row{display:flex;gap:8px;margin-bottom:20px;}
.zz100-menu .zz-sk-chip{height:28px;width:80px;border-radius:6px;}
.zz100-menu .zz-sk-cat{height:48px;margin-bottom:10px;border-radius:6px;}
.zz100-menu .zz-sk-dish{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid #f3f4f6;}
.zz100-menu.zz-dark .zz-sk-dish{border-bottom-color:#2a2a2a;}
.zz100-menu .zz-sk-thumb{width:72px;height:72px;min-width:72px;border-radius:4px;}
.zz100-menu .zz-sk-lines{flex:1;display:flex;flex-direction:column;gap:8px;justify-content:center;}
.zz100-menu .zz-sk-line{height:12px;border-radius:4px;}
.zz100-menu .zz-sk-line.zz-w60{width:60%;}
.zz100-menu .zz-sk-line.zz-w40{width:40%;}
/*
 * Zerozero100 menu — CSS-only layout companion
 *
 * Include this file after the menu markup.
 * It replaces the viewport-coordinate layout with normal document flow:
 * - grid for the desktop sidebar/content split
 * - sticky sidebar bounded by the menu container
 * - sticky filters/search bar bounded by the content column
 *
 * The !important declarations protect the CSS-only layout from legacy inline
 * geometry if this stylesheet is temporarily used with the old menu file.
 */

.zz100-menu {
  --zz-sidebar-width: 260px;
}

@media (min-width: 700px) {
  /* The spacer only existed to compensate for the old fixed sidebar. */
  .zz100-menu .zz-sidebar-spacer {
    display: none !important;
  }

  .zz100-menu .zz-layout {
    display: grid;
    grid-template-columns: minmax(220px, var(--zz-sidebar-width)) minmax(0, 1fr);
    height: 100vh;
    min-height: 0;
    align-items: start;
  }

  .zz100-menu .zz-sidebar {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    min-width: 0;
    max-width: none;
    height: 100% !important;
    max-height: none;
    overflow-y: auto;
    align-self: start;
    z-index: 100;
  }

  .zz100-menu .zz-content {
    min-width: 0;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0 20px;
  }
}

/*
 * The clip wrapper is a normal child of .zz-content, so making the wrapper
 * sticky keeps the toolbar inside the menu's own vertical boundaries.
 */
.zz100-menu .zz-sticky-clip {
  display: block !important;
  position: sticky !important;
  top: 0 !important;
  left: auto !important;
  right: auto !important;
  height: auto !important;
  overflow: visible !important;
  pointer-events: auto !important;
  z-index: 1000;
  background: #fff;
}

.zz100-menu.zz-dark .zz-sticky-clip {
  background: #1a1a1a;
}

.zz100-menu .zz-sticky-clip .zz-sticky {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
}

/* No artificial space is needed when the bar participates in normal flow. */
.zz100-menu .zz-sticky-spacer {
  display: none !important;
  height: 0 !important;
}

.zz100-menu .zz-menu-top-gap {
  height: 20px;
}

.zz100-menu .zz-loader-gap {
  margin-bottom: 16px;
}

@media (max-width: 699px) {
  .zz100-menu {
    width: 100%;
    max-width: 100%;
    padding: 0 12px 16px;
    overflow-x: hidden;
  }

  .zz100-menu .zz-content {
    padding-left: 0;
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .zz100-menu .zz-sticky {
    padding: 10px 0 0;
  }

  .zz100-menu .zz-toolbar {
    gap: 8px;
  }

  .zz100-menu .zz-search {
    flex: 1 0 100%;
    min-width: 0;
    width: 100%;
    order: -1;
  }

  .zz100-menu .zz-lang-btn,
  .zz100-menu .zz-pdf-btn {
    flex: 0 0 auto;
  }

  .zz100-menu .zz-filter-chips {
    gap: 5px;
  }

  .zz100-menu .zz-chip,
  .zz100-menu .zz-allergen-toggle,
  .zz100-menu .zz-badge-toggle {
    font-size: .75rem;
    padding: 5px 7px;
  }

  .zz100-menu .zz-cat-dropdown {
    max-width: calc(100vw - 24px);
  }

  .zz100-menu .zz-cat-hdr {
    gap: 6px;
    padding: 9px 0;
  }

  .zz100-menu .zz-cat-hdr-title {
    font-size: 20px !important;
    line-height: 1.2 !important;
  }

  .zz100-menu .zz-cat-arrow {
    margin-right: 4px;
  }

  .zz100-menu .zz-cat-count {
    font-size: .65rem;
  }

  .zz100-menu .zz-dish {
    gap: 8px;
    padding: 12px 0;
  }

  .zz100-menu .zz-dish-img,
  .zz100-menu .zz-dish-img-ph {
    width: 64px;
    min-width: 64px;
    height: 64px;
  }

  .zz100-menu .zz-dish-price-col {
    min-width: 52px;
    max-width: 64px;
    margin-right: 0;
  }

  .zz100-menu .zz-dish-name {
    font-size: .98rem;
  }

  .zz100-menu .zz-dish-desc {
    font-size: .76rem;
  }

  .zz100-menu .zz-dish-price {
    font-size: .8rem;
  }

  .zz100-menu .zz-price-secondary {
    font-size: .7rem;
  }

  .zz100-menu .zz-price-unit {
    font-size: .46rem;
  }

  .zz100-menu .zz-allergen-panel,
  .zz100-menu .zz-badge-panel {
    padding: 9px;
    gap: 6px;
  }
}
