#input-tabs-wrapper #input-tabs,
#output-tabs-wrapper #output-tabs {
    list-style: none;
    background-color: var(--title-background-colour);
    padding: 0;
    margin: 0;
    overflow-x: auto;
    overflow-y: hidden;
    display: flex;
    flex-direction: row;
    border-bottom: 1px solid var(--primary-border-colour);
    border-left: 1px solid var(--primary-border-colour);
    height: var(--tab-height);
    clear: none;
}

#input-tabs li,
#output-tabs li {
    display: flex;
    flex-direction: row;
    width: 100%;
    min-width: 120px;
    float: left;
    padding: 0;
    text-align: center;
    border-right: 1px solid var(--primary-border-colour);
    height: var(--tab-height);
    vertical-align: middle;
}

#input-tabs li:hover,
#output-tabs li:hover {
    cursor: pointer;
    background-color: var(--primary-background-colour);
}

.active-input-tab,
.active-output-tab {
    font-weight: bold;
    background-color: var(--primary-background-colour);
}

.input-tab-content+.btn-close-tab {
    display: block;
    margin-top: auto;
    margin-bottom: auto;
    margin-right: 2px;
}

.input-tab-content+.btn-close-tab i {
    font-size: 0.8em;
}

.input-tab-buttons,
.output-tab-buttons {
    width: 25px;
    text-align: center;
    margin: 0;
    height: var(--tab-height);
    line-height: var(--tab-height);
    font-weight: bold;
    background-color: var(--title-background-colour);
    border-bottom: 1px solid var(--primary-border-colour);
}

.input-tab-buttons:hover,
.output-tab-buttons:hover {
    cursor: pointer;
    background-color: var(--primary-background-colour);
}

#btn-next-input-tab,
#btn-input-tab-dropdown,
#btn-next-output-tab,
#btn-output-tab-dropdown {
    float: right;
}

#btn-previous-input-tab,
#btn-previous-output-tab {
    float: left;
}

#btn-close-all-tabs {
    color: var(--breakpoint-font-colour) !important;
}

.input-tab-content,
.output-tab-content {
    width: 100%;
    max-width: 100%;
    padding: 10px 5px;
    height: var(--tab-height);
    vertical-align: middle;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.btn-close-tab {
    height: var(--tab-height);
    vertical-align: middle;
    width: fit-content;
}

.tabs-left > li:first-child {
    box-shadow: 15px 0 15px -15px var(--primary-border-colour) inset;
}

.tabs-right > li:last-child {
    box-shadow: -15px 0 15px -15px var(--primary-border-colour) inset;
}