/* Смещение всех эмодзи */
/* Сдвигаем весь блок с эмодзи вверх и чуть вправо */
.emoji-list {
 display: flex;
 flex-wrap: nowrap; /* одна строка */
 justify-content: flex-start;
 align-items: stretch;
 gap: 0;
 width: 95%;
 max-width: 95%; /* не вылезает за родителя */
 overflow: hidden; /* обрезаем лишнее */
 position: relative;
 transform: translateY(-33%);
 left: 5px;
}
 
/* Контейнер для списка эмоций — в один ряд, слева */
.emoji-list {
 display: flex;
 flex-wrap: nowrap; /* запрещаем перенос строк */
 justify-content: flex-start;
 align-items: stretch;
 gap: 0;
 width: 100%;
}

/* Каждый элемент без обводки */
.emoji-item {
 flex: 1 1 0;
 max-width: none;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 cursor: pointer;
 border: none; /* ← убрали обводку */
 border-radius: 16px;
 padding: 8px;
 background: transparent;
 transition: transform 0.3s ease, background-color 0.3s ease;
}

/* Ховер — только лёгкий фон без рамки */
.emoji-item:hover {
 transform: scale(1.05);
 background-color: #f5f7ff;
}

/* Активный — цвет фона, но тоже без рамки */
.emoji-item.active {
 background-color: #f0f6ff;
}

/* Цвет текста в активном состоянии */
.emoji-item.active .count,
.emoji-item.active p {
 color: #507fff;
}

 .count {
 font-size: 14px;
 }
}