Untitled

.fnd-svg {
    &__item {
        width: var(--fnd-svg-width);
        height: var(--fnd-svg-height);
        object-fit: contain;
        display: block;
        transform: rotate(var(--fnd-svg-rotate));
        transform-origin: center;
        transition: all .2s;
        path {
            stroke: var(--fnd-svg-stroke);
            fill: var(--fnd-svg-fill);
        }
        &:hover {
            
                path {
                    stroke: var(--fnd-svg-stroke-hover, var(--fnd-svg-stroke));
                    fill: var(--fnd-svg-fill-hover, var(--fnd-svg-fill));
                }
            
        }
    }
    &:hover {
        .fnd-svg__item {
            path {
                stroke: var(--fnd-svg-stroke-hover, var(--fnd-svg-stroke));
                fill: var(--fnd-svg-fill-hover, var(--fnd-svg-fill));
            }
        }
    }
}


.fnd-textColor {
    color: var(--fnd-textColor);
    &:hover {
        color: var(--fnd-textColor-hover, var(--fnd-textColor));
    }
}

.fnd-bgColor {
    background-color: var(--fnd-bgColor);
    &:hover {
        background-color: var(--fnd-bgColor-hover, var(--fnd-bgColor));
    }
}

.fnd-border {
    border: var(--fnd-borderWidth) solid var(--fnd-borderColor);
    &:hover {
        border-color: var(--fnd-borderColor-hover, var(--fnd-borderColor));
    }
}
.fnd-border-top {
    border-top: var(--fnd-borderWidth-top) solid var(--fnd-borderColor-top); 
    &:hover {
        border-color: var(--fnd-borderColor-top-hover, var(--fnd-borderColor-top));
    }
}
.fnd-border-left {
    border-left: var(--fnd-borderWidth-left) solid var(--fnd-borderColor-left);
    &:hover {
        border-color: var(--fnd-borderColor-left-hover, var(--fnd-borderColor-left));
    }
}
.fnd-border-right {
    border-right: var(--fnd-borderWidth-right) solid var(--fnd-borderColor-right);
    &:hover {
        border-color: var(--fnd-borderColor-right-hover, var(--fnd-borderColor-right));
    }
}
.fnd-border-bottom {
    border-top: var(--fnd-borderWidth-bottom) solid var(--fnd-borderColor-bottom);
    &:hover {
        border-color: var(--fnd-borderColor-bottom-hover, var(--fnd-borderColor-bottom));
    }
}

.fnd-radius {
    border-radius: var(--fnd-radius);
    &:hover {
        border-radius: var(--fnd-radius-hover, var(--fnd-radius));
    }
}

.fnd-shadow {
    box-shadow: var(--fnd-shadowColor);
    &:hover {
        box-shadow: var(--fnd-shadowColor-hover, var(--fnd-shadowColor));
    }
}

.fnd-objectFit {
    object-fit: var(--fnd-objectFit);
}

.fnd-width {
    width: var(--fnd-width);
}

.fnd-height {
    height: var(--fnd-height);
}

.fnd-ltSpacing {
    letter-spacing: var(--fnd-ltSpacing);
}

.fnd-textLimit {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp:var(--fnd-lineLimit);
}

.fnd-img {
    width: var(--fnd-img-width);
    height: var(--fnd-img-height);
    object-fit: var(--fnd-img-objectFit);
    border-radius: var(--fnd-radius);
    display: block;
}