:root {
    --primary: #4338ca;
    --primary-dark: #312e81;
    --dark: #0f172a;
    --light: #f8fafc;
}

input, select, textarea { font-size: 16px !important; } /* iOS Zoom Fix */
body { 
    font-family: 'Inter', sans-serif; 
    background-color: var(--light); 
    background-image: radial-gradient(#cbd5e1 1px, transparent 1px);
    background-size: 24px 24px;
    min-height: 100vh; 
    min-height: 100dvh; /* Mobil klavye/adres çubuğu düzeltmesi */
    display: flex; 
    align-items: center; 
    justify-content: center; 
    position: relative;
    overflow: hidden;
    margin: 0;
    -webkit-app-region: drag; /* Masaüstü sürükleme alanı */
}

/* Butonlar, linkler ve form elemanları sürüklenmesin (tıklanabilsin) */
input, button, a, .login-card, .password-toggle { -webkit-app-region: no-drag; }

/* Modern Arka Plan Efektleri (Hareketli Blur Blobs) */
@keyframes float1 { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(30px, 20px) scale(1.05); } }
@keyframes float2 { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(-30px, -20px) scale(0.95); } }

.bg-blob-1 { position: absolute; top: -10vw; left: -10vw; width: 50vw; height: 50vw; background: linear-gradient(135deg, #e0e7ff 0%, #a5b4fc 100%); border-radius: 50%; filter: blur(80px); opacity: 0.8; z-index: -1; animation: float1 8s ease-in-out infinite; }
.bg-blob-2 { position: absolute; bottom: -10vw; right: -10vw; width: 40vw; height: 40vw; background: linear-gradient(135deg, #dcfce7 0%, #6ee7b7 100%); border-radius: 50%; filter: blur(80px); opacity: 0.6; z-index: -1; animation: float2 10s ease-in-out infinite; }

@keyframes slideUpFade { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } }

.login-card { 
    background: rgba(255, 255, 255, 0.95); 
    backdrop-filter: blur(10px);
    border-radius: 30px; 
    box-shadow: 0 30px 60px -12px rgba(67, 56, 202, 0.15), 0 0 0 1px rgba(255,255,255,0.5) inset; 
    padding: 50px 40px; 
    width: 100%; 
    max-width: 420px; 
    border: 1px solid rgba(255, 255, 255, 0.4);
    position: relative;
    z-index: 1;
    animation: slideUpFade 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes pulseGlow { 0% { box-shadow: 0 0 0 0 rgba(67, 56, 202, 0.4); } 70% { box-shadow: 0 0 0 15px rgba(67, 56, 202, 0); } 100% { box-shadow: 0 0 0 0 rgba(67, 56, 202, 0); } }

.brand-icon { 
    width: 75px; 
    height: 75px; 
    background: linear-gradient(135deg, var(--primary) 0%, #6366f1 100%); 
    color: white; 
    border-radius: 22px; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    font-size: 34px; 
    margin: 0 auto 24px auto; 
    box-shadow: 0 10px 25px rgba(67, 56, 202, 0.4);
    transform: rotate(-5deg);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    animation: pulseGlow 3s infinite;
}
.login-card:hover .brand-icon { transform: rotate(0deg) scale(1.1); box-shadow: 0 15px 35px rgba(67, 56, 202, 0.5); }

.form-control { 
    border-radius: 14px; 
    padding: 14px 18px 14px 45px; 
    border: 2px solid #e2e8f0; 
    background: #f8fafc; 
    font-weight: 500; 
    color: var(--dark);
    transition: all 0.3s ease;
    height: 52px; /* iOS hiza sorunu için sabit yükseklik verildi */
}
.form-control:focus { 
    border-color: var(--primary); 
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.02), 0 0 0 4px rgba(67, 56, 202, 0.15); 
    background: #fff;
    transform: translateY(-1px);
}

.input-icon-wrapper { position: relative; transition: all 0.3s ease; }
.input-icon-wrapper:focus-within .input-icon { color: var(--primary); transform: scale(1.1); }

/* translateY yerine %100 yükseklik esnek kutu modeli (iOS Göz Simgesi Fixi) */
.input-icon { position: absolute; left: 18px; top: 0; bottom: 0; display: flex; align-items: center; color: #94a3b8; font-size: 1.1rem; z-index: 5; transition: all 0.3s ease; pointer-events: none; }

.password-toggle { position: absolute; right: 5px; top: 0; bottom: 0; display: flex; align-items: center; justify-content: center; padding: 0 15px; color: #94a3b8; cursor: pointer; z-index: 10; transition: color 0.2s; font-size: 1.1rem; margin: 0; }
.password-toggle:hover, .password-toggle:active { color: var(--primary); }

/* İşletim sistemlerinin kendi varsayılan göz simgelerini gizler (Üst üste binmeyi önler) */
input[type="password"]::-ms-reveal, input[type="password"]::-ms-clear { display: none; } 
input[type="password"] { -webkit-appearance: none; appearance: none; }

.btn-login { 
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%, var(--primary) 200%); 
    background-size: 200% auto;
    border: none; 
    border-radius: 14px; 
    padding: 14px; 
    font-weight: 700; 
    color: white; 
    font-size: 1.1rem;
    transition: all 0.4s ease;
    box-shadow: 0 4px 15px rgba(67, 56, 202, 0.2);
}
.btn-login:hover { 
    background-position: right center;
    transform: translateY(-3px); 
    box-shadow: 0 10px 25px rgba(67, 56, 202, 0.4); 
    color: white;
}
.btn-login:active {
    transform: translateY(1px);
    box-shadow: 0 2px 10px rgba(67, 56, 202, 0.3);
}

.alert-custom {
    background-color: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
    border-radius: 12px;
    font-weight: 600;
}

.back-link {
    display: inline-block;
    margin-top: 20px;
    color: #64748b;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.9rem;
    transition: color 0.2s;
}
.back-link:hover { color: var(--primary); }

@media (max-width: 576px) {
    .login-card { padding: 30px 20px; border-radius: 24px; margin: 0 15px; width: calc(100% - 30px); }
    .brand-icon { width: 60px; height: 60px; font-size: 28px; margin-bottom: 20px; }
    .form-control { padding: 12px 16px 12px 40px; font-size: 15px !important; }
    .input-icon { left: 15px; }
    .btn-login { padding: 12px; font-size: 1.05rem; }
}
/* Masaüstü uygulamasında (Electron) "Ana Sayfaya Dön" butonunu gizle */
body.is-electron .text-center:has(.back-link),
body.is-electron .back-link {
    display: none !important;
}