- component: f7-list
      config:
        visible: =(vars.Bypass) == true
        style:
          position: absolute
          left: 20%
          top: 16%
          width: 60%
          --f7-list-border-color: transparent
          opacity: 80%
        class:
          - padding-bottom
          - big-toggles
      slots:
        default:
          - component: Label
            config:
              text: Zones Bypassed
              style:
                padding-left: 20px
                font-weight: 500
                line-height: 20px
                backgroundColor: rgb(191, 189, 189)
                font-size: 75%
          - component: oh-repeater
            config:
              fragment: true
              for: item
              sourceType: itemsInGroup
              groupItem: =(vars.Prefix) + '_Bypass_Group'
            slots:
              default:
                - component: oh-toggle-item
                  config:
                    title: =loop.item.label
                    item: =loop.item.name
                    color: '=(items[loop.item.name].state == "ON") ? "green" : "gray"'
                    style:
                      backgroundColor: rgb(235, 232, 232)
                      font-size: 70%
                      --f7-toggle-width: 35px
                      --f7-toggle-height: 10px
                      --f7-list-item-min-height: 14px
                      --f7-list-item-padding-vertical: 1px
                      --f7-list-item-border-color: transparent