.lightbox-row {
    cursor: pointer;
  }
  
  .lightbox-row img {
    width: 100%;
    height: auto;
  }
  
  /* Estilos para que el cursor cambie a una mano al pasar sobre la imagen */
  .lightbox-row img:hover {
    cursor: pointer;
  }
  

  #lightboxModal .modal-dialog {
    max-width: 100vw;
    margin: 0;
    height: 100vh;
    z-index: 9999;
  }

  #lightboxModal .modal-content {
    max-width: 80vw;
    margin: 0;
    height: 90vh;
    background-color: rgb(44, 44, 44);
  }

  @media screen and (max-width: 768px) {
    #lightboxModal .modal-content {
      max-width: 100vw;
      margin: 0;
      height: 100vh;
      background-color: rgb(44, 44, 44);
    }
  }

  #lightboxModal .modal-body{
    overflow: hidden;
  }

  #lightboxCarousel .carousel-inner .carousel-item {
    max-height: calc(100vh - 110px); /* Elige el valor adecuado para evitar que la imagen sobrepase la altura de la pantalla */
  }

  #lightboxCarousel .carousel-inner .carousel-item img {
    object-fit: contain;
    max-height: 80vh;
    max-width: 100%;
    width: auto;
    height: auto;
  }

  .carousel-control-prev.control,
  .carousel-control-next.control{
    opacity: 0.4; /* Opacidad predeterminada */
  }
  
  .carousel-control-prev.control:hover,
  .carousel-control-next.control:hover {
    opacity: 0.8; /* Opacidad predeterminada */
  }

  .cursor-pointer {
    cursor: pointer;
  }

  #btnClose{
    color: white;
  }

  #btnClose:hover{
    color: #cd945c;
  }
