/* wizard */

/* ajustes generales */

/* contenedor principal */
.wizard-base .ui-wizard-content {
    margin: 1rem 0 !important;
}

/* contenedor de botones steps */
.wizard-base .ui-wizard-step-titles {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

/* boton step */
.wizard-base .ui-wizard-step-title {
    min-width: 7rem !important;
    border-radius: .5rem !important;
    text-align: center;
    padding: 0.5rem 1rem !important;
}

@media(max-width: 640px){
    .wizard-base .ui-wizard-step-titles{
        flex-direction: column;
    }
}

/* ajustes especificos */

.wizard-lightblue .ui-wizard-step-title{
    color: var(--color-white-bold) !important;
    background-color: var(--color-light-grey) !important;
    border: 1px solid var(--color-light-grey) !important;
}

/* step activo */
.wizard-lightblue .ui-wizard-step-title.ui-state-highlight {
    border: 1px solid var(--color-lightblue) !important;
    background-color: var(--color-lightblue) !important;
    color: var(--color-white-bold) !important;
}

/* botones de avanzar y retroceder de step */

.wizard-base .ui-wizard-nav-next,
.wizard-base .ui-wizard-nav-back{
    font-size: 1rem !important;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.05rem;
    border: 0 !important;
    border-radius: 3rem !important;
    padding: 0.5rem 1rem !important;
    box-shadow: 3px 4px 4px 0 #00000026;
    width: fit-content;
    height: fit-content;
    transition: transform 0.25s ease !important;
}

.wizard-base .ui-wizard-nav-next:hover,
.wizard-base .ui-wizard-nav-back:hover{
    transform: scale(1.03);
}

.wizard-base .ui-wizard-nav-next:focus,
.wizard-base .ui-wizard-nav-back:focus{
    outline: none !important;
    border: none !important;
}

.wizard-lightblue .ui-wizard-nav-next,
.wizard-lightblue .ui-wizard-nav-back {
    background: var(--color-lightblue) !important;
    color: var(--color-white-bold) !important;
    border: none !important;
}