/*Fondo Secciones Inicio Sesion*/
/* Fondo de la Inicio Sesion */
.fondo_sectionlogin {
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: hidden;

    background:
        linear-gradient(
            to right,
            rgba(0, 0, 0, 0) 27%,
            rgba(0, 0, 0, 0.4) 38%,
            rgba(0, 0, 0, 0.75) 46%,
            #000 55%,
            #000 100%
        ),
        url('../images/secciones_home/fondo_sectionlogin.webp');

    background-repeat: no-repeat;
    background-size: calc(100% + 10px) 100%;
    background-position: right center;
}

.fondo_sectionlogin::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .1);
    z-index: 1;
}

.fondo_sectionlogin > * {
    position: relative;
    z-index: 2;
}

/* Tablets: la columna de la tarjeta (col-md-5) sigue siendo parcial,
   el gradiente horizontal todavía funciona, solo lo adelantamos un poco */
@media (max-width: 992px) {
    .fondo_sectionlogin {
        background:
            linear-gradient(
                to right,
                rgba(0, 0, 0, 0) 10%,
                rgba(0, 0, 0, 0.5) 25%,
                rgba(0, 0, 0, 0.85) 40%,
                #000 55%,
                #000 100%
            ),
            url('../images/secciones_home/fondo_sectionlogin.webp') !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
        background-position: right center !important;
    }
}

/* Celulares grandes / tablets pequeñas: la columna ya es col-12,
   pasamos a overlay vertical uniforme */
@media (max-width: 768px) {
    .fondo_sectionlogin {
        background:
            linear-gradient(
                to bottom,
                rgba(0, 0, 0, 0.65) 0%,
                rgba(0, 0, 0, 0.85) 100%
            ),
            url('../images/secciones_home/fondo_sectionlogin.webp') !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
        background-position: 70% center !important;
    }
}

/* Móvil */
@media (max-width: 576px) {
    .fondo_sectionlogin {
        background:
            linear-gradient(
                to bottom,
                rgba(0, 0, 0, 0.75) 0%,
                rgba(0, 0, 0, 0.92) 100%
            ),
            url('../images/secciones_home/fondo_sectionlogin.webp') !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
        background-position: 75% center !important;
    }

    .fondo_sectionlogin .container {
        margin-top: 4rem !important;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .fondo_sectionlogin .row {
        justify-content: center !important;
    }

    .fondo_sectionlogin .card-body {
        padding: 2rem !important;
    }
}