/*
 * SmartHR authentication adapter.
 * Keeps all existing Laravel form actions and validation while applying the
 * provided template's account-page structure to every authentication screen.
 */

body.smarthr-auth-page {
    min-height: 100vh;
    overflow-x: hidden;
    background: #f7f7f7 !important;
    color: #1f1f1f;
    font-family: "CircularStd", Arial, sans-serif;
    font-size: 15px;
    letter-spacing: 0;
}

body.smarthr-auth-page::before {
    position: fixed;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(135deg, rgba(244, 59, 72, 0.06), transparent 42%),
        linear-gradient(315deg, rgba(69, 58, 148, 0.07), transparent 38%),
        #f7f7f7;
    content: "";
}

body.smarthr-auth-page :is(h1, h2, h3, h4, h5, h6, input, button, select, textarea) {
    font-family: "CircularStd", Arial, sans-serif;
    letter-spacing: 0;
}

body.smarthr-auth-page .smarthr-login-shell {
    min-height: 100vh;
}

body.smarthr-auth-page .account-content {
    display: flex !important;
    min-height: 100vh;
    padding: 42px 16px 28px;
    align-items: center;
    justify-content: center;
}

body.smarthr-auth-page .account-content > .container {
    width: 100%;
    max-width: 520px;
}

body.smarthr-auth-page .account-logo {
    display: flex;
    margin: 0 auto 24px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;
    text-align: center;
}

body.smarthr-auth-page .account-logo a {
    display: inline-flex;
}

body.smarthr-auth-page .account-logo img {
    width: 72px;
    max-width: 72px;
    height: 72px;
    object-fit: contain;
}

body.smarthr-auth-page .auth-system-title {
    color: #292929;
    font-size: 18px;
    font-weight: 500;
}

body.smarthr-auth-page .account-brand-copy {
    min-width: 0;
}

body.smarthr-auth-page .account-brand-copy strong,
body.smarthr-auth-page .account-brand-copy span {
    display: block;
}

body.smarthr-auth-page .account-brand-copy strong {
    color: #292929;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.2;
}

body.smarthr-auth-page .account-brand-copy span {
    margin-top: 4px;
    color: #777;
    font-size: 12px;
    text-transform: uppercase;
}

body.smarthr-auth-page .account-box {
    width: 100%;
    max-width: 460px;
    margin: 0 auto;
    border: 1px solid #ededed;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}

body.smarthr-auth-page .account-wrapper {
    padding: 30px;
}

body.smarthr-auth-page .account-title {
    margin: 0 0 6px;
    color: #1f1f1f;
    font-size: 26px;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
}

body.smarthr-auth-page .account-subtitle {
    margin: 0 0 25px;
    color: #777;
    font-size: 15px;
    text-align: center;
}

body.smarthr-auth-page .form-group {
    margin-bottom: 20px;
}

body.smarthr-auth-page .form-group label {
    margin-bottom: 7px;
    color: #1f1f1f;
    font-size: 14px;
    font-weight: 500;
}

body.smarthr-auth-page .form-control {
    height: 44px !important;
    border: 1px solid #e3e3e3 !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #333 !important;
    font-size: 15px !important;
    box-shadow: none !important;
}

body.smarthr-auth-page .form-control:focus {
    border-color: #b7b7b7 !important;
    box-shadow: none !important;
}

body.smarthr-auth-page .input-group-auth {
    display: flex;
    flex-wrap: nowrap;
}

body.smarthr-auth-page .input-group-auth .input-group-text {
    display: grid;
    width: 44px;
    flex: 0 0 44px;
    padding: 0;
    place-items: center;
    border: 1px solid #e3e3e3;
    border-right: 0;
    border-radius: 4px 0 0 4px;
    background: #fafafa;
    color: #777;
}

body.smarthr-auth-page .input-group-auth .form-control {
    border-radius: 0 4px 4px 0 !important;
}

body.smarthr-auth-page .password-field {
    position: relative;
}

body.smarthr-auth-page .password-field .form-control {
    padding-right: 43px;
}

body.smarthr-auth-page .password-toggle {
    position: absolute;
    top: 1px;
    right: 1px;
    bottom: 1px;
    z-index: 5;
    display: grid;
    width: 42px;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 0 4px 4px 0;
    background: transparent;
    color: #777;
}

body.smarthr-auth-page .form-check {
    display: flex;
    min-height: 22px;
    padding-left: 0;
    align-items: center;
    gap: 8px;
}

body.smarthr-auth-page .form-check-input {
    position: static;
    width: 16px;
    height: 16px;
    margin: 0;
    border-color: #cfcfcf;
    border-radius: 3px;
}

body.smarthr-auth-page .form-check-input:checked {
    border-color: #008C82;
    background-color: #008C82;
}

body.smarthr-auth-page .form-check-label {
    margin: 0 !important;
    color: #555 !important;
    font-weight: 400 !important;
}

body.smarthr-auth-page .account-btn,
body.smarthr-auth-page .btn-login {
    width: 100%;
    min-height: 46px;
    border: 1px solid #008C82 !important;
    border-radius: 4px !important;
    background: linear-gradient(to right, #008C82 0%, #172B63 100%) !important;
    color: #fff !important;
    font-size: 16px;
    font-weight: 500;
    box-shadow: none !important;
}

body.smarthr-auth-page .account-btn:hover,
body.smarthr-auth-page .account-btn:focus,
body.smarthr-auth-page .btn-login:hover,
body.smarthr-auth-page .btn-login:focus {
    border-color: #453a94 !important;
    filter: brightness(0.96);
}

body.smarthr-auth-page .smarthr-auth-divider {
    display: flex;
    margin: 23px 0 18px;
    align-items: center;
    gap: 12px;
    color: #999;
    font-size: 12px;
    text-transform: uppercase;
}

body.smarthr-auth-page .smarthr-auth-divider::before,
body.smarthr-auth-page .smarthr-auth-divider::after {
    height: 1px;
    flex: 1;
    background: #ececec;
    content: "";
}

body.smarthr-auth-page .social-actions {
    display: grid;
    gap: 10px;
}

body.smarthr-auth-page .social-btn {
    display: flex !important;
    min-height: 44px;
    padding: 9px 14px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #e3e3e3 !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #333 !important;
    font-size: 14px;
    text-decoration: none;
}

body.smarthr-auth-page .social-btn:hover {
    border-color: #c8c8c8 !important;
    background: #fafafa !important;
}

body.smarthr-auth-page .social-icon {
    display: inline-grid;
    place-items: center;
}

body.smarthr-auth-page .account-footer {
    margin-top: 22px;
    color: #999;
    font-size: 12px;
    text-align: center;
}

body.smarthr-auth-page .account-footer p {
    margin: 0;
}

body.smarthr-auth-page .smarthr-auth-copyright {
    margin: 22px 0 0;
    color: #999;
    font-size: 12px;
    text-align: center;
}

body.smarthr-auth-page .smarthr-autofill-decoy {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
}

body.smarthr-auth-page .otp-shield {
    display: grid;
    width: 62px;
    height: 62px;
    margin: 0 auto 18px;
    place-items: center;
    border-radius: 50%;
    background: #fff0f1;
    color: #008C82;
    font-size: 28px;
}

body.smarthr-auth-page .otp-inputs {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

body.smarthr-auth-page .otp-inputs .otp-digit {
    width: 100%;
    min-width: 0;
    height: 52px !important;
    padding: 0 !important;
    border-radius: 4px !important;
    font-size: 22px !important;
    font-weight: 500;
    text-align: center;
}

body.smarthr-auth-page .otp-inputs .otp-digit:focus {
    border-color: #008C82 !important;
}

body.smarthr-auth-page .otp-resend-form {
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
    color: #777;
    font-size: 13px;
}

body.smarthr-auth-page .otp-resend-form button {
    padding: 0;
    border: 0;
    background: transparent;
    color: #008C82;
    font-weight: 500;
}

body.smarthr-auth-page .invalid-feedback,
body.smarthr-auth-page .auth-error {
    margin-top: 5px;
    color: #f62d51;
    font-size: 13px;
}

body.smarthr-auth-page .auth-helper {
    margin-top: 6px;
    color: #888;
    font-size: 12px;
    line-height: 1.4;
}

/* Existing OTP, credential, and password views use this adapter. */
body.smarthr-auth-page .auth-flow-page {
    display: grid;
    min-height: 100vh;
    padding: 42px 16px;
    place-items: center;
    width: 100%;
    margin: 0;
}

body.smarthr-auth-page .auth-flow-shell {
    display: block !important;
    width: 100%;
    max-width: 460px !important;
    margin: auto !important;
}

body.smarthr-auth-page .auth-flow-brand {
    display: none !important;
}

body.smarthr-auth-page .auth-flow-panel {
    width: 100% !important;
    max-width: none !important;
    padding: 30px !important;
    border: 1px solid #ededed !important;
    border-radius: 4px !important;
    background: #fff !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12) !important;
}

body.smarthr-auth-page .auth-flow-panel .login-logo {
    margin: 0 auto 14px;
    text-align: center;
}

body.smarthr-auth-page .auth-flow-panel .login-logo img {
    width: 62px;
    height: 62px;
    object-fit: contain;
}

body.smarthr-auth-page .auth-flow-panel .login-header h2 {
    margin-bottom: 5px;
    color: #1f1f1f;
    font-size: 24px;
    font-weight: 500;
}

body.smarthr-auth-page .auth-flow-panel .login-header p {
    margin-bottom: 24px;
    color: #777;
}

body.smarthr-auth-page .auth-secondary-action {
    margin-top: 15px;
    text-align: center;
}

body.smarthr-auth-page .auth-link-button {
    border: 0;
    background: transparent;
    color: #453a94;
    font-weight: 500;
}

body.smarthr-auth-page .auth-page-wrapper {
    min-height: 100vh;
    padding: 0 !important;
    background: #f7f7f7;
}

body.smarthr-auth-page .auth-one-bg-position,
body.smarthr-auth-page .auth-page-wrapper > .footer {
    display: none !important;
}

body.smarthr-auth-page .auth-page-content {
    display: flex;
    min-height: 100vh;
    padding: 35px 16px;
    align-items: center;
    justify-content: center;
}

body.smarthr-auth-page .auth-page-content > .container {
    width: 100%;
}

body.smarthr-auth-page .auth-page-content .card {
    border: 1px solid #ededed;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}

@media (max-width: 575.98px) {
    body.smarthr-auth-page .account-content,
    body.smarthr-auth-page .auth-flow-page,
    body.smarthr-auth-page .auth-page-content {
        padding: 24px 12px;
    }

    body.smarthr-auth-page .account-wrapper,
    body.smarthr-auth-page .auth-flow-panel {
        padding: 22px !important;
    }

    body.smarthr-auth-page .account-brand-copy strong {
        font-size: 17px;
    }
}

/* Campus background on the login page. */
body.smarthr-auth-page.auth-login-page{background:linear-gradient(rgba(15,30,50,.28),rgba(15,30,50,.38)),url('/assets/images/auth-one-bg.png') center center/cover no-repeat fixed!important;min-height:100vh}
.auth-login-page .account-box{background:rgba(255,255,255,.97);box-shadow:0 8px 30px rgba(15,35,66,.15)}
.auth-login-page .auth-system-title{color:#142954}

body.smarthr-auth-page.auth-login-page::before{display:none}

/* Translucent login card with rounded edges. */
body.smarthr-auth-page.auth-login-page .account-box{
    background:rgba(255,255,255,.66)!important;
    border:1px solid rgba(255,255,255,.65)!important;
    border-radius:22px!important;
    overflow:hidden;
    -webkit-backdrop-filter:blur(14px);
    backdrop-filter:blur(14px);
    box-shadow:0 12px 36px rgba(15,35,66,.16);
}
body.smarthr-auth-page.auth-login-page .account-wrapper{background:transparent!important}

/* Clear contrast over the dimmed login background. */
body.smarthr-auth-page.auth-login-page .auth-system-title{color:#fff!important;text-shadow:0 2px 5px rgba(0,0,0,.75)}
body.smarthr-auth-page.auth-login-page .account-footer,body.smarthr-auth-page.auth-login-page .account-footer p{color:#fff!important;text-shadow:0 1px 4px rgba(0,0,0,.85)}
body.smarthr-auth-page.auth-login-page .account-box{color:#142954}
body.smarthr-auth-page.auth-login-page .account-box :is(.account-title,label){color:#142954!important}
body.smarthr-auth-page.auth-login-page .account-box :is(.account-subtitle,.text-muted,.smarthr-auth-divider span){color:#42516a!important}
body.smarthr-auth-page.auth-login-page .account-box .form-control{color:#142954!important;background:#fff!important}
body.smarthr-auth-page.auth-login-page .account-box .form-control::placeholder{color:#5b6b80!important;opacity:1}
body.smarthr-auth-page.auth-login-page .account-box .social-btn{color:#253550!important}

body.smarthr-auth-page.auth-login-page .smarthr-auth-copyright{color:#fff!important;text-shadow:0 1px 4px rgba(0,0,0,.85)}
body.smarthr-auth-page.auth-login-page .account-box .account-footer p{color:#42516a!important;text-shadow:none}

/* Inactive login page requires a fresh page load. */
.login-idle-lock{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(10,23,43,.8);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.login-idle-lock-status{position:absolute;top:20px;left:20px;display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid rgba(255,255,255,.35);border-radius:10px;background:#142954;color:#fff;font-size:14px;font-weight:700}
.login-idle-lock-status{max-width:calc(100% - 40px)}
.login-idle-lock-status svg{flex-shrink:0}
.login-idle-lock-status strong,.login-idle-lock-status span{display:block}
.login-idle-lock-status span{margin-top:4px;font-size:13px;font-weight:400;line-height:1.5}
.login-idle-lock section{width:min(100%,420px);padding:32px;background:#fff;border-radius:20px;text-align:center;color:#142954;box-shadow:0 16px 50px #0004}
.login-idle-lock section>i{font-size:42px;color:#008f83}.login-idle-lock h1{font-size:24px;margin:16px 0 12px}.login-idle-lock p{color:#526580;font-size:14px;line-height:1.7}
.login-idle-lock button{padding:12px 20px;border:0;border-radius:7px;background:#008f83;color:#fff;font-weight:700}.login-idle-lock button:focus-visible{outline:3px solid #80b1ff;outline-offset:3px}

body.smarthr-auth-page.auth-login-page .account-logo img{width:82px!important;height:82px!important;max-width:82px!important;max-height:none;object-fit:contain}

/* Reference login design: campus backdrop and a compact glass panel. */
body.smarthr-auth-page.auth-login-page {
    background:linear-gradient(rgba(12,32,58,.20),rgba(12,32,58,.30)),url('/assets/images/auth-one-bg.png') center/cover no-repeat fixed!important;
}
body.smarthr-auth-page.auth-login-page .account-content { padding:40px 16px 28px; }
body.smarthr-auth-page.auth-login-page .account-content>.container { max-width:560px; }
body.smarthr-auth-page.auth-login-page .account-logo { gap:4px; margin-bottom:16px; }
body.smarthr-auth-page.auth-login-page .account-logo img { width:108px!important; height:108px!important; max-width:108px!important; }
body.smarthr-auth-page.auth-login-page .auth-system-title { font-size:clamp(23px,3vw,34px); font-weight:700; line-height:1.2; text-shadow:0 2px 12px #10284870; }
body.smarthr-auth-page.auth-login-page .account-box { position:relative; isolation:isolate; max-width:480px; border-radius:30px!important; background:rgba(255,255,255,.76)!important; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); box-shadow:0 18px 55px #10284840; }
body.smarthr-auth-page.auth-login-page .account-box::after { content:""; position:absolute; inset:auto -12% -55px; height:125px; z-index:-1; pointer-events:none; border-radius:50%; background:linear-gradient(110deg,#94b8ed80,#e5f1ffb3 55%,#20bbbcb3); transform:rotate(-6deg); }
body.smarthr-auth-page.auth-login-page .account-wrapper { padding:30px 34px 36px; }
body.smarthr-auth-page.auth-login-page .account-title { font-size:36px; font-weight:700; margin-bottom:4px; }
body.smarthr-auth-page.auth-login-page .account-subtitle { margin-bottom:24px; }
body.smarthr-auth-page.auth-login-page .form-group { margin-bottom:18px; }
body.smarthr-auth-page.auth-login-page .form-group label { font-weight:600; }
body.smarthr-auth-page.auth-login-page .input-group-auth { border:1px solid #e0e6ef; background:#fff; border-radius:13px; overflow:hidden; }
body.smarthr-auth-page.auth-login-page .input-group-auth .input-group-text { background:transparent; border:0; width:46px; flex-basis:46px; color:#42516a; font-size:19px; }
body.smarthr-auth-page.auth-login-page .input-group-auth .form-control { height:46px!important; border:0!important; border-radius:0!important; padding-left:10px; }
body.smarthr-auth-page.auth-login-page .input-group-auth:focus-within { outline:2px solid #247be2; outline-offset:2px; }
body.smarthr-auth-page.auth-login-page .password-toggle { color:#42516a; }
body.smarthr-auth-page.auth-login-page a.auth-forgot-password { color:#0061cc!important; font-weight:600; font-size:14px; }
body.smarthr-auth-page.auth-login-page .account-btn { min-height:48px; border:0!important; border-radius:12px!important; background:linear-gradient(105deg,#308ee7,#1957c2 52%,#00aaa4)!important; font-size:18px; font-weight:600; }
body.smarthr-auth-page.auth-login-page .smarthr-auth-divider { margin:18px 0 14px; font-size:12px; }
body.smarthr-auth-page.auth-login-page .social-actions { gap:9px; }
body.smarthr-auth-page.auth-login-page .social-btn { min-height:45px; border-radius:12px!important; background:rgba(255,255,255,.96)!important; font-weight:600; }
body.smarthr-auth-page.auth-login-page .account-footer { margin-top:20px; font-size:12px; }
body.smarthr-auth-page.auth-login-page .smarthr-auth-copyright { margin-top:28px; font-size:13px; }
body.smarthr-auth-page.auth-login-page .asc-auth-theme-control { border-radius:24px; }
@media(max-width:575.98px) {
    body.smarthr-auth-page.auth-login-page .account-content { padding-top:64px; }
    body.smarthr-auth-page.auth-login-page .account-wrapper { padding:26px 22px 32px; }
    body.smarthr-auth-page.auth-login-page .account-logo img { width:86px!important; height:86px!important; max-width:86px!important; }
    body.smarthr-auth-page.auth-login-page .account-title { font-size:30px; }
}
@layer asc-visibility {
    html[data-asc-theme="dark"] body.auth-login-page .account-btn { background:linear-gradient(105deg,#226fc0,#174a9d 52%,#007b77)!important; }
    html[data-asc-theme="dark"] body.auth-login-page .account-box::after { opacity:.22; }
    html[data-asc-theme="dark"] body.auth-login-page .input-group-auth { background:var(--asc-secondary)!important; border-color:var(--asc-border)!important; }
    html[data-asc-theme="dark"] body.auth-login-page .social-btn { background:var(--asc-secondary)!important; color:var(--asc-text)!important; }
    html[data-asc-theme="dark"] body.auth-login-page a.auth-forgot-password { color:var(--asc-link)!important; }
}

.login-idle-lock-status{padding:12px;width:48px;height:48px;justify-content:center}
.login-idle-lock-notice{position:fixed;z-index:11000;bottom:20px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);padding:12px 18px;border:1px solid #cad6e6;border-radius:8px;background:#182b59;color:#fff;box-shadow:0 4px 18px #0003;font:14px/1.5 system-ui,sans-serif}
.login-idle-lock-notice button{margin-left:14px;padding:8px 14px;background:#fff;color:#182b59;border:1px solid #fff}