/* Theme Override CSS - Forces template to use theme variables */
/* This file must be loaded AFTER the template CSS to override hardcoded colors */

/* Body and main container overrides */
body,
html {
  background-color: var(--theme-background, #fefefe) !important;
  color: var(--theme-text, #374151) !important;
}

/* Navbar overrides */
.navbar,
.navbar-inverse {
  /* background: linear-gradient(135deg, var(--theme-primary, #60a5fa), var(--theme-accent, #818cf8)) !important; */
  border-color: var(--theme-border, #f3f4f6) !important;
}

.navbar-brand,
.navbar-nav > li > a,
.top-nav-icon {
  color: var(--theme-surface, #ffffff) !important;
}

.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: var(--theme-surface, #ffffff) !important;
}

/* Topbar scrolling text override */
.center-scrolling-text .scrolling-content {
  color: var(--theme-surface, #ffffff) !important;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.5) !important;
}

/* Additional navbar specific overrides */
.navbar-inverse .navbar-brand {
  color: var(--theme-surface, #ffffff) !important;
}

.navbar-inverse .navbar-nav > li > a {
  color: var(--theme-surface, #ffffff) !important;
}

.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
  color: var(--theme-surface, #ffffff) !important;
  background-color: rgba(255, 255, 255, 0.1) !important;
}

/* Ensure icons in navbar use correct colors */
.top-nav-icon {
  color: var(--theme-surface, #ffffff) !important;
}

.zmdi {
  color: inherit !important;
}

/* Theme-specific adjustments for better contrast */
.theme-dark .center-scrolling-text .scrolling-content {
  color: var(--theme-surface, #ffffff) !important;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.8) !important;
}

.theme-default .center-scrolling-text .scrolling-content,
.theme-nature .center-scrolling-text .scrolling-content,
.theme-ocean .center-scrolling-text .scrolling-content,
.theme-sunset .center-scrolling-text .scrolling-content,
.theme-purple .center-scrolling-text .scrolling-content,
.theme-minimal .center-scrolling-text .scrolling-content,
.theme-pastel .center-scrolling-text .scrolling-content,
.theme-spring .center-scrolling-text .scrolling-content,
.theme-cream .center-scrolling-text .scrolling-content {
  color: var(--theme-surface, #ffffff) !important;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3) !important;
}

/* Enhanced Sidebar overrides */
.fixed-sidebar,
.fixed-sidebar-left,
.sidebar-nav,
.side-nav {
  background-color: var(--theme-surface, #ffffff) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
  box-shadow: 1px 0 3px rgba(0, 0, 0, 0.1) !important;
}

/* Enhanced sidebar hover and interaction effects */
.fixed-sidebar-left.theme-default,
.fixed-sidebar-left.theme-ocean,
.fixed-sidebar-left.theme-nature,
.fixed-sidebar-left.theme-sunset,
.fixed-sidebar-left.theme-purple,
.fixed-sidebar-left.theme-minimal,
.fixed-sidebar-left.theme-pastel,
.fixed-sidebar-left.theme-spring,
.fixed-sidebar-left.theme-cream,
.fixed-sidebar-left.theme-dark {
  background-color: var(--theme-surface, #ffffff) !important;
  border-right: 1px solid var(--theme-border, #f3f4f6) !important;
  box-shadow: 1px 0 3px rgba(0, 0, 0, 0.1) !important;
}

/* Smooth sidebar width transitions */
.fixed-sidebar-left.collapsed {
  width: 60px !important;
}

.fixed-sidebar-left.open {
  width: 240px !important;
}

/* Navigation headers in sidebar */
.navigation-header {
  background-color: var(--theme-background, #fefefe) !important;
  color: var(--theme-textSecondary, #9ca3af) !important;
  border-bottom: 1px solid var(--theme-border, #f3f4f6) !important;
}

.navigation-header span {
  color: var(--theme-textSecondary, #9ca3af) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
}

.navigation-header i {
  color: var(--theme-textSecondary, #9ca3af) !important;
}

/* Sidebar menu items */
.sidebar-nav ul li a,
.side-nav li a,
.nav.side-nav li a {
  color: var(--theme-text, #374151) !important;
  border-bottom-color: var(--theme-border, #f3f4f6) !important;
  transition: all 0.3s ease !important;
}

/* Sidebar menu item icons */
.sidebar-nav ul li a i,
.side-nav li a i,
.nav.side-nav li a i {
  color: var(--theme-textSecondary, #9ca3af) !important;
  transition: all 0.3s ease !important;
}

/* Sidebar menu item text */
.right-nav-text {
  color: var(--theme-text, #374151) !important;
  transition: all 0.3s ease !important;
}

/* Hover states */
.sidebar-nav ul li a:hover,
.side-nav li a:hover,
.nav.side-nav li a:hover {
  background-color: var(--theme-background, #fefefe) !important;
  color: var(--theme-primary, #60a5fa) !important;
}

.sidebar-nav ul li a:hover i,
.side-nav li a:hover i,
.nav.side-nav li a:hover i {
  color: var(--theme-primary, #60a5fa) !important;
}

.sidebar-nav ul li a:hover .right-nav-text,
.side-nav li a:hover .right-nav-text,
.nav.side-nav li a:hover .right-nav-text {
  color: var(--theme-primary, #60a5fa) !important;
}

/* Active/Selected states */
.sidebar-nav ul li.active > a,
.side-nav li.active > a,
.nav.side-nav li.active > a,
.sidebar-nav ul li a.active,
.side-nav li a.active,
.nav.side-nav li a.active {
/* background: linear-gradient(135deg, var(--theme-primary, #60a5fa), var(--theme-accent, #818cf8)) !important; */
  color: var(--theme-surface, #ffffff) !important;
  /* border-left: 3px solid var(--theme-accent, #818cf8) !important; */
}

.sidebar-nav ul li.active > a i,
.side-nav li.active > a i,
.nav.side-nav li.active > a i,
.sidebar-nav ul li a.active i,
.side-nav li a.active i,
.nav.side-nav li a.active i {
  color: var(--theme-surface, #ffffff) !important;
}

.sidebar-nav ul li.active > a .right-nav-text,
.side-nav li.active > a .right-nav-text,
.nav.side-nav li.active > a .right-nav-text,
.sidebar-nav ul li a.active .right-nav-text,
.side-nav li a.active .right-nav-text,
.nav.side-nav li a.active .right-nav-text {
  color: var(--theme-surface, #ffffff) !important;
}

/* Submenu styles */
.submenu,
.submenu.show {
  background-color: var(--theme-background, #fefefe) !important;
  border-left: 2px solid var(--theme-border, #f3f4f6) !important;
}

.submenu li a {
  color: var(--theme-textSecondary, #9ca3af) !important;
  background-color: transparent !important;
  padding-left: 50px !important;
  border-bottom: 1px solid var(--theme-border, #f3f4f6) !important;
}

.submenu li a:hover {
  background-color: var(--theme-border, #f3f4f6) !important;
  color: var(--theme-primary, #60a5fa) !important;
}

.submenu li a:active,
.submenu li a.active {
  /* background-color: var(--theme-primary, #60a5fa) !important; */
  color: var(--theme-surface, #ffffff) !important;
}

/* Panel/Card overrides */
.panel,
.panel-default,
.hpanel {
  background-color: var(--theme-surface, #ffffff) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
}

.panel-heading,
.panel-header {
  background-color: var(--theme-background, #fefefe) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
  color: var(--theme-text, #374151) !important;
}

.panel-title {
  color: var(--theme-text, #374151) !important;
}

/* Button overrides */
.btn-primary {
  background: linear-gradient(135deg, var(--theme-primary, #60a5fa), var(--theme-accent, #818cf8)) !important;
  border-color: var(--theme-primary, #60a5fa) !important;
  color: var(--theme-surface, #ffffff) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background: var(--theme-accent, #818cf8) !important;
  border-color: var(--theme-accent, #818cf8) !important;
  color: var(--theme-surface, #ffffff) !important;
}

.btn-success {
  background-color: var(--theme-success, #6ee7b7) !important;
  border-color: var(--theme-success, #6ee7b7) !important;
  color: var(--theme-text, #374151) !important;
}

.btn-warning {
  background-color: var(--theme-warning, #fbbf24) !important;
  border-color: var(--theme-warning, #fbbf24) !important;
  color: var(--theme-text, #374151) !important;
}

.btn-danger {
  background-color: var(--theme-danger, #fca5a5) !important;
  border-color: var(--theme-danger, #fca5a5) !important;
  color: var(--theme-text, #374151) !important;
}

.btn-info {
  background-color: var(--theme-info, #60a5fa) !important;
  border-color: var(--theme-info, #60a5fa) !important;
  color: var(--theme-surface, #ffffff) !important;
}

/* Form control overrides */
.form-control {
  background-color: var(--theme-surface, #ffffff) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
  color: var(--theme-text, #374151) !important;
}

.form-control:focus {
  border-color: var(--theme-primary, #60a5fa) !important;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.1) !important;
}

/* Table overrides */
.table {
  background-color: var(--theme-surface, #ffffff) !important;
  color: var(--theme-text, #374151) !important;
}

.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: var(--theme-background, #fefefe) !important;
}

.table th {
  background-color: var(--theme-background, #fefefe) !important;
  color: var(--theme-text, #374151) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
}

.table td {
  border-color: var(--theme-border, #f3f4f6) !important;
}

/* Modal overrides */
.modal-content {
  background-color: var(--theme-surface, #ffffff) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
}

.modal-header {
  background-color: var(--theme-background, #fefefe) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
  color: var(--theme-text, #374151) !important;
}

.modal-title {
  color: var(--theme-text, #374151) !important;
}

.modal-footer {
  background-color: var(--theme-background, #fefefe) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
}

/* Dropdown overrides */
.dropdown-menu {
  background-color: var(--theme-surface, #ffffff) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

.dropdown-menu > li > a {
  color: var(--theme-text, #374151) !important;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  background-color: var(--theme-background, #fefefe) !important;
  color: var(--theme-primary, #60a5fa) !important;
}

/* Badge and label overrides */
.badge,
.label {
  background-color: var(--theme-primary, #60a5fa) !important;
  color: var(--theme-surface, #ffffff) !important;
}

.badge-success,
.label-success {
  background-color: var(--theme-success, #6ee7b7) !important;
  color: var(--theme-text, #374151) !important;
}

.badge-warning,
.label-warning {
  background-color: var(--theme-warning, #fbbf24) !important;
  color: var(--theme-text, #374151) !important;
}

.badge-danger,
.label-danger {
  background-color: var(--theme-danger, #fca5a5) !important;
  color: var(--theme-text, #374151) !important;
}

.badge-info,
.label-info {
  background-color: var(--theme-info, #60a5fa) !important;
  color: var(--theme-surface, #ffffff) !important;
}

/* Alert overrides */
.alert-success {
  background-color: var(--theme-success, #6ee7b7) !important;
  border-color: var(--theme-success, #6ee7b7) !important;
  color: var(--theme-text, #374151) !important;
}

.alert-warning {
  background-color: var(--theme-warning, #fbbf24) !important;
  border-color: var(--theme-warning, #fbbf24) !important;
  color: var(--theme-text, #374151) !important;
}

.alert-danger {
  background-color: var(--theme-danger, #fca5a5) !important;
  border-color: var(--theme-danger, #fca5a5) !important;
  color: var(--theme-text, #374151) !important;
}

.alert-info {
  background-color: var(--theme-info, #60a5fa) !important;
  border-color: var(--theme-info, #60a5fa) !important;
  color: var(--theme-surface, #ffffff) !important;
}

/* Progress bar overrides */
.progress {
  background-color: var(--theme-background, #fefefe) !important;
}

.progress-bar {
  background-color: var(--theme-primary, #60a5fa) !important;
}

.progress-bar-success {
  background-color: var(--theme-success, #6ee7b7) !important;
}

.progress-bar-warning {
  background-color: var(--theme-warning, #fbbf24) !important;
}

.progress-bar-danger {
  background-color: var(--theme-danger, #fca5a5) !important;
}

.progress-bar-info {
  background-color: var(--theme-info, #60a5fa) !important;
}

/* Well overrides */
.well {
  background-color: var(--theme-background, #fefefe) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
}

/* List group overrides */
.list-group-item {
  background-color: var(--theme-surface, #ffffff) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
  color: var(--theme-text, #374151) !important;
}

.list-group-item:hover,
.list-group-item:focus {
  background-color: var(--theme-background, #fefefe) !important;
}

.list-group-item.active {
  background-color: var(--theme-primary, #60a5fa) !important;
  border-color: var(--theme-primary, #60a5fa) !important;
  color: var(--theme-surface, #ffffff) !important;
}

/* Pagination overrides */
.pagination > li > a,
.pagination > li > span {
  background-color: var(--theme-surface, #ffffff) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
  color: var(--theme-text, #374151) !important;
}

.pagination > li > a:hover,
.pagination > li > a:focus {
  background-color: var(--theme-background, #fefefe) !important;
  color: var(--theme-primary, #60a5fa) !important;
}

.pagination > .active > a,
.pagination > .active > span {
  background-color: var(--theme-primary, #60a5fa) !important;
  border-color: var(--theme-primary, #60a5fa) !important;
  color: var(--theme-surface, #ffffff) !important;
}

/* Breadcrumb overrides */
.breadcrumb {
  background-color: var(--theme-background, #fefefe) !important;
  color: var(--theme-text, #374151) !important;
}

.breadcrumb > li + li:before {
  color: var(--theme-textSecondary, #9ca3af) !important;
}

/* Tab overrides */
.nav-tabs {
  border-color: var(--theme-border, #f3f4f6) !important;
}

.nav-tabs > li > a {
  color: var(--theme-text, #374151) !important;
  border-color: transparent !important;
}

.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
  background-color: var(--theme-background, #fefefe) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
  color: var(--theme-primary, #60a5fa) !important;
}

.nav-tabs > li.active > a {
  background-color: var(--theme-surface, #ffffff) !important;
  border-color: var(--theme-border, #f3f4f6) var(--theme-border, #f3f4f6) transparent !important;
  color: var(--theme-text, #374151) !important;
}

.tab-content {
  background-color: var(--theme-surface, #ffffff) !important;
  border-color: var(--theme-border, #f3f4f6) !important;
}

/* Specific template class overrides */
.hpanel {
  background: var(--theme-surface, #ffffff) !important;
  border: 1px solid var(--theme-border, #f3f4f6) !important;
}

.content-wrap {
  background: var(--theme-background, #fefefe) !important;
}

.wrapper {
  background: var(--theme-background, #fefefe) !important;
}

/* High specificity overrides to ensure theme variables take precedence */
html body.theme-default,
html body.theme-dark,
html body.theme-nature,
html body.theme-ocean,
html body.theme-sunset,
html body.theme-purple,
html body.theme-minimal,
html body.theme-pastel,
html body.theme-spring,
html body.theme-cream {
  background-color: var(--theme-background) !important;
  color: var(--theme-text) !important;
}

/* Ensure all theme classes get proper styling */
.theme-default * ,
.theme-dark *,
.theme-nature *,
.theme-ocean *,
.theme-sunset *,
.theme-purple *,
.theme-minimal *,
.theme-pastel *,
.theme-spring *,
.theme-cream * {
  transition: all 0.3s ease !important;
}

/* Print media override to ensure themes work in all contexts */
@media screen {
  body {
    background-color: var(--theme-background, #fefefe) !important;
    color: var(--theme-text, #374151) !important;
  }
}

/* Force theme application to all elements with !important */
* {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease !important;
}