.elementor-1447 .elementor-element.elementor-element-eee0e11{--display:flex;}/* Start custom CSS for shortcode, class: .elementor-element-fc7111c *//* --- Custom Auth (Login & Register) Styles --- */

/* Wrapper (Applies to both) */
.custom-auth-wrapper {
    max-width: 100%;
    margin: 0 auto;
    padding: 25px 15px;
    font-family: inherit;
}
.custom-auth-wrapper * { box-sizing: border-box; }

/* Labels */
.custom-auth-wrapper .form-group { margin-bottom: 20px !important; position: relative; }

.custom-auth-wrapper label:not(.remember-box) {
    display: block;
    margin-bottom: 8px !important;
    font-weight: 600 !important;
    color: #444; 
    font-size: 14px;
    line-height: 1.2;
}

/* Inputs */
.custom-auth-wrapper input[type="text"],
.custom-auth-wrapper input[type="email"], /* Added Email */
.custom-auth-wrapper input[type="password"] {
    width: 100% !important;
    padding: 14px 16px !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 6px !important;
    background: #fdfdfd !important;
    color: #333 !important;
    font-size: 15px !important;
    height: auto !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
    margin: 0 !important;
}
.custom-auth-wrapper input:focus {
    border-color: #2DA3CE !important;
    background: #fff !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(45, 163, 206, 0.1) !important; 
}

/* Split Row (For Name Fields) */
.form-row-split {
    display: flex;
    gap: 15px;
    width: 100%;
}
.form-row-split .form-group {
    width: 50%;
}

/* Password Toggle */
.password-input-wrapper { position: relative; width: 100%; }
.custom-auth-wrapper input[type="password"] { padding-right: 45px !important; }

.toggle-password-btn {
    position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
    cursor: pointer; color: #999; display: flex; align-items: center;
    background: none; border: none; padding: 5px;
}
.toggle-password-btn:hover { color: #2DA3CE; }

/* Footer & Checkbox */
.custom-auth-wrapper .form-footer-row {
    display: flex !important; justify-content: space-between !important;
    align-items: center !important; margin-bottom: 25px !important;
}
.custom-auth-wrapper .remember-box {
    display: flex; align-items: center; font-size: 14px; color: #666; cursor: pointer; margin: 0 !important;
}
.custom-auth-wrapper .remember-box input { 
    margin-right: 8px !important; width: auto !important; cursor: pointer; accent-color: #2DA3CE; 
}
.custom-auth-wrapper .forgot-link {
    font-size: 14px; color: #888; text-decoration: none; font-weight: 500; transition: all 0.3s ease;
}
.custom-auth-wrapper .forgot-link:hover { color: #2DA3CE; }

/* Main Button */
.custom-auth-wrapper .login-btn {
    width: 100% !important;
    padding: 16px !important;
    background-color: #2DA3CE !important; /* Brand Color */
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer;
    font-size: 16px !important;
    font-weight: 700 !important;
    display: flex; align-items: center; justify-content: center;
    transition: background-color 0.3s ease;
}
.custom-auth-wrapper .login-btn:hover { background-color: #2489ae !important; }
.custom-auth-wrapper .login-btn:disabled { opacity: 0.7; cursor: wait; }

/* Spinner */
.spinner {
    display: inline-block; width: 16px; height: 16px; 
    border: 2px solid rgba(255,255,255,0.3); border-radius: 50%; border-top-color: #fff; 
    animation: spin 0.8s ease-in-out infinite; margin-right: 10px;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Register/Login Link Section */
.custom-auth-wrapper .register-section {
    margin-top: 25px; text-align: center; font-size: 15px; color: #666;
}
.custom-auth-wrapper .register-section a {
    color: #2DA3CE; font-weight: 600; text-decoration: none; margin-left: 5px;
}
.custom-auth-wrapper .register-section a:hover { color: #2489ae; }

/* Messages */
.login-status { display: none; margin-bottom: 20px; font-size: 14px; text-align: center; }
.login-status .error { color: #d63031; background: #fff0f0; padding: 12px; border-radius: 6px; border-left: 4px solid #d63031; }
.login-status .success { color: #27ae60; background: #f0fdf4; padding: 12px; border-radius: 6px; border-left: 4px solid #27ae60; }/* End custom CSS */