/* Стилизация базового контейнера Choices.js */
.choices {
    width: 100%;
    max-width: 100%; /* Чтобы список мог растягиваться в зависимости от контейнера */
    min-width: 250px; /* Минимальная ширина, чтобы было видно больше информации */
}

/* Стилизация выбранного поля */
.choices__list--single .choices__item {
    color: black; /* Цвет текста */
    background-color: #fff; /* Цвет фона */
    border-radius: 0.375rem; /* Скругление углов */
}

/* Стилизация поля ввода внутри выбора */
.choices__input {
    color: black; /* Цвет текста */
}

/* Стилизация выпадающего списка */
.choices__list--dropdown .choices__item--selectable {
    color: black; /* Цвет текста для элементов списка */
}

.choices__list--single .choices__item--selectable {
    text-align: center;
}

/* Стилизация выпадающего списка при наведении */
.choices__list--dropdown .choices__item--selectable.is-highlighted {
    background-color: #f8f9fa; /* Цвет фона при наведении */
    color: black; /* Цвет текста при наведении */
}

/* Убираем лишние границы и добавляем тень */
.choices__list--dropdown {
    border: none; /* Убираем границу */
    box-shadow: 0 2px 5px rgba(0,0,0,0.15); /* Добавляем тень для выпадающего списка */
    width: 100%;
}

/* Стилизация кнопки очистки */
.choices__button {
    background-image: url('data:image/svg+xml;charset=US-ASCII,<svg%20width%3D%2212%22%20height%3D%2212%22%20viewBox%3D%220%200%2012%2012%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22><path%20fill%3D%22%23DEE2E6%22%20d%3D%22M11.41%2010.59L7.83%207l3.58-3.59L10.59.59%207%204.17%203.41.59.59%202.41l3.59%203.59L.59%209.59l1.82%201.82L7%207.83l3.59%203.58z%22/></svg>'); /* Изменяем иконку на крестик */
    color: #dc3545; /* Цвет крестика */
}

.choices__list--dropdown .choices__item--selectable, .choices__list[aria-expanded] .choices__item--selectable{
    padding-right: 30px;
}

.choices__list--dropdown {
    box-shadow: none !important;  /* Удаление тени */
    transition: box-shadow 0.2s ease-in-out;  /* Плавное исчезновение тени */
}

/* Скрытие dropdown после закрытия */
.choices[aria-expanded="false"] .choices__list--dropdown {
    display: none;
}

.choices__inner{
    border: 1px solid grey;
}

.hidden {
    display: none;
}

@media (max-width: 768px) {
    .date-updates {
        display: none;
    }
}

@media (min-width: 769px) {
    .date-updates {
        display: flex;
    }
}