/* Карточки */



.card-container {
	display: flex; /* Используем Flexbox для контейнера карточек */
	flex-wrap: wrap; /* Позволяет карточкам переноситься на новую строку */
	gap: 10px; /* Расстояние между карточками */
}

.card {
	border: 1px solid #ccc; /* Граница карточки */
	border-radius: 8px; /* Скругление углов карточки */
	overflow: hidden; /* Прячет содержимое, выходящее за границы карточки */
	width: 200px; /* Ширина карточки */
	min-width: 200px; /* Минимальная ширина карточки */
	max-width: 100%; /* Максимальная ширина карточки, чтобы она не выходила за пределы контейнера */
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Тень для карточки */
	position: relative; /* Позволяет позиционировать элементы внутри карточки */
	display: flex; /* Используем Flexbox внутри карточки */
	flex-direction: column; /* Вертикальная ориентация для карточки */
}

.card img {
	width: 100%; /* Ширина изображения, заполняет всю карточку */
	height: 150px; /* Высота изображения */
	object-fit: cover; /* Обеспечивает обрезку изображения для заполнения области */
}

.card-title {
	padding: 10px; /* Отступы внутри заголовка карточки */
	text-align: left; /* Выравнивание текста по левому краю */
	font-size: 16px; /* Размер шрифта заголовка */
	background-color: #f0f0f0; /* Светло-серый фон для заголовка */
}

.card-trash {
	position: absolute; /* Абсолютное позиционирование для иконки корзины */
	top: 4px; /* Отступ сверху */
	right: 5px; /* Отступ справа */
	cursor: pointer; /* Указывает, что элемент кликабельный */
	font-size: 24px; /* Размер иконки уменьшен в два раза */
	color: #E24D2B; /* Цвет иконки корзины */
}

.card-down {
	position: absolute; /* Абсолютное позиционирование для иконки загрузки */
	top: 2px; /* Отступ сверху */
	right: 25px; /* Отступ справа */
	cursor: pointer; /* Указывает, что элемент кликабельный */
	font-size: 24px; /* Размер иконки уменьшен в два раза */
	color: #4079BD; /* Цвет иконки загрузки */
}

.card-footer {
	padding: 10px; /* Отступы внутри футера карточки */
	text-align: right; /* Выравнивание текста по правому краю */
	background-color: #f8f8f8; /* Цвет фона футера */
	margin-top: auto; /* Позволяет футеру оставаться внизу карточки */
}