/*
 * Combretin.ro - personalizare pagini de autentificare
 * (index.php, inregistrare.php, inregistrare_antrenor.php, recuperare.php)
 * Se incarca dupa app.min.css si suprascrie fundalul + panoul cu textul echipei.
 */

/* Fundal: poza cu echipa. "center 40%" tine fetele in cadru la ecrane inalte. */
.auth-fluid {
    background: url("../images/bg-auth-echipa.jpg") center 40% no-repeat;
    background-size: cover;
}

/*
 * Partea din dreapta: voal intunecat uniform, iar cardul cu text asezat spre
 * partea de jos, ca sa nu acopere fetele oamenilor din poza.
 */
.auth-fluid .auth-fluid-right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 3rem 2rem 3.5rem;
    background-color: rgba(12, 16, 26, .3);
}

/* Voal in degrade, mai puternic spre margini, ca sa iasa cardul in evidenta */
.auth-fluid .auth-fluid-right::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(90deg, rgba(10, 13, 22, .55) 0%, rgba(10, 13, 22, .18) 40%, rgba(10, 13, 22, .18) 60%, rgba(10, 13, 22, .55) 100%);
    pointer-events: none;
}

/*
 * Textul echipei: scos din pozitionarea absoluta (era lipit de jos si se
 * intindea peste toata poza) si pus intr-un card semitransparent.
 */
.auth-fluid .auth-user-testimonial {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    padding: 2.25rem 2.5rem;
    background-color: rgba(16, 20, 30, .62);
    -webkit-backdrop-filter: blur(9px);
    backdrop-filter: blur(9px);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 14px;
    -webkit-box-shadow: 0 18px 45px rgba(0, 0, 0, .38);
    box-shadow: 0 18px 45px rgba(0, 0, 0, .38);
    z-index: 1;
}

.auth-fluid .auth-user-testimonial h2 {
    font-size: 1.45rem;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: .2px;
    margin-bottom: 1.25rem !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .45);
}

.auth-fluid .auth-user-testimonial p.lead {
    font-size: .95rem;
    font-weight: 400;
    line-height: 1.75;
    max-width: 100%;
    text-align: left;
    color: rgba(255, 255, 255, .93);
    margin: 0 0 1.5rem 0 !important;
}

/* Ghilimelele decorative - discrete, nu concureaza cu textul */
.auth-fluid .auth-user-testimonial p.lead .mdi {
    font-size: 1.1rem;
    opacity: .5;
    vertical-align: -1px;
}

/* Semnatura, despartita printr-o linie fina */
.auth-fluid .auth-user-testimonial h5 {
    font-size: .8rem;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .8);
    margin: 0;
    padding-top: 1.15rem;
    border-top: 1px solid rgba(255, 255, 255, .14);
}

/* Ecrane intermediare (dar peste 992px, unde panoul e inca vizibil) */
@media (max-width: 1400px) {
    .auth-fluid .auth-user-testimonial {
        max-width: 560px;
        padding: 2rem 2rem;
    }

    .auth-fluid .auth-user-testimonial h2 {
        font-size: 1.3rem;
    }

    .auth-fluid .auth-user-testimonial p.lead {
        font-size: .9rem;
        line-height: 1.7;
    }
}

/*
 * Pe telefon / tableta tema ascunde panoul din dreapta si lasa doar formularul.
 * Regula de mai sus (display:flex) ar invinge-o, fiind incarcata ulterior,
 * asa ca o repunem explicit aici.
 */
@media (max-width: 991.98px) {
    .auth-fluid .auth-fluid-right {
        display: none;
    }
}