/* =========================================================================
   ЗАМЕНА FONT AWESOME НА ВСТРОЕННЫЕ SVG-ИКОНКИ  (v2)
   Иконки: .fa-bars (меню), .fa-remove (крестик), .fa-spinner (загрузка)
   v2: крестик корректно краснеет при наведении в ЛЮБОЙ корзине.
   ========================================================================= */

.fa {
	display: inline-block;
	width: 1em;
	height: 1em;
	line-height: 1;
	vertical-align: -0.125em;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	font-style: normal;
}

.fa::before { content: "" !important; }

/* --- «гамбургер» (меню) --- */
.fa-bars,
.fa-navicon,
.fa-reorder {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath fill='%23000' d='M16 132h416c8.8 0 16-7.2 16-16V76c0-8.8-7.2-16-16-16H16C7.2 60 0 67.2 0 76v40c0 8.8 7.2 16 16 16zm0 160h416c8.8 0 16-7.2 16-16v-40c0-8.8-7.2-16-16-16H16c-8.8 0-16 7.2-16 16v40c0 8.8 7.2 16 16 16zm0 160h416c8.8 0 16-7.2 16-16v-40c0-8.8-7.2-16-16-16H16c-8.8 0-16 7.2-16 16v40c0 8.8 7.2 16 16 16z'/%3E%3C/svg%3E");
}

/* --- «крестик» (удалить / закрыть) — обычный, тёмный --- */
.fa-remove,
.fa-close,
.fa-times {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'%3E%3Cpath fill='%23000' d='M242.7 256l100.1-100.1c12.3-12.3 12.3-32.2 0-44.5l-22.2-22.2c-12.3-12.3-32.2-12.3-44.5 0L176 189.3 75.9 89.2c-12.3-12.3-32.2-12.3-44.5 0L9.2 111.4c-12.3 12.3-12.3 32.2 0 44.5L109.3 256 9.2 356.1c-12.3 12.3-12.3 32.2 0 44.5l22.2 22.2c12.3 12.3 32.2 12.3 44.5 0L176 322.7l100.1 100.1c12.3 12.3 32.2 12.3 44.5 0l22.2-22.2c12.3-12.3 12.3-32.2 0-44.5L242.7 256z'/%3E%3C/svg%3E");
}

/* Красный крестик при наведении — для ЛЮБОЙ корзины и любой вёрстки.
   (старое правило color:red на SVG не действует, поэтому меняем картинку) */
.fa-remove:hover,
.fa-close:hover,
.fa-times:hover {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'%3E%3Cpath fill='%23e00000' d='M242.7 256l100.1-100.1c12.3-12.3 12.3-32.2 0-44.5l-22.2-22.2c-12.3-12.3-32.2-12.3-44.5 0L176 189.3 75.9 89.2c-12.3-12.3-32.2-12.3-44.5 0L9.2 111.4c-12.3 12.3-12.3 32.2 0 44.5L109.3 256 9.2 356.1c-12.3 12.3-12.3 32.2 0 44.5l22.2 22.2c12.3 12.3 32.2 12.3 44.5 0L176 322.7l100.1 100.1c12.3 12.3 32.2 12.3 44.5 0l22.2-22.2c12.3-12.3 12.3-32.2 0-44.5L242.7 256z'/%3E%3C/svg%3E");
}

/* --- «спиннер» (загрузка) --- */
.fa-spinner {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23000' d='M304 48a48 48 0 1 0-96 0 48 48 0 0 0 96 0zm0 416a48 48 0 1 0-96 0 48 48 0 0 0 96 0zM48 304a48 48 0 1 0 0-96 48 48 0 0 0 0 96zm464-48a48 48 0 1 0-96 0 48 48 0 0 0 96 0zM142.9 437A48 48 0 1 0 75 369.1 48 48 0 0 0 142.9 437zm0-294.2A48 48 0 1 0 75 75a48 48 0 0 0 67.9 67.9zM369.1 437A48 48 0 1 0 437 369.1 48 48 0 0 0 369.1 437z'/%3E%3C/svg%3E");
}

/* Анимация вращения */
.fa-spin  { animation: fa-spin 2s linear infinite; }
.fa-pulse { animation: fa-spin 1s steps(8) infinite; }
@keyframes fa-spin {
	0%   { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

.fa-pointer { cursor: pointer; }
