{
  "title": "Login",
  "key": "LOGIN_FORM",
  "fields": [
    {
      "type": "title",
      "label": "Login to Your Account",
      "key": "login_title"
    },
    {
      "type": "html",
      "key": "login_description",
      "html": "<div style='margin-bottom: 20px; color: #666;'>Please enter your credentials to access the identity verification platform.</div>"
    },
    {
      "label": "Email Address",
      "type": "text",
      "key": "email",
      "disabled": false,
      "validators": {
        "required": true,
        "pattern": {
          "key": "IS_EMAIL"
        }
      },
      "properties": {
        "placeholder": "Enter your email address",
        "readOnly": false
      }
    },
    {
      "label": "Password",
      "type": "password",
      "key": "password",
      "disabled": false,
      "validators": {
        "required": true,
        "minLength": 8
      },
      "properties": {
        "placeholder": "Enter your password",
        "readOnly": false,
        "hintContent": "Password must be at least 8 characters long"
      }
    },
    {
      "label": "Remember me",
      "type": "checkbox",
      "key": "rememberMe",
      "disabled": false,
      "validators": {
        "required": false
      },
      "properties": {
        "readOnly": false
      }
    },
    {
      "type": "link",
      "label": "Forgot Password?",
      "key": "forgot_password_link",
      "properties": {
        "href": "#",
        "target": "_self"
      }
    },
    {
      "type": "button",
      "label": "Log In",
      "key": "login_button",
      "properties": {
        "variant": "primary",
        "size": "medium",
        "action": "submit"
      }
    },
    {
      "type": "html",
      "key": "login_alternative",
      "html": "<div style='margin-top: 20px; text-align: center;'><p>Don't have an account? <a href='#' style='color: #0077ff; text-decoration: none;'>Sign up</a></p></div>"
    },
    {
      "type": "html",
      "key": "secure_login_info",
      "html": "<div style='margin-top: 20px; text-align: center; font-size: 12px; color: #999;'><p>🔒 Your connection is secure</p></div>"
    }
  ],
  "layout": {
    "type": "vertical",
    "styles": {
      "container": {
        "maxWidth": "400px",
        "margin": "0 auto",
        "padding": "30px",
        "backgroundColor": "#ffffff",
        "borderRadius": "8px",
        "boxShadow": "0 4px 6px rgba(0, 0, 0, 0.1)"
      }
    }
  }
}
