/* XGQN P18 – one shared CT5 gallery behavior for Money, Supporting Listing, News.
 * P18 modifies ONLY frontend presentation. No Admin fields, price or booking logic.
 * At mobile widths, keep both neighboring preview images, instead of hiding
 * them and leaving empty gutters around the central picture. */

/* NEWS desktop: one balanced Gallery/Form pair without a white empty box.
   The central image and the two side previews fill the available gallery
   surface; the form is not duplicated or artificially clipped. */
@media (min-width:851px){
  .trn11-news .tct6-wrap .trn13-top-frame > .tct5-layout{
    align-items:stretch!important;
  }
  .trn11-news .tct6-wrap .trn13-top-frame > .tct5-layout > .tct5-primary{
    display:flex!important;flex-direction:column!important;align-self:stretch!important;
    height:auto!important;min-height:0!important;
  }
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-primary > .tct5-gallery{
    flex:1 1 auto!important;min-height:340px!important;aspect-ratio:auto!important;
    height:auto!important;
  }
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-primary > .tct5-thumbs{
    flex:0 0 auto!important;
  }
  .trn11-news .tct6-wrap .trn13-top-frame > .tct5-layout > .tct5-provider{
    display:flex!important;flex-direction:column!important;align-self:stretch!important;
    height:auto!important;min-height:0!important;
  }
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-provider > .tct78-book-card{
    flex:1 1 auto;display:flex;flex-direction:column;
  }
  .trn11-news .tct6-wrap .trn13-top-frame .tct78-book-card .vinfast-lead-form-body{
    flex:1 1 auto;
  }
}
@media (max-width:850px){
  /* Stacked panels must size naturally rather than preserve an artificial desktop height. */
  .trn11-news .tct6-wrap .trn13-top-frame > .tct5-layout{
    align-items:start!important;
  }
  .trn11-news .tct6-wrap .trn13-top-frame > .tct5-layout > .tct5-primary,
  .trn11-news .tct6-wrap .trn13-top-frame > .tct5-layout > .tct5-provider{
    display:block!important;height:auto!important;min-height:0!important;
  }
}

/* Supporting Listing desktop retains its previously approved one-image layout.
   CT5 now supplies side-preview elements for the mobile layout, so hide those
   new elements above the mobile breakpoint instead of allowing them to expand. */
@media (min-width:641px){
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek{
    display:none!important;
  }
}

@media (max-width:640px){
  /* All three CT5 kinds share this markup. More specific rules override the
     old per-page @media clauses setting display:block and hiding preview photos. */
  body.transport-native.transport-money-p72 .tct6-wrap .tct78-top-frame .tct5-gallery.tm84-has-peeks,
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-gallery.tm84-has-peeks,
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks{
    display:flex!important;align-items:stretch!important;justify-content:center!important;
    gap:4px!important;width:100%!important;max-width:100%!important;
    aspect-ratio:1.55/1!important;height:auto!important;min-height:0!important;
    padding:0!important;margin:0!important;border-radius:11px!important;
    background:#e9f3fb!important;overflow:hidden!important;
  }
  body.transport-native.transport-money-p72 .tct6-wrap .tct78-top-frame .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek,
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek,
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek{
    box-sizing:border-box!important;position:relative!important;
    display:block!important;order:initial!important;flex:0 0 10.5%!important;
    width:10.5%!important;min-width:0!important;height:100%!important;
    margin:0!important;padding:0!important;border:0!important;
    border-radius:7px!important;opacity:.66!important;
    overflow:hidden!important;background:#e5eff9!important;
  }
  body.transport-native.transport-money-p72 .tct6-wrap .tct78-top-frame .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek-prev,
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek-prev,
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek-prev{order:-1!important}
  body.transport-native.transport-money-p72 .tct6-wrap .tct78-top-frame .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek-next,
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek-next,
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks > .tm84-gallery-peek-next{order:1!important}
  .tct6-wrap .tct5-gallery.tm84-has-peeks .tm84-gallery-peek img{
    display:block;width:100%!important;height:100%!important;object-fit:cover!important;
  }
  body.transport-native.transport-money-p72 .tct6-wrap .tct78-top-frame .tct5-gallery.tm84-has-peeks > .tct5-photo-link,
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-gallery.tm84-has-peeks > .tct5-photo-link,
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks > .tct5-photo-link{
    box-sizing:border-box!important;position:relative!important;z-index:2!important;
    display:block!important;order:0!important;flex:1 1 0!important;
    width:auto!important;min-width:0!important;height:100%!important;
    aspect-ratio:auto!important;border-radius:7px!important;overflow:hidden!important;
  }
  .tct6-wrap .tct5-gallery.tm84-has-peeks > .tct5-photo-link img{
    display:block!important;width:100%!important;height:100%!important;
    object-fit:contain!important;object-position:center!important;
  }
  /* Visible, finger-sized arrows centered over the boundary with each preview.
     Existing data-tct5-step handlers continue to operate; no duplicate JS. */
  body.transport-native.transport-money-p72 .tct6-wrap .tct78-top-frame .tct5-gallery.tm84-has-peeks > .tct5-prev,
  body.transport-native.transport-money-p72 .tct6-wrap .tct78-top-frame .tct5-gallery.tm84-has-peeks > .tct5-next,
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-gallery.tm84-has-peeks > .tct5-prev,
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-gallery.tm84-has-peeks > .tct5-next,
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks > .tct5-prev,
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks > .tct5-next{
    box-sizing:border-box!important;display:grid!important;place-items:center!important;
    z-index:12!important;position:absolute!important;top:50%!important;
    width:31px!important;height:31px!important;min-width:31px!important;
    padding:0!important;margin:0!important;border:1px solid #d8e7f4!important;
    border-radius:50%!important;background:rgba(255,255,255,.96)!important;
    color:#17669d!important;font-family:Arial,sans-serif!important;font-size:23px!important;
    line-height:1!important;transform:translateY(-50%)!important;
    box-shadow:0 2px 10px rgba(9,49,82,.15)!important;
  }
  body.transport-native.transport-money-p72 .tct6-wrap .tct78-top-frame .tct5-gallery.tm84-has-peeks > .tct5-prev,
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-gallery.tm84-has-peeks > .tct5-prev,
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks > .tct5-prev{left:calc(10.5% - 9px)!important;right:auto!important}
  body.transport-native.transport-money-p72 .tct6-wrap .tct78-top-frame .tct5-gallery.tm84-has-peeks > .tct5-next,
  .trn11-news .tct6-wrap .trn13-top-frame .tct5-gallery.tm84-has-peeks > .tct5-next,
  .trsp73 .tct6-wrap .tct5-gallery.tm84-has-peeks > .tct5-next{right:calc(10.5% - 9px)!important;left:auto!important}
  .tct6-wrap .tct5-gallery.tm84-has-peeks > .tct5-count{z-index:13!important;bottom:7px!important;left:calc(10.5% + 7px)!important}
}