﻿/*
	Has Icon helps to render icons around elements
*/
.has-icon {
	display: flex;
	align-items: center;
	gap: var(--space-200);
}


.has-icon::before {
	content: "";
	width: var(--space-600);
	height: var(--space-600);
	background-repeat: no-repeat;
	background-position: center;
}

.has-icon.has-icon--above {
	flex-direction: column;
}

.has-icon.has-icon--right {
	flex-direction: row-reverse;
}

.has-icon--right.btn {
	padding-right: var(--space-300);
}

.has-icon.has-icon--below {
	flex-direction: column-reverse;
}

.has-icon.has-icon--left {
	flex-direction: row;
}

.has-icon--left.btn {
	padding-left: var(--space-300);
}

.has-icon.has-icon--icon-only {
	font-size: 0;
	gap: 0;
	width: -moz-fit-content;
	width: fit-content;
}


.has-icon.icon--menu::before {
	background-image: url('../img/ui-symbols.svg#ico--menu-view');
	background-size: 18px 14.5px;
}

.has-icon.icon--user::before {
	background-image: url('../img/ui-symbols.svg#ico--user-view');
	background-size: 21px 24px;
	width: 21px;
	height: 24px;
}

.has-icon.icon--wishlist::before {
	background-image: url('../img/ui-symbols.svg#ico--wishlist-view');
	background-size: 18px 15.75px;
}

.has-icon.icon--cart::before {
	background-image: url('../img/ui-symbols.svg#ico--cart-view');
	background-size: 22px 20px;
	width: 22px;
	height: 20px;
}

.has-icon.icon--cart-plus::before {
	background-image: url('../img/ui-symbols.svg#ico--cart-plus-view');
	background-size: 24.95px 26px;
	width: 44px;
	height: 44px;
}

.has-icon.icon--search::before {
	background-image: url('../img/ui-symbols.svg#ico--search-view');
	background-size: 20px 20px;
}

.has-icon.icon--logout::before {
	background-image: url('../img/ui-symbols.svg#ico--logout-view');
	background-size: 18.667px 14px;
}

.has-icon.icon--register::before {
	background-image: url('../img/ui-symbols.svg#ico--user-plus-view');
	background-size: 22.5px 18px;
}

.has-icon.icon--login::before {
	background-image: url('../img/ui-symbols.svg#ico--login-view');
	background-size: 18px 14.62px;
}







.has-icon.icon--customer-info::before {
	background-image: url('../img/ui-symbols.svg#ico--user-view');
	background-size: 15.75px 18px;
}

.has-icon.icon--map-pin::before,
.has-icon.icon--customer-addresses::before {
	background-image: url('../img/ui-symbols.svg#ico--address-view');
	background-size: 13.5px 18px;
}

.has-icon.icon--payment::before,
.has-icon.icon--customer-orders::before {
	background-image: url('../img/ui-symbols.svg#ico--orders-view');
	background-size: 13.5px 18px;
}

.has-icon.icon--downloadable-products::before {
	background-image: url('../img/ui-symbols.svg#ico--download-view');
	background-size: 18px 18px;
}

.has-icon.icon--back-in-stock-subscriptions::before {
	background-image: url('../img/ui-symbols.svg#ico--product-subscription-view');
	background-size: 13.5px 18px;
}

.has-icon.icon--reward-points::before {
	background-image: url('../img/ui-symbols.svg#ico--reward-points-view');
	background-size: 13.5px 18px;
}

.has-icon.icon--change-password::before {
	background-image: url('../img/ui-symbols.svg#ico--password-view');
	background-size: 15.75px 18px;
}

.has-icon.icon--customer-avatar::before {
	background-image: url('../img/ui-symbols.svg#ico--avatar-view');
	background-size: 12px 16px;
}

.has-icon.icon--confirm::before,
.has-icon.icon--customer-reviews::before {
	background-image: url('../img/ui-symbols.svg#ico--reviews-view');
	background-size: 13.5px 18px;
}


.has-icon.icon--truck::before {
	background-image: url('../img/ui-symbols.svg#ico--truck-view');
	background-size: 24px 18px;
	width: 24px;
}

.has-icon.icon--complete::before {
	background-image: url('../img/ui-symbols.svg#ico--check-circle-view');
	background-size: 18px 18px;
}

.ico--address-footer::before {
	background-image: url('../img/ui-symbols.svg#ico--address-view');
	background-size: 13.5px 18px;
}

.ico--phone-footer::before {
	background-image: url('../img/ui-symbols.svg#ico--phone-view');
	background-size: 15.02px 15.53px;
}

.ico--schedule-footer::before {
	background-image: url('../img/ui-symbols.svg#ico--sketchual-view');
	background-size: 17px 17px;
}

.ico--arrow-footer::before {
	background-image: url('../img/ui-symbols.svg#ico--arrow_footer-view');
	background-size: 6px 11px;
}

.ico--facebook::before {
	background-image: url('../img/ui-symbols.svg#ico--facebook-view');
	background-size: 9.64px 18px;
}

.ico--instagram::before {
	background-image: url('../img/ui-symbols.svg#ico--instagram-view');
	background-size: 21px 21px;
}

.site-footer .ico--facebook,
.site-footer .ico--instagram {
	font-size: 0;
}

.ico--product-page-payment {
	width: 100%;
	display: flex;
	margin: 8px 0;
	align-items: center;
	justify-content: space-around;
}

.ico--product-page-payment::before {
	content: "";
	width: 1.75rem;
	height: 1.75rem;
	background-repeat: no-repeat;
	background-position: center;
}

.ico--product-page-payment::before {
	background-image: url('../img/ui-symbols.svg#ico--payment-view');
	background-size: 25.78px 20px;
}

.ico--product-page-shipping::before {
	background-image: url('../img/ui-symbols.svg#ico--shipping-view');
	background-size: 22.8px 20px;
}

@media (min-width: 1025px) {
	.btn--header.has-icon.has-icon--icon-only {
		gap: .5rem;
		color: white;
		font-size: 14px;
	}
	
	[class].flyout-cart .cart-qty {
		right: 70px;
	}
}