/* =========================================================
   V82.39 — Tarjetas de cupones tipo "discount card"
   Replica la propuesta visual aprobada sin cambiar la lógica.
   Aplica a Tienda y Exclusivos. Bancarios conservan su diseño.
   ========================================================= */

#cupones .cupon:not(.cupon-bancario) {
  --card-accent: var(--categoria-cupon-color, #22b867);
  --card-accent-deep: color-mix(in srgb, var(--card-accent) 78%, #0b1b12 22%);
  --card-accent-bright: color-mix(in srgb, var(--card-accent) 86%, #ffffff 14%);

  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 18px !important;
  color: #fff !important;
  background:
    linear-gradient(135deg, var(--card-accent-bright) 0%, var(--card-accent) 54%, var(--card-accent-deep) 100%) !important;
  box-shadow:
    0 8px 18px color-mix(in srgb, var(--card-accent) 18%, transparent),
    inset 0 1px 0 rgba(255,255,255,.22) !important;
}

/* Textura geométrica tipo tarjeta de descuento, 100% CSS. */
#cupones .cupon:not(.cupon-bancario)::before,
#cupones .cupon:not(.cupon-bancario)::after {
  content: "";
  position: absolute;
  inset: -16%;
  z-index: -1;
  pointer-events: none;
}

#cupones .cupon:not(.cupon-bancario)::before {
  opacity: .32;
  transform: rotate(-5deg) scale(1.08);
  background:
    repeating-linear-gradient(18deg, rgba(255,255,255,.12) 0 1px, transparent 1px 17px),
    repeating-linear-gradient(108deg, rgba(255,255,255,.075) 0 1px, transparent 1px 25px),
    repeating-linear-gradient(151deg, rgba(0,0,0,.055) 0 1px, transparent 1px 31px);
}

#cupones .cupon:not(.cupon-bancario)::after {
  inset: 0;
  opacity: .42;
  background:
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.15), transparent 26%),
    linear-gradient(118deg, transparent 0 34%, rgba(255,255,255,.07) 34% 35%, transparent 35% 72%, rgba(255,255,255,.055) 72% 73%, transparent 73% 100%);
}

/* Encabezado integrado dentro de la misma tarjeta. */
#cupones .cupon:not(.cupon-bancario) .franja-categoria-cupon {
  position: relative;
  z-index: 2;
  min-height: 24px;
  padding: 6px 8px 3px;
  border: 0 !important;
  color: rgba(255,255,255,.98) !important;
  background: transparent !important;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.05;
  letter-spacing: .035em;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 0 1px 3px rgba(0,0,0,.20);
}

#cupones .cupon:not(.cupon-bancario) .cupon-encabezado {
  position: relative;
  z-index: 2;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 70px !important;
  padding: 6px 10px 5px !important;
  border: 0 !important;
  color: #fff !important;
  background: transparent !important;
}

#cupones .cupon:not(.cupon-bancario) .cupon-encabezado::after {
  display: none !important;
}

#cupones .cupon:not(.cupon-bancario) .cupon-logo {
  width: auto !important;
  max-width: 76px !important;
  height: 35px !important;
  flex: 0 0 auto !important;
  object-fit: contain;
  border: 0 !important;
  border-radius: 9px !important;
  padding: 2px 5px;
  background: rgba(255,255,255,.96) !important;
  box-shadow: 0 3px 8px rgba(0,0,0,.13);
}

#cupones .cupon:not(.cupon-bancario) .descuento {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(28px, 2.6vw, 38px) !important;
  font-weight: 900 !important;
  line-height: .98 !important;
  letter-spacing: -.035em;
  text-align: center;
  text-shadow: 0 2px 5px rgba(0,0,0,.22);
}

/* Cuerpo transparente: todo forma una sola tarjeta de color. */
#cupones .cupon:not(.cupon-bancario) .cupon-contenido {
  position: relative;
  z-index: 2;
  padding: 4px 12px 10px !important;
  color: #fff !important;
  background: transparent !important;
}

#cupones .cupon:not(.cupon-bancario) .cupon-etiquetas {
  justify-content: center;
  gap: 5px !important;
  min-height: 0;
  margin: 0 0 5px !important;
}

#cupones .cupon:not(.cupon-bancario) .etiqueta-cupon,
#cupones .cupon:not(.cupon-bancario) .etiqueta-popular-integrada {
  border: 0 !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.17) !important;
}

#cupones .cupon:not(.cupon-bancario) .detalle-beneficio-exclusivo,
#cupones .cupon:not(.cupon-bancario) .beneficio-bancario,
#cupones .cupon:not(.cupon-bancario) .condiciones-cupon,
#cupones .cupon:not(.cupon-bancario) .condicion-cupon,
#cupones .cupon:not(.cupon-bancario) .condicion-cupon strong {
  color: #fff !important;
}

#cupones .cupon:not(.cupon-bancario) .detalle-beneficio-exclusivo {
  margin: 0 0 5px !important;
  font-weight: 600;
  opacity: .96;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0,0,0,.16);
}

#cupones .cupon:not(.cupon-bancario) .condiciones-cupon {
  gap: 2px !important;
  margin: 2px 0 7px !important;
  text-align: center;
}

#cupones .cupon:not(.cupon-bancario) .condicion-cupon {
  margin: 0 !important;
  font-weight: 500;
  line-height: 1.25 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.16);
}

#cupones .cupon:not(.cupon-bancario) .condicion-cupon strong {
  font-weight: 900 !important;
}

/* CTA amarillo como en la propuesta. */
#cupones .cupon:not(.cupon-bancario) .acciones-bloque {
  padding-top: 3px !important;
}

#cupones .cupon:not(.cupon-bancario) .acciones-cupon {
  margin: 0 !important;
}

#cupones .cupon:not(.cupon-bancario) .boton-canjear {
  width: min(100%, 225px) !important;
  min-height: 39px;
  margin-inline: auto;
  border: 1px solid rgba(129, 96, 0, .30) !important;
  border-radius: 11px !important;
  color: #161616 !important;
  background: linear-gradient(180deg, #ffe600 0%, #ffd400 100%) !important;
  box-shadow: 0 4px 10px rgba(0,0,0,.16) !important;
  font-weight: 800 !important;
}

#cupones .cupon:not(.cupon-bancario) .boton-canjear:hover,
#cupones .cupon:not(.cupon-bancario) .boton-canjear:focus-visible {
  filter: brightness(1.035);
  transform: translateY(-1px);
}

#cupones .cupon:not(.cupon-bancario) .cupon-copiado-mini {
  color: #fff !important;
  background: rgba(0,0,0,.16) !important;
}

/* Interacciones redondas integradas. */
#cupones .cupon:not(.cupon-bancario) .acciones-secundarias {
  justify-content: center !important;
  gap: 8px !important;
  margin-top: 7px !important;
}

#cupones .cupon:not(.cupon-bancario) .boton-like,
#cupones .cupon:not(.cupon-bancario) .boton-compartir {
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 2px 7px rgba(0,0,0,.12) !important;
}

#cupones .cupon:not(.cupon-bancario) .boton-like {
  color: #56625d !important;
  background: rgba(255,255,255,.92) !important;
}

#cupones .cupon:not(.cupon-bancario) .boton-like.activo {
  color: #fff !important;
  background: #1fb877 !important;
}

#cupones .cupon:not(.cupon-bancario) .boton-compartir {
  color: #fff !important;
  background: #20c57a !important;
}

#cupones .cupon:not(.cupon-bancario) .estadisticas-cupon,
#cupones .cupon:not(.cupon-bancario) .estadistica-item,
#cupones .cupon:not(.cupon-bancario) .estadistica-likes,
#cupones .cupon:not(.cupon-bancario) .estadistica-usos {
  color: rgba(255,255,255,.98) !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.18);
}

/* Temporizador dentro de la tarjeta, sin caja adicional. */
#cupones .cupon:not(.cupon-bancario) .estado-programacion {
  margin-top: 8px !important;
  padding: 7px 2px 0 !important;
  border-top: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 0 !important;
  color: rgba(255,255,255,.98) !important;
  background: transparent !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.16);
}

#cupones .cupon:not(.cupon-bancario) .estado-programacion .estado-tiempo,
#cupones .cupon:not(.cupon-bancario) .estado-programacion .estado-linea {
  color: #fff !important;
  font-weight: 800 !important;
}

#cupones .cupon:not(.cupon-bancario) .estado-programacion .estado-progreso,
#cupones .cupon:not(.cupon-bancario) .estado-programacion .estado-progreso-barra {
  display: none !important;
}

/* Agotados: conserva el lenguaje de la tarjeta pero baja intensidad. */
#cupones .cupon:not(.cupon-bancario).cupon-agotado {
  filter: saturate(.42) grayscale(.08);
  opacity: .72;
}

#cupones .cupon:not(.cupon-bancario).cupon-agotado .boton-canjear,
#cupones .cupon:not(.cupon-bancario) .boton-canjear:disabled {
  border-color: rgba(255,255,255,.20) !important;
  color: rgba(255,255,255,.88) !important;
  background: rgba(255,255,255,.17) !important;
  box-shadow: none !important;
}

/* MÓVIL: 2 columnas, proporción compacta como la propuesta. */
@media (max-width: 680px) {
  #cupones .cupon:not(.cupon-bancario) {
    border-radius: 16px !important;
    box-shadow: 0 6px 14px color-mix(in srgb, var(--card-accent) 16%, transparent) !important;
  }

  #cupones .cupon:not(.cupon-bancario) .franja-categoria-cupon {
    min-height: 20px;
    padding: 5px 4px 2px;
    font-size: 8.5px;
  }

  #cupones .cupon:not(.cupon-bancario) .cupon-encabezado {
    gap: 4px;
    min-height: 54px !important;
    padding: 4px 6px 4px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .cupon-logo {
    max-width: 58px !important;
    height: 27px !important;
    padding: 1px 4px;
    border-radius: 7px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .descuento {
    font-size: clamp(24px, 7.2vw, 31px) !important;
    line-height: .96 !important;
  }

  #cupones .cupon:not(.cupon-bancario) .cupon-contenido {
    padding: 3px 7px 7px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .cupon-etiquetas {
    gap: 3px !important;
    margin-bottom: 5px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .etiqueta-cupon,
  #cupones .cupon:not(.cupon-bancario) .etiqueta-popular-integrada {
    font-size: 7.8px !important;
    padding: 4px 6px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .condiciones-cupon {
    margin-bottom: 6px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .condicion-cupon {
    font-size: 10px !important;
    line-height: 1.22 !important;
  }

  #cupones .cupon:not(.cupon-bancario) .detalle-beneficio-exclusivo {
    font-size: 9px !important;
    line-height: 1.18 !important;
  }

  #cupones .cupon:not(.cupon-bancario) .boton-canjear {
    width: min(100%, 150px) !important;
    min-height: 34px;
    padding: 7px 5px !important;
    border-radius: 9px !important;
    font-size: 10.5px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .acciones-secundarias {
    gap: 5px !important;
    margin-top: 6px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .boton-like,
  #cupones .cupon:not(.cupon-bancario) .boton-compartir {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .estadisticas-cupon {
    gap: 4px !important;
    font-size: 8.5px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .estado-programacion {
    margin-top: 6px !important;
    padding: 5px 1px 0 !important;
    font-size: 8.7px !important;
  }
}

/* WEB: conserva la grilla 3/4 columnas ya aprobada. */
@media (min-width: 769px) {
  #cupones .cupon:not(.cupon-bancario) .franja-categoria-cupon {
    min-height: 25px;
    padding-top: 6px;
    font-size: 10px;
  }

  #cupones .cupon:not(.cupon-bancario) .cupon-encabezado {
    min-height: 68px !important;
  }

  #cupones .cupon:not(.cupon-bancario) .descuento {
    font-size: clamp(27px, 2.25vw, 36px) !important;
  }
}

/* V82.40 — Bordes de tarjetas de cupones sin estilo punteado */
#cupones .cupon,
#cupones .cupon.cupon-bancario {
  border-style: solid !important;
}

#cupones .cupon:not(.cupon-bancario) {
  border-width: 1px !important;
  border-color: color-mix(in srgb, var(--card-accent) 76%, #ffffff 24%) !important;
}

/* =========================================================
   V82.40.1 — Cupones sin orilla punteada (corrección definitiva)
   - Elimina la orilla heredada de css/style.css.
   - Tienda/Exclusivo conservan su textura ::after sin borde.
   - Bancarios también quedan sin orilla punteada.
   ========================================================= */
#cupones.cupones-grid-compacta > .cupon:not(.cupon-bancario)::after {
  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;
}

#cupones.cupones-grid-compacta > .cupon-bancario-mini::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
}

/* =========================================================
   PAQUETE 1.1 — Tarjeta tipo ticket con muescas laterales
   Base: proyecto 1.0 original. No altera orden, contenido ni lógica.
   Solo modifica el contorno visual de Tienda/Exclusivos.
   ========================================================= */
#cupones .cupon:not(.cupon-bancario) {
  /* Mantiene dimensiones y distribución existentes. */
  overflow: hidden;
}

/* La textura queda en ::before; ::after se reserva para las dos muescas. */
#cupones .cupon:not(.cupon-bancario)::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 6;
  pointer-events: none;
  opacity: 1;
  background:
    radial-gradient(circle 10px at 0 51%, #fff 0 9.5px, transparent 10px),
    radial-gradient(circle 10px at 100% 51%, #fff 0 9.5px, transparent 10px);
}

/* Línea perforada de referencia del ticket, sin ocupar espacio ni mover contenido. */
#cupones .cupon:not(.cupon-bancario) .cupon-contenido::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 51%;
  z-index: -1;
  border-top: 1px dashed rgba(255,255,255,.66);
  pointer-events: none;
}

@media (max-width: 680px) {
  #cupones .cupon:not(.cupon-bancario)::after {
    background:
      radial-gradient(circle 8px at 0 51%, #fff 0 7.5px, transparent 8px),
      radial-gradient(circle 8px at 100% 51%, #fff 0 7.5px, transparent 8px);
  }
}


/* =========================================================
   PAQUETE 1.2 — Muescas limpias, sin línea exterior
   Elimina únicamente el contorno exterior de Tienda/Exclusivos.
   No cambia dimensiones, posiciones, contenido ni lógica.
   ========================================================= */
#cupones .cupon:not(.cupon-bancario) {
  border: 0 !important;
  outline: 0 !important;
}

/* =========================================================
   PAQUETE 1.4 — Correcciones de tarjeta tipo ticket
   1) Muescas como recorte real: muestran el fondo exacto de la sección.
   2) Se elimina la línea punteada horizontal.
   3) Vigencia/contador con peso normal, sin negritas.
   No se mueve ni reorganiza el contenido de la tarjeta.
   ========================================================= */
#cupones .cupon:not(.cupon-bancario) {
  /* El recorte se aplica sobre la tarjeta completa para que la muesca
     no tenga relleno propio y deje ver el fondo real que está detrás. */
  -webkit-mask-image:
    radial-gradient(circle 10px at 0 51%, transparent 0 9.5px, #000 10px),
    radial-gradient(circle 10px at 100% 51%, transparent 0 9.5px, #000 10px);
  -webkit-mask-composite: source-in;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-image:
    radial-gradient(circle 10px at 0 51%, transparent 0 9.5px, #000 10px),
    radial-gradient(circle 10px at 100% 51%, transparent 0 9.5px, #000 10px);
  mask-composite: intersect;
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
}

/* Anula los círculos blancos de la versión anterior. */
#cupones .cupon:not(.cupon-bancario)::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Elimina únicamente la línea punteada añadida para el estilo ticket. */
#cupones .cupon:not(.cupon-bancario) .cupon-contenido::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
}

/* Vigencia con tipografía normal. */
#cupones .cupon:not(.cupon-bancario) .estado-programacion,
#cupones .cupon:not(.cupon-bancario) .estado-programacion .estado-tiempo,
#cupones .cupon:not(.cupon-bancario) .estado-programacion .estado-linea {
  font-weight: 400 !important;
}

@media (max-width: 680px) {
  #cupones .cupon:not(.cupon-bancario) {
    -webkit-mask-image:
      radial-gradient(circle 8px at 0 51%, transparent 0 7.5px, #000 8px),
      radial-gradient(circle 8px at 100% 51%, transparent 0 7.5px, #000 8px);
    mask-image:
      radial-gradient(circle 8px at 0 51%, transparent 0 7.5px, #000 8px),
      radial-gradient(circle 8px at 100% 51%, transparent 0 7.5px, #000 8px);
  }
}

/* =========================================================
   PAQUETE 1.5 — CUPÓN HORIZONTAL APROBADO
   Réplica funcional de la propuesta #3: una tarjeta por fila.
   ========================================================= */
#cupones.cupones-grid-compacta {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
}

#cupones .cupon-horizontal:not(.cupon-bancario) {
  --card-accent: var(--categoria-cupon-color, #159447);
  display: grid !important;
  grid-template-columns: 27% minmax(0, 1fr) 31%;
  min-height: 128px !important;
  height: auto !important;
  overflow: hidden !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  border: 1px solid color-mix(in srgb, var(--card-accent) 55%, #dbe7df 45%) !important;
  border-radius: 16px !important;
  color: #151515 !important;
  background: #fff !important;
  box-shadow: 0 5px 14px rgba(22, 67, 39, .12) !important;
  isolation: isolate;
}
#cupones .cupon-horizontal:not(.cupon-bancario)::before {
  content: none !important;
}

#cupones .cupon-horizontal .cupon-horizontal-valor {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 13px 12px;
  color: #fff;
  background: linear-gradient(145deg,
    color-mix(in srgb, var(--card-accent) 84%, #ffffff 16%) 0%,
    var(--card-accent) 52%,
    color-mix(in srgb, var(--card-accent) 76%, #062e18 24%) 100%);
}
#cupones .cupon-horizontal .cupon-horizontal-valor::before {
  content: "";
  position: absolute;
  inset: 10px;
  border: 1px dashed rgba(255,255,255,.72);
  border-radius: 12px;
  pointer-events: none;
}
#cupones .cupon-horizontal .cupon-horizontal-valor::after {
  content: "";
  position: absolute;
  top: 0;
  right: -1px;
  width: 10px;
  height: 100%;
  background: radial-gradient(circle at 100% 6px, transparent 0 5px, #fff 5.5px) 0 0/10px 12px repeat-y;
  opacity: .98;
}
#cupones .cupon-horizontal .cupon-logo {
  position: relative;
  z-index: 1;
  max-width: 72px !important;
  height: 26px !important;
  margin: 0 0 4px;
  object-fit: contain;
  border-radius: 7px;
  background: rgba(255,255,255,.95);
}
#cupones .cupon-horizontal .descuento {
  position: relative;
  z-index: 1;
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(31px, 5.5vw, 50px) !important;
  font-weight: 900 !important;
  line-height: .95 !important;
  letter-spacing: -.04em;
  text-align: center;
  text-shadow: none !important;
}

#cupones .cupon-horizontal .cupon-horizontal-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 14px 16px;
  background: #fff;
}
#cupones .cupon-horizontal .franja-categoria-cupon {
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 0 7px !important;
  color: var(--card-accent) !important;
  background: transparent !important;
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.05;
  text-align: left !important;
  text-shadow: none !important;
}
#cupones .cupon-horizontal .condiciones-cupon {
  margin: 0 0 9px !important;
  text-align: left !important;
  gap: 2px !important;
}
#cupones .cupon-horizontal .condicion-cupon,
#cupones .cupon-horizontal .condicion-cupon strong,
#cupones .cupon-horizontal .detalle-beneficio-exclusivo {
  color: #171717 !important;
  text-shadow: none !important;
}
#cupones .cupon-horizontal .condicion-cupon {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
}
#cupones .cupon-horizontal .detalle-beneficio-exclusivo {
  margin: 0 0 5px !important;
  text-align: left !important;
  font-size: 12px;
}
#cupones .cupon-horizontal .cupon-etiquetas {
  justify-content: flex-start !important;
  gap: 6px !important;
  margin: 0 !important;
}
#cupones .cupon-horizontal .etiqueta-cupon,
#cupones .cupon-horizontal .etiqueta-popular-integrada {
  font-size: 10px !important;
  padding: 5px 9px !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

#cupones .cupon-horizontal .cupon-horizontal-acciones {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 12px 14px 10px;
  background: linear-gradient(115deg, #fff 0 72%, color-mix(in srgb, var(--card-accent) 7%, #fff 93%) 100%);
}
#cupones .cupon-horizontal .cupon-horizontal-acciones::after {
  content: "%";
  position: absolute;
  right: 10px;
  bottom: 2px;
  z-index: 0;
  color: color-mix(in srgb, var(--card-accent) 18%, transparent);
  font-size: 54px;
  font-weight: 900;
  transform: rotate(-10deg);
  pointer-events: none;
}
#cupones .cupon-horizontal .acciones-cupon,
#cupones .cupon-horizontal .acciones-secundarias,
#cupones .cupon-horizontal .estado-programacion,
#cupones .cupon-horizontal .mensaje { position: relative; z-index: 1; }
#cupones .cupon-horizontal .acciones-cupon { width: 100%; margin: 0 !important; }
#cupones .cupon-horizontal .boton-canjear {
  width: min(100%, 210px) !important;
  min-height: 39px !important;
  margin: 0 auto !important;
  padding: 8px 10px !important;
  border: 1.5px solid var(--card-accent) !important;
  border-radius: 8px !important;
  color: var(--card-accent) !important;
  background: #fff !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}
#cupones .cupon-horizontal .cupon-copiado-mini {
  color: var(--card-accent) !important;
  background: color-mix(in srgb, var(--card-accent) 9%, #fff 91%) !important;
}
#cupones .cupon-horizontal .acciones-secundarias {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  margin: 7px 0 0 !important;
  color: #222 !important;
  font-size: 11px !important;
}
#cupones .cupon-horizontal .boton-like,
#cupones .cupon-horizontal .boton-compartir {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  padding: 3px !important;
  border: 0 !important;
  color: var(--card-accent) !important;
  background: transparent !important;
  box-shadow: none !important;
}
#cupones .cupon-horizontal .boton-like.activo { color: var(--card-accent) !important; background: transparent !important; }
#cupones .cupon-horizontal .boton-like svg,
#cupones .cupon-horizontal .boton-compartir svg,
#cupones .cupon-horizontal .estadistica-item svg { width: 15px !important; height: 15px !important; }
#cupones .cupon-horizontal .separador-estadistica { width: 1px; height: 17px; background: #c9c9c9; }
#cupones .cupon-horizontal .estadistica-item { color: #222 !important; text-shadow: none !important; }
#cupones .cupon-horizontal .estado-programacion {
  width: 100%;
  margin: 6px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #1c1c1c !important;
  background: transparent !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  text-shadow: none !important;
  text-align: center;
}
#cupones .cupon-horizontal .estado-programacion .estado-linea {
  justify-content: center !important;
  gap: 4px !important;
  color: #1c1c1c !important;
  font-weight: 400 !important;
}
#cupones .cupon-horizontal .estado-programacion .estado-tiempo { color: #1c1c1c !important; font-weight: 400 !important; }

/* Móvil: conserva la composición horizontal de la referencia, una tarjeta por fila. */
@media (max-width: 680px) {
  #cupones.cupones-grid-compacta { gap: 8px !important; }
  #cupones .cupon-horizontal:not(.cupon-bancario) {
    grid-template-columns: 28% minmax(0, 1fr) 34%;
    min-height: 112px !important;
    border-radius: 13px !important;
  }
  #cupones .cupon-horizontal .cupon-horizontal-valor { padding: 10px 7px; }
  #cupones .cupon-horizontal .cupon-horizontal-valor::before { inset: 7px; border-radius: 9px; }
  #cupones .cupon-horizontal .cupon-logo { max-width: 52px !important; height: 21px !important; }
  #cupones .cupon-horizontal .descuento { font-size: clamp(25px, 9vw, 37px) !important; }
  #cupones .cupon-horizontal .cupon-horizontal-info { padding: 10px 8px 10px 10px; }
  #cupones .cupon-horizontal .franja-categoria-cupon { margin-bottom: 5px !important; font-size: 11px !important; }
  #cupones .cupon-horizontal .condicion-cupon { font-size: 10px !important; }
  #cupones .cupon-horizontal .detalle-beneficio-exclusivo { font-size: 8.5px !important; }
  #cupones .cupon-horizontal .cupon-etiquetas { gap: 3px !important; flex-wrap: wrap; }
  #cupones .cupon-horizontal .etiqueta-cupon,
  #cupones .cupon-horizontal .etiqueta-popular-integrada { font-size: 7.2px !important; padding: 3px 5px !important; }
  #cupones .cupon-horizontal .cupon-horizontal-acciones { padding: 9px 7px 8px; }
  #cupones .cupon-horizontal .boton-canjear { min-height: 32px !important; padding: 6px 4px !important; font-size: 9.5px !important; }
  #cupones .cupon-horizontal .acciones-secundarias { gap: 3px !important; margin-top: 5px !important; font-size: 8px !important; }
  #cupones .cupon-horizontal .boton-like,
  #cupones .cupon-horizontal .boton-compartir { width: 19px !important; height: 19px !important; min-width: 19px !important; }
  #cupones .cupon-horizontal .boton-like svg,
  #cupones .cupon-horizontal .boton-compartir svg,
  #cupones .cupon-horizontal .estadistica-item svg { width: 12px !important; height: 12px !important; }
  #cupones .cupon-horizontal .estado-programacion { margin-top: 4px !important; font-size: 8.2px !important; }
  #cupones .cupon-horizontal .cupon-horizontal-acciones::after { right: 3px; font-size: 36px; }
}

/* Bancarios también ocupan una fila completa, conservando su diseño especializado. */
#cupones.cupones-grid-compacta > .cupon-bancario-mini,
#cupones.cupones-grid-compacta > .cupon-bancario-grid { grid-column: 1 / -1 !important; }

/* =========================================================
   PAQUETE 1.6 — CUPÓN HORIZONTAL CORREGIDO
   Diseño aislado de las reglas históricas de las tarjetas verticales.
   Una tarjeta por fila, basado en la propuesta horizontal #3 aprobada.
   ========================================================= */
#cupones.cupones-grid-compacta {
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
}

#cupones > .cupon-horizontal-v16:not(.cupon-bancario) {
  --hc16-accent: var(--categoria-cupon-color, #159447);
  box-sizing: border-box !important;
  position: relative !important;
  display: grid !important;
  grid-template-columns: 27% minmax(0, 1fr) 31% !important;
  width: 100% !important;
  height: auto !important;
  min-height: 126px !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--hc16-accent) 48%, #dce7df 52%) !important;
  border-radius: 16px !important;
  outline: 0 !important;
  background: #fff !important;
  color: #151515 !important;
  box-shadow: 0 5px 14px rgba(23, 63, 39, .11) !important;
  isolation: isolate !important;
}
#cupones > .cupon-horizontal-v16:not(.cupon-bancario)::before { content: none !important; }
#cupones > .cupon-horizontal-v16:not(.cupon-bancario)::after {
  content: "" !important;
  position: absolute !important;
  z-index: 0 !important;
  inset: auto 8px 7px auto !important;
  width: 58px !important;
  height: 58px !important;
  opacity: .10 !important;
  pointer-events: none !important;
  background: var(--hc16-accent) !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M20 18h24l6 34H14l6-34Zm7 0c0-5 2-9 5-9s5 4 5 9h4c0-8-4-13-9-13s-9 5-9 13h4Zm5 10c5 0 9 4 9 9s-4 9-9 9-9-4-9-9 4-9 9-9Zm0 4a5 5 0 1 0 0 10 5 5 0 0 0 0-10Z'/%3E%3C/svg%3E") center/contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='black' d='M20 18h24l6 34H14l6-34Zm7 0c0-5 2-9 5-9s5 4 5 9h4c0-8-4-13-9-13s-9 5-9 13h4Zm5 10c5 0 9 4 9 9s-4 9-9 9-9-4-9-9 4-9 9-9Zm0 4a5 5 0 1 0 0 10 5 5 0 0 0 0-10Z'/%3E%3C/svg%3E") center/contain no-repeat !important;
}

/* Bloque izquierdo — descuento */
#cupones .cupon-horizontal-v16 .hc16-valor {
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 100% !important;
  padding: 12px 11px !important;
  overflow: visible !important;
  color: #fff !important;
  background: linear-gradient(145deg,
    color-mix(in srgb, var(--hc16-accent) 88%, #fff 12%) 0%,
    var(--hc16-accent) 58%,
    color-mix(in srgb, var(--hc16-accent) 79%, #052f18 21%) 100%) !important;
}
#cupones .cupon-horizontal-v16 .hc16-valor::after {
  content: "" !important;
  position: absolute !important;
  z-index: 3 !important;
  top: 0 !important;
  right: -1px !important;
  width: 9px !important;
  height: 100% !important;
  background: radial-gradient(circle at 100% 6px, transparent 0 5px, #fff 5.4px) 0 0/9px 12px repeat-y !important;
  pointer-events: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-valor-borde {
  position: absolute !important;
  inset: 9px !important;
  z-index: 0 !important;
  border: 1px dashed rgba(255,255,255,.75) !important;
  border-radius: 11px !important;
  pointer-events: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-logo {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: auto !important;
  max-width: 74px !important;
  height: 27px !important;
  max-height: 27px !important;
  margin: 0 0 4px !important;
  padding: 1px 4px !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: rgba(255,255,255,.97) !important;
  box-shadow: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-descuento {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  background: transparent !important;
  font-size: clamp(31px, 5.2vw, 48px) !important;
  font-weight: 900 !important;
  line-height: .94 !important;
  letter-spacing: -.04em !important;
  text-align: center !important;
  text-shadow: none !important;
  white-space: normal !important;
}

/* Centro — categoría, condición y etiquetas */
#cupones .cupon-horizontal-v16 .hc16-info {
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 13px 14px !important;
  overflow: hidden !important;
  background: #fff !important;
  color: #171717 !important;
}
#cupones .cupon-horizontal-v16 .hc16-categoria {
  display: block !important;
  width: 100% !important;
  margin: 0 0 7px !important;
  padding: 0 !important;
  color: var(--hc16-accent) !important;
  background: transparent !important;
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  text-align: left !important;
  white-space: normal !important;
}
#cupones .cupon-horizontal-v16 .hc16-detalle {
  display: block !important;
  width: 100% !important;
  margin: 0 0 5px !important;
  padding: 0 !important;
  color: #242424 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
  text-align: left !important;
}
#cupones .cupon-horizontal-v16 .hc16-condiciones {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100% !important;
  gap: 2px !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
}
#cupones .cupon-horizontal-v16 .hc16-condicion {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #171717 !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.18 !important;
  text-align: left !important;
  white-space: normal !important;
}
#cupones .cupon-horizontal-v16 .hc16-condicion strong {
  color: #171717 !important;
  font: inherit !important;
  font-weight: 800 !important;
}
#cupones .cupon-horizontal-v16 .hc16-etiquetas {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  max-height: none !important;
  gap: 5px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
#cupones .cupon-horizontal-v16 .hc16-etiquetas:empty { display: none !important; }
#cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-cupon,
#cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-popular-integrada {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 5px 8px !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}

/* Derecha — copiar, interacción y vigencia */
#cupones .cupon-horizontal-v16 .hc16-acciones {
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 11px 12px 10px !important;
  overflow: visible !important;
  background: linear-gradient(115deg, #fff 0 74%, color-mix(in srgb, var(--hc16-accent) 6%, #fff 94%) 100%) !important;
  color: #1b1b1b !important;
}
#cupones .cupon-horizontal-v16 .hc16-cta {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 190px !important;
  min-width: 0 !important;
  min-height: 38px !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 8px 8px !important;
  border: 1.5px solid var(--hc16-accent) !important;
  border-radius: 8px !important;
  color: var(--hc16-accent) !important;
  background: #fff !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  transform: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar svg {
  width: 17px !important;
  height: 17px !important;
  flex: 0 0 17px !important;
  margin-right: 5px !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar:hover,
#cupones .cupon-horizontal-v16 .hc16-copiar:focus-visible {
  color: #fff !important;
  background: var(--hc16-accent) !important;
  filter: none !important;
  transform: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-cta > .cupon-copiado-mini {
  position: absolute !important;
  z-index: 9 !important;
  top: -9px !important;
  right: 1px !important;
  min-height: 14px !important;
  margin: 0 !important;
  padding: 1px 5px !important;
  border: 1px solid color-mix(in srgb, var(--hc16-accent) 48%, #fff 52%) !important;
  border-radius: 999px !important;
  color: var(--hc16-accent) !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.08) !important;
  font-size: 7px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
#cupones .cupon-horizontal-v16 .hc16-social {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 22px !important;
  gap: 5px !important;
  margin: 7px 0 0 !important;
  padding: 0 !important;
  color: #202020 !important;
  font-size: 10px !important;
  line-height: 1 !important;
}
#cupones .cupon-horizontal-v16 .hc16-icono {
  display: inline-flex !important;
  flex: 0 0 21px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 21px !important;
  height: 21px !important;
  min-width: 21px !important;
  min-height: 21px !important;
  margin: 0 !important;
  padding: 2px !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--hc16-accent) !important;
  background: transparent !important;
  box-shadow: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-icono.activo { color: var(--hc16-accent) !important; background: transparent !important; }
#cupones .cupon-horizontal-v16 .hc16-icono svg,
#cupones .cupon-horizontal-v16 .hc16-usos svg {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
}
#cupones .cupon-horizontal-v16 .hc16-numero,
#cupones .cupon-horizontal-v16 .hc16-usos,
#cupones .cupon-horizontal-v16 .hc16-usos .numero-clics {
  display: inline-flex !important;
  align-items: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #202020 !important;
  background: transparent !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-shadow: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-separador {
  display: block !important;
  flex: 0 0 1px !important;
  width: 1px !important;
  height: 16px !important;
  margin: 0 2px !important;
  background: #d0d0d0 !important;
}
#cupones .cupon-horizontal-v16 .hc16-mensaje:empty { display: none !important; }
#cupones .cupon-horizontal-v16 .hc16-tiempo {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 6px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #222 !important;
  background: transparent !important;
  font-size: 10px !important;
  font-weight: 400 !important;
  line-height: 1.12 !important;
  text-align: center !important;
  text-shadow: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-tiempo[hidden],
#cupones .cupon-horizontal-v16 .hc16-tiempo.vacio { display: none !important; }
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-linea,
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-tiempo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #222 !important;
  font: inherit !important;
  font-weight: 400 !important;
  line-height: inherit !important;
  text-align: center !important;
  text-shadow: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-progreso,
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-progreso-barra { display: none !important; }

/* Agotado/programado conserva su funcionalidad sin romper el diseño. */
#cupones > .cupon-horizontal-v16.cupon-agotado:not(.cupon-bancario) { opacity: .68 !important; filter: saturate(.45) !important; }
#cupones .cupon-horizontal-v16 .hc16-copiar:disabled,
#cupones .cupon-horizontal-v16 .hc16-copiar.boton-programado,
#cupones .cupon-horizontal-v16 .hc16-copiar.boton-agotado {
  border-color: #c8c8c8 !important;
  color: #747474 !important;
  background: #f3f3f3 !important;
  box-shadow: none !important;
}

/* Móvil: mantiene las tres zonas visibles incluso en 360 px. */
@media (max-width: 680px) {
  #cupones.cupones-grid-compacta { gap: 8px !important; }
  #cupones > .cupon-horizontal-v16:not(.cupon-bancario) {
    grid-template-columns: 29% minmax(0, 1fr) 34% !important;
    min-height: 108px !important;
    border-radius: 13px !important;
  }
  #cupones > .cupon-horizontal-v16:not(.cupon-bancario)::after {
    width: 44px !important;
    height: 44px !important;
    right: 3px !important;
    bottom: 3px !important;
    opacity: .085 !important;
  }
  #cupones .cupon-horizontal-v16 .hc16-valor { padding: 9px 7px !important; }
  #cupones .cupon-horizontal-v16 .hc16-valor-borde { inset: 7px !important; border-radius: 9px !important; }
  #cupones .cupon-horizontal-v16 .hc16-logo { max-width: 53px !important; height: 20px !important; max-height: 20px !important; margin-bottom: 3px !important; }
  #cupones .cupon-horizontal-v16 .hc16-descuento { font-size: clamp(24px, 8.5vw, 35px) !important; }

  #cupones .cupon-horizontal-v16 .hc16-info { padding: 9px 7px 9px 9px !important; }
  #cupones .cupon-horizontal-v16 .hc16-categoria { margin-bottom: 5px !important; font-size: 10px !important; line-height: 1.02 !important; }
  #cupones .cupon-horizontal-v16 .hc16-detalle { margin-bottom: 4px !important; font-size: 8px !important; }
  #cupones .cupon-horizontal-v16 .hc16-condiciones { gap: 1px !important; margin-bottom: 5px !important; }
  #cupones .cupon-horizontal-v16 .hc16-condicion { font-size: 9px !important; line-height: 1.13 !important; }
  #cupones .cupon-horizontal-v16 .hc16-etiquetas { gap: 3px !important; }
  #cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-cupon,
  #cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-popular-integrada { padding: 3px 5px !important; font-size: 6.8px !important; }

  #cupones .cupon-horizontal-v16 .hc16-acciones { padding: 8px 6px 7px !important; }
  #cupones .cupon-horizontal-v16 .hc16-copiar { min-height: 31px !important; padding: 5px 3px !important; border-radius: 7px !important; font-size: 8.6px !important; }
  #cupones .cupon-horizontal-v16 .hc16-copiar svg { width: 13px !important; height: 13px !important; flex-basis: 13px !important; margin-right: 3px !important; }
  #cupones .cupon-horizontal-v16 .hc16-social { min-height: 18px !important; gap: 3px !important; margin-top: 4px !important; font-size: 7.5px !important; }
  #cupones .cupon-horizontal-v16 .hc16-icono { flex-basis: 16px !important; width: 16px !important; height: 16px !important; min-width: 16px !important; min-height: 16px !important; padding: 1px !important; }
  #cupones .cupon-horizontal-v16 .hc16-icono svg,
  #cupones .cupon-horizontal-v16 .hc16-usos svg { width: 11px !important; height: 11px !important; flex-basis: 11px !important; }
  #cupones .cupon-horizontal-v16 .hc16-numero,
  #cupones .cupon-horizontal-v16 .hc16-usos,
  #cupones .cupon-horizontal-v16 .hc16-usos .numero-clics { font-size: 7.5px !important; }
  #cupones .cupon-horizontal-v16 .hc16-separador { height: 13px !important; margin-inline: 1px !important; }
  #cupones .cupon-horizontal-v16 .hc16-tiempo { margin-top: 4px !important; font-size: 7.7px !important; }
  #cupones .cupon-horizontal-v16 .hc16-cta > .cupon-copiado-mini { top: -6px !important; right: 0 !important; font-size: 6.2px !important; }
}

@media (max-width: 390px) {
  #cupones > .cupon-horizontal-v16:not(.cupon-bancario) {
    grid-template-columns: 29% minmax(0, 1fr) 34% !important;
    min-height: 106px !important;
  }
  #cupones .cupon-horizontal-v16 .hc16-info { padding-left: 7px !important; padding-right: 5px !important; }
  #cupones .cupon-horizontal-v16 .hc16-condicion { font-size: 8.6px !important; }
  #cupones .cupon-horizontal-v16 .hc16-categoria { font-size: 9.4px !important; }
  #cupones .cupon-horizontal-v16 .hc16-copiar { font-size: 8px !important; }
}

/* =========================================================
   PAQUETE 1.7 — ACTIVIDAD Y VIGENCIA COMO REFERENCIA
   - Me gusta + contador | vistas + contador.
   - Sin botón compartir dentro de la tarjeta horizontal.
   - Temporizador siempre oscuro y legible sobre fondo blanco.
   ========================================================= */
#cupones .cupon-horizontal-v16 .hc16-social {
  gap: 5px !important;
  color: #1f1f1f !important;
}
#cupones .cupon-horizontal-v16 .hc16-social .boton-like,
#cupones .cupon-horizontal-v16 .hc16-social .hc16-vistas {
  color: var(--hc16-accent) !important;
}
#cupones .cupon-horizontal-v16 .hc16-social .hc16-numero,
#cupones .cupon-horizontal-v16 .hc16-social .hc16-vistas .numero-clics {
  color: #202020 !important;
}
#cupones .cupon-horizontal-v16 .hc16-social .hc16-vistas {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
}
#cupones .cupon-horizontal-v16 .hc16-social .hc16-vistas svg { fill: currentColor !important; }
#cupones .cupon-horizontal-v16 .hc16-tiempo,
#cupones .cupon-horizontal-v16 .hc16-tiempo *,
#cupones .cupon-horizontal-v16 .estado-programacion,
#cupones .cupon-horizontal-v16 .estado-programacion * {
  color: #202020 !important;
  -webkit-text-fill-color: #202020 !important;
  text-shadow: none !important;
  font-weight: 400 !important;
}
@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-social {
    gap: 4px !important;
    font-size: 8px !important;
  }
  #cupones .cupon-horizontal-v16 .hc16-social .hc16-vistas { gap: 2px !important; }
  #cupones .cupon-horizontal-v16 .hc16-tiempo,
  #cupones .cupon-horizontal-v16 .hc16-tiempo * { font-size: 8.2px !important; }
}

/* =========================================================
   Paquete 1.8 — Me gusta minimalista
   - Solo se muestra la manita como control visual.
   - Sin borde, fondo, sombra ni contenedor cuadrado/circular.
   - Conserva el contador de likes y toda la funcionalidad existente.
   ========================================================= */
#cupones .cupon-horizontal-v16 .hc16-social .boton-like.hc16-icono {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  color: var(--hc16-accent) !important;
  line-height: 1 !important;
}
#cupones .cupon-horizontal-v16 .hc16-social .boton-like.hc16-icono:hover,
#cupones .cupon-horizontal-v16 .hc16-social .boton-like.hc16-icono:focus,
#cupones .cupon-horizontal-v16 .hc16-social .boton-like.hc16-icono:active,
#cupones .cupon-horizontal-v16 .hc16-social .boton-like.hc16-icono.activo {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-social .boton-like.hc16-icono svg {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
}
@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-social .boton-like.hc16-icono svg {
    width: 12px !important;
    height: 12px !important;
  }
}

/* ================================================================
   PAQUETE 1.9 — BOLETO VERDE (referencia aprobada)
   Reproduce la composición: oferta + información + talón de acción.
   ================================================================ */
#cupones > .cupon-horizontal-v16:not(.cupon-bancario) {
  --hc19-green: #08a84f;
  --hc19-green-dark: #078b43;
  grid-template-columns: 26% minmax(0, 1fr) 35% !important;
  min-height: 132px !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: var(--hc19-green) !important;
  box-shadow: 0 5px 14px rgba(0, 94, 44, .18) !important;
  color: #fff !important;
  overflow: hidden !important;
}
#cupones > .cupon-horizontal-v16:not(.cupon-bancario)::after { content: none !important; }

#cupones .cupon-horizontal-v16 .hc16-valor {
  align-items: flex-start !important;
  justify-content: center !important;
  padding: 14px 8px 12px 16px !important;
  background: var(--hc19-green) !important;
  color: #fff !important;
  overflow: hidden !important;
}
#cupones .cupon-horizontal-v16 .hc16-valor::after,
#cupones .cupon-horizontal-v16 .hc16-valor-borde { display: none !important; }
#cupones .cupon-horizontal-v16 .hc16-logo {
  align-self: flex-start !important;
  width: auto !important;
  max-width: 78px !important;
  height: 29px !important;
  max-height: 29px !important;
  margin: 0 0 5px !important;
  padding: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  object-fit: contain !important;
}
#cupones .cupon-horizontal-v16 .hc16-descuento {
  display: flex !important;
  align-items: flex-end !important;
  flex-wrap: wrap !important;
  gap: 3px !important;
  width: 100% !important;
  color: #fff !important;
  font-size: clamp(34px, 6vw, 54px) !important;
  font-weight: 900 !important;
  line-height: .9 !important;
  text-align: left !important;
  letter-spacing: -.04em !important;
}
#cupones .cupon-horizontal-v16 .hc19-off {
  display: inline-block !important;
  margin: 0 0 1px !important;
  font-size: .42em !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}
#cupones .cupon-horizontal-v16 .hc19-porcentaje {
  position: absolute !important;
  left: 10px !important;
  bottom: -12px !important;
  color: rgba(255,255,255,.10) !important;
  font-size: 68px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  pointer-events: none !important;
}

#cupones .cupon-horizontal-v16 .hc16-info {
  justify-content: center !important;
  padding: 13px 13px 12px !important;
  background: var(--hc19-green) !important;
  color: #fff !important;
  overflow: visible !important;
}
#cupones .cupon-horizontal-v16 .hc16-categoria {
  display: inline-flex !important;
  width: auto !important;
  min-width: 0 !important;
  margin: 0 0 8px !important;
  padding: 5px 26px 5px 10px !important;
  color: var(--hc19-green-dark) !important;
  background: #fff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  clip-path: polygon(0 0,100% 0,88% 100%,0 100%) !important;
  white-space: nowrap !important;
}
#cupones .cupon-horizontal-v16 .hc16-condiciones { margin: 0 0 5px !important; }
#cupones .cupon-horizontal-v16 .hc16-condicion,
#cupones .cupon-horizontal-v16 .hc16-condicion strong,
#cupones .cupon-horizontal-v16 .hc16-detalle,
#cupones .cupon-horizontal-v16 .hc16-ahorro-extra {
  color: #fff !important;
  text-shadow: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-condicion {
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1.15 !important;
}
#cupones .cupon-horizontal-v16 .hc16-condicion strong { font-weight: 900 !important; }
#cupones .cupon-horizontal-v16 .hc16-detalle,
#cupones .cupon-horizontal-v16 .hc16-ahorro-extra {
  width: 100% !important;
  margin: 0 0 8px !important;
  font-size: 10.5px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
}
#cupones .cupon-horizontal-v16 .hc16-etiquetas { gap: 6px !important; }
#cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-cupon,
#cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-popular-integrada {
  padding: 5px 8px !important;
  font-size: 8.5px !important;
  box-shadow: 0 2px 5px rgba(0,0,0,.12) !important;
}

#cupones .cupon-horizontal-v16 .hc16-acciones {
  position: relative !important;
  justify-content: center !important;
  padding: 12px 14px 10px !important;
  background: var(--hc19-green-dark) !important;
  color: #fff !important;
  overflow: visible !important;
}
#cupones .cupon-horizontal-v16 .hc16-acciones::before,
#cupones .cupon-horizontal-v16 .hc16-acciones::after {
  content: "" !important;
  position: absolute !important;
  z-index: 5 !important;
  left: -10px !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  background: #fff !important;
}
#cupones .cupon-horizontal-v16 .hc16-acciones::before { top: -10px !important; }
#cupones .cupon-horizontal-v16 .hc16-acciones::after { bottom: -10px !important; }
#cupones .cupon-horizontal-v16 .hc16-cta::before {
  content: "" !important;
  position: absolute !important;
  left: -15px !important;
  top: -34px !important;
  bottom: -74px !important;
  width: 2px !important;
  background: repeating-linear-gradient(to bottom, rgba(255,255,255,.95) 0 4px, transparent 4px 9px) !important;
  pointer-events: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar {
  max-width: none !important;
  min-height: 37px !important;
  padding: 7px 7px !important;
  border: 1.5px solid rgba(255,255,255,.9) !important;
  border-radius: 5px !important;
  color: #fff !important;
  background: transparent !important;
  font-size: 11.5px !important;
  font-weight: 850 !important;
  text-transform: uppercase !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar:hover,
#cupones .cupon-horizontal-v16 .hc16-copiar:focus-visible {
  color: var(--hc19-green-dark) !important;
  background: #fff !important;
}
#cupones .cupon-horizontal-v16 .hc16-cta > .cupon-copiado-mini {
  color: #fff !important;
  border-color: rgba(255,255,255,.6) !important;
  background: var(--hc19-green-dark) !important;
}
#cupones .cupon-horizontal-v16 .hc16-social {
  min-height: 24px !important;
  margin: 7px 0 0 !important;
  color: #fff !important;
}
#cupones .cupon-horizontal-v16 .hc16-icono,
#cupones .cupon-horizontal-v16 .hc16-icono.activo,
#cupones .cupon-horizontal-v16 .hc16-numero,
#cupones .cupon-horizontal-v16 .hc16-usos,
#cupones .cupon-horizontal-v16 .hc16-usos .numero-clics {
  color: #fff !important;
}
#cupones .cupon-horizontal-v16 .hc16-separador { background: rgba(255,255,255,.45) !important; }
#cupones .cupon-horizontal-v16 .hc16-tiempo {
  width: 100% !important;
  margin: 7px 0 0 !important;
  padding: 8px 0 0 !important;
  border-top: 1px dashed rgba(255,255,255,.58) !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 650 !important;
}
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-linea,
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-tiempo {
  color: #fff !important;
  font-weight: 650 !important;
}
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-tiempo::before {
  content: "◷" !important;
  margin-right: 4px !important;
  color: #fff !important;
  font-size: 13px !important;
}

@media (max-width: 680px) {
  #cupones > .cupon-horizontal-v16:not(.cupon-bancario) {
    grid-template-columns: 25% minmax(0,1fr) 35% !important;
    min-height: 112px !important;
    border-radius: 13px !important;
  }
  #cupones .cupon-horizontal-v16 .hc16-valor { padding: 9px 5px 8px 9px !important; }
  #cupones .cupon-horizontal-v16 .hc16-logo { max-width: 58px !important; height: 22px !important; max-height: 22px !important; margin-bottom: 3px !important; }
  #cupones .cupon-horizontal-v16 .hc16-descuento { font-size: clamp(27px, 8vw, 38px) !important; }
  #cupones .cupon-horizontal-v16 .hc19-porcentaje { left: 5px !important; bottom: -9px !important; font-size: 48px !important; }
  #cupones .cupon-horizontal-v16 .hc16-info { padding: 9px 7px 8px !important; }
  #cupones .cupon-horizontal-v16 .hc16-categoria { margin-bottom: 6px !important; padding: 4px 17px 4px 7px !important; font-size: 9.5px !important; }
  #cupones .cupon-horizontal-v16 .hc16-condicion { font-size: 9.2px !important; }
  #cupones .cupon-horizontal-v16 .hc16-detalle,
  #cupones .cupon-horizontal-v16 .hc16-ahorro-extra { margin-bottom: 5px !important; font-size: 7.3px !important; }
  #cupones .cupon-horizontal-v16 .hc16-etiquetas { gap: 3px !important; }
  #cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-cupon,
  #cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-popular-integrada { padding: 4px 5px !important; font-size: 6.7px !important; }
  #cupones .cupon-horizontal-v16 .hc16-acciones { padding: 9px 7px 7px !important; }
  #cupones .cupon-horizontal-v16 .hc16-cta::before { left: -8px !important; top: -28px !important; bottom: -65px !important; }
  #cupones .cupon-horizontal-v16 .hc16-copiar { min-height: 31px !important; padding: 5px 3px !important; font-size: 8px !important; }
  #cupones .cupon-horizontal-v16 .hc16-copiar svg { width: 13px !important; height: 13px !important; flex-basis: 13px !important; margin-right: 3px !important; }
  #cupones .cupon-horizontal-v16 .hc16-social { margin-top: 4px !important; gap: 3px !important; }
  #cupones .cupon-horizontal-v16 .hc16-icono { width: 18px !important; height: 18px !important; min-width: 18px !important; min-height: 18px !important; }
  #cupones .cupon-horizontal-v16 .hc16-icono svg,
  #cupones .cupon-horizontal-v16 .hc16-usos svg { width: 11px !important; height: 11px !important; flex-basis: 11px !important; }
  #cupones .cupon-horizontal-v16 .hc16-numero,
  #cupones .cupon-horizontal-v16 .hc16-usos,
  #cupones .cupon-horizontal-v16 .hc16-usos .numero-clics { font-size: 8px !important; }
  #cupones .cupon-horizontal-v16 .hc16-tiempo { margin-top: 4px !important; padding-top: 5px !important; font-size: 7.6px !important; }
  #cupones .cupon-horizontal-v16 .hc16-tiempo .estado-tiempo::before { margin-right: 2px !important; font-size: 10px !important; }
}


/* ================================================================
   PAQUETE 2.0 — BOLETOS MULTICOLOR + BANCARIOS
   ================================================================ */
#cupones > .cupon-horizontal-v16:not(.cupon-bancario){
  --hc19-green: var(--categoria-cupon-color,#08a84f);
  --hc19-green-dark: color-mix(in srgb,var(--categoria-cupon-color,#08a84f) 78%,#000 22%);
}
#cupones .cupon-horizontal-v16 .hc16-copiar{ text-transform:none !important; }
#cupones .cupon-horizontal-v16 .hc16-social .hc16-icono,
#cupones .cupon-horizontal-v16 .hc16-social .hc16-numero,
#cupones .cupon-horizontal-v16 .hc16-social .hc16-usos,
#cupones .cupon-horizontal-v16 .hc16-social .hc16-usos .numero-clics{ color:#fff !important; }
#cupones .cupon-horizontal-v16 .hc16-social .boton-like.activo{ color:#ffe600 !important; }
#cupones .cupon-horizontal-v16 .hc20-compartir{ appearance:none!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important; }

/* Escritorio: dos boletos por fila. Móvil/tablet angosta: uno. */
@media (min-width: 900px){
  #cupones.cupones-grid-compacta{ grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px !important; }
  #cupones.cupones-grid-compacta > .cupon-bancario-mini, #cupones.cupones-grid-compacta > .cupon-bancario-grid{ grid-column:auto !important; }
  #cupones > .cupon-horizontal-v16:not(.cupon-bancario){ grid-template-columns:25% minmax(0,1fr) 35% !important; min-height:120px!important; }
}

/* Bancarios con la misma silueta de boleto: zona principal blanca + talón del color del banco. */
#cupones > .cupon-bancario-ticket{
  position:relative!important; display:grid!important; grid-template-columns:minmax(0,65%) 35%!important;
  min-height:132px!important; padding:0!important; margin:0!important; overflow:hidden!important;
  border:1px solid #e5e7eb!important; border-radius:16px!important; background:#fff!important;
  box-shadow:0 5px 14px rgba(15,23,42,.12)!important; color:#172033!important;
}
#cupones .bt20-main{display:grid!important;grid-template-columns:minmax(90px,34%) 1fr!important;align-items:center!important;gap:12px!important;padding:14px!important;background:#fff!important;min-width:0!important;}
#cupones .bt20-logo-wrap{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;min-width:0!important;min-height:72px!important;padding:8px!important;background:#fff!important;border-radius:14px!important;box-shadow:0 2px 10px rgba(15,23,42,.10)!important;overflow:hidden!important;}
#cupones .bt20-logo{display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:62px!important;object-fit:contain!important;border-radius:0!important;background:transparent!important;mix-blend-mode:multiply;}
#cupones .bt20-beneficio{min-width:0!important;}
#cupones .bt20-tipo{display:inline-block!important;margin-bottom:5px!important;color:var(--banco-color)!important;font-size:10px!important;font-weight:900!important;}
#cupones .bt20-beneficio h3{margin:0 0 6px!important;color:var(--banco-color)!important;font-size:clamp(22px,3vw,38px)!important;line-height:.95!important;font-weight:900!important;}
#cupones .bt20-beneficio p{margin:2px 0!important;color:#263142!important;font-size:9.5px!important;line-height:1.2!important;}
#cupones .bt20-detalle{opacity:.78!important;} #cupones .bt20-etiquetas{display:flex!important;gap:4px!important;flex-wrap:wrap!important;margin-top:6px!important;}
#cupones .bt20-actions{position:relative!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;padding:12px 10px!important;background:var(--banco-color)!important;color:var(--banco-texto)!important;overflow:visible!important;}
#cupones .bt20-actions:before,#cupones .bt20-actions:after{content:""!important;position:absolute!important;left:-10px!important;width:20px!important;height:20px!important;border-radius:50%!important;background:#fff!important;z-index:3!important;}
#cupones .bt20-actions:before{top:-10px!important}.bt20-actions:after{bottom:-10px!important}
#cupones .bt20-actions{border-left:2px dotted rgba(255,255,255,.85)!important;}
#cupones .bt20-copiar{width:100%!important;min-height:36px!important;border:1.5px solid currentColor!important;border-radius:6px!important;background:transparent!important;color:var(--banco-texto)!important;font-size:11px!important;font-weight:850!important;text-transform:none!important;}
#cupones .bt20-social{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;width:100%!important;margin-top:8px!important;color:var(--banco-texto)!important;font-size:9px!important;}
#cupones .bt20-icon{appearance:none!important;border:0!important;background:transparent!important;box-shadow:none!important;color:inherit!important;padding:0!important;width:auto!important;height:auto!important;min-width:0!important;}
#cupones .bt20-icon.activo{color:#ffe600!important;}
#cupones .bt20-icon svg,#cupones .bt20-vistas svg{width:14px!important;height:14px!important;fill:currentColor!important;}
#cupones .bt20-vistas{display:inline-flex!important;align-items:center!important;gap:3px!important;color:inherit!important}.bt20-sep{width:1px!important;height:15px!important;background:currentColor!important;opacity:.45!important;}
#cupones .bt20-tiempo{width:100%!important;margin-top:8px!important;padding-top:7px!important;border-top:1px dashed currentColor!important;color:var(--banco-texto)!important;text-align:center!important;font-size:9px!important;font-weight:600!important;}
#cupones .bt20-tiempo *{color:inherit!important;-webkit-text-fill-color:currentColor!important;}
@media(max-width:680px){
 #cupones > .cupon-bancario-ticket{grid-template-columns:65% 35%!important;min-height:112px!important;border-radius:13px!important;}
 #cupones .bt20-main{grid-template-columns:34% 1fr!important;gap:7px!important;padding:8px!important}.bt20-logo-wrap{min-height:58px!important;padding:5px!important}.bt20-logo{max-height:50px!important}
 #cupones .bt20-beneficio h3{font-size:22px!important}.bt20-beneficio p{font-size:7.5px!important}.bt20-tipo{font-size:7.5px!important}.bt20-actions{padding:8px 6px!important}.bt20-copiar{min-height:31px!important;font-size:8px!important}.bt20-social{gap:3px!important;font-size:7.5px!important}.bt20-icon svg,.bt20-vistas svg{width:11px!important;height:11px!important}.bt20-tiempo{font-size:7.5px!important;margin-top:5px!important;padding-top:5px!important}
}

/* ================================================================
   PAQUETE 2.1 — ALTURAS UNIFORMES + PALETA 16 COLORES
   Sin cambios de estructura ni distribución.
   ================================================================ */
/* Todas las tarjetas conservan exactamente la misma altura visual. */
#cupones > .cupon-horizontal-v16:not(.cupon-bancario),
#cupones > .cupon-bancario-ticket {
  height: 132px !important;
  min-height: 132px !important;
  max-height: 132px !important;
  box-sizing: border-box !important;
}

/* Compartir queda como icono limpio, igual que Me gusta y Vistas. */
#cupones .cupon-horizontal-v16 .hc20-compartir,
#cupones .cupon-horizontal-v16 .hc16-social .boton-compartir,
#cupones .cupon-bancario-ticket .banco-compartir {
  appearance: none !important;
  -webkit-appearance: none !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  padding: 0 !important;
}
#cupones .cupon-horizontal-v16 .hc20-compartir:hover,
#cupones .cupon-horizontal-v16 .hc20-compartir:active,
#cupones .cupon-horizontal-v16 .hc20-compartir:focus,
#cupones .cupon-bancario-ticket .banco-compartir:hover,
#cupones .cupon-bancario-ticket .banco-compartir:active,
#cupones .cupon-bancario-ticket .banco-compartir:focus {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Ya copiado deja de formar parte de la interfaz, incluso ante caché viejo. */
#cupones .cupon-copiado-mini { display: none !important; }

@media (max-width: 680px) {
  #cupones > .cupon-horizontal-v16:not(.cupon-bancario),
  #cupones > .cupon-bancario-ticket {
    height: 112px !important;
    min-height: 112px !important;
    max-height: 112px !important;
  }
}


/* ================================================================
   PAQUETE 2.2 — BANCARIOS: COLORES ORIGINALES + CONTENIDO VISIBLE
   - Los bancos recuperan el color asociado a su identidad/logo.
   - Conserva la misma altura visual que Tienda/Exclusivos.
   - Compacta exclusivamente el contenido bancario para evitar recortes.
   ================================================================ */
#cupones > .cupon-bancario-ticket {
  overflow: hidden !important;
}
#cupones .cupon-bancario-ticket .bt20-main,
#cupones .cupon-bancario-ticket .bt20-actions {
  height: 100% !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
}
#cupones .cupon-bancario-ticket .bt20-main {
  grid-template-columns: minmax(82px, 30%) minmax(0, 1fr) !important;
  gap: 8px !important;
  padding: 8px 10px !important;
  align-items: center !important;
}
#cupones .cupon-bancario-ticket .bt20-logo-wrap {
  min-height: 0 !important;
  height: auto !important;
  max-height: 88px !important;
  padding: 6px !important;
}
#cupones .cupon-bancario-ticket .bt20-logo {
  max-height: 70px !important;
}
#cupones .cupon-bancario-ticket .bt20-beneficio {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: visible !important;
}
#cupones .cupon-bancario-ticket .bt20-tipo {
  margin: 0 0 2px !important;
  font-size: 8px !important;
  line-height: 1 !important;
}
#cupones .cupon-bancario-ticket .bt20-beneficio h3 {
  margin: 0 0 3px !important;
  font-size: clamp(18px, 2.2vw, 29px) !important;
  line-height: .92 !important;
}
#cupones .cupon-bancario-ticket .bt20-beneficio p {
  margin: 1px 0 !important;
  font-size: 8px !important;
  line-height: 1.08 !important;
  overflow-wrap: anywhere !important;
}
#cupones .cupon-bancario-ticket .bt20-detalle {
  display: block !important;
  margin-top: 2px !important;
  font-size: 7.2px !important;
  line-height: 1.05 !important;
  opacity: .82 !important;
}
#cupones .cupon-bancario-ticket .bt20-etiquetas {
  gap: 3px !important;
  margin-top: 3px !important;
}
#cupones .cupon-bancario-ticket .bt20-etiquetas .etiqueta-cupon,
#cupones .cupon-bancario-ticket .bt20-etiquetas .etiqueta-popular-integrada {
  padding: 2px 4px !important;
  font-size: 6.5px !important;
}
#cupones .cupon-bancario-ticket .bt20-actions {
  padding: 8px 8px !important;
}
#cupones .cupon-bancario-ticket .bt20-copiar {
  min-height: 31px !important;
  font-size: 9.5px !important;
}
#cupones .cupon-bancario-ticket .bt20-social {
  margin-top: 6px !important;
  gap: 4px !important;
  font-size: 8px !important;
}
#cupones .cupon-bancario-ticket .bt20-tiempo {
  margin-top: 5px !important;
  padding-top: 5px !important;
  font-size: 8px !important;
}
@media (max-width: 680px) {
  #cupones .cupon-bancario-ticket .bt20-main {
    grid-template-columns: minmax(64px, 29%) minmax(0, 1fr) !important;
    gap: 5px !important;
    padding: 6px 6px !important;
  }
  #cupones .cupon-bancario-ticket .bt20-logo-wrap {
    max-height: 76px !important;
    padding: 4px !important;
    border-radius: 10px !important;
  }
  #cupones .cupon-bancario-ticket .bt20-logo { max-height: 58px !important; }
  #cupones .cupon-bancario-ticket .bt20-tipo { font-size: 6.2px !important; margin-bottom: 1px !important; }
  #cupones .cupon-bancario-ticket .bt20-beneficio h3 { font-size: 17px !important; margin-bottom: 2px !important; }
  #cupones .cupon-bancario-ticket .bt20-beneficio p { font-size: 6.4px !important; line-height: 1.04 !important; }
  #cupones .cupon-bancario-ticket .bt20-detalle { font-size: 5.9px !important; line-height: 1.02 !important; margin-top: 1px !important; }
  #cupones .cupon-bancario-ticket .bt20-etiquetas { margin-top: 2px !important; gap: 2px !important; }
  #cupones .cupon-bancario-ticket .bt20-etiquetas .etiqueta-cupon,
  #cupones .cupon-bancario-ticket .bt20-etiquetas .etiqueta-popular-integrada { padding: 1px 3px !important; font-size: 5.4px !important; }
  #cupones .cupon-bancario-ticket .bt20-actions { padding: 6px 5px !important; }
  #cupones .cupon-bancario-ticket .bt20-copiar { min-height: 27px !important; font-size: 7.4px !important; }
  #cupones .cupon-bancario-ticket .bt20-social { margin-top: 4px !important; gap: 3px !important; font-size: 6.7px !important; }
  #cupones .cupon-bancario-ticket .bt20-icon svg,
  #cupones .cupon-bancario-ticket .bt20-vistas svg { width: 10px !important; height: 10px !important; }
  #cupones .cupon-bancario-ticket .bt20-tiempo { margin-top: 4px !important; padding-top: 4px !important; font-size: 6.6px !important; }
}

/* ================================================================
   PAQUETE 2.3 — CORRECCIÓN BANCARIOS + MUESCAS
   - Mantiene colores originales de cada banco.
   - Igual altura/proporción que Tienda/Exclusivos.
   - Logo compacto y adaptable sobre blanco.
   - Información bancaria completa y centrada, sin desbordarse.
   - Acciones con la misma jerarquía visual que el resto de cupones.
   - Muescas muestran el fondo real de la sección, no blanco.
   ================================================================ */
#cupones { --fondo-seccion-cupones: #ffffff; }

#cupones .cupon-bancario-ticket {
  grid-template-columns: minmax(0, 68%) minmax(0, 32%) !important;
  min-height: 128px !important;
  height: 128px !important;
  overflow: visible !important;
  background: transparent !important;
}
#cupones .cupon-bancario-ticket .bt20-main {
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 10px !important;
  height: 128px !important;
  padding: 10px 12px !important;
  align-items: center !important;
  overflow: hidden !important;
  border-radius: 16px 0 0 16px !important;
}
#cupones .cupon-bancario-ticket .bt20-logo-wrap {
  width: auto !important;
  min-width: 72px !important;
  max-width: 128px !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: 76px !important;
  padding: 6px 9px !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 9px rgba(15,23,42,.08) !important;
  flex: 0 0 auto !important;
}
#cupones .cupon-bancario-ticket .bt20-logo {
  width: auto !important;
  height: auto !important;
  max-width: 110px !important;
  max-height: 54px !important;
  object-fit: contain !important;
  mix-blend-mode: multiply !important;
}
#cupones .cupon-bancario-ticket .bt20-beneficio {
  align-self: center !important;
  justify-content: center !important;
  gap: 0 !important;
  overflow: hidden !important;
}
#cupones .cupon-bancario-ticket .bt20-tipo {
  font-size: 8px !important;
  line-height: 1 !important;
  margin: 0 0 2px !important;
}
#cupones .cupon-bancario-ticket .bt20-beneficio h3 {
  font-size: clamp(19px,2.2vw,29px) !important;
  line-height: .95 !important;
  margin: 0 0 3px !important;
  white-space: normal !important;
}
#cupones .cupon-bancario-ticket .bt20-beneficio p {
  font-size: 8.2px !important;
  line-height: 1.08 !important;
  margin: 1px 0 !important;
  white-space: normal !important;
}
#cupones .cupon-bancario-ticket .bt20-detalle {
  font-size: 7.4px !important;
  line-height: 1.06 !important;
  margin: 1px 0 0 !important;
  max-height: 2.2em !important;
  overflow: hidden !important;
}
#cupones .cupon-bancario-ticket .bt20-etiquetas { margin-top: 3px !important; }

#cupones .cupon-bancario-ticket .bt20-actions {
  height: 128px !important;
  min-height: 128px !important;
  padding: 10px 10px !important;
  justify-content: center !important;
  overflow: visible !important;
  border-radius: 0 16px 16px 0 !important;
  border-left: 2px dotted rgba(255,255,255,.88) !important;
}
#cupones .cupon-bancario-ticket .bt20-actions::before,
#cupones .cupon-bancario-ticket .bt20-actions::after {
  background: var(--fondo-seccion-cupones) !important;
  width: 20px !important;
  height: 20px !important;
  left: -11px !important;
}
#cupones .cupon-bancario-ticket .bt20-copiar {
  width: 100% !important;
  min-height: 34px !important;
  padding: 5px 6px !important;
  font-size: 9.5px !important;
  line-height: 1 !important;
}
#cupones .cupon-bancario-ticket .bt20-copiar svg {
  width: 15px !important;
  height: 15px !important;
}
#cupones .cupon-bancario-ticket .bt20-social {
  margin-top: 7px !important;
  gap: 5px !important;
  font-size: 8px !important;
}
#cupones .cupon-bancario-ticket .bt20-icon svg,
#cupones .cupon-bancario-ticket .bt20-vistas svg {
  width: 13px !important;
  height: 13px !important;
}
#cupones .cupon-bancario-ticket .bt20-tiempo {
  margin-top: 7px !important;
  padding-top: 6px !important;
  font-size: 8px !important;
  line-height: 1.1 !important;
}

@media (max-width:680px) {
  #cupones .cupon-bancario-ticket {
    grid-template-columns: minmax(0,68%) minmax(0,32%) !important;
    height: 128px !important;
    min-height: 128px !important;
  }
  #cupones .cupon-bancario-ticket .bt20-main {
    grid-template-columns: auto minmax(0,1fr) !important;
    height: 128px !important;
    gap: 6px !important;
    padding: 7px 7px !important;
  }
  #cupones .cupon-bancario-ticket .bt20-logo-wrap {
    min-width: 58px !important;
    max-width: 92px !important;
    max-height: 62px !important;
    padding: 4px 6px !important;
  }
  #cupones .cupon-bancario-ticket .bt20-logo { max-width: 80px !important; max-height: 45px !important; }
  #cupones .cupon-bancario-ticket .bt20-tipo { font-size: 6.5px !important; }
  #cupones .cupon-bancario-ticket .bt20-beneficio h3 { font-size: 17px !important; }
  #cupones .cupon-bancario-ticket .bt20-beneficio p { font-size: 6.5px !important; line-height: 1.06 !important; }
  #cupones .cupon-bancario-ticket .bt20-detalle { font-size: 5.9px !important; }
  #cupones .cupon-bancario-ticket .bt20-actions { height: 128px !important; min-height:128px !important; padding: 7px 6px !important; }
  #cupones .cupon-bancario-ticket .bt20-copiar { min-height: 30px !important; font-size: 7.6px !important; }
  #cupones .cupon-bancario-ticket .bt20-social { margin-top: 5px !important; gap: 3px !important; font-size: 6.8px !important; }
  #cupones .cupon-bancario-ticket .bt20-icon svg,
  #cupones .cupon-bancario-ticket .bt20-vistas svg { width: 10px !important; height: 10px !important; }
  #cupones .cupon-bancario-ticket .bt20-tiempo { margin-top: 5px !important; padding-top: 5px !important; font-size: 6.7px !important; }
}

/* ================================================================
   PAQUETE 2.4 — AJUSTE FINO DE CUPONES BANCARIOS
   - Logo bancario plano: sin cápsula, margen, padding ni sombra.
   - Menos espacio desperdiciado para el logo.
   - Información bancaria centrada verticalmente.
   - Misma altura visual de las tarjetas horizontales.
   - Temporizador con contraste alto sobre el color del banco.
   - Muescas con el fondo real de la sección de cupones.
   ================================================================ */
#cupones .cupon-bancario-ticket .bt20-main {
  grid-template-columns: minmax(58px, 26%) minmax(0, 1fr) !important;
  gap: 8px !important;
  align-items: center !important;
}
#cupones .cupon-bancario-ticket .bt20-logo-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  overflow: visible !important;
}
#cupones .cupon-bancario-ticket .bt20-logo {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 54px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  object-fit: contain !important;
  mix-blend-mode: multiply !important;
}
#cupones .cupon-bancario-ticket .bt20-beneficio {
  align-self: center !important;
  justify-self: stretch !important;
  margin: 0 !important;
  transform: none !important;
}
#cupones .cupon-bancario-ticket .bt20-actions::before,
#cupones .cupon-bancario-ticket .bt20-actions::after {
  background: var(--fondo-seccion-cupones, #f3f3f3) !important;
  box-shadow: none !important;
  border: 0 !important;
}
#cupones .cupon-bancario-ticket .bt20-tiempo,
#cupones .cupon-bancario-ticket .bt20-tiempo *,
#cupones .cupon-bancario-ticket .bt20-tiempo .contador-tiempo,
#cupones .cupon-bancario-ticket .bt20-tiempo .texto-tiempo {
  color: var(--banco-texto) !important;
  -webkit-text-fill-color: var(--banco-texto) !important;
  opacity: 1 !important;
}
@media (max-width:680px) {
  #cupones .cupon-bancario-ticket .bt20-main {
    grid-template-columns: minmax(52px, 27%) minmax(0, 1fr) !important;
    gap: 6px !important;
  }
  #cupones .cupon-bancario-ticket .bt20-logo-wrap {
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
  }
  #cupones .cupon-bancario-ticket .bt20-logo {
    max-width: 100% !important;
    max-height: 44px !important;
  }
}

/* ================================================================
   PAQUETE 2.5 — CUPONES BLANCOS + BANCARIO UNIFICADO
   Fondo blanco para todos. El color vive en descuento, tipo y like activo.
   ================================================================ */
#cupones > .cupon-horizontal-v16 {
  --hc16-accent: var(--categoria-cupon-color, #f57c00);
  --hc19-green: var(--hc16-accent);
  --hc19-green-dark: var(--hc16-accent);
  grid-template-columns: 25% minmax(0,1fr) 35% !important;
  height:132px!important; min-height:132px!important; max-height:132px!important;
  background:#fff!important; color:#252525!important;
  border:1px solid #ececec!important; box-shadow:0 4px 14px rgba(20,30,45,.10)!important;
}
#cupones .cupon-horizontal-v16 .hc16-valor,
#cupones .cupon-horizontal-v16 .hc16-info,
#cupones .cupon-horizontal-v16 .hc16-acciones { background:#fff!important; color:#252525!important; }
#cupones .cupon-horizontal-v16 .hc16-descuento,
#cupones .cupon-horizontal-v16 .hc16-categoria { color:var(--hc16-accent)!important; }
#cupones .cupon-horizontal-v16 .hc16-categoria { background:color-mix(in srgb,var(--hc16-accent) 8%,#fff 92%)!important; }
#cupones .cupon-horizontal-v16 .hc16-condicion,
#cupones .cupon-horizontal-v16 .hc16-condicion strong,
#cupones .cupon-horizontal-v16 .hc16-detalle,
#cupones .cupon-horizontal-v16 .hc16-detalle strong,
#cupones .cupon-horizontal-v16 .hc16-ahorro-extra { color:#3b3f46!important; }
#cupones .cupon-horizontal-v16 .hc19-porcentaje { color:color-mix(in srgb,var(--hc16-accent) 8%,transparent 92%)!important; }
#cupones .cupon-horizontal-v16 .hc16-copiar { color:#222!important; background:#ffe600!important; border-color:#ffe600!important; text-transform:none!important; box-shadow:0 3px 8px rgba(60,50,0,.12)!important; }
#cupones .cupon-horizontal-v16 .hc16-copiar:hover,
#cupones .cupon-horizontal-v16 .hc16-copiar:focus-visible { color:#222!important; background:#ffed45!important; }
#cupones .cupon-horizontal-v16 .hc16-social .hc16-icono,
#cupones .cupon-horizontal-v16 .hc16-social .hc16-numero,
#cupones .cupon-horizontal-v16 .hc16-social .hc16-usos,
#cupones .cupon-horizontal-v16 .hc16-social .hc16-usos .numero-clics { color:#657080!important; }
#cupones .cupon-horizontal-v16 .hc16-social .boton-like.activo { color:var(--hc16-accent)!important; }
#cupones .cupon-horizontal-v16 .hc16-separador { background:#b7bec7!important; }
#cupones .cupon-horizontal-v16 .hc16-tiempo,
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-linea,
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-tiempo,
#cupones .cupon-horizontal-v16 .hc16-tiempo .estado-tiempo::before { color:#657080!important; }
#cupones .cupon-horizontal-v16 .hc16-tiempo { border-top:1px solid #e8eaed!important; font-weight:400!important; }
#cupones .cupon-horizontal-v16 .hc16-acciones::before,
#cupones .cupon-horizontal-v16 .hc16-acciones::after { background:var(--fondo-seccion-cupones,#f5f7f8)!important; }
#cupones .cupon-horizontal-v16 .hc16-cta::before { background:repeating-linear-gradient(to bottom,#dfe3e8 0 4px,transparent 4px 9px)!important; }

/* Bancario: exactamente la misma rejilla y lado derecho; logo vertical sobre el beneficio. */
#cupones > .cupon-bancario-unificado { overflow:hidden!important; }
#cupones .cupon-bancario-unificado .hc25-banco-valor { align-items:center!important; gap:5px!important; padding:9px 7px!important; }
#cupones .cupon-bancario-unificado .hc25-banco-logo {
  display:block!important; width:auto!important; height:auto!important; max-width:88%!important; max-height:42px!important;
  margin:0!important; padding:0!important; object-fit:contain!important; border:0!important; border-radius:0!important;
  background:transparent!important; box-shadow:none!important;
}
#cupones .cupon-bancario-unificado .hc16-descuento { justify-content:center!important; text-align:center!important; font-size:clamp(26px,4.5vw,42px)!important; }
#cupones .cupon-bancario-unificado .hc25-banco-info { justify-content:center!important; }
#cupones .cupon-bancario-unificado .hc25-banco-detalle { margin-bottom:5px!important; }
#cupones .cupon-bancario-unificado .hc25-banco-acciones { background:#fff!important; }

@media (max-width:680px){
  #cupones > .cupon-horizontal-v16 { grid-template-columns:25% minmax(0,1fr) 35%!important; height:112px!important; min-height:112px!important; max-height:112px!important; }
  #cupones .cupon-bancario-unificado .hc25-banco-logo { max-height:30px!important; max-width:86%!important; }
  #cupones .cupon-bancario-unificado .hc16-descuento { font-size:clamp(20px,6.5vw,31px)!important; }
  #cupones .cupon-bancario-unificado .hc16-detalle { font-size:7px!important; line-height:1.08!important; margin-bottom:3px!important; }
}

/* ================================================================
   PAQUETE 2.6 — CORRECCIÓN DE REJILLA Y SIMETRÍA
   - Fuerza la misma plantilla de 3 zonas para Tienda/Exclusivo/Bancario.
   - Recupera el descuento visible del bloque izquierdo.
   - Bancario no puede apilarse ni crecer fuera de la altura estándar.
   - Logo bancario sobre el beneficio, dentro de la columna izquierda.
   - Talón derecho idéntico en las tres categorías.
   ================================================================ */
#cupones > .cupon-horizontal-v16,
#cupones > .cupon-horizontal-v16.cupon-bancario,
#cupones > .cupon-horizontal-v16.cupon-bancario-unificado {
  display:grid!important;
  grid-template-columns:25% minmax(0,1fr) 35%!important;
  grid-template-rows:1fr!important;
  width:100%!important;
  height:132px!important;
  min-height:132px!important;
  max-height:132px!important;
  overflow:hidden!important;
  align-items:stretch!important;
}
#cupones > .cupon-horizontal-v16 > .hc16-valor,
#cupones > .cupon-horizontal-v16 > .hc16-info,
#cupones > .cupon-horizontal-v16 > .hc16-acciones {
  position:relative!important;
  min-width:0!important;
  width:auto!important;
  height:132px!important;
  min-height:132px!important;
  max-height:132px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}
#cupones > .cupon-horizontal-v16 > .hc16-acciones { overflow:visible!important; }

/* El valor debe ser siempre visible por encima del porcentaje decorativo. */
#cupones .cupon-horizontal-v16 .hc16-descuento {
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  z-index:3!important;
  color:var(--hc16-accent,var(--categoria-cupon-color,#f57c00))!important;
  -webkit-text-fill-color:var(--hc16-accent,var(--categoria-cupon-color,#f57c00))!important;
}
#cupones .cupon-horizontal-v16 .hc19-porcentaje { z-index:1!important; }

/* Bancario: misma geometría; logo + beneficio en la primera zona. */
#cupones > .cupon-bancario-unificado .hc25-banco-valor {
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  padding:8px 6px!important;
}
#cupones > .cupon-bancario-unificado .hc25-banco-logo {
  flex:0 0 auto!important;
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:88%!important;
  max-height:34px!important;
  margin:0!important;
  padding:0!important;
  object-fit:contain!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#cupones > .cupon-bancario-unificado .hc16-descuento {
  flex:0 0 auto!important;
  width:100%!important;
  margin:0!important;
  justify-content:center!important;
  text-align:center!important;
  font-size:clamp(25px,4vw,40px)!important;
  line-height:.9!important;
}
#cupones > .cupon-bancario-unificado .hc25-banco-info {
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:10px 10px!important;
  overflow:hidden!important;
}
#cupones > .cupon-bancario-unificado .hc16-categoria { margin-bottom:6px!important; }
#cupones > .cupon-bancario-unificado .hc16-condicion { font-size:13px!important; line-height:1.12!important; }
#cupones > .cupon-bancario-unificado .hc16-detalle {
  font-size:10px!important;
  line-height:1.1!important;
  margin:1px 0 3px!important;
  white-space:normal!important;
  overflow:hidden!important;
}
#cupones > .cupon-bancario-unificado .hc16-etiquetas { margin-top:2px!important; }
#cupones > .cupon-bancario-unificado .hc25-banco-acciones {
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  padding:12px 14px 10px!important;
  background:#fff!important;
}

@media (max-width:680px){
  #cupones > .cupon-horizontal-v16,
  #cupones > .cupon-horizontal-v16.cupon-bancario,
  #cupones > .cupon-horizontal-v16.cupon-bancario-unificado {
    display:grid!important;
    grid-template-columns:25% minmax(0,1fr) 35%!important;
    height:112px!important;
    min-height:112px!important;
    max-height:112px!important;
  }
  #cupones > .cupon-horizontal-v16 > .hc16-valor,
  #cupones > .cupon-horizontal-v16 > .hc16-info,
  #cupones > .cupon-horizontal-v16 > .hc16-acciones {
    height:112px!important;
    min-height:112px!important;
    max-height:112px!important;
  }
  #cupones > .cupon-bancario-unificado .hc25-banco-logo { max-height:25px!important; max-width:88%!important; }
  #cupones > .cupon-bancario-unificado .hc16-descuento { font-size:clamp(19px,5.6vw,29px)!important; }
  #cupones > .cupon-bancario-unificado .hc25-banco-info { padding:7px 6px!important; }
  #cupones > .cupon-bancario-unificado .hc16-categoria { margin-bottom:4px!important; }
  #cupones > .cupon-bancario-unificado .hc16-condicion { font-size:8px!important; }
  #cupones > .cupon-bancario-unificado .hc16-detalle { font-size:7px!important; line-height:1.05!important; margin:1px 0 2px!important; }
  #cupones > .cupon-bancario-unificado .hc25-banco-acciones { padding:9px 7px 7px!important; }
}

/* ================================================================
   PAQUETE 2.7 — BOTÓN TICKET + ETIQUETAS CÁPSULA SUAVE
   Referencias visuales aprobadas por el usuario.
   No modifica estructura, distribución ni funcionalidades.
   ================================================================ */
#cupones .cupon-horizontal-v16 .hc16-copiar {
  position: relative !important;
  overflow: hidden !important;
  min-height: 38px !important;
  padding: 7px 13px !important;
  border: 1px solid #d8b900 !important;
  border-radius: 6px !important;
  background: #ffe600 !important;
  color: #171717 !important;
  font-size: 11.5px !important;
  font-weight: 850 !important;
  text-transform: none !important;
  box-shadow: 0 3px 7px rgba(80,65,0,.16) !important;
  outline: 1px dashed rgba(75,62,0,.38) !important;
  outline-offset: -5px !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar::after {
  content: "" !important;
  position: absolute !important;
  top: -1px !important;
  right: -1px !important;
  width: 15px !important;
  height: 15px !important;
  background: linear-gradient(225deg, #c9a900 0 48%, #f6d800 50% 100%) !important;
  clip-path: polygon(0 0,100% 100%,100% 0) !important;
  pointer-events: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar:hover,
#cupones .cupon-horizontal-v16 .hc16-copiar:focus-visible {
  background: #ffea22 !important;
  color: #171717 !important;
  border-color: #c7aa00 !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar svg {
  color: #171717 !important;
  stroke: currentColor !important;
}

/* Cápsulas: suaves, sin sombra marcada, como la referencia Mayor ahorro. */
#cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-cupon,
#cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-popular-integrada {
  border: 0 !important;
  border-radius: 999px !important;
  padding: 4px 8px !important;
  font-size: 8.2px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  box-shadow: 0 2px 5px rgba(0,0,0,.07) !important;
}
#cupones .cupon-horizontal-v16 .etiqueta-mayor-ahorro { background:#dff7e8 !important; color:#168b45 !important; }
#cupones .cupon-horizontal-v16 .etiqueta-mas-usado { background:#e3efff !important; color:#2563c9 !important; }
#cupones .cupon-horizontal-v16 .etiqueta-top { background:#fff1c7 !important; color:#a56b00 !important; }
#cupones .cupon-horizontal-v16 .etiqueta-popular-integrada { background:#ffe4ea !important; color:#d93d61 !important; }
#cupones .cupon-horizontal-v16 .etiqueta-ultimas-horas { background:#fff0e3 !important; color:#d95f0b !important; }
#cupones .cupon-horizontal-v16 .etiqueta-ultima-oportunidad { background:#ffe3e3 !important; color:#c73535 !important; }
#cupones .cupon-horizontal-v16 .etiqueta-regreso { background:#e6f5f3 !important; color:#157f75 !important; }
#cupones .cupon-horizontal-v16 .etiqueta-nuevo { background:#eee8ff !important; color:#6c45c7 !important; }

@media (max-width:680px){
  #cupones .cupon-horizontal-v16 .hc16-copiar {
    min-height:31px !important;
    padding:5px 7px !important;
    font-size:8px !important;
    outline-offset:-4px !important;
  }
  #cupones .cupon-horizontal-v16 .hc16-copiar::after { width:11px !important; height:11px !important; }
  #cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-cupon,
  #cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-popular-integrada { padding:3px 5px !important; font-size:6.7px !important; }
}

/* ================================================================
   PAQUETE 4.0 — MUESCAS VISIBLES + CONTORNO CONSERVADO
   Único objetivo visual: mantener el contorno/sombra actual y recuperar
   las dos muescas semicirculares en la unión 65/35.
   ================================================================ */
#cupones .cupon-horizontal-v16 {
  --ticket-border: color-mix(in srgb, var(--hc16-accent, var(--categoria-cupon-color, #16ad77)) 20%, #d9e1de 80%);
  --ticket-cutout-bg: #ffffff; /* JS 4.1 la sincroniza con el fondo real de la sección */
  position: relative !important;
  overflow: hidden !important;
  -webkit-mask: none !important;
  mask: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  clip-path: none !important;
  border: 1px solid var(--ticket-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 12px rgba(20, 30, 45, .10) !important;
}
#cupones .cupon-horizontal-v16::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 100 !important;
  top: -8px !important;
  left: 65% !important;
  width: 18px !important;
  height: 18px !important;
  transform: translateX(-50%) !important;
  border: 1px solid var(--ticket-border) !important;
  border-radius: 50% !important;
  background: var(--ticket-cutout-bg) !important;
  box-shadow: none !important;
  pointer-events: none !important;
  opacity: 1 !important;
  -webkit-mask: none !important;
  mask: none !important;
}
#cupones .cupon-horizontal-v16::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 100 !important;
  top: auto !important;
  right: auto !important;
  bottom: -8px !important;
  left: 65% !important;
  inset: auto auto -9px 65% !important;
  width: 18px !important;
  height: 18px !important;
  transform: translateX(-50%) !important;
  border: 1px solid var(--ticket-border) !important;
  border-radius: 50% !important;
  background: var(--ticket-cutout-bg) !important;
  box-shadow: none !important;
  pointer-events: none !important;
  opacity: 1 !important;
  -webkit-mask: none !important;
  mask: none !important;
}
#cupones .cupon-horizontal-v16 > .hc16-acciones::before,
#cupones .cupon-horizontal-v16 > .hc16-acciones::after {
  content: none !important;
  display: none !important;
}
#cupones .cupon-bancario-unificado .hc16-descuento {
  font-size: clamp(23px, 3.4vw, 34px) !important;
  line-height: .94 !important;
}
#cupones .cupon-bancario-unificado .hc25-banco-info {
  justify-content: center !important;
  padding: 13px 13px 12px !important;
}
#cupones .cupon-bancario-unificado .hc16-categoria { margin-bottom: 8px !important; }
#cupones .cupon-bancario-unificado .hc16-condicion {
  font-size: 13px !important;
  line-height: 1.15 !important;
}
#cupones .cupon-bancario-unificado .hc16-detalle,
#cupones .cupon-bancario-unificado .hc25-banco-detalle {
  margin: 0 0 8px !important;
  font-size: 10.5px !important;
  line-height: 1.15 !important;
}
#cupones .cupon-horizontal-v16 .boton-like:not(.activo),
#cupones .cupon-horizontal-v16 .boton-like:not(.activo) svg {
  color: #7b8491 !important;
  fill: currentColor !important;
}
#cupones .cupon-horizontal-v16 .boton-like.activo,
#cupones .cupon-horizontal-v16 .boton-like.activo svg {
  color: var(--hc16-accent) !important;
  fill: currentColor !important;
}
@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 { border-radius: 13px !important; }
  #cupones .cupon-horizontal-v16::before {
    top: -7px !important;
    width: 14px !important;
    height: 14px !important;
  }
  #cupones .cupon-horizontal-v16::after {
    bottom: -7px !important;
    inset: auto auto -7px 65% !important;
    width: 14px !important;
    height: 14px !important;
  }
  #cupones .cupon-bancario-unificado .hc16-descuento {
    font-size: clamp(18px, 5vw, 26px) !important;
  }
  #cupones .cupon-bancario-unificado .hc25-banco-info { padding: 9px 7px 8px !important; }
  #cupones .cupon-bancario-unificado .hc16-categoria { margin-bottom: 6px !important; }
  #cupones .cupon-bancario-unificado .hc16-condicion {
    font-size: 9.2px !important;
    line-height: 1.15 !important;
  }
  #cupones .cupon-bancario-unificado .hc16-detalle,
  #cupones .cupon-bancario-unificado .hc25-banco-detalle {
    margin: 0 0 5px !important;
    font-size: 7.3px !important;
    line-height: 1.15 !important;
  }
}


/* ================================================================
   PAQUETE 4.1 — MUESCAS VISIBLES SIN PERDER CONTORNO
   El color interno se obtiene por JS del fondo efectivo detrás de cada
   tarjeta. Se conserva borde, sombra, distribución y contenido actuales.
   ================================================================ */
@media (max-width:680px){
  #cupones .cupon-horizontal-v16::before {
    top:-7px !important; width:14px !important; height:14px !important;
  }
  #cupones .cupon-horizontal-v16::after {
    bottom:-7px !important; inset:auto auto -7px 65% !important;
    width:14px !important; height:14px !important;
  }
}

/* ================================================================
   PAQUETE 4.2 — MUESCA ESTABLE SIN MÁSCARAS NI PSEUDOELEMENTOS
   Único cambio: muescas superior/inferior visibles manteniendo intactos
   el borde, sombra, estructura y contenido aprobados.
   ================================================================ */
#cupones .cupon-horizontal-v16 {
  /* Se desactivan únicamente las muescas experimentales 4.0/4.1. */
  overflow: hidden !important;
}
#cupones .cupon-horizontal-v16::before,
#cupones .cupon-horizontal-v16::after {
  content: none !important;
  display: none !important;
}
#cupones .cupon-horizontal-v16 > .ticket-notch {
  position: absolute !important;
  left: 65% !important;
  z-index: 120 !important;
  display: block !important;
  width: 16px !important;
  box-sizing: border-box !important;
  transform: translateX(-50%) !important;
  background: var(--ticket-cutout-bg, #f4f8f6) !important;
  pointer-events: none !important;
}
/* Media luna superior: sólo existe dentro de la tarjeta, por lo que no
   depende de overflow, mask ni clip-path del navegador. */
#cupones .cupon-horizontal-v16 > .ticket-notch-top {
  top: -1px !important;
  height: 9px !important;
  border: 1px solid var(--ticket-border, #dbe3df) !important;
  border-top: 0 !important;
  border-radius: 0 0 10px 10px !important;
}
/* Media luna inferior, espejo exacto de la superior. */
#cupones .cupon-horizontal-v16 > .ticket-notch-bottom {
  bottom: -1px !important;
  height: 9px !important;
  border: 1px solid var(--ticket-border, #dbe3df) !important;
  border-bottom: 0 !important;
  border-radius: 10px 10px 0 0 !important;
}
@media (max-width:680px) {
  #cupones .cupon-horizontal-v16 > .ticket-notch {
    width: 14px !important;
  }
  #cupones .cupon-horizontal-v16 > .ticket-notch-top,
  #cupones .cupon-horizontal-v16 > .ticket-notch-bottom {
    height: 8px !important;
  }
}
/* Asegura el contorno exterior aprobado aun si style.css intenta anularlo. */
#cupones .cupon-horizontal-v16 {
  border: 1px solid var(--ticket-border, #dbe3df) !important;
  box-shadow: 0 4px 12px rgba(20, 30, 45, .10) !important;
}
/* Máxima especificidad para el contorno exterior de la tarjeta. */
#cupones.cupones-grid-compacta > article.cupon.cupon-horizontal-v16,
#cupones article.cupon.cupon-horizontal-v16 {
  border: 1px solid var(--ticket-border, #dbe3df) !important;
  box-shadow: 0 4px 12px rgba(20, 30, 45, .10) !important;
}

/* ================================================================
   PAQUETE 4.3 — LIMPIEZA INTERIOR DE LAS MUESCAS
   Único cambio: ocultar la línea vertical dentro de la muesca sin
   modificar forma, tamaño, borde, sombra ni distribución de tarjetas.
   ================================================================ */
#cupones .cupon-horizontal-v16 > .ticket-notch {
  z-index: 9999 !important;
  isolation: isolate !important;
}
#cupones .cupon-horizontal-v16 > .ticket-notch::after {
  content: "" !important;
  position: absolute !important;
  z-index: 2 !important;
  inset: 1px !important;
  display: block !important;
  border-radius: inherit !important;
  background: var(--ticket-cutout-bg, #f4f8f6) !important;
  pointer-events: none !important;
}

/* ================================================================
   PAQUETE 4.8 — MUESCA REAL EN LA SILUETA DE LA TARJETA
   La muesca ya no es un círculo superpuesto. La propia tarjeta se recorta
   en la unión 65/35, por lo que no existe arco/borde exterior alrededor.
   ================================================================ */
#cupones .cupon-horizontal-v16 {
  overflow: hidden !important;
  -webkit-mask: none !important;
  mask: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  clip-path: polygon(
    0 0,
    calc(65% - 9px) 0,
    calc(65% - 8.56px) 2.78px,
    calc(65% - 7.28px) 5.29px,
    calc(65% - 5.29px) 7.28px,
    calc(65% - 2.78px) 8.56px,
    65% 9px,
    calc(65% + 2.78px) 8.56px,
    calc(65% + 5.29px) 7.28px,
    calc(65% + 7.28px) 5.29px,
    calc(65% + 8.56px) 2.78px,
    calc(65% + 9px) 0,
    100% 0,
    100% 100%,
    calc(65% + 9px) 100%,
    calc(65% + 8.56px) calc(100% - 2.78px),
    calc(65% + 7.28px) calc(100% - 5.29px),
    calc(65% + 5.29px) calc(100% - 7.28px),
    calc(65% + 2.78px) calc(100% - 8.56px),
    65% calc(100% - 9px),
    calc(65% - 2.78px) calc(100% - 8.56px),
    calc(65% - 5.29px) calc(100% - 7.28px),
    calc(65% - 7.28px) calc(100% - 5.29px),
    calc(65% - 8.56px) calc(100% - 2.78px),
    calc(65% - 9px) 100%,
    0 100%
  ) !important;
}

/* Se eliminan completamente los elementos que antes dibujaban círculos. */
#cupones .cupon-horizontal-v16::before,
#cupones .cupon-horizontal-v16::after,
#cupones .cupon-horizontal-v16 > .ticket-notch,
#cupones .cupon-horizontal-v16 > .ticket-notch::before,
#cupones .cupon-horizontal-v16 > .ticket-notch::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 {
    clip-path: polygon(
      0 0,
      calc(65% - 8px) 0,
      calc(65% - 7.61px) 2.47px,
      calc(65% - 6.47px) 4.70px,
      calc(65% - 4.70px) 6.47px,
      calc(65% - 2.47px) 7.61px,
      65% 8px,
      calc(65% + 2.47px) 7.61px,
      calc(65% + 4.70px) 6.47px,
      calc(65% + 6.47px) 4.70px,
      calc(65% + 7.61px) 2.47px,
      calc(65% + 8px) 0,
      100% 0,
      100% 100%,
      calc(65% + 8px) 100%,
      calc(65% + 7.61px) calc(100% - 2.47px),
      calc(65% + 6.47px) calc(100% - 4.70px),
      calc(65% + 4.70px) calc(100% - 6.47px),
      calc(65% + 2.47px) calc(100% - 7.61px),
      65% calc(100% - 8px),
      calc(65% - 2.47px) calc(100% - 7.61px),
      calc(65% - 4.70px) calc(100% - 6.47px),
      calc(65% - 6.47px) calc(100% - 4.70px),
      calc(65% - 7.61px) calc(100% - 2.47px),
      calc(65% - 8px) 100%,
      0 100%
    ) !important;
  }
}


/* ================================================================
   PAQUETE 5.3 — DESCUENTO UNIFORME + ACTIVIDAD CENTRADA
   Base: 4.8. No modifica la geometria ni las muescas del ticket.
   - OFF siempre se renderiza como elemento secundario, evitando que
     reduzca visualmente el importe cuando viene incluido en el titulo.
   - Compartir | Me gusta | Vistas queda centrado en el talon derecho.
   ================================================================ */
#cupones .cupon-horizontal-v16 .hc16-descuento {
  column-gap: 4px !important;
  row-gap: 0 !important;
}
#cupones .cupon-horizontal-v16 .hc19-off {
  flex: 0 0 auto !important;
}
#cupones .cupon-horizontal-v16 .hc16-social {
  width: 100% !important;
  justify-content: center !important;
  align-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-social {
    justify-content: center !important;
  }
}


/* ================================================================
   PAQUETE 5.4 — AJUSTES VISUALES EN CUPONES BANCARIOS
   Base: 5.3 / muescas 4.8 intactas.
   - OFF se trata igual que en Tienda/Exclusivo: texto secundario.
   - Compartir | Me gusta | Vistas centrado en el talon derecho.
   - Logo del banco 20% mas grande, sin alterar la tarjeta.
   ================================================================ */
#cupones .cupon-bancario-unificado .hc16-descuento {
  column-gap: 4px !important;
  row-gap: 0 !important;
}
#cupones .cupon-bancario-unificado .hc19-off {
  flex: 0 0 auto !important;
}
#cupones .cupon-bancario-unificado .hc16-social {
  width: 100% !important;
  justify-content: center !important;
  align-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* 34px x 1.20 = 40.8px */
#cupones > .cupon-bancario-unificado .hc25-banco-logo {
  max-height: 41px !important;
  max-width: 96% !important;
}
@media (max-width: 680px) {
  /* 25px x 1.20 = 30px */
  #cupones > .cupon-bancario-unificado .hc25-banco-logo {
    max-height: 30px !important;
    max-width: 96% !important;
  }
  #cupones .cupon-bancario-unificado .hc16-social {
    justify-content: center !important;
  }
}

/* =========================================================
   V82.79 — Cupones agotados: CTA útil hacia Ofertazo
   Mantiene la tarjeta identificada como agotada, pero deja
   el botón principal activo y visible como “Ver ofertas”.
   ========================================================= */
#cupones > .cupon-horizontal-v16.cupon-agotado {
  opacity: 1 !important;
  filter: none !important;
}
#cupones > .cupon-horizontal-v16.cupon-agotado > .hc16-valor,
#cupones > .cupon-horizontal-v16.cupon-agotado > .hc16-info,
#cupones > .cupon-horizontal-v16.cupon-agotado .hc16-social,
#cupones > .cupon-horizontal-v16.cupon-agotado .hc16-tiempo {
  opacity: .58 !important;
  filter: grayscale(.35) saturate(.70) !important;
}
#cupones > .cupon-horizontal-v16.cupon-agotado .hc16-cta {
  opacity: 1 !important;
  filter: none !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar.boton-ofertazo-agotado,
#cupones .cupon-horizontal-v16 .hc16-copiar.boton-agotado.boton-ofertazo-agotado,
#cupones .cupon-horizontal-v16.cupon-agotado .hc16-copiar.boton-ofertazo-agotado {
  opacity: 1 !important;
  filter: none !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  background: #ffe600 !important;
  color: #161616 !important;
  border-color: #d7bf00 !important;
  box-shadow: 0 5px 12px rgba(0,0,0,.14) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
}
#cupones .cupon-horizontal-v16 .hc16-copiar.boton-ofertazo-agotado:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 7px 15px rgba(0,0,0,.17) !important;
}
#cupones .boton-ofertazo-icono {
  font-size: 15px;
  line-height: 1;
  font-weight: 900;
}

/* ================================================================
   PAQUETE 5.7 — AGOTADO BLANCO + ICONO OFERTAZO
   - Conserva la muesca 4.8 y la geometría actual.
   - Cupón agotado mantiene fondo blanco en las tres zonas.
   - El CTA usa el isotipo de Ofertazo en lugar de la flecha.
   ================================================================ */
#cupones > .cupon-horizontal-v16.cupon-agotado,
#cupones > .cupon-horizontal-v16.cupon-agotado > .hc16-valor,
#cupones > .cupon-horizontal-v16.cupon-agotado > .hc16-info,
#cupones > .cupon-horizontal-v16.cupon-agotado > .hc16-acciones {
  background: #fff !important;
}
#cupones .boton-ofertazo-icono {
  display: inline-flex !important;
  flex: 0 0 22px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 20px !important;
  margin: 0 1px 0 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}
#cupones .boton-ofertazo-icono svg {
  display: block !important;
  width: 22px !important;
  height: 19px !important;
  overflow: visible !important;
}
@media (max-width: 680px) {
  #cupones .boton-ofertazo-icono {
    flex-basis: 18px !important;
    width: 18px !important;
    height: 17px !important;
  }
  #cupones .boton-ofertazo-icono svg {
    width: 18px !important;
    height: 16px !important;
  }
}


/* ================================================================
   PAQUETE 6.1 — ICONOS SOCIALES EN CAPSULAS
   Referencia: compartir verde, corazon rosa y vistas azul.
   Conserva funcionalidad, centrado y geometria de las tarjetas.
   ================================================================ */
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  gap: 6px !important;
  color: #657080 !important;
}
#cupones .cupon-horizontal-v16 .hc61-chip {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 26px !important;
  border: 0 !important;
  box-shadow: none !important;
  line-height: 1 !important;
}
#cupones .cupon-horizontal-v16 .hc61-share {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #eaf9f2 !important;
  color: #16b76a !important;
}
#cupones .cupon-horizontal-v16 .hc61-like-chip {
  gap: 4px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  background: #fff0f5 !important;
  color: #ef4f91 !important;
}
#cupones .cupon-horizontal-v16 .hc61-view-chip {
  gap: 4px !important;
  padding: 0 8px !important;
  border-radius: 999px !important;
  background: #eef6ff !important;
  color: #2585e8 !important;
}
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono,
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono:hover,
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono:focus,
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono:active {
  width: 17px !important;
  height: 17px !important;
  min-width: 17px !important;
  min-height: 17px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #ef4f91 !important;
  box-shadow: none !important;
}
#cupones .cupon-horizontal-v16 .hc61-share svg,
#cupones .cupon-horizontal-v16 .hc61-like-chip svg,
#cupones .cupon-horizontal-v16 .hc61-view-chip svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.activo svg {
  fill: currentColor !important;
  stroke: currentColor !important;
}
#cupones .cupon-horizontal-v16 .hc61-like-chip .hc16-numero,
#cupones .cupon-horizontal-v16 .hc61-view-chip .numero-clics {
  color: #3f4650 !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
#cupones .cupon-horizontal-v16 .hc61-separador {
  display: block !important;
  width: 1px !important;
  height: 17px !important;
  margin: 0 1px !important;
  background: #d3d9df !important;
  opacity: 1 !important;
}
#cupones .cupon-horizontal-v16.cupon-agotado .hc61-social {
  opacity: .58 !important;
}
@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social {
    gap: 4px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-chip {
    min-height: 23px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-share {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-like-chip,
  #cupones .cupon-horizontal-v16 .hc61-view-chip {
    gap: 3px !important;
    padding: 0 6px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-share svg,
  #cupones .cupon-horizontal-v16 .hc61-like-chip svg,
  #cupones .cupon-horizontal-v16 .hc61-view-chip svg {
    width: 14px !important;
    height: 14px !important;
    flex-basis: 14px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono {
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    min-height: 15px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-like-chip .hc16-numero,
  #cupones .cupon-horizontal-v16 .hc61-view-chip .numero-clics {
    font-size: 8px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-separador {
    height: 15px !important;
    margin: 0 !important;
  }
}


/* ================================================================
   PAQUETE 6.5 — ICONOS SOCIALES LIMPIOS
   - Solo modifica Compartir / Me gusta / Vistas.
   - Sin separadores verticales.
   - Grupo más compacto y ligeramente hacia la izquierda.
   - Colores forzados para evitar reglas antiguas en gris.
   ================================================================ */
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: 100% !important;
  min-height: 29px !important;
  margin-top: 5px !important;
  transform: translateX(-4px) !important;
}
#cupones .cupon-horizontal-v16 .hc61-separador {
  display: none !important;
}
#cupones .cupon-horizontal-v16 .hc61-chip {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 28px !important;
  min-height: 28px !important;
  border: 0 !important;
  box-shadow: none !important;
  line-height: 1 !important;
}
#cupones .cupon-horizontal-v16 .hc61-share,
#cupones .cupon-horizontal-v16 .hc61-share:hover,
#cupones .cupon-horizontal-v16 .hc61-share:focus,
#cupones .cupon-horizontal-v16 .hc61-share:active {
  width: 28px !important;
  min-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #eaf9f2 !important;
  color: #14b86a !important;
}
#cupones .cupon-horizontal-v16 .hc61-like-chip {
  min-width: 43px !important;
  padding: 0 7px !important;
  gap: 4px !important;
  border-radius: 999px !important;
  background: #fff0f6 !important;
  color: #f04f91 !important;
}
#cupones .cupon-horizontal-v16 .hc61-view-chip {
  min-width: 47px !important;
  padding: 0 7px !important;
  gap: 4px !important;
  border-radius: 999px !important;
  background: #edf5ff !important;
  color: #1976e9 !important;
}
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono,
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono:hover,
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono:focus,
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono:active {
  appearance: none !important;
  width: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #f04f91 !important;
  box-shadow: none !important;
}
#cupones .cupon-horizontal-v16 .hc61-share svg,
#cupones .cupon-horizontal-v16 .hc61-like-chip svg,
#cupones .cupon-horizontal-v16 .hc61-view-chip svg {
  display: block !important;
  width: 15px !important;
  height: 15px !important;
  flex: 0 0 15px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.activo,
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.activo:hover {
  color: #f04f91 !important;
  background: transparent !important;
}
#cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.activo svg {
  fill: #f04f91 !important;
  stroke: #f04f91 !important;
}
#cupones .cupon-horizontal-v16 .hc61-like-chip .hc16-numero,
#cupones .cupon-horizontal-v16 .hc61-view-chip .numero-clics {
  color: #4d5663 !important;
  -webkit-text-fill-color: #4d5663 !important;
  min-width: 9px !important;
  margin: 0 !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
}
#cupones .cupon-horizontal-v16.cupon-agotado .hc61-social {
  opacity: .58 !important;
}
@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social {
    gap: 3px !important;
    min-height: 25px !important;
    margin-top: 4px !important;
    transform: translateX(-7px) !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-chip {
    height: 24px !important;
    min-height: 24px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-share {
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-like-chip {
    min-width: 37px !important;
    padding: 0 5px !important;
    gap: 3px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-view-chip {
    min-width: 41px !important;
    padding: 0 5px !important;
    gap: 3px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-share svg,
  #cupones .cupon-horizontal-v16 .hc61-like-chip svg,
  #cupones .cupon-horizontal-v16 .hc61-view-chip svg {
    width: 13px !important;
    height: 13px !important;
    flex-basis: 13px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-like-chip .boton-like.hc16-icono {
    width: 14px !important;
    min-width: 14px !important;
    height: 14px !important;
    min-height: 14px !important;
  }
  #cupones .cupon-horizontal-v16 .hc61-like-chip .hc16-numero,
  #cupones .cupon-horizontal-v16 .hc61-view-chip .numero-clics {
    font-size: 8px !important;
  }
}

/* ================================================================
   PAQUETE 6.6 — CORRECCIÓN EXCLUSIVA DE APARIENCIA DE ICONOS
   No modifica posiciones, espacios, márgenes, muescas ni estructura.
   ================================================================ */
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .boton-compartir.hc61-share,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .boton-compartir.hc61-share:hover,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .boton-compartir.hc61-share:focus,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .boton-compartir.hc61-share:active {
  color: #14b86a !important;
  background-color: #eaf9f2 !important;
}
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-like-chip,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-like-chip .boton-like.hc16-icono,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-like-chip .boton-like.hc16-icono:not(.activo),
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-like-chip .boton-like.hc16-icono.activo {
  color: #f04f91 !important;
}
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-view-chip.hc16-vistas {
  color: #1976e9 !important;
  background-color: #edf5ff !important;
}
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-share svg,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-like-chip .boton-like.hc16-icono svg,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-view-chip.hc16-vistas svg {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-share svg path,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-like-chip .boton-like.hc16-icono svg path,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-view-chip.hc16-vistas svg path,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-view-chip.hc16-vistas svg circle {
  fill: none !important;
  stroke: currentColor !important;
}
/* Incluso cuando ya tiene like, conservar el corazón de contorno solicitado. */
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-like-chip .boton-like.hc16-icono.activo svg,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social .hc61-like-chip .boton-like.hc16-icono.activo svg path {
  fill: none !important;
  stroke: #f04f91 !important;
}

/* ================================================================
   PAQUETE 6.7 — AJUSTE PUNTUAL DEL ICONO COMPARTIR
   - Solo corrige Compartir y el centrado horizontal del bloque social.
   - No modifica alturas, vigencia, muescas, CTA ni contenido.
   ================================================================ */
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social {
  transform: translateX(-1px) !important;
}
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share:hover,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share:focus,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share:active {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  outline: 0 !important;
  background: #eaf9f2 !important;
  color: #14b86a !important;
  box-shadow: none !important;
  overflow: hidden !important;
  line-height: 1 !important;
}
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share svg {
  display: block !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  fill: none !important;
  stroke: #14b86a !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share svg * {
  fill: none !important;
  stroke: #14b86a !important;
}
@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social {
    transform: translateX(-4px) !important;
  }
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share,
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share:hover,
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share:focus,
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share:active {
    flex-basis: 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
  }
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .boton-compartir.hc61-share svg {
    flex-basis: 14px !important;
    width: 14px !important;
    min-width: 14px !important;
    max-width: 14px !important;
    height: 14px !important;
    min-height: 14px !important;
    max-height: 14px !important;
  }
}

/* ================================================================
   PAQUETE 6.8 — AJUSTE FINAL SOLO DE ICONOS SOCIALES
   Objetivos:
   1) Compartir visualmente equivalente a Me gusta / Vistas.
   2) Los tres elementos quedan centrados como grupo debajo del CTA.
   3) Se elimina cualquier borde/cuadro residual del botón Compartir.
   No modifica alturas, vigencia, CTA, muescas ni contenido.
   ================================================================ */
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social {
  display: grid !important;
  grid-template-columns: 28px 43px 47px !important;
  align-items: center !important;
  justify-content: center !important;
  column-gap: 5px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transform: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .hc61-share,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .hc61-like-chip,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > .hc61-view-chip {
  justify-self: center !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share:hover,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share:focus,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share:focus-visible,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share:active {
  appearance: none !important;
  -webkit-appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: none !important;
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
  height: 28px !important;
  min-height: 28px !important;
  max-height: 28px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-width: 0 !important;
  border-style: none !important;
  border-color: transparent !important;
  border-radius: 50% !important;
  outline: none !important;
  outline-offset: 0 !important;
  background: #eaf9f2 !important;
  background-color: #eaf9f2 !important;
  color: #12aa63 !important;
  box-shadow: none !important;
  filter: none !important;
  overflow: hidden !important;
  clip-path: circle(50%) !important;
  -webkit-clip-path: circle(50%) !important;
  -webkit-tap-highlight-color: transparent !important;
}

#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share::before,
#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share::after {
  content: none !important;
  display: none !important;
}

#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share svg {
  display: block !important;
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  overflow: visible !important;
}

#cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share svg path {
  fill: none !important;
  stroke: currentColor !important;
}

@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social {
    grid-template-columns: 24px 37px 41px !important;
    column-gap: 4px !important;
    transform: none !important;
  }

  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share,
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share:hover,
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share:focus,
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share:focus-visible,
  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share:active {
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;
  }

  #cupones .cupon-horizontal-v16 .hc16-social.hc61-social > button.boton-compartir.hc61-share svg {
    width: 14px !important;
    min-width: 14px !important;
    max-width: 14px !important;
    height: 14px !important;
    min-height: 14px !important;
    max-height: 14px !important;
  }
}


/* ================================================================
   PAQUETE 7.1 — CUPÓN AGOTADO: CTA VISUALMENTE ACTIVO
   - La tarjeta continúa atenuada para indicar que el cupón se agotó.
   - Solo “Ver ofertas” conserva exactamente el acabado amarillo activo.
   - El destino del botón lo resuelve app.js hacia el enlace de Mercado Libre.
   ================================================================ */
#cupones .cupon-horizontal-v16.cupon-agotado .hc16-copiar.boton-ofertazo-agotado {
  opacity: 1 !important;
  filter: none !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  background: #ffe600 !important;
  color: #171717 !important;
  border: 1px solid #d8b900 !important;
  box-shadow: 0 3px 7px rgba(80,65,0,.16) !important;
  outline: 1px dashed rgba(75,62,0,.38) !important;
  outline-offset: -5px !important;
}
#cupones .cupon-horizontal-v16.cupon-agotado .hc16-copiar.boton-ofertazo-agotado:hover,
#cupones .cupon-horizontal-v16.cupon-agotado .hc16-copiar.boton-ofertazo-agotado:focus-visible {
  background: #ffea22 !important;
  color: #171717 !important;
  border-color: #c7aa00 !important;
  box-shadow: 0 3px 7px rgba(80,65,0,.16) !important;
}

/* ================================================================
   PAQUETE 7.2 — CTA AGOTADO 100% ACTIVO
   Corrige una regla histórica con :not(.cupon-bancario) que aplicaba
   opacity al contenedor completo. La atenuación queda solo en el
   contenido del cupón; el CTA "Ver ofertas" conserva el amarillo activo.
   ================================================================ */
#cupones > .cupon-horizontal-v16.cupon-agotado:not(.cupon-bancario),
#cupones > .cupon-horizontal-v16.cupon-agotado.cupon-bancario {
  opacity: 1 !important;
  filter: none !important;
}
#cupones > .cupon-horizontal-v16.cupon-agotado .hc16-copiar.boton-ofertazo-agotado {
  opacity: 1 !important;
  filter: none !important;
  background: #ffe600 !important;
  color: #171717 !important;
  border-color: #d8b900 !important;
  box-shadow: 0 3px 7px rgba(80,65,0,.16) !important;
}

/* ================================================================
   V83.5 — CORRECCIÓN VISIBILIDAD DETALLE CUPÓN BANCARIO
   - Mantiene la tarjeta actual.
   - Da prioridad al texto de tope/detalle bancario para que no quede
     recortado en web ni móvil cuando existen etiquetas.
   ================================================================ */
#cupones > .cupon-bancario-unificado > .hc25-banco-info {
  justify-content: flex-start !important;
  padding-top: 10px !important;
  padding-bottom: 8px !important;
}
#cupones > .cupon-bancario-unificado .hc16-categoria {
  margin-bottom: 5px !important;
}
#cupones > .cupon-bancario-unificado .hc16-condiciones {
  margin-bottom: 4px !important;
}
#cupones > .cupon-bancario-unificado .hc16-detalle,
#cupones > .cupon-bancario-unificado .hc25-banco-detalle {
  display: block !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  min-height: 1.15em !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
  color: #2f343b !important;
  -webkit-text-fill-color: #2f343b !important;
  opacity: 1 !important;
  visibility: visible !important;
  font-size: 10.5px !important;
  line-height: 1.18 !important;
  font-weight: 500 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  position: relative !important;
  z-index: 4 !important;
}
#cupones > .cupon-bancario-unificado .hc16-etiquetas {
  flex: 0 0 auto !important;
  margin-top: 1px !important;
}

@media (max-width: 680px) {
  #cupones > .cupon-bancario-unificado > .hc25-banco-info {
    justify-content: flex-start !important;
    padding: 7px 6px 5px !important;
  }
  #cupones > .cupon-bancario-unificado .hc16-categoria {
    margin-bottom: 3px !important;
  }
  #cupones > .cupon-bancario-unificado .hc16-condiciones {
    margin-bottom: 2px !important;
  }
  #cupones > .cupon-bancario-unificado .hc16-detalle,
  #cupones > .cupon-bancario-unificado .hc25-banco-detalle {
    min-height: 1.12em !important;
    margin-bottom: 2px !important;
    font-size: 7.5px !important;
    line-height: 1.12 !important;
  }
  #cupones > .cupon-bancario-unificado .hc16-etiquetas {
    margin-top: 0 !important;
  }
}


/* ================================================================
   PAQUETE 7.3 — IMPORTE LARGO COMPLETO EN MÓVIL
   Ajusta únicamente descuentos de 6+ caracteres (ej. $1,000) para
   que no se recorten dentro de la columna izquierda del ticket.
   ================================================================ */
@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-descuento.hc16-descuento-largo {
    font-size: clamp(24px, 6.7vw, 31px) !important;
    letter-spacing: -0.055em !important;
  }
}


/* ================================================================
   PAQUETE 8.0 — CÁPSULAS DEGRADADAS (MUESTRA 8)
   Cambio exclusivamente visual; conserva textos, estados y funciones.
   ================================================================ */
#cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-cupon,
#cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-popular-integrada {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 5px 10px !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  border-radius: 999px !important;
  color: #fff !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -.01em !important;
  white-space: nowrap !important;
  box-shadow: 0 3px 8px rgba(15,23,42,.16), inset 0 1px 0 rgba(255,255,255,.25) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.18) !important;
}

#cupones .cupon-horizontal-v16 .etiqueta-ultima-oportunidad {
  background: linear-gradient(135deg,#ef233c 0%,#ff6b35 100%) !important;
}
#cupones .cupon-horizontal-v16 .etiqueta-ultimas-horas {
  background: linear-gradient(135deg,#f72585 0%,#ff7b38 100%) !important;
}
#cupones .cupon-horizontal-v16 .etiqueta-regreso {
  background: linear-gradient(135deg,#00a896 0%,#34c7a1 100%) !important;
}
#cupones .cupon-horizontal-v16 .etiqueta-mas-usado {
  background: linear-gradient(135deg,#0096c7 0%,#4361ee 100%) !important;
}
#cupones .cupon-horizontal-v16 .etiqueta-popular-integrada {
  background: linear-gradient(135deg,#ff3366 0%,#ff8c42 100%) !important;
}
#cupones .cupon-horizontal-v16 .etiqueta-mayor-ahorro {
  background: linear-gradient(135deg,#00a651 0%,#35c759 100%) !important;
}
#cupones .cupon-horizontal-v16 .etiqueta-top {
  background: linear-gradient(135deg,#f59e0b 0%,#facc15 100%) !important;
  color: #513300 !important;
  text-shadow: 0 1px 1px rgba(255,255,255,.35) !important;
}
#cupones .cupon-horizontal-v16 .etiqueta-nuevo {
  background: linear-gradient(135deg,#7b2ff7 0%,#3f72ff 100%) !important;
}

@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-etiquetas {
    gap: 4px !important;
  }
  #cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-cupon,
  #cupones .cupon-horizontal-v16 .hc16-etiquetas .etiqueta-popular-integrada {
    min-height: 19px !important;
    padding: 4px 7px !important;
    font-size: 7.2px !important;
    box-shadow: 0 2px 6px rgba(15,23,42,.14), inset 0 1px 0 rgba(255,255,255,.22) !important;
  }
}


/* ================================================================
   PAQUETE 7.5 — LOGOTIPO VISIBLE EN CUPONES EXCLUSIVOS
   Da mayor presencia a la marca configurada sin modificar los logos
   de cupones de tienda o bancarios.
   ================================================================ */
#cupones .cupon-horizontal-v16.cupon-exclusivo .hc16-logo {
  width: 100% !important;
  max-width: 150px !important;
  height: 60px !important;
  max-height: 60px !important;
  margin-bottom: 5px !important;
  object-fit: contain !important;
  object-position: left center !important;
}

#cupones > .cupon-horizontal-v16.cupon-exclusivo:not(.cupon-bancario) {
  grid-template-columns: 32% minmax(0, 1fr) 35% !important;
}

@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16.cupon-exclusivo .hc16-logo {
    max-width: 114px !important;
    height: 48px !important;
    max-height: 48px !important;
    margin-bottom: 3px !important;
  }
}

/* La imagen de marca de agua configurada por separado cubre el cupón
   exclusivo completo con una transparencia suave. */
#cupones .cupon-horizontal-v16.cupon-exclusivo {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
}

#cupones .cupon-horizontal-v16.cupon-exclusivo .hc16-marca-agua {
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
  user-select: none !important;
  opacity: .09 !important;
}

#cupones .cupon-horizontal-v16.cupon-exclusivo .hc16-marca-agua img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
  filter: grayscale(100%) !important;
}

#cupones .cupon-horizontal-v16.cupon-exclusivo > .hc16-valor,
#cupones .cupon-horizontal-v16.cupon-exclusivo > .hc16-info,
#cupones .cupon-horizontal-v16.cupon-exclusivo > .hc16-acciones {
  position: relative !important;
  z-index: 1 !important;
}


/* ================================================================
   PAQUETE 7.4 — $1,000 COMPLETO + CONTADOR POR INTERACCIÓN
   El importe largo usa un tamaño seguro dentro del 25% izquierdo en móvil.
   El cambio del contador se resuelve en JS: solo Copiar código / Ver ofertas.
   ================================================================ */
@media (max-width: 680px) {
  #cupones .cupon-horizontal-v16 .hc16-descuento.hc16-descuento-largo {
    font-size: clamp(20px, 5.7vw, 25px) !important;
    letter-spacing: -0.065em !important;
    gap: 1px !important;
    max-width: 100% !important;
    overflow: visible !important;
  }
}