/* ==== Auth ortak (forgot/reset dahil) — varsayılan açık tema ==== */
body#kt_app_body[data-kt-app-layout="auth"] {
    background-color: #f5f8fa;
}

#kt_sign_in_form .form-label {
    letter-spacing: .1px;
}

/* Submit indicator (tüm auth formları için ortak) */
#kt_sign_in_submit[data-kt-indicator="on"] .indicator-label { display: none; }
#kt_sign_in_submit[data-kt-indicator="on"] .indicator-progress { display: inline-block; }
#kt_sign_in_submit .indicator-progress { display: none; }


/* ==========================================================================
   LOGIN — split-screen profesyonel tasarım
   Tüm kurallar :has(.auth-aside) ile yalnızca login sayfasına kapsanır;
   forgot/reset aynı CSS'i yüklese de etkilenmez.
   ========================================================================== */
/* Tam ekran koyu lacivert sahne. Harmanlama yok; sağdaki form beyaz,
   yuvarlatılmış, gölgeli bir kart olarak bu zeminin üstünde "yüzer".
   Böylece kenar kasıtlı görünür — ham dikiş/glare olmaz. */
body#kt_app_body[data-kt-app-layout="auth"]:has(.auth-aside) {
    background:
        radial-gradient(1100px 720px at 22% 28%, #18294a 0%, transparent 58%),
        radial-gradient(900px 600px at 85% 80%, #122036 0%, transparent 55%),
        linear-gradient(135deg, #0b1426 0%, #0a1120 55%, #070d18 100%);
}

/* --- Sol marka paneli (3B sahne) --- */
/* şeffaf zemin: ortak gövde gradient'i görünür. Sadece derinlik için
   yumuşak renk parıltıları eklenir. */
.auth-aside {
    background:
        radial-gradient(900px 520px at 14% 16%, rgba(0, 158, 247, .15), transparent 60%),
        radial-gradient(700px 460px at 26% 86%, rgba(79, 107, 255, .12), transparent 58%);
}

/* 3B sahne tüm ekranı kaplar (fixed); branding ve form üstünde durur */
.auth-aside #kt_login_bg {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    display: block;
    z-index: 0;
}

.auth-aside,
.auth-aside__inner {
    position: relative;
    z-index: 1;
}

/* form sütunu da 3B sahnenin üstünde (fixed canvas'ı kapatmasın diye) */
body[data-kt-app-layout="auth"]:has(.auth-aside) .d-flex.flex-center.w-lg-50 {
    position: relative;
    z-index: 1;
}


.auth-aside__content {
    max-width: 460px;
    color: #fff;
    animation: kt-fade-up .8s cubic-bezier(.2, .8, .2, 1) both;
}

.auth-aside__title {
    color: #fff;
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1rem;
    letter-spacing: -.3px;
}

.auth-aside__lead {
    color: rgba(226, 236, 255, .72);
    font-size: 1.05rem;
    line-height: 1.7;
    margin-bottom: 1.75rem;
}

.auth-aside__features {
    list-style: none;
    padding: 0;
    margin: 0;
}
.auth-aside__features li {
    display: flex;
    align-items: center;
    gap: .65rem;
    color: rgba(226, 236, 255, .85);
    font-size: .95rem;
    font-weight: 500;
    padding: .5rem 0;
}
.auth-aside__features li i { color: #2cc1a6; }

/* Marka rozeti (panel başı) */
.login-brand-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 16px;
    background: linear-gradient(135deg, #009ef7 0%, #4f6bff 100%);
    box-shadow: 0 14px 34px rgba(0, 158, 247, .45);
    color: #fff;
}
.login-brand-badge i { color: #fff; }

/* --- Sağ form tarafı: koyu zemin üstünde yüzen cam (glass) kart --- */
body[data-kt-app-layout="auth"]:has(.auth-aside) .card {
    background: rgba(15, 25, 45, 0.55);
    backdrop-filter: blur(22px) saturate(160%);
    -webkit-backdrop-filter: blur(22px) saturate(160%);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 1.25rem;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .06),
        0 40px 90px -20px rgba(7, 13, 24, .60);
    animation: kt-fade-up .7s cubic-bezier(.2, .8, .2, 1) both;
}

.login-form-head { text-align: left; }

.login-eyebrow {
    display: inline-block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: 2px;
    color: #009ef7;
    margin-bottom: .85rem;
}

.login-title {
    color: #ffffff;
    font-weight: 700;
    font-size: 1.9rem;
    letter-spacing: -.4px;
    margin-bottom: .4rem;
}
.login-subtitle { color: rgba(226, 236, 255, .55); font-size: 1rem; }
.login-eyebrow { color: #4cb6ff; }

/* Etiketler (twig'deki text-dark sınıfını ezeriz) */
body[data-kt-app-layout="auth"]:has(.auth-aside) #kt_sign_in_form .form-label {
    color: rgba(226, 236, 255, .82) !important;
}

/* Form alanları — koyu cam karta uygun */
body[data-kt-app-layout="auth"]:has(.auth-aside) #kt_sign_in_form .form-control {
    background: rgba(255, 255, 255, .05) !important;
    border: 1px solid rgba(255, 255, 255, .12);
    color: #fff;
    padding: .85rem 1rem;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
body[data-kt-app-layout="auth"]:has(.auth-aside) #kt_sign_in_form .form-control::placeholder {
    color: rgba(255, 255, 255, .35);
}
body[data-kt-app-layout="auth"]:has(.auth-aside) #kt_sign_in_form .form-control:focus {
    background: rgba(255, 255, 255, .08) !important;
    border-color: #009ef7;
    box-shadow: 0 0 0 .2rem rgba(0, 158, 247, .18);
    color: #fff;
}
/* tarayıcı otomatik-doldurma beyaz kutusunu engelle */
body[data-kt-app-layout="auth"]:has(.auth-aside) #kt_sign_in_form .form-control:-webkit-autofill,
body[data-kt-app-layout="auth"]:has(.auth-aside) #kt_sign_in_form .form-control:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff;
    caret-color: #fff;
    transition: background-color 9999s ease-in-out 0s;
    box-shadow: 0 0 0 1000px rgba(20, 30, 51, .92) inset;
}

/* Submit — gradient, premium */
body[data-kt-app-layout="auth"]:has(.auth-aside) #kt_sign_in_submit {
    background: linear-gradient(135deg, #009ef7 0%, #4f6bff 100%);
    border: none;
    padding: .9rem 1rem;
    font-weight: 600;
    box-shadow: 0 12px 26px rgba(0, 158, 247, .32);
    transition: transform .12s ease, box-shadow .15s ease;
}
body[data-kt-app-layout="auth"]:has(.auth-aside) #kt_sign_in_submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 32px rgba(0, 158, 247, .45);
}

@keyframes kt-fade-up {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    body[data-kt-app-layout="auth"]:has(.auth-aside) .card,
    .auth-aside__content { animation: none; }
}