/**
 * WP User Frontend Pro - Login Form Layouts
 *
 * Static CSS for all 7 login form layouts.
 * Dynamic colors are applied via inline CSS in Login_Form_Settings.php
 *
 * @package WP User Frontend Pro
 * @since 1.0.0
 */

/* ==========================================================================
   Base Login Form Styles (All Layouts)
   ========================================================================== */

#wpuf-login-form {
    all: unset;
    display: block;
    box-sizing: border-box;
    margin: 0 auto;
}

#wpuf-login-form * {
    box-sizing: border-box;
}

#wpuf-login-form p {
    margin: 0 0 15px 0;
}

/* Login Form Header */
#wpuf-login-form .wpuf-login-header {
    margin-bottom: 30px;
}

#wpuf-login-form .wpuf-login-title {
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 700;
    font-size: 30px;
    line-height: 36px;
    text-align: center;
    margin: 0 0 10px 0;
}

#wpuf-login-form .wpuf-login-subtitle {
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    text-align: center;
    margin: 0;
}

/* Form Labels */
#wpuf-login-form label {
    display: block;
}

/* Form Inputs */
#wpuf-login-form input[type='text'],
#wpuf-login-form input[type='password'],
#wpuf-login-form input[type='email'] {
    padding: 10px;
    width: 100%;
}

/* Submit Buttons */
#wpuf-login-form input[type='submit'],
#wpuf-login-form button[type='submit'] {
    padding: 12px 30px;
    cursor: pointer;
    width: 100%;
}

#wpuf-login-form input[type='submit']:hover,
#wpuf-login-form button[type='submit']:hover {
    opacity: 0.9;
}

/* Description/Help Text */
#wpuf-login-form .description {
    font-size: 0.9em;
}

/* Remember Me and Lost Password Layout */
#wpuf-login-form .wpuf-remember-forgot-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 24px 0;
}

#wpuf-login-form .wpuf-remember-me {
    display: flex;
    align-items: center;
    gap: 8px;
}

#wpuf-login-form .wpuf-remember-me input[type='checkbox'] {
    width: auto;
    margin: 0;
}

#wpuf-login-form .wpuf-remember-me label {
    margin: 0;
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 20px;
    cursor: pointer;
}

#wpuf-login-form .wpuf-lost-password a {
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 20px;
    text-decoration: none;
}

#wpuf-login-form .wpuf-lost-password a:hover {
    text-decoration: underline;
}

/* ==========================================================================
   Layout 1 & 2 - Minimal/Modern Dark (Shared Styles)
   ========================================================================== */

#wpuf-login-form.wpuf-layout-1,
#wpuf-login-form.wpuf-layout-2 {
    padding: 30px;
}

#wpuf-login-form.wpuf-layout-1 .wpuf-login-header,
#wpuf-login-form.wpuf-layout-2 .wpuf-login-header {
    margin-bottom: 54px;
}

#wpuf-login-form.wpuf-layout-1 label:not(.forgetmenot label):not(.wpuf-rememberme label),
#wpuf-login-form.wpuf-layout-2 label:not(.forgetmenot label):not(.wpuf-rememberme label) {
    display: none !important;
}

#wpuf-login-form.wpuf-layout-1 label,
#wpuf-login-form.wpuf-layout-2 label {
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 16px;
    line-height: 24px;
}

#wpuf-login-form.wpuf-layout-1 form p,
#wpuf-login-form.wpuf-layout-2 form p {
    margin-bottom: 15px;
}

#wpuf-login-form.wpuf-layout-1 form p:has(input[type='text']),
#wpuf-login-form.wpuf-layout-1 form p:has(input[type='email']),
#wpuf-login-form.wpuf-layout-2 form p:has(input[type='text']),
#wpuf-login-form.wpuf-layout-2 form p:has(input[type='email']) {
    margin-bottom: 54px;
}

#wpuf-login-form.wpuf-layout-1 input[type='text'],
#wpuf-login-form.wpuf-layout-1 input[type='password'],
#wpuf-login-form.wpuf-layout-1 input[type='email'],
#wpuf-login-form.wpuf-layout-2 input[type='text'],
#wpuf-login-form.wpuf-layout-2 input[type='password'],
#wpuf-login-form.wpuf-layout-2 input[type='email'] {
    border: none;
    border-bottom: 1px solid;
    border-radius: 0;
    padding: 10px 0;
    max-width: 398px;
    font-family: Inter, sans-serif;
    font-size: 16px;
    outline: none;
    box-shadow: none;
}

#wpuf-login-form.wpuf-layout-1 input:focus,
#wpuf-login-form.wpuf-layout-2 input:focus {
    outline: none;
    box-shadow: none;
}

#wpuf-login-form.wpuf-layout-1 input::placeholder,
#wpuf-login-form.wpuf-layout-2 input::placeholder {
    font-family: Inter, sans-serif;
    font-size: 16px;
}

#wpuf-login-form.wpuf-layout-1 input[type='submit'],
#wpuf-login-form.wpuf-layout-1 button[type='submit'],
#wpuf-login-form.wpuf-layout-2 input[type='submit'],
#wpuf-login-form.wpuf-layout-2 button[type='submit'] {
    width: auto;
    min-width: 100px;
    height: 44px;
    border-radius: 85px;
    padding: 10px 32px;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    display: block;
    margin: 54px auto 0;
    font-family: Inter, sans-serif;
    font-weight: 500;
    font-size: 16px;
}

#wpuf-login-form.wpuf-layout-1 input[type='submit']:hover,
#wpuf-login-form.wpuf-layout-1 button[type='submit']:hover,
#wpuf-login-form.wpuf-layout-2 input[type='submit']:hover,
#wpuf-login-form.wpuf-layout-2 button[type='submit']:hover {
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
    opacity: 1;
}

#wpuf-login-form.wpuf-layout-1 .forgetmenot,
#wpuf-login-form.wpuf-layout-1 .wpuf-rememberme,
#wpuf-login-form.wpuf-layout-2 .forgetmenot,
#wpuf-login-form.wpuf-layout-2 .wpuf-rememberme {
    margin: 15px 0;
    text-align: center;
}

#wpuf-login-form.wpuf-layout-1 .forgetmenot label,
#wpuf-login-form.wpuf-layout-1 .wpuf-rememberme label,
#wpuf-login-form.wpuf-layout-2 .forgetmenot label,
#wpuf-login-form.wpuf-layout-2 .wpuf-rememberme label {
    display: inline-block !important;
    font-size: 14px;
    font-weight: 300;
}

#wpuf-login-form.wpuf-layout-1 .wpuf-lost-password-wrapper,
#wpuf-login-form.wpuf-layout-2 .wpuf-lost-password-wrapper {
    text-align: center;
    margin-top: 20px;
}

#wpuf-login-form.wpuf-layout-1 .wpuf-lost-password-wrapper a,
#wpuf-login-form.wpuf-layout-2 .wpuf-lost-password-wrapper a {
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 300;
    text-decoration: none;
}

#wpuf-login-form.wpuf-layout-1 .wpuf-lost-password-wrapper a:hover,
#wpuf-login-form.wpuf-layout-2 .wpuf-lost-password-wrapper a:hover {
    text-decoration: underline;
}

/* ==========================================================================
   Layout 3 & 4 - Minimal/Bordered (Shared Styles)
   ========================================================================== */

#wpuf-login-form.wpuf-layout-3,
#wpuf-login-form.wpuf-layout-4 {
    padding: 30px;
}

#wpuf-login-form.wpuf-layout-3 .wpuf-login-header,
#wpuf-login-form.wpuf-layout-4 .wpuf-login-header {
    margin-bottom: 54px;
}

#wpuf-login-form.wpuf-layout-3 label,
#wpuf-login-form.wpuf-layout-4 label {
    display: block !important;
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 16px;
    line-height: 24px;
}

#wpuf-login-form.wpuf-layout-3 form p,
#wpuf-login-form.wpuf-layout-4 form p {
    margin-bottom: 15px;
}

#wpuf-login-form.wpuf-layout-3 form p:has(input[type='text']),
#wpuf-login-form.wpuf-layout-3 form p:has(input[type='email']),
#wpuf-login-form.wpuf-layout-4 form p:has(input[type='text']),
#wpuf-login-form.wpuf-layout-4 form p:has(input[type='email']) {
    margin-bottom: 54px;
}

#wpuf-login-form.wpuf-layout-3 input[type='text'],
#wpuf-login-form.wpuf-layout-3 input[type='password'],
#wpuf-login-form.wpuf-layout-3 input[type='email'] {
    border: none;
    border-bottom: 1px solid;
    border-radius: 0;
    padding: 10px 0;
    max-width: 653px;
    font-family: Inter, sans-serif;
    font-size: 16px;
    outline: none;
    box-shadow: none;
}

#wpuf-login-form.wpuf-layout-4 input[type='text'],
#wpuf-login-form.wpuf-layout-4 input[type='password'],
#wpuf-login-form.wpuf-layout-4 input[type='email'] {
    border: none;
    border-bottom: 1px solid;
    border-radius: 0;
    padding: 10px 0;
    width: 100%;
    font-family: Inter, sans-serif;
    font-size: 16px;
    outline: none;
    box-shadow: none;
}

#wpuf-login-form.wpuf-layout-3 input:focus,
#wpuf-login-form.wpuf-layout-4 input:focus {
    outline: none;
    box-shadow: none;
}

#wpuf-login-form.wpuf-layout-3 input::placeholder,
#wpuf-login-form.wpuf-layout-4 input::placeholder {
    font-family: Inter, sans-serif;
    font-size: 16px;
}

#wpuf-login-form.wpuf-layout-3 input[type='submit'],
#wpuf-login-form.wpuf-layout-3 button[type='submit'],
#wpuf-login-form.wpuf-layout-4 input[type='submit'],
#wpuf-login-form.wpuf-layout-4 button[type='submit'] {
    width: auto;
    min-width: 100px;
    height: 44px;
    border-radius: 85px;
    padding: 10px 32px;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    display: block;
    margin: 54px auto 0;
    font-family: Inter, sans-serif;
    font-weight: 500;
    font-size: 16px;
}

#wpuf-login-form.wpuf-layout-3 input[type='submit']:hover,
#wpuf-login-form.wpuf-layout-3 button[type='submit']:hover,
#wpuf-login-form.wpuf-layout-4 input[type='submit']:hover,
#wpuf-login-form.wpuf-layout-4 button[type='submit']:hover {
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
    opacity: 1;
}

#wpuf-login-form.wpuf-layout-3 .forgetmenot,
#wpuf-login-form.wpuf-layout-3 .wpuf-rememberme,
#wpuf-login-form.wpuf-layout-4 .forgetmenot,
#wpuf-login-form.wpuf-layout-4 .wpuf-rememberme {
    margin: 15px 0;
    text-align: center;
}

#wpuf-login-form.wpuf-layout-3 .forgetmenot label,
#wpuf-login-form.wpuf-layout-3 .wpuf-rememberme label,
#wpuf-login-form.wpuf-layout-4 .forgetmenot label,
#wpuf-login-form.wpuf-layout-4 .wpuf-rememberme label {
    display: inline-block !important;
    font-size: 14px;
    font-weight: 300;
}

#wpuf-login-form.wpuf-layout-3 .wpuf-lost-password-wrapper,
#wpuf-login-form.wpuf-layout-4 .wpuf-lost-password-wrapper {
    text-align: center;
    margin-top: 20px;
}

#wpuf-login-form.wpuf-layout-3 .wpuf-lost-password-wrapper a,
#wpuf-login-form.wpuf-layout-4 .wpuf-lost-password-wrapper a {
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 300;
    text-decoration: none;
}

#wpuf-login-form.wpuf-layout-3 .wpuf-lost-password-wrapper a:hover,
#wpuf-login-form.wpuf-layout-4 .wpuf-lost-password-wrapper a:hover {
    text-decoration: underline;
}

/* Layout 4 Specific - Bordered Container */
#wpuf-login-form.wpuf-layout-4 {
    border: none;
}

#wpuf-login-form.wpuf-layout-4 form {
    border: 1px solid #D8DFEB;
    border-radius: 20px;
    padding: 40px;
    max-width: 653px;
    margin: 0 auto;
    background: transparent;
}

/* ==========================================================================
   Layout 5, 6, 7 - Rounded Inputs (Shared Styles)
   ========================================================================== */

#wpuf-login-form.wpuf-layout-5,
#wpuf-login-form.wpuf-layout-6,
#wpuf-login-form.wpuf-layout-7 {
    padding: 30px;
}

#wpuf-login-form.wpuf-layout-5 .wpuf-login-header,
#wpuf-login-form.wpuf-layout-6 .wpuf-login-header,
#wpuf-login-form.wpuf-layout-7 .wpuf-login-header {
    margin-bottom: 36px;
}

#wpuf-login-form.wpuf-layout-5 label,
#wpuf-login-form.wpuf-layout-6 label,
#wpuf-login-form.wpuf-layout-7 label {
    display: block !important;
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 10px;
}

#wpuf-login-form.wpuf-layout-5 form p,
#wpuf-login-form.wpuf-layout-6 form p,
#wpuf-login-form.wpuf-layout-7 form p {
    margin-bottom: 15px;
}

#wpuf-login-form.wpuf-layout-5 form p:has(input[type='text']),
#wpuf-login-form.wpuf-layout-5 form p:has(input[type='email']),
#wpuf-login-form.wpuf-layout-6 form p:has(input[type='text']),
#wpuf-login-form.wpuf-layout-6 form p:has(input[type='email']),
#wpuf-login-form.wpuf-layout-7 form p:has(input[type='text']),
#wpuf-login-form.wpuf-layout-7 form p:has(input[type='email']) {
    margin-bottom: 54px;
}

#wpuf-login-form.wpuf-layout-5 input[type='text'],
#wpuf-login-form.wpuf-layout-5 input[type='password'],
#wpuf-login-form.wpuf-layout-5 input[type='email'],
#wpuf-login-form.wpuf-layout-6 input[type='text'],
#wpuf-login-form.wpuf-layout-6 input[type='password'],
#wpuf-login-form.wpuf-layout-6 input[type='email'],
#wpuf-login-form.wpuf-layout-7 input[type='text'],
#wpuf-login-form.wpuf-layout-7 input[type='password'],
#wpuf-login-form.wpuf-layout-7 input[type='email'] {
    border: 1px solid;
    width: 653px;
    font-family: Inter, sans-serif;
    font-size: 16px;
    outline: none;
    box-shadow: none;
    margin: 0 auto;
    display: block;
}

#wpuf-login-form.wpuf-layout-5 input:focus,
#wpuf-login-form.wpuf-layout-6 input:focus,
#wpuf-login-form.wpuf-layout-7 input:focus {
    outline: none;
    box-shadow: none;
    border: 1px solid;
}

#wpuf-login-form.wpuf-layout-5 input::placeholder,
#wpuf-login-form.wpuf-layout-6 input::placeholder,
#wpuf-login-form.wpuf-layout-7 input::placeholder {
    font-family: Inter, sans-serif;
    font-size: 16px;
}

#wpuf-login-form.wpuf-layout-5 input[type='submit'],
#wpuf-login-form.wpuf-layout-5 button[type='submit'],
#wpuf-login-form.wpuf-layout-6 input[type='submit'],
#wpuf-login-form.wpuf-layout-6 button[type='submit'],
#wpuf-login-form.wpuf-layout-7 input[type='submit'],
#wpuf-login-form.wpuf-layout-7 button[type='submit'] {
    width: auto;
    min-width: 100px;
    height: 44px;
    padding: 10px 32px;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease;
    display: block;
    margin: 54px auto 0;
    font-family: Inter, sans-serif;
    font-weight: 500;
    font-size: 16px;
}

#wpuf-login-form.wpuf-layout-5 input[type='submit']:hover,
#wpuf-login-form.wpuf-layout-5 button[type='submit']:hover,
#wpuf-login-form.wpuf-layout-6 input[type='submit']:hover,
#wpuf-login-form.wpuf-layout-6 button[type='submit']:hover,
#wpuf-login-form.wpuf-layout-7 input[type='submit']:hover,
#wpuf-login-form.wpuf-layout-7 button[type='submit']:hover {
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
    transform: translateY(-1px);
    opacity: 1;
}

#wpuf-login-form.wpuf-layout-5 .forgetmenot,
#wpuf-login-form.wpuf-layout-5 .wpuf-rememberme,
#wpuf-login-form.wpuf-layout-6 .forgetmenot,
#wpuf-login-form.wpuf-layout-6 .wpuf-rememberme,
#wpuf-login-form.wpuf-layout-7 .forgetmenot,
#wpuf-login-form.wpuf-layout-7 .wpuf-rememberme {
    margin: 15px 0;
    text-align: center;
}

#wpuf-login-form.wpuf-layout-5 .forgetmenot label,
#wpuf-login-form.wpuf-layout-5 .wpuf-rememberme label,
#wpuf-login-form.wpuf-layout-6 .forgetmenot label,
#wpuf-login-form.wpuf-layout-6 .wpuf-rememberme label,
#wpuf-login-form.wpuf-layout-7 .forgetmenot label,
#wpuf-login-form.wpuf-layout-7 .wpuf-rememberme label {
    display: inline-block !important;
    font-size: 14px;
    font-weight: 300;
}

#wpuf-login-form.wpuf-layout-5 .wpuf-lost-password-wrapper,
#wpuf-login-form.wpuf-layout-6 .wpuf-lost-password-wrapper,
#wpuf-login-form.wpuf-layout-7 .wpuf-lost-password-wrapper {
    text-align: center;
    margin-top: 20px;
}

#wpuf-login-form.wpuf-layout-5 .wpuf-lost-password-wrapper a,
#wpuf-login-form.wpuf-layout-6 .wpuf-lost-password-wrapper a,
#wpuf-login-form.wpuf-layout-7 .wpuf-lost-password-wrapper a {
    font-family: Inter, sans-serif;
    font-size: 14px;
    font-weight: 300;
    text-decoration: none;
}

#wpuf-login-form.wpuf-layout-5 .wpuf-lost-password-wrapper a:hover,
#wpuf-login-form.wpuf-layout-6 .wpuf-lost-password-wrapper a:hover,
#wpuf-login-form.wpuf-layout-7 .wpuf-lost-password-wrapper a:hover {
    text-decoration: underline;
}

/* Layout 5 Specific - Rounded corners */
#wpuf-login-form.wpuf-layout-5 input[type='text'],
#wpuf-login-form.wpuf-layout-5 input[type='password'],
#wpuf-login-form.wpuf-layout-5 input[type='email'] {
    border-radius: 10px;
    padding: 12px 16px;
}

#wpuf-login-form.wpuf-layout-5 input[type='submit'],
#wpuf-login-form.wpuf-layout-5 button[type='submit'] {
    border-radius: 10px;
}

/* Layout 6 Specific - No border radius, more padding */
#wpuf-login-form.wpuf-layout-6 input[type='text'],
#wpuf-login-form.wpuf-layout-6 input[type='password'],
#wpuf-login-form.wpuf-layout-6 input[type='email'] {
    border-radius: 0;
    padding: 16px 24px;
}

#wpuf-login-form.wpuf-layout-6 input[type='submit'],
#wpuf-login-form.wpuf-layout-6 button[type='submit'] {
    border-radius: 10px;
}

/* Layout 7 Specific - Rounded with help text */
#wpuf-login-form.wpuf-layout-7 input[type='text'],
#wpuf-login-form.wpuf-layout-7 input[type='password'],
#wpuf-login-form.wpuf-layout-7 input[type='email'] {
    border-radius: 10px;
    padding: 12px 16px;
    height: 48px;
}

#wpuf-login-form.wpuf-layout-7 input[type='submit'],
#wpuf-login-form.wpuf-layout-7 button[type='submit'] {
    border-radius: 10px;
}

#wpuf-login-form.wpuf-layout-7 .wpuf-help {
    font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-weight: 400;
    font-style: italic;
    font-size: 16px;
    line-height: 24px;
    color: #9CA3AF;
    margin-top: 8px;
    display: block;
    text-align: left;
}
