/* ==========================
   VARIÁVEIS DE TEMA
========================== */
:root {
  --bg-main: #0f172a;
  --bg-card: #020617;
  --bg-soft: #1e293b;

  --border-color: #334155;

  --text-main: #e5e7eb;
  --text-soft: #94a3b8;

  --primary: #3b82f6;
  --success: #22c55e;
  --warning: #f59e0b;
  --danger: #ef4444;
}

/* ==========================
   BODY / LAYOUT
========================== */
body {
  background-color: var(--bg-main);
  color: var(--text-main);
}

/* ==========================
   NAVBAR TOPO
========================== */
.sb-topnav {
  background-color: #020617 !important;
  border-bottom: 1px solid var(--border-color);
}

.sb-topnav .navbar-brand,
.sb-topnav .nav-link,
.sb-topnav .form-control {
  color: var(--text-main) !important;
}

/* ==========================
   SIDEBAR
========================== */
.sb-sidenav-dark {
  background-color: #020617 !important;
}

.sb-sidenav-dark .nav-link {
  color: var(--text-soft) !important;
}

.sb-sidenav-dark .nav-link:hover {
  background-color: var(--bg-soft);
  color: var(--text-main) !important;
}

.sb-sidenav-footer {
  background-color: #020617;
  color: var(--text-soft);
  border-top: 1px solid var(--border-color);
}

/* ==========================
   CARDS
========================== */
.card {
  background-color: var(--bg-card);
  color: var(--text-main);
  border: 1px solid var(--border-color);
}

.card-header {
  background-color: var(--bg-soft);
  border-bottom: 1px solid var(--border-color);
  color: var(--text-main);
}

/* ==========================
   FORMULÁRIOS
========================== */
.form-control,
.form-select {
  background-color: #020617;
  border: 1px solid var(--border-color);
  color: var(--text-main);
}

.form-control::placeholder {
  color: var(--text-soft);
}

.form-control:focus,
.form-select:focus {
  background-color: #020617;
  color: var(--text-main);
  border-color: var(--primary);
  box-shadow: 0 0 0 0.15rem rgba(59, 130, 246, 0.25);
}

/* ==========================
   BOTÕES
========================== */
.btn-primary {
  background-color: var(--primary);
  border-color: var(--primary);
}

.btn-success {
  background-color: var(--success);
  border-color: var(--success);
}

.btn-warning {
  background-color: var(--warning);
  border-color: var(--warning);
}

.btn-danger {
  background-color: var(--danger);
  border-color: var(--danger);
}

.btn-outline-primary {
  color: var(--primary);
  border-color: var(--primary);
}

.btn-outline-primary:hover {
  background-color: var(--primary);
  color: white;
}

/* ==========================
   TABELAS BOOTSTRAP
========================== */
.table {
  color: var(--text-main);
}

.table thead {
  background-color: var(--bg-soft);
}

.table tbody tr {
  background-color: var(--bg-card);
}

.table tbody tr:hover {
  background-color: #020617;
}

/* ==========================
   SIMPLE-DATATABLES
========================== */
.dataTable-wrapper {
  color: var(--text-main);
}

.dataTable-top,
.dataTable-bottom {
  background-color: var(--bg-soft);
  border: 1px solid var(--border-color);
}

.dataTable-table {
  background-color: var(--bg-card);
  color: var(--text-main);
}

.dataTable-table th {
  background-color: var(--bg-soft);
  color: var(--text-main);
  border-color: var(--border-color);
}

.dataTable-table td {
  border-color: var(--border-color);
}

.dataTable-table tbody tr:hover {
  background-color: #020617;
}

/* Paginação */
.dataTable-pagination a {
  background-color: var(--bg-soft);
  color: var(--text-main);
  border: 1px solid var(--border-color);
}

.dataTable-pagination a:hover,
.dataTable-pagination .active a {
  background-color: var(--primary);
  color: white;
  border-color: var(--primary);
}

/* Campo de busca */
.dataTable-input {
  background-color: #020617;
  border: 1px solid var(--border-color);
  color: var(--text-main);
}

/* ==========================
   MODAIS
========================== */
.modal-content {
  background-color: var(--bg-card);
  color: var(--text-main);
  border: 1px solid var(--border-color);
}

.modal-header {
  border-bottom: 1px solid var(--border-color);
}

.modal-footer {
  border-top: 1px solid var(--border-color);
}

/* ==========================
   FOOTER
========================== */
footer {
  background-color: #020617 !important;
  border-top: 1px solid var(--border-color);
}

footer,
footer a {
  color: var(--text-soft);
}

/* ==========================
   SCROLLBAR (Chrome/Edge)
========================== */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #020617;
}

::-webkit-scrollbar-thumb {
  background: var(--bg-soft);
  border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--primary);
}
