/* ExcursionPass internal template revamp.
   Presentation-only layer for the legacy Metronic app shell. */

html,
body.page-container-bg-solid {
  min-height: 100%;
}

body.page-container-bg-solid {
  background: #f3f7fa !important;
  color: #18232f;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Open Sans", Arial, sans-serif;
}

body.page-container-bg-solid a {
  color: #087f8f;
}

body.page-container-bg-solid a:hover,
body.page-container-bg-solid a:focus {
  color: #064f63;
}

.page-container-bg-solid .btn {
  border-radius: 6px !important;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

.page-container-bg-solid .btn.green,
.page-container-bg-solid .btn-success,
.page-container-bg-solid .btn.green-sharp {
  background: #0da6a8 !important;
  border-color: #0b9296 !important;
  color: #fff !important;
  box-shadow: 0 8px 16px rgba(13, 166, 168, .18);
}

.page-container-bg-solid .btn.green:hover,
.page-container-bg-solid .btn-success:hover,
.page-container-bg-solid .btn.green-sharp:hover {
  background: #088b91 !important;
  border-color: #087f86 !important;
}

.page-container-bg-solid .label,
.page-container-bg-solid .badge {
  border-radius: 999px !important;
  letter-spacing: 0;
}

.page-container-bg-solid .form-control {
  border-color: #d8e4ea;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: #18232f;
}

.page-container-bg-solid .form-control:focus {
  border-color: #16b7bd;
  box-shadow: 0 0 0 3px rgba(22, 183, 189, .14) !important;
}

.page-container-bg-solid .page-content {
  background: transparent !important;
}

.page-container-bg-solid .page-content .container,
.page-container-bg-solid .page-head .container {
  width: auto !important;
  max-width: 100%;
}

.page-container-bg-solid .page-head {
  background: transparent !important;
}

.page-container-bg-solid .page-head .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.page-container-bg-solid .page-title {
  float: none;
  padding: 0;
}

.page-container-bg-solid .page-title h1 {
  color: #111827;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.18;
  margin: 0;
}

.page-container-bg-solid .page-title h1 small {
  color: #607281;
  display: block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.35;
  margin-top: 5px;
  text-transform: none;
}

.page-container-bg-solid .dashboard-stat,
.page-container-bg-solid .widget-thumb,
.page-container-bg-solid .portlet.light,
.page-container-bg-solid .todo-tasks-container,
.page-container-bg-solid .mt-card-item,
.page-container-bg-solid .panel {
  background: #fff !important;
  border: 1px solid #dfe8ee !important;
  border-radius: 8px !important;
  box-shadow: 0 12px 26px rgba(20, 38, 55, .07) !important;
  overflow: hidden;
}

.page-container-bg-solid .dashboard-stat {
  min-height: 126px;
  padding: 18px 18px 58px;
  position: relative;
}

.page-container-bg-solid .dashboard-stat.blue,
.page-container-bg-solid .dashboard-stat.red,
.page-container-bg-solid .dashboard-stat.green,
.page-container-bg-solid .dashboard-stat.purple,
.page-container-bg-solid .dashboard-stat.yellow {
  background: #fff !important;
}

.page-container-bg-solid .dashboard-stat .visual {
  height: 72px;
  margin: 0;
  opacity: 1;
  padding-top: 0;
  width: 72px;
}

.page-container-bg-solid .dashboard-stat .visual > i {
  background: #e5fbfb;
  border: 1px solid #bdecee;
  border-radius: 8px;
  color: #0a8f96 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 28px !important;
  height: 52px;
  line-height: 52px;
  margin: 0;
  width: 52px;
}

.page-container-bg-solid .dashboard-stat.red .visual > i {
  background: #fff1e3;
  border-color: #ffd8a8;
  color: #c46b12 !important;
}

.page-container-bg-solid .dashboard-stat.green .visual > i {
  background: #e7f8ee;
  border-color: #bfe8cf;
  color: #128551 !important;
}

.page-container-bg-solid .dashboard-stat .details {
  margin-left: 70px;
  min-height: 54px;
  padding-right: 0;
  position: relative;
  right: auto;
  top: auto;
}

.page-container-bg-solid .dashboard-stat .details .number {
  color: #101820 !important;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  margin: 2px 0 7px;
  text-align: left;
}

.page-container-bg-solid .dashboard-stat .details .desc {
  color: #4f6170 !important;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
  text-align: left;
  text-transform: none;
}

.page-container-bg-solid .dashboard-stat .more {
  background: #f6fafc !important;
  border-top: 1px solid #e2edf2;
  bottom: 0;
  color: #087f8f !important;
  font-size: 13px;
  font-weight: 800;
  left: 0;
  padding: 12px 18px;
  position: absolute;
  right: 0;
  text-align: left;
}

.page-container-bg-solid .portlet.light {
  padding: 0 !important;
}

.page-container-bg-solid .portlet.light > .portlet-title {
  border-bottom: 1px solid #e3edf2;
  margin: 0;
  min-height: 56px;
  padding: 16px 18px 12px;
}

.page-container-bg-solid .portlet.light > .portlet-title > .caption {
  color: #111827;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.page-container-bg-solid .portlet.light > .portlet-title > .caption > i {
  color: #0a8f96 !important;
}

.page-container-bg-solid .portlet.light > .portlet-title > .caption > .caption-helper {
  color: #6a7c8a;
  font-size: 12px;
  font-weight: 700;
  text-transform: none;
}

.page-container-bg-solid .portlet.light > .portlet-body {
  padding: 18px !important;
}

.page-container-bg-solid .table {
  color: #263442;
  margin-bottom: 0;
}

.page-container-bg-solid .table > thead > tr > th {
  background: #f5f9fb;
  border-bottom: 1px solid #dfe8ee;
  color: #516372;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.page-container-bg-solid .table-striped > tbody > tr:nth-of-type(odd) {
  background: #fbfdfe;
}

.page-container-bg-solid .table-hover > tbody > tr:hover {
  background: #eefafa;
}

.page-container-bg-solid .nav-tabs {
  border-bottom-color: #dfe8ee;
}

.page-container-bg-solid .tabbable-line > .nav-tabs > li > a {
  color: #5b6d7c;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.page-container-bg-solid .tabbable-line > .nav-tabs > li.active {
  border-bottom-color: #0da6a8;
}

.page-container-bg-solid .tabbable-line > .nav-tabs > li.active > a {
  color: #083f4d;
}

.page-container-bg-solid .todo-tasks-container {
  padding: 0;
}

.page-container-bg-solid .todo-head {
  background: #fff !important;
  border-bottom: 1px solid #e3edf2;
  padding: 18px 20px !important;
}

.page-container-bg-solid .todo-head h3 {
  color: #111827;
  font-size: 21px;
  font-weight: 800;
  letter-spacing: 0;
  margin: 0 0 6px;
}

.page-container-bg-solid .todo-tasks-item {
  border-bottom: 1px solid #e9f0f4 !important;
  padding: 18px 20px !important;
}

.page-container-bg-solid .todo-tasks-item:last-child {
  border-bottom: 0 !important;
}

.page-container-bg-solid .item-name.primary-link {
  color: #0f2530;
  font-weight: 800;
}

.page-container-bg-solid .item-pic.rounded,
.page-container-bg-solid img.img-circle {
  border: 1px solid #d9e7ee;
  box-shadow: 0 5px 12px rgba(20, 38, 55, .12);
}

.page-container-bg-solid .widget-thumb {
  padding: 18px !important;
}

.page-container-bg-solid .widget-thumb .widget-thumb-heading {
  color: #516372;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.page-container-bg-solid .widget-thumb .widget-thumb-body-stat {
  color: #111827;
  font-weight: 800;
}

@media (min-width: 992px) {
  body.page-container-bg-solid.page-boxed {
    padding-left: 0;
  }

  body.page-container-bg-solid .page-header {
    background: #075467 !important;
    border: 0 !important;
    bottom: 0;
    box-shadow: 8px 0 24px rgba(7, 42, 52, .18);
    height: auto !important;
    left: 0;
    margin: 0 !important;
    position: fixed !important;
    top: 0;
    width: 236px;
    z-index: 10000;
  }

  body.page-container-bg-solid .page-header .container {
    padding-left: 0;
    padding-right: 0;
    width: 100% !important;
  }

  body.page-container-bg-solid .page-header .page-header-top {
    background: transparent !important;
    height: auto !important;
  }

  body.page-container-bg-solid .page-header .page-logo {
    float: none;
    height: 80px;
    padding: 18px 18px 14px;
    width: 100%;
  }

  body.page-container-bg-solid .page-header .page-logo a {
    display: block;
  }

  body.page-container-bg-solid .page-header .page-logo img.logo-default {
    filter: brightness(0) invert(1);
    height: auto;
    margin: 0 !important;
    max-width: 100%;
    opacity: .96;
    width: 178px !important;
  }

  body.page-container-bg-solid .page-header .menu-toggler {
    display: none;
  }

  body.page-container-bg-solid .page-header .page-header-menu {
    background: transparent !important;
    display: block !important;
    bottom: 104px;
    left: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 12px 16px;
    position: absolute;
    right: 0;
    top: 80px;
  }

  body.page-container-bg-solid .page-header .hor-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav {
    float: none;
    margin: 0;
    width: 100%;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li {
    display: block;
    float: none;
    margin: 0 0 4px;
    position: relative;
    width: 100%;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:before {
    background: transparent;
    border-radius: 0 4px 4px 0;
    bottom: 7px;
    content: "";
    left: 0;
    position: absolute;
    top: 7px;
    width: 4px;
    z-index: 2;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover:before {
    background: #18c7c8;
    box-shadow: 0 0 14px rgba(24, 199, 200, .35);
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a {
    align-items: center;
    background: transparent !important;
    border-radius: 7px;
    color: rgba(255, 255, 255, .84) !important;
    display: flex;
    font-size: 14px;
    font-weight: 800;
    gap: 10px;
    height: auto;
    letter-spacing: 0;
    line-height: 20px;
    padding: 12px 12px !important;
    text-transform: none;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i {
    align-items: center;
    background: rgba(25, 199, 200, .18);
    border: 1px solid rgba(25, 199, 200, .24);
    border-radius: 7px;
    color: #8ef2ef !important;
    display: inline-flex;
    font-size: 16px;
    height: 28px;
    justify-content: center;
    min-width: 28px;
    text-align: center;
    width: 28px;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:nth-child(2n) > a > i {
    background: rgba(255, 177, 84, .18);
    border-color: rgba(255, 177, 84, .28);
    color: #ffd48f !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:nth-child(3n) > a > i {
    background: rgba(116, 177, 255, .18);
    border-color: rgba(116, 177, 255, .28);
    color: #9ecbff !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:nth-child(4n) > a > i {
    background: rgba(125, 220, 144, .18);
    border-color: rgba(125, 220, 144, .28);
    color: #a7efb5 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:nth-child(5n) > a > i {
    background: rgba(255, 124, 124, .18);
    border-color: rgba(255, 124, 124, .28);
    color: #ffb1ad !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-pie-chart,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-pie-chart {
    background: rgba(25, 199, 200, .2);
    border-color: rgba(25, 199, 200, .34);
    color: #8ef2ef !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-settings,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-building-o {
    background: rgba(255, 177, 84, .2);
    border-color: rgba(255, 177, 84, .34);
    color: #ffd48f !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-social-dribbble,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-dollar,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-money {
    background: rgba(82, 214, 132, .2);
    border-color: rgba(82, 214, 132, .34);
    color: #a7efb5 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-users,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-users {
    background: rgba(116, 177, 255, .2);
    border-color: rgba(116, 177, 255, .34);
    color: #9ecbff !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-camera-retro,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-picture-o {
    background: rgba(255, 124, 124, .2);
    border-color: rgba(255, 124, 124, .34);
    color: #ffb1ad !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-rocket {
    background: rgba(196, 154, 255, .2);
    border-color: rgba(196, 154, 255, .34);
    color: #d9c2ff !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-clone,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-map-o,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-compass,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-compass {
    background: rgba(87, 210, 232, .2);
    border-color: rgba(87, 210, 232, .34);
    color: #a7edfa !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > a,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > a,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > a,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > a {
    background: rgba(255, 255, 255, .13) !important;
    color: #fff !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > a > i,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > a > i,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > a > i,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > a > i {
    background: rgba(255, 255, 255, .92);
    border-color: rgba(255, 255, 255, .96);
    color: #075467 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > a {
    box-shadow: none;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu {
    background: rgba(2, 48, 61, .42);
    border: 0;
    border-radius: 7px;
    box-shadow: none;
    display: block !important;
    float: none;
    left: auto;
    margin: 4px 0 8px;
    max-height: none;
    min-width: 0;
    opacity: 1;
    overflow: visible;
    padding: 6px;
    pointer-events: auto;
    position: static;
    transform: none;
    transition: none;
    visibility: visible;
    width: 100%;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > .dropdown-menu {
    max-height: 760px;
    opacity: 1;
    overflow: visible;
    pointer-events: auto;
    transform: translateY(0);
    visibility: visible;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu {
    background: rgba(255, 255, 255, .06);
    border: 0;
    border-radius: 7px;
    box-shadow: none;
    display: block !important;
    float: none;
    left: auto !important;
    margin: 4px 0 8px 18px;
    max-height: none;
    min-width: 0;
    opacity: 1;
    overflow: visible;
    padding: 5px;
    pointer-events: auto;
    position: static !important;
    top: auto !important;
    transform: none;
    visibility: visible;
    width: auto;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a {
    align-items: center;
    border-radius: 6px;
    color: rgba(255, 255, 255, .78) !important;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    gap: 8px;
    letter-spacing: 0;
    padding: 9px 10px;
    position: relative;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li.active > a:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:hover:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:focus:before {
    background: #18c7c8;
    border-radius: 0 3px 3px 0;
    bottom: 8px;
    content: "";
    left: 0;
    position: absolute;
    top: 8px;
    width: 3px;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a > i {
    color: rgba(255, 255, 255, .7);
    min-width: 16px;
    text-align: center;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:hover,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li.active > a {
    background: rgba(255, 255, 255, .12) !important;
    color: #fff !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu {
    bottom: 20px;
    float: none !important;
    left: 12px;
    margin: 0;
    position: fixed !important;
    right: auto;
    top: auto !important;
    width: 212px;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav {
    float: none !important;
    margin: 0;
    width: 100%;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user {
    display: block;
    float: none;
    width: 100%;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle {
    align-items: center;
    background: rgba(255, 255, 255, .08) !important;
    border-radius: 8px;
    color: #fff;
    display: flex;
    gap: 10px;
    min-height: 58px;
    padding: 9px 10px;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user .username {
    color: #fff;
    display: block;
    font-size: 13px;
    font-weight: 800;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-menu {
    bottom: 64px;
    left: 0;
    right: auto;
    top: auto;
  }

  body.page-container-bg-solid .page-container,
  body.page-container-bg-solid .page-footer {
    margin-left: 236px !important;
    width: calc(100% - 236px) !important;
  }

  body.page-container-bg-solid .page-container .page-content-wrapper,
  body.page-container-bg-solid .page-content,
  body.page-container-bg-solid .page-head {
    margin-left: 0 !important;
    width: 100% !important;
  }

  body.page-container-bg-solid .page-container {
    background: #f3f7fa !important;
    padding: 24px 26px 46px;
  }

  body.page-container-bg-solid .page-content {
    padding: 18px 0 0 !important;
  }

  body.page-container-bg-solid .page-head {
    padding-top: 0;
  }

  body.page-container-bg-solid .page-footer {
    background: transparent !important;
    color: #718391;
    padding-left: 26px;
  }
}

@media (max-width: 991px) {
  body.page-container-bg-solid {
    background: #f3f7fa !important;
  }

  body.page-container-bg-solid .page-header {
    background: #075467 !important;
  }

  body.page-container-bg-solid .page-header .page-header-top {
    background: #075467 !important;
  }

  body.page-container-bg-solid .page-header .page-logo img.logo-default {
    filter: brightness(0) invert(1);
  }

  body.page-container-bg-solid .page-header .page-header-menu {
    background: #064f63 !important;
  }

  body.page-container-bg-solid .page-container {
    padding: 12px;
  }

  body.page-container-bg-solid .page-head .container {
    display: block;
  }

  body.page-container-bg-solid .page-title h1 {
    font-size: 24px;
  }

  body.page-container-bg-solid .page-content {
    padding-top: 12px !important;
  }

  body.page-container-bg-solid .dashboard-stat {
    min-height: 118px;
  }
}

@media (max-width: 640px) {
  body.page-container-bg-solid .page-container {
    padding: 10px;
  }

  body.page-container-bg-solid .page-title h1 {
    font-size: 22px;
  }

  body.page-container-bg-solid .dashboard-stat .details .number {
    font-size: 28px;
  }

  body.page-container-bg-solid .portlet.light > .portlet-body {
    padding: 14px !important;
  }
}

/* v6 sidebar correction: light app navigation, original logo, stable menu area. */
@media (min-width: 992px) {
  body.page-container-bg-solid .page-header {
    background: #ffffff !important;
    border-right: 1px solid #dfe8ee !important;
    box-shadow: 10px 0 28px rgba(23, 39, 54, .08) !important;
  }

  body.page-container-bg-solid .page-header .page-logo {
    border-bottom: 1px solid #e7eef3;
    height: 78px;
    padding: 20px 17px 16px;
  }

  body.page-container-bg-solid .page-header .page-logo img.logo-default {
    filter: none !important;
    opacity: 1;
    width: 178px !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu {
    background: #ffffff !important;
    bottom: auto !important;
    display: block !important;
    height: calc(100vh - 174px) !important;
    left: auto !important;
    max-height: calc(100vh - 174px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 10px 10px 18px !important;
    position: static !important;
    right: auto !important;
    top: auto !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu::-webkit-scrollbar {
    width: 8px;
  }

  body.page-container-bg-solid .page-header .page-header-menu::-webkit-scrollbar-thumb {
    background: #cfe1e8;
    border-radius: 999px;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li {
    margin: 0 0 5px;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:before {
    bottom: 6px;
    left: -10px;
    top: 6px;
    width: 4px;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover:before {
    background: #17b7b9;
    box-shadow: none;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a {
    color: #18232f !important;
    min-height: 44px;
    padding: 8px 10px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > a,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > a,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > a,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > a {
    background: #eaf7f7 !important;
    color: #101820 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i {
    background: #e6fbfb;
    border-color: #bfedef;
    color: #0b8f97 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-settings,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-building-o {
    background: #fff4e5;
    border-color: #ffdca9;
    color: #c76f13 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-social-dribbble,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-dollar,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-money {
    background: #e9f8ef;
    border-color: #c4ead4;
    color: #168653 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-users,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-users {
    background: #eaf2ff;
    border-color: #c8dcff;
    color: #2f6cb6 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-camera-retro,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-picture-o {
    background: #fff0f0;
    border-color: #ffcaca;
    color: #c94a4a !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.fa-rocket {
    background: #f3edff;
    border-color: #ddccff;
    color: #7151b8 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > a > i,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > a > i,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > a > i,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > a > i {
    background: #ffffff !important;
    border-color: #b9dfe2 !important;
    color: #087f8f !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu {
    background: #f7fbfc !important;
    border: 1px solid #e1edf2 !important;
    display: block !important;
    margin: 4px 0 8px 38px;
    max-height: 0;
    opacity: 0;
    overflow: hidden !important;
    padding: 0 5px !important;
    pointer-events: none;
    transition: max-height .2s ease, opacity .16s ease, padding .16s ease;
    visibility: hidden;
    width: auto;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > .dropdown-menu {
    max-height: 820px;
    opacity: 1;
    overflow: visible !important;
    padding: 5px !important;
    pointer-events: auto;
    visibility: visible;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu {
    background: #ffffff !important;
    border: 1px solid #e7eef3 !important;
    display: block !important;
    margin: 4px 0 8px 16px;
    max-height: 0;
    opacity: 0;
    overflow: hidden !important;
    padding: 0 5px !important;
    pointer-events: none;
    position: static !important;
    visibility: hidden;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:hover > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:focus-within > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu.active > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu.open > .dropdown-menu {
    max-height: 760px;
    opacity: 1;
    overflow: visible !important;
    padding: 5px !important;
    pointer-events: auto;
    visibility: visible;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a {
    color: #40515f !important;
    font-size: 12px;
    min-height: 34px;
    padding: 8px 9px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a > i {
    color: #77909d !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:hover,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:focus,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li.active > a {
    background: #eaf7f7 !important;
    color: #0f2530 !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu {
    background: #ffffff;
    border-top: 1px solid #e7eef3;
    bottom: 0;
    left: 0;
    padding: 12px 10px;
    width: 236px;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle {
    background: #f5fafb !important;
    border: 1px solid #e0ebf0;
    color: #172736;
    min-height: 56px;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user .username {
    color: #172736;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-menu {
    bottom: 72px;
    left: 10px;
  }
}

/* v7: Desktop sidebar menus must be clickable, not hover flyouts. */
@media (min-width: 992px) {
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu.pull-left,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu.pull-right {
    display: block !important;
    float: none !important;
    left: auto !important;
    margin: 4px 0 10px 38px !important;
    max-height: none !important;
    min-width: 0 !important;
    opacity: 1 !important;
    overflow: visible !important;
    padding: 5px !important;
    pointer-events: auto !important;
    position: static !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    visibility: visible !important;
    width: auto !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu.pull-left,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu.pull-right {
    display: block !important;
    float: none !important;
    left: auto !important;
    margin: 4px 0 8px 16px !important;
    max-height: none !important;
    min-width: 0 !important;
    opacity: 1 !important;
    overflow: visible !important;
    padding: 5px !important;
    pointer-events: auto !important;
    position: static !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    visibility: visible !important;
    width: auto !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.menu-dropdown > a .arrow,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu > a .arrow {
    display: none !important;
  }
}

/* v8: stronger dashboard metric icons and sandbox switch in the dashboard header. */
.page-container-bg-solid .dashboard-stat .visual {
  align-items: center;
  display: flex;
  justify-content: center;
  opacity: 1 !important;
}

.page-container-bg-solid .dashboard-stat .visual > i {
  background: #e4fbfb !important;
  border: 1px solid #a9e8eb !important;
  box-shadow: 0 12px 22px rgba(13, 166, 168, .18) !important;
  color: #087f8f !important;
  font-size: 25px !important;
  opacity: 1 !important;
}

.page-container-bg-solid .dashboard-stat .visual > i:before {
  opacity: 1 !important;
}

.page-container-bg-solid .dashboard-stat.blue .visual > i {
  background: #e4fbfb !important;
  border-color: #a9e8eb !important;
  color: #087f8f !important;
}

.page-container-bg-solid .dashboard-stat.red .visual > i {
  background: #fff2e2 !important;
  border-color: #ffc56f !important;
  box-shadow: 0 12px 22px rgba(199, 111, 19, .16) !important;
  color: #c76f13 !important;
}

.page-container-bg-solid .dashboard-stat.green .visual > i {
  background: #e6f8ed !important;
  border-color: #9fdfba !important;
  box-shadow: 0 12px 22px rgba(22, 134, 83, .16) !important;
  color: #168653 !important;
}

@media (min-width: 992px) {
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch {
    box-shadow: 0 10px 24px rgba(23, 39, 54, .12) !important;
    height: 34px !important;
    margin: 0 !important;
    position: fixed !important;
    right: 540px;
    top: 48px;
    z-index: 10003;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-handle-on,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-handle-off,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-label {
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 20px !important;
    text-transform: none !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-handle-on {
    background: #0da6a8 !important;
    color: #fff !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-handle-off {
    background: #f5a623 !important;
    color: #172736 !important;
  }
}

@media (min-width: 992px) and (max-width: 1180px) {
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch {
    right: 420px;
  }
}

/* v10: professional dashboard shell, compact navigation, and integrated controls. */
@media (min-width: 992px) {
  body.page-container-bg-solid {
    background: #eef5f8 !important;
  }

  body.page-container-bg-solid .page-header {
    background: #ffffff !important;
    border-right: 1px solid #dce8ee !important;
    box-shadow: 14px 0 34px rgba(21, 37, 53, .08) !important;
    width: 272px !important;
  }

  body.page-container-bg-solid .page-header .page-logo {
    align-items: center;
    border-bottom: 1px solid #e7eff4;
    display: flex;
    height: 78px !important;
    padding: 0 20px !important;
  }

  body.page-container-bg-solid .page-header .page-logo a {
    line-height: 1;
    width: 100%;
  }

  body.page-container-bg-solid .page-header .page-logo img.logo-default {
    filter: none !important;
    height: auto !important;
    margin: 0 !important;
    opacity: 1 !important;
    width: 190px !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu {
    background: #ffffff !important;
    height: calc(100vh - 176px) !important;
    max-height: calc(100vh - 176px) !important;
    padding: 14px 14px 18px !important;
  }

  body.page-container-bg-solid .page-container,
  body.page-container-bg-solid .page-footer {
    margin-left: 272px !important;
    width: calc(100% - 272px) !important;
  }

  body.page-container-bg-solid .page-container {
    background:
      radial-gradient(circle at 12% 0, rgba(13, 166, 168, .10) 0, rgba(13, 166, 168, 0) 330px),
      linear-gradient(180deg, #f9fcfd 0, #eef5f8 310px, #eef5f8 100%) !important;
    padding: 26px 34px 56px !important;
  }

  body.page-container-bg-solid .page-head .container,
  body.page-container-bg-solid .page-content .container {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 1680px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.page-container-bg-solid .page-head .container {
    align-items: flex-start !important;
    display: flex !important;
    gap: 18px !important;
    justify-content: flex-start !important;
    min-height: 46px;
  }

  body.page-container-bg-solid .page-title {
    margin-right: auto !important;
    padding-top: 0 !important;
  }

  body.page-container-bg-solid .page-title h1 {
    color: #0f1d2b !important;
    font-size: 31px !important;
    font-weight: 850 !important;
    line-height: 1.08 !important;
  }

  body.page-container-bg-solid .page-title h1 small {
    color: #506575 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    margin-top: 7px !important;
  }

  body.page-container-bg-solid .page-head .container > div[style] {
    margin-top: 0 !important;
  }

  body.page-container-bg-solid .page-head .table-group-actions {
    align-items: center !important;
    background: #ffffff;
    border: 1px solid #dbe8ee;
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(21, 37, 53, .07);
    display: flex !important;
    float: none !important;
    gap: 8px;
    padding: 7px;
  }

  body.page-container-bg-solid .page-head #busselect {
    border-color: #cfe0e7 !important;
    color: #253647 !important;
    font-weight: 700;
    height: 34px !important;
    min-width: 180px;
  }

  body.page-container-bg-solid .page-head #buschange {
    background: #0da6a8 !important;
    border: 0 !important;
    box-shadow: 0 8px 16px rgba(13, 166, 168, .20) !important;
    height: 34px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  body.page-container-bg-solid .page-content {
    padding-top: 18px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li {
    margin-bottom: 6px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:before {
    border-radius: 999px;
    bottom: auto !important;
    height: 36px !important;
    left: -14px !important;
    top: 8px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a {
    border-radius: 8px !important;
    color: #172331 !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    min-height: 48px !important;
    padding: 9px 12px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > a,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > a,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > a,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > a {
    background: #e8f7f8 !important;
    color: #091723 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i {
    border-radius: 8px !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .75);
    font-size: 17px !important;
    height: 34px !important;
    line-height: 34px !important;
    min-width: 34px !important;
    width: 34px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-pie-chart:before {
    content: "\f200";
    font-family: FontAwesome !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-settings:before {
    content: "\f013";
    font-family: FontAwesome !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-social-dribbble:before {
    content: "\f201";
    font-family: FontAwesome !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-users:before {
    content: "\f0c0";
    font-family: FontAwesome !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a > i.icon-compass:before {
    content: "\f14e";
    font-family: FontAwesome !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu i.icon-map:before {
    content: "\f279";
    font-family: FontAwesome !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu i.icon-calendar:before {
    content: "\f073";
    font-family: FontAwesome !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a .arrow,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu > a .arrow {
    display: none !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:has(> .dropdown-menu) > a .arrow,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu:has(> .dropdown-menu) > a .arrow {
    align-items: center;
    color: #7c94a3;
    display: inline-flex !important;
    font-size: 13px;
    height: 20px;
    justify-content: center;
    margin-left: auto !important;
    width: 20px;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:has(> .dropdown-menu) > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu:has(> .dropdown-menu) > a .arrow:before {
    content: "\f105";
    font-family: FontAwesome;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu:hover > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu:focus-within > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu.open > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu.active > a .arrow:before {
    content: "\f107";
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu.pull-left,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu.pull-right {
    background: #f6fafc !important;
    border: 1px solid #dfeaf0 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    display: block !important;
    float: none !important;
    left: auto !important;
    margin: 6px 0 10px 46px !important;
    max-height: 0 !important;
    min-width: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    padding: 0 6px !important;
    pointer-events: none !important;
    position: static !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    transition: max-height .18s ease, opacity .14s ease, padding .14s ease !important;
    visibility: hidden !important;
    width: auto !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > .dropdown-menu {
    max-height: 880px !important;
    opacity: 1 !important;
    overflow: visible !important;
    padding: 6px !important;
    pointer-events: auto !important;
    visibility: visible !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu.pull-left,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu.pull-right {
    background: #ffffff !important;
    border: 1px solid #e4edf2 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    display: block !important;
    float: none !important;
    left: auto !important;
    margin: 5px 0 8px 18px !important;
    max-height: 0 !important;
    min-width: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    padding: 0 6px !important;
    pointer-events: none !important;
    position: static !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    visibility: hidden !important;
    width: auto !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:hover > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:focus-within > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu.active > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu.open > .dropdown-menu {
    max-height: 760px !important;
    opacity: 1 !important;
    overflow: visible !important;
    padding: 6px !important;
    pointer-events: auto !important;
    visibility: visible !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a {
    background: transparent !important;
    border-radius: 7px !important;
    color: #263848 !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    min-height: 36px !important;
    padding: 9px 10px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a > i {
    color: #668797 !important;
    font-size: 14px !important;
    min-width: 18px;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > a {
    background: #ffffff !important;
    border: 1px solid #e5eef3;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu.open > a,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:hover > a,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:focus-within > a {
    background: #e7f6f7 !important;
    border-color: #cfe9ec;
    color: #0d2433 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:hover,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:focus,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li.active > a {
    background: #e7f6f7 !important;
    color: #0d2433 !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu {
    background: #ffffff !important;
    border-top: 1px solid #e7eff4 !important;
    bottom: 0 !important;
    left: 0 !important;
    padding: 14px !important;
    width: 272px !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle {
    background: #f5fafc !important;
    border: 1px solid #dbe8ee !important;
    border-radius: 8px !important;
    color: #142435 !important;
    min-height: 58px !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user .username {
    color: #142435 !important;
    max-width: 172px !important;
  }

  body.page-container-bg-solid .dashboard-stat,
  body.page-container-bg-solid .portlet.light {
    border: 1px solid #dce8ee !important;
    border-radius: 8px !important;
    box-shadow: 0 14px 34px rgba(21, 37, 53, .08) !important;
  }

  body.page-container-bg-solid .dashboard-stat {
    min-height: 148px !important;
    padding: 22px 22px 58px !important;
  }

  body.page-container-bg-solid .dashboard-stat:before {
    background: linear-gradient(90deg, rgba(13, 166, 168, .9), rgba(13, 166, 168, 0));
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
  }

  body.page-container-bg-solid .dashboard-stat.red:before {
    background: linear-gradient(90deg, rgba(245, 140, 32, .9), rgba(245, 140, 32, 0));
  }

  body.page-container-bg-solid .dashboard-stat.green:before {
    background: linear-gradient(90deg, rgba(29, 151, 92, .9), rgba(29, 151, 92, 0));
  }

  body.page-container-bg-solid .dashboard-stat .visual {
    height: 62px !important;
    width: 62px !important;
  }

  body.page-container-bg-solid .dashboard-stat .visual > i {
    border-radius: 8px !important;
    font-size: 26px !important;
    height: 54px !important;
    line-height: 54px !important;
    width: 54px !important;
  }

  body.page-container-bg-solid .dashboard-stat .details {
    margin-left: 72px !important;
  }

  body.page-container-bg-solid .dashboard-stat .details .number {
    color: #0f1d2b !important;
    font-size: 34px !important;
    font-weight: 850 !important;
  }

  body.page-container-bg-solid .dashboard-stat .details .desc {
    color: #506575 !important;
    font-size: 13px !important;
  }

  body.page-container-bg-solid .dashboard-stat .more {
    background: #f7fbfc !important;
    border-top: 1px solid #e2edf2 !important;
    color: #0b8491 !important;
    font-size: 13px !important;
    letter-spacing: .01em;
  }

  body.page-container-bg-solid .portlet.light > .portlet-title {
    min-height: 62px !important;
    padding: 18px 20px 14px !important;
  }

  body.page-container-bg-solid .portlet.light > .portlet-body {
    padding: 20px !important;
  }

  body.page-container-bg-solid .tabbable-line > .nav-tabs > li > a,
  body.page-container-bg-solid .portlet.light > .portlet-title > .nav-tabs > li > a {
    color: #415665 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    white-space: nowrap !important;
  }

  body.page-container-bg-solid .tabbable-line > .nav-tabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px;
  }

  body.page-container-bg-solid .tabbable-line > .nav-tabs > li.active > a,
  body.page-container-bg-solid .portlet.light > .portlet-title > .nav-tabs > li.active > a {
    color: #0d2433 !important;
  }

  body.page-container-bg-solid .table > thead > tr > th {
    background: #f4f8fb !important;
    color: #415665 !important;
  }

  body.page-container-bg-solid .table > tbody > tr > td {
    background: #ffffff;
  }

  body.page-container-bg-solid .table-hover > tbody > tr:hover > td,
  body.page-container-bg-solid .table-hover > tbody > tr:hover > th {
    background: #eef9fa !important;
  }

  body.page-container-bg-solid .chart {
    background:
      linear-gradient(180deg, rgba(13, 166, 168, .05), rgba(13, 166, 168, 0)),
      repeating-linear-gradient(0deg, transparent 0, transparent 54px, rgba(86, 111, 125, .09) 55px),
      repeating-linear-gradient(90deg, transparent 0, transparent 92px, rgba(86, 111, 125, .06) 93px);
    border: 1px solid #edf3f6;
    border-radius: 8px;
    min-height: 276px;
  }

  body.page-container-bg-solid .well {
    background: #f7fafc !important;
    border: 1px solid #e2edf2 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch {
    background: linear-gradient(90deg, #ffffff 0 50%, #f5a623 50% 100%) !important;
    border: 1px solid #cfe0e7 !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 24px rgba(21, 37, 53, .08) !important;
    color: transparent !important;
    font-size: 0 !important;
    height: 36px !important;
    overflow: hidden !important;
    position: fixed !important;
    right: 368px !important;
    top: 34px !important;
    width: 214px !important;
    z-index: 10003 !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch.bootstrap-switch-on {
    background: linear-gradient(90deg, #0da6a8 0 50%, #ffffff 50% 100%) !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch:before,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch:after {
    align-items: center;
    bottom: 3px;
    display: flex;
    font-size: 12px;
    font-weight: 850;
    justify-content: center;
    letter-spacing: 0;
    position: absolute;
    top: 3px;
    width: calc(50% - 3px);
    z-index: 2;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch:before {
    color: #536779;
    content: "Production";
    left: 3px;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch:after {
    color: #172331;
    content: "SandBox";
    right: 3px;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch.bootstrap-switch-on:before {
    color: #ffffff;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch.bootstrap-switch-on:after {
    color: #536779;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-container {
    opacity: 0 !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-handle-on,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-handle-off,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-label {
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 22px !important;
    text-transform: none !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-handle-on {
    background: #0da6a8 !important;
    color: #ffffff !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch .bootstrap-switch-handle-off {
    background: #f5a623 !important;
    color: #172331 !important;
  }
}

@media (min-width: 992px) and (max-width: 1280px) {
  body.page-container-bg-solid .page-header {
    width: 248px !important;
  }

  body.page-container-bg-solid .page-container,
  body.page-container-bg-solid .page-footer {
    margin-left: 248px !important;
    width: calc(100% - 248px) !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu {
    width: 248px !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch {
    right: 312px !important;
  }
}

/* v11: sidebar footer environment switch and consistent nested navigation. */
@media (min-width: 992px) {
  body.page-container-bg-solid .page-header {
    width: 280px !important;
  }

  body.page-container-bg-solid .page-container,
  body.page-container-bg-solid .page-footer {
    margin-left: 280px !important;
    width: calc(100% - 280px) !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu {
    height: calc(100vh - 238px) !important;
    max-height: calc(100vh - 238px) !important;
    padding: 14px 16px 18px !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu {
    bottom: 60px !important;
    padding: 0 16px !important;
    width: 280px !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user > .dropdown-toggle {
    background: #f4fafc !important;
    border: 1px solid #d6e7ee !important;
    box-shadow: 0 10px 22px rgba(21, 37, 53, .07);
    min-height: 62px !important;
    padding: 10px 12px !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user .username {
    color: #142435 !important;
    font-size: 13px !important;
    max-width: 178px !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-menu {
    background: #ffffff !important;
    border: 1px solid #dbe8ee !important;
    border-radius: 8px !important;
    bottom: 74px !important;
    box-shadow: 0 18px 38px rgba(21, 37, 53, .16) !important;
    left: 16px !important;
    min-width: 248px !important;
    overflow: hidden;
    padding: 6px !important;
    width: 248px !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-menu:before,
  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-menu:after {
    display: none !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-menu > li > a {
    align-items: center;
    border-radius: 7px;
    color: #243746 !important;
    display: flex;
    font-size: 13px;
    font-weight: 750;
    gap: 10px;
    min-height: 40px;
    padding: 10px 12px !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-menu > li > a:hover,
  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-menu > li > a:focus {
    background: #e8f7f8 !important;
    color: #0d2433 !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-menu > li > a > i {
    color: #0b8491 !important;
    font-size: 15px;
    min-width: 18px;
    text-align: center;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a {
    gap: 12px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a .arrow,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu > a .arrow {
    color: transparent !important;
    display: none !important;
    font-size: 0 !important;
    height: 22px !important;
    margin-left: auto !important;
    position: relative;
    width: 22px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:has(> .dropdown-menu) > a .arrow,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu:has(> .dropdown-menu) > a .arrow {
    align-items: center;
    display: inline-flex !important;
    justify-content: center;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a .arrow.open:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu > a .arrow.open:before {
    color: #7b94a3 !important;
    content: "\f105" !important;
    font-family: FontAwesome !important;
    font-size: 13px !important;
    line-height: 1 !important;
    margin: 0 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu:hover > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu:focus-within > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu.open > a .arrow:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu.active > a .arrow:before {
    color: #0b8491 !important;
    content: "\f107" !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu.pull-left,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > .dropdown-menu.pull-right {
    background: transparent !important;
    border: 0 !important;
    border-left: 1px solid #d9e8ee !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 7px 0 12px 45px !important;
    padding: 0 0 0 13px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:hover > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li:focus-within > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.open > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li.active > .dropdown-menu {
    padding: 0 0 0 13px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu.pull-left,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > .dropdown-menu.pull-right {
    background: transparent !important;
    border: 0 !important;
    border-left: 1px solid #dfeaf0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 4px 0 8px 16px !important;
    padding: 0 0 0 12px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:hover > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:focus-within > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu.active > .dropdown-menu,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu.open > .dropdown-menu {
    padding: 0 0 0 12px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li {
    margin: 2px 0 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > a {
    background: transparent !important;
    border: 0 !important;
    border-radius: 7px !important;
    color: #293b4a !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    gap: 10px !important;
    min-height: 36px !important;
    padding: 8px 9px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a > i,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu > a > i {
    color: #668797 !important;
    font-size: 14px !important;
    min-width: 18px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:hover,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:focus,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li.active > a,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu.open > a,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:hover > a,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu .dropdown-submenu:focus-within > a {
    background: #e8f7f8 !important;
    color: #0d2433 !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li.active > a:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:hover:before,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-menu > li > a:focus:before {
    bottom: 9px !important;
    top: 9px !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch.bootstrap-switch-on,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch.bootstrap-switch-off {
    background: #f4fafc !important;
    border: 1px solid #d6e7ee !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 22px rgba(21, 37, 53, .07) !important;
    height: 40px !important;
    left: 16px !important;
    overflow: hidden !important;
    position: fixed !important;
    right: auto !important;
    top: auto !important;
    bottom: 14px !important;
    width: 248px !important;
    z-index: 10004 !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch:before,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch:after {
    bottom: 4px !important;
    border-radius: 6px;
    font-size: 12px !important;
    top: 4px !important;
    width: calc(50% - 5px) !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch:before {
    background: transparent;
    color: #526777 !important;
    left: 4px !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch:after {
    background: #f5a623;
    color: #172331 !important;
    right: 4px !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch.bootstrap-switch-on:before {
    background: #0da6a8;
    color: #ffffff !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch.bootstrap-switch-on:after {
    background: transparent;
    color: #526777 !important;
  }

  body.page-container-bg-solid .page-head .table-group-actions {
    margin-right: 0 !important;
  }
}

@media (min-width: 992px) and (max-width: 1280px) {
  body.page-container-bg-solid .page-header {
    width: 260px !important;
  }

  body.page-container-bg-solid .page-container,
  body.page-container-bg-solid .page-footer {
    margin-left: 260px !important;
    width: calc(100% - 260px) !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu {
    width: 260px !important;
  }

  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch.bootstrap-switch-on,
  body.page-container-bg-solid .page-header .page-header-menu .bootstrap-switch-id-sandBoxSwitch.bootstrap-switch-off {
    width: 228px !important;
  }
}

/* v12: keep sidebar footer controls separated and user menu consistent. */
@media (min-width: 992px) {
  body.page-container-bg-solid .page-header .page-header-top .top-menu {
    bottom: 78px !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a .arrow:after,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu > a .arrow:after,
  body.page-container-bg-solid .page-header .hor-menu .navbar-nav > li > a .arrow.open:after,
  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu > a .arrow.open:after {
    content: none !important;
    display: none !important;
  }

  body.page-container-bg-solid .page-header .hor-menu .dropdown-submenu > a:after,
  body.page-container-bg-solid .page-header .hor-menu .classic-menu-dropdown > a:after {
    content: none !important;
    display: none !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-user:hover > .dropdown-menu,
  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-user:focus-within > .dropdown-menu,
  body.page-container-bg-solid .page-header .page-header-top .top-menu .dropdown-user.open > .dropdown-menu {
    display: block !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user > .dropdown-menu {
    background: #ffffff !important;
    border: 1px solid #dbe8ee !important;
    border-radius: 8px !important;
    bottom: 74px !important;
    box-shadow: 0 18px 38px rgba(21, 37, 53, .16) !important;
    left: 16px !important;
    min-width: 248px !important;
    padding: 6px !important;
    width: 248px !important;
  }

  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user > .dropdown-menu:before,
  body.page-container-bg-solid .page-header .page-header-top .top-menu .navbar-nav > li.dropdown-user > .dropdown-menu:after {
    content: none !important;
    display: none !important;
  }
}