body {
    --tabs-highlight-color: greenyellow;
}

#tabs_ex_txt, #tabs_ex_img {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    align-self: center;
    justify-content: center;
    margin: 8px 2px;
    padding: 6px;
    border-radius: 8px;
    background-color: var(--background-fill-secondary);
}

#tabs_ex_txt .tab_button, #tabs_ex_img .tab_button {
    margin: 4px;
    padding: 2px 6px;
    border: 2px;
    border-style: ridge;
    color: var(--button-secondary-text-color);
    border-color: var(--block-info-text-color);
    background-color: transparent;
    transition: all 0.1s linear;
    max-width: 240px;           /* не расползаться чрезмерно */
    white-space: nowrap;        /* не переносить названия на 2 строки */
    overflow: hidden;           /* скрыть хвост */
    text-overflow: ellipsis;    /* троеточие для очень длинных имён */
}

#tabs_ex_txt .tab_button:hover, #tabs_ex_img .tab_button:hover {
    box-shadow: 0px 0px 8px var(--button-secondary-text-color);
}

#tabs_ex_txt .tab_button.selected, #tabs_ex_img .tab_button.selected {
    background-color: var(--border-color-accent);
}

#tabs_ex_txt .tab_button.active, #tabs_ex_img .tab_button.active {
    color: var(--tabs-highlight-color);

    /* Simulate Bold, without affecting the Width */
    text-shadow: 0px 0px 2px var(--tabs-highlight-color);
}

#tabs_ex_content-txt2img-left,
#tabs_ex_content-txt2img-right,
#tabs_ex_content-txt2img-above,
#tabs_ex_content-txt2img-below,
#tabs_ex_content-img2img-left,
#tabs_ex_content-img2img-right,
#tabs_ex_content-img2img-above,
#tabs_ex_content-img2img-below {
    padding: 1em;
    background-color: var(--block-background-fill);
    border-radius: 8px;
}