/* VMON4.3 - production geometry repair.
   Presentation only: Mundo Durundo / Marga keeps DOM ownership, values,
   travellers, prices, availability, validation, calculations and submit flow. */

/* -------------------------------------------------------------------------
   1) Trip canvas.
   Some production trips arrive wrapped in a legacy Colibri h-col-* ancestor
   ABOVE .md-template. VMON4.2 centered .md-template but did not release that
   outer column, so the complete trip could remain trapped at 50/66% width.
   Reset only the ancestor chain that actually contains a trip template. */
body.cth-brand--vmon.vmon-marga-page:has(.md-template .viaje-title)
.content.colibri-page-content :where(.h-section,.h-section-grid-container,.h-row-container,.h-row,.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;
  float:none!important;
  flex:0 0 100%!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}
body.cth-brand--vmon.vmon-marga-page:has(.md-template .viaje-title)
.content.colibri-page-content .h-row:has(.md-template){display:block!important}
body.cth-brand--vmon.vmon-marga-page:has(.md-template .viaje-title) .md-template{
  display:block!important;
  width:min(calc(100% - 36px),1240px)!important;
  max-width:1240px!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}
body.cth-brand--vmon.vmon-marga-page:has(.md-template .viaje-title)
.md-template>.h-section-grid-container,
body.cth-brand--vmon.vmon-marga-page:has(.md-template .viaje-title)
.md-template>.h-section-grid-container>.h-row-container,
body.cth-brand--vmon.vmon-marga-page:has(.md-template .viaje-title)
.md-template>.h-section-grid-container>.h-row-container>.h-row{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}
/* Product rows after the commercial header must not inherit a stale
   h-col-lg-8 / h-col-lg-4 skeleton. The header keeps its intentional grid. */
body.cth-brand--vmon.vmon-marga-page:has(.md-template .viaje-title)
.md-template>.h-section-grid-container>.h-row-container>.h-row:not(:has(.viaje-title))>.h-column{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  flex:0 0 100%!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* -------------------------------------------------------------------------
   2) Reservation canvas.
   VMON4.2 normalized desktop rows but left the legacy h-col-lg-* widths alive.
   Keep the real Marga rows and bindings, while letting the form use the full
   available canvas and placing compatible fields on the same line. */
body.cth-brand--vmon.cth-marga-reservation
.content.colibri-page-content :where(.h-section,.h-section-grid-container,.h-row-container,.h-row,.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;
  float:none!important;
  flex:0 0 100%!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{
  display:block!important;
  width:min(calc(100% - 36px),1240px)!important;
  max-width:1240px!important;
  min-width:0!important;
  margin:0 auto!important;
  box-sizing:border-box!important;
}
body.cth-brand--vmon.cth-marga-reservation .md-template form{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin-inline:auto!important;
  padding:clamp(22px,3vw,36px)!important;
  border:1px solid rgba(7,26,62,.10)!important;
  border-radius:24px!important;
  background:#fff!important;
  box-shadow:0 18px 52px rgba(7,26,62,.06)!important;
  box-sizing:border-box!important;
}
body.cth-brand--vmon.cth-marga-reservation .md-template form,
body.cth-brand--vmon.cth-marga-reservation .md-template form>div,
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.control-group,.form-group,.form-row){
  min-width:0!important;
  box-sizing:border-box!important;
}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.h-row,.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-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 useful proportions encoded by the original Colibri grid without
   changing field order, names, values or Marga bindings. */
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(.control-group,.form-group,.form-row){
  width:100%!important;
  max-width: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:150px!important;resize:vertical!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(button,.md-btn,input[type="button"],input[type="submit"]){
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  white-space:nowrap!important;
}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(input[type="checkbox"],input[type="radio"]){width:auto!important;min-width:0!important;min-height:0!important}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.input-group,.md-counter,.counter,.quantity){
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  width:auto!important;
  max-width:100%!important;
}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(h2,h3,h4,h5,h6,p,label,.md-label,strong,span){
  max-width:100%!important;
  min-width:0!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
body.cth-brand--vmon.cth-marga-reservation .md-template form :where(.g-recaptcha,[data-sitekey],table,img){max-width:100%!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-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:has(.md-template .viaje-title) .md-template,
  body.cth-brand--vmon.cth-marga-reservation .md-template{width:min(calc(100% - 20px),1240px)!important}
  body.cth-brand--vmon.cth-marga-reservation .md-template form{padding:18px 14px!important;max-width:100%!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-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}
}