.ist-emoji-picker {
    animation-duration: .05s;
    background: rgba(var(--accent-color)) !important;
    border-color: rgba(var(--dark-inverted-color), 0.07) !important;
    box-shadow: var(--custom-shadow);
    border-radius: var(--bs-border-radius) !important;
}

[data-bs-theme=light] .ist-emoji-picker {
    background: rgba(var(--light-inverted-color), 100%) !important;
}

.ist-emoji-picker * {
    color: rgba(var(--dark-inverted-color), 1);
}

.ist-emoji-picker .emoji-picker__content {
    border-top: 1px solid rgba(var(--dark-inverted-color), 0.07);
    border-bottom: 1px solid rgba(var(--dark-inverted-color), 0.07);
    height: 300px;
    padding: 0;
}

.ist-emoji-picker .emoji-picker__emoji-area {
    display: flex;
    flex-direction: row;
    overflow: hidden;
    height: 100%;
}

.ist-emoji-picker .emoji-picker__category-buttons {
    display: flex;
    flex-direction: column;
    height: unset;
    margin-bottom: unset;
    overflow-y: scroll;
    overflow-x: hidden;
    justify-content: unset;
    align-items: center;
    width: 50px;
    gap: 5px;
    scrollbar-width: none;
    padding: .5rem 0;
    border-right: 1px solid rgba(var(--dark-inverted-color), 0.07);
}

.ist-emoji-picker .emoji-picker__category-button {
    border: 0 !important;
    color: unset !important;
    flex-grow: unset;
    display: flex;
    width: 30px;
    min-width: 30px;
    height: 30px;
    min-height: 30px;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0;
    background: transparent !important;
    border-radius: var(--bs-border-radius);
}

.ist-emoji-picker .emoji-picker__category-button:hover,
.ist-emoji-picker .emoji-picker__category-button.active {
    background: rgba(var(--dark-inverted-color), 0.05) !important;
}

.ist-emoji-picker .emoji-picker__emojis {
    overflow-y: scroll;
    overflow-x: hidden;
    height: 100%;
    width: 100%;
    padding: 0 0 0 .5rem;
}

.ist-emoji-picker .emoji-picker__container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: .02rem;
}

.ist-emoji-picker .emoji-picker__category-name {
    position: sticky;
    top: 0;
    color: rgba(var(--dark-inverted-color), 1) !important;
    background: rgba(var(--accent-color));
    z-index: 2;
    padding: .4rem 0;
    margin: 0 !important;
    text-transform: unset !important;
    font-size: .7rem !important;
}

[data-bs-theme=light] .ist-emoji-picker .emoji-picker__category-name {
    background: rgba(var(--light-inverted-color), 100%) !important;
}

.ist-emoji-picker .emoji-picker__emoji {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.ist-emoji-picker .emoji-picker__emoji img.emoji {
    height: 1.1em;
    width: 1.1em;
    margin: auto;
}

.ist-emoji-picker .emoji-picker__emoji:focus {
    outline: none !important;
}

.ist-emoji-picker .emoji-picker__emoji:focus, .emoji-picker__emoji:hover {
    background: none !important;
    scale: 1.2;
}

.ist-emoji-picker .emoji-picker__preview {
    border: 0;
}

.ist-emoji-picker .emoji-picker__preview-emoji {
    font-size: 1rem;
}

.ist-emoji-picker .emoji-picker__preview-name {
    color: rgba(var(--dark-inverted-color), 1);
}

.ist-emoji-picker .emoji-picker__variant-overlay {
    z-index: 3;
}

.ist-emoji-picker .emoji-picker__variant-popup {
    background: rgba(var(--accent-color)) !important;
    border: 1px solid rgba(var(--dark-inverted-color), 0.07) !important;
    border-radius: var(--bs-border-radius) !important;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: fit-content;
    margin: auto;
}

[data-bs-theme=light] .ist-emoji-picker .emoji-picker__variant-popup {
    background: rgba(var(--light-inverted-color), 100%) !important;
}

.ist-emoji-picker .emoji-picker__emoji {}