/* =====================================================================
   GİRİŞ TERMİNALİ
   ---------------------------------------------------------------------
   panel.css'in üzerine yüklenir; yalnızca giriş ekranına özgü yerleşimi
   tanımlar. Renkler, butonlar, form alanları ve uyarılar panel.css'ten
   gelir; böylece giriş ekranı panelle birebir aynı dili konuşur.
   ===================================================================== */

/* Giriş ekranında menü/altbilgi yoktur: kart tek kaydırma alanında
   dikeyde ortalanır. İç sarmalayıcı min-height:100% ile büyüdüğü için
   içerik sığmadığında üstten kırpılmaz. */
.login {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}

.login-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100%;
    padding: clamp(20px, 4vw, 48px) clamp(16px, 4vw, 40px);
}

.login-card {
    width: 100%;
    max-width: 430px;
    padding: clamp(24px, 3vw, 34px);
    background: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .03));
    border: 1px solid var(--line);
    border-radius: var(--radius-xl);
    box-shadow: var(--lift-3);
}

/* --------------------------- Başlık --------------------------- */
.login-head {
    text-align: center;
    margin-bottom: 22px;
}

.login-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 16px;
    color: var(--key-ink);
    background: linear-gradient(160deg, var(--key-2), var(--key));
    border-radius: 15px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .22),
                0 14px 30px -16px rgba(56, 189, 248, .9);
    font-size: 22px;
}

.login-head .eyebrow {
    display: block;
    margin-bottom: 7px;
    color: var(--key-2);
    font-size: 11.5px;
    font-weight: 650;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.login-head h1 {
    font-size: clamp(20px, 2.4vw, 25px);
    letter-spacing: -.025em;
}

.login-head p {
    margin-top: 8px;
    color: var(--ink-2);
    font-size: 13.5px;
}

/* --------------------------- Form --------------------------- */
.login-card .alert-stack { margin-bottom: 18px; }

.login-card form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.field label {
    display: block;
    margin-bottom: 7px;
    font-size: 13.5px;
    font-weight: 600;
}

/* Alan içi ikon */
.field-icon {
    position: relative;
    display: flex;
    align-items: center;
}

.field-icon > i {
    position: absolute;
    left: 15px;
    color: var(--ink-3);
    font-size: 14px;
    pointer-events: none;
}

.field-icon input { padding-left: 42px; }

.field-icon:focus-within > i { color: var(--key-2); }

/* Şifre göster/gizle */
.field-icon input[type="password"],
.field-icon input#password { padding-right: 78px; }

.toggle {
    position: absolute;
    right: 7px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 0 12px;
    color: var(--ink-2);
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: var(--radius-pill);
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    transition: color var(--fast) var(--ease), background var(--fast) var(--ease);
}

.toggle:hover {
    color: var(--ink);
    background: var(--surface-3);
}

/* Caps Lock uyarısı */
.caps-hint {
    display: none;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    color: var(--warn-ink);
    font-size: 12.5px;
}

.caps-hint.is-on { display: flex; }
.caps-hint i { color: var(--warn); }

.login-card .btn { margin-top: 4px; }

/* --------------------------- Altbilgi --------------------------- */
.login-foot {
    margin-top: 22px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
    color: var(--ink-3);
    font-size: 12px;
    text-align: center;
    letter-spacing: .03em;
}

.login-foot b {
    color: var(--ink-2);
    font-weight: 600;
}

@media (max-width: 720px) {
    .login { overflow: visible; }

    .login-inner { min-height: 100dvh; }

    .login-card {
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background: transparent;
        padding: 0;
    }
}
