/**********/
/*TABSTRIP*/
/**********/
.k-tabstrip,
.phoenix-tab-strip {
    background-color: unset;
}

.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper,
.phoenix-tab-strip.k-tabstrip-top > .k-tabstrip-items-wrapper {
    border: none;
}

.k-tabstrip:focus,
.phoenix-tab-strip:focus {
    box-shadow: none;
}

.k-tabstrip ul.k-tabstrip-items,
.phoenix-tab-strip ul.k-tabstrip-items {
    height: 50px;
    min-height: 50px;
    margin: 0 0 10px 0;
    display: flex;
    box-shadow: var(--big-shadow);
    width: 100%;
}

.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item + .k-item,
.phoenix-tab-strip.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item + .k-item {
    margin-left: 0;
}

.k-tabstrip ul.k-tabstrip-items li.k-item,
.phoenix-tab-strip ul.k-tabstrip-items li.k-item {
    margin: 0;
    flex-grow: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--tab-icon-inactive-background);
    border: none;
    border-radius: 0;
}

.k-tabstrip ul.k-tabstrip-items li.k-item.k-state-hover,
.phoenix-tab-strip ul.k-tabstrip-items li.k-item.k-state-hover {
    border-color: transparent;
    border-left: var(--tab-icon-inactive-font) solid 2px;
}

.k-tabstrip ul.k-tabstrip-items li.k-item.k-state-active,
.phoenix-tab-strip ul.k-tabstrip-items li.k-item.k-state-active {
    background: var(--tab-icon-active-background);
    color: var(--tab-icon-active-font);
    border-color: transparent;
    border-left: var(--tab-icon-active-font) solid 2px;
    border-radius: 0;
}

.k-tabstrip ul.k-tabstrip-items li.k-item,
.phoenix-tab-strip ul.k-tabstrip-items li.k-item {
    border-color: transparent;
    border-left: var(--tab-icon-inactive-font) solid 2px;
}

.k-tabstrip .k-tabstrip-items .k-item span.k-link,
.phoenix-tab-strip .k-tabstrip-items .k-item span.k-link {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--tab-icon-inactive-font);
}

.k-tabstrip .k-tabstrip-items .k-item.k-state-active span.k-link,
.phoenix-tab-strip .k-tabstrip-items .k-item.k-state-active span.k-link {
    color: var(--tab-icon-active-font);
}

.k-tabstrip ul.k-tabstrip-items li.k-item span span,
.phoenix-tab-strip ul.k-tabstrip-items li.k-item span span,
.k-tabstrip ul.k-tabstrip-items li.k-item span div,
.phoenix-tab-strip ul.k-tabstrip-items li.k-item span div {
    margin-right: 10px;
    background-color: var(--glyphicon-tab-icon-inactive);
}

.k-tabstrip ul.k-tabstrip-items li.k-item.k-state-active span.glyphicons,
.phoenix-tab-strip ul.k-tabstrip-items li.k-item.k-state-active span.glyphicons,
.k-tabstrip ul.k-tabstrip-items li.k-item.k-state-active div.glyphicons,
.phoenix-tab-strip ul.k-tabstrip-items li.k-item.k-state-active div.glyphicons {
    margin-right: 10px;
    background-color: var(--glyphicon-tab-icon-active);
}

.k-tabstrip div.k-content,
.phoenix-tab-strip div.k-content {
    padding: 0;
    height: calc(100vh - 200px);
}

.k-tabstrip > .k-content:not([id^="tabPermissions-"]) {
    overflow: unset;
}

/*********************/
/*TABSTRIP FOR POPUPS*/
/*********************/
.k-widget.k-tabstrip.popup,
.k-widget.phoenix-tab-strip.popup,
.k-widget .k-tabstrip.popup,
.k-widget .phoenix-tab-strip.popup {
    box-shadow: none;
    height: 100%;
}

#PopUpArea .k-tabstrip-wrapper {
    height: 100%;
    overflow: hidden;
}

.k-tabstrip.popup div.k-content,
.phoenix-tab-strip.popup div.k-content {
    padding: 0;
    overflow: hidden;
    overflow-y: auto;
    height: calc(100% - 40px);
    border: none;
}

.k-tabstrip.popup ul.k-tabstrip-items,
.phoenix-tab-strip.popup ul.k-tabstrip-items {
    min-height: 30px;
    height: 30px;
    width: 100%;
}

.k-tabstrip.popup ul.k-tabstrip-items li.k-item.k-state-active div.glyphicons,
.phoenix-tab-strip.popup ul.k-tabstrip-items li.k-item.k-state-active div.glyphicons,
.k-tabstrip.popup ul.k-tabstrip-items li.k-item div.glyphicons,
.phoenix-tab-strip.popup ul.k-tabstrip-items li.k-item div.glyphicons {
    width: 20px;
    height: 20px;
    margin: 0;
}

/***********************/
/*TABSTRIP COLORS MUTED*/
/***********************/
.k-tabstrip.muted ul.k-tabstrip-items li.k-item, 
.phoenix-tab-strip.muted ul.k-tabstrip-items li.k-item {
    background: transparent;
}

.k-tabstrip.muted ul.k-tabstrip-items li.k-item.k-state-active,
.phoenix-tab-strip.muted ul.k-tabstrip-items li.k-item.k-state-active {
    background-color: var(--white);
}