/* Общие стили для футера */
.site-footer {
	background-color: #15004d;
	padding: 79px 0 52px;
	font-family: 'Montserrat', sans-serif;
}

.footer-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 20px;
	gap: 45px;
	margin-bottom: 30px;
}

.footer-column {
	margin-right: 0;
	text-align: start;
}

.footer-column h3 {
	font-size: 18px;
	font-weight: 700;
	margin-bottom: 15px;
	color: white;
}

.footer-column ul {
	list-style: none;
	padding: 0;
}

.footer-column ul li {
	margin-bottom: 10px;
}

.footer-column ul li a {
	color: white;
	text-decoration: none;
	font-size: 16px;
	font-weight: 400;
}

.footer-column ul li a:hover {
	color: #ffd700; /* Желтый цвет при наведении */
}

.footer-column .btn {
	text-transform: none;
	font-size: 21.73px;
}

.personal-account-btn img {
	margin-right: 6px;
}

.personal-account-btn {
	display: flex;
	align-content: center;
	background-color: #ffd700;
	color: #15004d;
	padding: 10px 20px;
	border-radius: 30px;
	text-decoration: none;
	display: inline-block;
	margin-bottom: 20px;
}

.personal-account-btn:hover {
	background-color: #e0c000;
}

.personal-account-btn:hover img {
	filter: brightness(0) invert(1);
}

/* Социальные иконки */
.social-icons {
	display: flex;
	gap: 31.55px;
	margin-bottom: 15px;
}

.social-icons i {
	width: 50px;
	height: 50px;
	background-color: white;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.social-icon:hover {
	color: #ffd700; /* Цвет при наведении */
}

.contact-number {
	font-size: 27.59px;
	font-weight: 700;
	margin-top: 35px;
	color: #ffffff;
}

/* Поиск */
.search-form {
	display: flex;
	align-items: center;
	margin-top: 20px;
}

.search-form input {
	padding: 10px;
	border-radius: 30px;
	border: none;
	font-size: 14px;
	margin-right: 10px;
}

.search-form button {
	background-color: #ffd700;
	border: none;
	padding: 10px;
	border-radius: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.search-form button img {
	width: 20px;
	height: 20px;
}

/* Нижняя часть футера */
.footer-bottom {
	display: flex;
	justify-content: space-between;
	margin: 0 auto;
	padding-top: 20px;
	font-size: 14px;
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 20px;
}

.footer-bottom .btn {
	width: 60px;
	height: 60px;
	border-radius: 15px;
}

.footer-bottom p {
	color: #ffffff;
	margin-top: 60px;
}

/* Контейнер для инпута с иконкой */
.footer-container .search-container {
	position: relative;
	display: flex;
	align-items: center;
	margin-left: auto;
}

.footer-column .search-container .search-input {
	font-family: 'Montserrat', sans-serif;
	font-size: 16px;
	width: 200px; /* Ширина инпута */
	height: 40px; /* Высота инпута */
	/* Отступы, чтобы иконка не накладывалась на текст */
	border-radius: 25px; /* Скругленные углы */
}

/* Стиль для инпута */
.footer-column .search-container .search-input {
	border: 2px solid #ffffff; /* Белая рамка */
	padding: 10px 20px 10px 40px;
	/* Прозрачный фон */
	color: #ffffff; /* Цвет текста */
}

/* Стиль для иконки поиска */
.search-icon {
	position: absolute;
	left: 25px; /* Отступ от левого края контейнера */
	top: 50%; /* Центрирование по вертикали */
	transform: translateY(-50%); /* Выравнивание по центру */
	width: 20px; /* Ширина иконки */
	height: auto; /* Автоматическая высота */
}

/* Стили для инпута при фокусе */
.footer-container .search-input:focus {
	outline: none;
	border-color: #ffd700; /* Изменение цвета рамки при фокусе */
}

/* Стиль для плейсхолдера */
.footer-column .search-container .search-input::placeholder {
	color: #ffffff; /* Цвет текста плейсхолдера */
	opacity: 0.8; /* Прозрачность текста плейсхолдера */
}

.footer-container .search-input {
	max-width: 300px;
	width: 100%;
	color: white;
	padding-left: 60px;
	border-color: #fff;
}

.footer-container .search-input::placeholder {
	opacity: 1;
	color: white;
}

@media (max-width: 768px) {
	/* Меняем структуру футера для мобильных */
	.footer-container {
		text-align: center;
		padding: 0 10%;
	}

	.footer-container .footer-column:first-child {
		order: 0;
		text-align: center;
	}

	.footer-column {
		margin-right: 0;
		width: 100%;
		order: 2;
	}

	.footer-container .search-container {
		order: 1;
		margin: 0;
		max-width: 100%;
	}

	.footer-container .search-container .search-input {
		width: 100%;
		border-color: #fff;
	}

	/* Центрируем контент в колонках */
	.footer-column h3 {
		font-size: 16px;
	}

	.footer-column ul li a {
		font-size: 14px;
	}

	.footer-column .btn {
		font-size: 18px;
		max-width: 100%;
		padding: 10px 50px;
		width: 100%;
		display: block;
	}

	/* Уменьшаем размер иконок социальных сетей */
	.social-icons {
		justify-content: center;
		gap: 31px;
		width: 100%;
	}

	.social-icons a img {
		width: 100%;
		height: 100%;
		max-width: 50px;
		max-height: 50px;
	}

	/* Уменьшаем размер телефона */
	.contact-number {
		font-weight: 700;
		font-size: 27px;
		margin-top: 20px;
	}

	/* Нижняя часть футера */
	.footer-bottom {
		flex-direction: column;
		margin: 0 auto;
		padding-top: 20px;
	}

	.footer-bottom p {
		margin-top: 20px;
		font-size: 12px;
	}

	.footer-bottom .btn {
		display: none;
	}

	.search-icon {
		width: 23px;
		left: 24px;
	}
}
