/* Ajustes personalizados */
        .carousel-item {
            height: 100vh;
            /* Ocupa el 100% de la altura de la pantalla */
            overflow: hidden;
            /* Esconde cualquier desbordamiento */
        }

        .carousel-item img {
            width: 100%;
            /* Ocupa el 100% del ancho del contenedor */
            height: 100%;
            /* Ocupa el 100% de la altura del contenedor */
            object-fit: cover;
            /* Cubre el contenedor sin deformar la imagen */
            opacity: 0.9;

        }

        .carousel-item::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.5);
            /* Fondo negro semitransparente */
            z-index: 1;
            /* Coloca la capa encima de la imagen */
        }

        .carousel-item img {
            position: relative;
            z-index: 0;
            /* Imagen detrás de la capa oscura */
        }

        /* Asegura que el spinner ocupe toda la pantalla */
        .spinner-container {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            background-color: #fff; /* Fondo blanco, puedes cambiarlo */
            z-index: 9999; /* Asegura que esté por encima de todo */
        }

        /* Animación opcional para un desvanecimiento suave */
        .spinner-container.hidden {
            opacity: 0;
            transition: opacity 0.5s ease;
            pointer-events: none;
        }