/* ============================================================
   Auth split-screen düzeni
   Sol panel = form, sağ panel = sabit görsel (UstumuzeVazife.webp),
   arada kırmızı dikey ayraç. Tüm auth ekranları _LoginLayout
   üzerinden bu düzeni kullanır.
   ============================================================ */

body {
    background: #fff;
}

.auth-split {
    display: flex;
    min-height: 100vh;
}

/* Sol: form paneli */
.auth-split__form {
    flex: 1 1 50%;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    background: #fff;
}

/* İçerik dikeyde ortalanır AMA panelden uzunsa (örn. Kayıt formu) üstten itibaren
   kaydırılabilir kalır. align-items/justify-content:center taşan içeriğin üstünü
   kırpıp scroll'u engellerdi; margin:auto bu sorunu çözer. */
.auth-split__form > * {
    flex: 0 0 auto;
    width: 100%;
    margin: auto;
}

/* Sağ: sabit görsel + kırmızı ayraç */
.auth-split__visual {
    flex: 1 1 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-left: 3px solid var(--vkv-red);
}

.auth-split__visual img {
    max-width: 60%;
    max-height: 80%;
    object-fit: contain;
}

/* İç kartların yarım panele sığması (width:Npx!important'ı max-width ile kısıtlarız) */
.auth-split__form .bg-body {
    width: 100%;
    max-width: 770px;
}

.auth-split__form .w-md-700px {
    max-width: 600px;
}

.auth-split__form .w-md-800px {
    max-width: 680px;
}

/* Mobil / dar ekran: görseli gizle, form tam genişlik */
@media (max-width: 992px) {
    .auth-split {
        flex-direction: column;
    }

    .auth-split__visual {
        display: none;
    }

    .auth-split__form {
        flex: 1 1 auto;
        min-height: 100vh;
    }

    .auth-split__form .bg-body,
    .auth-split__form .w-md-700px,
    .auth-split__form .w-md-800px {
        max-width: 100%;
    }
}
