{
  "widgettype": "VBox",
  "options": {
    "width": "100%",
    "height": "100%",
    "padding": "20px"
  },
  "subwidgets": [
    {
      "widgettype": "Text",
      "options": {
        "text": "Settings",
        "fontSize": "24px",
        "fontWeight": "bold",
        "color": "#F8FAFC",
        "marginBottom": "20px"
      }
    },
    {
      "widgettype": "TabPanel",
      "id": "settings-tabs",
      "options": {
        "width": "100%",
        "height": "calc(100% - 60px)",
        "tabs": [
          {
            "label": "General",
            "content": {
              "widgettype": "VBox",
              "options": {
                "width": "100%",
                "height": "100%",
                "padding": "20px"
              },
              "subwidgets": [
                {
                  "widgettype": "Form",
                  "id": "general-settings-form",
                  "options": {
                    "width": "100%",
                    "maxWidth": "600px",
                    "fields": [
                      {
                        "widgettype": "UiCode",
                        "name": "default-model",
                        "label": "Default AI Model",
                        "placeholder": "Select default model...",
                        "width": "100%",
                        "marginBottom": "16px"
                      },
                      {
                        "widgettype": "UiInt",
                        "name": "session-timeout",
                        "label": "Session Timeout (minutes)",
                        "placeholder": "Enter timeout in minutes...",
                        "width": "100%",
                        "marginBottom": "16px"
                      },
                      {
                        "widgettype": "UiCheck",
                        "name": "auto-save",
                        "label": "Auto-save sessions",
                        "checked": true,
                        "marginBottom": "24px"
                      }
                    ]
                  }
                },
                {
                  "widgettype": "Button",
                  "options": {
                    "label": "Save General Settings",
                    "bgcolor": "#22C55E",
                    "color": "#FFFFFF",
                    "border": "none",
                    "borderRadius": "6px",
                    "padding": "10px 20px",
                    "fontWeight": "600"
                  },
                  "binds": [
                    {
                      "wid": "self",
                      "event": "click",
                      "actiontype": "registerfunction",
                      "target": "app.settings-tabs",
                      "rfname": "save_general_settings",
                      "params": {
                        "form_data": "{{ 'general-settings-form'.data }}"
                      }
                    }
                  ]
                }
              ]
            }
          },
          {
            "label": "AI Models",
            "content": {
              "widgettype": "VBox",
              "options": {
                "width": "100%",
                "height": "100%",
                "padding": "20px"
              },
              "subwidgets": [
                {
                  "widgettype": "Text",
                  "options": {
                    "text": "Configure AI Models",
                    "fontSize": "18px",
                    "fontWeight": "600",
                    "color": "#F8FAFC",
                    "marginBottom": "16px"
                  }
                },
                {
                  "widgettype": "List",
                  "id": "models-list",
                  "options": {
                    "width": "100%",
                    "height": "calc(100% - 80px)",
                    "itemHeight": "120px",
                    "data_url": "/hermes-web-cli/models/list/",
                    "item_template_url": "{{entire_url('model-list-item.ui')}}"
                  }
                },
                {
                  "widgettype": "Button",
                  "options": {
                    "label": "Add New Model",
                    "bgcolor": "#22C55E",
                    "color": "#FFFFFF",
                    "border": "none",
                    "borderRadius": "6px",
                    "padding": "8px 16px",
                    "marginTop": "12px"
                  },
                  "binds": [
                    {
                      "wid": "self",
                      "event": "click",
                      "actiontype": "registerfunction",
                      "target": "app.settings-tabs",
                      "rfname": "add_model",
                      "params": {}
                    }
                  ]
                }
              ]
            }
          },
          {
            "label": "Security",
            "content": {
              "widgettype": "VBox",
              "options": {
                "width": "100%",
                "height": "100%",
                "padding": "20px"
              },
              "subwidgets": [
                {
                  "widgettype": "Text",
                  "options": {
                    "text": "Security Settings",
                    "fontSize": "18px",
                    "fontWeight": "600",
                    "color": "#F8FAFC",
                    "marginBottom": "16px"
                  }
                },
                {
                  "widgettype": "UiCheck",
                  "options": {
                    "name": "require-auth",
                    "label": "Require authentication for API access",
                    "checked": "{{security.require_auth}}",
                    "marginBottom": "12px"
                  }
                },
                {
                  "widgettype": "UiCheck",
                  "options": {
                    "name": "encrypt-storage",
                    "label": "Encrypt local storage",
                    "checked": "{{security.encrypt_storage}}",
                    "marginBottom": "24px"
                  }
                },
                {
                  "widgettype": "Button",
                  "options": {
                    "label": "Save Security Settings",
                    "bgcolor": "#22C55E",
                    "color": "#FFFFFF",
                    "border": "none",
                    "borderRadius": "6px",
                    "padding": "10px 20px",
                    "fontWeight": "600"
                  },
                  "binds": [
                    {
                      "wid": "self",
                      "event": "click",
                      "actiontype": "registerfunction",
                      "target": "app.settings-tabs",
                      "rfname": "save_security_settings",
                      "params": {
                        "require_auth": "{{require-auth.checked}}",
                        "encrypt_storage": "{{encrypt-storage.checked}}"
                      }
                    }
                  ]
                }
              ]
            }
          },
          {
            "label": "Appearance",
            "content": {
              "widgettype": "VBox",
              "options": {
                "width": "100%",
                "height": "100%",
                "padding": "20px"
              },
              "subwidgets": [
                {
                  "widgettype": "Text",
                  "options": {
                    "text": "Appearance Settings",
                    "fontSize": "18px",
                    "fontWeight": "600",
                    "color": "#F8FAFC",
                    "marginBottom": "16px"
                  }
                },
                {
                  "widgettype": "Select",
                  "id": "theme-select",
                  "options": {
                    "label": "Theme",
                    "items": [
                      {"label": "Dark", "value": "dark"},
                      {"label": "Light", "value": "light"},
                      {"label": "System", "value": "system"}
                    ],
                    "value": "dark",
                    "width": "200px",
                    "marginBottom": "24px"
                  }
                },
                {
                  "widgettype": "Button",
                  "options": {
                    "label": "Save Appearance Settings",
                    "bgcolor": "#22C55E",
                    "color": "#FFFFFF",
                    "border": "none",
                    "borderRadius": "6px",
                    "padding": "10px 20px",
                    "fontWeight": "600"
                  },
                  "binds": [
                    {
                      "wid": "self",
                      "event": "click",
                      "actiontype": "registerfunction",
                      "target": "app.settings-tabs",
                      "rfname": "save_appearance_settings",
                      "params": {
                        "theme": "{{theme-select.value}}"
                      }
                    }
                  ]
                }
              ]
            }
          }
        ]
      }
    }
  ]
}