.category-list {
    display: grid;
    gap: 0.5rem;
    
    grid-template-columns: 1fr 1fr;
    
    margin-bottom: 1rem;
    margin-top: 1rem;
}

.category-list a {
    color: inherit;
    text-decoration: none;
}

.category-list > .category-item {
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 0.3rem;
    display: flex;
    gap: 4px;
    height: 48px;
    overflow: hidden;
    padding: 0 0.3rem;
    transition: border-color 0.8s linear;
}

.category-list > .category-item:hover {
    border-color: #e11f21;
    transition: border-color 1s ease-in;
}

.category-list > .category-item .icon {
    display: flex;
    flex: 56px 0 0;
    height: 100%;
    justify-content: center;
    padding: 4px 0;
}

.category-list > .category-item .icon img {
    max-height: 100%;
    max-width: 36px;
}

.category-list > .category-item .text {
    font-size: 0.9rem;
    line-height: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (min-width: 576px) {
}

@media (min-width: 768px) {
    .category-list { grid-template-columns: 1fr 1fr 1fr; }
}

@media (min-width: 992px) {
    .category-list { grid-template-columns: 1fr 1fr 1fr 1fr; }
}

@media (min-width: 1200px) {
    .category-list { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }
}








.product-filter {
    background-color: #ebebeb;
    padding: 10px;
}

.product-filter > .content {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0.3rem;
    margin-right: -0.3rem;
}

.product-filter input[type=checkbox] { transform: scale(1.3); }

.product-filter input[type=text] {
    background-color: #fff;
    border: 1px solid #cdcdcd;
    border-radius: .4rem;
    height: 100%;
    padding: 4px;
    width: 100%;
}

.product-filter .filter-group {
    display: flex;
    flex: 0 0 100%;
    flex-wrap: wrap;
    margin-bottom: 0.8rem;
    padding-left: 0.3rem;
    padding-right: 0.3rem;
    position: relative;
}

.product-filter .filter-item {
    display: flex;
    flex-basis: 100%;
    font-size: 0.875rem;
    height: 32px;
    margin: 2px 0;
    max-width: 100%;
}

.product-filter .filter-item input[type=text][disabled=disabled] { background-color: #f0f0f0; }


.product-filter .filter-item.active .select > button {
    background-color: #39f;
    color: #fff;
}

.product-filter .filter-item .select button { height: 100%; }

@media (min-width: 576px) {
    .product-filter .filter-group {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .product-filter .filter-group-large {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (min-width: 768px) {
    .product-filter .filter-group {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .product-filter .filter-group-large {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media (min-width: 992px) {
    .product-filter .filter-group {
        flex: 0 0 20%;
        max-width: 20%;
    }

    .product-filter .filter-group-large {
        flex: 0 0 40%;
        max-width: 40%;
    }
}

.product-list-viewbar {
    align-items: center;
    display: flex;
    gap: 1rem;
    margin: 0.5rem 0;
    padding: 0 10px;
}

.product-list-viewbar .view-options {
    align-items: center;
    display: flex;
    gap: 1rem;
}

.product-list-viewbar .view-options button {
    background-color: transparent;
    border: none;
    opacity: 0.3;
    padding: 0;
}

.product-list-viewbar .view-options button.selected { opacity: 1; }

.product-list-viewbar .sorting { min-width: 14rem; }

.product-list-viewbar .sorting .select { }

.product-list-viewbar .compare { }

.product-list-viewbar .compare:disabled { opacity: 0.3; }

.product-list a { color: inherit; }

.product-list .product-list-header {
    display: none;
}

.product-list > ul {
    list-style: none;
    padding: 0;
}

.product-list > ul > li {
    background: #fff;
    position: relative;
}

.product-list .product-list-item {
    display: grid;
    line-height: 1;
}

.product-list .product-picture { grid-area: pic; }

.product-list .product-picture a {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    width: 100%;
}

.product-list .product-picture img {
    max-height: 100%;
    max-width: 100%;
}

.product-list .product-id {
    display: none;
    grid-area: id;
}

.product-list .product-title {
    font-weight: 700;
    grid-area: title;
}

.product-list .product-sku {
    font-style: italic;
    grid-area: sku;
}

.product-list .product-highlights { grid-area: highlights; }

.product-list .product-campaign-text {
    color: #d61021;
    grid-area: cmpg;
}

.product-list .product-stock { grid-area: stock; overflow:hidden; }

.product-list .product-price-header {
    grid-area: price-header;
    font-style: italic;
    text-align: right;
}
.product-list .product-price {
    font-weight: 600;
    grid-area: price;
    text-align: right;
}

.product-list .product-price.campaign { color: #d61021; }

.product-list .product-price-old {
    color: #707070;
    font-weight: 600;
    grid-area: old-price;
    text-align: right;
    text-decoration: line-through;
}

.product-list .product-buy { grid-area: buy; }

.product-list .product-fav {
    display: flex;
    grid-area: fav;
    justify-content: center;
    align-items: center;
}

.product-list .product-fav .article-fav {
    height: 20px;
    width: 30px;
}

.product-list .product-compare {
    display: flex;
    grid-area: cmpr;
    justify-content: center;
    padding: 0 5px;
}

.product-list .product-highlights > ul {
    display: block;
    list-style: none;
    overflow: hidden;
    padding: 0;
}

.product-list .product-list-item > .product-buy input[type=number] { text-align: center; }