метка ввода не видна на мобильных устройствах (CSS3, нет JS)

Question

Я часами пытался понять, почему следующая метка (метка для входа, на котором нет дисплея) отсутствует на ма c и P C (сафари, chrome, FF ) но не на мобильных устройствах (я использую устройства LambdaTesting Android и iOS).

<input id="nav-menu" name="nav-menu" value="value" class="navbar-toggler" type="checkbox"></input>
<label class="navbar-toggler navbar-toggler-icon" for="nav-menu" onclick></label>

Этот ярлык имеет следующие CSS правила (S CSS):

@media (min-width:992px) {
  .navbar-toggler-icon{
    display: none;
  }
.navbar-toggler-icon {
background-image: url(data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://ww…p='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E);
}

.navbar-toggler {
    border-color: rgba(0, 0, 0, 0.1);
    color: rgba(0, 0, 0, 0.9);
}
.navbar-toggler-icon {
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    vertical-align: middle;
    content: "";
    background: no-repeat center center;
    background-size: 50% 50%;
    padding: 1.9rem 1.9rem;
    font-size: .25rem;
    line-height: 1;
    border: 1px solid transparent;
    border-radius: .25rem;
    -webkit-appearance: button;
    -moz-appearance: button;
}

Я просматривал все известные мне источники и сравнивал со старыми сайт (он использовал JS, что мне не разрешено делать для этого проекта). Я тщательно проверил StackOverflow. Я использую тот же SVG со старого сайта, который виден в LambdaTest Safari / Android, поэтому проблема не в формате фонового изображения.

Возможно, это немного грязно, так как нам пришлось клонировать этот старый сайт, я попытался очистить его, чтобы его было легче обнаружить.

Спасибо всем, кто сможет поставь меня на правильный путь.