#filter-form {
    margin: 1.1rem 0 0 0;
    padding: 0;
}

#filter-form .filter-row {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 0;
}


#filter-form .filter-label {
    min-width: 220px;
    font-weight: 600;
}


#filter-form .filter-scale > [id^="id_"] {
    display: flex;
    align-items: center;
    gap: 0;
}


#filter-form .filter-scale > [id^="id_"] > div {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
}



#filter-form .filter-scale [id^="id_"] label {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    cursor: pointer;

    font-size: 0;
}



#filter-form .filter-scale [id^="id_"] input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    width: 48px;
    height: 48px;
    padding: 0;
    margin: 0;

    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    border: none;
    cursor: pointer;
}

/* S (Small) */
#filter-form .filter-scale input[type="checkbox"][value="S"] {
    background-image: url("../img/form/s_off.png");
}
#filter-form .filter-scale input[type="checkbox"][value="S"]:checked {
    background-image: url("../img/form/s_on.png");
}

/* M (Medium) */
#filter-form .filter-scale input[type="checkbox"][value="M"] {
    background-image: url("../img/form/m_off.png");
}
#filter-form .filter-scale input[type="checkbox"][value="M"]:checked {
    background-image: url("../img/form/m_on.png");
}

/* L (Large) */
#filter-form .filter-scale input[type="checkbox"][value="L"] {
    background-image: url("../img/form/l_off.png");
}
#filter-form .filter-scale input[type="checkbox"][value="L"]:checked {
    background-image: url("../img/form/l_on.png");
}

#filter-form .filter-scale [id^="id_"] label > input {
    margin: 0;
}