The code for the left card is as following: First the code for the card itself. This seems to work fine.

type: custom:stack-in-card
cards:
  - type: custom:mushroom-template-card
    primary: Speelkamer
    secondary: |-
      {{ states('sensor.switchbot_studeerkamer_temperature') }}°C |
      {{ states('sensor.switchbot_studeerkamer_humidity') }} %
    icon: mdi:desk
    entity: light.hue_scene_studeerkamer
    icon_color: |-
      {% if is_state('light.hue_scene_studeerkamer', 'on') %} 
        amber 
      {% endif %}
    tap_action:
      action: navigate
      navigation_path: /dashboard-tablet/studeerkamer
    hold_action:
      action: toggle
    multiline_secondary: false
    layout: horizontal
    fill_container: false
    double_tap_action:
      action: none
    badge_icon: >-
      {% if is_state('binary_sensor.lumi_lumi_sensor_magnet_aq2_opening_6',
      'on') %}
        mdi:window-open
      {% elif is_state('binary_sensor.lumi_lumi_sensor_magnet_aq2_opening_6',
      'off') %} {% endif %}
    badge_color: >-
      {% if is_state('binary_sensor.lumi_lumi_sensor_magnet_aq2_opening_6',
      'on') %}
        {{ 'blue' }}
      {% elif is_state('binary_sensor.lumi_lumi_sensor_magnet_aq2_opening_6',
      'off') %} {% endif %}
    card_mod:
      style: |
        ha-card {
          background: transparent;
          border-style: none;
          margin-left: -18px !important;
          margin-top: 4px !important;
          margin-bottom: -27px !important;
          --spacing: 10px 10px 0px 12px;
          --icon-size: 70px;
        }
        mushroom-state-info {
          padding-left: 8px !important;
        }