/* TravHawk performance & mobile layout — Phase 2 point 10 */

.zfo-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Order summary / confirmation rows — horizontal scroll on narrow screens */
body.tw-zfo-order-page .zfo-order-summary,
body.tw-zfo-order-page .zfo-confirm-details {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

body.tw-zfo-order-page .zfo-order-summary-list,
body.tw-zfo-order-page .zfo-confirm-details {
  min-width: 0;
}

body.tw-zfo-order-page .zfo-confirm-row,
body.tw-zfo-order-page .zfo-order-summary-list > div {
  min-width: 260px;
}

/* Package cards — full width on small screens */
@media (max-width: 640px) {
  .tw-pkg-card,
  .tw-pkg-panel.active {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .zfo-pkg-card {
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .zfo-form-footer {
    flex-direction: column-reverse !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  .zfo-form-footer .zfo-btn {
    width: 100% !important;
    justify-content: center !important;
    min-height: 48px !important;
  }

  .zfo-two-col {
    grid-template-columns: 1fr !important;
  }

  .zfo-progress {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
  }
}

/* Touch-friendly buttons site-wide */
@media (max-width: 768px) {
  .tw-btn,
  .zfo-btn,
  button.tw-btn--primary,
  a.tw-btn--primary {
    min-height: 44px !important;
  }
}

/* Legal content tables if any */
.tw-legal-content table {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Mobile CLS — reserve space for hero, logo, topbar */
@media (max-width: 768px) {
  .tw-topbar {
    min-height: 40px;
  }

  .tw-topbar-link {
    min-height: 20px;
    line-height: 1.3;
  }

  .tw-header-inner {
    min-height: 64px;
    height: 64px;
  }

  .tw-logo-link {
    width: 160px;
    height: 44px;
  }

  .tw-logo-img {
    width: 160px;
    height: 44px;
    object-fit: contain;
  }

  #hero,
  .tw-hero {
    min-height: 560px;
  }

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

  .tw-hero__content {
    min-height: 260px;
  }
}

body.fonts-loaded {
  font-family: "Plus Jakarta Sans", "DM Sans", system-ui, -apple-system, sans-serif;
}