- type: sections
  path: overview
  icon: mdi:home-circle
  # Layout
  max_columns: 3
  dense_section_placement: true
  layout: center
  # Style
  top_margin: false  
  background:
    opacity: 66
    alignment: center
    size: cover
    repeat: no-repeat
    attachment: fixed
    image: /api/image/serve/2b8644fea7b9001172f03d391937126e/original
  # Header
  header:
    card:
      type: markdown
      text_only: true
      content: |+
        # Hi, {{ 'Lucy 🦊' if user=='Lucy Foxx' else 'Faelis 😽' }}!
        ✨ *enjoy every day as if it would be the last!* ✨

  sections:
    # Lights
    - type: grid
      cards:
        - name: Lights
          type: custom:bubble-card
          card_type: separator
          icon: mdi:lightbulb-group
          show_name: true
          show_icon: true
          card_layout: large
        - entity: light.group_fuchsbau
          type: custom:bubble-card
          card_type: button
          button_type: slider          
          show_name: true
          show_icon: true
          show_state: true
          show_attribute: true
          attribute: brightness
          card_layout: large
        - card_type: separator
          type: custom:bubble-card       
        - entity: light.group_floor
          type: custom:bubble-card
          card_type: button
          button_type: slider
          show_name: true
          show_icon: true
          show_state: true
          show_attribute: true
          attribute: brightness
          card_layout: large
          sub_button:
            - icon: mdi:lightbulb-off-outline           
              tap_action:
                action: perform-action
                perform_action: input_select.select_option
                target:
                  entity_id: input_select.floor_light_mode
                data:
                  option: 'Off'
            - icon: mdi:lightbulb-auto
              tap_action:
                action: perform-action
                perform_action: input_select.select_option
                target:
                  entity_id: input_select.floor_light_mode
                data:
                  option: Auto
            - icon: mdi:lightbulb-on
              tap_action:
                action: perform-action
                perform_action: input_select.select_option
                target:
                  entity_id: input_select.floor_light_mode
                data:
                  option: 'On'
          styles: |-
            .bubble-sub-button-1 {             
              background-color: ${hass.states['input_select.floor_light_mode'].state === 'Off' ? 'var(--teal-color)' :'var(--secondary-background-color)' };              
            }
            .bubble-sub-button-2 {
              background-color: ${hass.states['input_select.floor_light_mode'].state === 'Auto' ? 'var(--teal-color)' :'var(--secondary-background-color)' };
            }
            .bubble-sub-button-3 {
              background-color: ${hass.states['input_select.floor_light_mode'].state === 'On' ? 'var(--teal-color)' :'var(--secondary-background-color)' };              
            }          
        - entity: light.group_lucy
          type: custom:bubble-card
          card_type: button
          button_type: slider
          show_name: true
          show_icon: true
          show_state: true
          show_attribute: true
          attribute: brightness
          card_layout: large
          tap_action:
            action: toggle
          hold_action:
            action: more-info          
          grid_options:
            rows: 1
            columns: 6
        - entity: light.group_cave
          type: custom:bubble-card
          card_type: button
          button_type: slider
          show_name: true
          show_icon: true
          show_state: true
          show_attribute: true
          attribute: brightness
          card_layout: large
          grid_options:
            rows: 1
            columns: 6
        - entity: light.group_bathroom
          type: custom:bubble-card
          card_type: button
          button_type: slider
          show_name: true
          show_icon: true
          show_state: true
          show_attribute: true
          attribute: brightness
          card_layout: large
          grid_options:
            rows: 1
            columns: 6
        - entity: light.group_kitchen
          type: custom:bubble-card
          card_type: button
          button_type: slider
          show_name: true
          show_icon: true
          show_state: true
          show_attribute: true
          attribute: brightness
          card_layout: large
          grid_options:
            rows: 1
            columns: 6

    # Weather / Media Player
    - type: grid
      cards:
        - name: Weather
          type: custom:bubble-card
          card_type: separator
          icon: mdi:thermometer
          show_name: true
          show_icon: true
          card_layout: large           
        - name: Media Player
          type: custom:bubble-card
          card_type: separator
          icon: mdi:multimedia
          show_name: true
          show_icon: true
          card_layout: large  
    # Location
    - type: grid
      cards:
        - name: Location
          type: custom:bubble-card
          card_type: separator
          icon: mdi:map-marker-radius
          show_name: true
          show_icon: true
          card_layout: large           

    # Nav
    - type: grid
      cards:
        - type: custom:navbar-card
          template: mobile
          visibility:
            - condition: screen
              media_query: "(min-width: 0px) and (max-width: 767px)"
        - type: custom:navbar-card
          template: desktop
          visibility:
            - condition: screen
              media_query: "(min-width: 767px)"



