/* static/css/style.css */

/* --- Variáveis de Cor --- */
:root {
  /* Paleta Principal Escura */
  --bg-dark-primary: #1a1d1a;
  --bg-dark-secondary: #282c28;
  --bg-dark-tertiary: #3a403a;
  --text-light-primary: #d8e0d8;
  --text-light-secondary: #9aa89a;


  /* Cores de Destaque (Verde) */
  --primary-accent: #4caf50;
  --primary-accent-darker: #388e3c;
  --primary-accent-rgb: 76, 175, 80;


  /* Cores Semânticas */
  --success-color: var(--primary-accent); /* Verde para sucesso */
  --danger-color: #f44336; /* Vermelho para perigo/erro. RGB: 244, 67, 54 */
  --warning-color: #ffc107; /* Amarelo para aviso. RGB: 255, 193, 7 */
  --info-color: #0dcaf0; /* Azul claro Bootstrap para informação (alternativa ao verde) */
  --white-color: #ffffff;
  --purple-color: #6f42c1; /* Roxo (para submissões). RGB: 111, 66, 193 */
  --orange-color: #fd7e14; /* Laranja (para cliques). RGB: 253, 126, 20 */


  /* Tipografia e Espaçamento */
  --font-family-sans-serif: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --base-font-size: 0.9rem;
  --line-height-base: 1.5;
  --border-radius-std: 8px;
  --transition-smooth: all 0.25s ease-in-out;

  /* Cores para Badges de Score no Dashboard */
  --score-low-bg: rgba(var(--primary-accent-rgb), 0.15);
  --score-low-text: #81c784;
  --score-medium-bg: rgba(255, 193, 7, 0.15); /* warning-color */
  --score-medium-text: #ffc107;
  --score-high-bg: rgba(244, 67, 54, 0.15); /* danger-color */
  --score-high-text: #e57373;
}

.bg-info {
  background-color: #46c554 !important;
  color: #0d1a0e !important;
}

/* --- Estilos Globais --- */
body {
  background-color: var(--bg-dark-primary);
  color: var(--text-light-primary);
  font-family: var(--font-family-sans-serif);
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  font-size: 0.75rem;
  line-height: var(--line-height-base);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
  color: var(--white-color) !important;
  margin-bottom: 1rem;
}
h1 { font-size: 1.3rem; }
h2 { font-size: 1.3rem; }
h3 { font-size: 1.3rem; }
h4 { font-size: 1.1rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.9rem; }

a { color: var(--primary-accent); text-decoration: none; transition: color 0.2s ease; }
a:hover { color: var(--primary-accent-darker); text-decoration: none; }

/* --- Layout Principal --- */
.page-wrapper { display: flex; width: 100%; flex-grow: 1; }

/* --- Sidebar --- */
.sidebar {
  width: 260px; background-color: var(--bg-dark-secondary); color: var(--text-light-primary);
  height: 100vh; position: fixed; top: 0; left: 0; display: flex; flex-direction: column;
  padding-top: 0; border-right: none; box-shadow: 5px 0px 15px rgba(0, 0, 0, 0.2);
  overflow-y: auto; transition: width 0.3s ease; z-index: 1000;
}
.sidebar-header {
  padding: 1rem 2.7rem; margin-bottom: 1rem; text-align: left;
  background-color: rgba(0,0,0,0.1);
}
.sidebar-header h3 { color: var(--white-color); margin: 0; font-weight: 700; font-size: 1.3rem; }
.sidebar-header h3 i { color: var(--primary-accent); }
.sidebar .nav-link {
  color: var(--text-light-secondary); padding: 0.4rem 1.4rem; font-size: 0.85rem;
  font-weight: 500; border-left: none;
  border-radius: 0 var(--border-radius-std) var(--border-radius-std) 0;
  margin: 0.2rem 0.5rem 0.2rem 0; transition: var(--transition-smooth);
  display: flex; align-items: center; gap: 0.9rem; position: relative;
}
.sidebar .nav-link i.fas { width: 20px; text-align: center; font-size: 1rem; }
.sidebar .nav-link:hover {
  color: var(--white-color); background-color: var(--bg-dark-tertiary);
  transform: translateX(5px);
}
.sidebar .nav-link.active {
  color: var(--primary-accent); font-weight: 600;
  background-color: rgba(var(--primary-accent-rgb), 0.1);
}
.sidebar .nav-link.active::before {
    content: ''; position: absolute; left: 10px; top: 50%;
    transform: translateY(-50%); width: 4px; height: 60%;
    background-color: var(--primary-accent); border-radius: 2px;
}
.sidebar .nav { flex-grow: 1; padding-bottom: 1rem; }
.sidebar .nav-item.mt-auto { margin-top: auto; border-top: 1px solid rgba(255,255,255,0.05); padding-top: 0.5rem; }
.sidebar .nav-item.mt-auto .nav-link:hover {
  background-color: rgba(244, 67, 54, 0.1); /* Usa valor de --danger-color */
  color: var(--danger-color);
  transform: translateX(5px);
 }


/* --- Conteúdo Principal --- */
.main-content {
  flex-grow: 1; padding: 2rem 3rem; margin-left: 260px;
  background-color: var(--bg-dark-primary); width: calc(100% - 260px);
  overflow-y: auto; transition: margin-left 0.3s ease, width 0.3s ease;
}
.main-content.full-width { margin-left: 0; width: 100%; } /* Para página de login */

/* --- Cards (Estilo Flat Genérico) --- */
.card {
  background-color: var(--bg-dark-secondary);
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: none;
  border-radius: var(--border-radius-std);
  margin-bottom: 1.5rem;
  overflow: hidden;
  transition: var(--transition-smooth);
}
.card:hover { transform: none; box-shadow: none; }
.card-header {
  background: #282c28 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  color: var(--text-light-primary); font-weight: 600; font-size: 0.8rem;
  padding: 0.8rem 1.2rem;
}
.card-header .badge { font-size: 0.6rem; }
.card-body { padding: 1.2rem; }
.card-footer {
  background-color: transparent; border-top: 1px solid rgba(255, 255, 255, 0.07);
  padding: 0.8rem 1.2rem; color: var(--text-light-secondary); font-size: 0.8rem;
}
.card .card-title.text-muted {
  color: #818d81 !important; font-size: 0.8rem; font-weight: 500;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.card .card-text.display-6 { font-size: 1.8rem; font-weight: 700; color: var(--white-color); }
.card .small.text-muted { color: var(--text-light-secondary) !important; font-size: 0.75rem; }
.card .display-6 + .small { margin-top: -5px; display: block;}

/* --- Gráficos --- */
.chart-container-line { position: relative; width: 100%; height: 320px; }
.chart-container-doughnut { position: relative; width: 100%; height: 200px; max-width: 240px; margin: auto; }
.chart-container-small { width: 90px; height: 90px; margin: auto; margin-top: 0.5rem; }
.chart-container-small canvas { max-width: 100%; max-height: 100%; }

/* --- Tabelas --- */
.table-responsive {
    overflow-x: auto; background-color: transparent; border-radius: 0;
    box-shadow: none; margin-top: 0; -webkit-overflow-scrolling: touch;
}
.card-body.p-0 > .table-responsive {
    padding-left: 0; padding-right: 0; border-radius: 0; box-shadow: none;
    background-color: transparent; overflow-x: auto !important;
}
.table {
    background-color: transparent; color: var(--text-light-primary);
    border-collapse: collapse; border: none; width: 100%; margin-bottom: 0;
}
.table th {
  color: var(--primary-accent); font-weight: 600; font-size: 0.75rem;
  padding: 0.6rem 1rem; vertical-align: middle; text-transform: uppercase;
  letter-spacing: 0.8px; white-space: nowrap;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom-width: 2px; text-align: left;
}
.table td {
  color: var(--text-light-primary); padding: 0.6rem 1rem; font-size: 0.75rem;
  vertical-align: middle; border: 1px solid rgba(255, 255, 255, 0.07);
}
.table th:last-child, .table td:last-child { border-right: none; }
.table tbody tr:last-child td { border-bottom: none; }
.table td .btn i.fas { font-size: 0.75rem; vertical-align: middle; }
.table > :not(caption) > * > * { background-color: transparent !important; }
.table-hover > tbody > tr:hover > * { background-color: var(--bg-dark-tertiary); color: var(--white-color); }
.table td .badge { font-size: 0.7rem; padding: 0.3em 0.5em; font-weight: 600; }
.table th.text-center, .table td.text-center { text-align: center !important; }
.table td.text-muted { color: var(--text-light-secondary) !important; }

/* --- Estilos para Ícones de Ação nas Tabelas de Relatório --- */
.table td .action-icon.fa-check-circle,
.interactions-table td .action-icon.fa-check-circle,
.table td .fas.fa-check-circle, /* Fallback se .action-icon não estiver presente */
.interactions-table td .fas.fa-check-circle {
    color: var(--success-color) !important; /* VERDE */
}
.table td .action-icon.fa-times-circle,
.interactions-table td .action-icon.fa-times-circle,
.table td .fas.fa-times-circle, /* Fallback */
.interactions-table td .fas.fa-times-circle {
    color: var(--danger-color) !important; /* VERMELHO */
}


/* --- Formulários --- */
.form-label, .form-check-label {
  color: var(--text-light-secondary) !important;
  font-weight: 500; margin-bottom: 0.4rem; font-size: 0.8rem;
}
.form-control, .form-select {
  background-color: var(--bg-dark-primary) !important;
  color: var(--text-light-primary) !important;
  border: 1px solid var(--bg-dark-tertiary) !important;
  padding: 0.2
rem 1rem; border-radius: var(--border-radius-std);
  box-shadow: none; transition: var(--transition-smooth); font-size: 0.85rem;
}
.form-control:focus, .form-select:focus {
  border-color: var(--primary-accent) !important;
  box-shadow: 0 0 0 2px rgba(var(--primary-accent-rgb), 0.25) !important;
  outline: none;
}
.form-control::placeholder { color: var(--text-light-secondary); opacity: 0.6; }
.form-text { color: var(--text-light-secondary); font-size: 0.75rem; }

/* --- Botões --- */
.btn {
  background-color: var(--primary-accent); color: #FFFFFF;
  border: 1px solid transparent; border-radius: var(--border-radius-std);
  padding: 0.2rem 0.6rem; font-weight: 500; font-size: 0.75rem;
  box-shadow: none; transition: var(--transition-smooth); cursor: pointer;
}
.btn:hover {
  background-color: var(--primary-accent); color: var(--white-color);
  transform: none; box-shadow: none;
}
.btn:active, .btn.active {
  background-color: var(--primary-accent-darker); color: var(--white-color);
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.2); transform: translateY(1px);
}
.btn:focus, .btn.focus {
    outline: none; box-shadow: 0 0 0 3px rgba(var(--primary-accent-rgb), 0.4);
}
.btn-primary, .btn-success, .btn-info { background-color: var(--primary-accent); color: var(--white-color); }
.btn-primary:hover, .btn-success:hover, .btn-info:hover { background-color: var(--primary-accent-darker); color: var(--white-color); filter: brightness(110%); }
.btn-danger { background-color: var(--danger-color); color: var(--white-color); }
.btn-danger:hover { background-color: #d32f2f; color: var(--white-color); filter: brightness(110%); }
.btn-outline-primary, .btn-outline-success, .btn-outline-info { background-color: var(--primary-accent); box-shadow: none;
}
.btn-outline-primary:hover, .btn-outline-success:hover, .btn-outline-info:hover {
  background-color: rgba(var(--primary-accent-rgb), 0.1); color: var(--white-color) !important;
  box-shadow: none; transform: none;
}
.btn-outline-secondary { border-color: var(--text-light-secondary); color: #FFFFFF; background-color: var(--primary-accent); box-shadow: none; }
.btn-outline-secondary:hover { background-color: rgba(154, 168, 154, 0.1); color: var(--text-light-primary); box-shadow: none; transform: none;}
.btn-outline-danger { border-color: var(--danger-color); color: #dee2e6; box-shadow: none; }
.btn-outline-danger:hover { background-color: rgba(244, 67, 54, 0.15); color: var(--danger-color); box-shadow: none; transform: none;}
.btn-sm {  padding: 0.2rem 0.5rem; font-size: 0.7rem; }
.btn-lg { padding: 0.8rem 1.5rem; font-size: 1rem; }
.btn-outline-primary.border-0:hover, .btn-outline-success.border-0:hover, .btn-outline-info.border-0:hover {
    background-color: rgba(var(--primary-accent-rgb), 0.15); color: var(--primary-accent); box-shadow: none;
}
.btn-outline-danger.border-0:hover { background-color: rgba(244, 67, 54, 0.15); color: var(--danger-color); box-shadow: none; }
.btn-outline-secondary.border-0:hover { background-color: rgba(154, 168, 154, 0.15); color: var(--text-light-primary); box-shadow: none; }

/* --- Alertas --- */
.alert {
  border: none; border-left: 4px solid; border-radius: var(--border-radius-std);
  color: var(--text-light-primary); padding: 0.8rem 1.2rem; font-size: 0.85rem;
  margin-bottom: 1.2rem; background-color: var(--bg-dark-tertiary); box-shadow: none;
  position: relative; overflow: hidden;
}
.alert::before { content: none; }
.alert-success { border-left-color: var(--success-color); background-color: rgba(var(--primary-accent-rgb), 0.1); }
.alert-info    { border-left-color: var(--info-color);    background-color: rgba(var(--primary-accent-rgb), 0.1); } /* Usando primary-accent como info */
.alert-danger  { border-left-color: var(--danger-color);  background-color: rgba(244, 67, 54, 0.1); }
.alert-warning { border-left-color: var(--warning-color); background-color: rgba(255, 193, 7, 0.1); color: #ffe082; }
.alert .btn-close { filter: none; background: none; opacity: 0.7; font-size: 1rem; color: var(--text-light-primary); }
.alert .btn-close:hover { opacity: 1; color: var(--white-color); }

/* --- Footer --- */
footer {
  color: var(--text-light-secondary) !important; font-size: 0.75rem;
  border-color: rgba(255, 255, 255, 0.07) !important;
  background-color: var(--bg-dark-primary);
  padding-top: 1rem; padding-bottom: 1rem; margin-top: auto;
}
footer p.text-muted { color: var(--text-light-secondary) !important; }

/* --- Ajustes para TinyMCE --- */
.tox .tox-edit-area__iframe { background-color: var(--bg-dark-primary) !important; }
.tox .tox-editor-header { background-color: var(--bg-dark-secondary) !important; border-bottom-color: rgba(255,255,255,0.1) !important;}
.tox .tox-toolbar, .tox .tox-toolbar__primary, .tox .tox-toolbar__overflow { background-color: var(--bg-dark-secondary) !important; }
.tox .tox-tbtn, .tox .tox-mbtn { color: var(--text-light-secondary) !important; background-color: transparent !important; }
.tox .tox-tbtn:hover, .tox .tox-mbtn:hover { background-color: var(--bg-dark-tertiary) !important; color: var(--white-color) !important; }
.tox .tox-tbtn--enabled, .tox .tox-tbtn--active { background-color: var(--bg-dark-tertiary) !important; color: var(--primary-accent) !important; }
.tox .tox-statusbar { background-color: var(--bg-dark-secondary) !important; border-top-color: rgba(255,255,255,0.1) !important; color: var(--text-light-secondary) !important; }

/* --- Estilos Específicos do Dashboard --- */
.dashboard-header {
  background-color: var(--bg-dark-secondary); padding: 1rem 1.5rem;
  border-radius: var(--border-radius-std); /* margin-bottom controlado por classe Bootstrap no HTML */
  box-shadow: 0 2px 5px rgba(0,0,0, 0.2); border-left: 5px solid var(--primary-accent);
}
.dashboard-header h1 { color: var(--white-color); font-size: 1.6rem; margin: 0 0 0.2rem 0; font-weight: 600; }
.dashboard-header h1 i { color: var(--primary-accent); margin-right: 0.7rem; }
.dashboard-header p { color: var(--text-light-secondary); margin: 0; font-size: 0.75rem; }
.dashboard-header .last-updated { margin-top: 0.8rem; font-size: 0.75rem; color: #70e775; text-align: right; }
.dashboard-main { flex-grow: 1; }

/* Summary Cards (Base e Hover) para Dashboard e Relatório */
.summary-card {
    background-color: #372639;
    border-radius: var(--border-radius-std);
    box-shadow: none;
    border: 1px solid rgba(255, 255, 255, 0.07);
    text-align: center;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
    display: flex; flex-direction: column;
    justify-content: center; align-items: center;
    padding: 1rem; overflow: hidden;
}
.summary-card:hover {
    background-color: var(--bg-dark-tertiary) !important;
    border-color: var(--primary-accent) !important;
    transform: translateY(-3px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
.summary-card h2 {
    font-size: 0.7rem; color: var(--text-light-secondary);
    margin: 0 0 0.4rem 0; font-weight: 500; text-transform: uppercase;
    letter-spacing: 0.5px; line-height: 1.2;
}
/* Cores de fundo e borda específicas para cards (usadas no Dashboard e no Relatório via HTML) */
.summary-card.card-delivered { background-color: rgba(var(--primary-accent-rgb), 0.05); border-color: rgba(var(--primary-accent-rgb), 0.1); }
.summary-card.card-failed    { background-color: rgba(244, 67, 54, 0.05); border-color: rgba(244, 67, 54, 0.2); }
.summary-card.card-open      { background-color: rgba(var(--primary-accent-rgb), 0.08); border-color: rgba(var(--primary-accent-rgb), 0.25); }
.summary-card.card-click     { background-color: rgba(253, 126, 20, 0.1); border-color: rgba(253, 126, 20, 0.3); } /* Laranja */
.summary-card.card-download  { background-color: rgba(220, 53, 69, 0.1); border-color: rgba(220, 53, 69, 0.3); } /* Vermelho */
.summary-card.card-submission{ background-color: rgba(111, 66, 193, 0.1); border-color: rgba(111, 66, 193, 0.3); } /* Roxo */
.summary-card.card-submission h2 { color: var(--purple-color); } /* Título roxo para submissão */


/* Estilos para cards na página de RELATÓRIO (report.html) */
.summary-card.report-card {
    min-height: 170px; justify-content: space-between;
    /* A borda e o hover padrão de .summary-card já se aplicam. */
}
.summary-card.report-card .card-content h2 { font-size: 0.8rem; margin-bottom: 0.5rem;}
.summary-card.report-card .card-content p { font-size: 1.5rem; margin-bottom: 0.2rem;} /* Taxa % */
.summary-card.report-card .card-content small { font-size: 0.75rem; display: block; margin-bottom: 0.5rem; } /* Contagem */
/* Cores para os TEXTOS das taxas (%) nos cards do RELATÓRIO */
.summary-card.report-card.card-open .card-content p { color: var(--primary-accent); }
.summary-card.report-card.card-click .card-content p { color: var(--orange-color); }
.summary-card.report-card.card-download .card-content p { color: var(--danger-color); }
.summary-card.report-card.card-submitted .card-content p { color: var(--purple-color); }


/* Estilos da Tabela do Dashboard */
.dashboard-table { width: 100%; border-collapse: collapse; background-color: transparent; }
.dashboard-table th, .dashboard-table td {
    padding: 0.7rem 1rem; text-align: left;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 0.75rem; vertical-align: middle;
}
.dashboard-table th {
    color: var(--primary-accent); font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.5px; white-space: nowrap; background-color: rgba(0,0,0,0.1);
    border-bottom-width: 2px; border-top: none; border-left: none; border-right: none;
}
.dashboard-table tbody tr:last-child td { border-bottom: none; }
.dashboard-table tbody tr:hover { background-color: var(--bg-dark-tertiary); }
.dashboard-table td { color: var(--text-light-primary); border-left: none; border-right: none; }
.dashboard-table .text-center { text-align: center !important; }
.dashboard-table .rate-cell, .dashboard-table .score-cell { font-weight: 600; }
.dashboard-table .score-badge { display: inline-block; padding: 0.3rem 0.6rem; border-radius: 5px; font-size: 0.8rem; font-weight: 700; }
.dashboard-table .score-low    { background-color: var(--score-low-bg);    color: var(--score-low-text); }
.dashboard-table .score-medium { background-color: var(--score-medium-bg); color: var(--score-medium-text); }
.dashboard-table .score-high   { background-color: var(--score-high-bg);   color: var(--score-high-text); }
.loading-row td { color: var(--text-light-secondary); font-style: italic; padding: 2rem; text-align: center; }
.loading-row i { margin-right: 0.5rem; }
.details-link { color: var(--primary-accent); text-decoration: none; font-size: 1rem; transition: color 0.2s ease; }
.details-link:hover { color: var(--primary-accent-darker); }
.text-info { --bs-text-opacity: 1;     color: var(--primary-accent) !important; }


/* --- Responsividade --- */
@media (max-width: 1200px) { /* lg */
  .main-content { padding: 1.5rem 2rem; }
  .card-body { padding: 1rem; }
}
@media (max-width: 992px) { /* md */
  .main-content { margin-left: 0; width: 100%; padding: 1.5rem 1rem; }
  .sidebar { position: relative; width: 100%; height: auto; box-shadow: 0 5px 15px rgba(0,0,0,0.2); border-bottom: 1px solid rgba(255,255,255,0.05); }
  .page-wrapper { flex-direction: column; }
  .chart-container-doughnut { max-width: 180px; height: 160px; }
  h1 { font-size: 1.2rem; } h2 { font-size: 1.1rem; }
  .dashboard-header h1 { font-size: 1.4rem; }
}
@media (max-width: 768px) { /* sm */
    .summary-card .chart-container-small { width: 80px; height: 80px; }
    .summary-card h2 { font-size: 0.65rem; }
    .summary-card.report-card .card-content p { font-size: 1.3rem; }
    .summary-card.report-card .card-content small { font-size: 0.7rem; }
}
@media (max-width: 576px) { /* xs */
  .main-content { padding: 1rem 0.8rem; }
  .card { margin-bottom: 1rem; }
  .card-body { padding: 0.8rem; }
  .card-text.display-6 { font-size: 1.5rem; }
  .chart-container-doughnut { max-width: 150px; height: 150px; }
  .chart-container-line { height: 250px; }
  h1 { font-size: 1.1rem; }
  .btn { padding: 0.4rem 0.8rem; font-size: 0.8rem; }
  .form-control, .form-select { font-size: 0.8rem; padding: 0.5rem 0.8rem;}
  .sidebar .nav-link { padding: 0.7rem 1rem; gap: 0.6rem; }
  .sidebar-header { padding: 1rem; }
  .dashboard-header { padding: 0.8rem 1rem; border-left-width: 4px;}
  .dashboard-header h1 { font-size: 1.3rem; }
  .summary-card { min-height: auto; padding: 0.8rem; }
  .group-performance-section h2 { font-size: 1rem; }
  .table th, .table td { padding: 0.5rem; font-size: 0.7rem; }
  .dashboard-table th, .dashboard-table td { padding: 0.5rem; font-size: 0.7rem; }
  .dashboard-table .score-badge { font-size: 0.7rem; padding: 0.2rem 0.4rem;}
  .summary-card .chart-container-small { width: 60px; height: 60px; }
  .summary-card h2 { font-size: 0.55rem; line-height: 1.1; }
}

/* ============================================= */
/* --- Estilos Específicos para Modais Escuros --- */
/* ============================================= */
.modal-content {
  background-color: var(--bg-dark-secondary) !important;
  color: var(--text-light-primary) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.modal-header {
  background-color: var(--bg-dark-tertiary) !important;
  color: var(--white-color) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.modal-header .btn-close { filter: invert(1) grayscale(100%) brightness(200%) !important; }
.modal-body { color: var(--text-light-primary) !important; }
.modal-footer {
  background-color: var(--bg-dark-secondary) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}
.modal .form-control, .modal .form-select,
.modal .form-control-sm, .modal .form-select-sm {
  background-color: var(--bg-dark-primary) !important;
  color: var(--text-light-primary) !important;
  border-color: var(--bg-dark-tertiary) !important;
}
.modal .form-control::placeholder { color: var(--text-light-secondary) !important; opacity: 0.7 !important; }
.modal .form-check-input {
    background-color: var(--bg-dark-tertiary) !important; border-color: #555 !important;
}
.modal .form-check-input:checked { background-color: var(--primary-accent) !important; border-color: var(--primary-accent) !important; }
.modal .form-check-input:focus { box-shadow: 0 0 0 0.25rem rgba(var(--primary-accent-rgb), 0.25) !important; }
.modal fieldset { border-color: rgba(255, 255, 255, 0.2) !important; }
.modal fieldset legend { color: var(--text-light-secondary) !important; font-size: 0.9em; padding-left: 5px; padding-right: 5px; }
.modal #headersTable { color: var(--text-light-primary) !important; background-color: transparent !important; }
.modal #headersTable thead th {
    color: var(--primary-accent) !important; background-color: rgba(var(--primary-accent-rgb), 0.05) !important;
    font-size: 0.75em; font-weight: bold; text-transform: uppercase;
    border-color: rgba(255, 255, 255, 0.15) !important; padding-top: 0.4rem; padding-bottom: 0.4rem;
}
.modal #headersTable td {
    color: var(--text-light-primary) !important; border-color: rgba(255, 255, 255, 0.1) !important;
    font-size: 0.85em; padding-top: 0.4rem; padding-bottom: 0.4rem;
}
.modal #headersTable tbody tr:hover td { background-color: var(--bg-dark-tertiary) !important; color: var(--white-color) !important; }
.modal #headersTable .btn-outline-danger {
    color: var(--danger-color) !important; border-color: transparent !important;
    padding: 0.1rem 0.4rem; font-size: 0.9em;
}
.modal #headersTable .btn-outline-danger:hover { background-color: rgba(244, 67, 54, 0.15); }


/* ============================================= */
/* --- Estilos para DataTables (Paginação etc.) --- */
/* ============================================= */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 0.2rem 0.2rem; margin-left: 1px;
    border-radius: var(--border-radius-std); border: 1px solid var(--bg-dark-tertiary);
    background-color: var(--bg-dark-secondary); color: var(--text-light-secondary) !important;
    box-shadow: none; transition: var(--transition-smooth); text-decoration: none !important;
    font-size: 0.7rem; line-height: 0.6;
}
.pagination {
   --bs-pagination-font-size: 0.85rem !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background-color: var(--bg-dark-tertiary); border-color: var(--primary-accent);
    color: var(--primary-accent) !important; box-shadow: none;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background-color: var(--primary-accent) !important;     /* Fundo VERDE para o botão ATUAL */
    border-color: var(--primary-accent-darker) !important; /* Borda VERDE ESCURA */
    color: var(--white-color) !important;               /* Texto BRANCO */
    box-shadow: none;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    background-color: var(--bg-dark-secondary); border-color: var(--bg-dark-tertiary);
    color: var(--text-light-secondary) !important; opacity: 0.5; cursor: default; box-shadow: none;
}
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
    background-color: var(--bg-dark-primary) !important; color: var(--text-light-primary) !important;
    border: 1px solid var(--bg-dark-tertiary) !important; border-radius: var(--border-radius-std) !important;
    padding: 0.3rem 0.6rem !important; font-size: 0.8rem; height: auto;
}
.dataTables_wrapper .dataTables_length label,
.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_info {
    color: var(--text-light-secondary) !important; font-size: 0.8rem;
}

.active>.page-link, .page-link.active {
    z-index: 3;
    color: var(--bs-pagination-active-color);
    background-color: #198754;
    border-color: #198754;

}
.chart-container-line,
.chart-container-doughnut {
    display: flex;             /* Ativa o Flexbox para o container */
    justify-content: center;   /* Centraliza o conteúdo filho horizontalmente */
    align-items: center;       /* Centraliza o conteúdo filho verticalmente */
    text-align: center;        /* Centraliza o texto dentro do conteúdo filho, caso seja um texto direto ou inline */
    /* A altura 'height: 350px;' que você já tem inline ajuda no alinhamento vertical */
}

/* Opcional: Se a mensagem estiver dentro de outro elemento (ex: <p>) dentro do container */
/* Esta regra é genérica; se souber a tag específica da mensagem (ex: p, div), pode ser mais específico */
.chart-container-line > *,
.chart-container-doughnut > * {
    /* Você pode adicionar max-width ou outras propriedades aqui se necessário */
    /* Exemplo: max-width: 90%; para evitar que a mensagem toque as bordas se for muito longa */
}

.text-muted {
    --bs-text-opacity: 1;
    color: #8d998d !important
}

.bg-dark {
    --bs-bg-opacity: 1;
    background-color: var(--primary-accent) !important;
}