.progress {
    background-color: #e9ecef;
    border-radius: 5px;
    overflow: hidden;
    height: 40px; /* Hauteur de la barre */
    position: relative;
}

.progress-bar {
    background-color: #886ab5; /* Couleur primaire du site */
    height: 100%;
    line-height: 40px; /* Alignement vertical du texte */
    color: white;
    font-weight: bold;
    font-size: 14px; /* Taille du texte pour qu'il soit plus lisible */
    position: relative;
    padding-left: 10px; /* Espacement du texte pour éviter le chevauchement avec l'icône */
}

.progress-text {
    position: relative;
    z-index: 2;
    text-align: left; /* Texte aligné à gauche */
    display: block;
    width: 100%;
}
.progress-icon {
    position: absolute;
    text-align: center;
    font-size: 25px; /* Taille de l'icône augmentée */
    z-index: 3;
    transition: left 0.4s ease-in-out;
    color: #353535 ; /* Couleur de l'icône */
}

.timer-container {
    position: fixed; /* Keeps it floating on the page */
    top: 20px; /* Adjust as needed */
    right: 20px; /* Adjust as needed */
    background-color: #886ab5; /* Purple background */
    color: white; /* Text color for contrast */
    padding: 10px 20px; /* Padding for spacing */
    border-radius: 10px; /* Rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Shadow for depth */
    z-index: 1000; /* Ensure it stays above other elements */
    text-align: center; /* Center the text */
    font-size: 1.2rem; /* Adjust font size */
}

.question-form .card {
    border: none;
    background-color: #f8f9fa;
}
.question-form .choice-label:hover {
    background-color: #e9ecef;
    cursor: pointer;
}
.question-form .btn {
    transition: background-color 0.3s ease;
}
.question-form .btn:hover {
    background-color: #28a745;
}
.question-attachment img.img-responsive {
    max-width: 100%;
    max-height: 300px;
    object-fit: contain;
    margin: 0 auto;
}
.question-form ul.list-unstyled li {
    margin-bottom: 5px !important;
}

.choice-label.dragging {
    background-color: rgb(0, 65, 122) !important;
    color: white !important;
    cursor: grabbing !important;
    transition: background-color 0.2s ease;
}
