/* VMON4.3.2 · live-production repair.
   Final VMON-only layer. It intentionally wins over the historical 1240px
   functional caps without changing Marga data, controls, events or bindings. */

/* 1 · Never expose raw template expressions after the early guard identifies
   them. This also catches third-party literal {title} placeholders. */
body.cth-brand--vmon .cth-marga-template-token{display:none!important}

/* 2 · Real trip detail uses the full page canvas. The old 1240px cap was the
   cause of the large dead column visible on wide screens. Release every legacy
   Colibri ancestor that actually contains the functional .md-template. */
body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title)
.content.colibri-page-content :where(.h-section,.h-section-grid-container,.h-row-container,.h-row,.h-col,.h-column,.h-column-container,.h-column__inner,.h-column__content):has(.md-template){
  width:100%!important;max-width:none!important;min-width:0!important;
  flex:0 0 100%!important;float:none!important;left:auto!important;right:auto!important;
  transform:none!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box!important
}
body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title)
.content.colibri-page-content .h-row:has(.md-template){display:block!important}
body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title) .md-template,
body.cth-brand--vmon .md-template.cth-vmon-trip-template{
  display:block!important;width:calc(100% - 24px)!important;max-width:none!important;min-width:0!important;
  margin-left:12px!important;margin-right:12px!important;box-sizing:border-box!important
}
body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title)
.md-template>.h-section-grid-container,
body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title)
.md-template>.h-section-grid-container>.h-row-container,
body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title)
.md-template>.h-section-grid-container>.h-row-container>.h-row:not(:has(.viaje-title)),
body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title)
.md-template>.h-section-grid-container>.h-row-container>.h-row:not(:has(.viaje-title))>.h-column,
body.cth-brand--vmon .md-template.cth-vmon-trip-template .cth-vmon-trip-inner-wide{
  width:100%!important;max-width:none!important;min-width:0!important;flex:0 0 100%!important;
  float:none!important;box-sizing:border-box!important
}
body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title)
.md-template :where(.h-tabs,.h-tabs-navigation,.h-tabs-item-content,.h-tabs-content,#itinerario,#imagenes,#alojamiento,#precioIncluye){
  width:100%!important;max-width:none!important;min-width:0!important;box-sizing:border-box!important
}
/* Keep prose readable while the actual module remains full width. Media and
   tables are deliberately not capped. */
body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title)
.h-tabs-item-content>p:not(:has(img)){max-width:88ch!important}

/* 3 · Reservation uses the full available canvas. Do not depend on runtime
   classes: the PHP reservation body class is enough, and runtime detection is
   retained as a second safety net for late Vue hydration. */
body.cth-brand--vmon.cth-marga-reservation
.content.colibri-page-content :where(.h-section,.h-section-grid-container,.h-row-container,.h-row,.h-col,.h-column,.h-column-container,.h-column__inner,.h-column__content):has(.md-template),
body.cth-brand--vmon.cth-vmon-reservation-runtime .cth-vmon-reservation-host{
  width:100%!important;max-width:none!important;min-width:0!important;flex:0 0 100%!important;
  float:none!important;left:auto!important;right:auto!important;transform:none!important;
  margin-left:0!important;margin-right:0!important;box-sizing:border-box!important
}
body.cth-brand--vmon.cth-marga-reservation .content.colibri-page-content .h-row:has(.md-template){display:block!important}
body.cth-brand--vmon.cth-marga-reservation .md-template,
body.cth-brand--vmon .md-template.cth-vmon-reservation-template{
  display:block!important;width:calc(100% - 24px)!important;max-width:none!important;min-width:0!important;
  margin-left:12px!important;margin-right:12px!important;padding:30px 0 76px!important;box-sizing:border-box!important
}
body.cth-brand--vmon.cth-marga-reservation .md-template form,
body.cth-brand--vmon form.cth-vmon-reservation-form{
  display:block!important;width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;
  padding:clamp(22px,2.6vw,38px)!important;box-sizing:border-box!important
}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.h-row,.row),
body.cth-brand--vmon form.cth-vmon-reservation-form .cth-vmon-reservation-row{
  display:flex!important;flex-flow:row wrap!important;align-items:flex-start!important;
  gap:18px 20px!important;width:100%!important;max-width:100%!important;min-width:0!important;
  margin:0 0 22px!important;box-sizing:border-box!important
}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.h-row,.row)>:where(.h-col,.h-column,[class*="h-col-"],[class*="col-"]),
body.cth-brand--vmon form.cth-vmon-reservation-form .cth-vmon-reservation-row>:where(.h-col,.h-column,[class*="h-col-"],[class*="col-"]){
  float:none!important;width:auto!important;max-width:none!important;min-width:0!important;
  flex:1 1 230px!important;margin:0!important;padding-left:0!important;padding-right:0!important;box-sizing:border-box!important
}
/* Preserve the useful source proportions: this gives the requested multi-field
   rows without moving a single Marga control. */
body.cth-brand--vmon.cth-marga-reservation .md-template form .h-row>.h-col-lg-2{flex-basis:150px!important;flex-grow:0!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form .h-row>.h-col-lg-3{flex-basis:220px!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form .h-row>.h-col-lg-4{flex-basis:280px!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form .h-row>.h-col-lg-6{flex-basis:440px!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form .h-row>:where(.h-col-lg-8,.h-col-lg-9,.h-col-lg-10,.h-col-lg-12){flex-basis:100%!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),select,textarea,.select2-container){
  display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important
}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),select){min-height:46px!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form textarea{min-height:145px!important;resize:vertical!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(button,.md-btn,input[type="button"],input[type="submit"],input[type="checkbox"],input[type="radio"]){width:auto!important;max-width:100%!important;min-width:0!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.g-recaptcha,[data-sitekey],.cth-vmon-reservation-cell--wide){width:100%!important;max-width:100%!important;flex:0 0 100%!important}

/* 4 · The existing first-question controls stay a natural horizontal pair. */
body.cth-brand--vmon.cth-marga-reservation :where(.cth-vmon-reservation-history__choice,button,input[type="button"]){word-break:normal!important;overflow-wrap:normal!important}
body.cth-brand--vmon.cth-marga-reservation .cth-vmon-reservation-history__choice{width:auto!important;min-width:58px!important;max-width:none!important;white-space:nowrap!important}

/* 5 · Technical catalogue fallbacks are presentation noise, not product data. */
body.cth-brand--vmon .vmon-data-omitted{display:none!important}

@media(max-width:1023px) and (min-width:768px){
  body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.h-row,.row)>:where(.h-col,.h-column,[class*="h-col-"],[class*="col-"]){flex:1 1 calc(50% - 10px)!important}
  body.cth-brand--vmon.cth-marga-reservation .md-template form .h-row>:where(.h-col-lg-8,.h-col-lg-9,.h-col-lg-10,.h-col-lg-12){flex-basis:100%!important}
}
@media(max-width:767px){
  body.cth-brand--vmon.vmon-marga-page:not(.cth-marga-reservation):has(.md-template .viaje-title) .md-template,
  body.cth-brand--vmon .md-template.cth-vmon-trip-template,
  body.cth-brand--vmon.cth-marga-reservation .md-template,
  body.cth-brand--vmon .md-template.cth-vmon-reservation-template{width:calc(100% - 16px)!important;margin-left:8px!important;margin-right:8px!important}
  body.cth-brand--vmon.cth-marga-reservation .md-template form{padding:18px 14px!important}
  body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.h-row,.row){display:block!important;margin-bottom:18px!important}
  body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.h-row,.row)>:where(.h-col,.h-column,[class*="h-col-"],[class*="col-"]){display:block!important;width:100%!important;max-width:100%!important;margin:0 0 14px!important}
  body.cth-brand--vmon.cth-marga-reservation .md-template form :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),select,textarea){font-size:16px!important}
}
.vmon2026 .vmon-step-media__mark{display:block;width:28px;height:6px;border-radius:999px;background:var(--brand-grad);opacity:.85}