/* Padrao das tabelas do Bootstrap (.table e .tabela): so linha divisoria embaixo de cada linha, sem linhas verticais,
   cabecalho um tom acima do corpo e nenhuma linha "mais escura". As listas do painel (.wh-tabela e variantes) ja tem
   o proprio padrao no modo-escuro.css e nao sao alteradas. Carregado por ultimo nos cabecalhos. */
table.table:not(.wh-tabela):not(.table-bordered), table.tabela:not(.wh-tabela):not(.table-bordered) {
    --bs-table-bg: transparent; --bs-table-accent-bg: transparent; --bs-table-striped-bg: transparent; --bs-table-active-bg: transparent;
    --bs-table-hover-bg: rgba(37, 99, 235, .05); --bs-table-border-color: #e5eaf1;
    border-collapse: collapse; border: 0; margin-bottom: 0;
}
:is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) > :not(caption) > * > * {
    background-color: transparent; box-shadow: none; border-width: 0 0 1px 0; border-style: solid; border-color: #e5eaf1; padding: .62rem .8rem; vertical-align: middle;
}
:is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) > thead > tr > th {
    background-color: #f6f8fb; color: #64748b; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; border-bottom-color: #dfe5ee;
}
:is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) > tbody > tr:last-child > * { border-bottom-width: 0; }
:is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) > tbody > tr:hover > * { background-color: rgba(37, 99, 235, .05); }

/* modo escuro: mesmo separador discreto das listas do painel, sem o fundo mais escuro nas linhas */
html[data-modo="escuro"] :is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) { --bs-table-hover-bg: rgba(77, 155, 255, .10); --bs-table-border-color: rgba(120, 150, 210, .16); }
html[data-modo="escuro"] :is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) > :not(caption) > * > * {
    background-color: transparent !important; box-shadow: none !important; border-width: 0 0 1px 0 !important; border-color: rgba(120, 150, 210, .16) !important; color: var(--d-tx);
}
html[data-modo="escuro"] :is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) > thead > tr > th {
    background-color: var(--d-s2) !important; color: var(--d-mut) !important; border-bottom-color: var(--d-borda) !important;
}
html[data-modo="escuro"] :is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) > tbody > tr:nth-child(even) > * { background-color: rgba(255, 255, 255, .025) !important; }
html[data-modo="escuro"] :is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) > tbody > tr:hover > * { background-color: rgba(77, 155, 255, .10) !important; }
html[data-modo="escuro"] :is(table.table, table.tabela):not(.wh-tabela):not(.table-bordered) > tbody > tr:last-child > * { border-bottom-width: 0 !important; }

/* tabelas com grade (.table-bordered): continuam com borda em volta de cada celula, so que na mesma cor suave das outras */
table.table-bordered:not(.wh-tabela) { border-color: #e5eaf1; --bs-table-border-color: #e5eaf1; }
table.table-bordered:not(.wh-tabela) > :not(caption) > * > * { border-color: #e5eaf1; box-shadow: none; }
table.table-bordered:not(.wh-tabela) > thead > tr > th { background-color: #f6f8fb; color: #64748b; }
html[data-modo="escuro"] table.table-bordered:not(.wh-tabela) { border-color: rgba(120, 150, 210, .22); --bs-table-border-color: rgba(120, 150, 210, .22); }
html[data-modo="escuro"] table.table-bordered:not(.wh-tabela) > :not(caption) > * > * { border-color: rgba(120, 150, 210, .22) !important; box-shadow: none !important; background-color: transparent; }
html[data-modo="escuro"] table.table-bordered:not(.wh-tabela) > thead > tr > th { background-color: var(--d-s2) !important; color: var(--d-mut) !important; }

/* paineis da area do cliente (Faturas, Servicos, Tickets...): a linha embaixo do titulo tem a mesma cor em todos.
   No modo escuro cada painel usava a cor do proprio titulo (azul, verde, laranja), que fica forte contra o fundo escuro. */
html[data-modo="escuro"] .painel > .ph, html[data-modo="escuro"] .painel.azul > .ph, html[data-modo="escuro"] .painel.verde > .ph,
html[data-modo="escuro"] .painel.laranja > .ph, html[data-modo="escuro"] .painel.cinza > .ph { border-color: var(--d-borda) !important; }