/*------------------------------------*\
    CATEGORY LIST
\*------------------------------------*/

@use "../../base/helpers";
@use "../../base/settings";

.ds_category-list-container {
    margin: 2rem 0;
}

.ds_category-list {
    display: flex;
    flex-direction: column;
    gap: settings.$grid-gap-x settings.$grid-gap-y;
    list-style-type: none;
    margin: 0;
    padding: 0;

    // DEPRECATED - This will be removed in a future release
    &--narrow {
        gap: settings.$grid-gap-x--narrow settings.$grid-gap-y--narrow;
    }
}

@include helpers.ds_media-query(medium) {
    .ds_category-list--grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));

        .ds_card {
            min-height: 12.5rem;
        }
    }
}

@include helpers.ds_media-query(large) {
    .ds_category-list--grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}