html.web-shell .pub-menu-page,
html.web-shell .pub-menu-header,
html.web-shell .pub-platforms,
html.web-shell .pub-menu-search-wrap,
html.web-shell .pub-cats,
html.web-shell .pub-menu-grid {
  max-width: none;
  width: 100%;
}

html.web-shell,
html.web-shell body {
  width: 100%;
  max-width: none;
}

/* Staff hub — full browser width on web */
html.web-shell .home-page {
  max-width: none;
  width: 100%;
  padding: 1.5rem clamp(1rem, 3vw, 2.5rem) 3rem;
}

html.web-shell .home-header,
html.web-shell .home-status,
html.web-shell .home-nav,
html.web-shell .home-footer {
  max-width: 90rem;
  margin-left: auto;
  margin-right: auto;
}

html.web-shell .home-nav {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
  gap: 0.85rem;
}

html.web-shell .customer-home-page {
  max-width: none;
}

/* Admin / accountant — use full viewport width */
html.web-shell .accountant-main {
  max-width: none;
  padding-left: clamp(1rem, 2vw, 2rem);
  padding-right: clamp(1rem, 2vw, 2rem);
}

html.web-shell .web-admin-page {
  max-width: none !important;
  width: 100%;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 1rem clamp(1rem, 2vw, 2rem) 2rem;
}

html.web-shell .web-admin-inner {
  max-width: 90rem;
  margin: 0 auto;
}

/* Manager / garson / kitchen — full width when opened in browser (not Capacitor) */
html.web-shell .mgr-app {
  max-width: none;
  margin: 0;
  padding-left: clamp(0.75rem, 2vw, 1.5rem);
  padding-right: clamp(0.75rem, 2vw, 1.5rem);
}

html.web-shell .inv-page {
  max-width: none;
  margin: 0;
  padding-left: clamp(0.75rem, 2vw, 1.5rem);
  padding-right: clamp(0.75rem, 2vw, 1.5rem);
}

html.web-shell .waiter-page-title,
html.web-shell .call-banner {
  max-width: none;
}

/* Customer QR pages — centered phone column even on desktop */
html.mobile-shell .home-page,
html.mobile-shell .customer-home-page {
  max-width: 28rem;
  margin: 0 auto;
}

html.mobile-shell .screen-inner {
  max-width: 28rem;
}

/* Native Capacitor apps — phone-width layout */
html.app-shell .mgr-app {
  max-width: 32rem;
  margin: 0 auto;
}

html.app-shell .home-page {
  max-width: 32rem;
  margin: 0 auto;
}

html.app-shell .inv-page {
  max-width: 32rem;
  margin: 0 auto;
}

html.app-shell .customer-home-page {
  max-width: 28rem;
  margin: 0 auto;
}
