/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/
/* Show input number at right alignment */
[data-number='1'] {
    text-align: left;
}

.logo-container>img {
    padding: 0;
} /* Le quita el padding a la imagen del logo */

.progress {
    position: absolute;
    top: calc(2vh + 5%);
}/* Posicion del contenedor y de la barra de progreso en mobil */

.progress-bar {
    position: fixed;
    height: 4vh;
    margin: 0 -1vw 0 -1vw;
    padding: 0;
    z-index: 3000;
    line-height: 4vh !important;
}/* Control de la barra de progreso en mobil */

@media (min-width:768px){
    .progress {
        position: absolute;
        top: calc(11.5vw - 0.005%);
    }/* Posicion del contenedor y de la barra de progreso en escritorio */

    .progress-bar {
        position: fixed;
        height: 4vh;
        margin: 0 -1vw 0 -1vw;
        padding: 0;
        z-index: 3000;
        line-height: 4vh !important;
    }/* Control de la barra de progreso en escritorio */
}


#sortable-rank-9556.sortable-rank.sortable-list.list-group { 
    color: red;
}


/* Ajustar imagen responsiva dentro del contenedor en pantallas pequeñas */
@media only screen and (max-width: 767px) {
    .navbar.navbar-default.navbar-fixed-top .navbar-header .navbar-brand.logo-container.hidden-xs {
        display: block !important;  /* Asegura que el contenedor se muestre */
        width: 100%;  /* Usa todo el ancho disponible */
        height: auto; /* Permite que la altura se ajuste automáticamente */
        padding: 0;   /* Elimina padding para que la imagen ocupe todo el espacio */
    }

    .navbar.navbar-default.navbar-fixed-top .navbar-header .navbar-brand.logo-container img {
        width: 100%;        /* Asegura que la imagen cubra todo el ancho */
        height: auto;       /* Mantiene la proporción de la imagen */
        max-width: 100%;    /* Asegura que la imagen no se salga del contenedor */
        max-height: 100%;   /* Asegura que la imagen no se corte verticalmente */
        object-fit: contain;  /* Mantiene la imagen dentro del contenedor sin recortarla */
        object-position: center; /* Centra la imagen en el contenedor */
    }

    /* Ajustar la altura del contenedor para que sea flexible */
    .navbar-brand {
        height: auto !important; /* Permite que la altura del contenedor se ajuste según el contenido */
        min-height: auto;        /* Elimina cualquier restricción mínima de altura */
    }
}


/*con esto lo que hacemos es eliminar la opcion hidden del Bootstrap y evitamos que desaparezca el logo en celular*/