﻿.microcredential-category-list__item .category__link {
    background: url('/images/codaldesigns/microcredential-badge-outline-opacity.svg') no-repeat bottom right;
    background-size: 25%;
}


.microcredential-category-list__item h5 {
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.15px;
}

.microcredential-category-list__item .category__link {
    background-color: #738fe9;
    border-radius: 10px;
    /*  width: 286px; */
    height: 120px;
    width: 100%;
    margin-bottom: 12px;
}

@media screen and (min-width: 768px) {
    .microcredential-category-list__item .category__link {
        height: 136px;
    }
}

.microcredential-category-list__item .category__description {
    font-weight: 400;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0.5px;
}

/*--- Category List Tooltip Buttons ---*/

.category-item-tooltip__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #CEE2F9;
    color: var(--saColorTertiaryBlue700);
    border: none;
    padding: 0;
    flex-shrink: 0;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.microcredential-category-list-tooltip-icon-button__item i {
    font-size: 22px;
}

/*tooltip window*/
.category-item-custom-tooltip {
    --bs-tooltip-bg: white;
    --bs-tooltip-color: var(--saColorBrandBlack);
    border-radius: 16px !important;
    opacity: 1 !important;
    box-shadow: 0 24px 40px -4px rgba(0, 0, 0, 0.08), 0 6px 16px -2px rgba(0, 0, 0, 0.04);
}

.category-tooltip-icon-button__link {
    color: var(--saColorBrandBlue);
}