body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: 13px;
}
@media (max-width: 400px) {
  .navbar-left {
    margin: 2px;
  }
  .nav::after {
    clear: none;
  }
}
.skin-blue .main-header .logo {
  background-color: inherit !important;
}
.main-header .logo {
  width: 100% !important;
  white-space: nowrap;
  text-align: left;
  display: block;
  clear: both;
}
.huge {
  font-size: 40px;
}
.btn-file {
  position: relative;
  overflow: hidden;
}
.dropdown-menu > li > a {
  color: #354044;
}
#sort tr.cansort {
  border-radius: 2px;
  padding: 10px;
  background: #f4f4f4;
  margin-bottom: 3px;
  border-left: 2px solid #e6e7e8;
  color: #444;
  cursor: move;
}
.user-image-inline {
  float: left;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin-right: 10px;
}
.input-group .input-group-addon {
  background-color: #f4f4f4;
}
a.accordion-header {
  color: #333;
}
.dynamic-form-row {
  margin-bottom: 15px;
}
.dynamic-form-row::before,
.dynamic-form-row::after {
  content: " ";
  display: table;
}
.dynamic-form-row::after {
  clear: both;
}
.handle {
  padding-left: 10px;
}
.btn-file input[type="file"] {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 100%;
  min-height: 100%;
  font-size: 100px;
  text-align: right;
  filter: alpha(opacity=0);
  opacity: 0;
  outline: none;
  background: white;
  cursor: inherit;
  display: block;
}
.main-footer {
  font-size: 13px;
}
.main-header {
  max-height: 150px;
}
.navbar-nav > .user-menu > .dropdown-menu {
  width: inherit;
}
.main-header .logo {
  padding: 0px 5px 0px 15px;
}
.sidebar-toggle {
  margin-left: -48px;
  z-index: 100;
  background-color: inherit;
}
.sidebar-toggle-mobile {
  z-index: 100;
  width: 50px;
  padding-top: 10px;
}
.main-header .sidebar-toggle:before {
  content: "\f0c9";
}
.direct-chat-contacts {
  padding: 10px;
  height: 150px;
}
.select2-container {
  width: 100%;
}
.error input {
  color: #a94442;
  border: 2px solid #a94442 !important;
}
.error label,
.alert-msg {
  color: #a94442;
  display: block;
}
.alert-msg::before {
  content: "\f00d";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 0.35em;
}
.input-group[class*="col-"] {
  padding-right: 15px;
  padding-left: 15px;
}
.control-label.multiline {
  padding-top: 10px;
}
.btn-outline {
  color: inherit;
  background-color: transparent;
  transition: all 0.5s;
}
.btn-primary.btn-outline {
  color: #428bca;
}
.btn-success.btn-outline {
  color: #5cb85c;
}
.btn-info.btn-outline {
  color: #5bc0de;
}
.btn-warning.btn-outline {
  color: #f0ad4e;
}
.btn-danger.btn-outline {
  color: #d9534f;
}
.btn-primary.btn-outline:hover,
.btn-success.btn-outline:hover,
.btn-info.btn-outline:hover,
.btn-warning.btn-outline:hover,
.btn-danger.btn-outline:hover {
  color: #fff;
}
.slideout-menu {
  position: fixed;
  top: 0;
  right: -250px;
  width: 250px;
  height: 100%;
  background: #333;
  z-index: 100;
  margin-top: 100px;
  color: white;
  padding: 10px;
}
.slideout-menu h3 {
  position: relative;
  padding: 5px 5px;
  color: #fff;
  font-size: 1.2em;
  font-weight: 400;
  border-bottom: 4px solid #222;
}
.slideout-menu .slideout-menu-toggle {
  position: absolute;
  top: 12px;
  right: 10px;
  display: inline-block;
  padding: 6px 9px 5px;
  font-family: Arial, sans-serif;
  font-weight: bold;
  line-height: 1;
  background: #222;
  color: #999;
  text-decoration: none;
  vertical-align: top;
}
.slideout-menu .slideout-menu-toggle:hover {
  color: #fff;
}
.slideout-menu ul {
  list-style: none;
  font-weight: 300;
  border-top: 1px solid #151515;
  border-bottom: 1px solid #454545;
}
.slideout-menu ul li {
  border-top: 1px solid #454545;
  border-bottom: 1px solid #151515;
}
.slideout-menu ul li a {
  position: relative;
  display: block;
  padding: 10px;
  color: #999;
  text-decoration: none;
}
.slideout-menu ul li a:hover {
  background: #000;
  color: #fff;
}
.slideout-menu ul li a i {
  position: absolute;
  top: 15px;
  right: 10px;
  opacity: 0.5;
}
.btn-box-tool-lg {
  font-size: 16px;
  color: orange;
}
/*Form Wizard*/
.bs-wizard {
  margin-top: 20px;
  border-bottom: solid 1px #e0e0e0;
  padding: 0 0 10px 0;
}
.bs-wizard > .bs-wizard-step {
  padding: 0;
  position: relative;
}
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum {
  color: #595959;
  font-size: 16px;
  margin-bottom: 5px;
}
.bs-wizard > .bs-wizard-step .bs-wizard-info {
  color: #999;
  font-size: 14px;
}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot {
  position: absolute;
  width: 30px;
  height: 30px;
  display: block;
  background: #fbe8aa;
  top: 45px;
  left: 50%;
  margin-top: -15px;
  margin-left: -15px;
  border-radius: 50%;
}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {
  content: " ";
  width: 14px;
  height: 14px;
  background: #fbbd19;
  border-radius: 50px;
  position: absolute;
  top: 8px;
  left: 8px;
}
.bs-wizard > .bs-wizard-step > .progress {
  position: relative;
  border-radius: 0px;
  height: 8px;
  box-shadow: none;
  margin: 20px 0;
}
.bs-wizard > .bs-wizard-step > .progress > .progress-bar {
  width: 0px;
  box-shadow: none;
  background: #fbe8aa;
}
.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {
  width: 100%;
}
.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {
  width: 50%;
}
.bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {
  width: 0%;
}
.bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {
  width: 100%;
}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {
  background-color: #f5f5f5;
}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {
  opacity: 0;
}
.bs-wizard > .bs-wizard-step:first-child > .progress {
  left: 50%;
  width: 50%;
}
.bs-wizard > .bs-wizard-step:last-child > .progress {
  width: 50%;
}
.bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot {
  pointer-events: none;
}
/*END Form Wizard*/
.left-navblock {
  display: inline-block;
  text-align: left;
  color: white;
  padding: 0px;
  /* adjust based on your layout */
}
a.logo.no-hover a:hover {
  background-color: transparent;
}
.index-block {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.index-block:hover {
  overflow: visible;
  white-space: normal;
  height: auto;
}
input:required,
select:required,
textarea:required {
  border-right: 6px solid orange;
}
.sidebar-menu {
  font-size: 14px;
  white-space: normal;
}
@media print {
  a[href]:after {
    content: none;
  }
  .tab-content > .tab-pane {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
}
img.navbar-brand-img,
.navbar-brand > img {
  float: left;
  padding: 5px 5px 5px 0;
  max-height: 50px;
}
.input-daterange {
  border-radius: 0px;
}
[hidden] {
  display: none !important;
}
#toolbar {
  margin-top: 10px;
}
#uploadPreview {
  border-color: grey;
  border-width: 1px;
  border-style: solid;
}
.icon-med {
  font-size: 20px;
  color: #889195;
}
#login-logo {
  padding-top: 20px;
  padding-bottom: 10px;
  max-width: 200px;
}
.left-navblock {
  max-width: 500px;
}
.main-header .logo {
  background-color: inherit;
}
.main-header .logo {
  width: 100% !important;
  white-space: nowrap;
  text-align: left;
  display: block;
  clear: both;
}
.main-header .logoa:link,
.main-header .logo a:hover,
.main-header .logo a:visited {
  color: #fff;
}
.huge {
  font-size: 40px;
}
.btn-file {
  position: relative;
  overflow: hidden;
}
.dropdown-menu > li > a {
  color: #354044;
}
#sort tr.cansort {
  border-radius: 2px;
  padding: 10px;
  background: #f4f4f4;
  margin-bottom: 3px;
  border-inline: 2px solid #e6e7e8;
  color: #444;
  cursor: move;
}
.user-image-inline {
  float: left;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin-right: 10px;
}
.input-group .input-group-addon {
  background-color: #f4f4f4;
}
a.accordion-header {
  color: #333;
}
.dynamic-form-row {
  margin-bottom: 15px;
}
.dynamic-form-row::before,
.dynamic-form-row::after {
  content: " ";
  display: table;
}
.dynamic-form-row::after {
  clear: both;
}
.handle {
  padding-left: 10px;
}
.btn-file input[type=file] {
  position: absolute;
  top: 0;
  right: 0;
  min-width: 100%;
  min-height: 100%;
  font-size: 100px;
  text-align: right;
  filter: alpha(opacity=0);
  opacity: 0;
  outline: none;
  background: white;
  cursor: inherit;
  display: block;
}
.main-footer {
  font-size: 13px;
}
.main-header {
  max-height: 150px;
}
.navbar-nav > .user-menu > .dropdown-menu {
  width: inherit;
}
.main-header .logo {
  padding: 0px 5px 0px 15px;
}
.sidebar-toggle {
  margin-left: -48px;
  z-index: 100;
  background-color: inherit;
}
.sidebar-toggle-mobile {
  z-index: 100;
  width: 50px;
  padding-top: 10px;
}
.pull-text-right {
  text-align: right !important;
}
.main-header .sidebar-toggle:before {
  content: "\f0c9";
  font-weight: 900;
  font-family: 'Font Awesome\ 5 Free';
}
.direct-chat-contacts {
  padding: 10px;
  height: 150px;
}
.select2-container {
  width: 100%;
}
.error input {
  color: #a94442;
  border: 2px solid #a94442 !important;
}
.error label,
.alert-msg {
  color: #a94442;
  display: block;
}
.input-group[class*="col-"] {
  padding-right: 15px;
  padding-left: 15px;
}
.control-label.multiline {
  padding-top: 10px;
}
.btn-outline {
  color: inherit;
  background-color: transparent;
  transition: all 0.5s;
}
.btn-primary.btn-outline {
  color: #428bca;
}
.btn-success.btn-outline {
  color: #5cb85c;
}
.btn-info.btn-outline {
  color: #5bc0de;
}
.btn-warning {
  background-color: #f39c12 !important;
}
.btn-warning.btn-outline {
  color: #f0ad4e;
}
.btn-danger.btn-outline,
a.link-danger:link,
a.link-danger:visited,
a.link-danger:hover {
  color: #dd4b39;
}
.btn-primary:hover,
.btn-success:hover,
.btn-info:hover,
.btn-warning:hover,
.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-primary.btn-outline:hover,
.btn-success.btn-outline:hover,
.btn-info.btn-outline:hover,
.btn-warning.btn-outline:hover,
.btn-danger.btn-outline:hover {
  color: #fff !important;
}
.slideout-menu {
  position: fixed;
  top: 0;
  right: -250px;
  width: 250px;
  height: 100%;
  background: #333;
  z-index: 100;
  margin-top: 100px;
  color: white;
  padding: 10px;
}
.slideout-menu h3 {
  position: relative;
  padding: 5px 5px;
  color: #fff;
  font-size: 1.2em;
  font-weight: 400;
  border-bottom: 4px solid #222;
}
.slideout-menu .slideout-menu-toggle {
  position: absolute;
  top: 12px;
  right: 10px;
  display: inline-block;
  padding: 6px 9px 5px;
  font-family: Arial, sans-serif;
  font-weight: bold;
  line-height: 1;
  background: #222;
  color: #999;
  text-decoration: none;
  vertical-align: top;
}
.slideout-menu .slideout-menu-toggle:hover {
  color: #fff;
}
.slideout-menu ul {
  list-style: none;
  font-weight: 300;
  border-top: 1px solid #151515;
  border-bottom: 1px solid #454545;
}
.slideout-menu ul li {
  border-top: 1px solid #454545;
  border-bottom: 1px solid #151515;
}
.slideout-menu ul li a {
  position: relative;
  display: block;
  padding: 10px;
  color: #999;
  text-decoration: none;
}
.slideout-menu ul li a:hover {
  background: #000;
  color: #fff;
}
.slideout-menu ul li a i {
  position: absolute;
  top: 15px;
  right: 10px;
  opacity: 0.5;
}
.btn-box-tool-lg {
  font-size: 16px;
  color: orange;
}
.bs-wizard {
  margin-top: 20px;
}
/*Form Wizard*/
.bs-wizard {
  border-bottom: solid 1px #e0e0e0;
  padding: 0 0 10px 0;
}
.bs-wizard > .bs-wizard-step {
  padding: 0;
  position: relative;
}
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum {
  color: #595959;
  font-size: 16px;
  margin-bottom: 5px;
}
.bs-wizard > .bs-wizard-step .bs-wizard-info {
  color: #999;
  font-size: 14px;
}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot {
  position: absolute;
  width: 30px;
  height: 30px;
  display: block;
  background: #fbe8aa;
  top: 45px;
  left: 50%;
  margin-top: -15px;
  margin-left: -15px;
  border-radius: 50%;
}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {
  content: ' ';
  width: 14px;
  height: 14px;
  background: #fbbd19;
  border-radius: 50px;
  position: absolute;
  top: 8px;
  left: 8px;
}
.bs-wizard > .bs-wizard-step > .progress {
  position: relative;
  border-radius: 0px;
  height: 8px;
  box-shadow: none;
  margin: 20px 0;
}
.bs-wizard > .bs-wizard-step > .progress > .progress-bar {
  width: 0px;
  box-shadow: none;
  background: #fbe8aa;
}
.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {
  width: 100%;
}
.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {
  width: 50%;
}
.bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {
  width: 0%;
}
.bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {
  width: 100%;
}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {
  background-color: #f5f5f5;
}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {
  opacity: 0;
}
.bs-wizard > .bs-wizard-step:first-child > .progress {
  left: 50%;
  width: 50%;
}
.bs-wizard > .bs-wizard-step:last-child > .progress {
  width: 50%;
}
.bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot {
  pointer-events: none;
}
/**
Prevent step titles from wrapping to a second line at intermediate
widths (QA reported ~1265px). The .bs-wizard-dot is absolutely
positioned at top:45px per step, so any step whose stepnum grows
taller than one line pushes its progress bar down while its neighbours
stay high — the connecting line looks broken. Nowrap + ellipsis keeps
every stepnum a consistent single-line height so the line stays
level and threads through the dot centers as designed.
 */
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/*END Form Wizard*/
.left-navblock {
  display: inline-block;
  float: left;
  text-align: left;
  color: white;
  padding: 0px;
  /* adjust based on your layout */
}
.main-header .navbar .dropdown-menu li a {
  color: #333;
}
a.logo.no-hover a:hover {
  background-color: transparent;
}
input:required,
select:required {
  border-right: 5px solid orange;
}
select:required + .select2-container .select2-selection,
select:required + .select2-container .select2-selection .select2-selection--multiple {
  border-right: 5px solid orange !important;
}
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  font-size: 13px;
}
.sidebar-menu {
  font-size: 14px;
  white-space: normal;
}
.modal-warning .modal-help {
  color: #fff8af;
}
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading {
  z-index: 0 !important;
}
.bootstrap-table .fixed-table-container {
  overflow: hidden;
}
@media print {
  @page {
    size: A4;
    margin: 0mm;
  }
  .tab-content > .tab-pane {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  .img-responsive {
    width: 200px;
  }
  html,
  body {
    width: 1024px;
  }
  body {
    margin: 0 auto;
    line-height: 1em;
    word-spacing: 1px;
    letter-spacing: 0.2px;
    font: 15px "Times New Roman", Times, serif;
    width: 100%;
    float: none;
  }
  /* avoid page-breaks inside a listingContainer*/
  .listingContainer {
    page-break-inside: avoid;
  }
  h1 {
    font: 28px "Times New Roman", Times, serif;
  }
  h2 {
    font: 24px "Times New Roman", Times, serif;
  }
  h3 {
    font: 20px "Times New Roman", Times, serif;
  }
  /* Improve colour contrast of links */
  a:link,
  a:visited {
    color: #781351;
  }
  /* URL */
  a:link,
  a:visited {
    background: transparent;
    color: #333;
    text-decoration: none;
  }
  a[href]:after {
    content: "" !important;
  }
  a[href^="http://"] {
    color: #000;
  }
  #header {
    height: 75px;
    font-size: 24pt;
    color: black;
  }
  div.row-new-striped {
    margin: 0px;
    padding: 0px;
  }
  .pagination-detail,
  .fixed-table-toolbar {
    visibility: hidden;
  }
  .col-sm-1,
  .col-sm-2,
  .col-sm-3,
  .col-sm-4,
  .col-sm-5,
  .col-sm-6,
  .col-sm-7,
  .col-sm-8,
  .col-sm-9,
  .col-sm-10,
  .col-sm-11,
  .col-sm-12 .col-sm-pull-3 .col-sm-push-9 {
    float: left;
  }
  .col-sm-12 {
    width: 100%;
  }
  .col-sm-11 {
    width: 91.66666667%;
  }
  .col-sm-10 {
    width: 83.33333333%;
  }
  .col-sm-9 {
    width: 75%;
  }
  .col-sm-8 {
    width: 66.66666667%;
  }
  .col-sm-7 {
    width: 58.33333333%;
  }
  .col-sm-6 {
    width: 50%;
  }
  .col-sm-5 {
    width: 41.66666667%;
  }
  .col-sm-4 {
    width: 33.33333333%;
  }
  .col-sm-3 {
    width: 25%;
  }
  .col-sm-2 {
    width: 16.66666667%;
  }
  .col-sm-1 {
    width: 8.33333333%;
  }
}
.select2-selection__choice__remove {
  color: white !important;
}
.select2-selection--multiple {
  overflow-y: auto;
}
.select2-selection__choice {
  border-radius: 0px !important;
}
.select2-search select2-search--inline {
  height: 35px !important;
  float: left;
  margin: 0;
}
.select2-results__option {
  padding: 5px;
  -moz-user-select: none;
       user-select: none;
  -webkit-user-select: none;
  margin: 0px;
}
img.navbar-brand-img,
.navbar-brand > img {
  float: left;
  padding: 5px 5px 5px 0;
  max-height: 50px;
}
.asset-qr-img img {
  image-rendering: pixelated;
}
.input-daterange,
.input-daterange input:first-child,
.input-daterange input:last-child {
  border-radius: 0px !important;
}
.btn-checkin,
.btn-checkout {
  min-width: 90px;
}
[hidden] {
  display: none !important;
}
#toolbar {
  margin-top: 10px;
}
#uploadPreview {
  border-color: grey;
  border-width: 1px;
  border-style: solid;
}
.icon-med {
  font-size: 14px;
  color: #889195;
}
#login-logo {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 15px;
  max-width: 200px;
}
a.skip-main {
  left: -999px;
  position: absolute;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  z-index: -999;
}
a.skip-main:focus,
a.skip-main:active {
  color: #fff;
  background-color: #000;
  left: auto;
  top: auto;
  width: 30%;
  height: auto;
  overflow: auto;
  margin: 10px 35%;
  padding: 5px;
  border-radius: 15px;
  border: 4px solid yellow;
  text-align: center;
  font-size: 1.2em;
  z-index: 999;
}
h2 {
  font-size: 22px;
}
h2.task_menu {
  font-size: 14px;
}
h2 small {
  font-size: 85%;
}
h3 {
  font-size: 20px;
}
h4 {
  font-size: 16px;
}
.row-striped {
  vertical-align: top;
  line-height: 2.6;
  padding: 0px;
  margin-left: 20px;
  box-sizing: border-box;
  display: table;
}
.row-striped .row:nth-of-type(odd) div {
  background-color: #f9f9f9;
  border-top: 1px solid #dddddd;
  display: table-cell;
  word-wrap: break-word;
}
.row-striped .row:nth-of-type(even) div {
  background: #FFFFFF;
  border-top: 1px solid #dddddd;
  display: table-cell;
  word-wrap: break-word;
}
.row-new-striped {
  vertical-align: top;
  padding: 3px;
  display: table;
  width: 100%;
  word-wrap: break-word;
  table-layout: fixed;
}
/**
*  NEW STRIPING
*  This section is for the new row striping for nicer 
* display for non-table data as of v6
**/
.row-new-striped > .row:nth-of-type(even) {
  line-height: 1.9;
  display: table-row;
}
.row-new-striped > .row:nth-of-type(odd) {
  display: table-row;
  padding: 2px;
}
.row-new-striped div {
  display: table-cell;
  padding: 6px;
}
.row-new-striped div {
  display: table-cell;
  padding: 6px;
}
.row-new-striped div[class^="col"]:first-child {
  font-weight: bold;
}
/**
* This just adds a little extra padding on mobile
**/
@media only screen and (max-width: 520px) {
  h1.pagetitle {
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .firstnav {
    padding-top: 120px !important;
  }
  .product {
    width: 400px;
  }
  .product img {
    min-width: 400px;
  }
}
.card-view-title {
  min-width: 40% !important;
  line-height: 3 !important;
  padding-right: 20px;
}
.card-view {
  display: table-row;
  flex-direction: column;
}
/**

 COLUMN SELECTOR ICONS
 -----------------------------
 This is kind of weird, but it is necessary to prevent the column-selector code from barfing, since
 any HTML used in the UserPresenter "title" attribute breaks the column selector HTML.

 Instead, we use CSS to add the icon into the table header, which leaves the column selector
 "title" text as-is and hides the icon.

 See https://github.com/grokability/snipe-it/issues/7989
 */
thead th.css-accessory > .th-inner,
thead th.css-accessory-alt > .th-inner,
thead th.css-barcode > .th-inner,
thead th.css-component > .th-inner,
thead th.css-consumable > .th-inner,
thead th.css-envelope > .th-inner,
thead th.css-house-flag > .th-inner,
thead th.css-house-laptop > .th-inner,
thead th.css-house-user > .th-inner,
thead th.css-license > .th-inner,
thead th.css-location > .th-inner,
thead th.css-maintenances > .th-inner,
thead th.css-users > .th-inner,
thead th.css-currency > .th-inner,
thead th.css-child-locations > .th-inner,
thead th.css-history > .th-inner {
  font-size: 0px;
  line-height: 0.75 !important;
  text-align: left;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
thead th.css-location > .th-inner::before,
thead th.css-accessory > .th-inner::before,
thead th.css-accessory-alt > .th-inner::before,
thead th.css-barcode > .th-inner::before,
thead th.css-component > .th-inner::before,
thead th.css-consumable > .th-inner::before,
thead th.css-envelope > .th-inner::before,
thead th.css-house-flag > .th-inner::before,
thead th.css-house-laptop > .th-inner::before,
thead th.css-house-user > .th-inner::before,
thead th.css-license > .th-inner::before,
thead th.css-location > .th-inner::before,
thead th.css-maintenances > .th-inner::before,
thead th.css-users > .th-inner::before,
thead th.css-currency > .th-inner::before,
thead th.css-child-locations > .th-inner::before,
thead th.css-history > .th-inner::before {
  display: inline-block;
  font-size: 20px;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}
/**
BEGIN ICON TABLE HEADERS
Set the font-weight css property as 900 (For Solid), 400 (Regular or Brands), 300 (Light for pro icons).
**/
thead th.css-barcode > .th-inner::before {
  content: "\f02a";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}
thead th.css-license > .th-inner::before {
  content: "\f0c7";
  font-family: "Font Awesome 5 Free";
  font-weight: 400;
}
thead th.css-consumable > .th-inner::before {
  content: "\f043";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}
thead th.css-envelope > .th-inner::before {
  content: "\f0e0";
  font-family: "Font Awesome 5 Free";
  font-weight: 400;
}
thead th.css-accessory > .th-inner::before {
  content: "\f11c";
  font-family: "Font Awesome 5 Free";
  font-weight: 400;
}
thead th.css-users > .th-inner::before {
  content: "\f0c0";
  font-family: "Font Awesome 5 Free";
  font-size: 15px;
}
thead th.css-location > .th-inner::before {
  content: "\f3c5";
  font-family: "Font Awesome 5 Free";
  font-size: 19px;
  margin-bottom: 0px;
}
thead th.css-maintenances > .th-inner::before {
  content: "\f7d9";
  font-family: "Font Awesome 5 Free";
  font-size: 18px;
  margin-bottom: 0px;
}
thead th.css-component > .th-inner::before {
  content: "\f0a0";
  font-family: "Font Awesome 5 Free";
  font-weight: 500;
}
thead th.css-padlock > .th-inner::before {
  content: "\f023";
  font-family: "Font Awesome 5 Free";
  font-weight: 800;
  padding-right: 3px;
}
thead th.css-house-user > .th-inner::before {
  content: "\e1b0";
  font-family: "Font Awesome 5 Free";
  font-size: 19px;
  margin-bottom: 0px;
}
thead th.css-house-flag > .th-inner::before {
  content: "\e50d";
  font-family: "Font Awesome 5 Free";
  font-size: 19px;
  margin-bottom: 0px;
}
thead th.css-house-laptop > .th-inner::before {
  content: "\e066";
  font-family: "Font Awesome 5 Free";
  font-size: 19px;
  margin-bottom: 0px;
}
thead th.css-accessory-alt > .th-inner::before {
  content: "\f11c";
  font-family: "Font Awesome 5 Free";
  font-size: 19px;
  margin-bottom: 0px;
}
thead th.css-child-locations > .th-inner::before {
  content: "\f64f";
  font-family: "Font Awesome 5 Free";
  font-size: 19px;
  margin-bottom: 0px;
}
thead th.css-currency > .th-inner::before {
  content: "\24";
  font-family: "Font Awesome 5 Free";
  font-size: 19px;
  margin-bottom: 0px;
}
thead th.css-history > .th-inner::before {
  content: "\f1da";
  font-family: "Font Awesome 5 Free";
  font-size: 19px;
  margin-bottom: 0px;
}
.small-box .inner {
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 15px;
  color: #fff;
}
.small-box > a:link,
.small-box > a:visited,
.small-box > a:hover {
  color: #fff;
}
.select2-container--default .select2-selection--single,
.select2-selection .select2-selection--single {
  border: 1px solid #d2d6de;
  border-radius: 0;
  padding: 6px 12px;
  height: 34px;
}
.form-group.has-error label,
.form-group.has-error .help-block {
  color: #a94442;
}
.select2-container--default .select2-selection--multiple {
  border-radius: 0px;
}
@media screen and (max-width: 511px) {
  .tab-content .tab-pane .alert-block {
    margin-top: 120px;
  }
  .sidebar-menu {
    margin-top: 160px;
  }
}
@media screen and (max-width: 912px) and (min-width: 512px) {
  .sidebar-menu {
    margin-top: 100px;
  }
  .navbar-custom-menu > .navbar-nav > li.dropdown.user.user-menu {
    float: right;
  }
  .navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
    margin-right: -39px;
  }
}
@media screen and (max-width: 1268px) and (min-width: 912px) {
  .sidebar-menu {
    margin-top: 50px;
  }
}
@media screen and (max-width: 992px) {
  .info-stack-container {
    flex-direction: column;
  }
  .col-md-3.col-xs-12.col-sm-push-9.info-stack {
    left: auto;
    order: 1;
  }
  .col-md-9.col-xs-12.col-sm-pull-3.info-stack {
    right: auto;
    order: 2;
  }
  .info-stack-container > .col-md-9.col-xs-12.col-sm-pull-3.info-stack > .row-new-striped > .row > .col-sm-2 {
    width: auto;
    float: none;
  }
}
@media screen and (max-width: 992px) {
  .row-new-striped div {
    width: 100%;
  }
}
@media screen and (max-width: 1318px) and (min-width: 1200px) {
  .admin.box {
    height: 170px;
  }
}
@media screen and (max-width: 1494px) and (min-width: 1200px) {
  .dashboard.small-box {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 188px;
    display: block;
    overflow: hidden;
  }
}
/** Form-stuff overrides for checkboxes and stuff **/
label.form-control {
  display: grid;
  grid-template-columns: 1.8em auto;
  gap: 0.5em;
  border: 0px;
  padding-left: 0px;
  background-color: inherit;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}
label.form-control--disabled {
  color: #959495;
  cursor: not-allowed;
}
/** Bootstrap's normalize.less sets `html input[disabled] { cursor: default }`
    at load-order line 139, and its own `.form-control[disabled] { cursor: not-allowed }`
    rule (line 2705) has higher specificity so it should win — but on some browser +
    input-group combinations the resolved cursor still ends up as `text` because the
    input-group parent's implicit text-cursor bleeds through. Explicit element-scoped
    override to lock in the "no-entry" cursor on any disabled form control. **/
input.form-control[disabled],
select.form-control[disabled],
textarea.form-control[disabled] {
  cursor: not-allowed;
}
/** Anti-autofill masking for the readonly-plus-onfocus-strip trick used on
    sensitive form fields (user create/edit username, password, email, etc.).
    The field ships with `readonly` so password managers won't prefill or
    overwrite it, then strips readonly on focus so the operator can type.
    Bootstrap's `.form-control[readonly]` styles that field with a gray
    disabled-looking background, which confuses the operator into thinking
    the field is uneditable. Override to make it visually indistinguishable
    from a regular editable input.
    Scoped to `.js-antifill-readonly` so legitimately-readonly fields
    (SAML SP entity ID, ACS/SLS URLs, generated cert, metadata URL, etc.)
    keep the gray-out styling from the readonly rule further down in this
    file. Adding `readonly` alone should look readonly; opt in to the
    autofill-masking override by adding the class explicitly.
    Deliberately does NOT match `[disabled]` — actually-disabled fields
    (demo mode locks, permission gates) must keep their grayed appearance
    and not-allowed cursor. **/
input.js-antifill-readonly[readonly],
textarea.js-antifill-readonly[readonly],
.form-control.js-antifill-readonly[readonly] {
  cursor: text !important;
  background-color: var(--table-stripe-bg) !important;
  color: var(--color-fg) !important;
}
/** Inline "this field is locked because the app is in demo mode" callout.
    Rendered by the <x-demo-lock> anonymous component in resources/views/blade/demo-lock.blade.php.
    Kept as a small inline-block box so it hugs its text width regardless
    of the column it lands in (input rows use col-md-7, activated row
    uses col-md-9, so a block-level notice would stretch inconsistently). **/
.demo-lock-notice {
  display: inline-block;
  background-color: #fcf8e3;
  border: 1px solid #faebcc;
  color: #8a6d3b;
  padding: 6px 10px;
  margin-top: 6px;
  border-radius: 3px;
  font-size: 0.9em;
}
/** --------------------------------------- **/
/** Start checkbox styles to replace iCheck **/
/** --------------------------------------- **/
input[type="checkbox"] {
  /* Add if not using autoprefixer */
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  /* For iOS < 15 to remove gradient background */
  background-color: #fff;
  /* Not removed via appearance */
  margin: 0;
  font: inherit;
  color: #959495;
  width: 1.8em;
  height: 1.8em;
  border: 0.05em solid;
  border-radius: 0em;
  transform: translateY(-0.075em);
  display: grid;
  place-content: center;
  /*Windows High Contrast Mode*/
}
/** This sets the display of a checkbox, and what the "fill" checkmark should look like */
input[type="checkbox"]::before {
  /** If you want to use the non-checkbox, filled square, use this instead **/
  box-shadow: inset 1em 1em #d3d3d3;
  content: "";
  width: 1em;
  height: 1em;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  transform: scale(0);
  transform-origin: bottom left;
  transition: 120ms transform ease-in-out;
  box-shadow: inset 1em 1em #428bca;
  /* Windows High Contrast Mode */
  background-color: CanvasText;
}
/** This sets the size of the scale up for the shape we defined above **/
input[type="checkbox"]:checked::before {
  transform: scale(1);
}
/** This sets the scale and color of the DISABLED but CHECKED checkbox */
input[type=checkbox]:disabled::before,
input[type=radio]:disabled::before {
  content: "";
  width: 1em;
  height: 1em;
  transform: scale(1);
  box-shadow: inset 1em 1em #d3d3d3;
}
/* This sets the scale and style of a DISABLED checkbox that is NOT checked */
input[type=checkbox]:disabled:not(:checked)::before,
input[type=radio]:disabled:not(:checked)::before {
  content: "";
  transform: scale(0);
  cursor: not-allowed;
  pointer-events: none;
}
/** this is the color of the checkbox and content on a disabled, checked box **/
input[type=checkbox]:disabled,
input[type=radio]:disabled {
  --form-control-color: #d3d3d3;
  color: #959495;
  cursor: not-allowed;
  pointer-events: none;
}
/** Radio styles to replace iCheck **/
input[type="radio"] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background-color: #fff;
  margin: 0;
  font: inherit;
  color: #959495;
  width: 1.8em;
  height: 1.8em;
  border: 0.05em solid;
  border-radius: 50%;
  transform: translateY(-0.075em);
  display: grid;
  place-content: center;
}
input[type="radio"]::before {
  content: "";
  width: 1em;
  height: 1em;
  border-radius: 50%;
  transform: scale(0);
  transition: 120ms transform ease-in-out;
}
input[type="radio"]:checked::before {
  transform: scale(1);
}
/**
* This addresses the column selector in bootstrap-table. Without these two lines, the
* checkbox and the <span></span> with the label text that BS tables generates will
* end up on two different lines and it looks assy.
 */
.dropdown-item-marker input[type=checkbox] {
  font-size: 10px;
}
.bootstrap-table .fixed-table-toolbar li.dropdown-item-marker label {
  font-weight: normal;
  display: grid;
  grid-template-columns: 0.1em auto;
  gap: 1.5em;
}
.container.row-striped .col-md-6 {
  overflow-wrap: anywhere;
}
.nav-tabs-custom > .nav-tabs > li {
  z-index: 1;
}
.select2-container .select2-search--inline .select2-search__field {
  padding-left: 15px;
}
.nav-tabs-custom > .nav-tabs > li.active {
  font-weight: bold;
}
/** --------------------------------------- **/
/** End checkbox styles to replace iCheck   **/
/** --------------------------------------- **/
/**
/** Separator styles with text in the middle. Currently only used by the login page but
/** could be used elsewhere.
 */
.separator {
  display: flex;
  align-items: center;
  text-align: center;
  padding-top: 20px;
  color: #959495;
}
.separator::before,
.separator::after {
  content: '';
  flex: 1;
  border-bottom: 1px solid #959495;
}
.separator:not(:empty)::before {
  margin-right: 0.25em;
}
.separator:not(:empty)::after {
  margin-left: 0.25em;
}
.datepicker.dropdown-menu {
  z-index: 1030 !important;
}
.sidebar-menu > li .badge {
  margin-top: 0px;
  filter: brightness(70%);
  font-size: 70%;
}
/** this is needed to override ekko-lightboxes card view styles **/
.bootstrap-table .fixed-table-container .table tbody tr .card-view {
  display: table-row !important;
}
td.text-right.text-padding-number-cell {
  padding-right: 30px !important;
  white-space: nowrap;
}
th.text-right.text-padding-number-footer-cell {
  padding-right: 20px !important;
  white-space: nowrap;
}
code.single-line {
  white-space: pre-wrap;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  max-width: 400px;
}
p.monospace,
span.monospace {
  font-family: monospace, monospace;
}
legend.highlight {
  background: repeating-linear-gradient(45deg, #222d32, #222d32 10px, #444 10px, #444 11px);
  color: #fff;
  font-size: 18px;
  padding: 6px 6px 6px 10px;
}
legend.highlight a {
  color: #fff;
  cursor: pointer;
}
fieldset.bottom-padded {
  padding-bottom: 20px;
}
caption.tableCaption {
  font-size: 18px;
  padding-left: 8px;
}
.markdown-field-content h1 {
  font-size: 22px;
  font-weight: 700;
  margin: 6px 0 4px;
}
.markdown-field-content h2 {
  font-size: 20px;
  font-weight: 700;
  margin: 6px 0 4px;
}
.markdown-field-content h3 {
  font-size: 18px;
  font-weight: 700;
  margin: 6px 0 4px;
}
.markdown-field-content h4 {
  font-size: 16px;
  font-weight: 700;
  margin: 4px 0 4px;
}
.markdown-field-content h5,
.markdown-field-content h6 {
  font-size: 14px;
  font-weight: 700;
  margin: 4px 0 4px;
}
.markdown-field-content p {
  margin: 0 0 4px;
}
.markdown-field-content p:last-child {
  margin-bottom: 0;
}
.markdown-field-content ul,
.markdown-field-content ol {
  margin: 0 0 4px;
  padding-left: 20px;
}
.markdown-field-content > *:first-child {
  margin-top: 0;
}
.sidebar-toggle.btn {
  border-radius: 3px;
  box-shadow: none;
  border-top: 0px solid transparent;
  border-bottom: 0px solid transparent;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 12px;
  padding-bottom: 12px;
  margin-left: -47px;
  margin-top: 2px;
}
.visually-hidden {
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: preserve;
  display: inline-block;
}
input[name="columnsSearch"] {
  width: 120px;
}
.callout.callout-legend {
  padding: 15px 30px 15px 15px;
  font-size: 100%;
  border-radius: 0px;
}
.callout.callout-legend h4 {
  font-size: 16px;
  font-weight: bold;
  margin-top: 5px;
  margin-bottom: 0px;
}
.callout.callout-legend a {
  text-decoration: none;
  cursor: pointer;
}
p.callout-subtext {
  margin-top: 5px;
}
/**
This just hides the padding on the right side of the mark tag for a less weird visual experience
 */
mark {
  padding-right: 0px;
}
/**
Radio toggle styles for permission settings and check/uncheck all
 */
.radio-toggle-wrapper {
  display: flex;
  padding: 2px;
  background-color: #e9e9e9;
  margin-bottom: 3px;
  border-radius: 4px;
  border: 1px #d6d6d6 solid;
}
.radio-slider-inputs {
  flex-grow: 1;
}
.radio-slider-inputs input[type=radio] {
  display: none;
}
.radio-slider-inputs label {
  display: block;
  margin-bottom: 0px;
  padding: 6px 8px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  transition: all 0.4s 0s ease;
  cursor: pointer;
}
.radio-slider-inputs label {
  color: #9a9999;
  border-radius: 4px;
  border: 1px transparent solid;
}
.radio-slider-inputs .allow:checked + label {
  background-color: green;
  color: white;
  border-radius: 4px;
  border: 1px transparent solid;
}
.radio-slider-inputs .inherit:checked + label {
  background-color: rgba(255, 204, 51, 0.11);
  color: #9a9999;
  border-radius: 4px;
  border: 1px white solid;
}
.radio-slider-inputs .deny:checked + label {
  background-color: #a94442;
  color: white;
  border-radius: 4px;
  border: 1px transparent solid;
}
.remember-toggle {
  cursor: pointer;
}
.js-copy-link {
  float: left;
  color: grey;
}
.deleted {
  text-decoration: line-through;
}
@media (max-width: 767px) {
  .nav-tabs.nav-tabs-dropdown,
  .nav-tabs-dropdown {
    overflow: hidden;
    position: relative;
  }
  .nav-tabs.nav-tabs-dropdown::after,
  .nav-tabs-dropdown::after {
    content: "☰";
    position: absolute;
    font-size: 35px;
    top: 0;
    right: 15px;
    z-index: 2;
    pointer-events: none;
  }
  .nav-tabs.nav-tabs-dropdown.open a,
  .nav-tabs-dropdown.open a {
    position: relative;
    display: block;
  }
  .nav-tabs.nav-tabs-dropdown.open > li.active > a,
  .nav-tabs-dropdown.open > li.active > a {
    background-color: #eeeeee;
  }
  .nav-tabs.nav-tabs-dropdown li.snipetab,
  .nav-tabs-dropdown li.snipetab {
    margin-right: 0 !important;
  }
  .nav-tabs.nav-tabs-dropdown li,
  .nav-tabs-dropdown li {
    display: block;
    padding: 0;
    vertical-align: bottom;
    white-space: nowrap !important;
  }
  .nav-tabs.nav-tabs-dropdown > li > a,
  .nav-tabs-dropdown > li > a {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    display: inline-block;
    border-color: transparent;
  }
  .nav-tabs.nav-tabs-dropdown > li > a:focus,
  .nav-tabs-dropdown > li > a:focus,
  .nav-tabs.nav-tabs-dropdown > li > a:hover,
  .nav-tabs-dropdown > li > a:hover,
  .nav-tabs.nav-tabs-dropdown > li > a:active,
  .nav-tabs-dropdown > li > a:active {
    border-color: transparent;
    border-right: 0 !important;
  }
  .nav-tabs.nav-tabs-dropdown > li.active > a,
  .nav-tabs-dropdown > li.active > a {
    display: block;
    border-color: transparent !important;
    position: relative;
    z-index: 1;
  }
  .nav-tabs.nav-tabs-dropdown > li.active > a:focus,
  .nav-tabs-dropdown > li.active > a:focus,
  .nav-tabs.nav-tabs-dropdown > li.active > a:hover,
  .nav-tabs-dropdown > li.active > a:hover,
  .nav-tabs.nav-tabs-dropdown > li.active > a:active,
  .nav-tabs-dropdown > li.active > a:active {
    border-color: transparent !important;
  }
}
.nav-tabs.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all,
.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all,
.nav-tabs.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:link,
.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:link,
.nav-tabs.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:visited,
.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:visited,
.nav-tabs.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:hover,
.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:hover,
.nav-tabs.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:focus,
.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:focus,
.nav-tabs.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:active,
.nav-tabs-dropdown .snipe-advanced-search-tags-clear-all:active {
  color: #fff !important;
  text-decoration: none;
}
.tooltip-spin-hover:hover i,
.tooltip-spin-hover:focus i {
  animation: fa-spin 2s infinite linear;
}
@media (min-width: 992px) {
  .modal-xl {
    width: 90%;
    max-width: 1400px;
  }
}
.modal-xl .modal-body {
  max-height: calc(100vh - 200px);
  overflow-y: auto;
  overflow-x: hidden;
}
.modal-xl .modal-body.form-horizontal > .form-group,
.modal-xl .modal-body.form-horizontal > .row > .form-group {
  margin-left: 0;
  margin-right: 0;
}
[data-theme="dark"] .bs-wizard > .bs-wizard-step .bs-wizard-stepnum,
[data-theme="dark"] .bs-wizard > .bs-wizard-step .bs-wizard-info {
  color: #d0d0d0;
}
@media (prefers-reduced-motion: reduce) {
  [class*="faa-"].animated,
  [class*="faa-"].animated-hover:hover,
  .tooltip-spin-hover:hover i,
  .tooltip-spin-hover:focus i,
  .fa-spin,
  .fa-pulse {
    animation: none !important;
  }
}
:root {
  color-scheme: light dark;
  --color-bg: light-dark(#ecf0f5, #222222);
  --btn-theme-hover-text-color: light-dark(hsl(from var(--main-theme-color) h s calc(l - 10)),hsl(from var(--main-theme-color) h s calc(l - 10)));
  --btn-theme-hover: light-dark(hsl(from var(--main-theme-color) h s calc(l - 10)),hsl(from var(--main-theme-color) h s calc(l - 10)));
  --btn-theme-text-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 10)),hsl(from var(--main-theme-color) h s calc(l - 10)));
  --color-fg: light-dark(#373636, #ffffff);
  --main-footer-bg-color: light-dark(#ffffff,#3d4144);
  --main-footer-text-color: light-dark(#605e5e, #d2d6de);
  --main-footer-top-border-color: light-dark(#d2d6de,#605e5e);
  --main-theme-color: #3c8dbc;
  --nav-hover-text-color: hsl(from var(--main-theme-color) h s calc(l - 10));
  --nav-primary-text-color: #ffffff;
  --search-highlight: #e9d15b;
  --sidenav-hover-color-bg: #4c4b4b;
  --sidenav-text-hover-color: #fff;
  --sidenav-text-nohover-color: #b8c7ce;
  --table-border-row-color: light-dark(#ecf0f5, #656464);
  --table-border-row-top: 1px solid #ecf0f5;
  --table-border-row: 1px solid var(--table-border-row-color);
  --table-stripe-bg-alt: light-dark(rgba(211, 211, 211, 0.25), #323131);
  --table-stripe-bg: light-dark(#ffffff, #494747);
  --text-danger: light-dark(#a94442, #fa5b48);
  --text-help: light-dark(#777676,#a6a4a4);
  --text-info: light-dark(#31708f,#2baae6);
  --text-success: light-dark(#039516,#4ced61);
  --text-warning: light-dark(#da9113,#f3a51f);
  --input-border-color: light-dark(#d2d6de,#656464);
  --default-label-link-bg: var(--color-bg);
  --default-label-link-text: light-dark(#296282, #5fa4cc);
  --default-label-link-border: 1px solid light-dark(#b8c7ce, #494747);
}
[data-theme="light"] {
  color-scheme: light;
  --box-bg: #ffffff;
  --box-header-bottom-border-color: #f4f4f4;
  --box-header-bottom-border: 1px solid var(--box-header-bottom-border-color);
  --box-header-top-border-color: #d2d6de;
  --box-header-top-border: 3px solid var(--box-header-top-border-color);
  --btn-theme-base: hsl(from var(--main-theme-color) h s calc(l + 5));
  --btn-theme-border: hsl(from var(--btn-theme-base) h s calc(l + 20));
  --btn-theme-hover-text-color: var(--nav-primary-text-color);
  --btn-theme-hover: var(--main-theme-hover);
  --callout-bg-color: var(--box-header-bottom-border-color);
  --callout-left-border: var(--box-header-top-border-color);
  --header-color: #000000;
  --input-group-bg: hsl(from var(--box-bg) h s calc(l - 5));
  --input-group-fg: hsl(from var(--input-group-bg) h s calc(l - 50));
  --link-color: #296282;
  --link-hover: hsl(from var(--link-color) h s calc(l - 10));
  --main-theme-hover: hsl(from var(--main-theme-color) h s calc(l - 10));
  --tab-bottom-border: 1px solid var(--box-header-top-border-color);
  --text-legend-help: var(--text-help);
}
[data-theme="dark"] {
  color-scheme: dark;
  --box-bg: #3d4144;
  --box-header-bottom-border-color: #605e5e;
  --box-header-bottom-border: 1px solid var(--box-header-bottom-border-color);
  --box-header-top-border-color: #605e5e;
  --box-header-top-border: 3px solid var(--box-header-top-border-color);
  --btn-theme-base: hsl(from var(--main-theme-color) h s calc(l + 5));
  --btn-theme-border: hsl(from var(--btn-theme-base) h s calc(l + 20));
  --btn-theme-hover-text-color: var(--nav-primary-text-color);
  --btn-theme-hover: var(--main-theme-hover);
  --callout-bg-color: var(--box-header-top-border-color);
  --callout-left-border: #323131;
  --header-color: #ffffff;
  --input-group-bg: hsl(from var(--box-bg) h s calc(l + 10));
  --input-group-fg: hsl(from var(--input-group-bg) h s calc(l + 50));
  --link-color: #5fa4cc;
  --link-hover: hsl(from var(--link-color) h s calc(l + 15));
  --main-theme-hover: hsl(from var(--main-theme-color) h s calc(l - 10));
  --tab-bottom-border: 1px solid var(--box-header-top-border-color);
  --text-legend-help: #d6d6d6;
}
.label2_fields,
.l2fd-main,
.l2fd-listitem,
.fixed-table-loading,
.list-group-item {
  background-color: var(--box-bg) !important;
  color: var(--color-fg) !important;
}
.list-group-item {
  border: var(--tab-bottom-border);
}
footer.main-footer {
  color: var(--main-footer-text-color) !important;
  background-color: var(--main-footer-bg-color) !important;
  border-top: 1px solid var(--main-footer-top-border-color) !important;
}
a,
a:link,
a:visited {
  color: var(--link-color);
}
a:hover,
a:focus {
  color: var(--link-hover) !important;
}
label.form-control {
  color: var(--color-fg) !important;
}
.footer-links a {
  color: var(--link-color) !important;
}
h2 small {
  color: var(--color-fg) !important;
}
.btn-theme {
  background-color: var(--btn-theme-base);
  /*color: var(--btn-theme-hover-text-color) !important;*/
  color: var(--nav-primary-text-color) !important;
  border: 1px solid hsl(from var(--btn-theme-base) h s calc(l - 15)) !important;
}
.btn-theme:hover {
  background-color: var(--btn-theme-hover);
  /*color: var(--btn-theme-hover-text-color) !important;*/
  color: var(--nav-primary-text-color) !important;
  border: 1px solid hsl(from var(--btn-theme-base) h s calc(l - 15)) !important;
}
.btn-theme.active {
  background-color: var(--btn-theme-hover) !important;
}
.btn-theme:focus {
  color: var(--nav-primary-text-color) !important;
}
.dropdown-wrapper,
.js-data-ajax,
.option,
.select2 .select2-container .select2-container--default,
.select2,
.select2-choice,
.select2-container,
.select2-results__option,
.select2-search input,
.select2-search--dropdown,
.select2-search__field,
.select2-selection .select2-selection--single,
.select2-selection,
.select2-selection--single,
.select2-selection__rendered,
input[type="date"],
input[type="number"],
input[type="text"],
input[type="url"],
input[type="email"],
input[type="password"],
input[type="tel"],
option:active,
option[active],
option[selected],
select option,
select,
textarea {
  background-color: var(--table-stripe-bg) !important;
  color: var(--color-fg) !important;
  border-color: var(--input-border-color) !important;
}
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default .select2-search--dropdown .select2-search__field {
  border-color: hsl(from var(--main-theme-color) h s calc(l - 5)) !important;
}
/**
Safari ignores option[selected] styling on plain <select multiple> until
the user interacts with the list, so pre-selected options render with
the browser's default light highlight. Force a lighter background on the
whole select in dark mode so pre-selected items stay readable.
 */
[data-theme="dark"] select[multiple],
[data-theme="dark"] select[multiple] option {
  background-color: #d2d6de !important;
  color: #373636 !important;
}
/**
Site-logo preview swatch on Settings > Branding. Uses the tenant header
color as its background so the logo shows against the same color it will
have in the top nav. The header-color picker on the branding page writes
--main-theme-color inline on <html> for live preview, so this rule picks
up that update automatically.
 */
.header-preview {
  background-color: var(--main-theme-color);
}
/**
Multiselect maybe?
 */
.select2-results__option[aria-selected=true] {
  background-color: var(--main-theme-color) !important;
  color: var(--nav-primary-text-color) !important;
}
.select2-results__option[aria-selected=false] {
  background-color: var(--table-stripe-bg) !important;
  /*background-color: hsl(from var(--main-theme-color) h s calc(l - 15)) !important;*/
  /*color: var(--nav-primary-text-color) !important;*/
  color: var(--color-fg) !important;
}
/**
Highlight the select2 on hover when NOT the selected option
 */
.select2-results__option--highlighted[aria-selected=false] {
  background-color: hsl(from var(--main-theme-color) h s calc(l - 10)) !important;
  color: var(--nav-primary-text-color) !important;
}
/**
Highlight the select2 on hover when the selected option
 */
.select2-results__option--highlighted[aria-selected=true],
.select2-results__option--highlighted[aria-selected=true]:hover,
.select2-results__option--highlighted[aria-selected=true]:link,
.select2-results__option--highlighted[aria-selected=true]:focus,
.select2-results__option--highlighted[aria-selected=true]:visited {
  background-color: hsl(from var(--main-theme-color) h s calc(l - 15)) !important;
  /*color: var(--color-fg) !important;*/
  color: var(--nav-primary-text-color) !important;
}
.select2-selection__choice,
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: var(--main-theme-color) !important;
  border-color: hsl(from var(--main-theme-color) h s calc(l - 15)) !important;
  color: var(--nav-primary-text-color) !important;
}
.select2-selection__choice__remove {
  color: var(--nav-primary-text-color) !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: hsl(from var(--main-theme-color) h s calc(l - 5)) !important;
  color: var(--nav-primary-text-color) !important;
  overflow-y: auto;
}
/*
eonasdan bootstrap-datetimepicker widget: match the app's theme color
for selected/today cells and follow light/dark mode for the popup
chrome. Ships with Bootstrap's stock #337ab7 which looks off next to
AdminLTE.

- All toolbar buttons: .bootstrap-datetimepicker-widget li.picker-switch a[data-action]
- Individual buttons: a[data-action="today"], a[data-action="clear"], a[data-action="close"]                                                                                                                       - -
- The <td> cell each button sits in: .bootstrap-datetimepicker-widget li.picker-switch td
- The icon <span> inside the anchor: .bootstrap-datetimepicker-widget li.picker-switch a[data-action] > span
*/
.bootstrap-datetimepicker-widget {
  z-index: 1030 !important;
  background-color: var(--box-bg) !important;
  color: var(--color-fg) !important;
}
/* Widget border in the theme color so the popup edge visually
   matches other themed boxes in the app. */
.bootstrap-datetimepicker-widget.dropdown-menu {
  border: 1px solid var(--main-theme-color) !important;
}
/* The connecting caret between the input and the popup is drawn
   with two triangles: :before is the outer border outline (7px),
   :after is the inner fill (6px, sits inside the :before). Match
   the widget's own theme-color border on the outer triangle, and
   the widget's background on the inner. */
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before {
  border-bottom-color: var(--main-theme-color) !important;
}
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
  border-bottom-color: var(--box-bg) !important;
}
.bootstrap-datetimepicker-widget.dropdown-menu.top:before {
  border-top-color: var(--main-theme-color) !important;
}
.bootstrap-datetimepicker-widget.dropdown-menu.top:after {
  border-top-color: var(--box-bg) !important;
}
/* Side-by-side (date + time) mode ships at 38em, not wide enough
   once the format includes seconds. Bump up to give the time cells
   room. */
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
  width: 42em !important;
}
/* Compact (non-sideBySide) mode. Library default is 19em, which is
   too narrow for the time-picker view — hour/minute/second cells
   are 54px each and the increment/decrement arrow buttons add width
   on top of that, so under ~300px the time view gets clipped. Sizing
   to fit the widest child (the time view) also gives the calendar
   view plenty of room. */
.bootstrap-datetimepicker-widget.dropdown-menu:not(.timepicker-sbs) {
  min-width: 320px;
}
.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover,
.bootstrap-datetimepicker-widget table td span.active,
.bootstrap-datetimepicker-widget table td span.active:hover {
  background-color: var(--main-theme-color) !important;
  color: var(--nav-primary-text-color) !important;
  text-shadow: none !important;
}
.bootstrap-datetimepicker-widget table td.today:before {
  border-bottom-color: var(--main-theme-color) !important;
}
/* Cell hover: theme color background + white text — same shape as
   "active" so contrast is guaranteed in both light and dark mode. */
.bootstrap-datetimepicker-widget table td:hover,
.bootstrap-datetimepicker-widget table td span:hover,
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
  background-color: var(--main-theme-color) !important;
  color: var(--nav-primary-text-color) !important;
}
/* Time-picker text (compact mode). Bootstrap's .btn base color is
   #333 which is invisible on the dark box-bg in dark mode; force
   these text elements to inherit the widget's --color-fg instead
   so they read in both themes.
     - .timepicker-hour / -minute / -second : the big clickable digits
     - .separator                            : the colon between them
     - .timepicker-picker .btn               : the up/down arrow buttons
     - .timepicker-picker .btn span          : the FA icon inside those
     - .timepicker-hours / -minutes / -seconds .btn : the expanded grid
       of pickable hour/minute/second numbers when you click a digit  */
.bootstrap-datetimepicker-widget .timepicker-hour,
.bootstrap-datetimepicker-widget .timepicker-minute,
.bootstrap-datetimepicker-widget .timepicker-second,
.bootstrap-datetimepicker-widget .separator,
.bootstrap-datetimepicker-widget .timepicker-picker .btn,
.bootstrap-datetimepicker-widget .timepicker-picker .btn span,
.bootstrap-datetimepicker-widget .timepicker-hours td,
.bootstrap-datetimepicker-widget .timepicker-minutes td,
.bootstrap-datetimepicker-widget .timepicker-seconds td {
  color: var(--color-fg) !important;
}
/* The empty <td class="separator"> cells above and below the ":"
   are pure spacers, but were rendering visible "lines" around the
   colon. Force their background to match the popup so they blend
   into the widget in both light and dark mode.

   Also kill the ::before / ::after pseudo-elements — the app's own
   .separator class elsewhere in the codebase draws horizontal grey
   border-bottom lines via those pseudos (for section dividers), and
   class-name collides with the library's timepicker separator td. */
.bootstrap-datetimepicker-widget .separator {
  background-color: var(--box-bg) !important;
  border: none !important;
  box-shadow: none !important;
}
.bootstrap-datetimepicker-widget .separator::before,
.bootstrap-datetimepicker-widget .separator::after {
  display: none !important;
  content: none !important;
  border: none !important;
}
/* Same treatment for the increment/decrement arrow buttons — no
   border/box-shadow/focus outline so the time-picker column doesn't
   get sub-lines between each button. */
.bootstrap-datetimepicker-widget .timepicker-picker .btn {
  background-color: var(--box-bg) !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}
.bootstrap-datetimepicker-widget .timepicker-picker .btn:focus,
.bootstrap-datetimepicker-widget .timepicker-picker .btn:active {
  outline: none !important;
  box-shadow: none !important;
}
/* Button hover — matches the whole <a> element */
.bootstrap-datetimepicker-widget li.picker-switch a[data-action]:hover,
.bootstrap-datetimepicker-widget li.picker-switch td:hover {
  background-color: transparent !important;
  border-radius: 0 !important;
}
.input-group-addon {
  background-color: var(--input-group-bg) !important;
  color: var(--input-group-fg) !important;
  border-color: var(--input-border-color) !important;
}
input:disabled,
input[type="checkbox"]:disabled,
input[type="radio"]:disabled,
input[readonly],
textarea[readonly],
textarea:disabled,
.select2-container--default.select2-container--disabled .select2-selection--single,
.select2-container--default.select2-container--disabled .select2-selection--multiple,
.select2-container--default.select2-container--disabled .select2-selection__rendered,
.select2-results__option[aria-disabled=true],
.select2-container--default.select2-container--disabled .select2-selection--multiple .select2-search--inline {
  background-color: light-dark(rgb(234, 232, 232), rgb(117, 116, 117)) !important;
  cursor: not-allowed !important;
}
.select2-container--default.select2-container--disabled .select2-search__field::-moz-placeholder {
  color: var(--text-help) !important;
  opacity: 1 !important;
}
.select2-container--default.select2-container--disabled .select2-search__field::placeholder {
  color: var(--text-help) !important;
  opacity: 1 !important;
}
input[type="search"].search-highlight {
  background-color: var(--search-highlight);
  border: 1px solid hsl(from var(--search-highlight) h s calc(l - 20)) !important;
}
.content-wrapper {
  background-color: var(--color-bg);
}
.btn-anchor {
  outline: none !important;
  padding: 0;
  border: 0;
  padding-left: 20px;
  vertical-align: baseline;
  cursor: pointer;
}
h1,
h2,
h3,
h4,
p,
.modal-title,
.modal-header h2 {
  color: var(--color-fg) !important;
}
.btn-danger,
.btn-danger:hover,
.btn-danger:focus,
.btn-warning,
.btn-warning:hover,
.btn-warning:focus,
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.modal-danger,
.modal-danger h2,
.modal-warning h2,
.modal-danger h4,
.modal-warning h4,
.box-solid.box-danger > .box-header,
.box-solid.box-danger > .box-header .box-title,
.bg-maroon,
.bg-maroon:hover,
.bg-maroon:focus,
.bg-purple,
.bg-purple:hover,
.bg-purple:focus {
  color: white !important;
}
.btn-selected,
.btn-selected a,
.btn-selected:hover,
.btn-selected:focus {
  color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 30)), hsl(from var(--main-theme-color) h s calc(l + 30))) !important;
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l - 20)), hsl(from var(--main-theme-color) h s calc(l - 20))) !important;
  border-color: light-dark(hsl(from var(--main-theme-color) h s calc(l - 25)), hsl(from var(--main-theme-color) h s calc(l - 25))) !important;
}
.btn-default,
.btn-default:hover {
  color: #3d4144 !important;
}
body {
  background-color: var(--color-bg);
  color: var(--color-fg);
}
label,
.icon-med,
.nav-tabs-custom > .nav-tabs > li > a,
.nav-tabs-custom > .nav-tabs > li.active > a:link {
  color: var(--color-fg);
}
/**
Generic popover: Bootstrap 3 hardcodes body bg to #fff and text to #333,
which reads as white-on-white in dark mode. Route background, text, and
border through the theme variables so both modes render legibly and the
help-popover variant keeps its more specific styling further down.
 */
.popover {
  background-color: var(--box-bg) !important;
  color: var(--color-fg) !important;
  border-color: var(--box-header-top-border-color) !important;
}
.popover-title,
.popover-content {
  background-color: var(--box-bg) !important;
  color: var(--color-fg) !important;
}
/**
Popover arrows: Bootstrap 3 defaults the inner arrow to #fff and the
outer to rgba(0,0,0,.25). In dark mode the outer disappears entirely
(no contrast against the darker surroundings) and the inner reads as a
white notch. Bind both to theme vars so every position (top / right /
bottom / left) shows a visible connector between the popover body and
its trigger in both modes.
 */
.popover.top .arrow {
  border-top-color: var(--box-header-top-border-color) !important;
}
.popover.top .arrow:after {
  border-top-color: var(--box-bg) !important;
}
.popover.right .arrow {
  border-right-color: var(--box-header-top-border-color) !important;
}
.popover.right .arrow:after {
  border-right-color: var(--box-bg) !important;
}
.popover.bottom .arrow {
  border-bottom-color: var(--box-header-top-border-color) !important;
}
.popover.bottom .arrow:after {
  border-bottom-color: var(--box-bg) !important;
}
.popover.left .arrow {
  border-left-color: var(--box-header-top-border-color) !important;
}
.popover.left .arrow:after {
  border-left-color: var(--box-bg) !important;
}
.table-bordered > tbody > tr > td,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > td,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > thead > tr > td,
.table-bordered > thead > tr > th,
.table-bordered > thead > tr > th,
.table-bordered,
.well {
  border: 1px solid var(--box-header-top-border-color) !important;
  border-left-color: var(--box-header-top-border-color) !important;
  border-right-color: var(--box-header-top-border-color) !important;
}
.box {
  border-top: 3px solid;
}
/* .bs-wizard's connecting line background (.progress = #f5f5f5) and
   inactive-step dots (#f5f5f5) both wash out against the dark-mode
   body. Bump to the theme's mid-gray so wizard steps stay visible
   on setup, importer modal, and the LDAP settings wizard. Selector
   uses [data-theme="dark"] — the actual attribute Snipe-IT toggles
   for dark mode. Disabled variant is called out explicitly because
   .bs-wizard-step.disabled > .bs-wizard-dot is a same-specificity
   rule from AdminLTE — the extra .disabled class ensures we win. */
[data-theme="dark"] .bs-wizard-step .progress,
[data-theme="dark"] .bs-wizard-step > .bs-wizard-dot,
[data-theme="dark"] .bs-wizard-step.disabled > .bs-wizard-dot {
  background-color: #605e5e;
}
.box.box-default {
  border-top: var(--box-header-top-border);
}
.box-header.with-border {
  border-bottom: var(--box-header-bottom-border);
}
.box-footer {
  border-top: var(--box-header-bottom-border);
}
.nav-tabs-custom > .nav-tabs {
  border-bottom: var(--tab-bottom-border);
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
  padding-bottom: 0;
}
.nav-tabs > li > a {
  margin-right: 0;
  border: 0;
}
.box,
.box-footer,
.tab-content,
.nav-tabs-custom,
.nav-tabs-custom > .nav-tabs > li,
.nav-tabs-custom > .nav-tabs > li:first-of-type,
.nav-tabs-custom > .nav-tabs > li.active > a:link,
.nav-tabs-custom > .nav-tabs > li.active > a:visited,
.nav-tabs-custom > .nav-tabs > li.active > a:hover,
.bootstrap-table.fullscreen,
.well {
  color: var(--color-fg);
  background-color: var(--box-bg) !important;
  border-left: 1px solid transparent;
  border-right: 1px solid transparent;
}
.panel {
  border-color: var(--box-header-top-border-color);
}
.panel-body {
  background-color: var(--box-bg) !important;
}
.panel-heading,
.panel-default > .panel-heading {
  color: var(--color-fg) !important;
  background-color: var(--table-stripe-bg-alt) !important;
  border-color: var(--box-header-top-border-color);
}
.panel-footer {
  background-color: var(--box-bg) !important;
  border-color: var(--box-header-top-border-color);
}
.nav-tabs-custom > .nav-tabs > li.active {
  border-top-color: var(--main-theme-color) !important;
  background-color: var(--box-header-top-border-color) !important;
  border-bottom: 2px solid var(--box-bg) !important;
  border-right: 1px solid var(--box-header-top-border-color);
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
}
.nav-tabs-custom > .nav-tabs > li:first-of-type {
  border-left: 0;
}
/**
This fixes the weird spacing in the nav tabs if there is a badge count on the tab
 */
.badge {
  font-size: 11px;
}
/**
table rows
 */
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  border-top: var(--table-border-row) !important;
}
.table-striped > tbody > tr:nth-of-type(even),
.row-new-striped > .row:nth-of-type(even),
.row-new-striped > .div:nth-of-type(odd),
.cansort {
  background-color: var(--table-stripe-bg) !important;
  border-top: var(--table-border-row-top) !important;
  color: var(--color-fg) !important;
}
.table-striped > tbody > tr:nth-of-type(odd),
.row-new-striped > .row:nth-of-type(even),
.row-new-striped > .div:nth-of-type(odd),
.cansort {
  background-color: var(--table-stripe-bg-alt) !important;
  border-top: var(--table-border-row-top) !important;
  color: var(--color-fg) !important;
}
.snipe-table--sticky-right-1 > thead > tr > th:nth-last-child(1),
.snipe-table--sticky-right-1 > tbody > tr > td:nth-last-child(1) {
  position: sticky;
  right: var(--sticky-right-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-2 > thead > tr > th:nth-last-child(1),
.snipe-table--sticky-right-2 > tbody > tr > td:nth-last-child(1) {
  position: sticky;
  right: var(--sticky-right-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-2 > thead > tr > th:nth-last-child(2),
.snipe-table--sticky-right-2 > tbody > tr > td:nth-last-child(2) {
  position: sticky;
  right: var(--sticky-right-offset-2, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-3 > thead > tr > th:nth-last-child(1),
.snipe-table--sticky-right-3 > tbody > tr > td:nth-last-child(1) {
  position: sticky;
  right: var(--sticky-right-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-3 > thead > tr > th:nth-last-child(2),
.snipe-table--sticky-right-3 > tbody > tr > td:nth-last-child(2) {
  position: sticky;
  right: var(--sticky-right-offset-2, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-3 > thead > tr > th:nth-last-child(3),
.snipe-table--sticky-right-3 > tbody > tr > td:nth-last-child(3) {
  position: sticky;
  right: var(--sticky-right-offset-3, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-4 > thead > tr > th:nth-last-child(1),
.snipe-table--sticky-right-4 > tbody > tr > td:nth-last-child(1) {
  position: sticky;
  right: var(--sticky-right-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-4 > thead > tr > th:nth-last-child(2),
.snipe-table--sticky-right-4 > tbody > tr > td:nth-last-child(2) {
  position: sticky;
  right: var(--sticky-right-offset-2, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-4 > thead > tr > th:nth-last-child(3),
.snipe-table--sticky-right-4 > tbody > tr > td:nth-last-child(3) {
  position: sticky;
  right: var(--sticky-right-offset-3, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-4 > thead > tr > th:nth-last-child(4),
.snipe-table--sticky-right-4 > tbody > tr > td:nth-last-child(4) {
  position: sticky;
  right: var(--sticky-right-offset-4, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-5 > thead > tr > th:nth-last-child(1),
.snipe-table--sticky-right-5 > tbody > tr > td:nth-last-child(1) {
  position: sticky;
  right: var(--sticky-right-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-5 > thead > tr > th:nth-last-child(2),
.snipe-table--sticky-right-5 > tbody > tr > td:nth-last-child(2) {
  position: sticky;
  right: var(--sticky-right-offset-2, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-5 > thead > tr > th:nth-last-child(3),
.snipe-table--sticky-right-5 > tbody > tr > td:nth-last-child(3) {
  position: sticky;
  right: var(--sticky-right-offset-3, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-5 > thead > tr > th:nth-last-child(4),
.snipe-table--sticky-right-5 > tbody > tr > td:nth-last-child(4) {
  position: sticky;
  right: var(--sticky-right-offset-4, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-5 > thead > tr > th:nth-last-child(5),
.snipe-table--sticky-right-5 > tbody > tr > td:nth-last-child(5) {
  position: sticky;
  right: var(--sticky-right-offset-5, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-1 > thead > tr > th:nth-child(1),
.snipe-table--sticky-left-1 > tbody > tr > td:nth-child(1) {
  position: sticky;
  left: var(--sticky-left-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-2 > thead > tr > th:nth-child(1),
.snipe-table--sticky-left-2 > tbody > tr > td:nth-child(1) {
  position: sticky;
  left: var(--sticky-left-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-2 > thead > tr > th:nth-child(2),
.snipe-table--sticky-left-2 > tbody > tr > td:nth-child(2) {
  position: sticky;
  left: var(--sticky-left-offset-2, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-3 > thead > tr > th:nth-child(1),
.snipe-table--sticky-left-3 > tbody > tr > td:nth-child(1) {
  position: sticky;
  left: var(--sticky-left-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-3 > thead > tr > th:nth-child(2),
.snipe-table--sticky-left-3 > tbody > tr > td:nth-child(2) {
  position: sticky;
  left: var(--sticky-left-offset-2, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-3 > thead > tr > th:nth-child(3),
.snipe-table--sticky-left-3 > tbody > tr > td:nth-child(3) {
  position: sticky;
  left: var(--sticky-left-offset-3, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-4 > thead > tr > th:nth-child(1),
.snipe-table--sticky-left-4 > tbody > tr > td:nth-child(1) {
  position: sticky;
  left: var(--sticky-left-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-4 > thead > tr > th:nth-child(2),
.snipe-table--sticky-left-4 > tbody > tr > td:nth-child(2) {
  position: sticky;
  left: var(--sticky-left-offset-2, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-4 > thead > tr > th:nth-child(3),
.snipe-table--sticky-left-4 > tbody > tr > td:nth-child(3) {
  position: sticky;
  left: var(--sticky-left-offset-3, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-4 > thead > tr > th:nth-child(4),
.snipe-table--sticky-left-4 > tbody > tr > td:nth-child(4) {
  position: sticky;
  left: var(--sticky-left-offset-4, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-5 > thead > tr > th:nth-child(1),
.snipe-table--sticky-left-5 > tbody > tr > td:nth-child(1) {
  position: sticky;
  left: var(--sticky-left-offset-1, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-5 > thead > tr > th:nth-child(2),
.snipe-table--sticky-left-5 > tbody > tr > td:nth-child(2) {
  position: sticky;
  left: var(--sticky-left-offset-2, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-5 > thead > tr > th:nth-child(3),
.snipe-table--sticky-left-5 > tbody > tr > td:nth-child(3) {
  position: sticky;
  left: var(--sticky-left-offset-3, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-5 > thead > tr > th:nth-child(4),
.snipe-table--sticky-left-5 > tbody > tr > td:nth-child(4) {
  position: sticky;
  left: var(--sticky-left-offset-4, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-left-5 > thead > tr > th:nth-child(5),
.snipe-table--sticky-left-5 > tbody > tr > td:nth-child(5) {
  position: sticky;
  left: var(--sticky-left-offset-5, 0);
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table--sticky-right-1 > thead > tr > th:nth-last-child(-n + 1) {
  z-index: 3;
}
.snipe-table--sticky-right-1.table-striped > tbody > tr:nth-of-type(even) > td:nth-last-child(-n + 1) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-right-1.table-striped > tbody > tr:nth-of-type(odd) > td:nth-last-child(-n + 1) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-right-2 > thead > tr > th:nth-last-child(-n + 2) {
  z-index: 3;
}
.snipe-table--sticky-right-2.table-striped > tbody > tr:nth-of-type(even) > td:nth-last-child(-n + 2) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-right-2.table-striped > tbody > tr:nth-of-type(odd) > td:nth-last-child(-n + 2) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-right-3 > thead > tr > th:nth-last-child(-n + 3) {
  z-index: 3;
}
.snipe-table--sticky-right-3.table-striped > tbody > tr:nth-of-type(even) > td:nth-last-child(-n + 3) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-right-3.table-striped > tbody > tr:nth-of-type(odd) > td:nth-last-child(-n + 3) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-right-4 > thead > tr > th:nth-last-child(-n + 4) {
  z-index: 3;
}
.snipe-table--sticky-right-4.table-striped > tbody > tr:nth-of-type(even) > td:nth-last-child(-n + 4) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-right-4.table-striped > tbody > tr:nth-of-type(odd) > td:nth-last-child(-n + 4) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-right-5 > thead > tr > th:nth-last-child(-n + 5) {
  z-index: 3;
}
.snipe-table--sticky-right-5.table-striped > tbody > tr:nth-of-type(even) > td:nth-last-child(-n + 5) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-right-5.table-striped > tbody > tr:nth-of-type(odd) > td:nth-last-child(-n + 5) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-left-1 > thead > tr > th:nth-child(-n + 1) {
  z-index: 3;
}
.snipe-table--sticky-left-1.table-striped > tbody > tr:nth-of-type(even) > td:nth-child(-n + 1) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-left-1.table-striped > tbody > tr:nth-of-type(odd) > td:nth-child(-n + 1) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-left-2 > thead > tr > th:nth-child(-n + 2) {
  z-index: 3;
}
.snipe-table--sticky-left-2.table-striped > tbody > tr:nth-of-type(even) > td:nth-child(-n + 2) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-left-2.table-striped > tbody > tr:nth-of-type(odd) > td:nth-child(-n + 2) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-left-3 > thead > tr > th:nth-child(-n + 3) {
  z-index: 3;
}
.snipe-table--sticky-left-3.table-striped > tbody > tr:nth-of-type(even) > td:nth-child(-n + 3) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-left-3.table-striped > tbody > tr:nth-of-type(odd) > td:nth-child(-n + 3) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-left-4 > thead > tr > th:nth-child(-n + 4) {
  z-index: 3;
}
.snipe-table--sticky-left-4.table-striped > tbody > tr:nth-of-type(even) > td:nth-child(-n + 4) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-left-4.table-striped > tbody > tr:nth-of-type(odd) > td:nth-child(-n + 4) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-left-5 > thead > tr > th:nth-child(-n + 5) {
  z-index: 3;
}
.snipe-table--sticky-left-5.table-striped > tbody > tr:nth-of-type(even) > td:nth-child(-n + 5) {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table--sticky-left-5.table-striped > tbody > tr:nth-of-type(odd) > td:nth-child(-n + 5) {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table--sticky-right-1 > tbody > tr.selected > td:nth-last-child(-n + 1) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-right-1 > tbody > tr.success > td:nth-last-child(-n + 1) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-right-1 > tbody > tr.danger > td:nth-last-child(-n + 1) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-right-2 > tbody > tr.selected > td:nth-last-child(-n + 2) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-right-2 > tbody > tr.success > td:nth-last-child(-n + 2) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-right-2 > tbody > tr.danger > td:nth-last-child(-n + 2) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-right-3 > tbody > tr.selected > td:nth-last-child(-n + 3) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-right-3 > tbody > tr.success > td:nth-last-child(-n + 3) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-right-3 > tbody > tr.danger > td:nth-last-child(-n + 3) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-right-4 > tbody > tr.selected > td:nth-last-child(-n + 4) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-right-4 > tbody > tr.success > td:nth-last-child(-n + 4) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-right-4 > tbody > tr.danger > td:nth-last-child(-n + 4) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-right-5 > tbody > tr.selected > td:nth-last-child(-n + 5) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-right-5 > tbody > tr.success > td:nth-last-child(-n + 5) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-right-5 > tbody > tr.danger > td:nth-last-child(-n + 5) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-1 > tbody > tr.selected > td:nth-child(-n + 1) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-left-1 > tbody > tr.success > td:nth-child(-n + 1) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-1 > tbody > tr.danger > td:nth-child(-n + 1) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-2 > tbody > tr.selected > td:nth-child(-n + 2) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-left-2 > tbody > tr.success > td:nth-child(-n + 2) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-2 > tbody > tr.danger > td:nth-child(-n + 2) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-3 > tbody > tr.selected > td:nth-child(-n + 3) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-left-3 > tbody > tr.success > td:nth-child(-n + 3) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-3 > tbody > tr.danger > td:nth-child(-n + 3) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-4 > tbody > tr.selected > td:nth-child(-n + 4) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-left-4 > tbody > tr.success > td:nth-child(-n + 4) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-4 > tbody > tr.danger > td:nth-child(-n + 4) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-5 > tbody > tr.selected > td:nth-child(-n + 5) {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table--sticky-left-5 > tbody > tr.success > td:nth-child(-n + 5) {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table--sticky-left-5 > tbody > tr.danger > td:nth-child(-n + 5) {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table > thead > tr > th.bs-checkbox,
.snipe-table > tbody > tr > td.bs-checkbox {
  position: sticky;
  left: 0;
  z-index: 2;
  background-color: var(--box-bg);
}
.snipe-table.table-striped > tbody > tr:nth-of-type(even) > td.bs-checkbox {
  background-image: linear-gradient(var(--table-stripe-bg), var(--table-stripe-bg));
}
.snipe-table.table-striped > tbody > tr:nth-of-type(odd) > td.bs-checkbox {
  background-image: linear-gradient(var(--table-stripe-bg-alt), var(--table-stripe-bg-alt));
}
.snipe-table > thead > tr > th.bs-checkbox {
  z-index: 3;
}
.snipe-table > tbody > tr.selected > td.bs-checkbox {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
  background-image: none !important;
}
.snipe-table > tbody > tr.success > td.bs-checkbox {
  background-color: #00a65a !important;
  background-image: none !important;
  color: white !important;
}
.snipe-table > tbody > tr.danger > td.bs-checkbox {
  background-color: var(--text-danger) !important;
  background-image: none !important;
  color: white !important;
}
.snipe-top-scrollbar {
  overflow-x: auto;
  overflow-y: hidden;
  height: 10px;
  margin-bottom: 4px;
  scrollbar-width: thin;
  scrollbar-color: rgba(0, 0, 0, 0.35) rgba(0, 0, 0, 0.06);
}
.snipe-top-scrollbar::-webkit-scrollbar {
  height: 10px;
}
.snipe-top-scrollbar::-webkit-scrollbar-track {
  background-color: rgba(0, 0, 0, 0.06);
  border-radius: 6px;
}
.snipe-top-scrollbar::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.35);
  border-radius: 6px;
}
.snipe-top-scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.5);
}
.snipe-top-scrollbar-inner {
  height: 1px;
}
/**
main header nav
 */
.dropdown-menu {
  background-color: var(--main-theme-color);
  border-color: var(--main-theme-color);
}
.dropdown-menu > li,
.navbar,
.navbar-nav,
.label-default,
.label-default:hover {
  background-color: var(--main-theme-color);
  color: var(--nav-primary-text-color) !important;
}
.label-light {
  background-color: var(--default-label-link-bg) !important;
  color: var(--color-fg) !important;
  font-size: 12px !important;
  font-weight: normal !important;
  line-height: 25px;
  margin-left: 0px;
  padding-left: 3px;
}
a.label-light,
a.label-light:hover {
  color: var(--link-color) !important;
}
.dropdown-menu > li > a,
.dropdown-menu > li > a:link,
.dropdown-menu > li > a:visited,
.dropdown-menu > .active > a:link,
.dropdown-menu > .active > a:visited,
.navbar-nav .open > a:link,
.navbar-nav .open > a:visited,
.navbar-nav > li > a:link,
.navbar-nav > li > a:visited {
  background-color: var(--main-theme-color) !important;
  /*background-color: rgba(0,0,0,.15);*/
  color: var(--nav-primary-text-color) !important;
  /*color: var(--nav-primary-text-color) !important;*/
}
.btn-tableButton.active.focus,
.btn-tableButton.active:focus,
.btn-tableButton.active:hover,
.dropdown-menu > .active > a:focus,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:link,
.dropdown-menu > .active > a:visited,
.dropdown-menu > li > a:focus,
.dropdown-menu > li > a:hover,
.dropdown-menu > li:focus,
.dropdown-menu > li:hover,
.navbar-nav .open li.active > a:focus,
.navbar-nav .open li.active > a:hover,
.navbar-nav .open > a:focus,
.navbar-nav .open > a:hover,
.navbar-nav > li > a:focus,
.navbar-nav > li > a:hover,
.open > .dropdown-toggle.btn-tableButton:focus,
.open > .dropdown-toggle.btn-tableButton:hover,
.page-next a,
.pagination > .active > a:hover,
.page-item.active,
.pagination > .active > a,
.pagination > li > .active > a,
.pagination > li > .active > a:hover,
.pagination > li > a:hover {
  background-color: var(--main-theme-hover) !important;
  border-color: var(--btn-theme-hover) !important;
  color: var(--nav-primary-text-color) !important;
}
.pagination > li > a {
  background-color: var(--main-theme-color) !important;
  border-color: var(--btn-theme-hover) !important;
  color: var(--nav-primary-text-color) !important;
}
.bootstrap-table .fixed-table-toolbar li.dropdown-item-marker label {
  color: var(--nav-primary-text-color) !important;
}
.bootstrap-table .fixed-table-toolbar li.dropdown-item-marker label:hover {
  background-color: var(--main-theme-hover) !important;
  color: var(--nav-primary-text-color) !important;
}
.dropdown-menu,
.dropdown-menu > li {
  background-color: hsl(from var(--main-theme-color) h s calc(l - 5));
  border-color: hsl(from var(--main-theme-color) h s calc(l - 10));
  color: var(--nav-primary-text-color) !important;
}
.main-header .navbar .nav > .active > a {
  background-color: hsl(from var(--main-theme-color) h s calc(l - 5)) !important;
  color: var(--nav-primary-text-color) !important;
}
.navbar-nav > .notifications-menu > .dropdown-menu > li.header,
.navbar-nav > .messages-menu > .dropdown-menu > li.header,
.navbar-nav > .tasks-menu > .dropdown-menu > li.header,
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu,
.navbar-nav > .messages-menu > .dropdown-menu > li .menu,
.navbar-nav > .tasks-menu > .dropdown-menu > li .menu,
.navbar-nav > .messages-menu > .dropdown-menu > li .menu,
.navbar-nav > .tasks-menu > .dropdown-menu > li .menu a:hover,
.navbar-nav > .messages-menu > .dropdown-menu > li .menu,
.navbar-nav > .tasks-menu > .dropdown-menu > li:hover,
.navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li:hover > a,
.task_menu {
  background-color: hsl(from var(--main-theme-color) h s calc(l - 5)) !important;
  color: var(--nav-primary-text-color) !important;
  margin-bottom: 0;
}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a,
.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a,
.navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a {
  border-bottom: 1px solid hsl(from var(--main-theme-color) h s calc(l - 10));
}
/**
Active and hover for top tier sidenav items
 */
.main-sidebar {
  background-color: #1e282c;
}
.sidebar-menu > li.active > a,
.sidebar-menu > li:hover > a,
.treeview-menu > li > a {
  color: var(--sidenav-text-hover-color) !important;
  border-left-color: var(--main-theme-color);
}
.sidebar-menu > li:hover > a,
.sidebar-menu > li.active > a {
  border-left-color: var(--main-theme-color);
  padding-left: 12px;
}
.sidebar-menu > li:hover {
  background-color: #2c3b41;
}
.sidebar-menu > li > .treeview-menu {
  background-color: #1e282c;
}
.list-group-item:first-child {
  border-top: 0 !important;
}
.sidebar-menu > li > a:link,
.sidebar-menu > li > a:visited,
.treeview-menu > li > a {
  color: var(--sidenav-text-nohover-color) !important;
}
.sidebar-menu > li.active > a,
.sidebar-menu > li:hover > a {
  background-color: #1e282c;
  border-left-color: var(--main-theme-color);
  border-left-style: solid;
  border-left-width: 3px;
  color: var(--sidenav-text-hover-color) !important;
}
thead,
tbody,
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  border-top-color: var(--box-bg) !important;
  border-bottom-color: var(--box-header-bottom-border-color) !important;
  color: var(--color-fg);
}
.help-block {
  color: var(--text-help) !important;
}
.alert-msg,
.has-error {
  color: var(--text-danger) !important;
}
.has-error .form-control {
  border-color: var(--text-danger);
}
.alert a,
.callout.callout-warning,
.callout.callout-danger,
.callout.callout-success,
.callout.callout-info,
.alert.alert-warning,
.alert.alert-danger,
.alert.alert-info,
.alert.alert-success,
.alert.alert-warning {
  color: white !important;
}
.alert.alert-danger h1,
.alert.alert-info h1,
.alert.alert-success h1,
.alert.alert-warning h1,
.alert.alert-danger h2,
.alert.alert-info h2,
.alert.alert-success h2,
.alert.alert-warning h2,
.alert.alert-danger h3,
.alert.alert-info h3,
.alert.alert-success h3,
.alert.alert-warning h3,
.alert.alert-danger h4,
.alert.alert-info h4,
.alert.alert-success h4,
.alert.alert-warning h4,
.alert.alert-danger p,
.alert.alert-info p,
.alert.alert-success p,
.alert.alert-warning p {
  color: inherit !important;
}
.text-dark-gray a:link,
.text-dark-gray a:hover,
.text-dark-gray a:visited,
.text-dark-gray a:focus {
  color: hsl(from var(--main-theme-color) h s calc(l - 5));
}
.text-warning {
  color: var(--text-warning) !important;
}
.text-info {
  color: var(--text-info) !important;
}
.text-primary {
  color: var(--main-theme-color) !important;
}
.text-danger {
  color: var(--text-danger) !important;
}
.text-success {
  color: var(--text-success) !important;
}
.dropdown-menu > .divider {
  background-color: hsl(from var(--main-theme-color) h s calc(l - 10));
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 1px;
}
input[type="radio"]::before {
  box-shadow: inset 1em 1em hsl(from var(--main-theme-color) h s calc(l - 20)) !important;
}
input[type="checkbox"]::before {
  box-shadow: inset 1em 1em hsl(from var(--main-theme-color) h s calc(l - 20)) !important;
}
.callout.callout-legend {
  background-color: var(--callout-bg-color);
  border-left: 5px solid var(--callout-left-border);
}
.callout-legend h4 a,
.callout-legend h4 a:hover {
  color: var(--color-fg) !important;
}
p.callout-subtext,
p.callout-subtext a:hover,
p.callout-subtext a:visited,
p.callout-subtext a:link {
  color: var(--text-legend-help) !important;
  text-decoration: none;
}
legend {
  border-bottom: 1px solid var(--callout-left-border);
}
th,
.fix-sticky table thead {
  background-color: var(--box-bg);
  color: var(--color-fg) !important;
}
.logo:hover {
  background-color: var(--main-theme-color) !important;
  color: var(--nav-primary-text-color) !important;
}
.modal-content,
.popover.help-popover,
.popover.help-popover .popover-content,
.popover.help-popover .popover-body,
.popover.help-popover .popover-title,
.popover.help-popover .popover-header {
  background-color: var(--box-bg) !important;
  /*color: var(--color-fg) !important;*/
  color: var(--color-fg) !important;
}
.treeview-menu > li {
  background-color: #2c3b41;
  color: var(--sidenav-text-nohover-color) !important;
}
.treeview-menu > li > a:hover,
.treeview-menu > li:hover,
.treeview-menu > li.active > a {
  color: white !important;
  background-color: var(--sidenav-hover-color-bg) !important;
}
.sidebar-toggle.btn,
.sidebar-toggle.btn:hover {
  color: white !important;
}
.chart-responsive {
  color: var(--color-fg) !important;
}
.table > tbody + tbody {
  border-top: 0 !important;
}
h4#progress-text {
  color: white !important;
}
.small-box h3,
.small-box p {
  color: white !important;
}
.box.box-theme {
  border-top: var(--main-theme-color) !important;
}
input[type="date"]:focus,
input[type="number"]:focus,
input[type="text"]:focus,
input[type="url"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
textarea:focus {
  border-color: hsl(from var(--main-theme-color) h s calc(l - 5)) !important;
}
input[type="date"]:required,
input[type="number"]:required,
input[type="text"]:required,
input[type="url"]:required,
input[type="email"]:required,
input[type="password"]:required,
input[type="tel"]:required,
select:required,
input:required,
textarea:required {
  border-right: 5px solid orange !important;
}
.bootstrap-table .fixed-table-container .table tbody tr.selected td {
  background-color: light-dark(hsl(from var(--main-theme-color) h s calc(l + 40)),hsl(from var(--main-theme-color) h s calc(l - 40))) !important;
}
tr.success > td {
  background-color: #00a65a !important;
  color: white !important;
}
tr.danger > td {
  background-color: var(--text-danger) !important;
  color: white !important;
}
@media print {
  body,
  div.content-wrapper,
  section.content,
  .webui,
  .main-panel,
  .nav-tabs-custom,
  .box,
  .box-body,
  .list-group,
  .list-group-unbordered,
  .list-group-item,
  .row,
  .tab-content {
    background: white !important;
    color: black !important;
  }
  .fixed-table-toolbar,
  .fixed-table-pagination,
  #assetsToolBar,
  .fixed-table-pagination {
    display: none !important;
  }
  .tab-pane.hidden-print {
    display: none !important;
    visibility: hidden !important;
  }
  h2,
  h3,
  h4 {
    color: black !important;
  }
  .col-sm-9,
  .main-panel {
    float: left;
    width: 100% !important;
  }
}
.list-group-item.subitem {
  padding-left: 20px !important;
  border-left: 0 !important;
  border-right: 0 !important;
}
.list-group-item.subitem:first-child {
  border: var(--tab-bottom-border);
}
.list-group-item.subitem:last-child {
  border: 0 !important;
}
.main-panel-content {
  line-height: 20px;
  border-bottom: var(--tab-bottom-border);
  padding: 10px 15px;
}
/* table */
dl.table-display {
  float: left;
  width: 100%;
  margin: 1em 0;
  padding: 0;
}
.table-display dt {
  line-height: 25px;
  clear: left;
  float: left;
  /*text-align: right;*/
  width: 20%;
  margin: 0;
  padding: 8px;
  border-top: var(--tab-bottom-border);
  font-weight: bold;
}
.table-display dd {
  line-height: 20px;
  float: left;
  width: 80%;
  margin: 0;
  padding: 10px;
  border-top: var(--tab-bottom-border);
}
.well-display dt {
  clear: left;
  float: left;
  width: 70%;
  margin: 0;
  padding: 6px;
  border-top: 0;
  font-weight: bold;
}
.well-display dd {
  float: left;
  width: 30%;
  margin: 0;
  padding: 6px;
  border-top: 0;
}
.well-sm {
  line-height: 30px;
}
.table-display dd:first-of-type,
.table-display dt:first-of-type {
  border-top: 0 !important;
}
@media (max-width: 750px) {
  .table-display dd {
    width: 100% !important;
  }
  .table-display dt {
    width: 100% !important;
  }
}
@media print {
  /* All your print styles go here */
  .box-profile {
    display: block !important;
    width: 100% !important;
  }
}
.login-page,
.register-page {
  background: var(--color-bg);
}
.login-box-body,
.register-box-body {
  background: var(--box-bg);
  color: var(--color-fg);
}
.login-logo a,
.register-logo a {
  color: var(--color-fg);
}
.login-box-body,
.register-box-body {
  border-top: 0;
}
.login-box,
.register-box {
  border-top: 3px solid var(--main-theme-color);
}
.basic-page-header {
  background-color: var(--main-theme-color);
  position: relative;
  min-height: 50px;
  overflow: hidden;
  padding: 0 20px;
  margin-bottom: 30px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.basic-page-header__link {
  display: inline-block;
  color: var(--nav-primary-text-color);
  text-decoration: none;
}
.basic-page-header__link:hover,
.basic-page-header__link:focus,
.basic-page-header__link:visited {
  color: var(--nav-primary-text-color);
  text-decoration: none;
}
.basic-page-header__link img {
  max-height: 65px;
  max-width: 100%;
  width: auto;
}
.basic-page-header__site-name {
  font-size: 24px;
  font-weight: 600;
  color: var(--nav-primary-text-color);
}
.basic-page-header__toggle {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: 0;
  padding: 4px 8px;
  color: var(--nav-primary-text-color);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}
.basic-page-header__toggle:hover,
.basic-page-header__toggle:focus {
  color: var(--nav-primary-text-color);
  opacity: 0.85;
}
.basic-page-header__toggle .theme-toggle-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
@media (max-width: 1400px) {
  .box-body .fixed-table-toolbar > .search.pull-right {
    clear: both !important;
    margin-top: 8px;
  }
}
.info-panel-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  margin: 0 -10px;
}
.info-panel-actions > .pull-right {
  margin-left: auto;
}
.info-panel-actions > .pull-right ~ .pull-right {
  margin-left: 0;
}


/*# sourceMappingURL=app.css.map*/