/* Experimental JSON SPA detail only. Scoped so production vehicle pages are untouched. */
.vl-json-single-active .vl-single-right{gap:14px}
.vl-json-single-active .vl-json-summary-card,
.vl-json-single-active .vl-s-variants,
.vl-json-single-active .vl-s-similar,
.vl-json-single-active .vl-s-trust{background:#fff;border:1px solid #e4e7eb;border-radius:20px;overflow:hidden;box-sizing:border-box}

/* Main information card */
.vl-json-single-active .vl-json-summary-head{padding:24px 10px 18px}
.vl-json-single-active .vl-json-summary-price{padding:18px 10px 22px;border-top:1px solid #d8dadd}
.vl-json-single-active .vl-json-summary-delivery{padding:18px 10px;border-top:1px solid #d8dadd}
.vl-json-single-active .vl-json-loyalty{padding:20px 10px 18px;border-top:1px solid #d8dadd;font-size:14px;line-height:1.55;color:#171717}
.vl-json-single-active .vl-json-loyalty__title{display:block;color:#ff1717;font-size:14px;font-weight:800;margin:0 0 3px!important;padding:0!important}
.vl-json-single-active .vl-json-loyalty p{margin:0!important;padding:0!important;color:#171717;font-size:14px;line-height:1.55}
.vl-json-single-active .vl-json-loyalty strong{font-weight:800}
.vl-json-single-active .vl-json-loyalty-disclaimer{padding:16px 10px 18px;border-top:1px solid #d8dadd;color:#323232;font-size:14px;line-height:1.55}
.vl-json-single-active .vl-json-loyalty-disclaimer p{margin:0!important;padding:0!important}
.vl-json-single-active .vl-s-title{font-size:25px;line-height:1.22;color:#ef3e42;font-weight:750;margin:0!important}
.vl-json-single-active .vl-s-quick-info{font-size:13px;color:#6e7b99;margin-top:14px!important}
.vl-json-single-active .vl-s-price{margin:0!important}
.vl-json-single-active .vl-s-price__label{font-size:12px;color:#61708e;margin-bottom:8px!important}
.vl-json-single-active .vl-s-price__amount{font-size:31px;line-height:1.1;color:#08162a;font-weight:750}
.vl-json-single-active .vl-s-price__sign{font-size:17px;color:#08162a}
.vl-json-single-active .vl-s-price__currency{font-size:13px;color:#687694;margin-left:5px}
.vl-json-single-active .vl-s-price__monthly{margin-top:6px!important}
.vl-json-single-active .vl-s-price__bonus{margin-top:6px!important}
.vl-json-single-active .vl-s-delivery{font-size:13px;color:#2e405e;font-weight:600;margin:0!important}

/* Primary WhatsApp CTA */
.vl-json-single-active .vl-json-detail-quote{display:flex!important;align-items:center!important;justify-content:center!important;gap:7px;width:100%;min-height:52px;padding:12px 18px;border-radius:999px;background:#00c83a;color:#fff!important;font-size:14px;font-weight:800;text-decoration:none!important;box-sizing:border-box;transition:filter .15s ease}
.vl-json-single-active .vl-json-detail-quote:hover{filter:brightness(.95);color:#fff!important}
.vl-json-single-active .vl-json-detail-quote svg{width:18px;height:18px;flex:none}

/* Variants card */
.vl-json-single-active .vl-s-variants{padding:12px 12px}
.vl-json-single-active .vl-s-variant-row{padding:14px 16px;border-bottom:1px solid #e4e7eb}
.vl-json-single-active .vl-s-variant-row:last-child{border-bottom:0}
.vl-json-single-active .vl-s-variant-label{font-size:13px;color:#6c7896;font-weight:600}
.vl-json-single-active .vl-s-variant-value,.vl-json-single-active .vl-s-variant-row>span:last-child{font-size:14px;color:#111;font-weight:700}
.vl-json-single-active .vl-s-variant-more{background:#eaf6fd;color:#2474b6;padding:7px 11px;border-radius:16px;font-size:11px;font-weight:700}

/* Similar vehicles card */
.vl-json-single-active .vl-s-similar{padding:17px 8px 8px}
.vl-json-single-active .vl-s-similar__title{font-size:13px;color:#151515;font-weight:800;padding:0 0 10px 0!important;margin:0!important}
.vl-json-single-active .vl-s-similar-item{padding:12px 0;border-bottom:1px solid #e5e8ec;gap:14px;align-items:flex-start!important}
.vl-json-single-active .vl-s-similar-item:last-of-type{border-bottom:0}
.vl-json-single-active .vl-s-similar-img,.vl-json-single-active .vl-s-similar-img--empty{width:95px!important;max-width:95px!important;height:70px!important;border-radius:7px}
.vl-json-single-active .vl-s-similar-info{padding-top:1px;min-width:0}
.vl-json-single-active .vl-s-similar-name{font-size:13px;line-height:1.35;color:#101010;font-weight:800;margin:0 0 5px!important}
.vl-json-single-active .vl-s-similar-meta{font-size:11px;color:#70809f;font-weight:600;margin:0 0 6px!important}
.vl-json-single-active .vl-s-similar-price{font-size:13px;color:#ff3038;font-weight:800;margin:0!important}
.vl-json-single-active .vl-s-similar-monthly{font-size:11px;color:#718096;margin-top:3px!important}
.vl-json-single-active .vl-s-similar-monthly-link{display:none}

/* Trust card — exact messaging from the existing design */
.vl-json-single-active .vl-s-trust{padding:14px 12px;gap:0}
.vl-json-single-active .vl-s-trust-item{display:grid!important;grid-template-columns:38px 1fr;align-items:center!important;gap:12px;padding:11px 0;color:#171717;font-size:14px;font-weight:600;line-height:1.35}
.vl-json-single-active .vl-s-trust-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;margin:0;color:#ff3038}
.vl-json-single-active .vl-s-trust-icon svg{width:30px;height:30px;display:block;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

@media (max-width:960px){
  .vl-json-single-active .vl-json-summary-head,
  .vl-json-single-active .vl-json-summary-price,
  .vl-json-single-active .vl-json-summary-delivery,
  .vl-json-single-active .vl-json-loyalty,
  .vl-json-single-active .vl-json-loyalty-disclaimer{padding-left:12px;padding-right:12px}
}

/* Mobile-only section order: mirrors the established product-page flow.
   No visual styles are changed; only document presentation order below 960px. */
@media (max-width:960px){
  .vl-json-single-active .vl-single-layout{display:flex!important;flex-direction:column!important}
  .vl-json-single-active .vl-single-left,
  .vl-json-single-active .vl-single-right{display:contents!important}

  .vl-json-single-active .vl-gallery{order:10}
  .vl-json-single-active .vl-json-summary-card{order:20}
  .vl-json-single-active .vl-json-detail-quote{order:30}
  .vl-json-single-active .vl-s-variants{order:40}
  .vl-json-single-active .vl-s-trust{order:50}
  .vl-json-single-active .vl-s-specs{order:60}
  .vl-json-single-active .vl-s-features{order:70}
  .vl-json-single-active .vl-s-featured-eq{order:80}
  .vl-json-single-active .vl-s-description{order:90}
  .vl-json-single-active .vl-s-similar{order:100}
}


/* 1.1.11.1 — Mobile-only containment fixes.
   Keep the approved visual design; only make sections consume the available width. */
@media (max-width:960px){
  .vl-json-single-active .vl-single-layout{
    width:100%!important;
    max-width:100%!important;
    align-items:stretch!important;
  }
  .vl-json-single-active .vl-gallery,
  .vl-json-single-active .vl-json-summary-card,
  .vl-json-single-active .vl-json-detail-quote,
  .vl-json-single-active .vl-s-variants,
  .vl-json-single-active .vl-s-trust,
  .vl-json-single-active .vl-s-specs,
  .vl-json-single-active .vl-s-features,
  .vl-json-single-active .vl-s-featured-eq,
  .vl-json-single-active .vl-s-description,
  .vl-json-single-active .vl-s-similar{
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    align-self:stretch!important;
  }
  .vl-json-single-active .vl-s-specs__grid,
  .vl-json-single-active .vl-s-features{
    width:100%!important;
  }
}

/* While a JSON vehicle detail is open, no inventory instance on the same page
   may leak below the detail. This also covers duplicate Divi shortcode modules. */
body.vl-json-detail-open [data-vl-json-test="1"] > .vl-inv__topbar,
body.vl-json-detail-open [data-vl-json-test="1"] > .vl-inv__body,
body.vl-json-detail-open .vl-inv:not(.vl-json-single-active){
  display:none!important;
}


/* 1.1.11.11 — JSON detail recent-view activity popup.
   Reuses the established .vl-popup visual language from the original product page. */
.vl-json-live-popup{max-width:350px;width:calc(100vw - 40px);padding:14px 18px 14px 14px;gap:13px;border:1px solid #eef0f3;box-sizing:border-box}
.vl-json-live-popup .vl-popup__img{width:80px;height:80px;border-radius:10px}
.vl-json-live-popup .vl-popup__title{font-size:14px;font-weight:750;color:#111827;margin:0 0 6px!important}
.vl-json-live-popup .vl-popup__viewers{font-size:13px;color:#6b7280}
.vl-json-live-popup .vl-popup__viewers strong{color:#e1251b;font-weight:800}
@media (max-width:600px){
  .vl-json-live-popup{left:16px;right:16px;bottom:18px;width:auto;max-width:none}
  .vl-json-live-popup .vl-popup__img{width:70px;height:70px}
}


/* ===== 1.1.11.41 — Product detail desktop 60/40 + inventory-style actions + image zoom ===== */
@media (min-width:961px){
  .vl-json-single-active .vl-single-layout{
    grid-template-columns:minmax(0,3fr) minmax(0,2fr)!important;
    gap:28px!important;
  }
}

/* Main-image overlay controls. */
.vl-json-single-active .vl-gallery__main-wrap{
  position:relative;
  overflow:hidden;
  border-radius:10px;
}
.vl-json-single-active .vl-gallery__main-wrap .vl-gallery__main-img{
  border-radius:10px;
}
.vl-json-single-active .vl-gallery__image-actions{
  position:absolute;
  top:12px;
  right:12px;
  z-index:8;
  display:flex;
  flex-direction:column;
  gap:8px;
  align-items:center;
}
.vl-json-single-active .vl-gallery__counter{
  top:12px!important;
  right:58px!important;
  z-index:7!important;
}

/* Match inventory-card favorite/share controls exactly. */
.vl-json-single-active .vl-gallery__image-actions .vl-card__action-btn{
  position:static!important;
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  min-height:36px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:9999px!important;
  background:rgba(255,255,255,.93)!important;
  box-shadow:0 2px 9px rgba(17,24,39,.13)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
  transition:transform .16s ease,box-shadow .16s ease!important;
  line-height:1!important;
  aspect-ratio:1/1;
  opacity:1!important;
}
.vl-json-single-active .vl-gallery__image-actions .vl-card__action-btn:hover{
  transform:scale(1.07);
  box-shadow:0 4px 12px rgba(17,24,39,.18)!important;
}
.vl-json-single-active .vl-gallery__image-actions .vl-card__fav-icon{
  width:20px!important;
  height:20px!important;
  fill:none;
  stroke:#526171;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:fill .16s ease,stroke .16s ease;
  pointer-events:none;
}
.vl-json-single-active .vl-gallery__image-actions .vl-card__fav-btn.is-active .vl-card__fav-icon{
  fill:#e1251b;
  stroke:#e1251b;
}
.vl-json-single-active .vl-gallery__image-actions .vl-card__share-icon{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
  display:block!important;
  pointer-events:none;
}

/* Magnifier in the lower-right corner of the main vehicle photo. */
.vl-json-single-active .vl-gallery__zoom{
  position:absolute;
  right:12px;
  bottom:12px;
  z-index:8;
  width:40px;
  height:40px;
  min-width:40px;
  min-height:40px;
  padding:0!important;
  border:0!important;
  border-radius:9999px!important;
  background:rgba(255,255,255,.94)!important;
  color:#253244!important;
  box-shadow:0 2px 10px rgba(17,24,39,.16)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease!important;
}
.vl-json-single-active .vl-gallery__zoom:hover{
  transform:scale(1.07);
  box-shadow:0 4px 14px rgba(17,24,39,.22)!important;
}
.vl-json-single-active .vl-gallery__zoom svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
}

@media (max-width:640px){
  .vl-json-single-active .vl-gallery__image-actions{top:12px;right:12px;gap:9px}
  .vl-json-single-active .vl-gallery__image-actions .vl-card__action-btn{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
  }
  .vl-json-single-active .vl-gallery__image-actions .vl-card__fav-icon{width:22px!important;height:22px!important}
  .vl-json-single-active .vl-gallery__image-actions .vl-card__share-icon{width:38px!important;height:38px!important}
  .vl-json-single-active .vl-gallery__counter{right:62px!important}
  .vl-json-single-active .vl-gallery__zoom{
    width:44px;
    height:44px;
    min-width:44px;
    min-height:44px;
  }
  .vl-json-single-active .vl-gallery__zoom svg{width:23px;height:23px}
}

/* Full-screen image viewer used by the magnifier. */
body.vl-detail-lightbox-open{overflow:hidden!important}
.vl-detail-lightbox{
  position:fixed;
  inset:0;
  z-index:1000000;
  background:rgba(8,15,26,.92);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px;
  box-sizing:border-box;
  animation:vl-detail-lightbox-in .18s ease-out;
}
@keyframes vl-detail-lightbox-in{from{opacity:0}to{opacity:1}}
.vl-detail-lightbox__stage{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
}
.vl-detail-lightbox__img{
  display:block;
  width:auto;
  height:auto;
  max-width:96%;
  max-height:92%;
  object-fit:contain;
  border-radius:10px;
  box-shadow:0 16px 50px rgba(0,0,0,.38)!important;
}
.vl-detail-lightbox__close{
  position:absolute;
  top:18px;
  right:18px;
  z-index:2;
  width:44px;
  height:44px;
  min-width:44px;
  min-height:44px;
  padding:0!important;
  border:0!important;
  border-radius:9999px!important;
  background:rgba(255,255,255,.96)!important;
  color:#111827!important;
  font-size:18px;
  line-height:1;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer;
  box-shadow:0 3px 14px rgba(0,0,0,.2)!important;
}
@media (max-width:640px){
  .vl-detail-lightbox{padding:14px}
  .vl-detail-lightbox__img{max-width:100%;max-height:88%;border-radius:8px}
  .vl-detail-lightbox__close{top:12px;right:12px}
}
@media (prefers-reduced-motion:reduce){
  .vl-json-single-active .vl-gallery__image-actions .vl-card__action-btn,
  .vl-json-single-active .vl-gallery__zoom{transition:none!important}
  .vl-detail-lightbox{animation:none!important}
}

/* ===== 1.1.11.42 — Product detail: non-sticky summary + gallery viewer + action placement ===== */
/* The right information column scrolls naturally with the page on desktop. */
.vl-json-single-active .vl-single-right{
  position:static!important;
  top:auto!important;
  align-self:start!important;
}

/* Photo count stays top-right. Favorite + WhatsApp share sit directly below it. */
.vl-json-single-active .vl-gallery__counter{
  top:12px!important;
  right:12px!important;
}
.vl-json-single-active .vl-gallery__image-actions{
  top:50px!important;
  right:12px!important;
}

/* Full-catalog lightbox carousel. */
.vl-detail-lightbox__stage{
  width:min(1440px,100%);
  height:100%;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
}
.vl-detail-lightbox__splide{
  width:100%;
  height:100%;
  position:relative;
}
.vl-detail-lightbox__splide .splide__track,
.vl-detail-lightbox__splide .splide__list,
.vl-detail-lightbox__splide .splide__slide{
  height:100%;
}
.vl-detail-lightbox__splide .splide__track{
  overflow:hidden;
}
.vl-detail-lightbox__splide .splide__list{
  display:flex;
  margin:0!important;
  padding:0!important;
}
.vl-detail-lightbox__splide .splide__slide{
  list-style:none!important;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px 64px;
  box-sizing:border-box;
}
.vl-detail-lightbox__splide .vl-detail-lightbox__img{
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:90vh!important;
  object-fit:contain!important;
  border-radius:10px;
  box-shadow:0 16px 50px rgba(0,0,0,.38)!important;
  -webkit-user-drag:none;
  user-select:none;
}
.vl-detail-lightbox__splide .splide__arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:4;
  width:46px;
  height:46px;
  border:0!important;
  border-radius:9999px!important;
  padding:0!important;
  background:rgba(255,255,255,.94)!important;
  color:#111827!important;
  box-shadow:0 4px 18px rgba(0,0,0,.22)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer;
}
.vl-detail-lightbox__splide .splide__arrow--prev{left:12px}
.vl-detail-lightbox__splide .splide__arrow--next{right:12px}
.vl-detail-lightbox__splide .splide__arrow svg{width:18px;height:18px;fill:#111827!important}
.vl-detail-lightbox__splide .splide__arrow--prev svg{transform:scaleX(-1)}
.vl-detail-lightbox__counter{
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  z-index:5;
  min-width:54px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(17,24,39,.72);
  color:#fff;
  font-size:13px;
  font-weight:700;
  text-align:center;
  line-height:1;
  backdrop-filter:blur(6px);
}

@media (max-width:640px){
  .vl-json-single-active .vl-gallery__counter{top:12px!important;right:12px!important}
  .vl-json-single-active .vl-gallery__image-actions{top:52px!important;right:12px!important}
  .vl-detail-lightbox{padding:10px!important}
  .vl-detail-lightbox__splide .splide__slide{padding:6px 0}
  .vl-detail-lightbox__splide .vl-detail-lightbox__img{max-height:86vh!important;border-radius:7px}
  .vl-detail-lightbox__splide .splide__arrow{width:40px;height:40px}
  .vl-detail-lightbox__splide .splide__arrow--prev{left:6px}
  .vl-detail-lightbox__splide .splide__arrow--next{right:6px}
  .vl-detail-lightbox__counter{bottom:12px}
}


/* ===== 1.1.11.45 — Product-detail promotional banner placement ===== */
/* Desktop: banner stays inside the 60% left column, directly above
   "Descripción general". */
@media (min-width:961px){
  .vl-json-single-active .vl-detail-promo-banner{
    width:100%!important;
    max-width:100%!important;
    margin:18px 0 24px!important;
    box-sizing:border-box!important;
  }
}

/* Mobile: keep it immediately after Año / Versión / Transmisión (order 40)
   and before the trust/benefits block (order 50). */
@media (max-width:960px){
  .vl-json-single-active .vl-detail-promo-banner{
    order:45!important;
    width:100%!important;
    max-width:100%!important;
    align-self:stretch!important;
    box-sizing:border-box!important;
  }
}
