/* Fictional gallery only: keep forms inside the phone viewport. */
.travel-capture [data-slot="dialog-overlay"][data-state="open"] {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: #07172b99;
}
.travel-capture [data-slot="dialog-content"][data-state="open"] {
  position: fixed;
  inset: 14px 12px auto;
  z-index: 1001;
  display: grid;
  gap: 16px;
  width: auto;
  max-width: none;
  max-height: calc(100vh - 28px);
  padding: 24px 18px;
  overflow-y: auto;
  transform: none;
  opacity: 1;
  background: #fff;
  color: #10243f;
  border: 1px solid #dce3ed;
  border-radius: 18px;
  box-shadow: 0 16px 55px #07172b55;
}
.travel-capture [data-slot="dialog-title"] {
  margin: 0 32px 6px 0;
  font: bold 24px Georgia, serif;
}
.travel-capture [data-slot="dialog-close"] {
  position: absolute;
  right: 12px;
  top: 14px;
  padding: 5px;
  background: #f1f5f9;
  border: 0;
  border-radius: 8px;
}
.travel-capture [data-slot="dialog-close"] svg {width: 20px; height: 20px;}
.travel-capture [data-slot="dialog-close"] .sr-only {display: none;}
.travel-capture [data-slot="dialog-content"] input,
.travel-capture [data-slot="dialog-content"] textarea,
.travel-capture [data-slot="dialog-content"] select {
  width: 100%;
  min-height: 40px;
  padding: 9px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: #10243f;
  font: 14px Arial, sans-serif;
}
.travel-capture [data-slot="dialog-content"] textarea {min-height: 75px;}
.travel-capture .form-grid {gap: 12px;}
.travel-capture .form-grid button[type="submit"] {
  padding: 12px;
  border: 0;
  border-radius: 9px;
  background: #c99a45;
  color: #10243f;
  font-weight: bold;
}
.travel-capture[data-gallery-screen="itinerary"] #travel-backup-panel,
.travel-capture[data-gallery-screen="itinerary"] .trip-rail,
.travel-capture[data-gallery-screen="itinerary"] .trip-banner,
.travel-capture[data-gallery-screen="itinerary"] .trip-tools {display: none;}
.travel-capture[data-gallery-screen="itinerary"] .trip-main {padding-top: 14px;}

/* Boarding passes must be visible without a timed scroll after React mounts. */
.travel-capture[data-gallery-screen="boarding"] #travel-backup-panel,
.travel-capture[data-gallery-screen="boarding"] .trip-rail,
.travel-capture[data-gallery-screen="boarding"] .trip-banner,
.travel-capture[data-gallery-screen="boarding"] .trip-tools,
.travel-capture[data-gallery-screen="boarding"] .timeline-date,
.travel-capture[data-gallery-screen="boarding"] .type-icon,
.travel-capture[data-gallery-screen="boarding"] .reservation-card > :not(.boarding-passes) {display: none;}
.travel-capture[data-gallery-screen="boarding"] .trip-main {padding: 14px 13px;}
.travel-capture[data-gallery-screen="boarding"] .reservation {display: block;}
.travel-capture[data-gallery-screen="boarding"] .boarding-passes {
  border-top: 0;
  margin-top: 0;
  padding-top: 0;
  scroll-margin-top: 90px;
}