{
  "version": "2.6",
  "children": [
    {
      "type": "frame",
      "id": "StaffScheduleScreen",
      "name": "Screen/StaffSchedule",
      "reusable": true,
      "width": 560,
      "height": 720,
      "fill": "$bg-page",
      "cornerRadius": 20,
      "layout": "vertical",
      "children": [
        {
          "type": "frame",
          "id": "ScheduleHeader",
          "width": "fill_container",
          "fill": "$bg-elevated",
          "padding": [16, 20],
          "gap": 12,
          "alignItems": "center",
          "children": [
            {"type": "frame", "id": "ScheduleIconBg", "width": 44, "height": 44, "fill": "#3B82F615", "cornerRadius": 12, "justifyContent": "center", "alignItems": "center", "children": [
              {"type": "icon_font", "id": "ScheduleIcon", "width": 22, "height": 22, "iconFontName": "calendar-days", "iconFontFamily": "lucide", "fill": "#3B82F6"}
            ]},
            {"type": "frame", "id": "ScheduleTitleBox", "width": "fill_container", "layout": "vertical", "gap": 2, "children": [
              {"type": "text", "id": "ScheduleTitle", "fill": "$text-primary", "content": "Lịch Làm Việc", "fontFamily": "Roboto", "fontSize": 18, "fontWeight": "700"},
              {"type": "text", "id": "ScheduleWeek", "fill": "$text-tertiary", "content": "Tuần 06/02 - 12/02/2026", "fontFamily": "Roboto", "fontSize": 13}
            ]},
            {"type": "frame", "id": "ScheduleNav", "gap": 8, "children": [
              {"type": "frame", "id": "PrevWeek", "width": 32, "height": 32, "fill": "$bg-interactive", "cornerRadius": 8, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "icon_font", "id": "PrevWeekIcon", "width": 16, "height": 16, "iconFontName": "chevron-left", "iconFontFamily": "lucide", "fill": "$text-secondary"}
              ]},
              {"type": "frame", "id": "NextWeek", "width": 32, "height": 32, "fill": "$bg-interactive", "cornerRadius": 8, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "icon_font", "id": "NextWeekIcon", "width": 16, "height": 16, "iconFontName": "chevron-right", "iconFontFamily": "lucide", "fill": "$text-secondary"}
              ]}
            ]}
          ]
        },
        {
          "type": "frame",
          "id": "DayTabs",
          "width": "fill_container",
          "fill": "$bg-elevated",
          "padding": [12, 16],
          "gap": 4,
          "justifyContent": "space_between",
          "children": [
            {"type": "frame", "id": "Day1", "width": "fill_container", "layout": "vertical", "gap": 4, "alignItems": "center", "padding": [8, 0], "children": [
              {"type": "text", "id": "Day1Name", "fill": "$text-tertiary", "content": "T2", "fontFamily": "Roboto", "fontSize": 11},
              {"type": "frame", "id": "Day1Num", "width": 32, "height": 32, "fill": "$bg-interactive", "cornerRadius": 16, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "text", "id": "Day1NumText", "fill": "$text-secondary", "content": "06", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}
              ]}
            ]},
            {"type": "frame", "id": "Day2", "width": "fill_container", "layout": "vertical", "gap": 4, "alignItems": "center", "padding": [8, 0], "children": [
              {"type": "text", "id": "Day2Name", "fill": "$text-primary", "content": "T3", "fontFamily": "Roboto", "fontSize": 11, "fontWeight": "600"},
              {"type": "frame", "id": "Day2Num", "width": 32, "height": 32, "fill": "$orange-primary", "cornerRadius": 16, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "text", "id": "Day2NumText", "fill": "#FFFFFF", "content": "07", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}
              ]}
            ]},
            {"type": "frame", "id": "Day3", "width": "fill_container", "layout": "vertical", "gap": 4, "alignItems": "center", "padding": [8, 0], "children": [
              {"type": "text", "id": "Day3Name", "fill": "$text-tertiary", "content": "T4", "fontFamily": "Roboto", "fontSize": 11},
              {"type": "frame", "id": "Day3Num", "width": 32, "height": 32, "fill": "$bg-interactive", "cornerRadius": 16, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "text", "id": "Day3NumText", "fill": "$text-secondary", "content": "08", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}
              ]}
            ]},
            {"type": "frame", "id": "Day4", "width": "fill_container", "layout": "vertical", "gap": 4, "alignItems": "center", "padding": [8, 0], "children": [
              {"type": "text", "id": "Day4Name", "fill": "$text-tertiary", "content": "T5", "fontFamily": "Roboto", "fontSize": 11},
              {"type": "frame", "id": "Day4Num", "width": 32, "height": 32, "fill": "$bg-interactive", "cornerRadius": 16, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "text", "id": "Day4NumText", "fill": "$text-secondary", "content": "09", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}
              ]}
            ]},
            {"type": "frame", "id": "Day5", "width": "fill_container", "layout": "vertical", "gap": 4, "alignItems": "center", "padding": [8, 0], "children": [
              {"type": "text", "id": "Day5Name", "fill": "$text-tertiary", "content": "T6", "fontFamily": "Roboto", "fontSize": 11},
              {"type": "frame", "id": "Day5Num", "width": 32, "height": 32, "fill": "$bg-interactive", "cornerRadius": 16, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "text", "id": "Day5NumText", "fill": "$text-secondary", "content": "10", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}
              ]}
            ]},
            {"type": "frame", "id": "Day6", "width": "fill_container", "layout": "vertical", "gap": 4, "alignItems": "center", "padding": [8, 0], "children": [
              {"type": "text", "id": "Day6Name", "fill": "$text-tertiary", "content": "T7", "fontFamily": "Roboto", "fontSize": 11},
              {"type": "frame", "id": "Day6Num", "width": 32, "height": 32, "fill": "$bg-interactive", "cornerRadius": 16, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "text", "id": "Day6NumText", "fill": "$text-secondary", "content": "11", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}
              ]}
            ]},
            {"type": "frame", "id": "Day7", "width": "fill_container", "layout": "vertical", "gap": 4, "alignItems": "center", "padding": [8, 0], "children": [
              {"type": "text", "id": "Day7Name", "fill": "$text-tertiary", "content": "CN", "fontFamily": "Roboto", "fontSize": 11},
              {"type": "frame", "id": "Day7Num", "width": 32, "height": 32, "fill": "$bg-interactive", "cornerRadius": 16, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "text", "id": "Day7NumText", "fill": "$text-secondary", "content": "12", "fontFamily": "Roboto", "fontSize": 13, "fontWeight": "600"}
              ]}
            ]}
          ]
        },
        {
          "type": "frame",
          "id": "ShiftList",
          "width": "fill_container",
          "height": "fill_container",
          "layout": "vertical",
          "padding": [16, 20],
          "gap": 16,
          "children": [
            {"type": "frame", "id": "MorningShift", "width": "fill_container", "layout": "vertical", "gap": 10, "children": [
              {"type": "frame", "id": "MorningHeader", "width": "fill_container", "gap": 8, "alignItems": "center", "children": [
                {"type": "frame", "id": "MorningIcon", "width": 24, "height": 24, "fill": "#EAB30820", "cornerRadius": 6, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "icon_font", "id": "MorningIconI", "width": 14, "height": 14, "iconFontName": "sunrise", "iconFontFamily": "lucide", "fill": "#EAB308"}
                ]},
                {"type": "text", "id": "MorningTitle", "fill": "$text-primary", "content": "Ca sáng", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"},
                {"type": "text", "id": "MorningTime", "fill": "$text-tertiary", "content": "06:00 - 14:00", "fontFamily": "Roboto", "fontSize": 12}
              ]},
              {"type": "frame", "id": "MorningStaff", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 12, "padding": 12, "gap": 10, "children": [
                {"type": "frame", "id": "MS1", "width": 36, "height": 36, "fill": {"type": "gradient", "gradientType": "linear", "rotation": 135, "colors": [{"color": "#3B82F6", "position": 0}, {"color": "#8B5CF6", "position": 1}]}, "cornerRadius": 18, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "text", "id": "MS1Text", "fill": "#FFFFFF", "content": "NA", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}
                ]},
                {"type": "frame", "id": "MS2", "width": 36, "height": 36, "fill": {"type": "gradient", "gradientType": "linear", "rotation": 135, "colors": [{"color": "#F97316", "position": 0}, {"color": "#EAB308", "position": 1}]}, "cornerRadius": 18, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "text", "id": "MS2Text", "fill": "#FFFFFF", "content": "TH", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}
                ]},
                {"type": "frame", "id": "MS3", "width": 36, "height": 36, "fill": {"type": "gradient", "gradientType": "linear", "rotation": 135, "colors": [{"color": "#10B981", "position": 0}, {"color": "#22C55E", "position": 1}]}, "cornerRadius": 18, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "text", "id": "MS3Text", "fill": "#FFFFFF", "content": "LT", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}
                ]},
                {"type": "frame", "id": "AddMorning", "width": 36, "height": 36, "stroke": {"thickness": 2, "fill": "$border-default"}, "cornerRadius": 18, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "icon_font", "id": "AddMorningIcon", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$text-tertiary"}
                ]}
              ]}
            ]},
            {"type": "frame", "id": "AfternoonShift", "width": "fill_container", "layout": "vertical", "gap": 10, "children": [
              {"type": "frame", "id": "AfternoonHeader", "width": "fill_container", "gap": 8, "alignItems": "center", "children": [
                {"type": "frame", "id": "AfternoonIcon", "width": 24, "height": 24, "fill": "#F9731620", "cornerRadius": 6, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "icon_font", "id": "AfternoonIconI", "width": 14, "height": 14, "iconFontName": "sun", "iconFontFamily": "lucide", "fill": "#F97316"}
                ]},
                {"type": "text", "id": "AfternoonTitle", "fill": "$text-primary", "content": "Ca chiều", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"},
                {"type": "text", "id": "AfternoonTime", "fill": "$text-tertiary", "content": "14:00 - 22:00", "fontFamily": "Roboto", "fontSize": 12}
              ]},
              {"type": "frame", "id": "AfternoonStaff", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 12, "padding": 12, "gap": 10, "children": [
                {"type": "frame", "id": "AS1", "width": 36, "height": 36, "fill": {"type": "gradient", "gradientType": "linear", "rotation": 135, "colors": [{"color": "#EC4899", "position": 0}, {"color": "#F472B6", "position": 1}]}, "cornerRadius": 18, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "text", "id": "AS1Text", "fill": "#FFFFFF", "content": "PL", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}
                ]},
                {"type": "frame", "id": "AS2", "width": 36, "height": 36, "fill": {"type": "gradient", "gradientType": "linear", "rotation": 135, "colors": [{"color": "#06B6D4", "position": 0}, {"color": "#22D3EE", "position": 1}]}, "cornerRadius": 18, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "text", "id": "AS2Text", "fill": "#FFFFFF", "content": "HN", "fontFamily": "Roboto", "fontSize": 12, "fontWeight": "600"}
                ]},
                {"type": "frame", "id": "AddAfternoon", "width": 36, "height": 36, "stroke": {"thickness": 2, "fill": "$border-default"}, "cornerRadius": 18, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "icon_font", "id": "AddAfternoonIcon", "width": 16, "height": 16, "iconFontName": "plus", "iconFontFamily": "lucide", "fill": "$text-tertiary"}
                ]}
              ]}
            ]},
            {"type": "frame", "id": "NightShift", "width": "fill_container", "layout": "vertical", "gap": 10, "children": [
              {"type": "frame", "id": "NightHeader", "width": "fill_container", "gap": 8, "alignItems": "center", "children": [
                {"type": "frame", "id": "NightIcon", "width": 24, "height": 24, "fill": "#8B5CF620", "cornerRadius": 6, "justifyContent": "center", "alignItems": "center", "children": [
                  {"type": "icon_font", "id": "NightIconI", "width": 14, "height": 14, "iconFontName": "moon", "iconFontFamily": "lucide", "fill": "#8B5CF6"}
                ]},
                {"type": "text", "id": "NightTitle", "fill": "$text-primary", "content": "Ca tối", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"},
                {"type": "text", "id": "NightTime", "fill": "$text-tertiary", "content": "22:00 - 06:00", "fontFamily": "Roboto", "fontSize": 12}
              ]},
              {"type": "frame", "id": "NightEmpty", "width": "fill_container", "fill": "$bg-elevated", "cornerRadius": 12, "padding": 16, "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [
                {"type": "icon_font", "id": "NightEmptyIcon", "width": 20, "height": 20, "iconFontName": "user-x", "iconFontFamily": "lucide", "fill": "$text-tertiary"},
                {"type": "text", "id": "NightEmptyText", "fill": "$text-tertiary", "content": "Chưa có nhân viên", "fontFamily": "Roboto", "fontSize": 13}
              ]}
            ]}
          ]
        },
        {
          "type": "frame",
          "id": "ScheduleFooter",
          "width": "fill_container",
          "fill": "$bg-elevated",
          "stroke": {"thickness": 1, "fill": "$border-subtle"},
          "gap": 12,
          "padding": [16, 20],
          "children": [
            {"type": "frame", "id": "EditScheduleBtn", "width": "fill_container", "height": 48, "fill": "$bg-interactive", "cornerRadius": 12, "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [
              {"type": "icon_font", "id": "EditScheduleIcon", "width": 18, "height": 18, "iconFontName": "pencil", "iconFontFamily": "lucide", "fill": "$text-secondary"},
              {"type": "text", "id": "EditScheduleText", "fill": "$text-secondary", "content": "Chỉnh sửa", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "500"}
            ]},
            {"type": "frame", "id": "PublishBtn", "width": "fill_container", "height": 48, "fill": {"type": "gradient", "gradientType": "linear", "rotation": 135, "colors": [{"color": "#FF5C00", "position": 0}, {"color": "#FF8A4C", "position": 1}]}, "cornerRadius": 12, "gap": 8, "justifyContent": "center", "alignItems": "center", "children": [
              {"type": "icon_font", "id": "PublishIcon", "width": 18, "height": 18, "iconFontName": "send", "iconFontFamily": "lucide", "fill": "#FFFFFF"},
              {"type": "text", "id": "PublishText", "fill": "#FFFFFF", "content": "Đăng lịch", "fontFamily": "Roboto", "fontSize": 14, "fontWeight": "600"}
            ]}
          ]
        }
      ]
    }
  ],
  "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"}
  }
}
