body {
  background-color: rgba(0,0,0,0.8);
  color: #fff; /* texto claro para contraste */
}

a {
  color: #4da6ff; /* links mais visíveis no fundo escuro */
}

input, select, textarea {
  background-color: rgba(255,255,255,0.1);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.3);
}

button {
  background-color: green;
  color: white;
}

table {
  background-color: rgba(255,255,255,0.05);
  color: white;
}

th, td {
  border-color: rgba(255,255,255,0.2);
}

/* ===== AllTomatics • Dark base ===== */
:root{
  --bg:           rgba(0,0,0,0.8);
  --fg:           #e9eef3;
  --muted:        #b8c2cc;
  --link:         #69b3ff;
  --panel-bg:     rgba(255,255,255,0.06);
  --panel-brd:    rgba(255,255,255,0.18);
  --panel-hdr:    rgba(255,255,255,0.10);
  --input-bg:     rgba(255,255,255,0.10);
  --input-brd:    rgba(255,255,255,0.28);
  --input-focus:  #7ec8ff;
  --table-stripe: rgba(255,255,255,0.04);
  --warn-bg:      rgba(255,235,59,0.12);
  --warn-brd:     rgba(255,235,59,0.45);
  --warn-fg:      #ffe082;
}

html, body{
  background: var(--bg) !important;
  color: var(--fg) !important;
}

/* Links visíveis */
a{ color: var(--link); }
a:hover{ filter: brightness(1.15); }

/* Caixas/painéis (substitui #fafafa do inline) */
.caixa{
  background: var(--panel-bg) !important;
  border: 1px solid var(--panel-brd) !important;
  border-radius: 10px;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.15) inset;
}

/* Alerta do topo */
.alerta{
  background: var(--warn-bg) !important;
  border: 1px solid var(--warn-brd) !important;
  color: var(--warn-fg) !important;
  border-radius: 10px;
}

/* Inputs e selects legíveis */
input, select, textarea{
  background: var(--input-bg) !important;
  color: var(--fg) !important;
  border: 1px solid var(--input-brd) !important;
  border-radius: 8px;
}
input::placeholder, textarea::placeholder{ color: var(--muted); }
input:focus, select:focus, textarea:focus{
  outline: 2px solid var(--input-focus);
  outline-offset: 1px;
}

/* Botões (mantém seus verdes) */
button, .botao{
  color: #fff !important;
}

/* Tabelas com contraste */
table{ width: 100%; border-collapse: collapse; color: var(--fg); }
th, td{ border: 1px solid var(--panel-brd); padding: 6px 8px; }
th{ background: var(--panel-hdr); position: sticky; top: 0; }
tbody tr:nth-child(odd){ background: var(--table-stripe); }

/* Barras divisórias escuras */
hr{ border: 0; height: 1px; background: var(--panel-brd); }

/* Se o seu rodapé usa #RodapeBarraFundo, garante contraste */
#RodapeBarraFundo{ background: rgba(20,20,40,0.9) !important; }

/* tabela do histórico (scroll com cabeçalho colado) */
.histTable{ max-height:60vh; overflow:auto; border:1px solid var(--panel-brd); border-radius:10px; }
.histTable table{ width:100%; border-collapse:collapse; color:var(--fg); }
.histTable thead th{
  position: sticky; top: 0; z-index:3;
  background: var(--panel-hdr); border-bottom:1px solid var(--panel-brd);
  padding:6px 8px; white-space:nowrap;
}
.histTable tbody td{ border-top:1px solid var(--panel-brd); padding:0 }
.histTable tbody td .cell{
  width:100%; padding:6px 8px;
  background: transparent; color: var(--fg);
  border: 0; outline: 0; text-align: right; /* ➜ valores à direita */
  font: inherit;
}
.histTable tbody td .cell::placeholder{ color: var(--muted); }

/* linha que separa mudança de mês (opcional) */
.mes-split-row td{ padding:0; border-top:0 }
.mes-split{ height:2px; background: var(--panel-brd); }

/* tira o header “grudado” geral: queremos o sticky só da tabela */
.sticky{ position: static !important; }

/* ==== TABELA (sticky head) ==== */
.histTable{ max-height:60vh; overflow:auto; border:1px solid var(--panel-brd); border-radius:10px; }
.histTable table{ width:100%; border-collapse:collapse; color:var(--fg); }
.histTable thead th{
  position: sticky; top: 0; z-index: 3;
  background: var(--panel-hdr); border-bottom:1px solid var(--panel-brd);
  padding:6px 8px; white-space:nowrap;
}
.histTable tbody td{ border-top:1px solid var(--panel-brd); padding:0 }
.histTable tbody td .cell{
  width:100%; padding:6px 8px;
  background: transparent; color: var(--fg);
  border: 0; outline: 0; text-align: right; font: inherit;
}
.mes-split-row td{ padding:0; border-top:0 }
.mes-split{ height:2px; background: var(--panel-brd); }

/* header da página NÃO sticky (deixe só o thead) */
.sticky{ position: static !important; }

/* ==== MODAL “Adicionar dia” ==== */
.modalMask{
  position: fixed; inset: 0; background: rgba(0,0,0,0.6);
  display: none; align-items: center; justify-content: center; z-index: 9999;
}
.modalBox{
  width: min(900px, 96vw); max-height: 80vh; overflow: auto;
  background: var(--panel-bg); border:1px solid var(--panel-brd);
  border-radius: 12px; padding: 12px;
}
.modalHead{ display:flex; justify-content: space-between; align-items:center; gap:8px; margin-bottom:8px }
.gridEmp{
  display: grid; grid-template-columns: 1fr 140px; gap: 6px; align-items:center;
}
.gridEmp input{ text-align: right; }
.modalFoot{ display:flex; gap:8px; justify-content:flex-end; margin-top:10px }

/* thead mais forte + sombra */
.histTable thead th{
  position: sticky; top: 0; z-index: 3;
  background: linear-gradient(180deg, rgba(255,255,255,0.14), rgba(255,255,255,0.08));
  border-bottom:1px solid var(--panel-brd);
  padding:8px 10px; white-space:nowrap;
  box-shadow: 0 2px 0 rgba(0,0,0,0.25);
}
.histTable{ max-height:60vh; overflow:auto; border:1px solid var(--panel-brd); border-radius:10px; }
.histTable table{ width:100%; border-collapse:collapse; table-layout: fixed; } /* evita “subir em cima” */
.histTable tbody td{ border-top:1px solid var(--panel-brd); padding:0 }
.histTable tbody td .cell{
  width:100%; padding:8px 10px; box-sizing: border-box;
  background: transparent; color: var(--fg);
  border: 0; outline: 0; text-align: right; font: inherit;
}
.histTable tbody td .cell::placeholder{ color: var(--muted); }
.mes-split-row td{ padding:0; border-top:0 }
.mes-split{ height:2px; background: var(--panel-brd); }

/* modal: inputs com espaçamento fixo */
.gridEmp{
  display: grid; grid-template-columns: 1fr 160px; gap: 8px 10px; align-items:center;
}
.gridEmp input{ text-align: right; padding:8px 10px; box-sizing:border-box; }

/* header geral sem sticky (o sticky é só o thead) */
.sticky{ position: static !important; }

th {
  background-color: rgba(255, 255, 255, 0.1);
}
td.sticky-data {
  background-color: rgba(255, 255, 255, 0.1);
}
/* legenda clicável */
.legend span { cursor: pointer; user-select: none; }
.legend span.off { opacity: .35; text-decoration: line-through; }

/* coluna da empresa desativada (só para despoluir visual) */
th.off { opacity:.35; }
td.col-off .cell { opacity:.25; }

/* melhora contraste das colunas sticky (continua com fundo) */
.histTable thead th.stk1,
.histTable tbody td.stk1,
.histTable thead th.stk2,
.histTable tbody td.stk2{
  background: rgba(255,255,255,0.18);
  backdrop-filter: blur(2px);
}

/* tooltip do gráfico */
#chartTip{
  position: fixed;
  z-index: 99999;
  pointer-events: none;
  background: rgba(0,0,0,0.85);
  color: #fff;
  font-size: 12px;
  padding: 6px 8px;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 6px;
  transform: translate(10px, -40%);
  white-space: nowrap;
  display: none;
}
#chartTip b{ color:#fff }
#chartTip .muted{ color:rgba(255,255,255,0.7) }