.filter-bar{
    display:flex;
    gap:10px;
    overflow-x:auto;
    padding:10px 0;
    margin-bottom:15px;
    scrollbar-width:none;
}

.filter-bar::-webkit-scrollbar{
    display:none;
}

.filter-pill{
    display:flex;
    align-items:center;
    gap:5px;

    padding:10px 16px;

    border:1px solid #ddd;
    border-radius:30px;

    background:#fff;
    cursor:pointer;

    white-space:nowrap;

    transition:.3s;
}

.filter-pill:hover{
    border-color:#000;
    transform:translateY(-2px);
}

.filter-pill.active{
    background:#000;
    color:#fff;
    border-color:#000;
}

.filter-pill img{
    border-radius:3px;
}