:root{
    --primary:#1B2157;
    --accent:#0263C6;
    --muted:#BEBEC9;
}

.auth-page {
    display: flex;
    align-items: stretch;
    justify-content: center;
    padding: 40px 20px;
    min-height: calc(100dvh - 75px);
    background: #F3F5F7;
    flex-direction: row-reverse;
}

.auth-card{
    width:540px;
    background:#fff;
    border-radius:12px 0 0 12px;
    box-shadow:0 4px 18px rgba(27,33,87,0.08);
    overflow:hidden;
}

.auth-card-inner{
    padding:38px 48px;
}

.auth-title{
    text-align:center;
    color:var(--primary);
    margin-bottom:6px;
    font-weight:700;
}

.brand{
    color:var(--accent);
    font-weight:800;
}

.auth-sub{
    text-align:center;
    color:var(--muted);
    margin-bottom:18px;
}

.tab-switch{
    display:flex;
    gap:10px;
    justify-content:center;
    margin:10px 0 22px;
}

.tab-btn{
    border:1px solid #E7ECF5;
    background:#fff;
    padding:8px 20px;
    border-radius:12px;
    color:var(--primary);
}

.tab-btn.active{
    background:#F2F8FD;
    border:1px solid #E0E7FF;
}

.auth-form{
    margin-top:8px;
}

.form-group{margin-bottom:14px}
.form-group label{display:block;color:var(--primary);font-weight:500;margin-bottom:8px;font-size:14px}

.input-with-icon{position:relative}
.input-with-icon .form-control{padding:10px 44px 10px 14px;border-radius:8px;border:0.5px solid #C2C4CF;color:#1B2157}
.input-with-icon .icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#9AA0B2}

.eye-btn{position:absolute;left:8px;top:50%;transform:translateY(-50%);border:none;background:transparent;font-size:16px;cursor:pointer}

.form-check{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.form-check label{margin:0;color:#878792}

.submit-btn{display:block;width:100%;background:var(--primary);color:#fff;padding:12px;border-radius:8px;border:none;margin-top:6px}
.submit-btn:disabled{opacity:0.6}

.divider{display:flex;align-items:center;gap:10px;margin-top:18px}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:#E7ECF5}
.divider span{padding:0 10px;color:var(--muted);font-size:13px}

.socials{display:flex;gap:12px;justify-content:center;margin-top:12px}
.social-circle{width:36px;height:36px;border-radius:8px;background:#fff;border:0.5px solid #E7ECF5;display:flex;align-items:center;justify-content:center;color:var(--primary);box-shadow:0 2px 6px rgba(27,33,87,0.04)}

.auth-aside {
    width: 534px;
    background: linear-gradient(180deg,#0f5fa8 0%,#0b6fb4 100%);
    border-radius: 0 12px 12px 0;
    box-shadow: 0 4px 18px rgba(27,33,87,0.08);
    overflow: hidden
}
.aside-image{width:100%;height:100%;background-image:url('/images/warehouse-blur.jpg');background-size:cover;background-position:center;filter:blur(0px);min-height:480px}

/* responsive */
@media(max-width:1000px){
    .auth-page{padding:20px}
    .auth-aside{display:none}
    .auth-card{width:100%;border-radius:12px}
}