/*
 * auth-responsive.css
 * -------------------
 * Giriş / kayıt / şifre sayfaları (bağımsız, Layout=null) için mobil sertleştirme.
 * Vendor CSS'in üzerine yüklenir; yalnızca taşma ve dokunma hedefi düzeltmeleri.
 */

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

*, *::before, *::after {
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
}

/* Giriş kartı hiçbir ekranda taşmasın */
.container-login100,
.wrap-login100 {
    max-width: 100%;
}

/* Küçük ekranlarda görsel taraf gizlenince form tam genişlik olsun */
@media (max-width: 768px) {
    .login100-form,
    .login100-pic {
        width: 100% !important;
    }

    .wrap-login100 {
        flex-direction: column;
    }
}

/* Girişler ve butonlar dokunulabilir yükseklikte */
.login100-form-btn,
.input100,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="date"],
select {
    min-height: 44px;
}

@media (max-width: 480px) {
    .login100-form-title {
        font-size: 1.3rem;
    }
}

/* Kayıt formu: dar ekranda tek sütun ve tam genişlik alanlar */
@media (max-width: 768px) {
    .signup-content,
    .signin-content {
        flex-direction: column;
    }

    .signup-form,
    .signin-form {
        width: 100%;
        max-width: 100%;
    }

    .form-group input {
        width: 100%;
    }
}

/* Klavye ile gezinenler için görünür odak */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
    outline: 2px solid #8b5cf6;
    outline-offset: 2px;
}

/* ============================================================
   Minikod mor tema — giriş/kayıt sayfaları yönetim paneliyle
   aynı görsel dile kavuşur (bu dosya en son yüklenir).
   ============================================================ */

/* Sayfa zemini: dashboard başlığındaki mor degrade */
.limiter .container-login100,
.container-login100 {
    background: linear-gradient(120deg, #2b2158 0%, #4c3a9e 60%, #8b5cf6 100%) !important;
}

/* Giriş kartı */
.wrap-login100 {
    border-radius: 18px !important;
    box-shadow: 0 24px 60px rgba(27, 20, 64, 0.35);
    overflow: hidden;
}

.login100-form-title {
    color: #221b4a !important;
    font-weight: 700 !important;
}

/* Girdi alanları */
.input100 {
    border-radius: 12px !important;
    background: #f6f5fb !important;
    color: #221b4a !important;
}

    .input100:focus {
        background: #fff !important;
    }

.focus-input100 {
    border-radius: 12px !important;
}

.symbol-input100 {
    color: #8f88b4 !important;
}

/* Gönder butonu — panel ile aynı mor degrade */
.login100-form-btn {
    background: linear-gradient(135deg, #8b5cf6, #6d28d9) !important;
    border-radius: 12px !important;
    font-weight: 600;
    letter-spacing: 0.04em;
    box-shadow: 0 8px 20px rgba(109, 40, 217, 0.35);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

    .login100-form-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 12px 26px rgba(109, 40, 217, 0.45);
    }

/* Alt bağlantılar */
.txt1 {
    color: #8f88b4 !important;
}

.txt2 {
    color: #6d28d9 !important;
    font-weight: 600;
}

    .txt2:hover {
        color: #8b5cf6 !important;
    }

/* Kayıt (Register) sayfası aynı dile uyum sağlasın */
.signup-form .form-submit,
.signin-form .form-submit,
input[type="submit"].form-submit {
    background: linear-gradient(135deg, #8b5cf6, #6d28d9) !important;
    border: none !important;
    border-radius: 12px !important;
    color: #fff !important;
    font-weight: 600;
}

.form-group input:focus,
.input100:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.2);
}