/* Custom CSS for Shiny Dashboard */

/* Body */
body {
  font-family: 'Arial', sans-serif;
  background-color: #f9f9f9;
  color: #333333;
}

/* Dashboard header */
.main-header .logo {
  background-color: #1E90FF !important;
  color: #ffffff !important;
  font-size: 18px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: auto; /* Adjust width to fit the title */
}

.main-header .navbar {
  background-color: #1E90FF !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Move the three dots (menu toggle) closer to the title */
.main-header .navbar-custom-menu {
  margin-right: 10px; /* Adjust this value to move the menu toggle closer */
}

/* Sidebar */
.main-sidebar {
  background-color: #2f4050 !important; /* Dark background for the sidebar */
  border-right: 0px !important; /* Remove any right border */
}

.main-sidebar .sidebar {
  background-color: #2f4050 !important; /* Dark background for the sidebar menu */
  color: #ffffff !important; /* Text color */
}

.main-sidebar .sidebar a {
  color: #b8c7ce !important; /* Text color for links */
}

.main-sidebar .sidebar a:hover {
  background-color: #1E90FF !important; /* Hover color for links */
  color: #ffffff !important; /* Text color on hover */
}

/* Sidebar menu item */
.main-sidebar .sidebar .sidebar-menu .active > a {
  background-color: #1E90FF !important; /* Active item background */
  color: #ffffff !important; /* Active item text color */
  border-left-color: #1E90FF !important; /* Active item border color */
}

/* Remove the white background */
.sidebar {
  background-color: #2f4050 !important; /* Ensure dark background */
}

.sidebar-menu {
  background-color: #2f4050 !important; /* Ensure dark background */
}

.sidebar-menu > li > a {
  color: #b8c7ce !important; /* Ensure link color is light */
}

.sidebar-menu > li > a:hover {
  background-color: #1E90FF !important; /* Ensure hover background for links */
  color: #ffffff !important;
}

/* Sidebar item hover */
.main-sidebar .sidebar a:hover {
  background-color: #1E90FF !important; /* Hover color for sidebar links */
  color: #ffffff !important; /* Text color on hover */
}

.main-sidebar .sidebar .sidebar-menu .active > a {
  background-color: #1E90FF !important; /* Active item background */
  color: #ffffff !important; /* Active item text color */
}

/* Footer logo consistency */
.sidebar-footer {
  color: #ffffff;
  text-align: center;
  margin-top: 20px;
}

.sidebar-footer img {
  margin-top: 10px;
  max-width: 100px;
  height: auto;
}

/* Boxes */
.box {
  border-top: 3px solid #1E90FF;
  background-color: #f4f4f4;
}

.box-header {
  background-color: #1E90FF;
  color: #ffffff;
  border-bottom: 1px solid #dddddd;
}

/* TabBox */
.nav-tabs-custom .nav-tabs li.active a {
  background-color: #1E90FF;
  color: #ffffff;
  border-top-color: #1E90FF;
}

.nav-tabs-custom .nav-tabs li a {
  color: #333333;
}

.nav-tabs-custom .nav-tabs li a:hover {
  color: #1E90FF;
}

/* DataTable */
.dataTables_wrapper .dataTables_paginate .paginate_button {
  background-color: #1E90FF;
  color: #ffffff;
  border: none;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background-color: #333333;
  color: #ffffff;
}

.dataTables_wrapper .dataTables_filter input {
  border: 1px solid #1E90FF;
}

/* Slider */
.irs-bar,
.irs-bar-edge,
.irs-single {
  background-color: #1E90FF;
  border-color: #1E90FF;
}

.irs-from, .irs-to, .irs-single {
  background-color: #333333;
  color: #ffffff;
}

/* Buttons */
.btn {
  background-color: #1E90FF;
  border-color: #1E90FF;
  color: #ffffff;
}

.btn:hover {
  background-color: #333333;
  border-color: #333333;
  color: #ffffff;
}

/* General */
h1, h2, h3, h4, h5, h6 {
  color: #333333;
}

a {
  color: #1E90FF;
}

a:hover {
  color: #333333;
}

/* Navbar */
.navbar {
  background-color: #007bff !important;
  border-color: #007bff;
}

.navbar-brand {
  color: #ffffff !important;
}