/* On définis les couleurs */
:root {
  /* General */
  --background_color: #000;
  --text-color: white;

  /* Navbar - footer */
  --navbar-footer-background-color: #1C1C1C;

  /* Card et modal */
  --card-background-color: #222;
  --card-header-footer-background-color: #1C1C1C;

  /* Menus */
  --menu-submenu-hover-background-color: #1C1C1C;
}

/* ------------ GENERAL ------------ */
body #content-wrapper {
  background-color: var(--background_color) !important;
  color: var(--text-color);
}

.section-title, .table {
  color: var(--text-color) !important;
}

/* ------------ NAVBAR - FOOTER ------------ */
.navbar {
    background-color: var(--navbar-footer-background-color) !important;
}
.sticky-footer {
  background-color: var(--navbar-footer-background-color) !important;
}

/* ------------ CARD et modal ------------ */
.card-header {
  background-color: var(--card-header-footer-background-color) !important;
  border-color: var(--card-header-footer-background-color) !important;
}
.card-footer {
  background-color: var(--card-header-footer-background-color) !important;
  border-color: var(--card-header-footer-background-color) !important;
}
.card {
  border-color: var(--card-header-footer-background-color);
  background-color: var(--background-color);
}
.card-body {
  background-color: var(--card-background-color) !important;
}
.modal-header {
  background-color: var(--card-header-footer-background-color) !important;
  border-color: var(--card-header-footer-background-color) !important;
}
.modal-footer {
  background-color: var(--card-header-footer-background-color) !important;
  border-color: var(--card-header-footer-background-color) !important;
}
.modal {
  border-color: var(--card-header-footer-background-color) !important;
}
.modal-body {
  background-color: var(--card-background-color) !important;
}


/* ------------ MENUS ------------ */
.sidebar .nav-item .collapse .collapse-inner .collapse-item:hover, .sidebar .nav-item .collapsing .collapse-inner .collapse-item:hover {
  background-color: var(--menu-submenu-hover-background-color) !important;
}
.sidebar .nav-item .collapse .collapse-inner .collapse-item:active, .sidebar .nav-item .collapsing .collapse-inner .collapse-item:active {
  background-color: var(--menu-submenu-hover-background-color) !important;
}
.nav-item > .collapse > .collapse-inner > .collapse-item {
  color: var(--text-color) !important;
}

.nav-tabs .nav-link.active {
  background-color: var(--menu-submenu-hover-background-color) !important;
}
.nav-link {
  color: var(--text-color) !important;
}

.page-tabs .page-link.active {
  background-color: var(--menu-submenu-hover-background-color) !important;
}
.page-link {
  background-color: transparent !important;
  color: var(--text-color) !important;
}

/* DROPDOWN */
.dropdown-menu {
  background-color: var(--dark) !important;

}
.dropdown-item:focus, .dropdown-item:hover {
  background-color: var(--menu-submenu-hover-background-color) !important;
}
.dropdown-item {
  color: var(--text-color) !important;
}

/* SELECTS */
.custom-select {
  background-color: var(--dark) !important;
  color: var(--text-color) !important;
}

input[type="text"], input[type="email"], input[type="number"], textarea {
  background-color: var(--dark) !important;
  color: var(--text-color) !important;
}

/* Texte des boutons des selectpicker */
.filter-option-inner-inner {
  color: var(--text-color) !important;
}


/* TAGIT */
.tagit.ui-widget {
  background-color: var(--dark) !important;
  color: var(--text-color) !important;
}


/* TOAST */
.swal2-title {
  box-shadow: 0 0 .625em var(--dark) !important;
}
.swal2-success-circular-line-left, .swal2-success-circular-line-right, .swal2-popup, .swal2-success-fix, .swal2-title, .swal2-content {
  background-color: var(--dark) !important;
  color: var(--text-color) !important;
}
