/* =====================================================================
   ARENA LIVRAMENTO  ·  Identidade visual
   Paleta baseada no logo (arenaenpng.png): verde grama, preto e branco.
   Todos os ajustes de marca vivem aqui para não serem sobrescritos por
   atualizações do tema adminbs5.
   ===================================================================== */

:root {
    --ad-menu-size: 370px;

    /* ---- Paleta da marca (extraída do logo) ---- */
    --arena-green:        #2fae4c;   /* verde principal */
    --arena-green-rgb:    47, 174, 76;
    --arena-green-600:    #26933f;   /* hover */
    --arena-green-700:    #1c7a33;   /* pressionado / links */
    --arena-green-300:    #7ed693;   /* realces claros */
    --arena-tint:         #eaf7ee;   /* fundo verde bem suave */
    --arena-ink:          #16181c;   /* preto do logo (menu) */
    --arena-ink-2:        #1f2327;   /* preto elevado */
    --arena-ink-3:        #2a2f34;

    --arena-shadow:       0 10px 30px -12px rgba(22, 24, 28, .28);
    --arena-shadow-sm:    0 4px 14px -6px rgba(22, 24, 28, .22);
}

/* ---- Mapeia o "primary" do Bootstrap para o verde da marca ---------- */
:root,
[data-bs-theme=light],
[data-bs-theme=dark] {
    --bs-primary:            var(--arena-green);
    --bs-primary-rgb:        var(--arena-green-rgb);
    --bs-link-color:         var(--arena-green-700);
    --bs-link-color-rgb:     28, 122, 51;
    --bs-link-hover-color:   var(--arena-green-600);
    --bs-focus-ring-color:   rgba(var(--arena-green-rgb), .30);
    --ad-menu-item-color:    var(--arena-green);
}

/* Faixa verde fininha no topo da página — assinatura discreta da marca */
.main > .navbar {
    box-shadow: inset 0 3px 0 0 var(--arena-green);
}

/* =====================================================================
   BOTÕES
   ===================================================================== */
.btn-primary {
    --bs-btn-bg:            var(--arena-green);
    --bs-btn-border-color:  var(--arena-green);
    --bs-btn-hover-bg:      var(--arena-green-600);
    --bs-btn-hover-border-color: var(--arena-green-600);
    --bs-btn-active-bg:     var(--arena-green-700);
    --bs-btn-active-border-color: var(--arena-green-700);
    --bs-btn-disabled-bg:   var(--arena-green);
    --bs-btn-disabled-border-color: var(--arena-green);
    box-shadow: 0 4px 12px -4px rgba(var(--arena-green-rgb), .55);
}

.btn {
    border-radius: 8px;
    font-weight: 600;
    transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}

.btn-primary:hover,
.btn-primary:focus {
    transform: translateY(-1px);
    box-shadow: 0 7px 18px -5px rgba(var(--arena-green-rgb), .65);
}

.btn-primary:active {
    transform: translateY(0);
}

.btn-outline-primary {
    --bs-btn-color:            var(--arena-green-700);
    --bs-btn-border-color:     var(--arena-green);
    --bs-btn-hover-bg:         var(--arena-green);
    --bs-btn-hover-border-color: var(--arena-green);
    --bs-btn-active-bg:        var(--arena-green-600);
}

/* =====================================================================
   SIDEBAR (menu) — preto do logo com realces verdes
   ===================================================================== */
[data-menu-theme=dark] #sidebar {
    background: linear-gradient(180deg, var(--arena-ink-2) 0%, var(--arena-ink) 100%);
}

/* cabeçalho com o logo */
[data-menu-theme=dark] .sidebar-system-name {
    background: rgba(0, 0, 0, .28);
    color: #fff;
    border-bottom: 1px solid rgba(var(--arena-green-rgb), .35) !important;
    box-shadow: 0 4px 14px -6px rgba(0, 0, 0, .6);
}

/* título "MENU" */
[data-menu-theme=dark] .sidebar-menu-title .name {
    color: var(--arena-green-300);
    letter-spacing: .14em;
    font-size: .72rem;
    font-weight: 700;
}

/* item ativo: verde da marca com leve profundidade */
a.sidebar-link.active,
a.sidebar-link.active:hover {
    background: linear-gradient(90deg, var(--arena-green) 0%, var(--arena-green-600) 100%) !important;
    color: #fff !important;
    box-shadow: 0 6px 16px -8px rgba(var(--arena-green-rgb), .8);
    border-radius: 8px;
}

/* barrinha verde à esquerda no hover (feedback sutil) */
[data-menu-theme=dark] a.sidebar-link {
    border-left: 3px solid transparent;
    border-radius: 8px;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

[data-menu-theme=dark] a.sidebar-link:hover {
    background: rgba(var(--arena-green-rgb), .12);
    border-left-color: var(--arena-green);
    color: #fff;
}

[data-menu-theme=dark] a.sidebar-link[aria-expanded=true] {
    background: rgba(var(--arena-green-rgb), .16);
    color: #fff;
}

/* barra de rolagem do menu na cor da marca */
[data-menu-theme=dark] #sidebar {
    scrollbar-color: rgba(var(--arena-green-rgb), .5) transparent;
}

/* =====================================================================
   TOPBAR
   ===================================================================== */
[data-bs-theme=light] .navbar {
    background: #ffffff;
    box-shadow: 0 2px 10px -6px rgba(22, 24, 28, .25);
}

.navbar .username {
    font-weight: 600;
}

/* =====================================================================
   PAINÉIS / CARTÕES
   ===================================================================== */
.card,
.panel {
    border-radius: 14px;
    overflow: hidden;
}

.container-fluid .card {
    box-shadow: var(--arena-shadow);
    border: 1px solid rgba(22, 24, 28, .06);
}

.card-header,
.panel-heading {
    font-weight: 700;
    border-bottom: 1px solid rgba(22, 24, 28, .08);
    position: relative;
}

/* acento verde à esquerda do título do painel */
[data-bs-theme=light] .card-header::before,
[data-bs-theme=light] .panel-heading::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 22px;
    border-radius: 0 4px 4px 0;
    background: var(--arena-green);
}

.card-header .card-title,
.panel-heading .card-title {
    padding-left: 6px;
}

/* botão "Novo" e ações no cabeçalho do painel em verde */
.panel-heading .btn.superlight:hover {
    color: var(--arena-green-700);
}

/* =====================================================================
   DATAGRIDS (listagens)
   ===================================================================== */
.table thead th {
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: .78rem;
    font-weight: 700;
    color: var(--arena-ink);
}

[data-bs-theme=light] .table thead th {
    background: var(--arena-tint);
    border-bottom: 2px solid rgba(var(--arena-green-rgb), .45) !important;
}

[data-bs-theme=light] .tdatagrid_body tr:hover td,
[data-bs-theme=light] .table tbody tr:hover td {
    background: rgba(var(--arena-green-rgb), .07) !important;
}

/* cantos arredondados na tabela dentro do painel */
.card-body > .table,
.panel .table {
    border-radius: 10px;
    overflow: hidden;
}

/* =====================================================================
   PAGINAÇÃO (rodapé das listagens) — número selecionado em verde
   ===================================================================== */
.pagination {
    --bs-pagination-color:              var(--arena-green-700);
    --bs-pagination-bg:                 transparent;
    --bs-pagination-hover-color:        var(--arena-green-600);
    --bs-pagination-hover-bg:           var(--arena-tint);
    --bs-pagination-hover-border-color: rgba(var(--arena-green-rgb), .35);
    --bs-pagination-focus-color:        var(--arena-green-700);
    --bs-pagination-focus-bg:           var(--arena-tint);
    --bs-pagination-focus-box-shadow:   0 0 0 .2rem rgba(var(--arena-green-rgb), .25);
    --bs-pagination-active-color:       #fff;
    --bs-pagination-active-bg:          var(--arena-green);
    --bs-pagination-active-border-color: var(--arena-green);
}

/* garante o verde mesmo se algum estilo antigo fixar o azul */
.pagination .page-item.active .page-link,
.pagination .page-item.active > .page-link {
    background-color: var(--arena-green) !important;
    border-color: var(--arena-green) !important;
    color: #fff !important;
}

.pagination .page-link {
    color: var(--arena-green-700);
}

.pagination .page-link:hover {
    color: var(--arena-green-600);
}

/* =====================================================================
   FORMULÁRIOS — foco verde
   ===================================================================== */
.form-control:focus,
.form-select:focus,
.select2-container--focus .select2-selection,
.tfield:focus {
    border-color: var(--arena-green) !important;
    box-shadow: 0 0 0 .2rem rgba(var(--arena-green-rgb), .22) !important;
}

.form-check-input:checked {
    background-color: var(--arena-green);
    border-color: var(--arena-green);
}

.form-switch .form-check-input:checked {
    background-color: var(--arena-green);
    border-color: var(--arena-green);
}

/* título do formulário de busca — respeita o tema (claro/escuro) */
[data-bs-theme=light] .card .card-header,
[data-bs-theme=light] .panel-group .panel-heading {
    color: var(--arena-ink);
}
[data-bs-theme=dark] .card .card-header,
[data-bs-theme=dark] .panel-group .panel-heading {
    color: var(--bs-emphasis-color, #f8f9fa);
}

/* =====================================================================
   LABELS / BADGES  (mantém verde do logo para "sucesso/ativo")
   ===================================================================== */
.bg-green,
.label-success,
.alert-success {
    background-color: var(--arena-green) !important;
}

.text-primary {
    color: var(--arena-green-700) !important;
}

.badge.bg-primary,
.label-primary {
    background-color: var(--arena-green) !important;
}

/* =====================================================================
   BREADCRUMB
   ===================================================================== */
.breadcrumb {
    background: transparent;
    padding-left: 2px;
}

.breadcrumb a {
    color: var(--arena-green-700);
    font-weight: 600;
}

/* =====================================================================
   LOGIN — fundo com a marca
   ===================================================================== */
body .wrapper .main {
    /* o gradiente só aparece na tela de login (sem sidebar) */
}

/* card de login mais polido */
.login-box,
.login-content,
#adianti_div_content .card {
    border-radius: 16px;
}

/* =====================================================================
   BARRA DE ROLAGEM GLOBAL (webkit)
   ===================================================================== */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
::-webkit-scrollbar-thumb {
    background: rgba(var(--arena-green-rgb), .45);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--arena-green-rgb), .7);
}

/* =====================================================================
   AJUSTES DARK MODE
   ===================================================================== */
[data-bs-theme=dark] .card-header::before,
[data-bs-theme=dark] .panel-heading::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 22px;
    border-radius: 0 4px 4px 0;
    background: var(--arena-green);
}

[data-bs-theme=dark] .table thead th {
    background: rgba(var(--arena-green-rgb), .12);
    color: var(--arena-green-300);
    border-bottom: 2px solid rgba(var(--arena-green-rgb), .40) !important;
}

[data-bs-theme=dark] .tdatagrid_body tr:hover td,
[data-bs-theme=dark] .table tbody tr:hover td {
    background: rgba(var(--arena-green-rgb), .10) !important;
}

/* =====================================================================
   DATATABLES  (listagens com datatable='true')
   O CSS do DataTables fixa fundos claros (#f5f5f5 no hover, #f9f9f9 nas
   linhas ímpares) ignorando o modo escuro — por isso a linha ficava
   branca com o texto invisível. Aqui neutralizamos e usamos o verde.
   ===================================================================== */

/* ---- MODO ESCURO ---- */
[data-bs-theme=dark] table.dataTable tbody tr,
[data-bs-theme=dark] table.dataTable tbody tr > *,
[data-bs-theme=dark] table.dataTable.display tbody tr,
[data-bs-theme=dark] table.dataTable.display tbody tr > * {
    background-color: transparent !important;
    color: var(--bs-body-color) !important;
}

[data-bs-theme=dark] table.dataTable tbody tr.odd > *,
[data-bs-theme=dark] table.dataTable.display tbody tr.odd > *,
[data-bs-theme=dark] table.dataTable.stripe tbody tr.odd > * {
    background-color: rgba(255, 255, 255, .035) !important;
}

[data-bs-theme=dark] table.dataTable.hover tbody tr:hover,
[data-bs-theme=dark] table.dataTable.hover tbody tr:hover > *,
[data-bs-theme=dark] table.dataTable.display tbody tr:hover,
[data-bs-theme=dark] table.dataTable.display tbody tr:hover > *,
[data-bs-theme=dark] table.dataTable tbody tr:hover,
[data-bs-theme=dark] table.dataTable tbody tr:hover > * {
    background-color: rgba(var(--arena-green-rgb), .18) !important;
    color: #ffffff !important;
}

/* ---- MODO CLARO ---- */
[data-bs-theme=light] table.dataTable.hover tbody tr:hover,
[data-bs-theme=light] table.dataTable.hover tbody tr:hover > *,
[data-bs-theme=light] table.dataTable.display tbody tr:hover,
[data-bs-theme=light] table.dataTable.display tbody tr:hover > *,
[data-bs-theme=light] table.dataTable tbody tr:hover,
[data-bs-theme=light] table.dataTable tbody tr:hover > * {
    background-color: var(--arena-tint) !important;
    color: var(--arena-ink) !important;
}

/* ---- Linha selecionada (ambos os modos) em verde, não azul ---- */
table.dataTable tbody tr.selected,
table.dataTable tbody tr.selected > *,
table.dataTable tbody tr:hover.selected,
table.dataTable tbody tr:hover.selected > * {
    background-color: rgba(var(--arena-green-rgb), .28) !important;
}