/* ==========================================================
   VCTF 4.4 · functional recovery
   Priority: Marga forms + one search component everywhere.
   Presentation only: Marga keeps values, Vue models, validation,
   calculations, availability and submit/payment behaviour.
   ========================================================== */

/* ---------- One VCTF search surface everywhere ----------
   The JS marks the real Marga search form even on /buscador/, where the
   virtual route may bypass the editorial wrapper. This avoids viewport-wide
   raw filters and gives Home/hubs/search exactly the same component. */
body.cth-brand--vctf form.cth-vctf44-search-form{
  position:relative!important;
  display:block!important;
  width:min(calc(100% - 36px),1240px)!important;
  max-width:1240px!important;
  min-width:0!important;
  margin:22px auto 30px!important;
  padding:clamp(22px,3vw,36px)!important;
  box-sizing:border-box!important;
  border:0!important;
  border-radius:28px!important;
  background:#0b1b3d!important;
  color:#fff!important;
  box-shadow:0 22px 55px rgba(7,27,51,.16)!important;
  overflow:visible!important;
}
body.cth-brand--vctf .vmon-marga--search form.cth-vctf44-search-form{
  width:100%!important;max-width:none!important;margin:0!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form .md-label,
body.cth-brand--vctf form.cth-vctf44-search-form label.md-label{
  color:#fff!important;opacity:.88!important;font-weight:900!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form .md-search-field{
  background:#fff!important;color:#071b33!important;border:0!important;
  min-height:54px!important;height:54px!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form .md-search-submit,
body.cth-brand--vctf form.cth-vctf44-search-form .md-control:last-child .md-btn{
  background:linear-gradient(135deg,#13a9e3,#145fbe)!important;
  color:#fff!important;border:0!important;box-shadow:0 4px 0 rgba(255,255,255,.12)!important;
  font-weight:900!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form .md-search-submit svg,
body.cth-brand--vctf form.cth-vctf44-search-form .md-control:last-child .md-btn svg{fill:#fff!important}

/* Legacy Marga search DOM: query row + real filters. */
body.cth-brand--vctf form.cth-vctf44-search-form>.d-flex:first-of-type{
  display:grid!important;grid-template-columns:minmax(0,1fr) 64px!important;
  gap:0!important;align-items:stretch!important;width:100%!important;
  margin:0 0 18px!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form>.d-flex:first-of-type>.md-search-field{
  width:100%!important;min-width:0!important;border-radius:13px 0 0 13px!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form>.d-flex:first-of-type>.md-search-submit{
  width:64px!important;min-width:64px!important;height:54px!important;
  border-radius:0 13px 13px 0!important;margin:0!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form>.d-flex:not(:first-of-type),
body.cth-brand--vctf form.cth-vctf44-search-form>.d-flex.gutters-col-1{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr)) minmax(190px,.78fr)!important;
  gap:12px!important;align-items:end!important;width:100%!important;
  overflow:visible!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form .md-control{
  min-width:0!important;max-width:none!important;width:auto!important;
  margin:0!important;padding:0!important;overflow:visible!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form :where(.select2-container,.cth-vctf43-multi,.cth-vctf44-multi){
  width:100%!important;max-width:100%!important;min-width:0!important;
}
body.cth-brand--vctf form.cth-vctf44-search-form :where(.select2-selection--multiple,.cth-vctf43-multi__button,.cth-vctf44-multi__button){
  min-height:50px!important;height:50px!important;border-radius:12px!important;
  background:#fff!important;color:#071b33!important;border:1px solid rgba(7,27,51,.12)!important;
}

/* Our dependency-independent multiselect fallback for search routes where
   Select2 has not initialized yet. The original select remains the source of
   truth and receives the same input/change events. */
body.cth-brand--vctf select.cth-vctf44-multi-source{
  position:absolute!important;width:1px!important;height:1px!important;
  margin:-1px!important;opacity:0!important;pointer-events:none!important;
  clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;overflow:hidden!important;
}
body.cth-brand--vctf .cth-vctf44-multi{position:relative!important;display:block!important;width:100%!important;min-width:0!important}
body.cth-brand--vctf .cth-vctf44-multi__button{
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;
  width:100%!important;padding:0 14px!important;font:inherit!important;font-size:.94rem!important;
  font-weight:800!important;text-align:left!important;cursor:pointer!important;box-shadow:none!important;
}
body.cth-brand--vctf .cth-vctf44-multi__button:focus-visible{outline:0!important;box-shadow:0 0 0 3px rgba(19,169,227,.25)!important}
body.cth-brand--vctf .cth-vctf44-multi__text{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;min-width:0!important}
body.cth-brand--vctf .cth-vctf44-multi__chevron{flex:0 0 auto!important;color:#0b74d1!important;font-weight:900!important;transition:transform .16s ease!important}
body.cth-brand--vctf .cth-vctf44-multi.is-open .cth-vctf44-multi__chevron{transform:rotate(180deg)!important}
body.cth-brand--vctf .cth-vctf44-multi__panel{
  position:absolute!important;z-index:100700!important;left:0!important;top:calc(100% + 7px)!important;
  width:max(100%,280px)!important;max-width:min(440px,calc(100vw - 24px))!important;
  max-height:min(360px,58vh)!important;overflow:auto!important;padding:7px!important;
  border:1px solid rgba(7,27,51,.13)!important;border-radius:14px!important;background:#fff!important;
  box-shadow:0 22px 55px rgba(7,27,51,.2)!important;
}
body.cth-brand--vctf .cth-vctf44-multi__panel[hidden]{display:none!important}
body.cth-brand--vctf .cth-vctf44-multi__option{
  display:flex!important;align-items:flex-start!important;gap:9px!important;width:100%!important;
  margin:0!important;padding:9px 10px!important;border-radius:9px!important;color:#071b33!important;
  font-size:.91rem!important;line-height:1.3!important;cursor:pointer!important;
}
body.cth-brand--vctf .cth-vctf44-multi__option:hover{background:#eef7ff!important}
body.cth-brand--vctf .cth-vctf44-multi__option input{width:16px!important;height:16px!important;min-height:0!important;margin:2px 0 0!important;accent-color:#0b74d1!important}

/* ---------- Marga form recovery ---------- */
/* Never paint the warning at 1.8 s. VCTF4.4 gives the delayed dependencies a
   real recovery window; the guard only marks a genuine long failure. */
body.cth-brand--vctf #contacto-form.cth-marga-hydration-fallback:before,
body.cth-brand--vctf.cth-marga-reservation .cth-marga-hydration-fallback:before{
  content:"El formulario no ha podido terminar de cargar. Recarga la página y, si continúa, contacta con nuestro equipo."!important;
}
/* Once Vue hydrates, all fallback decoration disappears even if an old cache
   left the class behind. */
body.cth-brand--vctf #contacto-form.cth-vctf44-hydrated:before,
body.cth-brand--vctf .md-template.cth-vctf44-hydrated:before{display:none!important;content:none!important}

/* ---------- Proof-card badges ----------
   The visual token is a badge, not a fixed one-line button. Long labels such
   as MONITORES or DESDE 2008 must fit without clipping. */
body.cth-brand--vctf .vmon-proof__media{
  width:64px!important;height:64px!important;min-width:64px!important;
  padding:5px!important;box-sizing:border-box!important;
}
body.cth-brand--vctf .vmon-proof__media b{
  display:block!important;width:100%!important;max-width:100%!important;
  color:#fff!important;font-size:clamp(.68rem,.9vw,.9rem)!important;
  line-height:1.02!important;letter-spacing:-.025em!important;text-align:center!important;
  white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;
}

/* ---------- Buttons must accommodate their label ---------- */
body.cth-brand--vctf :where(.md-trip-card,.travel-card,.vmon-trip-card,.vmon-search-route) :where(.md-btn,a.button,button.button){
  min-height:46px!important;height:auto!important;padding:10px 16px!important;
  white-space:normal!important;line-height:1.15!important;text-align:center!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
}

@media(max-width:900px){
  body.cth-brand--vctf form.cth-vctf44-search-form>.d-flex:not(:first-of-type),
  body.cth-brand--vctf form.cth-vctf44-search-form>.d-flex.gutters-col-1{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:620px){
  body.cth-brand--vctf form.cth-vctf44-search-form{
    width:min(calc(100% - 20px),1240px)!important;margin:14px auto 24px!important;padding:16px!important;border-radius:20px!important;
  }
  body.cth-brand--vctf form.cth-vctf44-search-form>.d-flex:not(:first-of-type),
  body.cth-brand--vctf form.cth-vctf44-search-form>.d-flex.gutters-col-1{grid-template-columns:1fr!important}
  body.cth-brand--vctf .cth-vctf44-multi__panel{width:min(360px,calc(100vw - 24px))!important}
  body.cth-brand--vctf .vmon-proof__media{width:58px!important;height:58px!important;min-width:58px!important}
}