/*---------------------------------------------------------------------------------------------------------------
   AUTOR          : DIEGO BUSTOS PEÑA
   FECHA CREACIÓN : 09-06-2026
   DESCRIPCIÓN    : CSS DE LOS BOTONES
----------------------------------------------------------------------------------------------------------------*/

/* BOTÓN CTA */
.btn-comenzar {
    background : linear-gradient(
        90deg,
        #1a6fb5 0%,
        #0d2b5e 100%
    );
    color         : #fff;
    font-size     : 1.1rem;
    font-weight   : 600;
    border        : none;
    border-radius : var(--uct-radius-btn);
    padding       : .85rem 2rem;
    width         : 100%;
    min-height    : 100px;
    transition    : all .2s ease;
}

.btn-comenzar:hover {
    filter    : brightness(1.12);
    transform : translateY(-1px);
    color     : #fff;
}

/* CONTINUAR */
.btn-continuar {
    background-color : var(--uct-navy);
    color            : #fff;
    border           : none;
    border-radius    : 14px;
    padding          : .95rem 2rem;
    font-weight      : 700;
    font-size        : 1rem;
    min-width        : 180px;
    transition       : all .2s ease;
}

.btn-continuar:hover {
    filter    : brightness(1.15);
    transform : translateY(-1px);
    color     : #fff;
}

/* BACK */
.btn-back {
    background    : transparent;
    border        : 2px solid var(--uct-border);
    color         : #556;
    padding       : .65rem 1.4rem;
    font-size     : .9rem;
    font-weight   : 600;
    border-radius : var(--uct-radius-btn);
    transition    : all .2s ease;
}

.btn-back:hover {
    border-color : var(--uct-blue);
    color        : var(--uct-blue);
}

/* GUARDAR */
.btn-guardar {
    background-color : #28a745;
    color            : #fff;
    border           : none;
    border-radius    : var(--uct-radius-btn);
    padding          : .75rem 1.5rem;
    font-size        : .95rem;
    font-weight      : 600;
    transition       : all .2s ease;
    box-shadow       : 0 4px 12px rgba(40,167,69,.18);
}

.btn-guardar:hover {
    background-color : #218838;
    transform        : translateY(-1px);
}

/* ESTADOS DISABLED - BOTONES */
button:disabled,
.btn:disabled,
.btn-continuar:disabled,
.btn-guardar:disabled,
.btn-back:disabled,
.btn-instructivo:disabled,
.btn-captcha:disabled,
.btn-captcha-refresh:disabled {
    opacity        : .55;
    cursor         : not-allowed;
    filter         : grayscale(.15);
    transform      : none !important;
    box-shadow     : none !important;
    pointer-events : none;
    transition     : all .2s ease;
}

/* BOTONES PRINCIPALES DISABLED */
.btn-continuar:disabled,
.btn-guardar:disabled {
    background : #b8c2cf !important;
    color      : #eef2f7 !important;
    border     : none;
}

/* BOTONES SECUNDARIOS DISABLED */
.btn-back:disabled {
    background   : #eef2f7 !important;
    border-color : #d5dde7 !important;
    color        : #94a3b8 !important;
}

/* BOTONES CAPTCHA DISABLED */
.btn-captcha:disabled,
.btn-captcha-refresh:disabled {
    background : #cbd5e1 !important;
    color      : #f8fafc !important;
}

/* EVITAR EFECTOS HOVER EN DISABLED  */
button:disabled:hover,
.btn:disabled:hover {
    transform  : none !important;
    box-shadow : none !important;
    filter     : none !important;
}

button:disabled i,
.btn:disabled i {
    opacity : .7;
}