/* ==== SOLO sliders .is-special-group ==== */

/* ---------- Encabezado superior de la fila (solo especiales) ---------- */
.category_products_container.is-special-group .special-group-header {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  float: none !important;
  direction: ltr;

  background: #001f2f;
  color: #fff;
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1.2;

  padding: 14px 12px;
  margin: 0 0 10px 0;
  border-radius: 0 !important;
}

.category_products_container.is-special-group .special-group-header>* {
  text-align: center !important;
  margin: 0 auto !important;
}

/* En móvil el contenedor padre tiene padding lateral: compénsalo (ahora 6px) */
@media (max-width: 992px) {
  .category_products_container.is-special-group .special-group-header {
    margin-left: -6px !important;
    margin-right: -6px !important;
    width: calc(100% + 12px) !important;
    letter-spacing: .05em;
    padding: 12px 10px;
  }
}

/* ---------- Evitar “caja gigante” antes de inicializar Swiper ---------- */
.category_products_container.is-special-group .products_sldier_swiper.swiper_loading {
  visibility: hidden;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0;
}

.category_products_container.is-special-group .products_sldier_swiper:not(.swiper_loading),
.category_products_container.is-special-group .products_sldier_swiper.swiper-initialized,
.category_products_container.is-special-group .products_sldier_swiper.swiper-container-initialized {
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  transition: opacity .15s ease;
}

/* ---------- Quita huecos globales del slider ---------- */
.category_products_container.is-special-group .products_slider .block_content {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.category_products_container.is-special-group .products_sldier_swiper {
  padding-bottom: 0 !important;
}

/* por si hay fondos en slide */
.category_products_container.is-special-group .swiper-slide {
  background: transparent !important;
  height: auto !important;
}

/* Estirar slides a la misma altura de fila */
.category_products_container.is-special-group .products_sldier_swiper .swiper-wrapper {
  align-items: stretch !important;
}

/* ---------- Card base + overlay-borde (en el nivel superior) ---------- */
.category_products_container.is-special-group .ajax_block_product {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  background: transparent;
  /* no pinte blanco */
  border: none;
  /* el borde real lo dibuja el ::after */
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
  overflow: hidden;

  display: flex;
  flex-direction: column;
  height: 100%;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;

  contain: paint;
  transition: none;
}

/* Asegura que cualquier wrapper no introduzca margen abajo */
.category_products_container.is-special-group .products_sldier_swiper .ajax_block_product,
.category_products_container.is-special-group .product_list.grid .ajax_block_product {
  margin-bottom: 0 !important;
}

.category_products_container.is-special-group .ajax_block_product::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: 2;
  border: 1px solid #1a5b75;
  /* borde normal */
  opacity: 1;
  transition: none;
}

@media (hover:hover) and (pointer:fine) {
  .category_products_container.is-special-group .ajax_block_product::after {
    transition: border-color .12s ease, border-width .12s ease;
  }

  .category_products_container.is-special-group .ajax_block_product:hover::after {
    border-color: #001f2f;
    /* azul más oscuro en hover */
    border-width: 2px;
  }

  .category_products_container.is-special-group .ajax_block_product:hover {
    cursor: pointer;
  }
}

@media (hover:none) and (pointer:coarse) {
  .category_products_container.is-special-group .ajax_block_product::after {
    border: 1px solid #1a5b75;
  }
}

/* ---------- Layout interno y padding cero para evitar blancos ---------- */
.category_products_container.is-special-group .pro_outer_box {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  flex: 1 1 auto;
  /* llena la altura */
  background: transparent;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
}

.category_products_container.is-special-group .pro_second_box {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  flex: 1 1 auto;
  /* empuja la franja azul al pie */
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Panda suele añadir padding aquí: lo anulamos en este contexto */
.category_products_container.is-special-group .products_sldier_swiper .pro_second_box {
  padding: 4px 0 0 0 !important;
}

.category_products_container.is-special-group .pro_outer_box>*:last-child {
  margin-bottom: 0 !important;
}

.category_products_container.is-special-group .pro_first_box {
  padding-top: 6px;
}

/* ---------- Imagen: sin zooms ni transforms que “pisen” el borde ---------- */
.category_products_container.is-special-group .product_img_link {
  display: block;
  position: relative;
  z-index: 1;
  /* debajo del overlay-borde (::after) */
  overflow: hidden;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  line-height: 0;
  background: transparent;
  transform: none !important;
}

/* Ocultar placeholder/holder que añade altura */
.category_products_container.is-special-group .product_img_link .holder {
  display: none !important;
}

.category_products_container.is-special-group .front_image_pic,
.category_products_container.is-special-group .back_image_pic {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
}

/* Reserva relación para reducir saltos de layout al cargar imágenes */
.category_products_container.is-special-group .front_image_pic {
  aspect-ratio: 1 / 1;
}

.category_products_container.is-special-group .front_image_pic img,
.category_products_container.is-special-group .back_image_pic img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  /* usa cover si prefieres llenar */
  transform: none !important;
  transition: none !important;
}

/* si el tema escala en hover, anúlalo aquí */
.category_products_container.is-special-group .ajax_block_product:hover .product_img_link.pro_img_hover_scale {
  transform: none !important;
}

/* ---------- Franja inferior (precio + botón) a ras de borde ---------- */
.category_products_container.is-special-group .act_box_cart {
  margin-top: auto;
  /* SIEMPRE al pie */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;

  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 8px;
  padding-bottom: 8px;

  background: #1a5b75;
  /* franja */
  color: #fff;
  border-radius: 0 0 12px 12px;
  margin: 0;
  text-align: center;

  min-height: 0 !important;
  /* no fuerces blancos extra */
}

/* Por si Panda mete márgenes debajo del bloque de precio */
.category_products_container.is-special-group .act_box_cart .product-prices,
.category_products_container.is-special-group .act_box_cart .product-price {
  margin-bottom: 0 !important;
}

/* Precio centrado con tachado a la derecha */
.category_products_container.is-special-group .act_box_cart .product-price-and-shipping,
.category_products_container.is-special-group .act_box_cart .product-prices,
.category_products_container.is-special-group .act_box_cart .product-price {
  background: transparent !important;
  border-radius: 0;
  margin: 10px 0 2px !important;
  /* separa del botón */
  padding: 0 !important;

  display: inline-flex !important;
  align-items: baseline;
  justify-content: center;
  gap: 6px;
  width: 100%;
  min-height: 24px;
}

.category_products_container.is-special-group .act_box_cart .price {
  order: 1;
  color: #fff !important;
  font-weight: 800;
  font-size: 1rem;
  line-height: 1.2;
  white-space: nowrap;
}

.category_products_container.is-special-group .act_box_cart .regular-price,
.category_products_container.is-special-group .act_box_cart .old-price {
  order: 2;
  color: #b73c24 !important;
  /* tachado rojo */
  text-decoration: line-through;
  margin: 0;
  font-weight: 700;
  font-size: .92rem;
  opacity: .95;
  white-space: nowrap;
}

/* ---------- Botones uniformes (Reservar / Agotado) ---------- */
/* Tipografía */
.category_products_container.is-special-group .act_box_cart .ajax_add_to_cart_button,
.category_products_container.is-special-group .act_box_cart [data-button-action="add-to-cart"],
.category_products_container.is-special-group .act_box_cart .hover_fly_btn,
.category_products_container.is-special-group .act_box_cart .hover_fly_btn .hover_fly_btn_inner,
.category_products_container.is-special-group .act_box_cart .hover_fly_btn .hover_fly_btn_inner span {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Helvetica Neue", sans-serif !important;
  font-weight: 600;
}

/* Base: mismo tamaño para ambos, ancho proporcional dentro de la tarjeta */
.category_products_container.is-special-group .act_box_cart .ajax_add_to_cart_button,
.category_products_container.is-special-group .act_box_cart [data-button-action="add-to-cart"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;

  width: 92%;
  max-width: 260px;
  height: 42px;
  /* ← mismo alto */
  padding: 0 14px;

  font-size: .95rem;
  letter-spacing: .01em;
  text-transform: none;
  text-align: center;
  line-height: 1.1;
  color: #fff !important;

  border-radius: 8px;
  border: 1px solid #fff;
  /* ← borde blanco en ambos */
  margin: 0 auto;

  transition: background-color .12s ease, border-color .12s ease;
}

/* Oculta icono/img en botón: solo texto */
.category_products_container.is-special-group .act_box_cart .ajax_add_to_cart_button img,
.category_products_container.is-special-group .act_box_cart .ajax_add_to_cart_button .icon_btn {
  display: none !important;
}

/* RESERVAR (en stock: sin .button_sin_stock) => #0f3b52 normal / #001f2f hover */
.category_products_container.is-special-group .act_box_cart .ajax_add_to_cart_button:not(.button_sin_stock),
.category_products_container.is-special-group .act_box_cart [data-button-action="add-to-cart"]:not(.button_sin_stock) {
  background: #f3c471;
  color:#0f3b52 !important;
  border-color: #0f3b52;
  /* borde blanco, como pides */
}

.category_products_container.is-special-group .act_box_cart .ajax_add_to_cart_button:not(.button_sin_stock):hover,
.category_products_container.is-special-group .act_box_cart [data-button-action="add-to-cart"]:not(.button_sin_stock):hover {
  background: #e8ae48;
  color:#001f2f !important;
  border-color: #001f2f;
}

/* AGOTADO (con .button_sin_stock): mismo tamaño, fondo transparente, borde blanco */
.category_products_container.is-special-group .act_box_cart .ajax_add_to_cart_button.button_sin_stock {
  background: transparent;
  border-color: #0f3b52;
  color: inherit;
  /* que conserve el color de texto del tema si lo tuviera */
}

.category_products_container.is-special-group .act_box_cart .ajax_add_to_cart_button.button_sin_stock:hover {
  background: rgba(255, 255, 255, .12);
}

/* ---------- Ocultaciones propias del especial ---------- */
.category_products_container.is-special-group .mini_name .s_title_block,
.category_products_container.is-special-group h3.s_title_block,
.category_products_container.is-special-group .product-miniature .s_title_block {
  display: none !important;
  /* oculta título */
}

.category_products_container.is-special-group .btn-view-more,
.category_products_container.is-special-group a[title="View more"],
.category_products_container.is-special-group a[title="Ver más"],
.category_products_container.is-special-group .product_view_more_box {
  display: none !important;
  /* oculta “Ver más” */
}

/* El contenedor de acciones extra bajo la franja azul provoca el hueco: fuera */
.category_products_container.is-special-group .act_box_inner,
.category_products_container.is-special-group .pro_second_box .act_box_inner,
.category_products_container.is-special-group .products_sldier_swiper .pro_second_box .act_box_inner {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------- Gutters / separación entre tarjetas: 8px ---------- */
.category_products_container.is-special-group .swiper-wrapper {
  margin-left: -4px;
  margin-right: -4px;
}

.category_products_container.is-special-group .swiper-slide {
  margin: 0 4px;
  /* ~8px entre tarjetas */
}

/* ---------- Márgenes laterales en viewport estrechos (ahora 6px por lado) ---------- */
@media (max-width: 992px) {
  .category_products_container.is-special-group {
    padding-left: 6px;
    padding-right: 6px;
  }
}

/* ======= MÓVIL (compact) ======= */
@media (max-width: 576px) {
  .category_products_container.is-special-group .swiper-wrapper {
    margin-left: -4px;
    margin-right: -4px;
  }

  .category_products_container.is-special-group .swiper-slide {
    margin: 0 4px;
  }

  .category_products_container.is-special-group .ajax_block_product {
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
  }

  .category_products_container.is-special-group .ajax_block_product::after {
    border-radius: inherit;
  }

  .category_products_container.is-special-group .product_img_link {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
  }

  .category_products_container.is-special-group .act_box_cart {
    padding-top: 7px;
    padding-bottom: 7px;
    border-radius: 0 0 10px 10px;
    min-height: 0 !important;
    /* nada de alturas mínimas */
  }

  .category_products_container.is-special-group .act_box_cart .price {
    font-size: .96rem;
  }

  .category_products_container.is-special-group .act_box_cart .regular-price,
  .category_products_container.is-special-group .act_box_cart .old-price {
    font-size: .9rem;
  }

  .category_products_container.is-special-group .act_box_cart .ajax_add_to_cart_button,
  .category_products_container.is-special-group .act_box_cart [data-button-action="add-to-cart"] {
    width: 94%;
    max-width: 260px;
    height: 38px;
    font-size: .94rem;
  }
}