/* --- STEP LOGIC --- */

/* Nasconde tutte le domande di default */
.question-step {
    display: none;
}

/* Mostra lo step attivo sovrascrivendo d-none */
.question-step.active-step {
    display: block !important;
    animation: stepEntrance 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

/* Unica animazione combinata (Fade + Slide leggero) molto più fluida */
@keyframes stepEntrance {
    from {
        opacity: 0;
        transform: translateY(10px);
        /* Entra dal basso verso l'alto */
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- SIDEBAR LOGIC --- */

.sidebar-item {
    cursor: pointer;
    transition: all 0.2s ease;
    border-left: 4px solid transparent !important;
    text-overflow: ellipsis;
}

.sidebar-item:hover {
    background-color: var(--main-grey-100);
    text-decoration: none;
}

/* --- COMPLETED STATE (ANSWERED) --- */
.nav-link.answered-question,
.nav-link.answered {
    background-color: rgba(var(--main-green-rgb), 0.04) !important;
    border-left: 4px solid var(--main-green-color) !important;
}

.nav-link.answered-question .q-badge,
.nav-link.answered .q-badge {
    background-color: var(--main-green-color) !important;
    color: #fff !important;
    border-color: var(--main-green-color) !important;
}

/* --- EVALUATED STATE --- */
.nav-link.evaluated-question,
.nav-link.evaluated {
    background-color: rgba(var(--main-blue-rgb), 0.04) !important;
    border-left: 4px solid var(--main-blue-color) !important;
}

.nav-link.evaluated-question .q-badge,
.nav-link.evaluated .q-badge {
    background-color: var(--main-blue-color) !important;
    color: #fff !important;
    border-color: var(--main-blue-color) !important;
}

/* --- LOCKED STATE --- */
.nav-link.locked-question,
.nav-link.locked {
    opacity: 0.6;
    background-color: var(--main-grey-50);
    cursor: not-allowed !important;
}

.nav-link.locked-question .q-badge,
.nav-link.locked .q-badge {
    background-color: var(--main-grey-500) !important;
    color: #fff !important;
    border-color: var(--main-grey-500) !important;
}

.nav-link.locked-question .lock-icon,
.nav-link.locked .lock-icon {
    display: block !important;
}

.nav-link.locked-question .q-text,
.nav-link.locked .q-text {
    opacity: 0.5 !important;
}

/* --- ACTIVE / SELECTED STATE --- */
.nav-link.active-question {
    background-color: var(--main-orange-50) !important;
    color: var(--main-orange-color) !important;
    border-left: 4px solid var(--main-orange-color) !important;
    font-weight: 600;
}

.nav-link.active-question:not(.locked-question):not(.locked) .q-badge {
    background-color: var(--main-orange-color) !important;
    color: #fff !important;
    border-color: var(--main-orange-color) !important;
}

/* Active states combinations */
.nav-link.answered-question.active-question,
.nav-link.answered.active-question {
    background-color: rgba(var(--main-green-rgb), 0.08) !important;
    border-left: 4px solid var(--main-orange-color) !important;
}

.nav-link.evaluated-question.active-question,
.nav-link.evaluated.active-question {
    background-color: rgba(var(--main-blue-rgb), 0.08) !important;
    border-left: 4px solid var(--main-orange-color) !important;
}

.nav-link.locked-question.active-question,
.nav-link.locked.active-question {
    background-color: var(--main-grey-50) !important;
    color: var(--main-grey-color) !important;
    border-left: 4px solid var(--main-grey-color) !important;
    font-weight: 600;
}

.nav-link.locked-question.active-question .q-badge,
.nav-link.locked.active-question .q-badge {
    background-color: var(--main-grey-color) !important;
    color: #fff !important;
    border-color: var(--main-grey-color) !important;
}

/* --- REVISION / REOPENED STATE --- */
.nav-link.revision-question,
.nav-link.reopened {
    background-color: rgba(var(--main-yellow-rgb), 0.04) !important;
    border-left: 4px solid var(--main-yellow-color) !important;
}

.nav-link.revision-question .q-badge,
.nav-link.reopened .q-badge {
    background-color: var(--main-yellow-color) !important;
    color: #fff !important;
    border-color: var(--main-yellow-color) !important;
}

.nav-link.revision-question.active-question,
.nav-link.reopened.active-question {
    background-color: rgba(var(--main-yellow-rgb), 0.08) !important;
    border-left: 4px solid var(--main-orange-color) !important;
}

/* --- REVISION/WARNING ALERT STYLE --- */

.alert-preassessment-yellow {
    background-color: var(--main-yellow-50) !important;
    border: 1px solid var(--main-yellow-200) !important;
    border-left: 5px solid var(--main-yellow-color) !important;
    color: var(--main-yellow-900) !important;
    border-radius: 6px;
    padding: 1rem;
    box-shadow: 0 4px 12px rgba(var(--main-yellow-rgb), 0.05) !important;
}

.alert-preassessment-yellow h6 {
    color: var(--main-yellow-900) !important;
    font-weight: 700 !important;
}

.alert-preassessment-yellow p,
.alert-preassessment-yellow span,
.alert-preassessment-yellow strong,
.alert-preassessment-yellow small {
    color: var(--main-yellow-900) !important;
}

.alert-preassessment-yellow i {
    color: var(--main-yellow-700) !important;
}

/* --- REVISION/WARNING LOCKED STYLE --- */

.alert-preassessment-red {
    background-color: var(--main-red-50) !important;
    border: 1px solid var(--main-red-200) !important;
    border-left: 5px solid var(--main-red-color) !important;
    color: var(--main-red-900) !important;
    border-radius: 6px;
    padding: 1rem;
    box-shadow: 0 4px 12px rgba(var(--main-red-rgb), 0.05) !important;
}

.alert-preassessment-red h6 {
    color: var(--main-red-900) !important;
    font-weight: 700 !important;
}

.alert-preassessment-red p,
.alert-preassessment-red span,
.alert-preassessment-red strong,
.alert-preassessment-red small {
    color: var(--main-red-900) !important;
}

.alert-preassessment-red i {
    color: var(--main-red-700) !important;
}

/* --- REVISION FORM CONTAINER --- */

.revision-form-container {
    background-color: var(--main-yellow-50) !important;
    border: 1px dashed var(--main-yellow-300) !important;
    border-radius: 8px;
    padding: 1.25rem;
    box-shadow: 0 4px 12px rgba(var(--main-yellow-rgb), 0.03) !important;
}

.revision-form-container textarea {
    border: 1px solid var(--main-grey-300) !important;
    border-radius: 6px !important;
    padding: 0.75rem !important;
    font-size: 0.9rem !important;
    transition: all 0.2s ease-in-out !important;
    background-color: #fff !important;
    color: var(--main-grey-800) !important;
    width: 100%;
}

.revision-form-container textarea:focus {
    border-color: var(--main-yellow-color) !important;
    box-shadow: 0 0 0 3px rgba(var(--main-yellow-rgb), 0.15) !important;
    outline: none !important;
}