/* =========================================================
   PAGECONTROL SIGMO — GLOBAL
   Aplicado automaticamente a todos os TUniPageControl
   ========================================================= */


/* =========================================================
   BARRA DAS ABAS
   ========================================================= */

.x-tab-bar {
    background:
        linear-gradient(
            180deg,
            #f6f7f8 0%,
            #eff1f3 100%
        ) !important;

    border: 0 !important;
    border-bottom: 1px solid #d8dce1 !important;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}


/* Corpo interno da barra */
.x-tab-bar .x-tab-bar-body {
    background: transparent !important;
    border: 0 !important;
}


/* Estruturas internas, limitadas à barra das abas */
.x-tab-bar .x-box-inner,
.x-tab-bar .x-box-target {
    border: 0 !important;
}


/* =========================================================
   ABAS — ESTADO NORMAL
   ========================================================= */

.x-tab-bar .x-tab {
    background: transparent !important;
    background-image: none !important;

    border: 1px solid transparent !important;
    border-radius: 8px 8px 0 0 !important;

    box-shadow: none !important;

    margin-right: 3px !important;

    transition:
        background-color 0.16s ease,
        border-color 0.16s ease,
        box-shadow 0.16s ease,
        color 0.16s ease !important;
}


/* Remove o indicador azul padrão do tema */
.x-tab-bar .x-tab::before,
.x-tab-bar .x-tab::after {
    display: none !important;
    content: none !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* Estrutura interna da aba */
.x-tab-bar .x-tab-button,
.x-tab-bar .x-tab-wrap {
    background: transparent !important;
    border: 0 !important;
}


/* Texto da aba */
.x-tab-bar .x-tab-inner {
    color: #646b75 !important;

    font-family: "Segoe UI", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;

    text-shadow: none !important;

    transition:
        color 0.16s ease,
        font-weight 0.16s ease !important;
}


/* =========================================================
   HOVER DA ABA
   ========================================================= */

.x-tab-bar .x-tab-over,
.x-tab-bar .x-tab:hover {
    background: #e8eaed !important;

    border-color: #d4d7dc !important;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.75) !important;
}

.x-tab-bar .x-tab-over .x-tab-inner,
.x-tab-bar .x-tab:hover .x-tab-inner {
    color: #343940 !important;
}


/* =========================================================
   ABA SELECIONADA
   ========================================================= */

.x-tab-bar .x-tab-active {
    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fffafb 100%
        ) !important;

    border-color: #d3d6db !important;
    border-bottom-color: #ffffff !important;

    box-shadow:
        inset 0 -3px 0 #b92847,
        inset 0 1px 0 rgba(255, 255, 255, 0.98),
        0 -1px 4px rgba(16, 24, 40, 0.045) !important;
}


/* Texto da aba selecionada */
.x-tab-bar .x-tab-active .x-tab-inner {
    color: #9e213c !important;

    font-weight: 600 !important;

    text-shadow: none !important;
}


/* =========================================================
   FOCO PELO TECLADO
   ========================================================= */

.x-tab-bar .x-tab-focus,
.x-tab-bar .x-tab.x-focus {
    border-color: #b92847 !important;

    box-shadow:
        inset 0 -3px 0 #b92847,
        0 0 0 2px rgba(185, 40, 71, 0.12) !important;

    outline: 0 !important;
}


/* Remove o foco azul dos elementos internos */
.x-tab-bar .x-tab-focus .x-tab-button,
.x-tab-bar .x-tab-focus .x-tab-inner,
.x-tab-bar .x-tab.x-focus .x-tab-button,
.x-tab-bar .x-tab.x-focus .x-tab-inner {
    outline: 0 !important;
    box-shadow: none !important;
}


/* =========================================================
   ABA DESABILITADA
   ========================================================= */

.x-tab-bar .x-tab-disabled,
.x-tab-bar .x-tab.x-item-disabled {
    background: transparent !important;

    border-color: transparent !important;

    box-shadow: none !important;

    opacity: 0.48 !important;
}

.x-tab-bar .x-tab-disabled .x-tab-inner,
.x-tab-bar .x-tab.x-item-disabled .x-tab-inner {
    color: #8e949c !important;
}


/* =========================================================
   ÍCONES NAS ABAS
   ========================================================= */

.x-tab-bar .x-tab-icon-el {
    color: #747b85 !important;

    opacity: 0.88 !important;

    transition:
        color 0.16s ease,
        opacity 0.16s ease !important;
}

.x-tab-bar .x-tab-active .x-tab-icon-el {
    color: #a52340 !important;
    opacity: 1 !important;
}


/* =========================================================
   BOTÕES DE ROLAGEM DAS ABAS
   ========================================================= */

.x-tab-bar .x-box-scroller-tab-bar-default {
    background: #eceef1 !important;

    color: #626973 !important;

    opacity: 0.85 !important;
}

.x-tab-bar .x-box-scroller-tab-bar-default:hover {
    background: #e1e4e8 !important;

    color: #9e213c !important;

    opacity: 1 !important;
}

