.icon {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-color: currentColor;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    vertical-align: middle;
    flex-shrink: 0;
}

/* Sizing utilities */
.icon-sm {
    width: 16px;
    height: 16px;
}

.icon-md {
    width: 20px;
    height: 20px;
}

.icon-lg {
    width: 24px;
    height: 24px;
}

.icon-xl {
    width: 28px;
    height: 28px;
}

.icon-xxl {
    width: 48px;
    height: 48px;
}

/* General Icons */
.icon-store {
    -webkit-mask-image: url('../icons/store.svg');
    mask-image: url('../icons/store.svg');
}

.icon-calendar {
    -webkit-mask-image: url('../icons/calendar.svg');
    mask-image: url('../icons/calendar.svg');
}

.icon-globe {
    -webkit-mask-image: url('../icons/globe.svg');
    mask-image: url('../icons/globe.svg');
}

.icon-cart {
    -webkit-mask-image: url('../icons/cart.svg');
    mask-image: url('../icons/cart.svg');
}

.icon-chevron-right {
    -webkit-mask-image: url('../icons/chevron-right.svg');
    mask-image: url('../icons/chevron-right.svg');
}

.icon-arrow-top-right {
    -webkit-mask-image: url('../icons/arrow-top-right.svg');
    mask-image: url('../icons/arrow-top-right.svg');
}

.icon-arrow-top-right-big {
    -webkit-mask-image: url('../icons/arrow-top-right-big.svg');
    mask-image: url('../icons/arrow-top-right-big.svg');
}

.icon-close {
    -webkit-mask-image: url('../icons/close.svg');
    mask-image: url('../icons/close.svg');
}

.icon-plus {
    -webkit-mask-image: url('../icons/plus.svg');
    mask-image: url('../icons/plus.svg');
}

.icon-check {
    -webkit-mask-image: url('../icons/check.svg');
    mask-image: url('../icons/check.svg');
}

.icon-logo {
    width: 150px;
    height: 48px;
    -webkit-mask-image: url('../icons/logo.svg');
    mask-image: url('../icons/logo.svg');
}

/* Module Icons */
.icon-building {
    -webkit-mask-image: url('../icons/modules/building.svg');
    mask-image: url('../icons/modules/building.svg');
}

.icon-comment {
    -webkit-mask-image: url('../icons/modules/comment.svg');
    mask-image: url('../icons/modules/comment.svg');
}

.icon-check-circle {
    -webkit-mask-image: url('../icons/modules/check-circle.svg');
    mask-image: url('../icons/modules/check-circle.svg');
}

.icon-checkbox-circle {
    -webkit-mask-image: url('../icons/modules/checkbox-circle.svg');
    mask-image: url('../icons/modules/checkbox-circle.svg');
}

.icon-checkbox-circle-checked {
    -webkit-mask-image: url('../icons/modules/checkbox-circle-checked.svg');
    mask-image: url('../icons/modules/checkbox-circle-checked.svg');
}

.icon-minus {
    -webkit-mask-image: url('../icons/modules/minus.svg');
    mask-image: url('../icons/modules/minus.svg');
}

/* Contact Icons */
.icon-engineer {
    -webkit-mask-image: url('../icons/contact/engineer.svg');
    mask-image: url('../icons/contact/engineer.svg');
}

.icon-location {
    -webkit-mask-image: url('../icons/contact/location.svg');
    mask-image: url('../icons/contact/location.svg');
}

.icon-mail {
    -webkit-mask-image: url('../icons/contact/mail.svg');
    mask-image: url('../icons/contact/mail.svg');
}

.icon-support {
    -webkit-mask-image: url('../icons/contact/support.svg');
    mask-image: url('../icons/contact/support.svg');
}

.icon-support2 {
    -webkit-mask-image: url('../icons/contact/support2.svg');
    mask-image: url('../icons/contact/support2.svg');
}
