@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

*{box-sizing:border-box;margin:0;padding:0}

:root{
    --primary:#C9A227;
    --primary-dark:#a9871d;
    --dark:#111827;
    --text:#111827;
    --muted:#6b7280;
    --border:#e7e8ec;
}

html,body{
    height:100%;
    font-family:"Poppins",Arial,sans-serif;
    color:var(--text);
}

.login-page{
    display:flex;
    min-height:100vh;
}

/* ===== SOL PANEL - MARKA ===== */
.login-brand{
    flex:1.1;
    background:
        radial-gradient(circle at 20% 20%, rgba(201,162,39,.18), transparent 45%),
        radial-gradient(circle at 85% 80%, rgba(201,162,39,.10), transparent 40%),
        var(--dark);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:60px 60px 40px;
    position:relative;
}

.login-brand-signature{
    position:absolute;
    bottom:36px;
    left:0;
    right:0;
    text-align:center;
    font-size:13px;
    line-height:1.9;
    color:rgba(255,255,255,.45);
    letter-spacing:.3px;
}

.login-brand-signature span{
    display:block;
    font-size:12px;
    color:rgba(255,255,255,.3);
}

.login-brand-inner{
    text-align:center;
    max-width:360px;
}

.login-brand-logo{
    width:130px;
    height:auto;
    margin-bottom:32px;
}

.login-brand-inner h1{
    font-size:26px;
    font-weight:800;
    color:#fff;
    letter-spacing:.3px;
    margin-bottom:12px;
}

.login-brand-inner p{
    font-size:13.5px;
    line-height:1.6;
    color:rgba(255,255,255,.55);
}

/* ===== SAĞ PANEL - FORM ===== */
.login-form-side{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:40px 24px;
    background:#fff;
}

.login-card{
    width:100%;
    max-width:360px;
}

.login-mobile-logo{
    display:none;
    align-items:baseline;
    gap:8px;
    margin-bottom:30px;
}

.login-mobile-logo strong{
    font-size:20px;
    font-weight:800;
    color:var(--primary);
}

.login-mobile-logo span{
    font-size:12px;
    color:var(--muted);
}

.login-card h2{
    font-size:24px;
    font-weight:800;
    letter-spacing:-.3px;
    margin-bottom:6px;
}

.login-subtitle{
    font-size:13px;
    color:var(--muted);
    margin-bottom:26px;
}

.login-error{
    background:rgba(220,38,38,.08);
    border:1px solid rgba(220,38,38,.25);
    color:#b91c1c;
    font-size:12.5px;
    font-weight:600;
    padding:11px 14px;
    border-radius:12px;
    margin-bottom:18px;
}

form label{
    display:block;
    font-size:11px;
    font-weight:700;
    letter-spacing:.3px;
    text-transform:uppercase;
    color:var(--muted);
    margin:18px 0 8px;
}

form label:first-of-type{
    margin-top:0;
}

form input{
    width:100%;
    height:48px;
    padding:0 16px;
    border:1px solid var(--border);
    border-radius:12px;
    font-family:inherit;
    font-size:14px;
    color:var(--text);
    background:#fff;
    transition:.2s ease;
}

form input:hover{
    border-color:#d5d7dc;
}

form input:focus{
    outline:none;
    border-color:var(--primary);
    box-shadow:0 0 0 3px rgba(201,162,39,.14);
}

form button{
    width:100%;
    height:50px;
    margin-top:26px;
    border:0;
    border-radius:12px;
    background:var(--primary);
    color:#fff;
    font-family:inherit;
    font-size:14.5px;
    font-weight:700;
    cursor:pointer;
    box-shadow:0 14px 28px rgba(201,162,39,.30);
    transition:.2s ease;
}

form button:hover{
    background:var(--primary-dark);
    transform:translateY(-1px);
}

form button:active{
    transform:translateY(0);
}

/* ===== RESPONSIVE ===== */
@media(max-width:860px){
    .login-brand{
        display:none;
    }

    .login-mobile-logo{
        display:flex;
        justify-content:center;
        margin-bottom:24px;
    }

    .login-form-side{
        padding:30px 20px;
    }
}