ラベルを用いてボタンを結合させる方法

Question

写真（イメージ）を白色の余白に入れたいのですが、うまく反映できません。

原因仮説は、ラベルの要素にクラス指定がないのかなぁと思うのですが、もしそうであればどのように変更するべきでしょうか？
また違ったやり方があれば教えてください！

実行結果

_main_chat.html.haml

一部省略
　　 .chat-main__message-from--footer
      %input{placeholder: "type a message ", class:"chat-main__message-from--footer--comment"}
      %label{class:".chat-main__message-from--footer--comment"}
        = icon('far', 'image')
        %input{type: "file",class: "icon"}
      .chat-main__message-from--footer--send-box
        = link_to "#" do
          Send

_messages.scss

     &__message-from{
        background-color: #d2d2d2;
        height: 90px;
        &--footer{
          display: flex;
          padding: 20px 40px;
          text-align: center;
          
          &--comment{
           display:flex;
           justify-content: space-between;
           align-items:center;
           padding: 0 10px;
           color:#999999; 
           background-color: #ffffff;
           line-height: 50px;
           width:calc(100% - 115px);
           position: relative;
           
           a {
            margin: 0 5px;
            color:black;
            text-decoration: none;
          }
          }
          &--send-box{
            margin-left:15px;
            background-color:#38aef0;
            line-height:50px;
            width:100px;
            a {
              margin: 0 5px;
              color:#ffffff;
              text-decoration:none;
            }
          }
        }
      }
    }
  }
  .icon{
    display: none;
  }