/* Banner de la ficha móvil con la misma identidad del escritorio. */
@media(max-width:999px){
 html body #detail#detail .vehicleTitle{
  background:linear-gradient(115deg,#641f2c,#a6323c 55%,#173d53)!important;
  border:1px solid #e16a6a70!important;
  border-radius:11px!important;
  box-shadow:0 5px 18px #0002!important;
 }
}
@media(max-width:750px){
 html body #detail#detail .vehicleTitle{padding:10px 8px!important;min-height:0!important;height:auto!important}
 html body #detail#detail .vehicleTitle h1{margin:0 0 6px!important}
 html body #detail#detail .vehicleTitle .vehiclePrice{margin:4px 0!important}
 html body #detail#detail .vehicleTitle .adMeta{margin:6px 0 0!important}
}
/* Ficha unificada de escritorio: datos legibles junto a la fotografía. */
@media(min-width:1000px){
 html body #detail#detail .vehicleDetail{
  display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)!important;
  gap:16px 24px!important;max-width:1200px!important;margin:20px auto!important;
  padding:22px!important;border:1px solid #658494;border-radius:16px;
  background:#142f40f5;box-shadow:0 12px 36px #0004;--sheet-text:16px;
 }
 html body #detail#detail .vehicleDetail>*{min-width:0}
 html body #detail#detail .vehicleDetail>section{margin:0!important}
 html body #detail#detail .vehicleTitle{grid-column:1/-1;padding:22px 24px!important;min-height:0!important;margin:0 0 4px!important;background:linear-gradient(115deg,#641f2c,#a6323c 55%,#173d53)!important;border:1px solid #e16a6a70!important;border-radius:11px!important;box-shadow:0 5px 18px #0002!important;text-align:center!important}
 html body #detail#detail .vehicleTitle h1{font-size:32px!important;margin:0 0 4px!important}
 html body #detail#detail .vehiclePrice{font-size:28px!important;margin:0!important}
 html body #detail#detail .adMeta{font-size:12px!important;margin:4px 0 0!important}
 html body #detail#detail .vehicleGallery{grid-column:1;grid-row:2;text-align:center}
 html body #detail#detail .vehiclePhotoStage{width:100%!important;max-width:460px!important;margin:0 auto!important}
 html body #detail#detail #vehiclePhotoCount{font-size:13px!important;margin:4px 0!important}
 html body #detail#detail .expandPhoto{padding:5px 12px!important;min-height:30px!important;font-size:12px!important}
 html body #detail#detail .vehicleSeller{grid-column:1;grid-row:3;max-width:none!important;width:100%!important;padding:0 0 4px!important}
 html body #detail#detail .vehicleSeller h3,
 html body #detail#detail .ownerDescriptionBox h3{font-size:16px!important;margin:0!important;padding:5px 9px!important}
 html body #detail#detail .vehicleSeller dl>div{font-size:16px!important;padding:4px 9px!important}
 html body #detail#detail .sellerButtons{gap:6px!important;padding:4px 9px!important}
 html body #detail#detail .sellerButtons a{font-size:15px!important;min-height:40px!important;padding:9px 12px!important}
 html body #detail#detail .ownerDescriptionBox{grid-column:1;grid-row:4}
 html body #detail#detail .ownerDescriptionBox .vehicleDescription{font-size:16px!important;padding:7px 9px!important;line-height:1.5!important;overflow-wrap:anywhere}
 html body #detail#detail .vehicleDetail>section:has(>.vehicleFacts){grid-column:2;grid-row:2/5}
 html body #detail#detail .vehicleDetail>section:has(>.vehicleEquipment){grid-column:1/-1}
 html body #detail#detail .vehicleDetail h3{font-size:18px!important;margin:0 0 9px!important;padding-bottom:8px!important}
 html body #detail#detail .vehicleFacts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 html body #detail#detail .vehicleFacts>div{font-size:15px!important;line-height:1.45!important;padding:9px 8px!important;grid-template-columns:48% 52%!important}
 html body #detail#detail .vehicleFacts dt{padding-right:5px!important}
 html body #detail#detail .vehicleEquipment{grid-template-columns:repeat(3,minmax(0,1fr))!important;margin:0!important;padding-left:0!important;gap:2px 10px!important}
 html body #detail#detail .vehicleEquipment li{font-size:15px!important;padding:7px 9px!important;line-height:1.4!important}
 html body #detail#detail .vehicleShare{grid-column:1/-1;margin:0!important;gap:6px!important}
 html body #detail#detail .vehicleShare button{font-size:12px!important;padding:5px 10px!important;min-height:30px!important}
 html body #detail#detail .reportAd{margin:0!important;font-size:12px!important;align-self:center}
 html body #detail#detail .vehicleReturn{justify-self:end;margin:0!important;padding:7px 12px!important;font-size:13px!important}
 html body #detail#detail .vehicleViews{font-size:12px!important;margin:6px 0!important}
}

/* Carrotico · fotos 4:3 inteligentes · 19 oct 2026.
   Las fotos nuevas se ajustan al subirlas; los anuncios anteriores se ven completos
   sobre un fondo desenfocado sin modificar sus archivos guardados. */
html body .carPhotoFrame {
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:4 / 3!important;
  overflow:hidden!important;
  isolation:isolate;
  flex-shrink:0!important;
  background:#cbd9e2!important;
}
html body .carPhotoFrame > img {
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  border:0!important;
  border-radius:0!important;
  margin:0!important;
}
html body .carPhotoFrame > .carPhotoBackdrop,
html body #detail .vehiclePhotoStage > .carPhotoBackdrop {
  object-fit:cover!important;
  filter:blur(16px) brightness(.82);
  transform:scale(1.12);
  z-index:0;
}
html body .carPhotoFrame > .carPhotoMain,
html body #detail .vehiclePhotoStage > .carPhotoMain {
  object-fit:contain!important;
  z-index:1;
  transform:none!important;
  filter:none!important;
  background:transparent!important;
}
html body #cars#cars .card > .catalogPhotoFrame {
  position:relative!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:4 / 3!important;
  margin:0!important;
  border-radius:0!important;
  overflow:hidden!important;
}
@media(max-width:999px){
 html body #cars#cars.list .card > .catalogPhotoFrame {
  width:80px!important;
  height:60px!important;
  min-width:80px!important;
  margin:4px!important;
  border-radius:6px!important;
  align-self:flex-start!important;
 }
}
@media(min-width:1000px){
 html body #cars#cars.list .card > .catalogPhotoFrame {
  width:100%!important;
  height:auto!important;
  min-width:0!important;
  max-width:none!important;
  aspect-ratio:4 / 3!important;
  margin:0!important;
  border-radius:0!important;
  align-self:stretch!important;
 }
}
html body #cars#cars.list .card > .catalogPhotoFrame > img {
  width:100%!important;
  height:100%!important;
}
html body #detail .vehiclePhotoStage {
  position:relative!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:4 / 3!important;
  max-height:none!important;
  overflow:hidden!important;
  background:#cbd9e2!important;
}
html body #detail .vehiclePhotoStage > img.carPhotoBackdrop,
html body #detail .vehiclePhotoStage > img.carPhotoMain {
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  object-position:center center!important;
}
/* Galería mediana en computadora; foto completa y flechas dentro del cuadro. */
@media(min-width:1000px){
 html body #detail .vehiclePhotoStage {
  width:min(100%,600px,80vh)!important;
  max-width:600px!important;
  margin:16px auto!important;
  border-radius:10px!important;
 }
}
html body #detail .vehiclePhotoStage > .carPhotoBackdrop {z-index:0!important;}
html body #detail .vehiclePhotoStage > .carPhotoMain {z-index:1!important;}
html body #detail .vehiclePhotoStage > button {z-index:2!important;}
html body #publish .photoTile > .uploadPhotoFrame {
  aspect-ratio:4 / 3!important;
  width:100%!important;
  height:auto!important;
  border-radius:7px!important;
}
html body #publish .photoTile .carPhotoFrame > img {
  height:100%!important;
  width:100%!important;
}
html body #publish #reviewSummary > .reviewPhotoFrame {
  display:block!important;
  width:min(100%,430px)!important;
  height:auto!important;
  aspect-ratio:4/3!important;
  margin:12px 0!important;
  border-radius:8px!important;
}
/* Catálogo móvil compacto: foto 4:3 amplia junto a los datos. */
@media(max-width:999px){
 html body #cars#cars{grid-template-columns:1fr!important}
 html body #cars#cars .card{
  display:grid!important;grid-template-columns:minmax(0,38%) minmax(0,1fr)!important;
  align-items:center!important;min-height:0!important;height:auto!important;
  padding:0!important;overflow:hidden!important;border-radius:7px!important;
 }
 html body #cars#cars.list .card > .catalogPhotoFrame{
  width:100%!important;min-width:0!important;max-width:none!important;
  height:auto!important;min-height:0!important;max-height:none!important;
  aspect-ratio:4/3!important;margin:0!important;border-radius:0!important;
  align-self:center!important;
 }
 html body #cars#cars.list .info{width:100%!important;min-width:0!important;padding:8px 9px!important}
 html body #cars#cars.list .info h3{font-size:16px!important;line-height:1.25!important;white-space:normal!important}
 html body #cars#cars.list .price{font-size:21px!important}
 html body #cars#cars.list .specs{font-size:12px!important;line-height:1.35!important}
 html body #cars#cars.list .usdPrice{font-size:13px!important}
}

/* Catálogo: recorte solo con detección segura. Ficha: foto original completa. */
html body #cars#cars .catalogPhotoFrame > .carPhotoMain,
html body #detail#detail .vehiclePhotoStage > .carPhotoMain {object-fit:contain!important;object-position:center center!important;}
/* Flechas discretas en móvil: conservar superficie táctil y navegación. */
@media(max-width:999px){
 html body #detail#detail .vehiclePhotoStage .photoPrev,
 html body #detail#detail .vehiclePhotoStage .photoNext,
 html body #photoViewer#photoViewer .viewerPrev,
 html body #photoViewer#photoViewer .viewerNext{
  background:rgba(16,43,57,.08)!important;
  color:rgba(255,255,255,.85)!important;
  font-size:30px!important;font-weight:400!important;
  border:0!important;box-shadow:none!important;
  text-shadow:0 1px 3px rgba(0,0,0,.55)!important;
 }
 html body #detail#detail .vehiclePhotoStage .photoPrev:active,
 html body #detail#detail .vehiclePhotoStage .photoNext:active,
 html body #photoViewer#photoViewer .viewerPrev:active,
 html body #photoViewer#photoViewer .viewerNext:active{
  background:rgba(16,43,57,.18)!important;color:#fff!important;
 }
 html body #detail#detail .vehiclePhotoStage .photoPrev:focus-visible,
 html body #detail#detail .vehiclePhotoStage .photoNext:focus-visible,
 html body #photoViewer#photoViewer .viewerPrev:focus-visible,
 html body #photoViewer#photoViewer .viewerNext:focus-visible{
  outline:2px solid #fff!important;outline-offset:-3px!important;
 }
}