/* ============================================================
   Smart Access Control — Custom Login Page  v2.2
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
    --sac-accent:       #4f46e5;
    --sac-accent-dark:  #4338ca;
    --sac-accent-deep:  #7c3aed;
    --sac-text:         #1d2327;
    --sac-muted:        #6b7280;
    --sac-border:       #e5e7eb;
    --sac-card:         #ffffff;
    --sac-radius:       14px;
    --sac-shadow:       0 4px 24px rgba(0,0,0,.10);
    --sac-error:        #dc2626;
    --sac-success:      #16a34a;
    --sac-primary:      #2271b1;
    --sac-input-focus:  0 0 0 3px rgba(79,70,229,.18);
}

/* ── Body ─────────────────────────────────────────────────── */
body.login,
body.sac-login-body {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    min-height: 100vh;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    padding: 20px;
}
body.login::before { display: none; }

/* ── Outer wrapper ────────────────────────────────────────── */
#login {
    width: 100% !important;
    max-width: 420px !important;
    padding: 0 !important;
    margin: 0 auto !important;
}

/* ── KILL WordPress h1 logo completely ───────────────────── */
#login h1,
.login h1,
#login h1 a,
.login h1 a {
    display: none !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: hidden !important;
    position: absolute !important;
    pointer-events: none !important;
}

/* ── Brand block ──────────────────────────────────────────── */
.sac-login-brand {
    text-align: center;
    margin-bottom: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.sac-login-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    border-radius: 18px;
    background: linear-gradient(135deg, #4f46e5, #7c3aed);
    box-shadow: 0 8px 24px rgba(79,70,229,.40);
    flex-shrink: 0;
}

.sac-login-site-name {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #fff !important;
    letter-spacing: -.4px;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center;
    display: block;
    /* override any WP <p> defaults */
    line-height: 1.3;
}

/* ── Form card ────────────────────────────────────────────── */
#loginform,
#lostpasswordform,
#registerform {
    background: var(--sac-card) !important;
    border: none !important;
    border-radius: var(--sac-radius) !important;
    box-shadow: var(--sac-shadow) !important;
    padding: 36px 36px 28px !important;
    margin: 0 !important;
}

/* ── Labels ───────────────────────────────────────────────── */
#loginform label,
#lostpasswordform label,
#registerform label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--sac-text) !important;
    display: block !important;
    margin-bottom: 6px !important;
}

/* ── Inputs ───────────────────────────────────────────────── */
#loginform input[type="text"],
#loginform input[type="password"],
#loginform input[type="email"],
#lostpasswordform input[type="text"],
#lostpasswordform input[type="email"],
#registerform input[type="text"],
#registerform input[type="email"],
#registerform input[type="password"] {
    width: 100% !important;
    padding: 11px 14px !important;
    border: 1.5px solid var(--sac-border) !important;
    border-radius: 9px !important;
    font-size: 14px !important;
    color: var(--sac-text) !important;
    background: #f9fafb !important;
    transition: border-color .2s, box-shadow .2s !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
    outline: none !important;
}

#loginform input[type="text"]:focus,
#loginform input[type="password"]:focus,
#loginform input[type="email"]:focus {
    border-color: var(--sac-accent) !important;
    box-shadow: var(--sac-input-focus) !important;
    background: #fff !important;
}

/* Field spacing */
.login-username,
.login-password {
    margin-bottom: 16px !important;
}

/* ── Hide Caps Lock warning ───────────────────────────────── */
.caps-lock-warning,
#login .caps-lock-warning,
.login-password .caps-lock-warning {
    display: none !important;
}

/* ── Submit button ────────────────────────────────────────── */
#loginform .button-primary,
#lostpasswordform .button-primary,
#registerform .button-primary,
input#wp-submit,
.login .button.button-large {
    width: 100% !important;
    padding: 12px 20px !important;
    background: linear-gradient(135deg, #4f46e5, #7c3aed) !important;
    border: none !important;
    border-radius: 9px !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: opacity .2s, transform .1s !important;
    box-shadow: 0 4px 14px rgba(79,70,229,.35) !important;
    height: auto !important;
    line-height: 1 !important;
    text-shadow: none !important;
}

input#wp-submit:hover,
.login .button.button-large:hover {
    opacity: .9 !important;
    transform: translateY(-1px) !important;
}

/* ── Remember me ──────────────────────────────────────────── */
.forgetmenot {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    margin-bottom: 0 !important;
}
.forgetmenot label {
    font-size: 13px !important;
    color: var(--sac-muted) !important;
    margin-bottom: 0 !important;
}
.forgetmenot input[type="checkbox"] {
    width: 15px; height: 15px;
    accent-color: var(--sac-accent);
    cursor: pointer;
}

/* ── Submit row ───────────────────────────────────────────── */
.submit {
    display: flex !important;
    flex-direction: column !important;
    gap: 14px !important;
    margin-top: 20px !important;
    padding: 0 !important;
}

/* ── Nav links ────────────────────────────────────────────── */
#nav, #backtoblog {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    text-align: center !important;
    padding: 14px 0 0 !important;
    margin: 0 !important;
}
#nav a, #backtoblog a {
    color: rgba(255,255,255,.85) !important;
    font-size: 13px !important;
    text-decoration: none !important;
}
#nav a:hover, #backtoblog a:hover {
    color: #fff !important;
    text-decoration: underline !important;
}

/* ── Error / message boxes ────────────────────────────────── */
#login_error, .login .message, .login .success {
    border-radius: 9px !important;
    border: none !important;
    padding: 12px 16px !important;
    font-size: 13px !important;
    margin-bottom: 18px !important;
    border-left: 4px solid !important;
}
#login_error {
    background: #fef2f2 !important;
    border-left-color: var(--sac-error) !important;
    color: var(--sac-error) !important;
}
.login .message {
    background: #eff6ff !important;
    border-left-color: var(--sac-primary) !important;
    color: var(--sac-primary) !important;
}
.login .success {
    background: #f0fdf4 !important;
    border-left-color: var(--sac-success) !important;
    color: var(--sac-success) !important;
}

/* ── Footer ───────────────────────────────────────────────── */
.sac-login-footer {
    margin-top: 24px;
    text-align: center;
}
.sac-login-footer p {
    font-size: 12px;
    color: rgba(255,255,255,.55);
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 480px) {
    #loginform, #lostpasswordform, #registerform {
        padding: 28px 22px 22px !important;
    }
    .sac-login-site-name { font-size: 19px !important; }
    .sac-login-logo { width: 58px; height: 58px; border-radius: 15px; }
}

/* ── Password show/hide button (wp-pwd) — শুধু button hide, input দেখাবে ─────
──────────────────────────────────────────────────────────── */
.wp-pwd .button.wp-hide-pw,
.wp-pwd .button-secondary,
.wp-pwd button[type="button"],
#loginform .wp-pwd .button,
.login-password .wp-pwd button {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    pointer-events: none !important;
}

/* wp-pwd wrapper block রাখো — এর ভেতরে password input আছে */
.wp-pwd,
#loginform .wp-pwd,
.login-password .wp-pwd {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
    position: static !important;
}

/* Password field full width নিক (button সরে যাওয়ার পর) */
.login-password .wp-pwd input[type="password"],
.login-password input[type="password"],
#loginform input[type="password"] {
    width: 100% !important;
    padding-right: 14px !important;
}

/* ── Caps lock warning — hide ────────────────────────────── */
.caps-lock-warning,
#login .caps-lock-warning,
.login-password .caps-lock-warning,
#caps-warning,
.user-pass-wrap #caps-warning {
    display: none !important;
}