/* ==========================================================
   SpaMaster 360 Enterprise ERP v25.3 — Stable Brand/Login
   One single source of truth. Removes duplicated login/logo behavior.
   ========================================================== */

:root{
    --sm360-primary:#5E2BFF;
    --sm360-primary-2:#7C3AED;
    --sm360-deep:#170833;
    --sm360-dark:#22104E;
    --sm360-soft:#B497FF;
}

/* ---------- LOGIN: fixed, centered, no duplicate layers ---------- */

body.login-screen{
    min-height:100vh!important;
    margin:0!important;
    overflow:hidden!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:
        radial-gradient(circle at 18% 14%, rgba(94,43,255,.16), transparent 30%),
        radial-gradient(circle at 82% 18%, rgba(14,165,233,.10), transparent 28%),
        radial-gradient(circle at 50% 88%, rgba(180,151,255,.09), transparent 34%),
        linear-gradient(135deg,#F8FAFF 0%,#EEF4FB 100%)!important;
}

body.login-screen::before,
body.login-screen::after{
    content:none!important;
    display:none!important;
}

/* Kill inherited vertical divider */
.login-shell::before,
.login-shell::after,
.sm360-login-shell::before,
.sm360-login-shell::after{
    display:none!important;
    content:none!important;
    border:0!important;
}

.login-shell,
.sm360-login-shell{
    width:min(1080px,92vw)!important;
    height:auto!important;
    min-height:auto!important;
    margin:0 auto!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:minmax(360px,520px) minmax(360px,430px)!important;
    align-items:center!important;
    justify-content:center!important;
    gap:72px!important;
    position:relative!important;
    z-index:5!important;
}

/* hide any old brand residue if browser/cache still shows it */
.login-brand,
.sm360-login-brand,
.login-brand .app-icon,
.login-brand h1,
.login-brand .sm360-login-logo,
.sm360-login-logo{
    display:none!important;
}

.sm360-login-brand-panel{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    text-align:left!important;
    min-width:0!important;
}

.sm360-login-logo-main{
    display:block!important;
    width:500px!important;
    max-width:42vw!important;
    height:165px!important;
    margin:0 0 18px!important;
    background:url("../brand/logo-spamaster360-dark.png?v=2530") left center / contain no-repeat!important;
    filter:
        drop-shadow(0 24px 38px rgba(94,43,255,.17))
        drop-shadow(0 4px 8px rgba(23,8,51,.08))!important;
}

.sm360-login-brand-panel p{
    max-width:510px!important;
    margin:0!important;
    font-family:var(--sc-font-body, "Manrope", sans-serif)!important;
    font-size:18px!important;
    line-height:1.58!important;
    font-weight:650!important;
    color:#526179!important;
    letter-spacing:-.01em!important;
}

.login-panel.clean-login,
.login-panel,
.sm360-login-panel{
    width:100%!important;
    max-width:430px!important;
    margin:0!important;
    padding:34px 34px 32px!important;
    border-radius:30px!important;
    background:
        radial-gradient(circle at 16% 8%, rgba(255,255,255,.92), transparent 36%),
        linear-gradient(135deg,rgba(255,255,255,.88),rgba(255,255,255,.68))!important;
    border:1px solid rgba(148,163,184,.22)!important;
    box-shadow:
        0 30px 90px rgba(15,23,42,.14),
        0 0 0 1px rgba(255,255,255,.50) inset,
        inset 0 1px 0 rgba(255,255,255,.92)!important;
    backdrop-filter:blur(26px) saturate(1.22)!important;
    -webkit-backdrop-filter:blur(26px) saturate(1.22)!important;
}

.sm360-login-panel h2,
.login-panel h2{
    margin:0 0 8px!important;
    font-family:var(--sc-font-display, "General Sans", sans-serif)!important;
    font-size:27px!important;
    line-height:1.08!important;
    font-weight:850!important;
    letter-spacing:-.04em!important;
    color:#0F172A!important;
}

.login-panel > p:not(.login-help){
    margin:0 0 22px!important;
    font-size:14px!important;
    line-height:1.5!important;
    color:#64748B!important;
    font-weight:550!important;
}

.login-panel label:not(.remember-row){
    display:block!important;
    margin:14px 0 7px!important;
    font-family:var(--sc-font-display, "General Sans", sans-serif)!important;
    font-size:11px!important;
    font-weight:850!important;
    text-transform:uppercase!important;
    letter-spacing:.075em!important;
    color:#64748B!important;
}

.login-panel input[type="text"],
.login-panel input[type="password"]{
    width:100%!important;
    min-height:48px!important;
    border-radius:16px!important;
    padding:0 14px!important;
    border:1px solid rgba(148,163,184,.26)!important;
    background:rgba(255,255,255,.76)!important;
    color:#0F172A!important;
    font-weight:700!important;
    box-shadow:
        0 8px 20px rgba(15,23,42,.035),
        inset 0 1px 0 rgba(255,255,255,.78)!important;
}

.login-panel input[type="text"]:focus,
.login-panel input[type="password"]:focus{
    border-color:rgba(94,43,255,.58)!important;
    box-shadow:
        0 0 0 4px rgba(94,43,255,.11),
        0 14px 30px rgba(94,43,255,.09)!important;
}

.remember-row{
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    margin:16px 0 18px!important;
    color:#64748B!important;
}

.login-panel .btn.primary,
.login-panel button[type="submit"]{
    width:100%!important;
    min-height:50px!important;
    border-radius:17px!important;
    margin:0!important;
    background:linear-gradient(135deg,#5E2BFF 0%,#7C3AED 58%,#8D63FF 100%)!important;
    color:#fff!important;
    border:1px solid rgba(255,255,255,.28)!important;
    box-shadow:
        0 18px 38px rgba(94,43,255,.30),
        inset 0 1px 0 rgba(255,255,255,.26)!important;
}

/* ---------- SIDEBAR BRAND: full light PNG only ---------- */

.sm360-sidebar-brand{
    height:76px!important;
    min-height:76px!important;
    padding:8px 10px 14px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-bottom:1px solid rgba(180,151,255,.14)!important;
    margin-bottom:10px!important;
}

.sm360-sidebar-logo-full{
    width:100%!important;
    height:58px!important;
    background:url("../brand/logo-spamaster360-sidebar-full.png?v=2530") left center / contain no-repeat!important;
    filter:drop-shadow(0 12px 18px rgba(94,43,255,.24))!important;
}

.side-nav .brand-block:not(.sm360-sidebar-brand) .app-icon,
.side-nav .brand-block:not(.sm360-sidebar-brand) .brand-logo-sm360,
.side-nav .brand-block:not(.sm360-sidebar-brand) .brand-text{
    display:none!important;
}

/* If old brand block somehow persists */
.brand-logo-sm360,
.brand-text{
    display:none!important;
}

.side-nav,
#sideNav{
    background:
        radial-gradient(circle at 18% 0%, rgba(94,43,255,.22), transparent 30%),
        linear-gradient(180deg,#110B27 0%,#080715 62%,#050711 100%)!important;
}

/* Responsive */
@media(max-width:980px){
    body.login-screen{
        overflow:auto!important;
        align-items:flex-start!important;
    }

    .login-shell,
    .sm360-login-shell{
        grid-template-columns:1fr!important;
        width:min(520px,92vw)!important;
        gap:28px!important;
        padding:42px 0!important;
    }

    .sm360-login-brand-panel{
        align-items:center!important;
        text-align:center!important;
    }

    .sm360-login-logo-main{
        width:min(460px,86vw)!important;
        max-width:86vw!important;
        height:138px!important;
        background-position:center!important;
        margin-bottom:10px!important;
    }

    .sm360-login-brand-panel p{
        font-size:15px!important;
        max-width:430px!important;
    }
}

@media(max-width:520px){
    .login-panel.clean-login,
    .login-panel,
    .sm360-login-panel{
        padding:26px 22px 24px!important;
        border-radius:24px!important;
    }

    .sm360-login-logo-main{
        height:112px!important;
    }
}