/* =====================================================
   AK Login V2
   Primexa ERP - Premium Login UI
   ERPNext 15
===================================================== */

:root {
    --ak-primary: #5d6da6;
    --ak-primary-dark: #4c5b91;
    --ak-primary-light: #8a98cc;
    --ak-navy: #16224a;
    --ak-text: #16224a;
    --ak-muted: #64748b;
    --ak-border: #dbe5f0;
    --ak-card: #ffffff;
    --ak-input-bg: #f8fbff;
}

/* =====================================================
   Page background
===================================================== */

body[data-path="login"],
body[data-route="login"],
body:has(.for-login),
body:has(.login-content),
body.ak-login-page {
    min-height: 100vh !important;
    background:
        radial-gradient(circle at 15% 18%, rgba(255,255,255,.18) 0, rgba(255,255,255,0) 30%),
        radial-gradient(circle at 82% 16%, rgba(138,152,204,.38) 0, rgba(138,152,204,0) 34%),
        radial-gradient(circle at 50% 92%, rgba(255,255,255,.10) 0, rgba(255,255,255,0) 32%),
        linear-gradient(135deg, #5d6da6 0%, #4c5b91 46%, #16224a 100%) !important;
    color: var(--ak-text) !important;
    overflow-x: hidden !important;
}

/* Premium grid pattern */
body.ak-login-page::before,
body:has(.for-login)::before,
body:has(.login-content)::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    pointer-events: none !important;
    background-image:
        linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px) !important;
    background-size: 42px 42px !important;
    z-index: 0 !important;
}

/* Soft overlay shape */
body.ak-login-page::after,
body:has(.for-login)::after,
body:has(.login-content)::after {
    content: "" !important;
    position: fixed !important;
    width: 560px !important;
    height: 560px !important;
    right: -170px !important;
    bottom: -210px !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.08) !important;
    filter: blur(2px) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

/* Hide website navbar/footer */
body.ak-login-page .navbar,
body.ak-login-page .web-footer,
body.ak-login-page footer,
body:has(.for-login) .navbar,
body:has(.for-login) .web-footer,
body:has(.for-login) footer,
body:has(.login-content) .navbar,
body:has(.login-content) .web-footer,
body:has(.login-content) footer {
    display: none !important;
}

/* =====================================================
   Center layout
===================================================== */

body.ak-login-page .page-content-wrapper,
body.ak-login-page .page_content,
body.ak-login-page main,
body:has(.for-login) .page-content-wrapper,
body:has(.for-login) .page_content,
body:has(.for-login) main,
body:has(.login-content) .page-content-wrapper,
body:has(.login-content) .page_content,
body:has(.login-content) main {
    min-height: 100vh !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 32px 16px !important;
    position: relative !important;
    z-index: 1 !important;
}

.login-content,
.for-login,
.for-email-login,
.for-forgot,
.for-signup {
    width: 100% !important;
    max-width: 485px !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 2 !important;
}

/* =====================================================
   Login Card
===================================================== */

.page-card,
.login-content .page-card,
.for-login .page-card,
.for-email-login .page-card,
.for-forgot .page-card,
.for-signup .page-card {
    background: rgba(255,255,255,.975) !important;
    border: 1px solid rgba(255,255,255,.65) !important;
    border-radius: 30px !important;
    padding: 38px 38px 32px !important;
    box-shadow:
        0 32px 80px rgba(15,23,42,.32),
        0 10px 28px rgba(15,23,42,.14) !important;
    backdrop-filter: blur(18px) !important;
    overflow: hidden !important;
    position: relative !important;
}

/* top premium line */
.page-card::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 6px !important;
    background: linear-gradient(90deg, #16224a, #5d6da6, #8a98cc, #5d6da6, #16224a) !important;
}

/* small glow inside card */
.page-card::after {
    content: "" !important;
    position: absolute !important;
    top: -80px !important;
    right: -80px !important;
    width: 190px !important;
    height: 190px !important;
    border-radius: 999px !important;
    background: rgba(93,109,166,.08) !important;
    pointer-events: none !important;
}

/* Hide default ERPNext title/head */
.page-card-head,
.login-content .page-card-head,
.for-login .page-card-head {
    display: none !important;
}

/* Hide repetitive captions */
.sign-up-message,
.login-content .text-muted,
.for-login .text-muted {
    color: #64748b !important;
}

/* =====================================================
   Primexa Branding
===================================================== */

.ak-login-brand {
    text-align: center !important;
    margin-bottom: 26px !important;
    position: relative !important;
    z-index: 2 !important;
}

.ak-login-logo-strip {
    width: 100% !important;
    max-width: 310px !important;
    min-height: 86px !important;
    margin: 0 auto 18px !important;
    border-radius: 20px !important;
    background:
        linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
    border: 1px solid #dbe5f0 !important;
    box-shadow:
        0 16px 34px rgba(15,23,42,.13),
        inset 0 1px 0 rgba(255,255,255,.9) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 24px !important;
}

.ak-login-logo-wide {
    display: block !important;
    max-width: 230px !important;
    width: auto !important;
    max-height: 58px !important;
    height: auto !important;
    object-fit: contain !important;
}

.ak-login-logo-fallback-wide {
    color: #16224a !important;
    font-weight: 950 !important;
    font-size: 24px !important;
    letter-spacing: 1.2px !important;
}

.ak-login-title {
    margin: 0 !important;
    color: #16224a !important;
    font-size: 32px !important;
    font-weight: 950 !important;
    line-height: 1.15 !important;
    letter-spacing: -.5px !important;
}

.ak-login-subtitle {
    margin: 9px 0 0 !important;
    color: #64748b !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.5 !important;
}

/* =====================================================
   Form Fields
===================================================== */

.page-card .form-group,
.login-content .form-group,
.for-login .form-group {
    margin-bottom: 17px !important;
}

.page-card label,
.login-content label,
.for-login label,
.control-label {
    color: #16224a !important;
    font-weight: 850 !important;
    font-size: 13px !important;
    margin-bottom: 7px !important;
}

.page-card .form-control,
.login-content .form-control,
.for-login .form-control,
.for-forgot .form-control,
.for-email-login .form-control,
.for-signup .form-control,
input[type="text"],
input[type="email"],
input[type="password"] {
    height: 48px !important;
    border-radius: 15px !important;
    border: 1px solid #d7e1ef !important;
    background: #f8fbff !important;
    color: #16224a !important;
    font-weight: 750 !important;
    font-size: 14px !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 10px 15px !important;
    transition: all .18s ease !important;
}

.page-card .form-control:focus,
.login-content .form-control:focus,
.for-login .form-control:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus {
    background: #ffffff !important;
    border-color: #5d6da6 !important;
    box-shadow: 0 0 0 4px rgba(93,109,166,.15) !important;
}

.page-card .form-control::placeholder,
.login-content .form-control::placeholder,
.for-login .form-control::placeholder {
    color: #94a3b8 !important;
    font-weight: 650 !important;
}

/* Password toggle / input group */
.input-group-text,
.toggle-password,
.password-toggle {
    border-radius: 13px !important;
    color: #5d6da6 !important;
    background: #f8fbff !important;
    border-color: #d7e1ef !important;
}

/* =====================================================
   Buttons
===================================================== */

.btn-login,
.page-card .btn-primary,
.login-content .btn-primary,
.for-login .btn-primary,
button[type="submit"] {
    width: 100% !important;
    height: 50px !important;
    border-radius: 16px !important;
    border: 1px solid #5d6da6 !important;
    background: linear-gradient(135deg, #5d6da6 0%, #4c5b91 55%, #16224a 100%) !important;
    color: #ffffff !important;
    font-weight: 950 !important;
    font-size: 15px !important;
    letter-spacing: .1px !important;
    box-shadow:
        0 16px 32px rgba(93,109,166,.32),
        inset 0 1px 0 rgba(255,255,255,.22) !important;
    transition: all .18s ease !important;
}

.btn-login:hover,
.page-card .btn-primary:hover,
.login-content .btn-primary:hover,
.for-login .btn-primary:hover,
button[type="submit"]:hover {
    transform: translateY(-1px) !important;
    background: linear-gradient(135deg, #4c5b91 0%, #16224a 100%) !important;
    box-shadow:
        0 20px 40px rgba(22,34,74,.31),
        inset 0 1px 0 rgba(255,255,255,.18) !important;
}

.btn-login:active,
.page-card .btn-primary:active,
.login-content .btn-primary:active,
.for-login .btn-primary:active,
button[type="submit"]:active {
    transform: translateY(0) !important;
}

/* =====================================================
   Links
===================================================== */

.page-card a,
.login-content a,
.for-login a,
.forgot-password-message a,
.sign-up-message a {
    color: #5d6da6 !important;
    font-weight: 850 !important;
    text-decoration: none !important;
}

.page-card a:hover,
.login-content a:hover,
.for-login a:hover {
    color: #16224a !important;
    text-decoration: underline !important;
}

.forgot-password-message,
.sign-up-message {
    color: #64748b !important;
    font-weight: 750 !important;
}

/* =====================================================
   Alerts
===================================================== */

.alert,
.msgprint,
.login-content .alert {
    border-radius: 15px !important;
    border: 1px solid #dbe5f0 !important;
    box-shadow: 0 10px 20px rgba(15,23,42,.08) !important;
    font-weight: 750 !important;
}

.invalid-feedback,
.error-message,
.text-danger {
    color: #dc2626 !important;
    font-weight: 850 !important;
}

/* =====================================================
   Footer
===================================================== */

.ak-login-footer {
    text-align: center !important;
    margin-top: 18px !important;
    color: rgba(255,255,255,.90) !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    position: relative !important;
    z-index: 2 !important;
}

.ak-login-footer strong {
    color: #ffffff !important;
    font-weight: 950 !important;
}

/* =====================================================
   Responsive
===================================================== */

@media (max-width: 576px) {
    body.ak-login-page .page-content-wrapper,
    body.ak-login-page main,
    body:has(.for-login) .page-content-wrapper,
    body:has(.for-login) main {
        padding: 22px 14px !important;
    }

    .page-card,
    .login-content .page-card,
    .for-login .page-card {
        padding: 30px 22px 26px !important;
        border-radius: 24px !important;
    }

    .ak-login-logo-strip {
        max-width: 250px !important;
        min-height: 76px !important;
        border-radius: 18px !important;
    }

    .ak-login-logo-wide {
        max-width: 195px !important;
        max-height: 50px !important;
    }

    .ak-login-title {
        font-size: 28px !important;
    }
}

/* =====================================================
   RTL Arabic
===================================================== */

html[dir="rtl"] .page-card,
html[dir="rtl"] .login-content,
html[dir="rtl"] .for-login,
body[data-direction="rtl"] .page-card,
body[data-direction="rtl"] .login-content,
body[data-direction="rtl"] .for-login {
    direction: rtl !important;
    text-align: right !important;
}

html[dir="rtl"] .ak-login-brand,
body[data-direction="rtl"] .ak-login-brand {
    text-align: center !important;
}

/* =====================================================
   Final guard
===================================================== */

body.ak-login-page,
body.ak-login-page .page-card,
body.ak-login-page .login-content,
body.ak-login-page .for-login {
    opacity: 1 !important;
    filter: none !important;
    visibility: visible !important;
}