/* Original Wonder Airways seat plans. Every selector is section-scoped. */
#voyager-seatmaps {
  --vsm-ink: #183b4d;
  --vsm-muted: #506b78;
  padding: clamp(36px, 5vw, 72px) 5%;
  color: var(--vsm-ink);
  background: #eef3f5;
  font-family: Arial, Helvetica, sans-serif;
}
#voyager-seatmaps, #voyager-seatmaps * { box-sizing: border-box; }
#voyager-seatmaps .vsm-intro { max-width: 930px; margin: 0 0 20px; }
#voyager-seatmaps .vsm-eyebrow { margin: 0 0 16px; font-size: 12px; font-weight: 600; line-height: 1.5; letter-spacing: 1.8px; }
#voyager-seatmaps h2 { margin: 0 0 15px; font-size: clamp(32px,4vw,53px); font-weight: 400; letter-spacing: -1.7px; line-height: 1.08; }
#voyager-seatmaps .vsm-lead { margin: 0 0 14px; font-size: 18px; line-height: 1.5; }
#voyager-seatmaps .vsm-note { max-width: 880px; margin: 0; border-left: 2px solid #7b9fae; padding-left: 13px; font-size: 14px; line-height: 1.65; color: var(--vsm-muted); text-transform: none; }
#voyager-seatmaps .vsm-services { display: flex; flex-wrap: wrap; gap: 12px 25px; margin: 23px 0 25px; padding: 0; list-style: none; font-size: 14px; color: #3f6275; }
#voyager-seatmaps .vsm-services li { display: flex; align-items: center; gap: 7px; }
#voyager-seatmaps .vsm-cards { display: grid; gap: 25px; min-width: 0; }
#voyager-seatmaps .vsm-card { min-width: 0; padding: 25px 27px 19px; background: #fff; border: 1px solid #cad9e1; border-radius: 15px; }
#voyager-seatmaps .vsm-card-heading { display: flex; justify-content: space-between; align-items: start; flex-wrap: wrap; gap: 10px 20px; margin-bottom: 18px; }
#voyager-seatmaps h3 { margin: 0; font-size: clamp(27px,2.5vw,35px); line-height: 1.2; font-weight: 400; letter-spacing: -1.1px; }
#voyager-seatmaps h3 span { font-weight: 700; }
#voyager-seatmaps .vsm-body-type { margin: 2px 0 0; color: var(--vsm-muted); font-size: 14px; line-height: 1.6; }
#voyager-seatmaps .vsm-totals { margin: 7px 0 0; color: #476879; font-size: 14px; line-height: 1.5; text-transform: none !important; }
#voyager-seatmaps .vsm-figure { margin: 0; min-width: 0; }
#voyager-seatmaps .vsm-map-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 14px; border: 1px solid #d9e4e9; border-bottom: 0; border-radius: 10px 10px 0 0; background: #f7fafb; }
#voyager-seatmaps .vsm-map-status { color: #5a7380; font-size: 13px; line-height: 1.5; }
#voyager-seatmaps button { font-family: inherit; font-size: 14px; color: var(--vsm-ink); cursor: pointer; }
#voyager-seatmaps .vsm-enlarge { display: inline-flex; gap: 8px; align-items: center; flex-shrink: 0; border: 0; background: transparent; padding: 9px 0 9px 9px; min-height: 40px; }
#voyager-seatmaps .vsm-enlarge:hover { color: #267984; text-decoration: underline; }
#voyager-seatmaps .vsm-plan { background: #fbfdfe; border: 1px solid #d9e4e9; border-radius: 0 0 10px 10px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-color: #91aab8 #eaf1f5; padding: 6px 12px 8px; }
#voyager-seatmaps .vsm-map { display: block; width: 100%; min-width: max(890px, calc(var(--vsm-native-width) * .86)); height: auto; max-width: none; }
#voyager-seatmaps .vsm-scroll-hint { margin: 7px 0 0; font-size: 12px; line-height: 1.5; color: var(--vsm-muted); }
#voyager-seatmaps .vsm-legend { display: flex; flex-wrap: wrap; gap: 9px 25px; list-style: none; padding: 0; margin: 15px 0 0; font-size: 14px; line-height: 1.5; }
#voyager-seatmaps .vsm-legend li { display: inline-flex; align-items: center; gap: 7px; flex-wrap: wrap; }
#voyager-seatmaps .vsm-pattern { color: #3f6371; font-variant-numeric: tabular-nums; white-space: nowrap; }
#voyager-seatmaps .vsm-swatch { width: 16px; height: 17px; border: 1px solid; border-radius: 4px 4px 3px 3px; box-shadow: inset 0 -4px 0 #ffffff5a; }
#voyager-seatmaps .vsm-swatch--business { background: #668495; border-color: #213f53; }
#voyager-seatmaps .vsm-swatch--economy { background: #e4eeec; border-color: #739694; }
#voyager-seatmaps .vsm-swatch--premium { background: #91c0be; border-color: #376a70; }
#voyager-seatmaps .vsm-swatch--first { background: #dbcba9; border-color: #867249; }
#voyager-seatmaps .vsm-description { margin: 13px 0 0; font-size: 14px; line-height: 1.6; color: var(--vsm-muted); }
#voyager-seatmaps .vsm-description summary { cursor: pointer; width: fit-content; padding-block: 5px; }
#voyager-seatmaps .vsm-description p { max-width: 800px; margin: 8px 0; }
#voyager-seatmaps .vsm-decks { display: grid; gap: 27px; }
#voyager-seatmaps .vsm-deck { min-width: 0; }
#voyager-seatmaps h4 { margin: 0 0 12px; font-size: 18px; font-weight: 600; }
#voyager-seatmaps .vsm-deck-note { margin: -5px 0 22px; color: var(--vsm-muted); font-size: 14px; line-height: 1.65; }
#voyager-seatmaps .vsm-dialog { width: min(96vw,1450px); max-width: none; max-height: 92vh; margin: auto; padding: 22px; border: 1px solid #8ea8b7; border-radius: 14px; color: var(--vsm-ink); background: #fff; box-shadow: 0 24px 100px #1029364d; }
#voyager-seatmaps .vsm-dialog::backdrop { background: #10293699; }
#voyager-seatmaps .vsm-dialog-heading { display: flex; justify-content: space-between; gap: 15px; align-items: center; }
#voyager-seatmaps .vsm-dialog h3 { font-size: 24px; line-height: 1.3; letter-spacing: -.5px; }
#voyager-seatmaps .vsm-close { background: #f3f7f9; border: 1px solid #bcced8; border-radius: 7px; padding: 9px 13px; min-height: 42px; display: flex; align-items: center; gap: 10px; }
#voyager-seatmaps .vsm-close span:last-child { font-size: 23px; line-height: 1; }
#voyager-seatmaps .vsm-zoom-tools { display: flex; gap: 6px; align-items: center; margin-top: 17px; flex-wrap: wrap; }
#voyager-seatmaps .vsm-zoom-tools button { height: 42px; min-width: 42px; border: 1px solid #b4c9d5; background: #f5f9fb; border-radius: 7px; padding: 5px 12px; }
#voyager-seatmaps .vsm-zoom-tools button:disabled { opacity: .4; cursor: default; }
#voyager-seatmaps .vsm-zoom-value { width: 60px; text-align: center; font-size: 14px; font-variant-numeric: tabular-nums; }
#voyager-seatmaps .vsm-dialog-hint { margin: 12px 0 14px; font-size: 14px; line-height: 1.5; color: var(--vsm-muted); }
#voyager-seatmaps .vsm-dialog-scroll { overflow: auto; max-height: 66vh; border: 1px solid #cbdce5; border-radius: 8px; background: #fbfdfe; padding: 10px; overscroll-behavior: contain; }
#voyager-seatmaps .vsm-dialog-map { min-width: 0; margin-inline: auto; }
#voyager-seatmaps .vsm-dialog .vsm-map { width: 100%; min-width: 0; max-width: none; }
#voyager-seatmaps :is(button,summary,.vsm-plan,.vsm-dialog-scroll):focus-visible { outline: 3px solid #206884; outline-offset: 3px; }
@media(max-width:700px) {
  #voyager-seatmaps { padding: 35px 14px; }
  #voyager-seatmaps h2 { letter-spacing: -1px; }
  #voyager-seatmaps .vsm-card { padding: 19px 13px 15px; border-radius: 12px; }
  #voyager-seatmaps .vsm-card-heading { display: block; margin-bottom: 13px; }
  #voyager-seatmaps .vsm-body-type { margin-top: 8px; }
  #voyager-seatmaps .vsm-services { gap: 10px 18px; }
  #voyager-seatmaps .vsm-map-toolbar { padding: 5px 9px; gap: 8px; }
  #voyager-seatmaps .vsm-map-status { font-size: 12px; }
  #voyager-seatmaps .vsm-plan { padding: 8px; }
  #voyager-seatmaps .vsm-map { min-width: var(--vsm-native-width); }
  #voyager-seatmaps .vsm-enlarge { font-size: 13px; min-height: 44px; }
  #voyager-seatmaps .vsm-dialog { padding: 16px 12px; width: 96vw; }
  #voyager-seatmaps .vsm-dialog h3 { font-size: 20px; }
  #voyager-seatmaps .vsm-dialog-scroll { max-height: 60vh; }
  #voyager-seatmaps .vsm-close { padding: 7px 10px; }
}
@media(prefers-contrast:more) {
  #voyager-seatmaps .vsm-card, #voyager-seatmaps .vsm-plan { border-color: #456779; }
  #voyager-seatmaps .vsm-map-status, #voyager-seatmaps .vsm-note { color: #284b5f; }
}

/* Compact inline previews; the enlarged dialog retains its original sizing. */
#voyager-seatmaps .vsm-plan > .vsm-map {
  width: calc(var(--vsm-native-width) * .65);
  min-width: 0;
  height: auto;
}

/* Fit the complete aircraft to desktop previews; preserve mobile panning. */
@media (min-width: 701px) {
  #voyager-seatmaps .vsm-figure:is([data-map-id="v250"], [data-map-id="v250ex"], [data-map-id="v310"], [data-map-id="v320"], [data-map-id="v400lower"], [data-map-id="v400upper"]) .vsm-plan > .vsm-map {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    height: auto;
  }
}
