.tabs-bar {
    margin-inline-start: 0.6rem;
    height: var(--lg-button-size);
    position: relative;
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 0 8px;

    .tab {
        height: var(--lg-button-size) !important;
        width: 100px !important;
        min-width: 100px !important;
        margin-right: 0.6rem;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0 16px;
        border: none;
        border-radius: var(--border-radius-lg);
        background: var(--island-bg-color);
        color: #bdbdbd;
        font-size: 14px;
        font-weight: 500;
        cursor: pointer;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
        transition: all 0.2s ease;
        outline: none;

        &:hover {
            background: #4a4a54;
            color: #ffffff;
        }

        &.active-pad {
            background-color: #cc6d24 !important;
            color: var(--color-on-primary) !important;
            font-weight: bold;
            border: 1px solid #cccccc !important;
        }

        &.new-tab {
            min-width: var(--lg-button-size) !important;
            width: var(--lg-button-size) !important;
            padding: 0;
            background: var(--island-bg-color);
            color: #bdbdbd;

            &:hover {
                color: #ffffff;
                background: #4a4a54;
            }
        }
    }
}