/* Impeccable adapt pass: shared layout guardrails across public, checkout, and admin surfaces. */
:root {
  --fs-page-gutter: clamp(16px, 4vw, 32px);
  --fs-touch-target: 44px;
  --fs-radius: 7px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  overflow-x: hidden;
}

img,
svg,
video,
canvas,
iframe {
  max-width: 100%;
}

button,
input,
select,
textarea,
a {
  -webkit-tap-highlight-color: transparent;
}

input,
select,
textarea {
  min-width: 0;
  font-size: 16px;
}

.site-header {
  position: relative;
}

.site-nav,
.site-links,
.mobile-menu,
.footer-grid,
.form-grid,
.checkout-row,
.guest-card,
.booking-types,
.barkada-options,
.payment-methods,
.qr-preview,
.manage-card,
.auth-card,
.admin-topbar,
.view-header,
.workspace-grid,
.dashboard-attention,
.dashboard-detail-grid,
.event-editor,
.booking-filters,
.promoter-toolbar,
.table-editor-header,
.tables-workspace .admin-layout {
  min-width: 0;
}

.site-logo,
.site-link,
.mobile-menu .site-link,
.topbar-title,
.topbar-meta,
.view-title,
.ticket-copy,
.checkout-note,
.gallery-status,
.footer-copy {
  overflow-wrap: anywhere;
}

.site-logo {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.site-link,
.site-action,
.menu-toggle,
.mobile-menu .site-link,
.mobile-menu .site-action,
.checkout-actions button,
.package-button,
.payment-method,
.reserve-button,
.next-button,
.back-button,
.manage-button,
.auth-button,
.action-button,
.admin-button,
.quick-action {
  touch-action: manipulation;
}

.mobile-menu .site-link,
.mobile-menu .site-action {
  min-height: var(--fs-touch-target);
}

.turnstile-widget,
.cf-turnstile {
  max-width: 100%;
  overflow: hidden;
}

.booking-table,
.booking-list,
.payment-list,
.promoter-list,
.event-list,
.table-inventory,
.table-inventory-panel,
.workspace-panel,
.booking-details-panel {
  min-width: 0;
}

@media (pointer: coarse), (max-width: 820px) {
  .site-link,
  .site-action,
  .menu-toggle,
  .mobile-menu .site-link,
  .mobile-menu .site-action,
  .checkout-actions button,
  .package-button,
  .payment-method,
  .reserve-button,
  .next-button,
  .back-button,
  .manage-button,
  .auth-button,
  .action-button,
  .admin-button,
  .quick-action {
    min-height: var(--fs-touch-target);
  }

  input,
  select,
  textarea {
    min-height: var(--fs-touch-target);
  }
}

@media (max-width: 820px) {
  main,
  .admin-content,
  .gallery-intro,
  .manage-shell,
  .auth-shell {
    max-width: 100%;
  }

  .dashboard-attention,
  .workspace-grid,
  .dashboard-detail-grid,
  .event-editor,
  .tables-workspace .admin-layout {
    grid-template-columns: 1fr !important;
  }

  .custom-promo-row,
  .event-row,
  .table-inventory-row {
    grid-template-columns: 1fr !important;
  }

  .capacity-field,
  .custom-promo-row input,
  .custom-promo-row select,
  .promoter-actions .action-button,
  .table-inventory-row input,
  .table-inventory-row select {
    min-height: var(--fs-touch-target) !important;
  }

  .custom-promo-toolbar,
  .promoter-toolbar {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 560px) {
  :root {
    --fs-page-gutter: 12px;
  }

  .site-nav {
    width: 100%;
  }

  body:has(.menu-toggle) .site-nav {
    height: 54px;
    min-height: 54px;
    align-items: center;
    flex-direction: row;
    gap: 18px;
    padding: 0 10px 0 18px;
  }

  body:has(.menu-toggle) .site-links {
    display: none;
  }

  body:has(.menu-toggle) .menu-toggle {
    width: var(--fs-touch-target);
    min-height: var(--fs-touch-target);
    display: inline-flex;
    flex: 0 0 auto;
  }

  body:has(.menu-toggle) .mobile-menu {
    display: grid;
  }

  .site-links {
    align-items: stretch;
  }

  .site-link {
    min-width: 0;
    white-space: normal;
  }

  .checkout-actions,
  .button-row,
  .topbar-actions,
  .promoter-actions,
  .booking-actions,
  .form-actions {
    flex-wrap: wrap;
  }

  .checkout-actions button,
  .button-row > *,
  .form-actions > * {
    min-width: min(100%, 180px);
  }

  .footer-link {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
  }
}

@media (max-width: 420px) {
  .site-logo {
    max-width: 58vw;
  }

  .footer-grid {
    grid-template-columns: 1fr !important;
  }

  .checkout-actions {
    grid-template-columns: 1fr !important;
  }

  .checkout-actions button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
  }
}