/* A shared folio of the itinerary's stays and travel passes. */
.itinerary-overview {
  --overview-ink: #292720;
  --overview-muted: #726b60;
  --overview-line: #d3c8b9;
  container-type: inline-size;
  padding: clamp(1.25rem, 3vw, 2.75rem);
  margin-bottom: 1.5rem;
  background: linear-gradient(120deg, #f7f0e5, #f2e9dc);
  color: var(--overview-ink);
  font-family: "Avenir Next", Avenir, sans-serif;
  overflow-wrap: anywhere;
}
.itinerary-overview :is(h2, h3, p) { margin: 0; }
.itinerary-overview__heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.75rem; }
.itinerary-overview .itinerary-overview__eyebrow {
  color: #b13c2c;
  font: 600 0.6rem/1.6 "SFMono-Regular", Consolas, monospace;
  letter-spacing: 0.19em;
  text-transform: uppercase;
  margin-bottom: 0.65rem;
}
.itinerary-overview .itinerary-overview__title {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(2.2rem, 5cqw, 3.4rem);
  font-weight: 500;
  letter-spacing: -0.035em;
  line-height: 1.05;
  margin: 0;
}
.itinerary-overview svg { width: 1.25rem; height: 1.25rem; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.itinerary-overview .itinerary-overview__hotel-icon { width: 2rem; height: 2rem; color: #477572; margin-right: 0.25rem; }
.itinerary-overview__stays { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 11.5rem), 1fr)); gap: 0.75rem; padding: 0; margin: 0; list-style: none; }
.itinerary-overview__stay {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 12rem;
  padding: 1.1rem 1.15rem 1.4rem;
  background: linear-gradient(145deg, #ffffff08, #00000006), #c43e2d;
  border: 1px solid #00000016;
  color: #fff6e8;
}
.itinerary-overview__stay:nth-child(5n + 2) { background-color: #cec4d5; color: #35303a; }
.itinerary-overview__stay:nth-child(5n + 3) { background-color: #f2b24b; color: #422c12; }
.itinerary-overview__stay:nth-child(5n + 4) { background-color: #adbdaf; color: #293a32; }
.itinerary-overview__stay:nth-child(5n + 5) { background-color: #477572; color: #fff6e8; }
.itinerary-overview__card-top { display: flex; align-items: center; justify-content: space-between; min-height: 2rem; gap: 0.5rem; }
.itinerary-overview__number, .itinerary-overview__dates { font: 500 0.6rem/1.7 "SFMono-Regular", Consolas, monospace; letter-spacing: 0.07em; text-transform: uppercase; }
.itinerary-overview .itinerary-overview__map-link { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; margin: -0.4rem -0.6rem -0.4rem 0; color: inherit; }
.itinerary-overview__map-link:hover { background: #ffffff20; }
.itinerary-overview__map-link:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.itinerary-overview__card-body { margin-top: auto; padding-top: 2.2rem; }
.itinerary-overview .itinerary-overview__stay h3 { font: 500 1.5rem/1.15 "Cormorant Garamond", Georgia, serif; margin: 0.4rem 0; letter-spacing: -0.02em; }
.itinerary-overview__room { font-size: 0.7rem; line-height: 1.6; }
.itinerary-overview__passes { display: flex; align-items: center; gap: 2rem; margin-top: 3.5rem; padding-block: 1.8rem; border-block: 1px solid var(--overview-line); }
.itinerary-overview__pass-heading { display: flex; align-items: center; gap: 1rem; flex: 1 0 38%; }
.itinerary-overview__pass-heading .itinerary-overview__eyebrow { margin-bottom: 0.4rem; }
.itinerary-overview__pass-heading .itinerary-overview__title { font-size: 2rem; }
.itinerary-overview__pass-seal { display: grid; place-items: center; flex: none; width: 2.8rem; height: 2.8rem; border-radius: 50%; background: #477572; color: #fff6e8; }
.itinerary-overview__pass-list { display: flex; flex-wrap: wrap; gap: 1.2rem 0; flex: 1 1 60%; list-style: none; padding: 0; margin: 0; min-width: 0; }
.itinerary-overview__pass { display: flex; align-items: flex-start; gap: 0.75rem; flex: 1 1 12rem; min-width: 0; border-left: 1px solid var(--overview-line); padding-inline: 1rem; }
.itinerary-overview__pass > svg { width: 1rem; height: 1rem; color: #b13c2c; margin-top: 0.1rem; }
.itinerary-overview__pass > div { min-width: 0; }
.itinerary-overview .itinerary-overview__pass h3 { font: 600 0.75rem/1.5 "Avenir Next", Avenir, sans-serif; margin: 0 0 0.3rem; }
.itinerary-overview__pass p { font-size: 0.7rem; color: var(--overview-muted); line-height: 1.6; }
.itinerary-overview .itinerary-overview__pass-note { margin-top: 0.2rem; white-space: pre-line; }
.itinerary-overview__empty { color: var(--overview-muted); font-size: 0.85rem; line-height: 1.6; }

@container (max-width: 650px) {
  .itinerary-overview__passes { flex-direction: column; align-items: stretch; gap: 1.5rem; margin-top: 2rem; }
  .itinerary-overview__pass-list { flex-basis: auto; }
  .itinerary-overview__pass { padding-left: 0; border-left: 0; }
}

@media print {
  .itinerary-overview { break-inside: avoid; print-color-adjust: exact; }
  .itinerary-overview__stay { break-inside: avoid; }
}