/* FireShop SVG Icons */

:root {
    --fs-icon-size-xs: 1em;
    --fs-icon-size-sm: 1.5em;
    --fs-icon-size-md: 2em;
    --fs-icon-size-lg: 2.5em;
    --fs-icon-size-xl: 3em;
}

@media only screen and (max-width: 440px) {
    :root {
        --fs-icon-size-sm: 1.2em;
        --fs-icon-size-md: 1.6em;
        --fs-icon-size-lg: 2em;
        --fs-icon-size-xl: 2.4em;
    }
}


.fs-icon {
    display: inline-block;
    width: var(--fs-icon-size-md);
    height: var(--fs-icon-size-md);
    mask-repeat: no-repeat;
    mask-position: center;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
    background-color: currentColor;
    color: var(--primary-color-900);
}

    .fs-icon.red {
        color: red;
    }

    .fs-icon.white {
        color: white;
    }

.fs-icon-xs {
    width: var(--fs-icon-size-xs);
    height: var(--fs-icon-size-xs);
}

.fs-icon-sm {
    width: var(--fs-icon-size-sm);
    height: var(--fs-icon-size-sm);
}

.fs-icon-md {
    width: var(--fs-icon-size-md);
    height: var(--fs-icon-size-md);
}

.fs-icon-lg {
    width: var(--fs-icon-size-lg);
    height: var(--fs-icon-size-lg);
}

.fs-icon-xl {
    width: var(--fs-icon-size-xl);
    height: var(--fs-icon-size-xl);
}

/* Check */
.fs-icon.check {
    mask-image: url("./icons/check.svg");
    -webkit-mask-image: url("./icons/check.svg");
}

/* Close */
.fs-icon.close {
    mask-image: url("./icons/close.svg");
    -webkit-mask-image: url("./icons/close.svg");
}

/* Colors */
.fs-icon.colors {
    mask-image: url("./icons/colors.svg");
    -webkit-mask-image: url("./icons/colors.svg");
}

/* Delivery */
.fs-icon.delivery {
    mask-image: url("./icons/delivery.svg");
    -webkit-mask-image: url("./icons/delivery.svg");
}

/* Filter */
.fs-icon.filter {
    mask-image: url("./icons/filter.svg");
    -webkit-mask-image: url("./icons/filter.svg");
}

/* Heart */
.fs-icon.heart {
    mask-image: url("./icons/heart.svg");
    -webkit-mask-image: url("./icons/heart.svg");
}

/* Instagram */
.fs-icon.instagram {
    mask-image: url("./icons/instagram.svg");
    -webkit-mask-image: url("./icons/instagram.svg");
}

/* Measure Tape */
.fs-icon.measure-tape {
    mask-image: url("./icons/measure-tape.svg");
    -webkit-mask-image: url("./icons/measure-tape.svg");
}

/* Search */
.fs-icon.search {
    mask-image: url("./icons/search.svg");
    -webkit-mask-image: url("./icons/search.svg");
}

/* Shopping Cart */
.fs-icon.shopping-cart {
    mask-image: url("./icons/shopping-cart.svg");
    -webkit-mask-image: url("./icons/shopping-cart.svg");
}

/* Telegram */
.fs-icon.telegram {
    mask-image: url("./icons/telegram.svg");
    -webkit-mask-image: url("./icons/telegram.svg");
}

/* User */
.fs-icon.user {
    mask-image: url("./icons/user.svg");
    -webkit-mask-image: url("./icons/user.svg");
}

/* User Checked */
.fs-icon.user-checked {
    mask-image: url("./icons/user-checked.svg");
    -webkit-mask-image: url("./icons/user-checked.svg");
}

/* WhatsApp */
.fs-icon.whatsapp {
    mask-image: url("./icons/whatsapp.svg");
    -webkit-mask-image: url("./icons/whatsapp.svg");
}

/* menu */
.fs-icon.menu {
    mask-image: url("./icons/menu.svg");
    -webkit-mask-image: url("./icons/menu.svg");
}

/* right arrow */
.fs-icon.right.arrow {
    mask-image: url("./icons/right-arrow.svg");
    -webkit-mask-image: url("./icons/right-arrow.svg");
}