type: grid
cards:
  - type: custom:bubble-card
    card_type: separator
    name: Ground floor
    card_layout: large
  - type: custom:bubble-card
    card_type: button
    button_type: switch
    entity: light.entrance_light
    show_icon: true
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: false
    slider_live_update: false
    styles: |-
      .bubble-button-card:before {        
          position: absolute;
          display: flex;
          justify-content: center;
          align-items: center;
          left: 38px;
          top: 4px;
          z-index: 1;
          line-height: 0;
          background-color: ${hass.states['binary_sensor.front_door_contact'].state === 'on' ? 'var(--primary-color)' : 'gray'}!important;
          content: ${hass.states['binary_sensor.front_door_contact'].state === 'on' ? 'url("https://api.iconify.design/mdi/door-open.svg?color=white&width=12")' : 'url("https://api.iconify.design/mdi/door-closed.svg?color=white&width=12")'}!important;
          width: var(--mush-badge-size, 16px);
          height: var(--mush-badge-size, 16px);
          border-radius: var(--mush-badge-border-radius, 50%);
        }
    sub_button: []
    card_layout: large
    use_accent_color: false
    name: Entrance
    tap_action:
      action: toggle
    hold_action:
      action: more-info
    grid_options:
      columns: 6
      rows: 1
    icon: ""
  - type: custom:bubble-card
    card_type: button
    button_type: switch
    entity: light.back_garden_light
    show_icon: true
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    slider_live_update: false
    styles: |-
      .bubble-button-card:before {        
          position: absolute;
          display: flex;
          justify-content: center;
          align-items: center;
          left: 38px;
          top: 4px;
          z-index: 1;
          line-height: 0;
          background-color: ${hass.states['binary_sensor.living_room_door_contact'].state === 'on' ? 'var(--primary-color)' : 'gray'}!important;
          content: ${hass.states['binary_sensor.living_room_door_contact'].state === 'on' ? 'url("https://api.iconify.design/mdi/door-open.svg?color=white&width=12")' : 'url("https://api.iconify.design/mdi/door-closed.svg?color=white&width=12")'}!important;
          width: var(--mush-badge-size, 16px);
          height: var(--mush-badge-size, 16px);
          border-radius: var(--mush-badge-border-radius, 50%);
        }
    sub_button:
      - entity: binary_sensor.backgarden_all_occupancy
        icon: mdi:motion-sensor
        show_background: false
        state_background: false
        visibility:
          - condition: state
            entity: binary_sensor.backgarden_all_occupancy
            state: "on"
        show_state: false
        show_last_changed: false
        show_attribute: false
        show_icon: true
    card_layout: large
    use_accent_color: true
    name: Back garden
    tap_action:
      action: toggle
    hold_action:
      action: more-info
    grid_options:
      columns: 6
      rows: 1
    icon: mdi:light-flood-down
  - type: custom:bubble-card
    card_type: button
    button_type: slider
    entity: light.living_room_lights
    show_icon: true
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    slider_live_update: false
    styles: |-
      .bubble-button-card:after {        
          position: absolute;
          display: flex;
          justify-content: center;
          align-items: center;
          line-height: 0;
          left: 38px;
          bottom: 4px;
          z-index: 1;
          line-height: 0;
          background-color: ${hass.states['sensor.wiser_lts_heating_demand_living_room'].state > 0 ? 'var(--orange-color)' : 'gray'}!important;
          content: ${hass.states['sensor.wiser_lts_heating_demand_living_room'].state > 0 ? 'url("https://api.iconify.design/mdi/heater.svg?color=white&width=12")' : 'url("https://api.iconify.design/mdi/heater-disabled.svg?color=white&width=12")'}!important;
          width: var(--mush-badge-size, 16px);
          height: var(--mush-badge-size, 16px);
          border-radius: var(--mush-badge-border-radius, 50%);
        }
      .bubble-button-card:before {        
          position: absolute;
          display: flex;
          justify-content: center;
          align-items: center;
          left: 38px;
          top: 4px;
          z-index: 1;
          line-height: 0;
          background-color: ${hass.states['binary_sensor.living_room_door_contact'].state === 'on' ? 'var(--primary-color)' : 'gray'}!important;
          content: ${hass.states['binary_sensor.living_room_door_contact'].state === 'on' ? 'url("https://api.iconify.design/mdi/door-open.svg?color=white&width=12")' : 'url("https://api.iconify.design/mdi/door-closed.svg?color=white&width=12")'}!important;
          width: var(--mush-badge-size, 16px);
          height: var(--mush-badge-size, 16px);
          border-radius: var(--mush-badge-border-radius, 50%);
        }
    sub_button:
      - entity: light.living_room_lights
        tap_action:
          action: perform-action
          target:
            entity_id: light.living_room_lights
          perform_action: light.turn_on
          data:
            brightness_pct: 10
        icon: mdi:lightbulb-on-40
        name: ""
        show_name: false
        show_icon: true
        show_state: false
        state_background: true
        show_attribute: false
        attribute: brightness
        show_background: true
      - entity: light.living_room_lights
        icon: mdi:lightbulb-on-80
        show_background: true
        light_background: true
        show_icon: true
        state_background: true
        tap_action:
          action: perform-action
          perform_action: light.turn_on
          target:
            entity_id: light.living_room_lights
          data:
            brightness_pct: 40
      - entity: light.dig2go
        icon: mdi:led-strip-variant
        show_attribute: false
        show_state: false
        show_last_changed: false
        show_name: false
        tap_action:
          action: toggle
        hold_action:
          action: more-info
        state_background: true
        light_background: true
        show_background: true
      - entity: media_player.lg_webos_tv_uh605v
        show_background: true
        visibility:
          - condition: state
            entity: media_player.lg_webos_tv_uh605v
            state_not: "off"
        state_background: true
        icon: mdi:television
        show_name: false
        show_icon: true
        show_attribute: false
      - entity: media_player.google_nest_speaker
        visibility:
          - condition: state
            entity: media_player.google_nest_speaker
            state_not: "off"
      - entity: binary_sensor.presence_sensor_living_room_presence
        icon: mdi:motion-sensor
        show_background: false
        state_background: false
        visibility:
          - condition: state
            entity: binary_sensor.presence_sensor_living_room_presence
            state: "on"
        show_state: false
        show_last_changed: false
        show_attribute: false
        show_icon: true
      - entity: climate.wiser_living_room
        show_icon: false
        show_state: false
        show_last_changed: false
        show_name: false
        state_background: true
        show_background: false
        show_attribute: true
        attribute: current_temperature
      - entity: sensor.wiser_lts_humidity_living_room
        show_icon: false
        show_state: true
        show_background: false
    card_layout: large-2-rows
    use_accent_color: true
    name: Living room
    tap_action:
      action: toggle
    hold_action:
      action: more-info
    grid_options:
      columns: 12
      rows: 1
    attribute: brightness
    icon: mdi:light-recessed
  - type: custom:bubble-card
    card_type: button
    button_type: switch
    entity: light.kitchen_lights_all
    show_icon: true
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    slider_live_update: false
    styles: ".bubble-button-card:after {        \n    position: absolute;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    line-height: 0;\n    left: 38px;\n    bottom: 4px;\n    z-index: 1;\n    line-height: 0;\n    background-color: ${hass.states['sensor.wiser_lts_heating_demand_kitchen'].state > 0 ? 'var(--orange-color)' : 'gray'}!important;\n    content: ${hass.states['sensor.wiser_lts_heating_demand_kitchen'].state > 0 ? 'url(\"https://api.iconify.design/mdi/heater.svg?color=white&width=12\")' : 'url(\"https://api.iconify.design/mdi/heater-disabled.svg?color=white&width=12\")'}!important;\n    width: var(--mush-badge-size, 16px);\n    height: var(--mush-badge-size, 16px);\n    border-radius: var(--mush-badge-border-radius, 50%);\n  }\n.bubble-button-card:before {        \n    position: absolute;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    left: 38px;\n    top: 4px;\n    z-index: 1;\n    line-height: 0;\n    background-color: ${hass.states['binary_sensor.utility_room_door_contact'].state === 'on' ? 'var(--primary-color)' : 'gray'}!important;\n    content: ${hass.states['binary_sensor.utility_room_door_contact'].state === 'on' ? 'url(\"https://api.iconify.design/mdi/door-open.svg?color=white&width=12\")' : 'url(\"https://api.iconify.design/mdi/door-closed.svg?color=white&width=12\")'}!important;\n    width: var(--mush-badge-size, 16px);\n    height: var(--mush-badge-size, 16px);\n    border-radius: var(--mush-badge-border-radius, 50%);\n  }\n#Place all the DOM changing stuff on the bottom\n  ${(() => {\n    //Getting the timer-data from hass and saving as local variable\n    const timerEntity = hass.states['timer.kitchen_lights_timer'];\n    \n    //Saving the now as a Date variable so we can calculate the difference \n    const now = new Date(); \n    \n    //Preparing the result \n    let result = \"\";\n\n  \ttry {\n      \t  const endTime = new Date(timerEntity.attributes.finishes_at);      //Taking endtime from timer-entity and making a date-time from it \n  \t  const runningTime = Math.round((endTime - now)/1000);           //Calculating the difference\n          const minutes = Math.floor(runningTime / 60);                            //Distilling the minutes from it \n          const remainingSeconds = runningTime % 60;                            //Save the rest as seconds\n\n          if(isNaN(runningTime) && timerEntity.state !='paused')\n               {result = timerEntity.attributes.duration;}                                //if not running and not paused show initial value\n              else if(timerEntity.state==='paused')\n               {result = timerEntity.attributes.remaining;}                            // if paused show remaining value\n              else\n               {result = minutes + \":\" + (\"0\" + remainingSeconds).slice(-2) ;}  //if running show remaining seconds\n  \t} \n  \tcatch (error) { \n          result = timerEntity.attributes.duration;          //if something went wrong show initial value\n        }\n     \n      //writing to the sub-button\n      card.querySelector('.bubble-sub-button-4 .bubble-sub-button-name-container').innerText = result;  \n      }\n  )()}"
    sub_button:
      - entity: media_player.google_mini_speaker
        visibility:
          - condition: state
            entity: media_player.google_mini_speaker
            state_not: "off"
      - entity: binary_sensor.kitchen_presence_sensor_presence
        icon: mdi:motion-sensor
        show_background: false
        state_background: false
        visibility:
          - condition: state
            entity: binary_sensor.kitchen_presence_sensor_presence
            state: "on"
        show_state: false
        show_last_changed: false
        show_attribute: false
        show_icon: true
      - entity: climate.wiser_kitchen
        show_icon: false
        show_state: false
        show_last_changed: false
        show_name: false
        state_background: true
        show_background: false
        show_attribute: true
        attribute: current_temperature
      - entity: timer.kitchen_lights_timer
        show_last_changed: false
        show_state: false
        show_name: false
        show_icon: true
        visibility:
          - condition: state
            entity: timer.kitchen_lights_timer
            state: active
        show_attribute: true
        attribute: remaining
        state_background: false
        show_background: true
    card_layout: large
    use_accent_color: true
    name: Kitchen & Utility
    tap_action:
      action: toggle
    hold_action:
      action: more-info
    grid_options:
      columns: 12
      rows: 1
    icon: ""
  - type: custom:bubble-card
    card_type: button
    button_type: switch
    entity: light.studio_lights_ceiling
    show_icon: true
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: false
    slider_live_update: false
    styles: |-
      .bubble-button-card:before {        
          position: absolute;
          display: flex;
          justify-content: center;
          align-items: center;
          left: 38px;
          top: 4px;
          z-index: 1;
          line-height: 0;
          background-color: ${hass.states['binary_sensor.back_door_contact'].state === 'on' ? 'var(--primary-color)' : 'gray'}!important;
          content: ${hass.states['binary_sensor.back_door_contact'].state === 'on' ? 'url("https://api.iconify.design/mdi/door-open.svg?color=white&width=12")' : 'url("https://api.iconify.design/mdi/door-closed.svg?color=white&width=12")'}!important;
          width: var(--mush-badge-size, 16px);
          height: var(--mush-badge-size, 16px);
          border-radius: var(--mush-badge-border-radius, 50%);
        }
    sub_button: []
    card_layout: large
    use_accent_color: true
    name: Studio
    tap_action:
      action: toggle
    hold_action:
      action: more-info
    grid_options:
      columns: 6
      rows: 1
    icon: mdi:light-recessed
    show_name: true
  - type: custom:bubble-card
    card_type: separator
    name: First floor
    card_layout: large
  - type: custom:bubble-card
    card_type: button
    button_type: switch
    entity: light.landing_light
    show_icon: true
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    slider_live_update: false
    styles: ""
    sub_button:
      - entity: binary_sensor.stairs2_motion_sensor_occupancy
        icon: mdi:motion-sensor
        show_background: false
        state_background: false
        visibility:
          - condition: state
            entity: binary_sensor.stairs2_motion_sensor_occupancy
            state: "on"
        show_state: false
        show_last_changed: false
        show_attribute: false
        show_icon: true
    card_layout: large
    use_accent_color: true
    name: Stairs & Landing
    tap_action:
      action: toggle
    hold_action:
      action: more-info
    grid_options:
      columns: 6
      rows: 1
    icon: ""
  - type: custom:bubble-card
    card_type: button
    button_type: slider
    entity: light.bed_led
    show_icon: true
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    slider_live_update: false
    styles: ".bubble-button-card:after {        \n    position: absolute;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    line-height: 0;\n    left: 38px;\n    bottom: 4px;\n    z-index: 1;\n    line-height: 0;\n    background-color: ${hass.states['sensor.wiser_lts_heating_demand_main_bedroom'].state > 0 ? 'var(--orange-color)' : 'gray'}!important;\n    content: ${hass.states['sensor.wiser_lts_heating_demand_main_bedroom'].state > 0 ? 'url(\"https://api.iconify.design/mdi/heater.svg?color=white&width=12\")' : 'url(\"https://api.iconify.design/mdi/heater-disabled.svg?color=white&width=12\")'}!important;\n    width: var(--mush-badge-size, 16px);\n    height: var(--mush-badge-size, 16px);\n    border-radius: var(--mush-badge-border-radius, 50%);\n  }\n#Place all the DOM changing stuff on the bottom\n  ${(() => {\n    //Getting the timer-data from hass and saving as local variable\n    const timerEntity = hass.states['timer.bed_heater_timer'];\n    \n    //Saving the now as a Date variable so we can calculate the difference \n    const now = new Date(); \n    \n    //Preparing the result \n    let result = \"\";\n\n  \ttry {\n      \t  const endTime = new Date(timerEntity.attributes.finishes_at);      //Taking endtime from timer-entity and making a date-time from it \n  \t  const runningTime = Math.round((endTime - now)/1000);           //Calculating the difference\n          const minutes = Math.floor(runningTime / 60);                            //Distilling the minutes from it \n          const remainingSeconds = runningTime % 60;                            //Save the rest as seconds\n\n          if(isNaN(runningTime) && timerEntity.state !='paused')\n               {result = timerEntity.attributes.duration;}                                //if not running and not paused show initial value\n              else if(timerEntity.state==='paused')\n               {result = timerEntity.attributes.remaining;}                            // if paused show remaining value\n              else\n               {result = minutes + \":\" + (\"0\" + remainingSeconds).slice(-2) ;}  //if running show remaining seconds\n  \t} \n  \tcatch (error) { \n          result = timerEntity.attributes.duration;          //if something went wrong show initial value\n        }\n     \n      //writing to the sub-button\n      card.querySelector('.bubble-sub-button-7 .bubble-sub-button-name-container').innerText = result;  \n      }\n  )()}"
    sub_button:
      - entity: light.bed_led
        icon: mdi:power-sleep
        show_background: true
        tap_action:
          action: perform-action
          target:
            entity_id: light.bed_led
          perform_action: light.turn_on
          data:
            brightness_pct: 1
            rgb_color:
              - 255
              - 0
              - 0
      - entity: light.bed_led
        icon: mdi:diaper-outline
        show_background: true
        tap_action:
          action: perform-action
          perform_action: light.turn_on
          target:
            entity_id: light.bed_led
          data:
            rgb_color:
              - 255
              - 0
              - 0
            brightness_pct: 10
        hold_action:
          action: more-info
      - entity: sensor.bedroom_temp_test_temperature
        show_icon: true
        show_state: true
        show_last_changed: false
        show_name: false
        state_background: true
        show_background: false
        show_attribute: false
        icon: mdi:door
      - entity: sensor.bedroom_temp_test_humidity
        show_state: true
        state_background: false
        show_background: false
        show_icon: true
        show_name: false
        icon: mdi:door
      - entity: climate.wiser_main_bedroom
        show_attribute: true
        attribute: current_temperature
        show_background: false
        show_icon: true
        icon: mdi:window-closed-variant
        show_arrow: false
      - entity: switch.bed_heater_plug
        icon: fas:bed-pulse
        state_background: true
        show_background: true
        show_state: false
        show_attribute: false
        tap_action:
          action: toggle
        show_name: false
        show_icon: true
        show_last_changed: false
      - entity: timer.bed_heater_timer
        show_icon: true
        state_background: false
        show_background: true
        show_attribute: true
        attribute: remaining
        visibility:
          - condition: state
            entity: timer.bed_heater_timer
            state: active
    card_layout: large-2-rows
    use_accent_color: true
    name: Bedroom
    tap_action:
      action: toggle
    hold_action:
      action: more-info
    grid_options:
      columns: 12
      rows: 1
    icon: mdi:led-strip-variant
  - type: custom:bubble-card
    card_type: button
    button_type: switch
    entity: light.guest_bedroom_lights
    show_icon: true
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    slider_live_update: false
    styles: |-
      .bubble-button-card:after {        
          position: absolute;
          display: flex;
          justify-content: center;
          align-items: center;
          line-height: 0;
          left: 38px;
          bottom: 4px;
          z-index: 1;
          line-height: 0;
          background-color: ${hass.states['sensor.wiser_lts_heating_demand_guest_bedroom'].state > 0 ? 'var(--orange-color)' : 'gray'}!important;
          content: ${hass.states['sensor.wiser_lts_heating_demand_guest_bedroom'].state > 0 ? 'url("https://api.iconify.design/mdi/heater.svg?color=white&width=12")' : 'url("https://api.iconify.design/mdi/heater-disabled.svg?color=white&width=12")'}!important;
          width: var(--mush-badge-size, 16px);
          height: var(--mush-badge-size, 16px);
          border-radius: var(--mush-badge-border-radius, 50%);
        }
    sub_button:
      - entity: sensor.guest_room_weather_temperature
        show_background: false
        show_icon: false
        show_state: true
      - entity: sensor.guest_room_weather_humidity
        show_state: true
        show_icon: false
        state_background: false
        show_background: false
      - entity: sensor.guest_room_rad_test_temperature
        show_last_changed: false
        show_icon: false
        state_background: false
        show_background: false
        show_state: true
      - entity: sensor.guest_room_rad_test_humidity
        state_background: false
        show_background: false
        show_state: true
        show_icon: false
      - entity: climate.wiser_guest_bedroom
        show_icon: true
        show_state: false
        show_last_changed: false
        show_name: false
        state_background: true
        show_background: false
        show_attribute: true
        attribute: current_temperature
        icon: mdi:window-closed-variant
    card_layout: large-2-rows
    use_accent_color: true
    name: Guests
    tap_action:
      action: toggle
    hold_action:
      action: more-info
    grid_options:
      columns: 12
      rows: 1
    icon: ""
  - type: custom:bubble-card
    card_type: button
    button_type: switch
    entity: light.bathroom_lights
    show_icon: true
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    slider_live_update: false
    styles: |-
      .bubble-button-card:before {        
          position: absolute;
          display: flex;
          justify-content: center;
          align-items: center;
          left: 38px;
          top: 4px;
          z-index: 1;
          line-height: 0;
          background-color: ${hass.states['binary_sensor.bathroom_door_contact'].state === 'on' ? 'var(--primary-color)' : 'gray'}!important;
          content: ${hass.states['binary_sensor.bathroom_door_contact'].state === 'on' ? 'url("https://api.iconify.design/mdi/door-open.svg?color=white&width=12")' : 'url("https://api.iconify.design/mdi/door-closed.svg?color=white&width=12")'}!important;
          width: var(--mush-badge-size, 16px);
          height: var(--mush-badge-size, 16px);
          border-radius: var(--mush-badge-border-radius, 50%);
        }
    sub_button:
      - entity: input_boolean.bathroom_busy
        icon: mdi:motion-sensor
        show_background: false
        state_background: false
        visibility:
          - condition: state
            entity: input_boolean.bathroom_busy
            state: "on"
        show_state: false
        show_last_changed: false
        show_attribute: false
        show_icon: true
      - entity: sensor.weather_station_temperature
        show_icon: false
        show_state: true
        show_last_changed: false
        show_name: false
        state_background: true
        show_background: false
        show_attribute: false
        attribute: current_temperature
      - entity: sensor.weather_station_humidity
        show_icon: false
        show_state: true
        show_background: false
    card_layout: large
    use_accent_color: true
    name: Bathroom
    tap_action:
      action: toggle
    hold_action:
      action: more-info
    grid_options:
      columns: 12
      rows: 1
    icon: mdi:light-recessed
  - type: custom:bubble-card
    card_type: cover
    entity: cover.living_room_blinds_all
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    attribute: current_position
    scrolling_effect: true
    name: Living room blinds
  - type: custom:bubble-card
    card_type: cover
    entity: cover.studio_blind_door
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    attribute: current_position
    scrolling_effect: true
  - type: custom:bubble-card
    card_type: cover
    entity: cover.studio_blind_1
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    attribute: current_position
    scrolling_effect: true
  - type: custom:bubble-card
    card_type: cover
    entity: cover.studio_blind_2
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    attribute: current_position
    scrolling_effect: true
  - type: custom:bubble-card
    card_type: cover
    entity: cover.bedroom_blind
    force_icon: false
    show_state: false
    show_last_changed: false
    show_attribute: true
    attribute: current_position
    scrolling_effect: true
  - type: vertical-stack
    cards:
      - type: custom:bubble-card
        card_type: pop-up
        hash: "#test"
        button_type: slider
        entity: cover.bedroom_blind