/**** Geral ****/
body, html {
    height: 100%;
    margin: 0;
    font-family: 'Nunito', sans-serif;
}

/* Foco Formulário */
.form-control:focus {
    outline: none;
    box-shadow: 0 0 0 0.25rem rgba(var(--tblr-primary-rgb), .25);
}


/**** Paginação *****/
.pagination .page-link span,
.pagination .page-link a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
}

/* Setinha da paginação */
.pagination .page-link {
    font-size: 1.0rem;
}


/**** Table ****/

table tbody tr td a.btn.btn-sm.btn-link i,
.btn.btn-light.btn-sm.border.popup_selector i,
.btn.btn-light.btn-sm.border.clear_elfinder_picker i,
button.browse i,
a.btn.btn-sm.btn-secondary.bulk-button i {
    margin-right: 3px;
}

table tbody tr td.dtr-control span {
    margin-left: 3px;
}

.table thead th,
.table tfoot th {
    background-color: transparent!important;
    height: 3rem; /* Ajuste para a altura desejada */
    line-height: 3rem; /* Certifique-se de que a linha esteja centralizada */
    vertical-align: middle; /* Alinhamento vertical central */
}

.table thead th,
.table tfoot th {
    background: var(--tblr-bg-surface-tertiary);
    font-size: .625rem;
    font-weight: var(--tblr-font-weight-bold);
    text-transform: uppercase;
    letter-spacing: .04em;
    line-height: 1rem;
    color: var(--tblr-muted);
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    white-space: nowrap;
}

.table thead th,
.table tfoot th {
    font-weight: 700;
}

table .btn-link, #form_tabs p .btn-link:not(:hover) {
    color: var(--tblr-primary);
}

table .btn-link:hover {
    text-decoration: none;
    background-color: transparent;
    color: rgba(var(--tblr-primary-rgb), .8);
}
table .btn-link:active {
    background-color: transparent!important;
    border-color: transparent!important;
    text-decoration: underline;
}

tbody {
    background-color: var(--tblr-table-bg);
}


/**** Select2 ****/

/* Estilo padrão do Select2 para seleção única */
.select2-container .select2-selection--single {
    height: 38px; /* Altura do select para corresponder à altura do seu select padrão */
    border: 1px solid #ced4da; /* Bordas padrão */
    border-radius: 4px; /* Bordas arredondadas */
    padding: 6px 12px; /* Padding interno */
    background-color: #fff; /* Cor de fundo */
    box-shadow: none; /* Remove qualquer sombra */
}

.select2-container {
    width: 100% !important;
}

/* Renderização de seleção */
.select2-container .select2-selection--single .select2-selection__rendered {
    line-height: 24px; /* Ajuste para alinhar verticalmente o texto */
}

/* Ajuste da seta de seleção */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px; /* Altura da seta para corresponder à altura do select */
    top: 1px; /* Ajuste para centralizar verticalmente */
    right: 1px; /* Ajuste para centralizar horizontalmente */
}

/* Cor da seta */
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #333 transparent transparent transparent !important; /* Cor da seta padrão */
}

/* Ajuste do campo de pesquisa do Select2 */
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #ced4da; /* Bordas padrão */
    padding: 6px 12px; /* Padding interno */
    border-radius: 4px; /* Bordas arredondadas */
    height: 38px; /* Altura do campo de pesquisa */
    box-sizing: border-box; /* Inclui padding e bordas no cálculo da largura e altura */
}

/* Estilo específico para o select2 com a classe 'no-border-select2' */
.no-border-select2 + .select2-container--default .select2-selection--single {
    border: none !important; /* Remove todas as bordas do select2 */
    border-bottom: 1px solid #ced4da !important; /* Adiciona apenas a borda inferior */
    background-color: transparent !important; /* Fundo transparente */
}

/* Ajuste de padding para 'no-border-select2' */
.no-border-select2 + .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 0 !important; /* Remove o padding esquerdo */
    padding-right: 0 !important; /* Remove o padding direito */
}

/* Ajuste da seta para 'no-border-select2' */
.no-border-select2 + .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%; /* Altura da seta para corresponder à altura do select */
    border-left: none !important; /* Remove a borda esquerda da seta */
}


/**** DateRangePicker ****/

/* Adicione este CSS ao seu arquivo de estilos */
.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker td.start-date,
.daterangepicker td.start-date:hover,
.daterangepicker td.end-date,
.daterangepicker td.end-date:hover {
    background-color: var(--tblr-primary) !important;
    border-color: transparent !important;
    color: #fff !important;
}

.daterangepicker .ranges li.active {
    background-color: var(--tblr-primary) !important;
    color: #fff !important;
}

/* Adicionando cores personalizadas para os botões Apply e Cancel */
.daterangepicker .drp-buttons .btn-primary {
    background-color: var(--tblr-primary) !important;
    border-color: var(--tblr-primary) !important;
}

.daterangepicker .drp-buttons .btn-primary:hover {
    background-color: var(--tblr-primary) !important;
    border-color: var(--tblr-primary) !important;
}

.daterangepicker .drp-buttons .btn-secondary {
    background-color: var(--tblr-secondary) !important;
    border-color: var(--tblr-secondary) !important;
}

.daterangepicker .drp-buttons .btn-secondary:hover {
    background-color: var(--tblr-secondary) !important;
    border-color: var(--tblr-secondary) !important;
}


/**** TabPanel ****/

.card-header {
    border-bottom: none !important; /* Remove a borda inferior do card-header */
    padding-bottom: 0 !important; /* Remove qualquer preenchimento inferior do card-header */
}

.nav-tabs {
    margin-bottom: 0;
    padding-left: 0;
    border-bottom: none; /* Remove a borda inferior das abas */
}

.nav-tabs .nav-link {
    border: none; /* Remove todas as bordas das abas */
    border-radius: 10px 10px 0 0; /* Mantém o arredondamento das abas */
}

.tab-content {
    border: none; /* Remove todas as bordas do conteúdo das abas */
    border-radius: 0 0 10px 10px; /* Mantém o arredondamento do conteúdo das abas */
    padding: 0; /* Remove o preenchimento do conteúdo das abas */
}

.tab-pane {
    border: none; /* Remove todas as bordas do painel de abas */
    border-top: none; /* Remove a borda superior do painel de abas */
    border-radius: 0 0 10px 10px; /* Mantém o arredondamento do painel de abas */
    padding: 0; /* Remove o preenchimento do painel de abas */
}


/**** Filtros ****/

.navbar .navbar-nav {
    min-height: initial;
}

.navbar.navbar-filters {
    color: var(--tblr-body-color);
    background-color: var(--tblr-card-bg);
    border: var(--tblr-card-border-width) solid var(--tblr-card-border-color);
    border-radius: var(--tblr-card-border-radius);
    box-shadow: var(--tblr-card-box-shadow)!important;
    margin: 0.8rem 0!important;
    --tblr-card-border-width: var(--tblr-border-width);
    --tblr-card-border-color: var(--tblr-border-color-translucent);
    --tblr-card-border-radius: var(--tblr-border-radius);
    --tblr-card-box-shadow: var(--tblr-shadow-card);
    --tblr-card-bg: var(--tblr-bg-surface);
    padding: 0.5rem 1rem!important;
}

.navbar.navbar-filters .nav-link {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 80%;
    color: var(--tblr-muted)!important;
}

.navbar.navbar-filters + div {
    overflow: hidden;
}

/**** Modal Fetch ****/

/* Estilo do ícone de loading */
.loading-spinner {
    display: inline-block;
    border: 2px solid rgba(0, 0, 0, .1);
    border-radius: 50%;
    border-top-color: var(--tblr-primary);
    width: 16px;
    height: 16px;
    animation: spin 1s ease-in-out infinite;
    margin-right: 5px;
    visibility: hidden; /* Inicia invisível */
}

/* Animação de rotação */
@keyframes spin {
    to { transform: rotate(360deg); }
}



/**** Simulador de Vendas ****/

.simulador-container {

    /* ————— VENDAS (blocos 1 a 7) ————— */
    --sim-bloco1:   hsl(200,84%,20%); /* Azul escuro inicial */
    --sim-bloco2:   hsl(200,84%,23%);
    --sim-bloco3:   hsl(200,84%,26%);
    --sim-bloco4: hsl(200,84%,29%);
    --sim-bloco5: hsl(200,84%,32%);
    --sim-bloco6:  hsl(200, 84%, 35%);
    --sim-bloco7:  hsl(200, 84%, 38%);

    /* ————— ESTOQUE (blocos 8 a 11) ————— */
    --sim-bloco8:  hsl(30, 80%, 20%);  /* Marrom escuro inicial */
    --sim-bloco9:  hsl(30, 80%, 23%);
    --sim-bloco10: hsl(30, 80%, 26%);
    --sim-bloco11: hsl(30, 80%, 29%);

    /* ————— SUGESTÃO MÉDIA (bloco 12) ————— */
    --sim-bloco12:  hsl(120, 60%, 20%);  /* Verde escuro inicial */

    /* ————— SUGESTÃO ANO ANTERIOR (bloco 13) ————— */
    --sim-bloco13:  hsl(120, 60%, 25%);  /* Verde médio inicial */

    /* ————— PEDIDO (blocos 14 a 16) ————— */
    --sim-bloco14:  hsl(120, 0%, 20%);  /* Cinza escuro inicial */
    --sim-bloco15:  hsl(120, 0%, 23%);
    --sim-bloco16:  hsl(120, 0%, 26%);

    /* ————— CONSIGNADO (bloco 17) ————— */
    --sim-bloco17: hsl(60, 100%, 25%);  /* Amarelo bem escuro */


    /* Cor cinza suave para as colunas fixas */
    --sim-cinza-fixo: #eceff1;
}


/* → BLOCOS DE VENDAS */
.simulador-container table thead th.th-umbrella {
    background-color: var(--tblr-primary) !important;
    background-image: none            !important;
    border-color:     var(--tblr-primary) !important;
    color:            #fff            !important;
}

/* ——— BLOCO 1 a 7 (meses de VENDAS) ——— */

/* Bloco 1 - MÊS 1 */
.simulador-container table thead tr:nth-child(2) th.th-bloco1 {
    background-color: var(--sim-bloco1) !important;
    background-image: none          !important;
    border-color:     var(--sim-bloco1) !important;
    color:            #fff           !important;
}
/* Bloco 2 - MÊS 2 */
.simulador-container table thead tr:nth-child(2) th.th-bloco2 {
    background-color: var(--sim-bloco2) !important;
    background-image: none          !important;
    border-color:     var(--sim-bloco2) !important;
    color:            #fff           !important;
}
/* Bloco 3 - MÊS 3 */
.simulador-container table thead tr:nth-child(2) th.th-bloco3 {
    background-color: var(--sim-bloco3) !important;
    background-image: none          !important;
    border-color:     var(--sim-bloco3) !important;
    color:            #fff           !important;
}
/* Bloco 4 - 3 MESES */
.simulador-container table thead tr:nth-child(2) th.th-bloco4 {
    background-color: var(--sim-bloco4) !important;
    background-image: none             !important;
    border-color:     var(--sim-bloco4) !important;
    color:            #fff             !important;
}

/* Bloco 5 - ANO ANTERIOR */
.simulador-container table thead tr:nth-child(2) th.th-bloco5 {
    background-color: var(--sim-bloco5) !important;
    background-image: none                   !important;
    border-color:     var(--sim-bloco5) !important;
    color:            #fff                    !important;
}

/* Bloco 6 - MÊS VIGENTE */
.simulador-container table thead tr:nth-child(2) th.th-bloco6 {
    background-color: var(--sim-bloco6) !important;
    background-image: none                  !important;
    border-color:     var(--sim-bloco6) !important;
    color:            #fff                  !important;
}

/* Bloco 7 - PREVISÃO */
.simulador-container table thead tr:nth-child(2) th.th-bloco7 {
    background-color: var(--sim-bloco7) !important;
    background-image: none                  !important;
    border-color:     var(--sim-bloco7) !important;
    color:            #fff                  !important;
}

/* ——— RÓTULOS VENDAS (BLOCOS 1 a 7)——— */

/* Bloco 1 - Rótulo “Vendas I” */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco1 {
    background-color: var(--sim-bloco1) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco1) !important;
    color:            #fff            !important;
}

/* Bloco 2 - Rótulo “Vendas II” */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco2 {
    background-color: var(--sim-bloco2) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco2) !important;
    color:            #fff            !important;
}

/* Bloco 3 - Rótulo “Vendas III” */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco3 {
    background-color: var(--sim-bloco3) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco3) !important;
    color:            #fff            !important;
}

/* Bloco 4 - Rótulo “Média” */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco4 {
    background-color: var(--sim-bloco4) !important;
    background-image: none              !important;
    border-color:     var(--sim-bloco4) !important;
    color:            #fff              !important;
}

/* Bloco 5 - Rótulo “Ano Anterior” */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco5 {
    background-color: var(--sim-bloco5) !important;
    background-image: none                    !important;
    border-color:     var(--sim-bloco5) !important;
    color:            #fff                    !important;
}

/* Bloco 6 - Rótulo “Mês Vigente” */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco6 {
    background-color: var(--sim-bloco6) !important;
    background-image: none                   !important;
    border-color:     var(--sim-bloco6) !important;
    color:            #fff                   !important;
}

/* Bloco 7 - Rótulo “Previsão” */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco7 {
    background-color: var(--sim-bloco7) !important;
    background-image: none                   !important;
    border-color:     var(--sim-bloco7) !important;
    color:            #fff                   !important;
}


/* ——— BLOCO 8 a 11 (ESTOQUE) ——— */
.simulador-container table thead tr:nth-child(1) th.th-umbrella-estoque {
    background-color: hsl(30, 80%, 20%) !important; /* laranja escuro */
    background-image: none             !important;
    border-color:     hsl(30, 80%, 20%) !important;
    color:            #fff             !important;
}

.simulador-container table thead tr:nth-child(2) th.th-bloco8 {
    background-color: var(--sim-bloco8) !important;
    background-image: none           !important;
    border-color:     var(--sim-bloco8) !important;
    color:            #fff           !important;
}
.simulador-container table thead tr:nth-child(2) th.th-bloco9 {
    background-color: var(--sim-bloco9) !important;
    background-image: none           !important;
    border-color:     var(--sim-bloco9) !important;
    color:            #fff           !important;
}
.simulador-container table thead tr:nth-child(2) th.th-bloco10 {
    background-color: var(--sim-bloco10) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco10) !important;
    color:            #fff            !important;
}
.simulador-container table thead tr:nth-child(2) th.th-bloco11 {
    background-color: var(--sim-bloco11) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco11) !important;
    color:            #fff            !important;
}

/* ——— RÓTULOS ESTOQUE (BLOCOS 8 a 11)——— */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco8 {
    background-color: var(--sim-bloco8) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco8) !important;
    color:            #fff            !important;
}
.simulador-container table thead tr:nth-child(3) th.th-label-bloco9 {
    background-color: var(--sim-bloco9) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco9) !important;
    color:            #fff            !important;
}
.simulador-container table thead tr:nth-child(3) th.th-label-bloco10 {
    background-color: var(--sim-bloco10) !important;
    background-image: none             !important;
    border-color:     var(--sim-bloco10) !important;
    color:            #fff             !important;
}
.simulador-container table thead tr:nth-child(3) th.th-label-bloco11 {
    background-color: var(--sim-bloco11) !important;
    background-image: none             !important;
    border-color:     var(--sim-bloco11) !important;
    color:            #fff             !important;
}


/* ——— BLOCO 12 (SUGESTÃO MÉDIA) ——— */

.simulador-container table thead tr:nth-child(1) th.th-umbrella-sugestao-media {
    background-color: hsl(120, 60%, 20%) !important; /* Verde escuro */
    background-image: none             !important;
    border-color:     hsl(120, 60%, 20%) !important;
    color:            #fff             !important;
}

.simulador-container table thead tr:nth-child(2) th.th-bloco12 {
    background-color: var(--sim-bloco12) !important;
    background-image: none           !important;
    border-color:     var(--sim-bloco12) !important;
    color:            #fff           !important;
}

/* ——— RÓTULOS SUGESTÃO MÉDIA (BLOCO 12)——— */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco12 {
    background-color: var(--sim-bloco12) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco12) !important;
    color:            #fff            !important;
}


/* ——— BLOCO 13 (SUGESTÃO ANO ANTERIOR) ——— */

.simulador-container table thead tr:nth-child(1) th.th-umbrella-sugestao-ano-anterior {
    background-color: hsl(120, 60%, 25%) !important; /* Verde escuro */
    background-image: none             !important;
    border-color:     hsl(120, 60%, 25%) !important;
    color:            #fff             !important;
}

.simulador-container table thead tr:nth-child(2) th.th-bloco13 {
    background-color: var(--sim-bloco13) !important;
    background-image: none           !important;
    border-color:     var(--sim-bloco13) !important;
    color:            #fff           !important;
}

/* ——— RÓTULOS SUGESTÃO MÉDIA (BLOCO 13)——— */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco13 {
    background-color: var(--sim-bloco13) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco13) !important;
    color:            #fff            !important;
}


/* ——— BLOCO 14 a 16 (PEDIDO) ——— */

.simulador-container table thead tr:nth-child(1) th.th-umbrella-pedido {
    background-color: hsl(120, 0%, 20%) !important; /* Verde escuro */
    background-image: none             !important;
    border-color:     hsl(120, 0%, 20%) !important;
    color:            #fff             !important;
}

.simulador-container table thead tr:nth-child(2) th.th-bloco14 {
    background-color: var(--sim-bloco14) !important;
    background-image: none           !important;
    border-color:     var(--sim-bloco14) !important;
    color:            #fff           !important;
}

.simulador-container table thead tr:nth-child(2) th.th-bloco15 {
    background-color: var(--sim-bloco15) !important;
    background-image: none           !important;
    border-color:     var(--sim-bloco15) !important;
    color:            #fff           !important;
}

.simulador-container table thead tr:nth-child(2) th.th-bloco16 {
    background-color: var(--sim-bloco16) !important;
    background-image: none           !important;
    border-color:     var(--sim-bloco16) !important;
    color:            #fff           !important;
}

/* ——— RÓTULOS PEDIDO (BLOCO 14 a 16)——— */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco14 {
    background-color: var(--sim-bloco14) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco14) !important;
    color:            #fff            !important;
}

.simulador-container table thead tr:nth-child(3) th.th-label-bloco15 {
    background-color: var(--sim-bloco15) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco15) !important;
    color:            #fff            !important;
}

.simulador-container table thead tr:nth-child(3) th.th-label-bloco16 {
    background-color: var(--sim-bloco16) !important;
    background-image: none            !important;
    border-color:     var(--sim-bloco16) !important;
    color:            #fff            !important;
}

/* ——— BLOCO 17 (CONSIGNADO) ——— */

.simulador-container table thead tr:nth-child(1) th.th-umbrella-consignado {
    background-color: hsl(60, 100%, 20%) !important;  /* Amarelo ainda mais escuro */
    background-image: none                         !important;
    border-color:     hsl(60, 100%, 20%) !important;
    color:            #fff                         !important;
}

.simulador-container table thead tr:nth-child(2) th.th-bloco17 {
    background-color: var(--sim-bloco17) !important;
    background-image: none             !important;
    border-color:     var(--sim-bloco17) !important;
    color:            #fff              !important;
}

/* ——— RÓTULO CONSIGNADO (BLOCO 17) ——— */
.simulador-container table thead tr:nth-child(3) th.th-label-bloco17 {
    background-color: var(--sim-bloco17) !important;
    background-image: none             !important;
    border-color:     var(--sim-bloco17) !important;
    color:            #fff              !important;
}

/* Colunas fixas: Código e Descrição do Item */
.simulador-container table thead th.th-fixed,
.simulador-container table tbody td.th-fixed {
    position: sticky;
    left: 0; /* Fixar à esquerda */
    z-index: 1;
    background-color: var(--sim-cinza-fixo); /* Cor cinza suave para as colunas fixas */
    color: #063045; /* Cor da letra para as colunas fixas */
    border-right: 1px solid #ddd; /* Borda direita para as colunas fixas */
}

.simulador-container table.table-bordered thead th.th-fixed {
    background-color: var(--sim-cinza-fixo) !important; /* Usando o tom de cinza suave */
    background-image: none       !important;
    border-color:     #cad4dd   !important; /* cinza médio para borda */
    color:            #063045   !important; /* reaproveita seu primário no texto */
}

/* Definindo fundo similar para as colunas "Lançamento", "Grupo", "Subgrupo", "Pço CT" e "Pço VD" */
.simulador-container table thead th.th-bg {
    background-color: #eceff1 !important;  /* cinza claro */
    background-image: none       !important;
    border-color:     #cad4dd   !important; /* cinza médio para borda */
    color:            #063045   !important; /* cor primária para o texto */
}

.btn-upload-xs {
    font-size: 0.65rem;
    padding: 0.2rem 0.4rem;
}

.no-wrap {
    white-space: nowrap;
}

.align-middle {
    vertical-align: middle !important;
}