body {
    background-color: black !important;
}

.navbar-vertical {
    background-color: black !important;
	font-size: 1.0rem;
}

.navbar-vertical .nav-link {
    color: white; /* Ensure text color is readable on a dark background */
    padding: 10px; /* Adjust padding for better spacing (optional) */
    transition: background-color 0.3s ease; /* Smooth transition */
}

.navbar-vertical .nav-link:hover {
    background-color: #333; /* Change to a lighter/darker shade on hover */
    color: white; /* Keep the text color consistent */
}

.nav-link {
  display: flex;
  align-items: center; /* Ensure the entire link content is vertically centered */
}

.nav-link-icon {
  display: flex;
  align-items: center; /* Ensure the icon is vertically centered within its span */
}

.nav-icon-custom {
  display: block;
  vertical-align: middle; /* Ensure the image is vertically centered */
}

.nav-link-title {
  margin-left: 2px; /* Adds space between the icon and the text */
}

.card {
    background-color: #313c52 !important; 
}

.nav-icon-custom {
    filter: invert(100%);
}

.font-weight-medium {
    color: white;
	font-size: 1.25rem;
}

.text-secondary {
	font-size: 1.1rem;
}

.upload-title {
    color: #CFCFCF;
	font-size: 1.1rem;
}

.table thead th {
    font-size: 0.9rem; /* Adjust the size as needed */
	color: #8F8F8F;
	background-color: #151f2c !important;
}

.table-padding-left {
	.margin-left: 20px !important;
}



.table td, .table th {
    padding: 0.25rem 0.5rem; /* Reduce padding */
    line-height: 1.25  !important; /* Adjust line height for tighter rows */
}

.card-title {
	font-size: 1.4rem !important;
	color: white;
}

.dz-title {
	font-size: 1.5rem;
	color: white;
}

.dz-white {
	color: white;
}

.dz-navybg {
	background-color: #0f0f0f;
	color: red;
}

.dz-tablerow {
	font-size: 16px !important;
}



/* Target "Show entries" label and dropdown */
.dataTables_length label {
    color: white;  /* Change text color to white */
}

/* Style the select element for the "Show entries" dropdown */
.dataTables_length select {
    color: white;  /* Change the text color of the selected value */
    background-color: #333;  /* Optional: Change the background color */
}

/* Optional: Style the options dropdown (keep options black) */
.dataTables_length select option {
    color: black;  /* Keep the dropdown options text black */
    background-color: white;  /* Keep dropdown background white */
}

/* Target "Search" label */
.dataTables_filter label {
    color: white;  /* Change text color to white */
}

/* Change the text color inside the search input box */
.dataTables_filter input {
    color: white !important;  /* Change the text inside the search box to white */
    border: 1px solid #ccc !important;  /* Optional: Add border color */
}


/* Style the "Showing X to Y of Z entries" text */
.dataTables_wrapper .dataTables_info {
    color: white !important;
}

/* Style the pagination controls (Next, Previous, page numbers) */
.dataTables_wrapper .dataTables_paginate {
    color: white !important;  /* Ensure white text for all pagination elements */
}

/* Style the pagination links specifically */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: white !important;  /* Set pagination buttons (numbers and next/prev) to white */
}

/* Style the active page number */
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    color: #3c4963 !important;
    background-color: #444 !important;  /* Dark background for active page */
    border: 1px solid #ccc !important;
}

/* Style hover and focus states for pagination buttons */
.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:focus {
    background-color: #555 !important;  /* Change background on hover/focus */
    color: white !important;
}

table.dataTable thead th.sorting_asc {
    color: yellow !important;
}

/* Style the sorted column header when sorting in descending order */
table.dataTable thead th.sorting_desc {
    color: yellow !important;
}

.striped-table tr:nth-child(even) {
    background-color: #3c4963 !important;
}

.striped-table tr:nth-child(odd) {
    background-color: #3c4963 !important;
}

.striped-table tr:nth-child(odd) {
    background-color: #313c52 !important; 
}

.striped-table tr:nth-child(even) {
    background-color: #3c4963 !important; 
}

/*.table tbody tr:hover {
    background-color: #f5f5f522 !important;
    cursor: pointer !important; 
}*/

.hover tr:hover {
    background-color: #f5f5f522 !important; /* Change this color to whatever you prefer */
    cursor: pointer !important; /* Optional: change cursor to pointer on hover */
}

.profile-table tr:nth-child(odd) {
    background-color: #313c52 !important; 
}

.profile-table tr:nth-child(even) {
    background-color: #3c4963 !important; 
}

/* Ensure that ApexCharts labels are not affected by global table styles */
.apexcharts-yaxis-label {
    display: block !important;
    visibility: visible !important;
    text-align: left !important;
    fill: #000 !important;  /* Make sure the labels are visible (black) */
    font-size: 14px !important;  /* Adjust font size to be readable */
}

.apexcharts-yaxis-texts-g {
    text-anchor: start !important;  /* Align the labels correctly */
}

.apexcharts-svg {
    overflow: visible !important;  /* Ensure the SVG container allows labels to render */
}

.apexcharts-tooltip {
    z-index: 9999 !important;  /* Ensure tooltips show above other content */
}