@include export-module('co-catalog-categories-layout') {
  .co-catalog-categories {
    font-family: $co-catalog-categories-font-family;
    font-size: $co-catalog-categories-font-size;

    .categories-wrapper {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(330px, calc(25% - 30px)));
      overflow: hidden;
      padding: $co-catalog-categories-padding;
      grid-column-gap: $co-catalog-categories-column-gap;
      grid-row-gap: $co-catalog-categories-column-gap;
    }

    .category-item {
      cursor: pointer;
      position: relative;
      display: flex;
      height: 100%;
      width: 100%;
      overflow: auto;
      max-height: 300px;
      border: 1px solid #ccc;
      border-radius: 3px;
      .co-image {
        height: 100%;
        width: 50%;
        min-width: 50%;
        box-shadow: 1px 0px 5px 0px rgba(0, 0, 0, 0.1);
        img {
          height: 100%;
          width: 100%;
          filter: $co-catalog-categories-image-filter;
          object-fit: cover;
        }
      }

      .category-description {
        color: #000;
        font-weight: 600;
        font-size: 20px;
        padding-bottom: 10px;
        &:hover {
          color: #1A73E8;
          text-decoration: underline;
        }
      }

      &:hover {
        .co-image {
          img {
            filter: $co-catalog-categories-image-hover-filter;
          }
        }
      }

      .category-box {
        display: flex;
        gap: 30px;
        width: 100%;

        .cat-turn-wrapper {
          padding: 15px 10px 15px 0;
          width: 100%;
          overflow: auto;
        }
      }
    }
  }
  .turnovergroup-item {
    padding: 3px 0;
    &:hover {
      color: #1A73E8;
      text-decoration: underline;
    }
  }
  .turnovergroup-description {
    font-weight: $co-catalog-categories-turnovergroup-category-title-font-weight;
    font-size: $co-catalog-categories-turnovergroup-category-title-font-size;
    margin: $co-catalog-categories-turnovergroup-category-title-margin;
  }
}
