/* ══════════════════════════════════════
   LOGIN PAGE — FULL REDESIGN
══════════════════════════════════════ */

.login_page {
    width: 100%;
    min-height: 100vh;
    background: #F3F0FF;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px 20px;
    box-sizing: border-box;
}

.login_container {
    width: 100%;
    max-width: 1140px;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    border-radius: 32px;
    overflow: hidden;
    box-shadow: 0 40px 100px rgba(75,6,135,.16);
    background: white;
}

/* ── LEFT PANEL ── */
.login_left {
    background: linear-gradient(145deg, #1A0033 0%, #4B0687 50%, #6A11CB 100%);
    padding: 64px 56px;
    display: flex;
    align-items: flex-start;
    position: relative;
    overflow: hidden;
    min-height: 600px;
}

/* ORB DECORATIONS */
.lft_orb {
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,.06);
    pointer-events: none;
}
.lft_orb1 { width:320px;height:320px;right:-100px;top:-100px; }
.lft_orb2 { width:180px;height:180px;left:-60px;bottom:80px; }
.lft_orb3 { width:100px;height:100px;right:40%;top:40%; }

.login_left_content {
    position: relative;
    z-index: 1;
    width: 100%;
}
.login_left_content img {
    width: 160px;
    margin-bottom: 48px;
    display: block;
}
.login_left_content h1 {
    font-size: 52px;
    font-weight: 900;
    color: white;
    line-height: 1.15;
    margin-bottom: 18px;
    letter-spacing: -.5px;
}
.login_left_content > p {
    font-size: 15px;
    color: rgba(255,255,255,.78);
    line-height: 1.8;
    margin-bottom: 40px;
    max-width: 360px;
}

/* FEATURE LIST */
.lft_features { display:flex;flex-direction:column;gap:18px;margin-bottom:44px; }
.lft_feature {
    display: flex;
    align-items: center;
    gap: 16px;
}
.lft_feature_icon {
    width: 44px; height: 44px;
    border-radius: 14px;
    background: rgba(255,255,255,.14);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.lft_feature_icon i { font-size: 22px; color: white; }
.lft_feature strong { display:block;font-size:14px;font-weight:700;color:white;margin-bottom:2px; }
.lft_feature span   { font-size:12px;color:rgba(255,255,255,.65); }

/* STATS ROW */
.lft_stats {
    display: flex;
    align-items: center;
    gap: 0;
    background: rgba(255,255,255,.1);
    border-radius: 18px;
    padding: 18px 24px;
    backdrop-filter: blur(10px);
}
.lft_stat { flex:1;text-align:center; }
.lft_stat strong { display:block;font-size:22px;font-weight:900;color:white; }
.lft_stat span   { font-size:11px;color:rgba(255,255,255,.65);text-transform:uppercase;letter-spacing:.5px; }
.lft_stat_divider { width:1px;height:36px;background:rgba(255,255,255,.2);flex-shrink:0; }

/* ── RIGHT PANEL ── */
.login_right {
    padding: 64px 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
}
.login_card {
    width: 100%;
    max-width: 400px;
}

/* FORM TOP */
.login_form_top {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 36px;
}
.login_form_icon {
    width: 56px; height: 56px;
    border-radius: 18px;
    background: linear-gradient(135deg,#4B0687,#6A11CB);
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 8px 20px rgba(75,6,135,.3);
}
.login_form_icon i { font-size: 26px; color: white; }
.login_card h2 {
    font-size: 30px;
    font-weight: 900;
    color: #111827;
    margin: 0 0 4px;
    letter-spacing: -.3px;
}
.login_subtext {
    font-size: 14px;
    color: #6B7280;
    margin: 0;
}

/* INPUTS */
.login_input_group { margin-bottom: 20px; }
.login_input_group label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: #374151;
    margin-bottom: 8px;
}
.login_input_wrap {
    position: relative;
    display: flex;
    align-items: center;
}
.login_input_icon {
    position: absolute;
    left: 18px;
    font-size: 20px;
    color: #9CA3AF;
    pointer-events: none;
    transition: .3s;
}
.login_input_wrap input {
    width: 100%;
    height: 58px;
    border: 1.5px solid #E5E7EB;
    border-radius: 16px;
    padding: 0 52px;
    font-size: 15px;
    outline: none;
    background: #F9FAFB;
    color: #111827;
    transition: .3s;
    box-sizing: border-box;
    font-family: inherit;
}
.login_input_wrap input:focus {
    border-color: #4B0687;
    background: white;
    box-shadow: 0 0 0 4px rgba(75,6,135,.08);
}
.login_input_wrap input:focus + .login_input_icon,
.login_input_wrap:focus-within .login_input_icon { color: #4B0687; }
.toggle_password {
    position: absolute;
    right: 18px;
    font-size: 20px;
    color: #9CA3AF;
    cursor: pointer;
    transition: color .2s;
}
.toggle_password:hover { color: #4B0687; }
.password_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}
.password_top a {
    font-size: 13px;
    color: #4B0687;
    text-decoration: none;
    font-weight: 600;
}
.password_top a:hover { text-decoration: underline; }

/* REMEMBER ME */
.remember_box {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
}
.remember_box input[type="checkbox"] {
    width: 18px; height: 18px;
    accent-color: #4B0687;
    cursor: pointer;
}
.remember_box label {
    font-size: 13px;
    color: #374151;
    cursor: pointer;
}

/* SIGN IN BUTTON */
.login_btn {
    width: 100%;
    height: 58px;
    border: none;
    border-radius: 16px;
    background: linear-gradient(135deg,#4B0687,#6A11CB);
    color: white;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: .3s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-family: inherit;
    letter-spacing: .2px;
    box-shadow: 0 10px 28px rgba(75,6,135,.3);
}
.login_btn:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(75,6,135,.38);
}
.login_btn:disabled { opacity: .7; cursor: not-allowed; }
.login_btn i { font-size: 20px; }

/* DIVIDER */
.login_divider {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 24px 0;
}
.login_divider span {
    flex: 1;
    height: 1px;
    background: #E5E7EB;
}
.login_divider p {
    font-size: 13px;
    color: #9CA3AF;
    margin: 0;
    white-space: nowrap;
}

/* REGISTER LINK */
.register_text {
    text-align: center;
    font-size: 14px;
    color: #6B7280;
    margin: 0 0 24px;
}
.register_text a {
    color: #4B0687;
    font-weight: 700;
    text-decoration: none;
}
.register_text a:hover { text-decoration: underline; }

/* TRUST BADGES */
.login_trust {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    padding-top: 20px;
    border-top: 1px solid #F3F4F6;
}
.login_trust_item {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 600;
    color: #9CA3AF;
}
.login_trust_item i { font-size: 13px; color: #4B0687; }

/* SHAKE ANIMATION */
@keyframes loginShake {
    0%,100%{ transform:translateX(0); }
    20%    { transform:translateX(-8px); }
    40%    { transform:translateX(8px); }
    60%    { transform:translateX(-6px); }
    80%    { transform:translateX(6px); }
}
.login_shake { animation: loginShake .5s ease; }

/* ── RESPONSIVE ── */
@media(max-width:900px){
    .login_container { grid-template-columns:1fr; }
    .login_left      { min-height:auto;padding:44px 36px; }
    .login_left_content h1 { font-size:40px; }
    .lft_features    { display:none; }
    .lft_stats       { margin-top:0; }
    .login_right     { padding:44px 36px; }
}
@media(max-width:560px){
    .login_page      { padding:24px 16px; }
    .login_container { border-radius:24px; }
    .login_left      { padding:32px 24px; }
    .login_left_content img  { width:130px;margin-bottom:28px; }
    .login_left_content h1   { font-size:32px; }
    .login_left_content > p  { font-size:14px;margin-bottom:24px; }
    .lft_stats       { padding:14px 16px; }
    .lft_stat strong { font-size:18px; }
    .login_right     { padding:32px 22px; }
    .login_card h2   { font-size:26px; }
    .login_form_icon { width:48px;height:48px; }
    .login_form_icon i { font-size:22px; }
    .login_trust     { gap:10px; }
}