/* =========================
   BASE RESET
========================= */
* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  transition: background 0.25s ease, color 0.25s ease;
}

/* =========================
   LIGHT MODE (DEFAULT)
========================= */
body {
  background: linear-gradient(180deg, #ffffff 0%, #f2f2f2 100%);
  color: #000000;
}

/* Containers */
.card,
.navbar,
.nav-tabs,
.modal-content {
  background: #ffffff;
  color: #000000;
  border: 1px solid #e0e0e0;
}

/* Navbar */
.navbar {
  border-bottom: 1px solid #e0e0e0;
}

/* Tabs */
.nav-tabs .nav-link {
  color: #000000;
}

.nav-tabs .nav-link.active {
  background: #000000;
  color: #ffffff;
}

/* Tables */
.table {
  color: #000000;
}

.table thead th {
  border-bottom: 1px solid #d0d0d0;
  text-transform: uppercase;
  font-size: 0.75rem;
}

.table tbody tr:hover {
  background: #eeeeee;
}

/* Forms */
.form-control,
.form-select {
  background: #ffffff;
  color: #000000;
  border: 1px solid #000000;
}

.form-control:focus,
.form-select:focus {
  outline: none;
  box-shadow: none;
}

/* Buttons */
.btn-dark {
  background: #000000;
  color: #ffffff;
  border: 1px solid #000000;
}

.btn-outline-dark {
  background: transparent;
  color: #000000;
  border: 1px solid #000000;
}

/* Badges */
.badge {
  background: #000000;
  color: #ffffff;
}

/* =========================
   DARK MODE (FULL DARK)
========================= */
body.dark {
  background: linear-gradient(180deg, #000000 0%, #0f0f0f 100%);
  color: #ffffff;
}

/* Containers */
body.dark .card,
body.dark .navbar,
body.dark .nav-tabs,
body.dark .modal-content {
  background: #0a0a0a;
  color: #ffffff;
  border: 1px solid #2a2a2a;
}

/* Navbar */
body.dark .navbar {
  border-bottom: 1px solid #2a2a2a;
}

/* Tabs */
body.dark .nav-tabs .nav-link {
  color: #ffffff;
}

body.dark .nav-tabs .nav-link.active {
  background: #ffffff;
  color: #000000;
}

/* Tables */
body.dark .table {
  color: #ffffff;
}

body.dark .table thead th {
  border-bottom: 1px solid #333333;
}

body.dark .table tbody tr:hover {
  background: #151515;
}

/* Forms */
body.dark .form-control,
body.dark .form-select {
  background: #000000;
  color: #ffffff;
  border: 1px solid #ffffff;
}

body.dark .form-control::placeholder {
  color: #aaaaaa;
}

/* Buttons */
body.dark .btn-dark {
  background: #ffffff;
  color: #000000;
  border: 1px solid #ffffff;
}

body.dark .btn-outline-dark {
  background: transparent;
  color: #ffffff;
  border: 1px solid #ffffff;
}

/* Badges */
body.dark .badge {
  background: #ffffff;
  color: #000000;
}

/* =========================
   CHARTS (NO WHITE PATCHES)
========================= */
canvas {
  background: transparent !important;
}

/* =========================
   MOBILE
========================= */
@media (max-width: 576px) {
  .navbar-brand {
    font-size: 1rem;
  }
}
/* =====================================
   BOOTSTRAP FULL DARK OVERRIDE
   (no white patches, no mixed UI)
===================================== */

body.dark {

  /* ---- Generic ---- */
  background-color: #000 !important;
  color: #fff !important;
}

/* Cards / containers */
body.dark .card,
body.dark .navbar,
body.dark .modal-content,
body.dark .nav-tabs,
body.dark .tab-pane,
body.dark .table-responsive {
  background-color: #0a0a0a !important;
  color: #fff !important;
  border-color: #2a2a2a !important;
}

/* Inputs / selects */
body.dark input,
body.dark select,
body.dark textarea {
  background-color: #000 !important;
  color: #fff !important;
  border-color: #fff !important;
}

body.dark input::placeholder {
  color: #aaa !important;
}

/* Tables */
body.dark table {
  background-color: #0a0a0a !important;
  color: #fff !important;
}

body.dark thead,
body.dark thead th {
  background-color: #000 !important;
  color: #fff !important;
  border-color: #333 !important;
}

body.dark tbody tr {
  background-color: #0a0a0a !important;
}

body.dark tbody tr:hover {
  background-color: #111 !important;
}

/* Tabs */
body.dark .nav-tabs .nav-link {
  background-color: transparent !important;
  color: #fff !important;
}

body.dark .nav-tabs .nav-link.active {
  background-color: #fff !important;
  color: #000 !important;
}

/* Buttons */
body.dark .btn {
  background-color: transparent;
}

body.dark .btn-outline-dark {
  color: #fff !important;
  border-color: #fff !important;
}

body.dark .btn-outline-dark:hover {
  background-color: #fff !important;
  color: #000 !important;
}

body.dark .btn-dark {
  background-color: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
}

/* Badges */
body.dark .badge {
  background-color: #fff !important;
  color: #000 !important;
}

/* Dropdowns */
body.dark .dropdown-menu {
  background-color: #000 !important;
  color: #fff !important;
  border-color: #333 !important;
}

body.dark .dropdown-item {
  color: #fff !important;
}

body.dark .dropdown-item:hover {
  background-color: #111 !important;
}

/* Modals */
body.dark .modal-header,
body.dark .modal-footer {
  border-color: #333 !important;
}

/* Charts safety */
body.dark canvas {
  background: transparent !important;
}