/* ----- BADGES ----- */
.badge {
    border-radius: 0.75rem;
    padding: .1875rem 0.75rem;
    font-weight: 500;
}
.badge-sky {
    background-color: var(--sky);
    color: var(--white);
}
.badge-blue {
    background-color: var(--blue);
    color: var(--white);
}
.badge-green {
    background-color: var(--green);
    color: var(--white);
}
.badge-orange {
    background-color: var(--orange);
    color: var(--white);
}
.badge-red {
    background-color: var(--red);
    color: var(--white);
}

.badge-white {
    background-color: var(--grey-light);
    color: var(--grey);
}
.badge-grey {
    background-color: var(--grey);
    color: var(--white);
}
.badge-black {
    background-color: var(--black-light);
    color: var(--white);
}

/* ----- OUTLINE BADGES ----- */
.badge-o-sky {
    border: 0.025rem solid var(--sky);
    color: var(--sky);
}
.badge-o-blue {
    border: 0.025rem solid var(--blue);
    color: var(--blue);
}
.badge-o-green {
    border: 0.025rem solid var(--green);
    color: var(--green);
}
.badge-o-orange {
    border: 0.025rem solid var(--orange);
    color: var(--orange);
}
.badge-o-red {
    border: 0.025rem solid var(--red);
    color: var(--red);
}

.badge-o-white {
    border: 0.025rem solid var(--white);
    color: var(--white);
}
.badge-o-grey {
    border: 0.025rem solid var(--grey);
    color: var(--grey);
}
.badge-o-black {
    border: 0.025rem solid var(--black-light);
    color: var(--black-light);
}