@mixin line_limit($line_clamp: 1) {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: $line_clamp;
    -webkit-box-orient: vertical;
}

@mixin flex($justify-content: space-between) {
    display: flex;
    align-items: center;
    justify-content: $justify-content;
}

// Define a mixin for responsive breakpoints
@mixin respond-to($breakpoint) {
    @if $breakpoint == mobile {
        @media (max-width: 768px) {
            @content;
        }
    } @else if $breakpoint == tablet {
        @media (max-width: 992px) {
            @content;
        }
    } @else if $breakpoint == desktop {
        @media (max-width: 1300px) {
            @content;
        }
    }
}