{
  "version": "2.6",
  "children": [
    {
      "type": "frame",
      "id": "RestaurantTableMap",
      "name": "Restaurant/Table Map",
      "reusable": true,
      "width": 1024,
      "height": 768,
      "fill": "$bg-page",
      "layout": "vertical",
      "clip": true,
      "children": [
        {
          "type": "frame",
          "id": "TableMapHeader",
          "width": "fill_container",
          "height": 64,
          "fill": "$bg-elevated",
          "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]},
          "padding": [0, 24],
          "justifyContent": "space_between",
          "alignItems": "center",
          "children": [
            {"type": "frame", "id": "TableMapLeft", "gap": 16, "alignItems": "center", "children": [
              {"type": "frame", "id": "TableMapLogo", "width": 40, "height": 40, "fill": {"type": "gradient", "gradientType": "linear", "enabled": true, "rotation": 135, "size": {"height": 1}, "colors": [{"color": "#FF5C00", "position": 0}, {"color": "#FF8A4C", "position": 1}]}, "cornerRadius": 10, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "TableMapLogoText", "fill": "$text-primary", "content": "G", "fontFamily": "Roboto", "fontSize": 20, "fontWeight": "700"}]},
              {"type": "text", "id": "TableMapTitle", "fill": "$text-primary", "content": "Sơ đồ bàn", "fontFamily": "Roboto", "fontSize": 20, "fontWeight": "700"}
            ]},
            {"type": "frame", "id": "TableMapLegend", "gap": 20, "alignItems": "center", "children": [
              {"type": "frame", "id": "LegendEmpty", "gap": 8, "alignItems": "center", "children": [{"type": "frame", "id": "LegendEmptyDot", "width": 16, "height": 16, "fill": "#22C55E", "cornerRadius": 4}, {"type": "text", "id": "LegendEmptyText", "fill": "$text-secondary", "content": "Trống", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "normal"}]},
              {"type": "frame", "id": "LegendOccupied", "gap": 8, "alignItems": "center", "children": [{"type": "frame", "id": "LegendOccupiedDot", "width": 16, "height": 16, "fill": "#EF4444", "cornerRadius": 4}, {"type": "text", "id": "LegendOccupiedText", "fill": "$text-secondary", "content": "Có khách", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "normal"}]},
              {"type": "frame", "id": "LegendReserved", "gap": 8, "alignItems": "center", "children": [{"type": "frame", "id": "LegendReservedDot", "width": 16, "height": 16, "fill": "#F59E0B", "cornerRadius": 4}, {"type": "text", "id": "LegendReservedText", "fill": "$text-secondary", "content": "Đặt trước", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "normal"}]}
            ]},
            {"type": "frame", "id": "TableMapRight", "gap": 12, "children": [
              {"type": "frame", "id": "TableMapAddBtn", "height": 40, "fill": "$orange-primary", "cornerRadius": 10, "padding": [0, 16], "gap": 8, "alignItems": "center", "children": [{"type": "icon_font", "id": "TableMapAddIcon", "width": 18, "height": 18, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$text-primary"}, {"type": "text", "id": "TableMapAddText", "fill": "$text-primary", "content": "Mở bàn mới", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}]}
            ]}
          ]
        },
        {
          "type": "frame",
          "id": "TableMapFloors",
          "width": "fill_container",
          "fill": "$bg-elevated",
          "stroke": {"thickness": 1, "fill": "$border-subtle", "sides": ["bottom"]},
          "padding": [12, 24],
          "gap": 8,
          "children": [
            {"type": "frame", "id": "Floor1Tab", "fill": "$orange-primary", "cornerRadius": 8, "padding": [10, 20], "children": [{"type": "text", "id": "Floor1Text", "fill": "$text-primary", "content": "Tầng 1", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}]},
            {"type": "frame", "id": "Floor2Tab", "fill": "$bg-interactive", "cornerRadius": 8, "padding": [10, 20], "children": [{"type": "text", "id": "Floor2Text", "fill": "$text-secondary", "content": "Tầng 2", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]},
            {"type": "frame", "id": "FloorVIPTab", "fill": "$bg-interactive", "cornerRadius": 8, "padding": [10, 20], "children": [{"type": "text", "id": "FloorVIPText", "fill": "$text-secondary", "content": "VIP", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]},
            {"type": "frame", "id": "FloorOutdoorTab", "fill": "$bg-interactive", "cornerRadius": 8, "padding": [10, 20], "children": [{"type": "text", "id": "FloorOutdoorText", "fill": "$text-secondary", "content": "Ngoài trời", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "500"}]}
          ]
        },
        {
          "type": "frame",
          "id": "TableMapGrid",
          "width": "fill_container",
          "height": "fill_container",
          "padding": 32,
          "layout": "vertical",
          "gap": 24,
          "clip": true,
          "children": [
            {"type": "frame", "id": "TableRow1", "width": "fill_container", "gap": 24, "children": [
              {"type": "frame", "id": "Table01", "width": 140, "height": 120, "fill": "#EF444415", "cornerRadius": 16, "stroke": {"thickness": 2, "fill": "#EF4444"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table01Label", "fill": "#EF4444", "content": "01", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "frame", "id": "Table01Info", "fill": "#EF444430", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "Table01InfoText", "fill": "#EF4444", "content": "4 khách • 45p", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
              {"type": "frame", "id": "Table02", "width": 140, "height": 120, "fill": "#22C55E15", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "#22C55E"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table02Label", "fill": "#22C55E", "content": "02", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "text", "id": "Table02Status", "fill": "#22C55E", "content": "Trống", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]},
              {"type": "frame", "id": "Table03", "width": 140, "height": 120, "fill": "#EF444415", "cornerRadius": 16, "stroke": {"thickness": 2, "fill": "$orange-primary"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table03Label", "fill": "$orange-primary", "content": "03", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "frame", "id": "Table03Info", "fill": "$orange-primary", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "Table03InfoText", "fill": "$text-primary", "content": "ĐANG CHỌN", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
              {"type": "frame", "id": "Table04", "width": 140, "height": 120, "fill": "#F59E0B15", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "#F59E0B"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table04Label", "fill": "#F59E0B", "content": "04", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "frame", "id": "Table04Info", "fill": "#F59E0B30", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "Table04InfoText", "fill": "#F59E0B", "content": "Đặt 19:00", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
              {"type": "frame", "id": "Table05", "width": 140, "height": 120, "fill": "#22C55E15", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "#22C55E"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table05Label", "fill": "#22C55E", "content": "05", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "text", "id": "Table05Status", "fill": "#22C55E", "content": "Trống", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]}
            ]},
            {"type": "frame", "id": "TableRow2", "width": "fill_container", "gap": 24, "children": [
              {"type": "frame", "id": "Table06", "width": 140, "height": 120, "fill": "#EF444415", "cornerRadius": 16, "stroke": {"thickness": 2, "fill": "#EF4444"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table06Label", "fill": "#EF4444", "content": "06", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "frame", "id": "Table06Info", "fill": "#EF444430", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "Table06InfoText", "fill": "#EF4444", "content": "2 khách • 30p", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
              {"type": "frame", "id": "Table07", "width": 140, "height": 120, "fill": "#EF444415", "cornerRadius": 16, "stroke": {"thickness": 2, "fill": "#EF4444"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table07Label", "fill": "#EF4444", "content": "07", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "frame", "id": "Table07Info", "fill": "#EF444430", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "Table07InfoText", "fill": "#EF4444", "content": "6 khách • 1h20", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]},
              {"type": "frame", "id": "Table08", "width": 140, "height": 120, "fill": "#22C55E15", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "#22C55E"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table08Label", "fill": "#22C55E", "content": "08", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "text", "id": "Table08Status", "fill": "#22C55E", "content": "Trống", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]},
              {"type": "frame", "id": "Table09", "width": 140, "height": 120, "fill": "#22C55E15", "cornerRadius": 16, "stroke": {"thickness": 1, "fill": "#22C55E"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table09Label", "fill": "#22C55E", "content": "09", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "text", "id": "Table09Status", "fill": "#22C55E", "content": "Trống", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "500"}]},
              {"type": "frame", "id": "Table10", "width": 140, "height": 120, "fill": "#EF444415", "cornerRadius": 16, "stroke": {"thickness": 2, "fill": "#EF4444"}, "layout": "vertical", "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [{"type": "text", "id": "Table10Label", "fill": "#EF4444", "content": "10", "fontFamily": "Roboto", "fontSize": 32, "fontWeight": "700"}, {"type": "frame", "id": "Table10Info", "fill": "#EF444430", "cornerRadius": 6, "padding": [4, 10], "children": [{"type": "text", "id": "Table10InfoText", "fill": "#EF4444", "content": "3 khách • 20p", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"}]}]}
            ]},
            {"type": "frame", "id": "TableMapStats", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 16, "padding": [16, 24], "gap": 40, "justifyContent": "center", "children": [
              {"type": "frame", "id": "StatTotal", "layout": "vertical", "gap": 4, "alignItems": "center", "children": [{"type": "text", "id": "StatTotalValue", "fill": "$text-primary", "content": "10", "fontFamily": "Roboto", "fontSize": 28, "fontWeight": "700"}, {"type": "text", "id": "StatTotalLabel", "fill": "$text-tertiary", "content": "Tổng bàn", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "normal"}]},
              {"type": "frame", "id": "StatEmpty", "layout": "vertical", "gap": 4, "alignItems": "center", "children": [{"type": "text", "id": "StatEmptyValue", "fill": "#22C55E", "content": "4", "fontFamily": "Roboto", "fontSize": 28, "fontWeight": "700"}, {"type": "text", "id": "StatEmptyLabel", "fill": "$text-tertiary", "content": "Trống", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "normal"}]},
              {"type": "frame", "id": "StatOccupied", "layout": "vertical", "gap": 4, "alignItems": "center", "children": [{"type": "text", "id": "StatOccupiedValue", "fill": "#EF4444", "content": "5", "fontFamily": "Roboto", "fontSize": 28, "fontWeight": "700"}, {"type": "text", "id": "StatOccupiedLabel", "fill": "$text-tertiary", "content": "Có khách", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "normal"}]},
              {"type": "frame", "id": "StatReserved", "layout": "vertical", "gap": 4, "alignItems": "center", "children": [{"type": "text", "id": "StatReservedValue", "fill": "#F59E0B", "content": "1", "fontFamily": "Roboto", "fontSize": 28, "fontWeight": "700"}, {"type": "text", "id": "StatReservedLabel", "fill": "$text-tertiary", "content": "Đặt trước", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "normal"}]}
            ]}
          ]
        }
      ]
    }
  ],
  "variables": {
    "bg-elevated": {"type": "color", "value": "#1A1A1D"},
    "bg-interactive": {"type": "color", "value": "#2A2A2E"},
    "bg-page": {"type": "color", "value": "#0A0A0B"},
    "border-default": {"type": "color", "value": "#2A2A2E"},
    "border-subtle": {"type": "color", "value": "#1F1F23"},
    "orange-primary": {"type": "color", "value": "#FF5C00"},
    "text-primary": {"type": "color", "value": "#FFFFFF"},
    "text-secondary": {"type": "color", "value": "#ADADB0"},
    "text-tertiary": {"type": "color", "value": "#8B8B90"}
  }
}
