Dymok

Блок .bg имеет нулевую высоту

https://codepen.io/UnluckySerivelha/pen/GXdqaO

https://codepen.io/UnluckySerivelha/pen/aapygq

Это называется аккордеон, на codepen можно найти разные реализации

ставить ей height: auto;

css media queries

display:flex родителю, по умолчанию будут растягиваться по самому высокому(align-items:stretch отвечает за это)

Картинку в отдельную обёртку, блок с текстом тоже, всё это в один контейнер с display: flex.

Задать отступ с помощью padding-left для внешней обёртки без фона, background и остальное поместить во внутреннюю обертку

В зависимости от выбранного размера и цвета просто подменяется изображение на другое готовое, в инструментах разработчка видно

https://www.w3schools.com/tags/att_a_download.asp

li {
display: flex;
align-items: center;
}

Примерно так

.authorization a {
 position: relative;
}

.authorization a::before {
 content: '';
position:absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: url(../images/user.svg);
 margin-right: 3px;
}