html, body {
 margin: 0;
 height: 100%; /* Asegurarse de que el cuerpo tenga un alto completo */
}

.wrapper {
 --padding: 0.5rem;
 height: calc(100vh - var(--padding) * 2);
 display: flex;
 flex-direction: column;
 gap: 0.5rem;
 padding: var(--padding);
}

#fitmix-container {
 width: 100%; /* Ajustar el ancho para que sea más flexible */
 max-width: 500px; /* Mantener un ancho máximo */
 flex: 1;
 /* display: none; Inicialmente oculto */
 margin: 0 auto; /* Centrar el contenedor */
}

#loading-spinner {
    text-align: center;
    padding: 20px;
    font-size: 18px;
    color: #333;
}


/* PRUEBA VIRTUAL CACTUS */
.prueba-virtual-loop[data-prueba=""] {display: none !important;}
.trigger_prueva_virtual{cursor: pointer;}
#prueba_virtual_popup{display: none;}
#prueba_virtual_popup .popup{position: fixed;top: 0;right: 0;left: 0;margin: auto;background: white;padding: 2em;width: fit-content;max-width: 100%;z-index: 999;bottom: 0;height: fit-content;}
#prueba_virtual_popup .bg-absolute-black{background: rgba(0,0,0,0.4); position: fixed;top: 0px; left: 0px; z-index: 999; width: 100%; height: 100%; }
#prueba_virtual_popup #fitmix-container{height: 70vh; width: 50vw;}
#prueba_virtual_popup .close-popup{position: absolute; top: -48px; right: 0px; width: 24px; filter: invert(1); cursor: pointer;}