/* Main Hashtag Bar Module */
.SB_HASHTAG_MODULE {
    padding: 0px 0px;
    padding-top: 0px;
}

/* Letters Row (With Horizontal Scrolling) */
.SB_HASHTAG_LETTERS {
    display: flex;
    flex-wrap: nowrap;
    flex-shrink: 0;
    overflow-x: auto;
    white-space: nowrap;
    gap: 8px;
    padding-bottom: 6px;
    scrollbar-width: none;        /* Firefox */
    -ms-overflow-style: none;     /* IE/Edge */
}

.SB_HASHTAG_LETTERS::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

/* Letter Buttons */
.SB_LETTER {
    flex: 0 0 auto;
    background: white;
    color: black;
    padding: 6px 10px;
    cursor: pointer;
    border-radius: 4px;
    font-size: 1em;
    white-space: nowrap;
    padding: 8px 12px;
    text-decoration:  none;
}

.SB_LETTER:hover {
    background: #C10050;
    color: white;
}

.SB_LETTER.active {
    background: #5A0026;
    color: #fff;
    border-radius: 6px;
    cursor: default;
}

/* Trending */
.SB_LETTER_TRENDING {
    background: #C10050 !important;
    color: #fff !important;
    font-weight: bold !important;
}

/* Tag Groups (With Horizontal Scrolling) */
.SB_TAG_GROUP {
    display: none;
    width: 100%;
    flex-wrap: nowrap;
    overflow-x: auto;
    white-space: nowrap;
    gap: 6px;
    margin-top: 10px;
    padding-bottom: 6px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.SB_TAG_GROUP::-webkit-scrollbar {
    display: none;
}

/* Tags */
.SB_TAG {
    flex: 0 0 auto;
    background: #373737;
    color: #fff;
    padding: 5px 10px;
    border-radius: 16px;
    font-size: 0.9rem;
    cursor: pointer;
    white-space: nowrap;
    border: 1px solid rgba(255,255,255,0.1);
}

.SB_TAG:hover {
    background: #4d4d4d;
}

/* optional trending tag override (if used) */
.SB_TAG[data-group="TRENDING"] {
    background: #C10050 !important;
    color: #fff !important;
}