/* =========================================
   MyNextJobs - Ultimate Member Sign In Page
   Form ID: 147
========================================= */

/* Sign in page main form wrapper */
.page-id-287 .um-form,
body:not(.logged-in) .um-form form #form_id_147 {
    font-family: inherit !important;
}

/* Center the whole login form */
.page-id-287 .um-form {
    max-width: 460px !important;
    margin: 70px auto 90px !important;
    padding: 0 !important;
}

/* Login card */
.page-id-287 .um-form form {
    background: #ffffff !important;
    border: 1px solid #e7ecf7 !important;
    border-radius: 26px !important;
    padding: 34px !important;
    box-shadow: 0 18px 55px rgba(15, 23, 42, 0.08) !important;
    position: relative !important;
}

/* Modern Sign In Heading */
.page-id-287 .um-form form::before {
    content: "Sign in to MyNextJobs" !important;
    display: block !important;
    text-align: center !important;
    font-size: 30px !important;
    font-weight: 950 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.04em !important;
    margin: 0 auto 28px !important;
    padding: 0 0 20px !important;
    color: transparent !important;
    background-image:
        linear-gradient(135deg, #111827 0%, #2447ff 45%, #6d84ff 100%),
        linear-gradient(90deg, transparent 0%, #2447ff 22%, #6d84ff 50%, #2447ff 78%, transparent 100%);
    background-size: 100% auto, 170px 4px !important;
    background-position: center top, center bottom !important;
    background-repeat: no-repeat !important;
    -webkit-background-clip: text, border-box !important;
    background-clip: text, border-box !important;
    position: relative !important;
}

/* Optional subtitle under the heading */
.page-id-287 .um-row::before {
    content: "Welcome back. Access your dashboard and manage your jobs faster." !important;
    display: block !important;
    text-align: center !important;
    color: #64748b !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    margin: -14px 0 24px !important;
}


/* Row spacing */
.page-id-287 .um-row {
    margin: 0 0 18px !important;
}

/* Field wrapper */
.page-id-287 .um-field {
    margin: 0 0 18px !important;
    padding: 0 !important;
}

/* Labels */
.page-id-287 .um-field-label {
    margin: 0 0 8px !important;
    padding: 0 !important;
}

.page-id-287 .um-field-label label {
    color: #334155 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
}

/* Inputs */
.page-id-287 .um-form-field,
.page-id-287 .um-field-area input[type="text"],
.page-id-287 .um-field-area input[type="password"],
.page-id-287 .um-field-area input[type="email"] {
    width: 100% !important;
    height: 52px !important;
    border: 1px solid #dbe4f3 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #111827 !important;
    padding: 0 16px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    outline: none !important;
    box-shadow: none !important;
    transition: 0.18s ease !important;
}

/* Input focus */
.page-id-287 .um-form-field:focus,
.page-id-287 .um-field-area input:focus {
    border-color: #2447ff !important;
    box-shadow: 0 0 0 4px rgba(36, 71, 255, 0.08) !important;
}

/* Hide honeypot field */
.page-id-287 .um_request_name {
    display: none !important;
}

/* Bottom area */
.page-id-287 .um-col-alt {
    margin: 8px 0 0 !important;
    padding: 0 !important;
}

/* Remember me */
.page-id-287 .um-field-c {
    margin: 0 0 18px !important;
}

.page-id-287 .um-field-checkbox {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    cursor: pointer !important;
    color: #64748b !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.page-id-287 .um-field-checkbox input {
    display: none !important;
}

.page-id-287 .um-field-checkbox-state {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.page-id-287 .um-field-checkbox-state i {
    display: none !important;
}

.page-id-287 .um-field-checkbox input:checked + .um-field-checkbox-state {
    background: #2447ff !important;
    border-color: #2447ff !important;
}

.page-id-287 .um-field-checkbox input:checked + .um-field-checkbox-state::after {
    content: "✓" !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

/* Button columns */
.page-id-287 .um-left.um-half,
.page-id-287 .um-right.um-half {
    width: 48% !important;
    float: left !important;
    margin: 0 !important;
}

.page-id-287 .um-right.um-half {
    float: right !important;
}

/* Sign in button */
.page-id-287 input[type="submit"].um-button,
.page-id-287 .um-button {
    width: 100% !important;
    height: 50px !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #6d84ff, #2447ff) !important;
    color: #ffffff !important;
    border: none !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: 0 14px 30px rgba(36, 71, 255, 0.18) !important;
    cursor: pointer !important;
    transition: 0.18s ease !important;
}

/* Sign up button */
.page-id-287 .um-button.um-alt {
    background: #eef3ff !important;
    color: #2447ff !important;
    border: 1px solid #c7d2fe !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Button hover */
.page-id-287 input[type="submit"].um-button:hover,
.page-id-287 .um-button:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 18px 38px rgba(36, 71, 255, 0.22) !important;
}

.page-id-287 .um-button.um-alt:hover {
    background: #e0e8ff !important;
    box-shadow: none !important;
}

/* Forgot password */
.page-id-287 .um-col-alt-b {
    margin: 24px 0 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

.page-id-287 .um-link-alt {
    color: #64748b !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

.page-id-287 .um-link-alt:hover {
    color: #2447ff !important;
    text-decoration: underline !important;
}

/* Error / notice */
.page-id-287 .um-field-error,
.page-id-287 .um-error,
.page-id-287 .um-notice {
    border-radius: 12px !important;
    padding: 12px 14px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    margin: 10px 0 !important;
}

/* Clear fix */
.page-id-287 .um-clear {
    clear: both !important;
}

/* Mobile */
@media (max-width: 620px) {
    .page-id-287 .um-form {
        max-width: 100% !important;
        margin: 40px auto 70px !important;
        padding: 0 14px !important;
    }

    .page-id-287 .um-form form {
        padding: 26px 20px !important;
        border-radius: 22px !important;
    }

    .page-id-287 .um-form form::before {
        font-size: 25px !important;
        background-size: 100% auto, 135px 4px !important;
    }

    .page-id-287 .um-row::before {
        font-size: 13px !important;
        margin-top: -12px !important;
    }

    .page-id-287 .um-left.um-half,
    .page-id-287 .um-right.um-half {
        width: 100% !important;
        float: none !important;
        margin: 0 0 12px !important;
    }

    .page-id-287 .um-button,
    .page-id-287 input[type="submit"].um-button {
        width: 100% !important;
    }
}


/* =========================================
   MyNextJobs - Ultimate Member Sign Up Page
   Register Form ID: 146
========================================= */

.um-146.um{
    max-width: 720px !important;
}

/* Register form wrapper */
.um-form[data-mode="register"] {
    max-width: 560px !important;
    margin: 70px auto 90px !important;
    padding: 0 !important;
    font-family: inherit !important;
}

/* Register card */
.um-form[data-mode="register"] form {
    background: #ffffff !important;
    border: 1px solid #e7ecf7 !important;
    border-radius: 26px !important;
    padding: 34px !important;
    box-shadow: 0 18px 55px rgba(15, 23, 42, 0.08) !important;
    position: relative !important;
}

/* Modern heading with beautiful underline */
.um-form[data-mode="register"] form::before {
    content: "Create your MyNextJobs account" !important;
    display: block !important;
    max-width: 420px !important;
    text-align: center !important;
    font-size: 28px !important;
    font-weight: 950 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.04em !important;
    margin: 0 auto 28px !important;
    padding: 0 0 20px !important;
    color: transparent !important;
    background-image:
        linear-gradient(135deg, #111827 0%, #2447ff 45%, #6d84ff 100%),
        linear-gradient(90deg, transparent 0%, #2447ff 22%, #6d84ff 50%, #2447ff 78%, transparent 100%);
    background-size: 100% auto, 190px 4px !important;
    background-position: center top, center bottom !important;
    background-repeat: no-repeat !important;
    -webkit-background-clip: text, border-box !important;
    background-clip: text, border-box !important;
}

/* Subtitle */
.um-form[data-mode="register"] .um-row::before {
    content: "Join as a job seeker or employer and start using your dashboard." !important;
    display: block !important;
    text-align: center !important;
    color: #64748b !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    margin: -14px 0 24px !important;
}

/* Row spacing */
.um-form[data-mode="register"] .um-row {
    margin: 0 0 18px !important;
}

/* Field wrapper */
.um-form[data-mode="register"] .um-field {
    margin: 0 0 18px !important;
    padding: 0 !important;
}

/* Labels */
.um-form[data-mode="register"] .um-field-label {
    margin: 0 0 8px !important;
    padding: 0 !important;
}

.um-form[data-mode="register"] .um-field-label label {
    color: #334155 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
}

/* Help icon */
.um-form[data-mode="register"] .um-tip,
.um-form[data-mode="register"] .um-icon-help-circled {
    color: #94a3b8 !important;
    font-size: 14px !important;
}

/* Inputs */
.um-form[data-mode="register"] .um-form-field,
.um-form[data-mode="register"] .um-field-area input[type="text"],
.um-form[data-mode="register"] .um-field-area input[type="email"],
.um-form[data-mode="register"] .um-field-area input[type="password"] {
    width: 100% !important;
    height: 52px !important;
    border: 1px solid #dbe4f3 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #111827 !important;
    padding: 0 16px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    outline: none !important;
    box-shadow: none !important;
    transition: 0.18s ease !important;
}

/* Input focus */
.um-form[data-mode="register"] .um-form-field:focus,
.um-form[data-mode="register"] .um-field-area input:focus {
    border-color: #2447ff !important;
    box-shadow: 0 0 0 4px rgba(36, 71, 255, 0.08) !important;
}

/* Placeholder */
.um-form[data-mode="register"] .um-form-field::placeholder {
    color: #94a3b8 !important;
    font-weight: 500 !important;
}

/* Hide honeypot */
.um-form[data-mode="register"] .um_request_name {
    display: none !important;
}

/* Account Type radio field wrapper */
.um-form[data-mode="register"] .um-field-account_type {
    margin-top: 4px !important;
    margin-bottom: 22px !important;
}

/* Account type label */
.um-form[data-mode="register"] .um-field-account_type > .um-field-label {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    margin-bottom: 12px !important;
}

/* Radio options container */
.um-form[data-mode="register"] .um-field-account_type > .um-field-area {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
}

/* Individual radio cards */
.um-form[data-mode="register"] .um-field-account_type label.um-field-radio {
    float: none !important;
    clear: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 74px !important;
    margin: 0 !important;
    padding: 16px 14px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    color: #334155 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    cursor: pointer !important;
    transition: 0.18s ease !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.03) !important;
}

/* Radio card hover */
.um-form[data-mode="register"] .um-field-account_type label.um-field-radio:hover {
    border-color: #b8c7ff !important;
    background: #f8fbff !important;
    transform: translateY(-1px) !important;
}

/* Selected radio card */
.um-form[data-mode="register"] .um-field-account_type label.um-field-radio.active {
    background: #eef3ff !important;
    border-color: #b8c7ff !important;
    color: #2447ff !important;
    box-shadow: 0 12px 28px rgba(36, 71, 255, 0.10) !important;
}

/* Hide actual radio input */
.um-form[data-mode="register"] .um-field-account_type label.um-field-radio input {
    display: none !important;
}

/* Radio icon */
.um-form[data-mode="register"] .um-field-radio-state {
    position: static !important;
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    border-radius: 50% !important;
    border: 2px solid #cbd5e1 !important;
    background: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
}

.um-form[data-mode="register"] .um-field-radio-state i {
    display: none !important;
}

/* Selected radio dot */
.um-form[data-mode="register"] label.um-field-radio.active .um-field-radio-state {
    border-color: #2447ff !important;
    background: #2447ff !important;
}

.um-form[data-mode="register"] label.um-field-radio.active .um-field-radio-state::after {
    content: "" !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
}

/* Radio option text */
.um-form[data-mode="register"] .um-field-radio-option {
    color: inherit !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    line-height: 1.25 !important;
}

/* Remove UM half float issue */
.um-form[data-mode="register"] .um-field-half,
.um-form[data-mode="register"] .um-field-half.right,
.um-form[data-mode="register"] label.um-field-half,
.um-form[data-mode="register"] label.um-field-half.right {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
}

/* Bottom button area */
.um-form[data-mode="register"] .um-col-alt {
    margin: 8px 0 0 !important;
    padding: 0 !important;
}

/* Button columns */
.um-form[data-mode="register"] .um-left.um-half,
.um-form[data-mode="register"] .um-right.um-half {
    width: 48% !important;
    float: left !important;
    margin: 0 !important;
}

.um-form[data-mode="register"] .um-right.um-half {
    float: right !important;
}

/* Sign up button */
.um-form[data-mode="register"] input[type="submit"].um-button,
.um-form[data-mode="register"] .um-button {
    width: 100% !important;
    height: 50px !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #6d84ff, #2447ff) !important;
    color: #ffffff !important;
    border: none !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: 0 14px 30px rgba(36, 71, 255, 0.18) !important;
    cursor: pointer !important;
    transition: 0.18s ease !important;
}

/* Sign in alternate button */
.um-form[data-mode="register"] .um-button.um-alt {
    background: #eef3ff !important;
    color: #2447ff !important;
    border: 1px solid #c7d2fe !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Hover */
.um-form[data-mode="register"] input[type="submit"].um-button:hover,
.um-form[data-mode="register"] .um-button:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 18px 38px rgba(36, 71, 255, 0.22) !important;
}

.um-form[data-mode="register"] .um-button.um-alt:hover {
    background: #e0e8ff !important;
    box-shadow: none !important;
}

/* Error / notice */
.um-form[data-mode="register"] .um-field-error,
.um-form[data-mode="register"] .um-error,
.um-form[data-mode="register"] .um-notice {
    border-radius: 12px !important;
    padding: 12px 14px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    margin: 10px 0 !important;
}

/* Clear fix */
.um-form[data-mode="register"] .um-clear {
    clear: both !important;
}

/* Mobile */
@media (max-width: 620px) {
    .um-form[data-mode="register"] {
        max-width: 100% !important;
        margin: 40px auto 70px !important;
        padding: 0 14px !important;
    }

    .um-form[data-mode="register"] form {
        padding: 26px 20px !important;
        border-radius: 22px !important;
    }

    .um-form[data-mode="register"] form::before {
        font-size: 24px !important;
        background-size: 100% auto, 145px 4px !important;
    }

    .um-form[data-mode="register"] .um-row::before {
        font-size: 13px !important;
        margin-top: -12px !important;
    }

    .um-form[data-mode="register"] .um-field-account_type > .um-field-area {
        grid-template-columns: 1fr !important;
    }

    .um-form[data-mode="register"] .um-left.um-half,
    .um-form[data-mode="register"] .um-right.um-half {
        width: 100% !important;
        float: none !important;
        margin: 0 0 12px !important;
    }

    .um-form[data-mode="register"] .um-button,
    .um-form[data-mode="register"] input[type="submit"].um-button {
        width: 100% !important;
    }
}