/*=============================================================================
  CATEGORY BLOCK

  * Shows category cards on cat page and portals
=============================================================================*/

.category-block>.row {
    justify-content: center;
}

.category-block {
    max-width: 1200px;
    margin: 0 auto;
}

.category-block .category-card__wrap {
    display: block;
    height: 100%;
}

/* Small Category Blocks */
.category-block.is-sm .category-card__container {
    flex: 1 0 100%;
    flex-direction: row;
    width: 100%;
    height: 100%;
    display: inline-flex;
    align-items: center;
    padding: var(--spacing-03) var(--spacing-04) var(--spacing-03) var(--spacing-03);
    border-top: var(--border-weight-01) solid var(--color-border-card-default);
    border-bottom: var(--border-weight-01) solid transparent;
    border-left: var(--border-weight-01) solid var(--color-border-card-default);
    border-right: var(--border-weight-01) solid var(--color-border-card-default);
}

.category-block.is-sm .category-card:last-of-type {
    padding-bottom: var(--spacing-06);
}

.category-block.is-sm .category-card:first-of-type .category-card__container {
    border-top: var(--border-weight-01) solid var(--color-border-card-default);
    border-top-left-radius: var(--border-radius-md);
    border-top-right-radius: var(--border-radius-md);
}

.category-block.is-sm .category-card:last-of-type .category-card__container {
    border-bottom: var(--border-weight-01) solid var(--color-border-card-default);
    border-bottom-left-radius: var(--border-radius-md);
    border-bottom-right-radius: var(--border-radius-md);
}

.category-block.is-sm .category-card__image {
    height: 85px;
    max-height: 85px;
    min-width: var(--spacing-16);
    max-width: var(--spacing-16);
    position: relative;
    padding: 0;
    margin-right: var(--spacing-06);
}

.category-block.is-sm .category-card__title {
    font: var(--text-title-md);
    color: var(--color-text-primary-dark);
    padding: 0;
}

.category-block a:hover .category-card__container {
    border: var(--border-weight-01) solid var(--color-border-card-hover);
    box-shadow: var(--box-shadow-black);
}

.category-block.is-sm .category-card:first-of-type a:hover .category-card__container {
    border-top: var(--border-weight-01) solid var(--color-border-card-hover);
    box-shadow: var(--box-shadow-black);
}

.category-block.is-sm .category-card:last-of-type a:hover .category-card__container {
    border-bottom: var(--border-weight-01) solid var(--color-border-card-hover);
    box-shadow: var(--box-shadow-black);
}

/* Medium & Large Category Blocks */
.category-block.is-md .category-card,
.category-block.is-lg .category-card {
    padding-bottom: var(--spacing-06);
}

.category-block.is-md .category-card__container,
.category-block.is-lg .category-card__container {
    flex-direction: column;
    height: 100%;
    margin: 0;
    align-items: center;
    border: var(--border-weight-01) solid var(--color-border-card-default);
    border-radius: var(--border-radius-md);
    overflow: hidden;
}

.category-block.is-md .category-card__image-wrap,
.category-block.is-lg .category-card__image-wrap {
    flex-grow: 0;
    padding-top: var(--spacing-03);
    padding-bottom: var(--spacing-04);
}

/* Info Section */
.category-block.is-md .category-card__overline,
.category-block.is-lg .category-card__overline {
    flex-grow: 0;
    padding: 0 var(--spacing-03) var(--spacing-02);
    font: var(--text-form-label);
    color: var(--color-text-primary-dark);
    text-transform: uppercase;
}

.category-block.is-md .category-card__title,
.category-block.is-lg .category-card__title {
    flex-grow: 0;
    padding: 0 var(--spacing-03) var(--spacing-04);
    font: var(--text-title-md);
    color: var(--color-text-primary-dark);
    word-break: break-word;
}

.category-block.is-lg .category-card__description {
    font: var(--text-body-md-compact);
    color: var(--color-text-secondary);
    padding: 0 var(--spacing-06) var(--spacing-06) var(--spacing-06);
}

.category-block .swiper .category-card {
    height: 100%;
}

.category-block.is-md .swiper-slide .category-card,
.category-block.is-lg .swiper-slide .category-card {
    margin: 1px;
    padding-bottom: var(--spacing-06);
}

@media screen and (min-width: 480px) {

    .category-block.is-md .category-card__image-wrap,
    .category-block.is-lg .category-card__image-wrap {
        padding-left: var(--spacing-03);
        padding-right: var(--spacing-03);
    }

}

@media screen and (min-width: 576px) {

    .category-block.is-sm .category-card {
        padding-bottom: var(--spacing-06);
        padding-left: var(--spacing-03);
        padding-right: var(--spacing-03);
    }

    .category-block.is-sm .category-card__container {
        border: var(--border-weight-01) solid var(--color-border-card-default);
        border-radius: var(--border-radius-md);
    }

    .category-block.is-sm .category-card__wrap:hover .category-card__container,
    .category-block.is-sm .category-card__wrap:active .category-card__container,
    .category-block.is-sm .category-card__wrap:focus .category-card__container {
        border: var(--border-weight-01) solid var(--color-border-card-hover);
    }

    .category-block.is-sm .category-card__title {
        text-align: left;
        text-overflow: inherit;
        overflow: inherit;
        white-space: inherit;
    }

}

@media screen and (min-width: 1200px) {

    .category-block {
        padding: 0 0 var(--spacing-06) 0;
    }

}
