/* ==================================================================
   GWP ITINERARY READER — styles for the in-page itinerary reader that
   opens from the closing page's VIEW FULL ITINERARY button. Adapted
   from the supplied itinerary package (Honolulu x GWP, Montenegro
   2027), reworked for phones: one slim top bar (Contents, page picker,
   close) and one slim bottom bar (previous, Download PDF, next), with
   the page filling the full screen width. Page-image saving was
   removed for mobile performance; Download PDF is the one action.
   Generic element rules are scoped to the dialog so they can't
   restyle the closing page's button and links.
   ================================================================== */

/* Inter, self-hosted (Latin subset of the package's fonts, SIL OFL —
   see fonts/inter-OFL.txt). Separate family name so these real
   600/700 weights apply only to the closing page and reader, without
   changing how the rest of the site renders Inter. */
@font-face{font-family:"GWP Inter";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/inter-400.woff") format("woff")}
@font-face{font-family:"GWP Inter";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/inter-500.woff") format("woff")}
@font-face{font-family:"GWP Inter";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/inter-600.woff") format("woff")}
@font-face{font-family:"GWP Inter";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/inter-700.woff") format("woff")}

/* Design tokens — matched to the closing page (client mockup). */
.gwp-itinerary {
  --gwp-navy:#05161D; --gwp-gold:#CBAD6F; --gwp-gold-light:#D2B269;
  --gwp-cream:#FCF9F2; --gwp-muted:#CAD3D8; --gwp-secondary:#B1BEC6;
  --gwp-line:#ffffff25; --gwp-panel:#10313b;
  --gwp-body:"GWP Inter",Inter,Arial,sans-serif;
}
.gwp-itinerary *, .gwp-itinerary *::before, .gwp-itinerary *::after {box-sizing:border-box}
.gwp-itinerary [hidden] {display:none!important}
.gwp-itinerary :focus-visible {outline:3px solid var(--gwp-gold-light);outline-offset:3px}

/* Generic element rules — dialog only. */
.gwp-itinerary dialog {font-family:var(--gwp-body);line-height:1.5;text-align:left;color-scheme:dark}
.gwp-itinerary dialog button, .gwp-itinerary dialog select, .gwp-itinerary dialog a {font:inherit;-webkit-tap-highlight-color:transparent}
.gwp-itinerary dialog button, .gwp-itinerary dialog a {touch-action:manipulation}
.gwp-itinerary dialog button {cursor:pointer}
.gwp-itinerary dialog button:disabled {cursor:default;opacity:.35}
.gwp-itinerary dialog button, .gwp-itinerary dialog select {color:inherit}
.gwp-itinerary dialog a {color:var(--gwp-gold-light)}

/* Reader shell. Plain dark backdrop (no blur): on phones the reader
   covers the whole screen anyway, and backdrop blur is costly on iOS. */
.gwp-itinerary .gwp-reader {width:min(880px,100%);height:calc(100dvh - 40px);max-width:100%;max-height:calc(100dvh - 40px);padding:0;margin:auto;border:1px solid #31505b;border-radius:12px;background:var(--gwp-navy);color:var(--gwp-cream);overflow:hidden}
.gwp-itinerary dialog::backdrop {background:rgba(0,12,16,.88)}
.gwp-itinerary .gwp-reader-shell {display:flex;flex-direction:column;height:100%;min-height:0}

/* Top bar: Contents · page picker · close — one row. */
.gwp-itinerary .gwp-reader-header {display:flex;align-items:center;gap:8px;flex-shrink:0;
  padding:10px 12px;border-bottom:1px solid var(--gwp-line)}
.gwp-itinerary .gwp-bar-button {flex:none;display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:8px 12px;border:1px solid var(--gwp-line);border-radius:6px;
  background:var(--gwp-panel);font-size:13px;font-weight:500}
/* 16px keeps iOS Safari from zooming the page when the picker is tapped. */
.gwp-itinerary select {flex:1 1 auto;min-width:0;min-height:44px;padding:8px 28px 8px 10px;
  border:1px solid var(--gwp-line);border-radius:6px;background:var(--gwp-panel);
  font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gwp-itinerary .gwp-icon-button {flex:none;display:grid;place-items:center;width:44px;height:44px;padding:0;
  border:1px solid var(--gwp-line);border-radius:6px;background:transparent;font-size:26px;line-height:1}

/* Page area. */
.gwp-itinerary .gwp-reader-scroll {flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;background:#d5d4ce;padding:20px 22px;scrollbar-gutter:stable}
.gwp-itinerary .gwp-page-stage {position:relative;max-width:680px;margin:0 auto;background:#faf7f0;touch-action:pan-y pinch-zoom;box-shadow:0 3px 18px #0002}
.gwp-itinerary .gwp-page-image {display:block;width:100%;height:auto;user-select:none;-webkit-user-select:none}
.gwp-itinerary .gwp-page-links {position:absolute;inset:0;pointer-events:none}
.gwp-itinerary .gwp-page-links a, .gwp-itinerary .gwp-page-links button {position:absolute;display:block;padding:0;min-width:0;border:0;border-radius:0;background:transparent;color:transparent;pointer-events:auto;text-decoration:none}
.gwp-itinerary .gwp-page-links a:hover, .gwp-itinerary .gwp-page-links button:hover {background:#ba984918}
.gwp-itinerary .gwp-page-links :focus-visible {outline:3px solid #ae8935;outline-offset:0;background:#b9984930}
.gwp-itinerary .gwp-page-transcript {max-width:680px;margin:15px auto 0;padding:0 12px;color:#12323c;font-size:14px}
.gwp-itinerary .gwp-page-transcript summary {padding:10px 0;cursor:pointer}
.gwp-itinerary .gwp-page-transcript div {white-space:pre-line;padding:14px;background:#faf7f0;line-height:1.6}
.gwp-itinerary .gwp-page-error {max-width:680px;margin:20px auto;padding:0 12px;color:#173942;font-size:15px;text-align:center}
.gwp-itinerary .gwp-page-error a {color:#173942}
.gwp-itinerary .gwp-page-error button {min-height:44px;color:#173942}

/* Bottom bar: ← · Download PDF · → — one row. */
.gwp-itinerary .gwp-reader-footer {display:flex;align-items:center;gap:8px;flex-shrink:0;
  padding:10px 12px max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--gwp-line)}
.gwp-itinerary .gwp-nav-button {flex:none;display:grid;place-items:center;width:48px;height:48px;padding:0;
  border:1px solid var(--gwp-line);border-radius:6px;background:var(--gwp-panel);font-size:18px;line-height:1}
.gwp-itinerary .gwp-download-pdf {flex:1 1 auto;display:flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:8px 12px;border-radius:6px;background:var(--gwp-gold);color:var(--gwp-navy);
  font-size:15px;font-weight:700;text-decoration:none;white-space:nowrap}
.gwp-itinerary .gwp-download-pdf span {font-size:12px}
.gwp-itinerary .gwp-download-pdf:hover {background:var(--gwp-gold-light)}

.gwp-itinerary .gwp-sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.gwp-itinerary .gwp-no-script {margin-top:16px;font-size:13px;line-height:1.5;color:var(--gwp-secondary)}

/* Phones: full-screen reader, page edge to edge. */
@media (max-width:600px) {
  .gwp-itinerary .gwp-reader {width:100%;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0}
  .gwp-itinerary .gwp-reader-header {padding-top:max(10px,env(safe-area-inset-top))}
  .gwp-itinerary .gwp-reader-scroll {padding:0;scrollbar-gutter:auto}
  .gwp-itinerary .gwp-page-stage {box-shadow:none}
}
@media (max-width:360px) {
  .gwp-itinerary .gwp-bar-button {padding:8px 9px;font-size:12px}
  .gwp-itinerary .gwp-download-pdf {font-size:14px}
}
