/**
 * Login Page Styles
 * Customizes default WordPress login page
 */

.language-switcher {
    display: none !important;
}

html {
    position: relative;
    overflow: hidden;
}

.login * {
    box-sizing: border-box;
}

.login-details-wrapper img {
    max-width: 100%;
    height: 100vh;
    object-fit: cover;
    border-radius: 45px 0 0 45px;
}

.login .message {
    width: 100%;
    order: 2;
    display: none !important;
}

body.login #login-message,
body.login #login_error {
    width: 100%;
    order: 2;
    margin: 0;
    text-align: center;
}

body.login #login_error a {
    display: none;
}

body.login {
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    position: relative;
    overflow: hidden;
    flex-wrap: wrap;
    padding: 0;
    font-family: Poppins, 'Segoe UI', Roboto, Arial, sans-serif;
    margin: 0;
}

body.login #login {
    width: 100%;
    height: 100vh;
    padding: 0;
    border-radius: 0;
    position: relative;
    background: #fff;
    display: flex;
    flex-wrap: nowrap;
    max-width: none;
    margin: 0;
    box-shadow: none;
    justify-content: flex-end;
}

html .login .button.wp-hide-pw {
    box-shadow: none !important;
    height: 48px !important;
    outline: none !important;
    border: none !important;
}

html body.login .login-icon {
    display: flex;
    height: 14px;
    margin: 0 0 0 5px;
    width: 14px;
}

#login .privacy-policy-page-link,
#login #backtoblog,
#login h1 a,
#login .wp-login-lost-password {
    display: none !important;
}

.wp-login-logo {
    display: none;
}

html .login form {
    margin: 0;
    padding: 0;
    font-weight: 400;
    overflow: hidden;
    background: transparent;
    border: none;
    box-shadow: unset;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

html .login form > p,
html .login form > div {
    width: 100%;
}

html .login form > .forgetmenot {
    width: auto;
    margin: 10px 0 20px !important;
    display: flex;
}

.login form .mo-openid-app-icons {
    justify-content: center;
    display: flex;
    padding: 20px 0;
    flex-wrap: wrap;
    order: 5;
}

.login form .mo-openid-app-icons > p {
    display: none;
}

html .login label {
    font-size: 14px;
    color: #1E655F;
    margin: 8px 0;
    font-weight: 500;
    display: flex;
    align-items: center;
}

html .login form .input,
html .login input[type=password],
html .login input[type=text] {
    border: 1px solid #D1D5DB;
    background: #fff;
    border-radius: 8px;
    padding: 12px 16px;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    font-size: 16px;
    -moz-appearance: none;
    height: 48px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

html .login form .input:focus,
html .login input[type=password]:focus,
html .login input[type=text]:focus {
    border-color: #1E655F;
    box-shadow: 0 0 0 3px rgba(30, 101, 95, 0.1);
    outline: none;
}

.custom-login-form-container {
    width: 50%;
    max-width: 400px;
    min-width: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px !important;
    background: #fff;
}

.custom-login-form-wrapper {
    width: 100%;
    max-width: 400px;
}

.login-details-wrapper.hide-on-mobile h2 {
    font-size: 20px;
    color: #000;
    text-align: center;
    font-weight: 400;
    margin: 0 0 10px;
    line-height: 1.2;
}

.login input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #1E655F;
}

.login input[type=checkbox]:checked::before {
    margin: 0;
    height: auto;
    width: 18px;
}

.login .forgetmenot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 16px 0 24px 0;
}

.login .forgetmenot label {
    display: flex;
    align-items: center;
    font-weight: 400;
    margin: 0;
    color: #000 !important;
    font-size: 14px;
}

.login .forgetmenot input[type="checkbox"] {
    margin-right: 8px;
    margin-top: 0;
}

html .login .submit input,
html .wp-core-ui .button-group.button-large .button,
html .wp-core-ui .button.button-large {
    background: #1E655F;
    padding: 14px 24px;
    border-radius: 8px;
    font-size: 1rem;
    color: #fff;
    border: none;
    display: flex;
    outline: 0;
    justify-content: center;
    align-items: center;
    font-weight: 600;
    width: 100%;
    cursor: pointer;
    margin: 0;
    box-shadow: none !important;
    transition: background-color 0.2s ease;
    line-height: 1.2;
}

.login .submit input:hover,
.login .submit input:focus {
    background: #FCD018 !important;
    color: #000 !important;
}

.login #nav,
.login #backtoblog {
    text-align: center;
}

html .login #nav {
    position: absolute;
    right: 20px;
    bottom: 30px;
    display: none;
}

.login #nav a,
.login #backtoblog a {
    color: #1E655F;
    text-decoration: none;
}

.login #nav a:hover,
.login #backtoblog a:hover {
    text-decoration: underline;
}

.login-message,
.message {
    border-left: 4px solid #1E655F;
}

/* Custom Heading & Subtext */
html .login .custom-login-heading {
    font-size: 32px;
    color: #111827;
    text-align: left;
    font-weight: 500;
    margin: 0 0 8px;
    line-height: 1.2;
}

html .login .custom-login-subtext {
    font-size: 16px;
    color: #6B7280;
    line-height: 1.5;
    margin: 0 0 32px;
    text-align: left;
}

.lost-password {
    color: #1E655F;
    font-size: 14px;
    text-decoration: none !important;
    font-weight: 500;
}

.lost-password:hover {
    text-decoration: underline !important;
}

.login-links {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 0 0 !important;
    color: #000;
    font-size: 14px;
}

.login-links a {
    color: #1E655F;
    text-decoration: none !important;
    padding: 0 5px;
    font-weight: 500;
}

.login-links a:hover {
    text-decoration: underline !important;
}

.login .notice-error {
    border-left-color: #DC2626;
    color: #DC2626;
    background: #FEF2F2;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}

.custom-login-left {
    width: 50%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0;
    height: 100vh;
    position: relative;
    overflow: hidden;
}

#login form p.submit {
    margin: 0;
    padding: 0;
    display: flex;
    width: 100%;
}

.login-details-wrapper.hide-on-mobile {
    text-align: right;
    width: 100%;
    height: 100%;
}

.show-on-mobile {
    display: none;
}

/* Lost Password Form */
#lost-password-form {
    flex-wrap: wrap;
    padding: 20px;
    margin-top: 20px;
    background: #f9f9f9;
    border-radius: 8px;
}

#lost-password-form h3 {
    margin-top: 0;
    color: #333;
}

#lost-password-form p {
    margin: 10px 0;
    color: #666;
    font-size: 14px;
}

#lost-password-form label {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
}

#lost-password-form input[type="email"] {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 3px;
}

#lost-password-form button {
    background: #1E655F;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 3px;
    cursor: pointer;
    margin-right: 10px;
}

#lost-password-form button:hover {
    background: #FCD018;
    color: #000;
}

#cancel-reset {
    background: #666 !important;
}

#cancel-reset:hover {
    background: #555 !important;
    color: #fff !important;
}

#reset-message {
    margin-top: 15px;
    padding: 10px;
    border-radius: 3px;
    display: none;
}
.mo_btn-social {
    position: relative;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    padding: 10px !important;
    height: auto !important;
    max-height: unset !important;
    transform: unset !important;
}
.mo_btn-social:hover{
    opacity: .8 !important;
    border-color: #1E655F !important;
}
.mo_btn-social>i {
    margin: 0 10px 0 0 !important;
    position: relative !important;
}
/* Disable number input spinner arrows and default styling */
#jetpack_protect_answer {
  -moz-appearance: textfield; /* Firefox */
  appearance: textfield; /* Modern browsers */
  border: 1px solid #ccc; /* Custom border if you want */
  border-radius: 4px;
  padding: 6px 10px;
  outline: none;
}

/* Remove spinner arrows (Chrome, Safari, Edge, Opera) */
#jetpack_protect_answer::-webkit-outer-spin-button,
#jetpack_protect_answer::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Jetpack Protect – Clean Style */
#jetpack_protect_answer {
  width: 60px !important;
  height: 36px !important;
  font-size: 15px !important;
  text-align: center;
  border: 1px solid #ccc !important;
  border-radius: 6px !important;
  outline: none !important;
  box-shadow: none !important;
  -moz-appearance: textfield !important;
  appearance: textfield !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease; 
}

/* Remove spinner arrows (Chrome, Edge, Safari) */
#jetpack_protect_answer::-webkit-outer-spin-button,
#jetpack_protect_answer::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* On focus */
#jetpack_protect_answer:focus {
  border-color: #007cba !important; /* match WP blue */
  box-shadow: 0 0 0 2px rgba(0, 124, 186, 0.15);
}

/* Jetpack Protect Math Label */
label[for="jetpack_protect_answer"] {
  display: inline-flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 6px; /* space between numbers and symbols */
  font-size: 15px;
  font-weight: 500;
  color: #004f4f; /* adjust to match your site theme */
  margin-right: 6px;
  vertical-align: middle;
  max-width: 120px;
}

/* Container adjustments */
#jetpack-protect,
div[style*="jetpack_protect_answer"] {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 5px;
}
.auth-logo-section {
    display: flex;
    align-items: center;
    justify-content: center;
}
.auth-logo-section img{
    max-width: 200px;
}
/* Responsive */
@media (max-width: 768px) {
    body.login {
        overflow: auto;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: flex-start;
    }

    html .login .custom-login-subtext {
        font-size: 14px;
    }

    .hide-on-mobile {
        display: none !important;
    }

    .show-on-mobile {
        display: block;
    }

    .custom-login-form-container {
        width: 100%;
        padding: 0 !important;
    }

    .custom-login-left {
        display: none;
    }

    body.login #login {
        flex-direction: row;
        height: auto;
        min-height: unset;
        flex-wrap: wrap;
        justify-content: center;
        padding: 30px 15px;
        min-height: 100%;
    }

    html .login .custom-login-heading {
        text-align: center;
    }

    html .login .custom-login-subtext {
        text-align: center;
    }
}
.custom-auth-wrapper .button {
	background: #10446c !important;
}