html.login-standalone, html.login-standalone body{margin:0;min-height:100%;overflow-x:hidden;}
/* ==========================================================
   Premium Admin Login
   ========================================================== */
.login-modern{
    position:relative;
    min-height:100vh;
    min-height:100dvh;
    padding:28px 20px 54px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    background:#f5f7fb;
}
.login-background-shape{
    position:absolute;
    border-radius:999px;
    pointer-events:none;
    filter:blur(1px);
}
.login-shape-one{
    width:430px;height:430px;
    top:-250px;right:-120px;
    background:radial-gradient(circle,#dbeafe 0%,rgba(219,234,254,0) 68%);
}
.login-shape-two{
    width:390px;height:390px;
    bottom:-250px;left:-150px;
    background:radial-gradient(circle,#dcfce7 0%,rgba(220,252,231,0) 68%);
}
.login-card-modern{
    position:relative;
    z-index:2;
    width:min(430px,100%);
    overflow:hidden;
    border:1px solid #e5eaf2;
    border-radius:22px;
    background:rgba(255,255,255,.97);
    box-shadow:0 22px 65px rgba(15,23,42,.11),0 3px 12px rgba(15,23,42,.04);
}
.login-card-top{
    padding:30px 34px 23px;
    text-align:center;
    border-bottom:1px solid #edf0f5;
    background:linear-gradient(180deg,#fbfdff 0%,#fff 100%);
}
.login-logo-modern{
    width:52px;height:52px;
    margin:0 auto 12px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:15px;
    color:#fff;
    background:linear-gradient(145deg,#2563eb,#1d4ed8);
    box-shadow:0 10px 22px rgba(37,99,235,.22);
}
.login-logo-modern svg{width:24px;height:24px;stroke-width:1.8}
.login-brand-name{
    color:#172033;
    font-size:11px;
    font-weight:850;
    letter-spacing:.18em;
}
.login-status{
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-top:9px;
    padding:5px 9px;
    border:1px solid #dcefe4;
    border-radius:999px;
    background:#f4fbf7;
    color:#64748b;
    font-size:8px;
    font-weight:700;
}
.login-status span{
    width:6px;height:6px;
    border-radius:50%;
    background:#10b981;
    box-shadow:0 0 0 3px rgba(16,185,129,.10);
}
.login-content-modern{padding:28px 34px 25px}
.login-content-modern h1{
    margin:0;
    color:#0f172a;
    font-size:28px;
    line-height:1.15;
    letter-spacing:-.035em;
    font-weight:780;
    text-align:center;
}
.login-intro{
    max-width:315px;
    margin:8px auto 25px;
    color:#8a97aa;
    font-size:10px;
    line-height:1.65;
    text-align:center;
}
.login-error-modern{
    display:flex;
    align-items:center;
    gap:9px;
    margin:0 0 16px;
    padding:10px 11px;
    border:1px solid #fecdd3;
    border-radius:11px;
    background:#fff5f6;
    color:#b42332;
    font-size:9px;
    line-height:1.4;
}
.login-error-icon{
    width:26px;height:26px;
    flex:0 0 26px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    background:#ffe4e6;
}
.login-error-icon svg{width:14px;height:14px}
.login-field-modern{margin-bottom:16px}
.login-field-modern label{
    display:block;
    margin:0 0 7px 2px;
    color:#344054;
    font-size:9px;
    font-weight:750;
}
.login-input-modern{
    position:relative;
    display:flex;
    align-items:center;
}
.login-input-modern>svg{
    position:absolute;
    left:13px;
    width:16px;height:16px;
    color:#98a2b3;
    pointer-events:none;
    z-index:1;
}
.login-input-modern input{
    width:100%;
    height:48px;
    padding:0 13px 0 40px;
    border:1px solid #dfe5ed;
    border-radius:12px;
    outline:none;
    box-sizing:border-box;
    background:#fafbfc;
    color:#101828;
    font-size:10px;
    transition:.18s ease;
}
.login-input-modern input::placeholder{color:#aab4c3}
.login-input-modern input:hover{border-color:#cbd5e1;background:#fff}
.login-input-modern input:focus{
    border-color:#60a5fa;
    background:#fff;
    box-shadow:0 0 0 3px rgba(37,99,235,.09);
}
.password-input-modern input{padding-right:45px}
.login-eye-modern{
    position:absolute;
    right:7px;
    width:34px;height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:0;
    border-radius:9px;
    color:#98a2b3;
    background:transparent;
    cursor:pointer;
}
.login-eye-modern:hover{color:#344054;background:#f1f5f9}
.login-eye-modern svg{width:16px;height:16px}
.login-submit-modern{
    width:100%;
    height:48px;
    margin-top:3px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border:0;
    border-radius:12px;
    color:#fff;
    background:linear-gradient(135deg,#2563eb,#1d4ed8);
    font-size:10px;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 10px 22px rgba(37,99,235,.19);
    transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
.login-submit-modern:hover{
    transform:translateY(-1px);
    filter:brightness(1.03);
    box-shadow:0 13px 27px rgba(37,99,235,.24);
}
.login-submit-modern:active{transform:translateY(0)}
.login-submit-modern svg{width:16px;height:16px}
.login-trust-row{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:14px;
    margin-top:20px;
    padding-top:17px;
    border-top:1px solid #edf0f4;
}
.login-trust-row div{
    display:flex;
    align-items:center;
    gap:5px;
    color:#98a2b3;
    font-size:7.5px;
    font-weight:650;
}
.login-trust-row svg{width:12px;height:12px;color:#10b981}
.login-footer-modern{
    position:absolute;
    z-index:2;
    bottom:15px;
    left:0;right:0;
    margin:0;
    text-align:center;
    color:#a1acbc;
    font-size:7.5px;
    font-weight:600;
}
@media(max-width:520px){
    .login-modern{padding:18px 14px 48px}
    .login-card-modern{border-radius:18px}
    .login-card-top{padding:25px 24px 20px}
    .login-content-modern{padding:25px 23px 22px}
    .login-content-modern h1{font-size:25px}
    .login-intro{margin-bottom:22px}
}


/* Fix login centering: the global admin layout reserves sidebar space even
   while logged out. The login page must use the full viewport. */
.main-wrapper:has(.login-modern){
    margin-left:0 !important;
    padding:0 !important;
    min-width:0;
}
.main-wrapper:has(.login-modern) .ib-container{
    max-width:none !important;
    width:100%;
    margin:0 !important;
}

/* Remember / forgot row */
.login-options-row{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:-2px 0 17px;
}
.remember-option{
    display:inline-flex !important;
    align-items:center;
    gap:7px;
    margin:0 !important;
    color:#667085 !important;
    font-size:9px !important;
    font-weight:600 !important;
    cursor:pointer;
    user-select:none;
}
.remember-option input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}
.remember-box{
    width:15px;
    height:15px;
    flex:0 0 15px;
    border:1px solid #cbd5e1;
    border-radius:4px;
    background:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:.16s ease;
}
.remember-option input:checked + .remember-box{
    border-color:#2563eb;
    background:#2563eb;
    box-shadow:0 2px 6px rgba(37,99,235,.18);
}
.remember-option input:checked + .remember-box:after{
    content:"";
    width:7px;
    height:4px;
    border-left:1.7px solid #fff;
    border-bottom:1.7px solid #fff;
    transform:rotate(-45deg) translateY(-1px);
}
.remember-option:hover .remember-box{
    border-color:#93c5fd;
}
.forgot-password-link{
    color:#2563eb;
    text-decoration:none;
    font-size:9px;
    font-weight:700;
    white-space:nowrap;
}
.forgot-password-link:hover{
    color:#1d4ed8;
    text-decoration:underline;
}
@media(max-width:520px){
    .login-options-row{margin-bottom:16px}
}

/* Forgot password: red text + smooth underline slide on hover */
.forgot-password-link{
    position:relative;
    color:#dc2626 !important;
    text-decoration:none !important;
    transition:color .2s ease;
    padding-bottom:2px;
}
.forgot-password-link::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:1.5px;
    background:currentColor;
    transform:scaleX(0);
    transform-origin:left center;
    transition:transform .28s ease;
}
.forgot-password-link:hover{
    color:#b91c1c !important;
}
.forgot-password-link:hover::after{
    transform:scaleX(1);
}

/* Final standalone-login overflow fix */
html.login-standalone,
html.login-standalone body{
    width:100%;
    max-width:100%;
    margin:0;
    padding:0;
    overflow-x:hidden !important;
    overflow-y:auto;
}
html.login-standalone *,
html.login-standalone *::before,
html.login-standalone *::after{box-sizing:border-box;}
html.login-standalone .login-modern{
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:100dvh;
    overflow:hidden !important;
}
html.login-standalone .login-card-modern{
    width:min(430px,100%);
    max-width:100%;
    min-width:0;
}
@media(max-width:520px){
    html.login-standalone .login-modern{padding-left:12px;padding-right:12px;}
    html.login-standalone .login-card-top,
    html.login-standalone .login-content-modern{padding-left:22px;padding-right:22px;}
}