/**
 * Full-height sheets — top anchor, unified body scroll, pinned close (×).
 * Used by guest info/dish modals, chef birthday, cashier sheets.
 */

/* —— Shell: anchor to top (avoids header clipped on compact viewports) —— */
.sheet.info-modal[data-venue-info-modal],
.sheet.order-sheet[data-order-sheet],
.sheet.dish-modal,
.sheet.dish-info-modal,
body.guest-menu .sheet.chef-bday-modal,
body.staff-page-cashier .sheet.chef-bday-modal,
body.staff-page-cashier .sheet.restaurant-gate-sheet,
body.staff-page-cashier .modal-overlay .modal,
body.staff-page-cashier .app-modal-overlay .app-modal,
body.staff-page-cashier .tm-variant-sheet {
  top: 0;
  bottom: auto;
  overflow: hidden;
}

/* —— Unified scroll: hero + content scroll together —— */
.sheet.info-modal[data-venue-info-modal] .sheet-body,
.sheet.order-sheet[data-order-sheet] .sheet-body,
.sheet.dish-modal .sheet-body,
.sheet.dish-info-modal .sheet-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* —— Floating close (hero overlays) —— */
.sheet-close-floating,
.info-modal-close-floating,
.dish-modal-close-floating {
  position: absolute;
  right: 12px;
  top: var(--header-chrome-modal-close-top, 12px);
  z-index: 3;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  flex-shrink: 0;
}

.sheet-close-floating:hover,
.sheet-close-floating:active,
.info-modal-close-floating:hover,
.info-modal-close-floating:active,
.dish-modal-close-floating:hover,
.dish-modal-close-floating:active {
  background: rgba(0, 0, 0, 0.65);
}

/* Pin × while sheet is open */
.sheet.open .sheet-close-floating,
.sheet.open .info-modal-close-floating,
.sheet.open .dish-modal-close-floating,
.sheet.open .order-sheet-close,
.sheet.open .chef-bday-sheet-header > .sheet-close {
  position: fixed;
  top: max(var(--header-chrome-modal-close-top, 12px), env(safe-area-inset-top, 0px));
  right: max(12px, env(safe-area-inset-right, 0px));
  z-index: 10002;
}

/* Cashier full-height overlays (use .hidden, not .open) */
body.staff-page-cashier .modal-overlay:not(.hidden) .torbeens-header--modal .modal-close,
body.staff-page-cashier .modal-overlay:not(.hidden) .modal-header .modal-close,
body.staff-page-cashier .app-modal-overlay:not(.hidden) .app-modal-close,
body.staff-page-cashier .tm-variant-overlay:not(.hidden) .modal-close {
  position: fixed;
  top: max(var(--header-chrome-modal-close-top, 12px), env(safe-area-inset-top, 0px));
  right: max(12px, env(safe-area-inset-right, 0px));
  z-index: 10003;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

body.staff-page-cashier .modal-overlay:not(.hidden) .torbeens-header--modal .modal-close:hover,
body.staff-page-cashier .modal-overlay:not(.hidden) .torbeens-header--modal .modal-close:active,
body.staff-page-cashier .modal-overlay:not(.hidden) .modal-header .modal-close:hover,
body.staff-page-cashier .modal-overlay:not(.hidden) .modal-header .modal-close:active,
body.staff-page-cashier .app-modal-overlay:not(.hidden) .app-modal-close:hover,
body.staff-page-cashier .app-modal-overlay:not(.hidden) .app-modal-close:active,
body.staff-page-cashier .tm-variant-overlay:not(.hidden) .modal-close:hover,
body.staff-page-cashier .tm-variant-overlay:not(.hidden) .modal-close:active {
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
}

/* Variant picker: scroll content, keep close pinned */
body.staff-page-cashier .tm-variant-sheet:not(:has(.torbeens-header--modal)) {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-top: max(calc(var(--header-chrome-modal-close-top, 12px) + 44px), calc(env(safe-area-inset-top, 0px) + 44px));
}
