
#contentDIV {
    height: calc(100dvh - 60px);
    overflow-y: auto;
    background: black;

/*    display: flex;
    flex-direction: column;
    height: 100vh;       
    overflow: hidden;    
*/
}

/* =========================
   ROOT MODULE
========================= */

.SB_HASHTAG_MODULE {
    background: black;
    padding: 10px 20px;
}

/* =========================
   LETTERS ROW (HORIZONTAL SCROLL)
========================= */

.SB_HASHTAG_LETTERS {
    display: flex;
    flex-wrap: nowrap;
    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: 16px;
    white-space: nowrap;
    padding: 14px 18px;
}

.SB_LETTER:hover {
    background: #4c4c4c;
}

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

/* =========================
   TAG GROUPS (HORIZONTAL SCROLL)
========================= */

.SB_TAG_GROUP {
    display: none;
    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;
}

/* each tag chip */
.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;
}