@type: 'extra';
@element: 'custom';

@import (multiple, reference, optional) '../../theme.config';

body.cca-main-homepage {
  .collection-stats {
    a {
      word-break: break-word;
    }
  }
}

.collection-stats {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin: 1em 0;
  gap: 0.7em;

  .semantic-icon {
    i.icon {
      font-size: 2em;
    }

    .label {
      width: 85px !important;
    }
  }

  .tab-icon-wrapper {
    position: relative;
    display: inline-block;
  }

  .tab-item-link {
    &:hover,
    &.active {
      .count {
        background-color: @ccaGreenColor;
      }

      .tab-icon,
      .label {
        color: @primaryColor;
      }
    }

    &.active {
      .label {
        font-weight: 500;
      }
    }
  }

  .tab-icon {
    color: @secondaryColor;
    text-align: center;

    .label {
      display: block;
      width: 120px;
      color: @contentAreaColor;
      font-size: 14px;
    }

    .count {
      position: absolute;
      z-index: 1;
      top: auto;
      bottom: 0;
      left: 100%;
      width: 25px;
      height: 25px;
      border-radius: 50%;
      margin-left: -1.5em;
      background-color: #161c23;
      color: @white;
      font-size: 9px;
      font-weight: 700;
      line-height: 25px;
      text-align: center;
    }
  }
}