.blog-detail-container {
  max-width: 1300px;
  margin: 0 auto;
}

/* Caja de cada swiper: 500x500 */
.blog-swiper-images,
.blog-swiper-videos {
  width: 100%;
  max-width: 450px;
  height: 450px;
  border-radius: 12px;
  overflow: hidden;
}

/* Slides llenan el alto del swiper */
.blog-swiper-images .swiper-wrapper,
.blog-swiper-videos .swiper-wrapper {
  height: 100%;
}

.blog-swiper-images .swiper-slide,
.blog-swiper-videos .swiper-slide {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Imagen */
.blog-swiper-img {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  object-fit: cover;
}

/* Video local */
.blog-swiper-video {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  object-fit: cover;
}

/* Iframe YouTube: llena el 500x500 */
.blog-swiper-iframe {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  border: 0;
}

.blog-text-card {
  width: 100%;
  max-width: 1100px;  /* para alinearse con el container */
  margin: 0 auto;
}

/* Forzar que nada recorte el texto del blog */
.blog-list-selected-section .blog-text-card,
.blog-list-selected-section .blog-text-card .card-body,
.blog-list-selected-section .blog-text-card .blog-text-body,
.blog-list-selected-section .blog-text-card .blog-text {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.blog-text {
  white-space: pre-line;
  font-size: 0.95rem;
  line-height: 1.6;
  color: #333;
  text-align: justify;
}

.swiper-button-prev .swiper-navigation-icon,
.swiper-button-next .swiper-navigation-icon {
  display: none !important;
}

/* =========================================================
   BLOG DETALLE: evitar recorte por estilos globales de .card
   ========================================================= */
.ecommerce-blog-list-selected-section .blog-text-card.card {
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important; /* por si .card global tiene overflow:hidden */
}

.ecommerce-blog-list-selected-section .blog-text-card.card .card-body,
.ecommerce-blog-list-selected-section .blog-text-card.card .blog-text-body,
.ecommerce-blog-list-selected-section .blog-text-card.card .blog-text {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Si algún contenedor padre está “cortando” */
.ecommerce-blog-list-selected-section,
.ecommerce-blog-list-selected-section .blog-detail-container {
  overflow: visible !important;
}
