.filter {
    font-size: 16px;
    padding: 0;
}

.filter-content {
    padding: 1rem;
}

.filter-expand {
    justify-content: center;
    text-align: center;
    display: none;
    cursor: pointer;
    user-select: none;
    font-weight: bold;
    font-size: 16px;
    padding: 1rem;
}

.filter-expand-chevron {
    padding-left: 0.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.filter-expand-chevron i {
    padding: 0;
}

.filter-expand-chevron.hidden {
    display: none;
}

/* filter card */
.filter-card {

}

.filter-header {
    font-weight: bold;
    display: flex;
    width: 100%;
    padding-bottom: 0.75rem;

    user-select: none;
    cursor: pointer;
}

.filter-header-chevron {
    margin-left: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.filter-header-chevron i {
    padding: 0;
}

.filter-header-chevron.hidden {
    display: none;
}

/* filter card options */
.filter-option input {
    width: 1.5rem;
    height: 1.5rem;
}

.filter-options {
    margin-bottom: 1rem;
}

.filter-option {
    display: flex;
    width: 100%;

    color: var(--text-color);
    text-decoration: none;
    cursor: pointer;
    user-select: none;
}

.filter-option:hover .filter-option-name {
    text-decoration: underline;
}

.filter-option-label {
    width: 100%;
}

.filter-option-amount {
    justify-content: end;
    margin-left: auto;
    color: var(--text-inactive);
}

/* price options */
.filter-price-form {
    display: flex;
    align-items: center;
}

.price-input-divider {
    padding: 0 0.5rem;
}

.filter-price .basic-button {
    margin-top: 0.5rem;
}

/* Responsiveness */
/* lg screen */
@media only screen and (max-width: 1200px) {

}

/* md screen */
@media only screen and (max-width: 992px) {
    .filter-expand {
        display: flex;
    }

    .filter-content {
        padding-top: 1rem;
    }

    .filter-content.hidden {
        display: none;
    }
}

/* sm screen */
@media only screen and (max-width: 768px) {

}

/* xs screen */
@media only screen and (max-width: 576px) {

}