/**
 * BackOffice theme: Orange & Black
 * Overrides theme-default.css for navigation, panels, and buttons.
 */
:root {
  --theme-orange: #e65100;
  --theme-orange-light: #ff9800;
  --theme-orange-hover: #ffad33;
  --theme-black: #0d0d0d;
  --theme-black-nav: #1a1a1a;
  --theme-black-drop: #111111;
}

/* Top horizontal navigation bar */
.x-navigation.x-navigation-horizontal,
.x-navigation.x-navigation-horizontal.x-navigation-panel {
  background: var(--theme-black) !important;
  border-bottom: 1px solid var(--theme-orange);
}
.x-navigation.x-navigation-horizontal > li > a {
  color: #ffffff !important;
}
.x-navigation.x-navigation-horizontal > li > a:hover {
  background: var(--theme-orange) !important;
  color: #fff !important;
}
.x-navigation.x-navigation-horizontal > li > a:hover .fa,
.x-navigation.x-navigation-horizontal > li > a:hover .glyphicon,
.x-navigation.x-navigation-horizontal > li > a:hover span[class^="fa"] {
  color: #fff !important;
}
.x-navigation.x-navigation-horizontal > li > a .fa,
.x-navigation.x-navigation-horizontal > li > a .glyphicon,
.x-navigation.x-navigation-horizontal > li > a span[class^="fa"] {
  color: #ffffff !important;
}
/* Icon buttons in top nav (power-off, language, envelope, etc.) - force white/orange, no green */
.x-navigation.x-navigation-horizontal .xn-icon-button > a .fa,
.x-navigation.x-navigation-horizontal .xn-icon-button > a .glyphicon,
.x-navigation.x-navigation-horizontal .xn-icon-button > a span.fa,
.x-navigation.x-navigation-horizontal li > a .fa,
.x-navigation.x-navigation-horizontal li > a .glyphicon,
.x-navigation.x-navigation-horizontal li > a span.fa {
  color: #ffffff !important;
}
.x-navigation.x-navigation-horizontal .xn-icon-button > a:hover .fa,
.x-navigation.x-navigation-horizontal .xn-icon-button > a:hover .glyphicon,
.x-navigation.x-navigation-horizontal .xn-icon-button > a:hover span.fa,
.x-navigation.x-navigation-horizontal > li > a:hover .fa,
.x-navigation.x-navigation-horizontal > li > a:hover .glyphicon,
.x-navigation.x-navigation-horizontal > li > a:hover span.fa {
  color: #fff !important;
}
.x-navigation.x-navigation-horizontal > li.active > a {
  background: var(--theme-orange) !important;
}
.x-navigation.x-navigation-horizontal > li.active > a .fa,
.x-navigation.x-navigation-horizontal > li.active > a .glyphicon,
.x-navigation.x-navigation-horizontal > li.active > a span.fa {
  color: #fff !important;
}
/* Force all icons in top bar to white (override any green/yellow from theme-default) */
body .x-navigation.x-navigation-horizontal .fa,
body .x-navigation.x-navigation-horizontal .glyphicon,
body .x-navigation.x-navigation-horizontal span.fa,
.page-container .x-navigation.x-navigation-horizontal.x-navigation-panel .fa,
.page-container .x-navigation.x-navigation-horizontal.x-navigation-panel .glyphicon,
.page-container .x-navigation.x-navigation-horizontal.x-navigation-panel span.fa {
  color: #ffffff !important;
}
body .x-navigation.x-navigation-horizontal a:hover .fa,
body .x-navigation.x-navigation-horizontal a:hover .glyphicon,
body .x-navigation.x-navigation-horizontal a:hover span.fa {
  color: #fff !important;
}
.x-navigation.x-navigation-horizontal > li > ul {
  background: var(--theme-black-drop) !important;
  border: 1px solid rgba(230, 81, 0, 0.3);
}
.x-navigation.x-navigation-horizontal > li > ul li > a {
  color: #e0e0e0 !important;
}
.x-navigation.x-navigation-horizontal > li > ul li > a:hover {
  background: var(--theme-orange) !important;
  color: #fff !important;
}

/* Vertical navigation (if used) */
.x-navigation {
  background: var(--theme-black-nav) !important;
}
.x-navigation li > a:hover {
  background: var(--theme-orange) !important;
}
.x-navigation li > a:hover .fa,
.x-navigation li > a:hover .glyphicon {
  color: #fff !important;
}
.x-navigation li.active > a {
  background: var(--theme-orange) !important;
}
.x-navigation li.active > a .fa,
.x-navigation li.active > a .glyphicon {
  color: #fff !important;
}
.x-navigation li > ul {
  background: var(--theme-black-drop) !important;
}
.x-navigation > li > a.x-navigation-control {
  background: var(--theme-orange) !important;
}

/* Page container / sidebar area */
.page-container {
  background: var(--theme-black-nav) !important;
}

/* Side menu profile block (sidebar) */
.panel-body.profile,
.panel-body.profile.bg-primary {
  background: var(--theme-orange) !important;
  color: #fff !important;
}
.panel-body.profile .profile-data-name {
  color: #fff !important;
}
.btn-success.btn-rounded,
a .btn-success.btn-rounded {
  background: var(--theme-orange) !important;
  border-color: var(--theme-orange) !important;
}
.btn-success.btn-rounded:hover {
  background: var(--theme-orange-light) !important;
  border-color: var(--theme-orange-light) !important;
}

/* Navigation menu list in sidebar */
.list-group-item.active {
  background: var(--theme-orange) !important;
  border-color: var(--theme-orange) !important;
  color: #fff !important;
}
.list-group.border-bottom .list-group-item.active {
  background: var(--theme-orange) !important;
  border-color: var(--theme-orange) !important;
  color: #fff !important;
}
.list-group-item[style*="background:#fff"]:hover,
a.list-group-item:hover {
  background: rgba(230, 81, 0, 0.15) !important;
  color: var(--theme-orange) !important;
}

/* Panel headings and titles */
.panel .panel-title {
  color: var(--theme-orange) !important;
}
.panel-default .panel-heading,
.panel-primary .panel-heading,
.panel-success .panel-heading {
  background: #f5f5f5 !important;
  border-left: 3px solid var(--theme-orange);
}

/* Primary & success buttons */
.btn-primary,
.btn-success {
  background: var(--theme-orange) !important;
  border-color: var(--theme-orange) !important;
}
.btn-primary:hover,
.btn-success:hover,
.btn-primary:focus,
.btn-success:focus {
  background: var(--theme-orange-light) !important;
  border-color: var(--theme-orange-light) !important;
  color: #fff;
}

/* Info buttons and links */
.btn-info {
  background: var(--theme-black-nav) !important;
  border-color: var(--theme-black-nav) !important;
}
.btn-info:hover {
  background: var(--theme-orange) !important;
  border-color: var(--theme-orange) !important;
  color: #fff;
}

/* DataTables and table header */
.table > thead > tr > th,
.table-striped > thead > tr[style*="background"] {
  background: var(--theme-black-nav) !important;
  color: #e0e0e0 !important;
  border-color: var(--theme-orange);
}

/* Breadcrumb */
.breadcrumb > .active {
  color: var(--theme-orange);
}
.breadcrumb a {
  color: var(--theme-orange);
}
.breadcrumb a:hover {
  color: var(--theme-orange-light);
}

/* Dropdown menu from nav */
.xn-drop-left {
  background: var(--theme-black-drop) !important;
}
.xn-drop-left li a:hover {
  background: var(--theme-orange) !important;
  color: #fff !important;
}
