/********************************************************
+*   (c) Mojang. All rights reserved                       *
+*   (c) Microsoft. All rights reserved.                   *
+*********************************************************/

{
  "namespace": "common_buttons",

  /////////////////////////////////
  //
  //  BUTTON CONTROLS
  //
  /////////////////////////////////

  "button_image": {
    "type": "image",
    "layer": 1,
    "texture": "$new_ui_button_texture",
    "$button_alpha|default": "$content_alpha",
    "alpha": "$button_alpha",
    "$button_image_bindings|default": [],
    "bindings": "$button_image_bindings"
  },

  "background_button_image": {
    "type": "image",
    "layer": 1,
    "texture": "textures/ui/button_borderless_imagelesshoverbg",
    "alpha": "$content_alpha"
  },

  "locked_button_image": {
    "type": "image",
    "layer": 1,
    "texture": "$new_ui_button_texture",
    "alpha": "$content_alpha"
  },

  "light_button_assets@common.button": {
    "$default_button_texture|default": "textures/ui/button_borderless_light",
    "$default_content_alpha|default": 1,
    "$hover_content_alpha|default": 1,
    "$hover_button_texture|default": "textures/ui/button_borderless_lighthover",
    "$pressed_button_texture|default": "textures/ui/button_borderless_lightpressed",
    "$locked_button_texture|default": "textures/ui/disabledButtonNoBorder",

    "locked_control": "locked",

    "$default_font|default": "default",
    "$font_type": "$default_font",
    "$locked_alpha": 1
  },

  "dark_button_assets@common.button": {
    "$default_button_texture|default": "textures/ui/button_borderless_dark",
    "$hover_button_texture|default": "textures/ui/button_borderless_darkhover",
    "$pressed_button_texture|default": "textures/ui/button_borderless_darkpressed",
    "$locked_button_texture|default": "textures/ui/disabledButtonNoBorder",

    "locked_control": "locked",

    "$locked_alpha": 1
  },

  "focus_border": {
    "$focus_border_texture|default": "textures/ui/focus_border_white",
    "$focus_border_size|default": [ "100%", "100%" ],
    "size": "$focus_border_size",
    "type": "image",
    "texture": "$focus_border_texture"
  },

  "new_ui_button_panel": {
    "type": "panel",
    "$button_alpha|default": 1,
    "layer": 1,
    "$button_size_override|default": [ "100%", "100%" ],
    "size": "$button_size_override",
    "$content_alpha|default": 1,
    "$button_image|default": "common_buttons.button_image",
    "$button_image_visible|default": true,
    "$button_image_size|default": [ "100% - 2px", "100% - 2px" ],
    "$image_anchor|default": "center",
    "$image_offset|default": [ 0, 0 ],
    "$border_visible|default": true,
    "$border_alpha|default": 1,
    "$button_anchor_to|default": "center",
    "$button_anchor_from|default": "center",
    "anchor_to": "$button_anchor_to",
    "anchor_from": "$button_anchor_from",
    "$button_image_fill|default": false,
    "$button_image_color|default": [ 1.0, 1.0, 1.0 ],
    "controls": [
      {
        "$button_image@$button_image": {
          "ignored": "(not $button_image_visible)",
          "size": "$button_image_size",
          "offset": "$image_offset",
          "anchor_from": "$image_anchor",
          "anchor_to": "$image_anchor",
          "layer": 1,
          "fill": "$button_image_fill",
          "color": "$button_image_color"
        }
      },
      {
        "button_content": {
          "type": "panel",
          "$button_content_size|default": [ "100% - 6px", "100% - 6px" ],
          "size": "$button_content_size",

          "controls": [
            {
              "$button_type_panel@$button_type_panel": {
                "layer": 3
              }
            }
          ]
        }
      },
      {
        "border@common_buttons.focus_border": {
          "color": "$border_color",
          "layer": "$border_layer",
          "alpha": "$border_alpha",
          "ignored": "(not $border_visible)"
        }
      }
    ]
  },

  "new_ui_form_fitting_button_panel": {
    "type": "panel",
    "layer": 1,
    "size": "$button_size_override",
    "$button_size_override|default": [ "100%c", "100%c" ],
    "$focus_border_size_override|default": [ "100%c + 2px", "100%c + 2px" ],
    "$button_image_size_override|default": [ "100%c + 2px", "100%c + 2px" ],
    "$button_content_size_override|default": [ "100%c + 6px", "100%c + 6px" ],

    "$content_alpha|default": 1,
    "anchor_from": "$anchor",
    "anchor_to": "$anchor",
    "controls": [
      {
        "border@common_buttons.focus_border": {
          "color": "$border_color",
          "layer": "$border_layer",
          "size": "$focus_border_size_override",
          "$button_image|default": "common_buttons.button_image",
          "controls": [
            {
              "$button_image@$button_image": {
                "size": "$button_image_size_override",
                "$form_fitting_min_size|default": [ 0, 0 ],
                "min_size": "$form_fitting_min_size",
                "layer": 1,
                "controls": [
                  {
                    "button_content": {
                      "type": "panel",
                      "size": "$button_content_size_override",
                      "controls": [
                        {
                          "$button_type_panel@$button_type_panel": {
                            "layer": 3
                          }
                        }
                      ]
                    }
                  }
                ]
              }
            }
          ]
        }
      }
    ]
  },

  "new_ui_width_fitting_button_panel": {
    "type": "panel",
    "layer": 1,
    "$button_size_override|default": [ "100%c", "100%" ],
    "size": "$button_size_override",
    "$content_alpha|default": 1,
    "anchor_from": "$anchor",
    "anchor_to": "$anchor",
    "controls": [
      {
        "border@common_buttons.focus_border": {
          "color": "$border_color",
          "layer": "$border_layer",
          "size": [ "100%c + 2px", "100%" ],
          "$button_image|default": "common_buttons.button_image",
          "controls": [
            {
              "$button_image@$button_image": {
                "size": [ "100%c + 2px", "100% - 2px" ],
                "layer": 1,
                "controls": [
                  {
                    "button_content": {
                      "type": "panel",
                      "size": [ "100%c + 6px", "100% - 6px" ],
                      "controls": [
                        {
                          "$button_type_panel@$button_type_panel": {
                            "layer": 3
                          }
                        }
                      ]
                    }
                  }
                ]
              }
            }
          ]
        }
      }
    ]
  },

  "new_ui_height_fitting_button_panel": {
    "type": "panel",
    "layer": 1,
    "$button_size_override|default": [ "100%", "100%c" ],
    "size": "$button_size_override",
    "$button_min_size_override|default": [ "100%", "100%c" ],
    "min_size": "$button_min_size_override",
    "$content_alpha|default": 1,
    "$anchor|default": "center",
    "anchor_from": "$anchor",
    "anchor_to": "$anchor",
    "controls": [
      {
        "border@common_buttons.focus_border": {
          "color": "$border_color",
          "layer": "$border_layer",
          "size": [ "100%", "100%c + 2px" ],
          "$button_border_min_size_override|default": [ "100%", "100%c + 2px" ],
          "min_size": "$button_border_min_size_override",
          "$button_image|default": "common_buttons.button_image",
          "controls": [
            {
              "$button_image@$button_image": {
                "size": [ "100% - 2px", "100%c + 2px" ],
                "$button_image_min_size_override|default": [ "100% - 2px", "100%c + 2px" ],
                "min_size": "$button_image_min_size_override",
                "layer": 1,
                "$button_image_color|default": [ 1.0, 1.0, 1.0 ],
                "color": "$button_image_color",
                "controls": [
                  {
                    "button_content": {
                      "type": "panel",
                      "size": [ "100% - 6px", "100%c + 6px" ],
                      "controls": [
                        {
                          "$button_type_panel@$button_type_panel": {
                            "layer": 3
                          }
                        }
                      ]
                    }
                  }
                ]
              }
            }
          ]
        }
      }
    ]
  },

  "borderless_form_fitting_button_panel": {
    "type": "panel",
    "layer": 1,
    "$button_size_override|default": [ "100%c", "100%c" ],
    "$button_image|default": "common_buttons.button_image",
    "size": "$button_size_override",
    "$button_panel_offset|default": [ 0, 0 ],
    "offset": "$button_panel_offset",
    "$content_alpha|default": 1,
    "anchor_from": "$anchor",
    "anchor_to": "$anchor",
    "controls": [
      {
        "$button_image@$button_image": {
          "size": [ "100%c + 4px", "100%c" ],
          "layer": 1,
          "controls": [
            {
              "button_content": {
                "type": "panel",
                "size": [ "100%c", "100%c" ],
                "controls": [
                  {
                    "$button_type_panel@$button_type_panel": {
                      "layer": 3
                    }
                  }
                ]
              }
            }
          ]
        }
      }
    ]
  },

  /////////////////////////////////
  //
  //  TEXT BUTTON
  //
  /////////////////////////////////

  // This needs you to define the button mapping and the size of the button
  "light_text_button@light_button_assets": {
    "$button_offset|default": [ 0, 0 ],
    "$button_pressed_offset|default": [ 0, 1 ],
    "$button_text|default": "",
    "$button_font_size|default": "normal",
    "$button_font_scale_factor|default": 1.0,
    "$pressed_alpha|default": 1,
    "$default_button_alpha|default": 1,
    "$default_hover_alpha|default": 1,
    "$default_pressed_alpha|default": 1,
    "$default_button_pressed_offset|default": [ 0, 1 ],

    "$default_text_color|default": "$light_button_default_text_color",
    "$hover_text_color|default": "$light_button_hover_text_color",
    "$pressed_text_color|default": "$light_button_pressed_text_color",
    "$locked_text_color|default": "$light_button_locked_text_color",

    // For text bindings
    "$button_text_binding_type|default": "none",
    "$button_binding_condition|default": "none",
    "$button_text_grid_collection_name|default": "",

    "$button_type_panel": "common_buttons.new_ui_binding_button_label",
    "$button_state_panel|default": "common_buttons.new_ui_button_panel",

    // These states are for passing the button state to the button content - do not set these in a parent!
    "$default_state|default": false,
    "$hover_state|default": false,
    "$pressed_state|default": false,
    "$locked_state|default": false,

    "controls": [
      {
        "default@$button_state_panel": {
          "$new_ui_button_texture": "$default_button_texture",
          "$text_color": "$default_text_color",
          "$secondary_text_color": "$light_button_secondary_default_text_color",
          "$content_alpha": "$default_content_alpha",
          "$border_color": "$light_border_default_color",
          "$border_layer": 2,
          "$default_state": true,
          "$button_alpha": "$default_button_alpha",
          "layer": 1
        }
      },
      {
        "hover@$button_state_panel": {
          "$new_ui_button_texture": "$hover_button_texture",
          "$text_color": "$hover_text_color",
          "$secondary_text_color": "$light_button_secondary_hover_text_color",
          "$content_alpha": 1,
          "$border_color": "$light_border_hover_color",
          "$border_layer": 4,
          "$hover_state": true,
          "$button_alpha": "$default_hover_alpha",
          "layer": 4 // This is several layers higher than default in case two buttons share a border and that shared border needs to turn with with either button hover/press state
        }
      },
      {
        "pressed@$button_state_panel": {
          "$new_ui_button_texture": "$pressed_button_texture",
          "$text_color": "$pressed_text_color",
          "$secondary_text_color": "$light_button_secondary_pressed_text_color",
          "$button_offset|default": "$button_pressed_offset",
          "$content_alpha": "$pressed_alpha",
          "$border_color": "$light_border_pressed_color",
          "$border_layer": 5,
          "$pressed_state": true,
          "$button_alpha": "$default_pressed_alpha",
          "layer": 5
        }
      },
      {
        "locked@$button_state_panel": {
          "$new_ui_button_texture": "$locked_button_texture",
          "$text_color": "$locked_text_color",
          "$secondary_text_color": "$light_button_secondary_locked_text_color",
          "$content_alpha": "$locked_alpha",
          "$border_color": "$light_border_locked_color",
          "$button_image": "common_buttons.locked_button_image",
          "$border_layer": 1,
          "$locked_state": true,
          "layer": 1
        }
      }
    ]
  },

  "dark_text_button@dark_button_assets": {
    "$button_offset|default": [ 0, 0 ],
    "$button_pressed_offset|default": [ 0, 1 ],
    "$button_text|default": "",
    "$pressed_alpha|default": 1,

    // For text bindings
    "$button_text_binding_type|default": "none",
    "$button_binding_condition|default": "none",
    "$button_text_grid_collection_name|default": "",

    "$button_type_panel": "common_buttons.new_ui_binding_button_label",
    "$button_state_panel|default": "common_buttons.new_ui_button_panel",

    // These states are for passing the button state to the button content - do not set these in a parent!
    "$default_state|default": false,
    "$hover_state|default": false,
    "$pressed_state|default": false,
    "$locked_state|default": false,

    "controls": [
      {
        "default@$button_state_panel": {
          "$new_ui_button_texture": "$default_button_texture",
          "$text_color": "$dark_button_default_text_color",
          "$secondary_text_color": "$dark_button_secondary_default_text_color",
          "$content_alpha": 1,
          "$border_color": "$dark_border_default_color",
          "$border_layer": 2,
          "$default_state": true,
          "layer": 1
        }
      },
      {
        "hover@$button_state_panel": {
          "$new_ui_button_texture": "$hover_button_texture",
          "$text_color": "$dark_button_hover_text_color",
          "$secondary_text_color": "$dark_button_secondary_hover_text_color",
          "$content_alpha": 1,
          "$border_color": "$dark_border_hover_color",
          "$border_layer": 4,
          "$hover_state": true,
          "layer": 4 // This is several layers higher than default in case two buttons share a border and that shared border needs to turn with with either button hover/press state

        }
      },
      {
        "pressed@$button_state_panel": {
          "$new_ui_button_texture": "$pressed_button_texture",
          "$text_color": "$dark_button_pressed_text_color",
          "$secondary_text_color": "$dark_button_secondary_pressed_text_color",
          "$button_offset|default": "$button_pressed_offset",
          "$content_alpha": "$pressed_alpha",
          "$border_color": "$dark_border_pressed_color",
          "$border_layer": 5,
          "$pressed_state": true,
          "layer": 5
        }
      },
      {
        "locked@$button_state_panel": {
          "$new_ui_button_texture": "$locked_button_texture",
          "$text_color": "$dark_button_locked_text_color",
          "$secondary_text_color": "$dark_button_secondary_locked_text_color",
          "$content_alpha": "$locked_alpha",
          "$border_color": "$dark_border_locked_color",
          "$button_image": "common_buttons.locked_button_image",
          "$border_layer": 1,
          "$locked_state": true,
          "layer": 1
        }
      }
    ]
  },

  "new_ui_binding_button_label": {
    "type": "label",
    "layer": 2,
    "text": "$button_text",
    "color": "$text_color",
    "$font_type|default": "default",
    "font_type": "$font_type",
    "font_size": "$button_font_size",
    "$button_font_scale_factor|default": 1.0,
    "font_scale_factor": "$button_font_scale_factor",
    "$button_font_size|default": "normal",
    "$new_ui_label_offset|default": "$button_offset",
    "offset": "$new_ui_label_offset",
    "$anchor|default": "center",
    "anchor_from": "$anchor",
    "anchor_to": "$anchor",
    "shadow": false,
    "$button_text_size|default": [ "default", "default" ],
    "size": "$button_text_size",
    "$button_text_max_size|default": [ "100%", 10 ], // Per design buttons are single line text only
    "max_size": "$button_text_max_size",
    "$text_alignment|default": "center",
    "text_alignment": "$text_alignment",
    "$tts_section_header|default": "",
    "tts_section_header": "$tts_section_header",
    "$button_text_collection_details|default": "none",
    "$button_text_collection_prefix|default": "",
    "bindings": [
      {
        "binding_type": "$button_text_collection_details",
        "binding_collection_name": "$button_text_grid_collection_name",
        "binding_collection_prefix": "$button_text_collection_prefix"
      },
      {
        "binding_type": "$button_text_binding_type",
        "binding_condition": "$button_binding_condition",
        "binding_collection_name": "$button_text_grid_collection_name",
        "binding_name": "$button_text",
        "binding_name_override": "$button_text"
      }
    ]
  },

  "underline_button@common.button": {
    "size": [ "100%c", "100%c" ],

    "$underline_button_size|default": [ "100%c", "100%c" ],
    "$single_label_size": [ "default", 8 ],
    "$single_line_font_scale_factor": 0.8,
    "$pressed_button_name|default": "",
    "$mashup_collection_binding_type|default": "global",
    "$mashup_collection_name|default": "",
    "controls": [
      {
        "default": {
          "type": "panel",
          "size": "$underline_button_size",
          "controls": [
            {
              "label_default@common.single_line_label": {
                "$single_line_label_color": "$dark_button_default_text_color",
                "$underline_control": [
                  {
                    "underline_default@common.underline": {}
                  }
                ]
              }
            }
          ]
        }
      },
      {
        "hover": {
          "type": "panel",
          "size": "$underline_button_size",
          "controls": [
            {
              "label_hover@common.single_line_label": {
                "$single_line_label_color|default": [ 0.215, 0.839, 0.118 ],
                "$underline_control": [
                  {
                    "underline_hover@common.underline": {
                      "$texture": "textures/ui/underline_focus"
                    }
                  }
                ]
              }
            }
          ]
        }
      },
      {
        "pressed": {
          "type": "panel",
          "size": "$underline_button_size",
          "controls": [
            {
              "label_hover@common.single_line_label": {
                "$single_line_label_color|default": [ 0.215, 0.839, 0.118 ],
                "$underline_control": [
                  {
                    "underline_hover@common.underline": {
                      "$texture": "textures/ui/underline_focus"
                    }
                  }
                ]
              }
            }
          ]
        }
      }
    ]
  },

  "read_button": {
    "type": "panel",
    "size": [ "100%", "100%c" ],
    "$offset|default": [ 0, 0 ],
    "controls": [
      {
        "read_button_inner@common_buttons.underline_button": {
          "anchor_from": "bottom_right",
          "anchor_to": "bottom_right",
          "offset": "$offset",
          "$bindings|default": [],
          "bindings": "$bindings"
        }
      }
    ]
  },

  /////////////////////////////////
  //
  //  FORM FITTING CONTENT BUTTON
  //
  /////////////////////////////////

  // Max size will be the size specified for the button, otherwise will shrink the width to fit the text, also only single line
  // The default height of the button will be 20 texels which is the minimum required for touch target size
  "light_content_form_fitting_button@common_buttons.light_content_button": {
    "size": [ "100%c", "20px" ],
    "$button_state_panel|default": "common_buttons.new_ui_form_fitting_button_panel",
    "$anchor": "top_left", // Cannot override this or will cause unsolvable layout!
    "$button_offset|default": [ 3, 3 ],
    "$button_pressed_offset|default": [ 3, 4 ],
    "$button_type_panel": "common_buttons.horizontal_form_fitting"
  },

  "dark_content_form_fitting_button@common_buttons.dark_content_button": {
    "size": [ "100%c", "20px" ],
    "$button_state_panel|default": "common_buttons.new_ui_form_fitting_button_panel",
    "$anchor": "top_left", // Cannot override this or will cause unsolvable layout!
    "$button_offset|default": [ 3, 3 ],
    "$button_pressed_offset|default": [ 3, 4 ],
    "$button_type_panel": "common_buttons.horizontal_form_fitting"
  },

  /////////////////////////////////
  //
  //  FORM FITTING TEXT BUTTON
  //
  /////////////////////////////////

  // Max size will be the size specified for the button, otherwise will shrink the width to fit the text, also only single line
  // The default height of the button will be 20 texels which is the minimum required for touch target size
  "light_text_form_fitting_button@common_buttons.light_text_button": {
    "size": [ "100%c", "100%c" ],
    "$button_state_panel|default": "common_buttons.new_ui_form_fitting_button_panel",
    "$anchor": "top_left", // Cannot override this or will cause unsolvable layout!
    "$button_offset|default": [ 3, 3 ],
    "$button_pressed_offset|default": [ 3, 4 ],
    "$button_text_max_size": [ "100%c", 10 ]
  },

  "dark_text_form_fitting_button@common_buttons.dark_text_button": {
    "size": [ "100%c", "100%c" ],
    "$button_state_panel|default": "common_buttons.new_ui_form_fitting_button_panel",
    "$anchor": "top_left", // Cannot override this or will cause unsolvable layout!
    "$button_offset|default": [ 3, 3 ],
    "$button_pressed_offset|default": [ 3, 4 ],
    "$button_text_max_size": [ "100%c", 10 ]
  },

  /////////////////////////////////
  //
  //  GENERIC CONTENT BUTTON
  //
  /////////////////////////////////

  "transparent_content_button@common_buttons.light_content_button": {
    "anchor_from": "bottom_right",
    "anchor_to": "bottom_right",
    "layer": 2,
    "$default_button_texture": "textures/ui/imagetaggedcorner",
    "$hover_button_texture": "textures/ui/imagetaggedcorner",
    "$pressed_button_texture": "textures/ui/imagetaggedcorner",
    "$locked_button_texture": "textures/ui/imagetaggedcorner",
    "$default_color": "white",
    "$default_font": "smooth",
    "$button_offset": [ 0, 0 ],
    "$border_visible": false,
    "$default_state_border_visible": false,
    "$hover_state_border_visible": false,
    "$pressed_state_border_visible": false,
    "$locked_state_border_visible": false
  },

  "single_image_with_border_button@common_buttons.light_content_button": {
    "$button_offset": [ 0, 0 ],
    "$button_content|default": "common.empty_panel",
    "$button_image_visible": false,
    "$button_content_size": [ "100% - 2px", "100% - 2px" ]
  },

  "light_content_button@light_button_assets": {

    "$button_offset|default": [ 0, 0 ],
    "$button_pressed_offset|default": [ 0, 1 ],
    "$pressed_alpha|default": 1,
    "$button_type_panel|default": "common_buttons.button_content_panel",
    "$button_content|default": "common.empty_panel",
    "$button_state_panel|default": "common_buttons.new_ui_button_panel",

    "$default_button_alpha|default": 1,
    "$default_hover_alpha|default": 1,
    "$default_pressed_alpha|default": 1,
    "$border_default_alpha|default": 1,

    "$border_default_layer|default": 2,
    "$border_hover_layer|default": 3,
    "$border_pressed_layer|default": 3,
    "$border_locked_layer|default": 1,

    // These states are for passing the button state to the button content - do not set these in a parent!
    "$default_state|default": false,
    "$hover_state|default": false,
    "$pressed_state|default": false,
    "$locked_state|default": false,
    "$default_state_border_visible|default": true,
    "$hover_state_border_visible|default": true,
    "$pressed_state_border_visible|default": true,
    "$locked_state_border_visible|default": true,

    "$default_text_color|default": "$light_button_default_text_color",

    "controls": [
      {
        "default@$button_state_panel": {
          "$new_ui_button_texture": "$default_button_texture",
          "$text_color": "$default_text_color",
          "$content_alpha": "$default_content_alpha",
          "$secondary_text_color": "$light_button_secondary_default_text_color",
          "$glyph_color": "$light_glyph_default_color",
          "$border_color": "$light_border_default_color",
          "$button_alpha": "$default_button_alpha",
          "$border_visible": "$default_state_border_visible",
          "$border_layer": "$border_default_layer",
          "$default_state": true,
          "$border_alpha": "$border_default_alpha",
          "layer": 1
        }
      },

      {
        "hover@$button_state_panel": {
          "$new_ui_button_texture": "$hover_button_texture",
          "$text_color": "$light_button_hover_text_color",
          "$secondary_text_color": "$light_button_secondary_hover_text_color",
          "$glyph_color": "$light_glyph_hover_color",
          "$content_alpha": "$hover_content_alpha",
          "$border_color": "$light_border_hover_color",
          "$border_visible": "$hover_state_border_visible",
          "$border_layer": "$border_hover_layer",
          "$hover_state": true,
          "$button_alpha": "$default_hover_alpha",
          "layer": 2
        }
      },
      {
        "pressed@$button_state_panel": {
          "$new_ui_button_texture": "$pressed_button_texture",
          "$text_color": "$light_button_pressed_text_color",
          "$secondary_text_color": "$light_button_secondary_pressed_text_color",
          "$glyph_color": "$light_glyph_pressed_color",
          "$content_alpha": "$pressed_alpha",
          "$button_offset": "$button_pressed_offset",
          "$border_color": "$light_border_pressed_color",
          "$border_visible": "$pressed_state_border_visible",
          "$border_layer": "$border_pressed_layer",
          "$button_alpha": "$default_pressed_alpha",
          "$pressed_state": true,
          "layer": 3
        }
      },
      {
        "locked@$button_state_panel": {
          "$new_ui_button_texture": "$locked_button_texture",
          "$text_color": "$light_button_locked_text_color",
          "$secondary_text_color": "$light_button_secondary_locked_text_color",
          "$glyph_color": "$light_glyph_locked_color",
          "$content_alpha": "$locked_alpha",
          "$border_color": "$light_border_locked_color",
          "$button_image": "common_buttons.locked_button_image",
          "$border_visible": "$locked_state_border_visible",
          "$border_layer": "$border_locked_layer",
          "$locked_state": true,
          "layer": 1
        }
      }
    ]
  },

  "light_content_button_control_content@common_buttons.light_content_button": {

    "$button_content|default": "common.empty_panel",
    "$button_content_hover|default": "common.empty_panel",
    "$button_content_pressed|default": "common.empty_panel",
    "$button_content_locked|default": "common.empty_panel",

    "controls": [
      {
        "default@$button_state_panel": {
          "$button_content": "$button_content",
          "$new_ui_button_texture": "$default_button_texture",
          "$text_color": "$default_text_color",
          "$content_alpha": "$default_content_alpha",
          "$secondary_text_color": "$light_button_secondary_default_text_color",
          "$glyph_color": "$light_glyph_default_color",
          "$border_color": "$light_border_default_color",
          "$button_alpha": "$default_button_alpha",
          "$border_visible": "$default_state_border_visible",
          "$border_layer": 2,
          "$default_state": true,
          "$border_alpha": "$border_default_alpha",
          "layer": 1
        }
      },

      {
        "hover@$button_state_panel": {
          "$button_content": "$button_content_hover",
          "$new_ui_button_texture": "$hover_button_texture",
          "$text_color": "$light_button_hover_text_color",
          "$secondary_text_color": "$light_button_secondary_hover_text_color",
          "$glyph_color": "$light_glyph_hover_color",
          "$content_alpha": "$hover_content_alpha",
          "$border_color": "$light_border_hover_color",
          "$border_visible": "$hover_state_border_visible",
          "$border_layer": 3,
          "$hover_state": true,
          "$button_alpha": "$default_hover_alpha",
          "layer": 2
        }
      },
      {
        "pressed@$button_state_panel": {
          "$button_content": "$button_content_pressed",
          "$new_ui_button_texture": "$pressed_button_texture",
          "$text_color": "$light_button_pressed_text_color",
          "$secondary_text_color": "$light_button_secondary_pressed_text_color",
          "$glyph_color": "$light_glyph_pressed_color",
          "$content_alpha": "$pressed_alpha",
          "$button_offset": "$button_pressed_offset",
          "$border_color": "$light_border_pressed_color",
          "$border_visible": "$pressed_state_border_visible",
          "$border_layer": 3,
          "$button_alpha": "$default_pressed_alpha",
          "$pressed_state": true,
          "layer": 3
        }
      },
      {
        "locked@$button_state_panel": {
          "$button_content": "$button_content_locked",
          "$new_ui_button_texture": "$locked_button_texture",
          "$text_color": "$light_button_locked_text_color",
          "$secondary_text_color": "$light_button_secondary_locked_text_color",
          "$glyph_color": "$light_glyph_locked_color",
          "$content_alpha": "$locked_alpha",
          "$border_color": "$light_border_locked_color",
          "$button_image": "common_buttons.locked_button_image",
          "$border_visible": "$locked_state_border_visible",
          "$border_layer": 1,
          "$locked_state": true,
          "layer": 1
        }
      }
    ]
  },

  "deactivated_light_content_button@common_buttons.light_content_button": {
    "$default_button_texture": "textures/ui/disabledButtonNoBorder",
    "$hover_button_texture": "textures/ui/disabledButtonNoBorder",
    "$pressed_button_texture": "textures/ui/disabledButtonNoBorder",
    "$locked_button_texture": "textures/ui/disabledButtonNoBorder"

  },

  "dark_content_button@dark_button_assets": {

    "$button_offset|default": [ 0, 0 ],
    "$button_pressed_offset|default": [ 0, 1 ],
    "$pressed_alpha|default": 1,
    "$button_type_panel|default": "common_buttons.button_content_panel",
    "$button_content|default": "common.empty_panel",
    "$button_state_panel|default": "common_buttons.new_ui_button_panel",

    // These states are for passing the button state to the button content - do not set these in a parent!
    "$default_state|default": false,
    "$hover_state|default": false,
    "$pressed_state|default": false,
    "$locked_state|default": false,

    "$hover_button_image_fill|default": false,
    "$hover_content_alpha|default": 1,
    "$hover_button_image_color|default": [ 1.0, 1.0, 1.0 ],

    "controls": [
      {
        "default@$button_state_panel": {
          "$new_ui_button_texture": "$default_button_texture",
          "$text_color": "$dark_button_default_text_color",
          "$secondary_text_color": "$dark_button_secondary_default_text_color",
          "$glyph_color": "$dark_glyph_default_color",
          "$content_alpha": 1,
          "$border_color": "$dark_border_default_color",
          "$border_layer": 2,
          "$default_state": true,
          "layer": 1
        }
      },
      {
        "hover@$button_state_panel": {
          "$new_ui_button_texture": "$hover_button_texture",
          "$text_color": "$dark_button_hover_text_color",
          "$secondary_text_color": "$dark_button_secondary_hover_text_color",
          "$glyph_color": "$dark_glyph_hover_color",
          "$content_alpha": "$hover_content_alpha",
          "$border_color": "$dark_border_hover_color",
          "$border_layer": 3,
          "$hover_state": true,
          "layer": 2,
          "$button_image_fill": "$hover_button_image_fill",
          "$button_image_color": "$hover_button_image_color"
        }
      },
      {
        "pressed@$button_state_panel": {
          "$new_ui_button_texture": "$pressed_button_texture",
          "$text_color": "$dark_button_pressed_text_color",
          "$secondary_text_color": "$dark_button_secondary_pressed_text_color",
          "$glyph_color": "$dark_glyph_pressed_color",
          "$content_alpha": "$pressed_alpha",
          "$button_offset": "$button_pressed_offset",
          "$border_color": "$dark_border_pressed_color",
          "$border_layer": 3,
          "$pressed_state": true,
          "layer": 3
        }
      },
      {
        "locked@$button_state_panel": {
          "$new_ui_button_texture": "$locked_button_texture",
          "$text_color": "$dark_button_locked_text_color",
          "$secondary_text_color": "$dark_button_secondary_locked_text_color",
          "$glyph_color": "$dark_glyph_locked_color",
          "$content_alpha": "$locked_alpha",
          "$border_color": "$dark_border_locked_color",
          "$button_image": "common_buttons.locked_button_image",
          "$border_layer": 1,
          "$locked_state": true,
          "layer": 1
        }
      }
    ]
  },

  "no_background_content_button@common.button": {

    "size": [ "100%c", "100%c" ],
    "$button_state_panel": "common_buttons.borderless_form_fitting_button_panel",
    "$anchor": "top_left", // Cannot override this or will cause unsolvable layout!
    "$button_text_max_size": [ "100%c", 10 ],

    "$button_offset|default": [ 0, 3 ],
    "$pressed_button_offset|default": [ 0, 4 ],
    "$pressed_alpha|default": 1,
    "$locked_alpha": 1,

    // text color
    "$default_text_color|default": "$light_button_default_text_color",
    "$hover_text_color|default": "$light_button_hover_text_color",
    "$pressed_text_color|default": "$light_button_pressed_text_color",

    // For text bindings
    "$button_text_binding_type|default": "none",
    "$button_binding_condition|default": "none",
    "$button_text_grid_collection_name|default": "",

    "$button_type_panel": "common_buttons.button_content_panel",
    "$border_visible": false,
    "$button_image_visible": false,
    "$button_content|default": "common.empty_panel",
    "$button_image|default": "common.empty_panel",

    // These states are for passing the button state to the button content - do not set these in a parent!
    "$default_state|default": false,
    "$hover_state|default": false,
    "$pressed_state|default": false,
    "$locked_state|default": false,

    "locked_control": "locked",

    "$default_button_texture|default": "",
    "$locked_button_texture|default": "textures/ui/disabledButtonNoBorder",

    "controls": [
      {
        "default@$button_state_panel": {
          "$new_ui_button_texture": "$default_button_texture",
          "$text_color": "$default_text_color",
          "$secondary_text_color": "$light_button_secondary_default_text_color",
          "$glyph_color": "$light_glyph_default_color",
          "$button_image_visible": false,
          "$content_alpha": 1,
          "$border_color": "$light_border_default_color",
          "$border_layer": 2,
          "$default_state": true,
          "layer": 1
        }
      },
      {
        "hover@$button_state_panel": {
          "$text_color": "$hover_text_color",
          "$secondary_text_color": "$light_button_secondary_hover_text_color",
          "$glyph_color": "$light_glyph_hover_color",
          "$content_alpha": 1,
          "$button_image": "common_buttons.background_button_image",
          "$border_color": "$light_border_hover_color",
          "$border_layer": 3,
          "$hover_state": true,
          "layer": 2
        }
      },
      {
        "pressed@$button_state_panel": {
          "$text_color": "$pressed_text_color",
          "$secondary_text_color": "$light_button_secondary_pressed_text_color",
          "$glyph_color": "$light_glyph_pressed_color",
          "$content_alpha": "$pressed_alpha",
          "$button_image": "common_buttons.background_button_image",
          "$button_offset": "$pressed_button_offset",
          "$border_color": "$light_border_pressed_color",
          "$border_layer": 3,
          "$pressed_state": true,
          "layer": 3
        }
      },
      {
        "locked@$button_state_panel": {
          "$new_ui_button_texture": "$locked_button_texture",
          "$text_color": "$light_button_locked_text_color",
          "$secondary_text_color": "$light_button_secondary_locked_text_color",
          "$glyph_color": "$light_glyph_locked_color",
          "$content_alpha": "$locked_alpha",
          "$button_image": "common_buttons.locked_button_image",
          "$border_color": "$light_border_locked_color",
          "$border_layer": 1,
          "$locked_state": true,
          "layer": 1
        }
      }
    ]
  },

  "button_content_panel": {
    "type": "panel",
    "offset": "$button_offset",
    "controls": [
      {
        "content@$button_content": {
          "layer": 2
        }
      }
    ]
  },

  "form_fitting_button_content_panel": {
    "type": "panel",
    "size": [ "100%c", "100%c" ],
    "offset": "$button_offset",
    "controls": [
      {
        "content@$button_content": {
          "layer": 2
        }
      }
    ]
  },


  "horizontal_form_fitting": {
    "type": "panel",
    "size": [ "100%c", "100%c" ],
    "offset": "$button_offset",
    "controls": [
      {
        "content@$button_content": {
          "layer": 2
        }
      }
    ]
  },

  "width_fitting_button_content_panel": {
    "type": "panel",
    "size": [ "100%c", "100%" ],
    "offset": "$button_offset",
    "controls": [
      {
        "content@$button_content": {
          "layer": 2
        }
      }
    ]
  },

  "height_fitting_button_content_panel": {
    "type": "panel",
    "size": [ "100%", "100%c" ],
    "offset": "$button_offset",
    "controls": [
      {
        "content@$button_content": {
          "layer": 2
        }
      }
    ]
  },

  /////////////////////////////////
  //
  //  GLYPH BUTTON
  //
  /////////////////////////////////

  "light_glyph_button@light_button_assets": {

    "$button_content|default": "common.empty_panel",
    "$button_content_offset|default": [ 0, 0 ],
    "$pressed_alpha|default": 1,
    "$button_type_panel": "common_buttons.glyph_content_panel",
    "$default_button_alpha|default": 1,
    "$default_hover_alpha|default": 1,
    "$default_pressed_alpha|default": 1,
    "$default_glyph_color|default": "$light_glyph_default_color",

    // These states are for passing the button state to the button content - do not set these in a parent!
    "$default_state|default": false,
    "$hover_state|default": false,
    "$pressed_state|default": false,
    "$locked_state|default": false,

    "$button_default_offset|default": [ 0, 0 ],
    "$button_hover_offset|default": [ 0, 0 ],
    "$button_pressed_offset|default": [ 0, 1 ],
    "$button_locked_offset|default": [ 0, 0 ],

    "controls": [
      {
        "default@common_buttons.new_ui_button_panel": {
          "layer": 1,
          "$new_ui_button_texture": "$default_button_texture",
          "$glyph_color": "$default_glyph_color",
          "$content_alpha": "$default_content_alpha",
          "$border_color": "$light_border_default_color",
          "$border_layer": 2,
          "$default_state": true,
          "$button_alpha": "$default_button_alpha",
          "$button_press_offset": "$button_default_offset"
        }
      },
      {
        "hover@common_buttons.new_ui_button_panel": {
          "layer": 2,
          "$new_ui_button_texture": "$hover_button_texture",
          "$glyph_color": "$light_glyph_hover_color",
          "$content_alpha": "$hover_content_alpha",
          "$border_color": "$light_border_hover_color",
          "$border_layer": 3,
          "$hover_state": true,
          "$button_alpha": "$default_hover_alpha",
          "$button_press_offset": "$button_hover_offset"
        }
      },
      {
        "pressed@common_buttons.new_ui_button_panel": {
          "layer": 3,
          "$new_ui_button_texture": "$pressed_button_texture",
          "$glyph_color": "$light_glyph_pressed_color",
          "$content_alpha": "$pressed_alpha",
          "$border_color": "$light_border_pressed_color",
          "$border_layer": 3,
          "$pressed_state": true,
          "$button_alpha": "$default_pressed_alpha",
          "$button_press_offset": "$button_pressed_offset"
        }
      },
      {
        "locked@common_buttons.new_ui_button_panel": {
          "$new_ui_button_texture": "$locked_button_texture",
          "$glyph_color": "$light_glyph_locked_color",
          "$content_alpha": "$locked_alpha",
          "$border_color": "$light_border_locked_color",
          "$button_image": "common_buttons.locked_button_image",
          "$border_layer": 1,
          "$button_press_offset": "$button_locked_offset",
          "$locked_state": true,
          "layer": 1
        }
      }
    ]
  },

  "dark_glyph_button_default@common_buttons.new_ui_button_panel": {
    "$new_ui_button_texture": "$default_button_texture",
    "$glyph_color": "$dark_glyph_default_color",
    "$border_color": "$dark_border_default_color",
    "$border_layer": 2,
    "$default_state": true,
    "$button_press_offset": [ 0, 0 ],
    "layer": 1
  },

  "dark_glyph_button_hover@common_buttons.new_ui_button_panel": {
    "$new_ui_button_texture": "$hover_button_texture",
    "$glyph_color": "$dark_glyph_hover_color",
    "$border_color": "$dark_border_hover_color",
    "$border_layer": 3,
    "$hover_state": true,
    "$button_press_offset": [ 0, 0 ],
    "layer": 2
  },

  "dark_glyph_button_pressed@common_buttons.new_ui_button_panel": {
    "$new_ui_button_texture": "$pressed_button_texture",
    "$glyph_color": "$dark_glyph_pressed_color",
    "$border_color": "$dark_border_pressed_color",
    "$border_layer": 3,
    "$pressed_state": true,
    "$button_press_offset": [ 0, 1 ],
    "layer": 3
  },

  "dark_glyph_button_locked@common_buttons.new_ui_button_panel": {
    "$new_ui_button_texture": "$locked_button_texture",
    "$glyph_color": "$dark_glyph_locked_color",
    "$content_alpha": "$locked_alpha",
    "$border_color": "$dark_border_locked_color",
    "$button_image": "common_buttons.locked_button_image",
    "$border_layer": 1,
    "$button_press_offset": [ 0, 0 ],
    "$locked_state": true,
    "layer": 1
  },

  "dark_glyph_button@dark_button_assets": {

    "$button_content|default": "common.empty_image",
    "$button_content_offset|default": [ 0, 0 ],
    "$button_type_panel": "common_buttons.glyph_content_panel",

    // These states are for passing the button state to the button content - do not set these in a parent!
    "$default_state|default": false,
    "$hover_state|default": false,
    "$pressed_state|default": false,
    "$locked_state|default": false,

    "controls": [
      {
        "default@common_buttons.dark_glyph_button_default": {}
      },
      {
        "hover@common_buttons.dark_glyph_button_hover": {}
      },
      {
        "pressed@common_buttons.dark_glyph_button_pressed": {}
      },
      {
        "locked@common_buttons.dark_glyph_button_locked": {}
      }
    ]
  },

  "dark_glyph_button_with_custom_control@common_buttons.dark_glyph_button": {
    "controls": [
      {
        "custom_control@$custom_control": {}
      },
      {
        "default@common_buttons.dark_glyph_button_default": {}
      },
      {
        "hover@common_buttons.dark_glyph_button_hover": {}
      },
      {
        "pressed@common_buttons.dark_glyph_button_pressed": {}
      },
      {
        "locked@common_buttons.dark_glyph_button_locked": {}
      }
    ]
  },

  "glyph_content_panel": {
    "type": "panel",
    "anchor_from": "top_left",
    "anchor_to": "top_left",
    "offset": "$button_content_offset",
    "controls": [
      {
        "glyph_button_content@$button_content": {
          "color": "$glyph_color",
          "layer": 3,
          "offset": "$button_press_offset",
          "alpha": "$content_alpha"
        }
      }
    ]
  },

  "hyperlink_button@common_buttons.light_text_button": {
    "$pressed_button_name": "button.menu_open_uri",
    "property_bag": {
      "#hyperlink": ""
    }
  },

  "hyperlink_content_button@common_buttons.light_content_button": {
    "$pressed_button_name": "button.menu_open_uri",
    "property_bag": {
      "#hyperlink": ""
    }
  },

  /////////////////////////////////
  //
  //  Content button with label and
  //  nested buttons
  //
  /////////////////////////////////
  // Main control:
  // -nestable_button
  //
  // Helper controls:
  // -dark_nestable_button
  // -transparent_label_nestable_button
  //
  // Helper labels:
  // -nested_centered_label_control
  // -nested_label_with_image_control
  // -nested_six_part_label_control

  // General Assets //

  // Base definition for state driven assets
  //
  // <state> - expands to default, hover, pressed, and locked
  //
  // -- Required Variables --
  // $nested_asset_<state>_texture - The image for each state
  //
  // -- Optional Variables --
  // $nested_asset_<state>_alpha - The alpha for each state
  // $nested_asset_<state>_color - The color tint for each state
  //
  "nested_button_assets": {
    "type": "image",
    "texture": "$nested_asset_texture",
    "alpha": "$nested_asset_alpha",
    "color": "$nested_asset_color",
    "$nested_asset_texture|default": "",

    "$nested_asset_alpha|default": "$nested_default_alpha",
    "$nested_asset_default_alpha|default": "$nested_default_alpha",
    "$nested_asset_hover_alpha|default": "$nested_default_alpha",
    "$nested_asset_pressed_alpha|default": "$nested_default_alpha",
    "$nested_asset_locked_alpha|default": "$nested_default_alpha",

    "$nested_asset_color|default": "$nested_default_color",
    "$nested_asset_default_color|default": "$nested_default_color",
    "$nested_asset_hover_color|default": "$nested_default_color",
    "$nested_asset_pressed_color|default": "$nested_default_color",
    "$nested_asset_locked_color|default": "$nested_default_color",
    "variables": [
      {
        "requires": "$default_state",
        "$nested_asset_texture": "$nested_asset_default_texture",
        "$nested_asset_alpha": "$nested_asset_default_alpha",
        "$nested_asset_color": "$nested_asset_default_color"
      },
      {
        "requires": "$hover_state",
        "$nested_asset_texture": "$nested_asset_hover_texture",
        "$nested_asset_alpha": "$nested_asset_hover_alpha",
        "$nested_asset_color": "$nested_asset_hover_color"
      },
      {
        "requires": "$pressed_state",
        "$nested_asset_texture": "$nested_asset_pressed_texture",
        "$nested_asset_alpha": "$nested_asset_pressed_alpha",
        "$nested_asset_color": "$nested_asset_pressed_color"
      },
      {
        "requires": "$locked_state",
        "$nested_asset_texture": "$nested_asset_locked_texture",
        "$nested_asset_alpha": "$nested_asset_locked_alpha",
        "$nested_asset_color": "$nested_asset_locked_color"
      }
    ]
  },

  // Subtle light overlay
  "nested_overlay_assets@common_buttons.nested_button_assets": {
    "$nested_asset_default_texture": "textures/ui/clickable_overlay",
    "$nested_asset_default_alpha": "$nested_overlay_clickable_alpha",
    "$nested_asset_hover_texture": "textures/ui/clickable_overlay",
    "$nested_asset_hover_alpha": "$nested_overlay_clickable_alpha",
    "$nested_asset_pressed_texture": "textures/ui/clickable_overlay_inverse",
    "$nested_asset_pressed_alpha": "$nested_overlay_clickable_alpha",
    "$nested_asset_locked_texture": "textures/ui/clickable_overlay",
    "$nested_asset_locked_alpha": "$nested_overlay_clickable_alpha"
  },

  // Label Assets //

  // Dark label background with green hover
  "nested_label_content_background_assets@common_buttons.nested_button_assets": {
    "$nested_asset_default_texture": "textures/ui/White",
    "$nested_asset_default_color": "$nested_dark_label_default_color",
    "$nested_asset_hover_texture": "textures/ui/White",
    "$nested_asset_hover_color": "$nested_dark_label_hover_color",
    "$nested_asset_pressed_texture": "textures/ui/White",
    "$nested_asset_pressed_color": "$nested_dark_label_pressed_color",
    "$nested_asset_locked_texture": "textures/ui/White",
    "$nested_asset_locked_color": "$nested_dark_label_default_color"
  },

  // Background for label content control
  "nested_label_background_assets@common_buttons.nested_button_assets": {
    "$nested_asset_default_texture": "textures/ui/black_border",
    "$nested_asset_hover_texture": "textures/ui/slider_border",
    "$nested_asset_pressed_texture": "textures/ui/slider_border",
    "$nested_asset_locked_texture": "textures/ui/black_border"
  },

  // Semitransparent background for label content control
  //
  // -- Optional Variables --
  // $transparent_label_color - The color when not pressed
  // $transparent_label_pressed_color - The color when pressed
  //
  "nested_transparent_label_content_background_assets": {
    "type": "panel",
    "$transparent_label_color|default": "$nested_transparent_label_default_color",
    "$transparent_label_hover_color|default": "$transparent_label_color",
    "$transparent_label_pressed_color|default": "$nested_transparent_label_default_pressed_color",

    "controls": [
      {
        "assets@common_buttons.nested_button_assets": {

          "$nested_asset_default_texture": "textures/ui/White",
          "$nested_asset_default_color": "$transparent_label_color",
          "$nested_asset_default_alpha": "$nested_transparent_label_alpha",
          "$nested_asset_hover_texture": "textures/ui/White",
          "$nested_asset_hover_color": "$transparent_label_hover_color",
          "$nested_asset_pressed_texture": "textures/ui/White",
          "$nested_asset_pressed_color": "$transparent_label_pressed_color",
          "$nested_asset_locked_texture": "textures/ui/White",
          "$nested_asset_locked_color": "$transparent_label_color"
        }
      }
    ]
  },

  // Basic label bindings and variables
  //
  // -- Required Variables --
  // $nested_label_text - Label text
  //
  // -- Optional Variables --
  // $nested_label_font_type - Label font type (default: mojangles)
  // $nested_label_bindings - Label bindings for dynamic text/type
  // $nested_label_color - Label color
  // $nested_label_locked_color - Label color when locked
  //
  "nested_base_label": {
    "type": "label",
    "shadow": true,
    "$nested_label_alignment|default": "center",
    "text_alignment": "$nested_label_alignment",
    "$nested_label_color|default": "$generic_button_text_color",
    "color": "$nested_label_color",

    "$nested_label_text|default": "",
    "text": "$nested_label_text",

    "$nested_label_font_type|default": "default",
    "font_type": "$nested_label_font_type",

    "$nested_label_bindings|default": [],
    "bindings": "$nested_label_bindings"
  },

  // Centered label
  //
  // -- Required Variables --
  // See common_buttons.nested_base_label for more
  //
  // -- Optional Variables --
  // $nested_label_max_size - For clipping label text
  //
  "nested_centered_label_control": {
    "type": "panel",
    "controls": [
      {
        "label@common_buttons.nested_base_label": {
          "$nested_label_max_size|default": [ "100% - 2px", "100% - 2px" ],
          "max_size": "$nested_label_max_size"
        }
      }
    ]
  },

  // Label left justified with image prefix
  //
  // -- Required Variables --
  // $nested_label_image - Prefix image
  // See common_buttons.nested_base_label for more
  //
  // -- Optional Variables --
  // $nested_label_max_size - For clipping label text (should be fine as is)
  //
  "nested_label_with_image_control": {
    "type": "stack_panel",
    "orientation": "horizontal",
    "size": [ "100% - 6px", "100% - 3px" ],
    "offset": [ 0, -0.5 ],
    "controls": [
      {
        "image": {
          "type": "image",
          "$nested_label_image|default": "",
          "texture": "$nested_label_image",
          "size": [ "100%y", "100%" ],
          "$nested_label_image_bindings|default": [],
          "bindings": "$nested_label_image_bindings"
        }
      },
      {
        "image_to_label_padding@common.empty_panel": {
          "size": [ 4, "100%" ]
        }
      },
      {
        "label_panel": {
          "type": "panel",
          "size": [ "fill", "100%" ],
          "controls": [
            {
              "label@common_buttons.nested_base_label": {
                "anchor_from": "left_middle",
                "anchor_to": "left_middle",
                "$nested_label_max_size|default": [ "100%", "100%" ],
                "max_size": "$nested_label_max_size"
              }
            }
          ]
        }
      }
    ]
  },

  // Empty definition for a six part label
  "nested_six_part_empty_definition": {
    "type": "label",
    "text": "",
    "color": "$generic_button_text_color"
  },

  // Label in each corner of the label control
  //
  // -- Optional Variables --
  // <side> - Expands to left/right
  // <anchor> - Expands to top/middle/bottom
  // $<side>_<anchor>_label_definition - Json object that defines all required label variables (needs "type: label" and at least text and color)
  //
  "nested_six_part_label_control": {
    "type": "panel",
    "size": [ "100% - 6px", "100% - 2px" ],
    "offset": [ 0, -1 ],
    "$left_top_label_definition|default": "common_buttons.nested_six_part_empty_definition",
    "$left_middle_label_definition|default": "common_buttons.nested_six_part_empty_definition",
    "$left_bottom_label_definition|default": "common_buttons.nested_six_part_empty_definition",
    "$right_top_label_definition|default": "common_buttons.nested_six_part_empty_definition",
    "$right_middle_label_definition|default": "common_buttons.nested_six_part_empty_definition",
    "$right_bottom_label_definition|default": "common_buttons.nested_six_part_empty_definition",
    "controls": [
      {
        "left_top_label@$left_top_label_definition": {
          "anchor_from": "top_left",
          "anchor_to": "top_left"
        }
      },
      {
        "left_middle_label@$left_middle_label_definition": {
          "anchor_from": "left_middle",
          "anchor_to": "left_middle"
        }
      },
      {
        "left_bottom_label@$left_bottom_label_definition": {
          "anchor_from": "bottom_left",
          "anchor_to": "bottom_left"
        }
      },
      {
        "right_top_label@$right_top_label_definition": {
          "anchor_from": "top_right",
          "anchor_to": "top_right"
        }
      },
      {
        "right_middle_label@$right_middle_label_definition": {
          "anchor_from": "right_middle",
          "anchor_to": "right_middle"
        }
      },
      {
        "right_bottom_label@$right_bottom_label_definition": {
          "anchor_from": "bottom_right",
          "anchor_to": "bottom_right"
        }
      }
    ]
  },

  // Content Assets //

  // Solid color content assets
  "nested_dark_button_assets@common_buttons.nested_button_assets": {
    "$nested_asset_default_texture": "textures/ui/White",
    "$nested_asset_default_color": "$nested_dark_content_default_color",
    "$nested_asset_hover_texture": "textures/ui/White",
    "$nested_asset_hover_color": "$nested_dark_content_hover_color",
    "$nested_asset_pressed_texture": "textures/ui/White",
    "$nested_asset_pressed_color": "$nested_dark_content_pressed_color",
    "$nested_asset_locked_texture": "textures/ui/White",
    "$nested_asset_locked_color": "$nested_dark_content_default_color"
  },

  // Background for button content control
  "nested_content_background_assets@common_buttons.nested_button_assets": {
    "$nested_asset_default_texture": "textures/ui/Black",
    "$nested_asset_hover_texture": "textures/ui/White",
    "$nested_asset_pressed_texture": "textures/ui/White",
    "$nested_asset_locked_texture": "textures/ui/Black"
  },

  // Darkened overlay for unselected buttons
  "nested_content_overlay_assets@common_buttons.nested_button_assets": {
    "$nested_asset_default_texture|default": "textures/ui/Black",
    "$nested_asset_default_alpha": "$nested_content_unfocused_overlay_alpha",
    "$nested_asset_hover_texture": "",
    "$nested_asset_pressed_texture": "",
    "$nested_asset_locked_texture": ""
  },

  // Solid color background with image in center
  //
  // -- Required Variables --
  // $nested_control_image - The texture for the center image
  //
  // -- Optional Variables --
  // $nested_control_image_size - The size of the image (default: [ 22, 22 ])
  //
  "nested_dark_control_with_image": {
    "type": "panel",
    "controls": [
      { "background@common_buttons.nested_dark_button_assets": {} },
      {
        "image_panel": {
          "type": "panel",
          "size": [ 22, 22 ],
          "offset": [ 0, 1.5 ],
          "layer": 1,
          "controls": [
            {
              "image": {
                "type": "image",
                "$nested_control_image_size": [ "100%", "100%" ],
                "size": "$nested_control_image_size",
                "$nested_control_image|default": "",
                "texture": "$nested_control_image"
              }
            }
          ]
        }
      }
    ]
  },

  // Controls //

  // NESTED BUTTON DOCUMENTATION:
  //
  // -- For Nested Content --
  // If using nested content all variables in this section required
  // setUpCallbacksForNestedButton(
  //   $pressed_button_name,
  //   $nested_content_visibility_binding, - The binding name for nested visibility
  //   firstControlName - The name of the control that will recieve focus after the base button is pressed
  //   ignoredButtons - (optional) A vector of button names to ignore (default: { StringHash("button.scrollbar_touch") })
  // );
  // $nested_content_controls - The nested controls (parent size based on its sibling)
  // $has_nested_controls - Set to true to use
  //
  // -- Advanced Nested Content --
  // For factory built nestable buttons
  // $has_special_nested_controls - Set to true to use
  // $nested_content_controls - The nested controls (parent size based on its sibling)
  // $special_nested_content_bindings - Bindings array for the nested controls
  // $special_nested_button_bindings - Bindings array for the button
  //
  //
  // -- Required Variables --
  // $pressed_button_name, - The button name for the base button
  //
  // $nested_button_content_size - The size for the upper control
  // $nested_content_control - The control for the upper part of the button (can make use of $default_state, $hover_state, $pressed_state, $locked_state)
  //
  // $nested_button_label_size - The size for the label control (can use "100%sm" for the x to keep consistent with top control)
  // $nested_label_control_background: The background behind the label control
  // $nested_label_control: The control for the background of the label (can make use of $default_state, $hover_state, $pressed_state, $locked_state)
  //
  // -- Other Variables --
  // any common.button variable
  //
  // $nested_button_overlay - The overlay for the entire button (default: common_buttons.nested_overlay_assets)
  // $nested_content_background_assets - The assets behind the button content control (default: common_buttons.nested_background_assets)
  // $nested_content_overlay_assets - The assets to overlay the content (default: common.empty_panel)
  // $nested_content_label_padding - If true adds a single texel gap between content and label (default: false)
  // $nested_label_background_assets - The assets behind the label control (default: common_buttons.nested_label_background_assets)
  // $nested_content_dark_alpha - The black overlay to display when nested content is shown
  //
  // $use_parent_size - If true will use parent size to size buttons (still needs $nested_button_content_size
  //                    and $nested_button_label_size, will also need to set $nestable_button_size)
  //                    If false uses content size (default: false)
  // $nestable_button_size - The size of the button (default: [ "100%cm", "100%cm" ]
  //
  "nestable_button": {
    "$use_parent_size|default": false,
    "$nestable_button_size|default": [ "100%cm", "100%cm" ],
    "size": "$nestable_button_size",

    "type": "panel",
    "$has_nested_controls|default": false,
    "$has_special_nested_controls|default": false,
    "$has_special_button_bindings|default": false,
    "$has_padding_for_content_and_label|default": false,
    "$nested_content_visibility_binding|default": "",
    "controls": [
      {
        "nested_controls_panel": {
          "ignored": "(not $has_nested_controls and not $has_special_nested_controls)",
          "$nested_content_dark_alpha|default": 0.8,
          "type": "input_panel",
          "size": [ "100%sm", "100%sm" ],
          "layer": 10,
          "button_mappings": [
            {
              "from_button_id": "button.menu_select",
              "to_button_id": "button.nested_background",
              "mapping_type": "pressed"
            },
            {
              "from_button_id": "button.menu_ok",
              "to_button_id": "button.nested_background",
              "mapping_type": "focused"
            }
          ],
          "$_nested_content_visibility_binding|default": [
            {
              "binding_name": "$nested_content_visibility_binding",
              "binding_name_override": "#visible"
            }
          ],
          "variables": [
            {
              "requires": "$has_special_nested_controls",
              "$_nested_content_visibility_binding": "$special_nested_content_bindings"
            }
          ],
          "bindings": "$_nested_content_visibility_binding",
          "controls": [
            {
              "locked_overlay": {
                "type": "image",
                "texture": "textures/ui/Black",
                "alpha": "$nested_content_dark_alpha"
              }
            },
            { "nested_controls@$nested_content_controls": {} }
          ]
        }
      },
      {
        "base_button@common.button": {
          "locked_control": "locked",

          "layer": 1,

          "$default_state|default": false,
          "$hover_state|default": false,
          "$pressed_state|default": false,
          "$locked_state|default": false,

          "variables": [
            {
              "requires": "$has_nested_controls",
              "$button_bindings": [
                {
                  "binding_name": "(not $nested_content_visibility_binding)",
                  "binding_name_override": "#enabled"
                }
              ]
            },
            {
              "requires": "($has_special_nested_controls or $has_special_button_bindings)",
              "$button_bindings": "$special_nested_button_bindings"
            },
            {
              "requires": "$use_parent_size",
              "$_nested_button_size": [ "100%", "100%" ]
            }
          ],
          "$_nested_button_size|default": [ "100%c", "100%c" ],
          "size": "$_nested_button_size",

          "controls": [
            {
              "default@common_buttons.nested_button_base": {
                "$default_state": true
              }
            },
            {
              "hover@common_buttons.nested_button_base": {
                "$hover_state": true
              }
            },
            {
              "pressed@common_buttons.nested_button_base": {
                "$pressed_state": true
              }
            },
            {
              "locked@common_buttons.nested_button_base": {
                "$locked_state": true
              }
            }
          ]
        }
      }
    ]
  },

  // The base button control for the nested button
  //
  // Variables documented in parent control
  //
  "nested_button_base": {
    "type": "panel",
    "$nested_button_overlay|default": "common_buttons.nested_overlay_assets",
    "controls": [
      {
        "button_overlay@$nested_button_overlay": {
          "size": [ "100%sm", "100%sm" ],
          "layer": 3
        }
      },
      {
        "button_control": {
          "type": "stack_panel",
          "orientation": "vertical",
          "layer": 1,
          "controls": [
            {
              "control_area": {
                "type": "panel",
                "size": "$nested_button_content_size",

                "$nested_content_background_assets|default": "common_buttons.nested_content_background_assets",
                "$nested_content_overlay_assets|default": "common.empty_panel",
                "controls": [
                  {
                    "background@$nested_content_background_assets": {
                      "layer": -1,
                      "size": [ "100%sm + 2px", "100%sm + 1px" ],
                      "offset": [ 0, -0.5 ]
                    }
                  },
                  { "control@$nested_content_control": {} },
                  { "overlay@$nested_content_overlay_assets": { "layer": 1 } }
                ]
              }
            },
            {
              "button_stack_padding@common.empty_panel": {
                "$nested_content_label_padding|default": false,
                "$_content_to_label_padding_size|default": "$nested_no_padding",
                "size": "$_content_to_label_padding_size",
                "variables": [
                  {
                    "requires": "$nested_content_label_padding",
                    "$_content_to_label_padding_size": "$nested_one_pixel_padding"
                  }
                ]
              }
            },
            {
              "label_area": {
                "type": "panel",
                "size": "$nested_button_label_size",

                "$nested_label_background_assets|default": "common_buttons.nested_label_background_assets",
                "controls": [
                  {
                    "background@$nested_label_background_assets": {
                      "layer": -1,
                      "size": [ "100%sm + 2px", "100%sm + 2px" ]
                    }
                  },
                  { "control_background@$nested_label_control_background": {} },
                  { "control@$nested_label_control": { "layer": 1 } }
                ]
              }
            }
          ],

          "$_nested_button_control_size|default": [ "100%cm", "100%c" ],
          "size": "$_nested_button_control_size",
          "variables": [
            {
              "requires": "$use_parent_size",
              "$_nested_button_control_size": [ "100%", "100%" ]
            }
          ]
        }
      }
    ],

    "$_nested_button_base_size|default": [ "100%cm + 2px", "100%cm + 2px" ],
    "size": "$_nested_button_base_size",
    "variables": [
      {
        "requires": "$use_parent_size",
        "$_nested_button_base_size": [ "100% - 2px", "100% - 2px" ]
      }
    ]
  },

  // Helpers //

  // Solid button with image and centered label
  //
  // -- Required Variables --
  // $pressed_button_name - The button name for the base button
  //
  // $nested_button_content_size - Content control size
  // $nested_control_image - Content image
  //
  // $nested_button_label_size - Label control size
  // $nested_label_text - Label text
  //
  "dark_nestable_button@common_buttons.nestable_button": {
    "$nested_content_control": "common_buttons.nested_dark_control_with_image",

    "$nested_label_control_background": "common_buttons.nested_label_content_background_assets",
    "$nested_label_control": "common_buttons.nested_centered_label_control"
  },

  // Content control is user defined
  // Label has a semi transparent background with a image prefix before the label
  //
  // -- Required Variables --
  // $pressed_button_name - The button name for the base button
  //
  // $nested_button_content_size - Content control size
  // $nested_content_control - The upper content control
  //
  // $nested_button_label_size - Label control size
  // $nested_label_control - The label content control
  //
  // -- Optional Variables --
  // $nested_content_overlay_assets - The assets to overlay the content (default: common.nested_content_overlay_assets)
  //
  // $nested_label_control_background - The background behind the label control (default: common_buttons.nested_transparent_label_content_background_assets)
  // $transparent_label_color - The color of the label when not pressed (can use if default $nested_label_control_background)
  // $transparent_label_pressed_color - The color of the label when pressed (can use if default $nested_label_control_background)
  // $nested_transparent_label_alpha - The alpha of the label background (default: 0.8, can use if default $nested_label_control_background)
  //
  "transparent_label_nestable_button@common_buttons.nestable_button": {
    "$nested_content_overlay_assets": "common_buttons.nested_content_overlay_assets",

    "$nested_content_label_padding": true,

    "$nested_label_control_background": "common_buttons.nested_transparent_label_content_background_assets"
  },

  //////////  Tool Tip Types  //////////

  "static_tooltip_notification_panel@common.button": {
    "size": [ "100%", "100%" ],
    "sound_volume": 0.0,
    "layer": 1,

    // background textures
    "$tooltip_button_default_texture|default": "textures/ui/tooltip_notification_default_background",
    "$tooltip_button_pressed_texture|default": "textures/ui/tooltip_notification_default_background",
    "$tooltip_button_hover_texture|default": "textures/ui/tooltip_notification_default_background",
    "$tooltip_button_locked_texture|default": "textures/ui/tooltip_notification_default_background",

    "$tooltip_button_content_size|default": [ "100%", "100%" ],

    // binding vars (should be same for all children)
    "$tooltip_button_binding_type|default": "global",
    "$tooltip_button_collection_name|default": "",

    "locked_control": "locked",

    "$tooltip_hovered_to_button_id|default": "button.is_hovered",
    "button_mappings": [
      {
        "from_button_id": "button.menu_select",
        "to_button_id": "$pressed_button_name",
        "mapping_type": "pressed"
      },
      {
        "from_button_id": "button.menu_ok",
        "to_button_id": "$pressed_button_name",
        "mapping_type": "focused"
      },
      {
        "to_button_id": "$tooltip_hovered_to_button_id",
        "mapping_type": "pressed"
      }
    ],

    "controls": [
      {
        "default@common.tooltip_button_content": {
          "$tooltip_background_texture": "$tooltip_button_default_texture"
        }
      },
      {
        "pressed@common.tooltip_button_content": {
          "$tooltip_background_texture": "$tooltip_button_pressed_texture"
        }
      },
      {
        "hover@common.tooltip_button_content": {
          "$tooltip_background_texture": "$tooltip_button_hover_texture"
        }
      },
      {
        "locked@common.tooltip_button_content": {
          "$tooltip_background_texture": "$tooltip_button_locked_texture"
        }
      },
      { "static_tooltip_popup_panel@common.static_tooltip_popup_with_image_and_text": {} }
    ],
    "bindings": [
      {
        "binding_name": "$static_tooltip_button_visibility_binding_name",
        "binding_name_override": "#visible",
        "binding_collection_name": "$tooltip_button_collection_name",
        "binding_type": "$tooltip_button_binding_type"
      }
    ]
  },


  "dynamic_tooltip_notification_panel@common.button": {
    "size": [ "100%", "100%" ],
    "sound_volume": 0.0,
    "layer": 1,

    // background textures
    "$tooltip_button_default_texture|default": "textures/ui/tooltip_notification_default_background",
    "$tooltip_button_pressed_texture|default": "textures/ui/tooltip_notification_default_background",
    "$tooltip_button_hover_texture|default": "textures/ui/tooltip_notification_default_background",
    "$tooltip_button_locked_texture|default": "textures/ui/tooltip_notification_default_background",

    "$tooltip_button_content_size|default": [ "100%", "100%" ],

    // binding vars (should be same for all children)
    "$tooltip_button_binding_type|default": "global",
    "$tooltip_button_collection_name|default": "",
    "$tooltip_button_visibility_binding_name|default": "#dynamic_tooltip_notification_visibility_binding_name",


    "locked_control": "locked",

    "$tooltip_hovered_to_button_id|default": "button.is_hovered",
    "button_mappings": [
      {
        "from_button_id": "button.menu_select",
        "to_button_id": "$pressed_button_name",
        "mapping_type": "pressed"
      },
      {
        "from_button_id": "button.menu_ok",
        "to_button_id": "$pressed_button_name",
        "mapping_type": "focused"
      },
      {
        "to_button_id": "$tooltip_hovered_to_button_id",
        "mapping_type": "pressed"
      }
    ],

    "controls": [
      {
        "default@common.tooltip_button_content": {
          "$tooltip_background_texture": "$tooltip_button_default_texture"
        }
      },
      {
        "pressed@common.tooltip_button_content": {
          "$tooltip_background_texture": "$tooltip_button_pressed_texture"
        }
      },
      {
        "hover@common.tooltip_button_content": {
          "$tooltip_background_texture": "$tooltip_button_hover_texture"
        }
      },
      {
        "locked@common.tooltip_button_content": {
          "$tooltip_background_texture": "$tooltip_button_locked_texture"
        }
      },
      { "dyanmic_tooltip_popup_panel@common.dynamic_tooltip_popup_with_image_and_text": {} }
    ],
    "bindings": [
      {
        "binding_name": "$tooltip_button_visibility_binding_name",
        "binding_name_override": "#visible",
        "binding_collection_name": "$tooltip_button_collection_name",
        "binding_type": "$tooltip_button_binding_type"
      }
    ]
  },

  ///////////////////////////////////////////////////////////////////////////

  "text_body_focus_border_for_controller_button@common.button": {
    "$pressed_button_name": "button.no_interaction",
    "sound_volume": 0.0,
    "size": [ "100%", "100%cm" ],
    "default_control": "default",
    "pressed_control": "hover",
    "hover_control": "hover",
    "$text_control|default": "common.empty_panel",
    "$text_control_size|default": [ "100%", "100%c" ],
    "controls": [
      {
        "default@common.empty_panel": {
          "size": [ "100%", 0 ]
        }
      },
      {
        "hover@common.empty_panel": {
          "size": [ "100%", "100%sm" ],
          "controls": [
            {
              "focus_border@common_buttons.focus_border": {
                "size": [ "100%", "100% + 4px" ]
              }
            }
          ]
        }
      },
      {
        "text_control@$text_control": {
          "size": "$text_control_size"
        }
      }
    ]
  }
}
