.iconsax {
    display: inline-block;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: var(--Iconsax-Size);
    vertical-align: middle;
}

.iconsax svg {
    display: block;
    width: var(--Iconsax-Size);
    height: var(--Iconsax-Size);
}

.iconsax.medium svg {
    width: 20px;
    height: 20px;
}

.iconsax svg [stroke] {
    stroke: var(--Iconsax-Color);
}

.iconsax svg [fill] {
    fill: var(--Iconsax-Color);
}

.iconsax.fill-none svg [fill] {
    fill: revert-layer;
}

.iconsax svg.active {
    fill: var(--color-white);
}

.iconsax.active svg [stroke] {
    stroke: var(--color-white);
}

.iconsax.active svg [fill] {
    fill: var(--color-white);
}

.iconsax.active.white svg [fill] {
    fill: var(--color-white);
}


/* Black Fill */

.iconsax.stroke-black svg [stroke] {
    stroke: var(--color-black);
}

.iconsax.fill-black svg [fill] {
    fill: var(--color-black);
}


/* Gray Color */

.iconsax.gray svg {
    stroke: #bebebe !important;
    fill: #bebebe !important;
}

.iconsax.gray svg [stroke] {
    stroke: #bebebe !important;
}

.iconsax.gray svg [fill] {
    fill: #bebebe !important;
}


/* Red Color */

.iconsax.red svg [fill] {
    fill: #f43f5e;
}