.chip {
    display: inline-flex;
    font-family: 'Open Sans', sans-serif;
    border-radius: 9999px;
    color: rgb(180, 180, 180);
    font-weight: 600;
    gap: 2px;
    margin: 4px;
    user-select: none;
    white-space: nowrap
}

.chip-medium {
    font-size: 16px;
    height: 40px;
}

.chip-small {
    font-size: 12px;
    height: 24px;
}

.chip-part {
    display: flex;
    line-height: 1;
    background-color: rgb(74, 74, 74);
    border-radius: 4px;
    align-items: center;
    transition: background-color 0.3s ease;
}

.chip-medium .chip-part {
    padding: 12px 7px;
}

.chip-small .chip-part {
    padding: 6px 6px;
}

.chip-part-left {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.chip-part-right {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.chip-part-without-margins {
    padding-left: 0px !important;
}

.chip-icon {
    height: 24px;
}

.chip-image {
    border-radius: 9999px;
    margin-left: 5px;
}

.no-margin-chip-image {
    margin-left: 0px;
}

.chip-medium .chip-icon {
    height: 24px;
    width: 24px;
    margin-right: 10px;
}

.chip-small .chip-icon {
    height: 14px;
    width: 14px;
    margin-right: 5px;
}

.chip-part-style-clickable {
    cursor: pointer;
}

.chip-part-style-active {
    box-shadow: 0 0 0 3px rgb(150,150,150);
}

.chip-medium .chip-part-style-round {
    width: 40px;
    padding: 0px !important;
}

.chip-small .chip-part-style-round {
    width: 24px;
    padding: 0px !important;
}

.chip-part-style-dark {
    background-color: rgb(60, 60, 60);
}

.chip-part-style-clickable:hover {
    background-color: rgb(102, 102, 102);
}

.chip-part-style-dark.chip-part-style-clickable:hover {
    background-color: rgb(45, 45, 45) !important;
}

.delete-button-chip-part {
    padding-left: 3px !important;
    padding-right: 1px !important;
}