/* Category banner layout */
.block-category {
  position: relative;
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.block-category-inner {
  position: relative;
}
.block-category .category-cover {
  position: relative;
  background: #1a1f30;
  border-radius: 8px;
  overflow: hidden;
}
.block-category .category-cover img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain !important;
  border-radius: 8px;
}
.block-category h1 {
  position: absolute !important;
  bottom: 1.5rem !important;
  left: 2rem !important;
  color: #fff !important;
  font-size: 1.8rem !important;
  font-weight: 700 !important;
  text-shadow:
    0 0 3px rgba(0,0,0,1),
    0 0 7px rgba(0,0,0,0.9),
    1px 1px 0 rgba(0,0,0,0.95), -1px -1px 0 rgba(0,0,0,0.95),
    1px -1px 0 rgba(0,0,0,0.95), -1px 1px 0 rgba(0,0,0,0.95),
    0 2px 5px rgba(0,0,0,0.9) !important;
  -webkit-text-stroke: 0.6px rgba(0,0,0,0.75);
  margin: 0 !important;
  z-index: 10 !important;
  max-width: 55% !important;
}
.block-category #category-description {
  position: absolute !important;
  bottom: 0.5rem !important;
  left: 2rem !important;
  color: rgba(255,255,255,0.8) !important;
  font-size: 0.9rem !important;
  text-shadow: 0 1px 6px rgba(0,0,0,0.5) !important;
  z-index: 10 !important;
  margin: 0 !important;
  max-width: 55% !important;
}

/* ===== CATEGORIAS ESPECÍFICAS ===== */

/* Cámaras Analógicas y HD-TVI */
.category-id-10977 h1 {
  bottom: 0% !important;
  left: 25% !important;
  white-space: nowrap !important;
  font-size: 1.5rem !important;
  max-width: 50% !important;
}
.category-id-10977 #category-description {
  bottom: 67% !important;
  left: 46% !important;
  max-width: 50% !important;
}
.category-id-10977 .category-cover {
  width: 105% !important;
  margin-left: -2.5% !important;
}
.category-id-10977 .category-cover img {
  width: 100% !important;
  object-fit: cover !important;
}

/* Videovigilancia */
.category-id-10917 .category-cover {
  width: 115% !important;
  margin-left: -7.5% !important;
  height: 110% !important;
  margin-top: -5% !important;
}
.category-id-10917 .category-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* Redes e IT */
.category-id-10918 .category-cover {
  width: 115% !important;
  margin-left: -7.5% !important;
}
.category-id-10918 .category-cover img {
  width: 100% !important;
  object-fit: cover !important;
}

/* Kits - Sistemas Completos */
.category-id-11071 .category-cover {
  width: 115% !important;
  margin-left: -7.5% !important;
}
.category-id-11071 .category-cover img {
  width: 100% !important;
  object-fit: cover !important;
}

/* Energía / Herramientas */
.category-id-10924 .category-cover {
  width: 100% !important;
  margin-left: 0 !important;
}
.category-id-10924 .category-cover img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  object-position: left center !important;
}
/* Energía / Herramientas: titulo ~30px mas abajo para no tapar el logo (sombra: regla general) */
.category-id-10924 .block-category h1 {
  bottom: -0.875rem !important;
}
.category-id-10924 .block-category {
  overflow: visible !important;
}

@media (min-width: 768px) {
  .block-category h1 {
    font-size: 2.2rem !important;
    bottom: 2rem !important;
    left: 2.5rem !important;
  }
  .block-category #category-description {
    bottom: 0.75rem !important;
    left: 2.5rem !important;
    font-size: 1rem !important;
  }
  .category-id-10977 h1 {
    bottom: 0% !important;
    left: 25% !important;
    font-size: 2rem !important;
  }
  .category-id-10977 #category-description {
    bottom: 68% !important;
    left: 46% !important;
  }
}

/* Cuadritos de subcategoria (bloque #subcategories): cuadrados y con la imagen completa.
   PS puede servir variantes apaisadas (category_cover_2x 2000x400) -> con aspect-ratio 1:1
   y object-fit contain el cuadro queda cuadrado y la imagen se ve entera. */
#subcategories .subcategory-image img,
.subcategories-list .subcategory-image img,
#subcategories .subcategory-image .img img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  /* cover: recorta al centro (donde va el producto) para que llene el cuadro;
     las variantes cuadradas se ven intactas. */
  object-fit: cover !important;
  background: #fff !important;
  border-radius: 6px;
}
/* el cuadro del contenedor tambien cuadrado */
#subcategories .subcategory-image,
.subcategories-list .subcategory-image {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 6px;
}
