@charset "utf-8";
/* CSS Document */

.mod-modal-cards {
	background: white;
}
.contenido-galeria .col-img img {
	    height: 100% !important;
}

.contenido-galeria .col-img:hover img {
    -webkit-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.contenido-galeria .col-img img {
    -webkit-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
}
.contenido-galeria .col-img {
	overflow: hidden;
}
.contenido-galeria .col-img:hover img {
    -webkit-box-shadow: none;
    box-shadow: none;
}
:not(.about-wrapper)> .contenido-galeria .row:not(.panel-body)  .col-xl-3 {
        margin-top: 0px !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
}
.contenido-galeria .row {
	gap: 10px;
}
aside.box-with-title {
	padding-top: 0px !important;
        margin-top: 0 !important;
}

    .fixed-tickets-sales .countdown .number {
        font-size: 2rem;
        line-height: 2rem;
    }
.modal-open .modal {
    background: rgb(0,0,0,0.6);
}

.hero-banner-slick .hero-banner-slider .container .hero-banner-title {
  background-color: #000000a3;
  margin-left: -40px;
  padding: 10px 10px 0 40px;
  max-width: fit-content;
}
@media (min-width: 768px) {
    .contenido-galeria .col-md-4 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 calc(33.33333% - 10px);
        -ms-flex: 0 0 calc(33.33333% - 10px);
        flex: 0 0 calc(33.33333% - 10px);
        max-width: calc(33.33333% - 10px);
    }
}
@media (min-width: 1440px) {
   .contenido-galeria .col-xl-3 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 calc(25% - 10px);
        -ms-flex: 0 0 calc(25% - 10px);
        flex: 0 0 calc(25% - 10px);
        max-width: calc(25% - 10px);
    }
}
@media (max-width: 768px) {
    .contenido-galeria .col-sm-6 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 calc(50% - 10px);
        -ms-flex: 0 0 calc(50% - 10px);
        flex: 0 0 calc(50% - 10px);
        max-width: calc(50% - 10px);
    }
}
     /* HOTFIXES */

@supports (-webkit-touch-callout: none) {

  /* 1. Neutralizar aspect-ratio en contenedores de cards */
  .mod-modal-cards .modal-card-container,
  .mod-modal-cards .modal-card,
  .mod-modal-cards [class*="card"] {
    aspect-ratio: auto !important;
    height: auto !important;
    min-height: auto !important;
  }

  /* 2. Forzar flujo vertical estable (evita solapes) */
  .mod-modal-cards,
  .mod-modal-cards .cards,
  .mod-modal-cards .listing {
    display: flex !important;
    flex-direction: column !important;
  }

  /* 3. Desactivar comportamientos peligrosos en mobile iOS */
  .mod-modal-cards * {
    transform: none !important;
  }

  /* 4. Evitar absolute en contenidos internos de cards */
  .mod-modal-cards .modal-card-container *,
  .mod-modal-cards .modal-card * {
    position: static !important;
  }

  /* 5. Imágenes: asegurar que definen altura correctamente */
  .mod-modal-cards img,
  .mod-modal-cards picture,
  .mod-modal-cards picture img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
  }

  /* 6. Prevenir colapsos por overflow */
  .mod-modal-cards .modal-card-container,
  .mod-modal-cards .modal-card {
    overflow: visible !important;
  }

  /* 7. Grid → comportamiento seguro en iOS */
  .mod-modal-cards [style*="grid"],
  .mod-modal-cards .grid {
    grid-auto-rows: auto !important;
  }

  /* 8. Separación explícita entre cards */
  .mod-modal-cards .modal-card,
  .mod-modal-cards .modal-card-container {
    margin-bottom: 16px !important;
  }

}


@supports (-webkit-touch-callout: none) {

  /* -------- RESET CRÍTICO DE ALTURAS -------- */
  .mod-modal-cards,
  .mod-modal-cards * {
    box-sizing: border-box;
  }

  .mod-modal-cards .modal-card,
  .mod-modal-cards .modal-card-container {
    aspect-ratio: auto !important;
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
  }

  /* -------- CONTENEDOR PRINCIPAL -------- */
  .mod-modal-cards .listing,
  .mod-modal-cards .cards {
    display: grid !important;
    grid-auto-rows: auto !important;
    align-items: stretch !important;
  }

  /* -------- 2 COLUMNAS (como la captura) -------- */
  @media (min-width: 541px) {
    .mod-modal-cards .listing,
    .mod-modal-cards .cards {
      grid-template-columns: 1fr 1fr !important;
      gap: 16px !important;
    }
  }

  /* -------- 1 COLUMNA < 540px -------- */
  @media (max-width: 540px) {
    .mod-modal-cards .listing,
    .mod-modal-cards .cards {
      grid-template-columns: 1fr !important;
      gap: 16px !important;
    }
  }

  /* -------- CARDS: FLUJO VERTICAL ESTABLE -------- */
  .mod-modal-cards .modal-card {
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
  }

  /* -------- CONTENIDO INTERNO -------- */
  .mod-modal-cards .modal-card * {
    position: static !important;
    transform: none !important;
  }

  /* -------- IMÁGENES -------- */
  .mod-modal-cards img,
  .mod-modal-cards picture,
  .mod-modal-cards picture img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
  }
@supports (-webkit-touch-callout: none) {

  /* Restaurar el contexto de posicionamiento SOLO donde hace falta */
  .mod-modal-cards .modal-card-link {
    position: relative !important;
  }

  /* Reposicionar la flecha según diseño */
  .mod-modal-cards .modal-card-link::before,
  .mod-modal-cards .modal-card-link::after {
    top: 50% !important;
    transform: translateY(-50%) rotate(45deg) !important;
    right: 6px !important;
  }

  .mod-modal-cards .modal-card-link::before {
    width: 2px !important;
    height: 18px !important;
    background-color: #000 !important;
  }

  .mod-modal-cards .modal-card-link::after {
    border-right: 2px solid currentColor !important;
    border-bottom: 2px solid currentColor !important;
    width: 12px !important;
    height: 12px !important;
  }
}
@supports (-webkit-touch-callout: none) {
	 /* Aseguramos que la propia card-link es el contenedor relativo */
  .mod-modal-cards .modal-card-link {
    position: relative !important;
    padding-right: 24px !important; /* espacio para la flecha */
  }

  /* Palo vertical (barra recta) */
  .mod-modal-cards .modal-card-link::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    right: 10px !important;
    width: 2px !important;
    height: 14px !important;
    background-color: currentColor !important;
    transform: translateY(-50%) !important; /* sin rotación */
  }

  /* Check diagonal (la parte inclinada) */
  .mod-modal-cards .modal-card-link::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;

  right: 6px !important;    
  width: 11px !important;   
  height: 11px !important;

  border-right: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;

  transform: translateY(-50%) rotate(45deg) !important;
}
	}


  
	@media (max-width: 500px) {
    .mod-modal-cards .slider:not(.slick-initialized) .modal-card {
        -webkit-flex-basis: 100%;
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%!important;
        max-width: 100%!important;
    }
}

.ticket-card .price-wrapper {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin-top: 0;
    padding: 0 0 0 8px;
    min-height: auto;
    max-width: 45%!important;
    overflow: visible;
    text-align: center!important;
}
	.ticket-card .title span {

    font-size: 1rem!important;

}