/* Custom Color Overrides - Change all primary colors to black */

:root {
  --bs-primary: #000000;
  --bs-primary-rgb: 0, 0, 0;
  --bs-primary-text-emphasis: #000000;
  --bs-primary-bg-subtle: #f8f9fa;
  --bs-primary-border-subtle: #dee2e6;
}

/* Additional primary color overrides */
.bg-primary {
  background-color: #000000 !important;
}

.text-primary {
  color: #000000 !important;
}

.border-primary {
  border-color: #000000 !important;
}

.btn-primary {
  background-color: #000000 !important;
  border-color: #000000 !important;
  color: #ffffff !important;
}

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

.btn-outline-primary {
  color: #000000 !important;
  border-color: #000000 !important;
}

.btn-outline-primary:hover {
  background-color: #000000 !important;
  border-color: #000000 !important;
  color: #ffffff !important;
}

/* Links */
a {
  color: #000000;
}

a:hover {
  color: #333333;
}

/* Form controls focus state */
.form-control:focus {
  border-color: #000000;
  box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.25);
}

.form-select:focus {
  border-color: #000000;
  box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.25);
}

/* Navigation active states */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: #000000;
}

/* Progress bars */
.progress-bar {
  background-color: #000000;
}

/* Badges */
.badge.bg-primary {
  background-color: #000000 !important;
}

/* Table striping and hover */
.table-primary,
.table-primary > th,
.table-primary > td {
  background-color: rgba(0, 0, 0, 0.075);
}

/* Sidebar and Layout Premium Uniformity */
.sidebar-wrapper {
  background-color: #f8f9fa !important;
  border-right: 1px solid #e9ecef !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  padding-bottom: 75px !important; /* Spacing for fixed profile card */
}

.sidebar-header {
  background-color: #f8f9fa !important;
  border-bottom: 1px solid #e9ecef !important;
  padding: 0 1.5rem !important;
  height: 60px !important;
}

.sidebar-wrapper .metismenu {
  padding: 15px 0 !important;
}

.sidebar-wrapper .metismenu > li {
  margin: 4px 12px !important;
}

.sidebar-wrapper .metismenu ul li {
  margin: 0 !important;
}

.sidebar-wrapper .metismenu a {
  border-radius: 8px !important;
  padding: 8px 15px !important;
  color: #495057 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  transition: all 0.2s ease !important;
  border-left: none !important;
}

.sidebar-wrapper .metismenu a:hover {
  background-color: #f1f3f5 !important;
  color: #212529 !important;
  border-left: none !important;
}

/* Indent and format submenu list items */
.sidebar-wrapper .metismenu ul a {
  font-size: 13.5px !important;
  padding: 6px 15px 6px 42px !important;
  color: #5f5f5f !important;
  background-color: transparent !important;
}

.sidebar-wrapper .metismenu ul a:hover {
  background-color: #f1f3f5 !important;
  color: #212529 !important;
}

/* Active item - Red Capsule: Only target leaf links that are active, not parent toggles! */
.sidebar-wrapper .metismenu .mm-active > a:not(.has-arrow) {
  background-color: #c2272d !important;
  color: #ffffff !important;
  border-left: none !important;
  box-shadow: 0 4px 12px rgba(194, 39, 45, 0.2) !important;
}

/* Ensure active parent toggles remain standard transparent */
.sidebar-wrapper .metismenu .mm-active > a.has-arrow {
  color: #212529 !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Active leaf icons become white */
.sidebar-wrapper .metismenu .mm-active > a:not(.has-arrow) i,
.sidebar-wrapper .metismenu .mm-active > a:not(.has-arrow) .parent-icon i {
  color: #ffffff !important;
}

/* Active parent toggle icons remain dark */
.sidebar-wrapper .metismenu .mm-active > a.has-arrow i,
.sidebar-wrapper .metismenu .mm-active > a.has-arrow .parent-icon i {
  color: #495057 !important;
}

/* Highlight active submenu items as red text instead of background capsules */
.sidebar-wrapper .metismenu ul .mm-active > a {
  color: #c2272d !important;
  background-color: transparent !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.sidebar-wrapper .metismenu ul .mm-active > a i {
  color: #c2272d !important;
}

.sidebar-wrapper .metismenu .menu-label {
  padding: 15px 15px 5px 15px !important;
  font-weight: 600 !important;
  color: #adb5bd !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
}

/* Header Uniformity */
.top-header {
  position: fixed !important;
  top: 0 !important;
  left: 260px !important;
  right: 0 !important;
  height: 60px !important;
  z-index: 1000 !important;
  background-color: #ffffff !important;
  border-bottom: 1px solid #e9ecef !important;
  box-shadow: none !important;
  transition: all 0.2s !important;
}

.wrapper.toggled .top-header {
  left: 70px !important;
}

.top-header .navbar {
  padding: 0 1.5rem !important;
  height: 100% !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
}

/* Search bar styling similar to first screenshot */
.top-header .navbar .searchbar {
  border: 1px solid #ced4da !important;
  border-radius: 30px !important;
  padding: 2px 15px !important;
  width: 320px !important;
  height: 38px !important;
  background-color: #ffffff !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  animation: none !important;
  -webkit-animation: none !important;
  display: flex !important;
  align-items: center !important;
  z-index: 1 !important;
}

.top-header .navbar .searchbar input {
  border: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  padding-left: 20px !important;
  height: 100% !important;
}

.top-header .navbar .searchbar .search-icon {
  left: 15px !important;
  color: #6c757d !important;
}

/* Profile dropdown header avatar link */
.dropdown-user-setting .user-setting {
  border: none !important;
}

/* Profile section at the bottom of the sidebar */
.sidebar-profile {
  background-color: #ffffff !important;
  border-top: 1px solid #e9ecef !important;
}

/* =========================================
   Dark Theme Adjustments
   ========================================= */

html.dark-theme .sidebar-wrapper {
  background-color: #1a2232 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html.dark-theme .sidebar-header {
  background-color: #1a2232 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html.dark-theme .sidebar-header .text-dark {
  color: #ffffff !important;
}

html.dark-theme .sidebar-wrapper .metismenu a {
  color: #9ea4aa !important;
}

html.dark-theme .sidebar-wrapper .metismenu a:hover {
  background-color: #29344d !important;
  color: #ffffff !important;
}

html.dark-theme .sidebar-profile {
  background-color: #1a2232 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html.dark-theme .sidebar-profile .text-dark {
  color: #fcfcfc !important;
}

html.dark-theme .sidebar-profile .text-secondary {
  color: #9ea4aa !important;
}

html.dark-theme .top-header {
  background-color: #1a2232 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html.dark-theme .top-header .searchbar {
  background-color: #1a2232 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html.dark-theme .top-header .searchbar input {
  color: #ffffff !important;
}

html.dark-theme .top-header .navbar .rounded-circle {
  background-color: #29344d !important;
  color: #ffffff !important;
}

/* Correct arrow direction for collapsed/expanded parent menus */
.sidebar-wrapper .metismenu .has-arrow:after {
  border-width: 1.2px 1.2px 0 0 !important; /* Top and Right borders */
  transform: rotate(45deg) translateY(-50%) !important; /* Right arrow '>' */
}

.sidebar-wrapper .metismenu .has-arrow[aria-expanded='true']:after {
  transform: rotate(135deg) translateY(-50%) !important; /* Down arrow 'v' */
}
