Почему сложно стилизовать input

Стилизация input сложна из-за ограничений браузеров и различий в их реализации. Основные проблемы:

1. Разные движки рендеринга — каждый браузер (Chrome, Firefox, Safari) имеет свои стили по умолчанию для инпутов.
2. Ограниченный контроль — например, type="file" или type="range" сложно стилизовать без хаков.
3. Псевдоэлементы — не все псевдоэлементы (::placeholder, ::-webkit-inner-spin-button) поддерживаются одинаково.

Пример сброса стилей для кросбраузерности:

input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: 1px solid #ccc;
  padding: 8px;
}

Для сложных случаев (кастомизация file или range) часто используют скрытие нативного инпута и создание кастомного интерфейса поверх него.