/*Midas-Backend*/

/*Boilerplate*/
html, button, input, select, textarea {
  color: #222;
}

html {
  font-size: 1em;
  line-height: 1.4;
  height: 100%;
}

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

.hr-decoration-vertical {
  height: 50px;
  width: 1px;
  border: none;
  margin: 0;
}


.hr-decoration-vertical--w-2 {
  width: 2px;
}
.hr-decoration-colored {
  border: 0;
  border-top: 1px solid var(--color-secondary-400);

}

audio, canvas, img, video {
  vertical-align: middle;
}

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

textarea {
  resize: vertical;
  width: inherit;
  display: block;
  word-wrap: break-word;
}

input {
  padding-left: 2px;
  padding-right: 2px;
}

div {
  word-wrap: break-word;
}

.browsehappy {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

.ir {
  background-color: transparent;
  border: 0;
  overflow: hidden; /* IE 6/7 fallback */
  *text-indent: -9999px;
}

.ir:before {
  content: "";
  display: block;
  width: 0;
  height: 150%;
}

.hidden {
  display: none !important;
  visibility: hidden;
}

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

.invisible {
  visibility: hidden;
}

.clearfix:before,
.clearfix:after {
  content: " "; /* 1 */
  display: table; /* 2 */
}

.clearfix:after {
  clear: both;
}

.clearfix {
  *zoom: 1;
}

/*general*/
a {
  cursor: pointer
}

h1 {
  font-size: 1.4em;
  color: #BBB;
  padding: .8em 0 .1em;
  margin-bottom: 1em;
  font-weight: bold;
}

.box .wrapper h1 {
  border-bottom: 1px solid #CCC;
}

h1 span, label {
  color: #434345;
}

h1 span + span {
  color: #777;
}

h1 i {
  color: #689b8a;
}

h2 {
  font-size: 1.2em;
  margin: 1.4em 0 .6em;
}

h2, .subtitle {
  border-bottom: 1px solid #dddbdb;
  font-weight: bold;
  padding-bottom: 0.1em;
}

h2, .subtitle-limit {
  border-bottom: 1px solid #dddbdb;
  font-weight: bold;
  padding-bottom: 16px !important;
}

.subtitle {
  font-size: 1.2em !important;
  margin: 1em 0;
}

.subtitle-limit {
  margin: 0px;
  margin-top: -8px;
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  font-style: normal;
  font-weight: 700;
  line-height: normal;

}

.subtitle-limit:before{
  content: " \ • ";
  font-size: 24px;
  padding-right: .4em;
  color: #3E847F !important;
}

h2 i {
  color: #999;
}

.subtitle:before {
  content: " \ • ";
  font-size: 20px;
  padding-right: .4em;
  color: #3E847F
}

.quote {
  font-size: .7em;
  padding: .4em 0;
}

li {
  list-style: none;
}

.box .subtitle + ul {
  list-style: none;
  padding: 0;
}

.box .subtitle + ul li {
  margin-bottom: .5em;
  line-height: normal;
  text-align: left;
}

.box .subtitle + ul li span:first-child {
  text-align: right !important
}

.box .subtitle + ul li span + span {
  font-weight: bold;
}

.radio-inline input {
  margin: 0 !important;
  width: min-content !important;
  position: inherit !important;
}

.checkboxGroup label {
  padding-right: 5%;
}

.checkboxOnly {
  width: auto !important;
  cursor: pointer
}

/*transition-hover*/
.input-prepend input:focus, .loginPage .loginForm .loginFormwrap .login input.btnLogin, a, .boxed .title, .bgtabs .tabsNav li.addTab a i, .bgtabs .tabsNav li a i, .bgtabs .tabsNav li.selected a i, .bgtabs .tabsNav li.addTab, .bgsubtabs .tabsNav li a i:nth-child(2), button[class^="btn"], ul li a i.icon-calculator:hover {
  transition: all .1s ease-out !important;
}

.input-prepend input:focus, .loginPage .loginForm .loginFormwrap .login input.btnLogin, a, .boxed .title, .bgtabs .tabsNav li.addTab a i, .bgtabs .tabsNav li a i, .bgtabs .tabsNav li.selected a i, .bgtabs .tabsNav li.addTab, .bgsubtabs .tabsNav li a i:nth-child(2), button[class^="btn"], ul li a i.icon-upload:hover {
  transition: all .1s ease-out !important;
}

sup {
  color: red;
}

/*Set Color Text*/
.green, .textGreen, .Approved {
  color: #379021 !important;
}

.red, .textRed, .Canceled {
  color: #d43f3a !important;
}

.orange, .textOrange, .Deferred {
  color: orange !important;
}

.blue, .textBlue {
  color: #3c78b5 !important;
}

.textBlack {
  color: #000000 !important;
}

/* End Set Color Text*/

/*line_sideNav*/
/*header + .ng-scope, header + .ng-scope, .main.ng-scope, .bgtabs+div, .global[class$=Page]{  min-height:100%; max-height:200%; }*/

/*loader*/
.loading-spinner {
  margin: 0 !important;
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 10000;
  background: #fff;
  opacity: .8
}

.loading-spinner img {
  position: relative;
  top: 50%;
  margin: 0 auto;
  display: block;
}

/*colors-icons*/
i[class^="fa"] {
  padding-right: 2px;
}

div[class$="Page"]
.fa-2x {
  font-size: 1.5em !important;
}

/*Contents*/
body {
  background-image: url(../img/bg.gif) !important; /*font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;*/
  font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif;
  color: #444;
  text-rendering: optimizeLegibility; /*height:100%*/
  height: 100%;
  margin: 0;
  padding: 0;
}

.global /*, .global[class$=Page]*/
{
  height: 100%
}

div[class$="Page"] {
  height: 100%;
}

/* page content */
.content {
  display: inline-block;
  vertical-align: top;
  width: 84%
}

.auto-width {
  width: 70%;
}

#asideRight {
  top: 14.7%;
  -webkit-transition: all 0.6s ease;
  -moz-transition: all 0.6s ease;
  -ms-transition: all 0.6s ease;
  -o-transition: all 0.6s ease;
  transition: all 0.6s ease;
}

.no-padding {
  padding-right: 0% !important;
  padding-left: 0% !important;
}

.no-absolute {
  position: static !important;
  right: auto !important;
  left: auto !important;
}

.aside-Fixed {
  position: fixed;
  z-index: 7;
  height: 85%;
  min-height: 85% !important;
  overflow-y: scroll;
  scrollbar-color: #434345 #62a921;
  scrollbar-width: none;
}

/* Scrolling control in right sidebar */

.aside-Fixed::-webkit-scrollbar {
  width: 1px;
}

.aside-Fixed::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.hide-li-menu {
  background: #434345 !important;
  color: #ffffff;
  cursor: pointer;
}

.hide-li-menu i {
  padding: 6px 10px;
}

.hide-li-menu:hover {
  color: #62a921;
}

.sidebarFixed {
  cursor: pointer;
  position: fixed;
  z-index: 3;
  top: 50%;
  background-color: #62a921;
  overflow-x: hidden;
  transition: 0.5s;
  writing-mode: vertical-rl;
  padding: 12px;
  color: #FFF;
  display: none;
}

.sidebarFixed:hover {
  background-color: #434345;
}

.rightFixed {
  right: 0;
  margin-right: 10px;
}

.leftFixed {
  text-align: right;
  left: 0;
  margin-left: 10px;
}

.right-aside-ul {
  font-size: 14px;
  padding-left: 15px;
}

.right-aside-ul li {
  background: unset !important;
  margin-bottom: 6px;
}

.warning-custom-info {
  background: #f0c487;
  border: 1px solid #e3b97e;
  color: #58390b;
  border-radius: 6px;
  padding: 12px;
  margin: 2px;
  font-size: small;
  font-style: italic;
  font-weight: 500;
}

.notes-custom-info {
  background: #D4E4FF;
  border: 1px solid #487BD3;
  color: #002D7A;
  border-radius: 6px;
  padding: 12px;
  margin: 2px;
  font-size: small;
  font-style: italic;
  font-weight: 500;
}

.input-form.is-filled{
  border: 1px solid var(--color-base-600);
  color: var(--color-base-700);
}

.message-box {
  display: flex;
  padding: 8px;
  justify-content: center;
  align-items: center;
  gap: var(--spacing-2);
  border-radius: 4px;
}

.message-box--warning {
  border: 1px solid var(--color-warning-200);
  background: var(--color-base-100);
}

.message-box--success {
  border: 1px solid var(--color-primary-800);
  background: var(--color-base-100);
}

.message-box--error {
  border: 1px solid var(--color-error-500);
  background: var(--color-base-100);
}

.message-box--secondary-400 {
  border-left: 3px solid var(--color-secondary-400);
  background: var(--color-secondary-100);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.message-box--error-300 {
  border-left: 3px solid var(--color-error-300);
  background: var(--color-error-100);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

#notes-custom-more {
  display: none;
}

.sub-menu-container {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
  border-radius: 4px;
  background: var(--color-base-100);
}

.clusterContainer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
}

#summary {
  font-size: 14px;
  line-height: 1.5;
}

#summary p.collapse:not(.show) {
  height: 42px !important;
  overflow: hidden;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

#summary p.collapsing {
  min-height: 42px !important;
}

#summary a.collapsed:after {
  content: '+ Read More';
}

#summary a:not(.collapsed):after {
  content: '- Read Less';
}


.w100 {
  width: 98%;
}

.w80 {
  width: 80%;
  left: -.3%;
  position: relative;
}

.side-tab-pane /*old-version*/, .side-tab-content {
  width: 98%;
  margin: 0 auto
}

div[class^="table"] {
  font-size: .8em;
  text-align: justify;
  margin-top: 1em;
  padding-bottom: 1em;
}

div[class*="col full"] {
  margin-left: 0px !important;
}

/*Header*/
header.top {
  width: 100%;
  background-color: #F5F5F5;
}

header.top .header-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 92%;
  height: 72px;
  margin: 0 auto;
  overflow: hidden;
}

/*left*/
header.top .header-inner .logo a {
  background: url(../img/new_backend_logo.svg);
  background-size: contain;
  height: 50px;
  background-repeat: no-repeat;
  background-position: 0 50%;
  display: block; /*-webkit-transition: opacity 0.2s ease; transition: opacity 0.2s ease;*/
  width: 400px;
}

/*right*/

.userInfo {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: bold;
  font-size: 16px;
}

.user-account {
  padding-right: 10px;
  border-right: 1px solid #467C18;
}

.log-out {
  font-size: 16px;
  padding-left: 10px;
}

.log-out a {
  color: #B6B6B6;
  transition: color 0.5s ease;
}

.log-out a:hover {
  text-decoration: none;
  color: #2B2B2B;
}

/*main-navigation*/
nav ul.nav {
  font-size: .8em;
  font-weight: bold;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  border-bottom: 1px solid #FFF;
  /*background: #ffffff;
  background: -moz-linear-gradient(top, #ffffff 28%, #e7e6e4 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(28%,#ffffff), color-stop(100%,#e7e6e4));
  background: -webkit-linear-gradient(top, #ffffff 28%,#e7e6e4 100%);
  background: -o-linear-gradient(top, #ffffff 28%,#e7e6e4 100%);
  background: -ms-linear-gradient(top, #ffffff 28%,#e7e6e4 100%);
  background: linear-gradient(to bottom, #ffffff 28%,#e7e6e4 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e7e6e4',GradientType=0 );
  box-shadow:0 1px 1px #CCC;*/
}

.topNav ul.nav li {
  display: inline-block;
  list-style: none;
  padding: .1em 1em;
  text-shadow: 1px 1px 1px #FFFFFF;
}

.topNav ul.nav li a {
  text-decoration: none;
  color: #555;
  font-size: 1.3em;
}

/*.topNav ul.nav li a:hover, .navbar-default .navbar-nav>.active>a:hover{ color:#000; background:none!important;}*/
.navbar-default .navbar-nav > .active > a:hover {
  color: #FFF;
}

.topNav ul.nav li a.selected, .navbar-default .navbar-nav > .active > a {
  color: #FFF;
  text-shadow: 0 1px 1px #2a580b;
  padding: 0.4em 1em 0.4em;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  border: 1px solid #ccc;
  background: #8bcb36; /* Old browsers */
  background: -moz-linear-gradient(top, #8bcb36 0%, #77b735 50%, #62a921 52%, #459014 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8bcb36), color-stop(50%, #77b735), color-stop(52%, #62a921), color-stop(100%, #459014)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #8bcb36 0%, #77b735 50%, #62a921 52%, #459014 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #8bcb36 0%, #77b735 50%, #62a921 52%, #459014 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #8bcb36 0%, #77b735 50%, #62a921 52%, #459014 100%); /* IE10+ */
  background: linear-gradient(to bottom, #8bcb36 0%, #77b735 50%, #62a921 52%, #459014 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8bcb36', endColorstr='#459014', GradientType=0); /* IE6-9 */
}

.navbar-default .navbar-nav > .active > a:hover {
}

/*Cambios por bootstrap-------------------------------------------------------*/
.navbar {
  margin-bottom: 0;
  background-color: #FCFCFC !important;
  border: none;
}

.navbar-nav > li, .navbar-nav {
  padding: 0;
  float: none !important;
}

.navbar-nav {
  border-bottom: 0 !important;
}

.navbar-nav > li > a {
}

/*bg-mainTabs*/
.tab-content, .tab-pane {
  height: 100%;
}

.bgtabs {
  min-height: 30px;
  background: #123337; /* Old browsers */
  background: -moz-linear-gradient(left, #123337 1%, #264f49 49%, #688b72 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(1%, #123337), color-stop(49%, #264f49), color-stop(100%, #688b72)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left, #123337 1%, #264f49 49%, #688b72 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left, #123337 1%, #264f49 49%, #688b72 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left, #123337 1%, #264f49 49%, #688b72 100%); /* IE10+ */
  background: linear-gradient(to right, #123337 1%, #264f49 49%, #688b72 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#123337', endColorstr='#688b72', GradientType=1); /* IE6-9 */
  /*border-bottom:2px solid #DDD;*/
}

.bgtabs .tabsNav {
  margin: 0;
  text-align: center;
  padding: 0;
}

.bgtabs .tabsNav li {
  position: relative;
  top: .2em
}

.bgtabs .tabsNav li, .bgsubtabs .tabsNav li {
  list-style: none;
  display: inline-block;
  margin: .2em;
  border-radius: 4px 4px 0 0;
  -moz-border-radius: 4px 4px 0 0;
  -webkit-border-radius: 4px 4px 0 0;
  background-image: url(../img/bg_tab_selected.png);
}

.bgtabs .tabsNav li a, .bgsubtabs .tabsNav li a {
  color: #666;
  display: inline-block;
  text-decoration: none;
  font-size: .9em;
  font-weight: bold; /*padding: .4em 4em .4em 5em;*/
  text-transform: uppercase;
  padding: .4em 1.6em;
}

.bgtabs .tabsNav li a:nth-child(2), .bgsubtabs .tabsNav li a:nth-child(2) {
  padding: .2em !important;
  display: inline-block;
  font-size: 1.1em;
  color: #ccc;
}

.bgtabs .tabsNav li.selected {
  position: relative;
  top: .2em;
}

.bgtabs .tabsNav li.selected a {
  display: block;
  text-decoration: none;
  font-size: .9em;
  font-weight: bold;
  display: inline-block;
}

.bgtabs .tabsNav li.selected a:nth-child(2) {
  font-size: 1.1em;
  color: #ccc !important;
}

.bgtabs .tabsNav li.selected, .bgsubtabs .tabsNav li.selected {
  background-image: url(../img/bg_tab.png);
  display: inline-block;
}

.bgtabs .tabsNav li a i:hover, .bgtabs .tabsNav li.selected a:nth-child(2):hover, .bgsubtabs .tabsNav li a i:hover {
  color: #f86c6c !important;
}

.bgtabs .tabsNav li.selected a, .bgtabs .tabsNav li.addTab a i {
  color: #87c736 !important;
}

.bgtabs .tabsNav li.addTab {
  border-radius: 4px 4px 4px 0;
  -moz-border-radius: 4px 4px 4px 0;
  -webkit-border-radius: 4px 4px 4px 0;
  box-shadow: 1px 1px 3px 0 #143538;
  background: #fff;
  background: -moz-linear-gradient(top, #fff 0%, #f3f3f3 99%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(99%, #f3f3f3));
  background: -webkit-linear-gradient(top, #fff 0%, #f3f3f3 99%);
  background: -o-linear-gradient(top, #fff 0%, #f3f3f3 99%);
  background: -ms-linear-gradient(top, #fff 0%, #f3f3f3 99%);
  background: linear-gradient(to bottom, #fff 0%, #f3f3f3 99%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f3f3f3', GradientType=0);
}

.bgtabs .tabsNav li.addTab.selected {
  opacity: 0.80;
}

.bgtabs .tabsNav li.addTab a {
  padding: 0.3em .5em .1em;
}

.bgtabs .tabsNav li.addTab a i {
  top: -2px;
  position: relative;
  left: 1px;
  font-size: 0.9em;
}

.bgtabs .tabsNav li.addTab a i:hover {
  color: #434345;
}

.bgtabs .tabsNav li.addTab.selected {
  /*top:0!important;*/
}

.bgtabs .tabsNav li.addTab.selected:hover {
  opacity: 1 !important;
}

/*close-icon*/
.bgtabs .tabsNav li a i.fa-ban {
  color: #d43f3a !important;
}

.bgsubtabs .tabsNav {
  border-bottom: 1px solid #4b958c;
  padding-bottom: .1em;
}

.bgsubtabs .tabsNav li {
  border-left: 1px solid #BBB;
  border-right: 1px solid #BBB;
  border-top: 1px solid #BBB;
}

.bgsubtabs .tabsNav li.selected {
  position: relative;
  top: 0.3em;
  background-image: url(../img/bg_tab.png);
  border-left: 2px solid #4b958c;
  border-right: 2px solid #4b958c;
  border-top: 2px solid #4b958c;
  color: #4b958c;
  height: 29px;
}

.bgsubtabs .tabsNav li.selected a {
}

/*sidenav*/
.main {
  /*-webkit-box-shadow: 0 0px 2px #ccc; box-shadow: 0 0px 2px #ccc;*/
}

aside.sidebar {
  width: 15%;
  display: inline-block;
  vertical-align: top;
  min-height: 100%; /*left: 1%; position: relative;*/
}

aside.sidebar ul.sideNav {
  padding: 0;
  margin: 0;
  left: 0;
  top: 0;
}

aside.sidebar ul.sideNav > li {
  font-size: 1.2em; /*border-top:1px solid #FFF;*/
}

aside.sidebar ul.sideNav > li, aside.sidebar ul.sideNav > li > .h2 {
  background: linear-gradient(to bottom, #FFFFFF 0%, #F5F5F5 100%) repeat scroll 0 0 rgba(0, 0, 0, 0);
  list-style: none;
  border-bottom: 1px solid #EEE; /*width:90%;*/
  width: 100%;
}

aside.sidebar ul.sideNav > li:hover {
  /*border-bottom:1px solid #ccc*/
}

aside.sidebar ul.sideNav > li:first-child {
}

aside.sidebar ul.sideNav > li > a {
  color: #222;
  font-size: .85em;
  text-decoration: none;
  padding: .6em;
  display: block;
  margin: 0;
  border-bottom: 1px solid #ddd;
}

aside.sidebar ul.sideNav > li > a:hover {
  background: #eee;
  text-shadow: 0 1px 0 #FFF !important;
}

aside.sidebar ul.sideNav > li > a.selected {
  color: #FFF;
  text-shadow: none;
  background: #62a921; /* Old browsers */
  background: -moz-linear-gradient(top, #62a921 17%, #4b9b15 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(17%, #62a921), color-stop(100%, #4b9b15)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #62a921 17%, #4b9b15 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #62a921 17%, #4b9b15 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #62a921 17%, #4b9b15 100%); /* IE10+ */
  background: linear-gradient(to bottom, #62a921 17%, #4b9b15 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62a921', endColorstr='#4b9b15', GradientType=0); /* IE6-9 */
}

aside.sidebar ul.sideNav > li > a.selected > span {
}

aside.sidebar ul.sideNav > li > a:hover {
  text-shadow: none !important;
}

aside.sidebar ul.sideNav > li > a > i {
  vertical-align: middle;
  font-size: 1.4em;
  text-shadow: 0 1px 1px #2a580b;
}

aside.sidebar ul.sideNav > li > a > i:hover {
}

/*submenu/nivel 1*/
aside.sidebar ul.sideNav > li > ul {
  padding: 0;
  margin: 0;
}

aside.sidebar ul.sideNav > li > ul > li > .h3 {
  margin: 0;
  font-size: 1em;
}

aside.sidebar ul.sideNav > li > ul > li > .h3 > a > span {
  font-size: .85em;
}

.sideNav li li {
  width: 100%;
  background: url(../img/menuLadder.png) 7px -8px no-repeat;
}

aside.sidebar ul.sideNav > li > ul > li {
  padding: .4em 0 0;
}

aside.sidebar ul.sideNav li li:last-child {
  background: url(../img/menuLadderLast.png) 7px -8px no-repeat;
  padding: .4em 0 .6em;
}

aside.sidebar ul.sideNav li li a {
  padding: .75em;
  width: 85%;
  margin-right: 0;
  margin-left: 1em;
}

aside.sidebar ul.sideNav li li a:hover {
}

aside.sidebar ul.sideNav > li > ul > li > .h3 a {
  padding: .4em;
  display: block;
  background-color: #ededed;
  color: #666;
  border: 1px solid #dcdcdc;
  border-radius: .3em;
  text-decoration: none;
  transition: all .2s ease-out;
}

aside.sidebar ul.sideNav > li > ul > li > .h3 a:hover /*, aside.sidebar ul.sideNav > li > ul > li > .h3.selected a*/
{
  border: 1px solid #4b958c;
  background: #FFF;
  color: #4b958c;
}

aside.sidebar ul.sideNav > li > ul > li > .h3.selected a {
  background: #4b958c;
  color: #FFF;
}

/*submenu/nivel 1*/
aside.sidebar ul.sideNav > li > ul > li > .h3 + ul {
  margin: 0;
  background: #f5f5f5; /*border-top:1px solid #eee;*/
  border: 1px solid #e0e0e0;
  width: 87%;
  margin-left: /*.45em*/ 7px;
  border-radius: 0 0 4px 0;
  -webkit-border-radius: 0 0 4px 0;
}

aside.sidebar ul.sideNav > li > ul > li > .h3 + ul > li {
}

aside.sidebar ul.sideNav > li > ul > li > .h3 + ul > li a {
  color: #666;
  font-size: .85em;
}

aside.sidebar ul.sideNav > li > ul > li > .h3 + ul > li a:hover, aside.sidebar ul.sideNav > li > ul > li > .h3 + ul > li > a.selected {
  color: #000;
  text-decoration: underline;
  font-weight: bold;
}

aside.sidebar ul.sideNav > li > ul > li > .h3 + ul > li:last-child {
  padding: 0 0 1em;
}

/*SubNav*/
section.content {
  min-height: 100% !important; /*border-left:1px solid #DDD;*/
  background-image: url(../img/bg.gif) !important;
  left: -3px;
  position: relative;
}

section.content ul.sub-nav {
  padding: 0;
  margin-top: 2em;
}

section.content ul.sub-nav li {
  list-style: none;
  display: inline-block;
  border-right: 1px solid #ccc;
  padding: 0 1em 0 .7em;
  font-size: .5em;
}

section.content ul.sub-nav li:first-child {
  padding: 0 1em 0 0 !important;
}

section.content ul.sub-nav li a {
  color: #555;
  text-transform: uppercase;
  font-size: 1.5em;
}

section.content ul.sub-nav li a:hover {
  color: #000;
}

section.content ul.sub-nav li:last-child {
  border-right: none;
}

section.content ul.sub-nav li a.selected {
  text-decoration: none;
}

/* sub-menu */
ul.sub-menu {
  list-style-type: none;
  min-height: 45px;
  max-height: 45px;
  height: 45px;
  padding: 0;
  margin: 0 auto;
}

ul.sub-menu li {
  float: left;
  align-self: stretch;
}

ul.sub-menu li a {
  text-decoration: none;
  color: var(--color-base-500);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  padding: 8px;
  border: 1px solid var(--color-base-400);
  background: var(--color-base-200);
  height: 45px;
  align-items: center;
  min-width: 122px;
  display: flex;
  justify-content: center;
}

ul.sub-menu li:first-child a {
  border-radius: 4px 0 0 4px;
}

ul.sub-menu li:last-child a {
  border-radius: 0 4px 4px 0;
}

ul.sub-menu li a.selected {
  color: var(--color-base-700);
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-400);
  box-shadow: none;
}

ul.sub-menu li a:hover {
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-600) !important;
}

/*box*/
section.content .wrapper {
}

section.content .box {
  background: #FFF;
  -webkit-box-shadow: 0 1px 1px #CCC;
  box-shadow: 0 1px 1px #CCC;
  -moz-box-shadow: 0 1px 1px #CCC;
  width: 100%;
  margin-top: 1em;
  margin-bottom: 1em;
}

section.content .box .wrapper {
  padding: 1em;
}

/*Columns*/
.col {
  display: inline-block;
  vertical-align: top;
}

p {
  text-align: justify;
}

.full {
  width: 98%;
  margin: 0 auto;
  display: block;
}

.half {
  width: 48.3%;
  margin-left: 1%;
}

.third {
  width: 31.8%;
  margin-left: 1%;
}

.quarter {
  width: 23.6%;
  margin-left: .9%;
}

.twoThird, .twoThirdResp {
  width: 65.8%;
  margin-left: 1%;
}

.full, .half, .third, .quarter {
  margin-bottom: 1em;
}

/*form-general*/
.col .formRow {
  display: block;
  /*width: 86%;*/
  font-size: 0.9em;
  /* left: 4%;*/
  margin-bottom: .8em;
}

.col .formEnd {
  text-align: left;
}

.formRow span {
  /*display:inline-block;*/
}

.col .formRow input.checkbox {
  display: inline-block !important;
  width: auto !important;
  vertical-align: middle;
}

.formRow textarea {
  width: 100% !important;
}

.select2-container {
  width: 100% !important;
}

.checkboxOnly {
  width: auto !important;
  cursor: pointer
}

/*tables*/
table {
  font-size: .9em;
  background: #FCFCFC;
  border: 1px solid #C9C9C9;
  width: 100%;
}

.table thead {
  background: #4b958c;
  color: #FFF;
}

.table tr:nth-child(2n) {
  background: #edecec;
  border-top: 1px solid #FFF;
}

.table tr:last-child {
}

.table thead > tr > th {
  border-bottom: 1px solid #DDDDDD;
  text-align: left;
}

.table thead > tr > th[class*="sortable"] {
  cursor: pointer;
}

.table tr:not(.select):not(.check) td, .table tr th {
  border-bottom: 1px solid #DDDDDD;
  line-height: 1.42857;
  padding: 0.6em;
}

.wrap-table {
  overflow-x: scroll;
}

.wrap-table td, th {
  white-space: nowrap;
}

/* Pagination table */
.pagination {
  display: inline-block;
  padding-left: 0;
  margin: 10px !important;
  border-radius: 4px;
}

/*buttons*/
.bgGray, .disabled.btnCta_light:hover /*, .disabled*/
{
  background: #fcfcfc;
  background: -moz-linear-gradient(top, #fcfcfc 0%, #dedbd6 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fcfcfc), color-stop(100%, #dedbd6));
  background: -webkit-linear-gradient(top, #fcfcfc 0%, #dedbd6 100%);
  background: -o-linear-gradient(top, #fcfcfc 0%, #dedbd6 100%);
  background: -ms-linear-gradient(top, #fcfcfc 0%, #dedbd6 100%);
  background: linear-gradient(to bottom, #fcfcfc 0%, #dedbd6 100%);
  border: 1px solid #bbb;
  margin: .5em 0;
  border-radius: 3px;
  -webkit-border-radius: 3px;
}

.btnCta_light, .btnCta_dark, /*.disabled,*/
.btnCta_gray {
  padding: .3em .75em !important;
}

.btnCta_light, .btnCta_dark, /*.disabled,*/
.btnCta_gray {
  text-align: center;
  font-weight: bold;
  font-size: 1.2em;
  display: inline-block;
  width: auto !important;
  text-shadow: 0 1px 1px #FFF;
  border-bottom: 1px solid #888;
}

.btnCta_light {
  color: #87c736 !important;
}

.btnCta_light:hover {
  background: #FFF;
}

.btnCta_dark {
  color: #C40000;
}

.btnCta_dark:hover {
  background: #FFF;
}

.btnCta_gray {
  color: #777;
}

.btnCta_gray:hover {
  background: #FFF;
}

.bgGray.btnCta_light {
  transition: all .2s ease-out !important;
}

.disabled {
  opacity: .5;
  pointer-events: none;
}

/*new buttons---bootstrap*/
.btn {
  font-weight: bold;
}

.btn-xs.disabled,
.btn-xs[disabled],
.btn-xs:disabled,
fieldset[disabled] {
  pointer-events: none;
  cursor: not-allowed;
  filter: alpha(opacity=65);
  -webkit-box-shadow: none;
  box-shadow: none;
  opacity: .65;
}

.btn-simple, .btn-simple[disabled] {
  border: 1px solid #ccc;
  color: #666;
}

.btn-simple, .btn-simple[disabled], .btn-default, .btn-default[disabled], .btn-info, .btn-info[disabled] {
  background: #fcfcfc; /* Old browsers */
  background: -moz-linear-gradient(top, #fcfcfc 0%, #efefef 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fcfcfc), color-stop(100%, #efefef)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #fcfcfc 0%, #efefef 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #fcfcfc 0%, #efefef 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #fcfcfc 0%, #efefef 100%); /* IE10+ */
  background: linear-gradient(to bottom, #fcfcfc 0%, #efefef 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#efefef', GradientType=0); /* IE6-9 */
}

.btn-info, .btn-info[disabled] {
  border: 1px solid #448880;
  color: #4b958c;
}

.btn-simple:hover, .btn-default:hover, .btn-info:hover {
  background: #efeeee; /* Old browsers */
  background: -moz-linear-gradient(top, #efeeee 0%, #fcfcfc 99%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #efeeee), color-stop(99%, #fcfcfc)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #efeeee 0%, #fcfcfc 99%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #efeeee 0%, #fcfcfc 99%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #efeeee 0%, #fcfcfc 99%); /* IE10+ */
  background: linear-gradient(to bottom, #efeeee 0%, #fcfcfc 99%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#efeeee', endColorstr='#fcfcfc', GradientType=0); /* IE6-9 */
}

.btn-default, .btn-default[disabled], .btn-default:hover {
  color: #87c736;
  overflow-x: hidden;
}

.btn-info:hover, .btn-info:focus {
  border: 1px solid #448880;
  color: #4b958c;
}

.btn-primary, .btn-primary[disabled] {
  background: #448880; /* Old browsers */
  background: -moz-linear-gradient(top, #448880 0%, #3c7972 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #448880), color-stop(100%, #3c7972)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #448880 0%, #3c7972 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #448880 0%, #3c7972 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #448880 0%, #3c7972 100%); /* IE10+ */
  background: linear-gradient(to bottom, #448880 0%, #3c7972 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#448880', endColorstr='#3c7972', GradientType=0); /* IE6-9 */
  border: 1px solid #448880;
}

.btn-primary:hover {
  background: #3c7972; /* Old browsers */
  background: -moz-linear-gradient(top, #3c7972 0%, #448880 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3c7972), color-stop(100%, #448880)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #3c7972 0%, #448880 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #3c7972 0%, #448880 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #3c7972 0%, #448880 100%); /* IE10+ */
  background: linear-gradient(to bottom, #3c7972 0%, #448880 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3c7972', endColorstr='#448880', GradientType=0); /* IE6-9 */
  border: 1px solid #448880
}

.btn-success, .btn-success[disabled] {
  color: #fff;
  border: 1px solid #7fab3e;
  background: #89b943;
}

.btn-success:hover {
  border: 1px solid #7fab3e;
  background: #7fac3e; /* Old browsers */
  background: -moz-linear-gradient(top, #7fac3e 0%, #89b943 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7fac3e), color-stop(100%, #89b943)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #7fac3e 0%, #89b943 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #7fac3e 0%, #89b943 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #7fac3e 0%, #89b943 100%); /* IE10+ */
  background: linear-gradient(to bottom, #7fac3e 0%, #89b943 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7fac3e', endColorstr='#89b943', GradientType=0); /* IE6-9 */
}

.btn-danger, .btn-danger[disabled] {
  background: #d9534f; /* Old browsers */
  background: -moz-linear-gradient(top, #d9534f 0%, #ce4e4a 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #d9534f), color-stop(100%, #ce4e4a)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #d9534f 0%, #ce4e4a 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #d9534f 0%, #ce4e4a 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #d9534f 0%, #ce4e4a 100%); /* IE10+ */
  background: linear-gradient(to bottom, #d9534f 0%, #ce4e4a 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d9534f', endColorstr='#ce4e4a', GradientType=0); /* IE6-9 */
}

.btn-danger:hover {
  background: #ce4e4a; /* Old browsers */
  background: -moz-linear-gradient(top, #ce4e4a 0%, #d9534f 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ce4e4a), color-stop(100%, #d9534f)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #ce4e4a 0%, #d9534f 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #ce4e4a 0%, #d9534f 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #ce4e4a 0%, #d9534f 100%); /* IE10+ */
  background: linear-gradient(to bottom, #ce4e4a 0%, #d9534f 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce4e4a', endColorstr='#d9534f', GradientType=0); /* IE6-9 */
}

.btn-warning, .btn-warning[disabled] {
  background: #f0ad4e;
}

.btn-warning:hover {
  background: #efa34c; /* Old browsers */
  background: -moz-linear-gradient(top, #efa34c 0%, #f0ad4e 98%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #efa34c), color-stop(98%, #f0ad4e)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #efa34c 0%, #f0ad4e 98%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #efa34c 0%, #f0ad4e 98%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #efa34c 0%, #f0ad4e 98%); /* IE10+ */
  background: linear-gradient(to bottom, #efa34c 0%, #f0ad4e 98%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#efa34c', endColorstr='#f0ad4e', GradientType=0); /* IE6-9 */
}

.btn-group,
.btn-group-vertical {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 100% !important;
}

.btn-group ul {
  width: 100% !important;
}

.ButtonsBlock {
  margin-top: 2% !Important;
  margin-bottom: 2% !Important;
}

.buttonsGroup button {
  margin-top: 5px;
}

.halfCell {
  width: 49% !important;
  display: inline-block;
}

.thirdCell {
  width: 30% !important;
  display: inline-block;
}

/*right-button*/
.col.blockR, .col.blockR button {
  float: right !Important;
  left: -2px;
  position: relative;
  margin-bottom: 2%;
}

.col.blockR button.btn-simple {
}

/*right-button*/
.col.blockR, .col.blockR button {
  float: right;
}

.input-group {
  position: inherit;
  display: table;
  border-collapse: separate;
}

.back-to-top {
  position: fixed;
  bottom: 2em;
  right: 10px;
  text-decoration: none;
  color: #FFF;
  font-size: 12px;
  padding: 5px;
  display: none;
  font-weight: bold;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  opacity: .5;
  z-index: 10;
}

.back-to-top:hover {
  color: #FFF;
  opacity: .9;
  text-decoration: none;
}

.back-to-top i {
  font-size: .8em;
  top: .4em;
  position: relative;
}

.back-to-top img {
  width: 32px;
  height: 32px;
}

/* End Buttons */

/*Accordion*/
section.detail:first-child {
  margin-bottom: 1px;
  margin-top: 1em;
}

section.detail .boxdetail {
  margin-bottom: 1px;
}

/*accordion-section-leftmenu*/
accordion section.detail section.content, accordion section.detail section.content .box {
  background: none !important;
  margin: 0 !important;
  box-shadow: none;
}

accordion aside.sidebar ul.sideNav > li {
  margin: .4em 0; /*border-bottom: 1px solid #AAA!important;*//*border: 1px solid #DDD;*/
}

accordion aside.sidebar ul.sideNav > li > a {
  padding: .4em !important;
  border: 1px solid #DDD;
  border-radius: .3em;
  -webkit-border-radius: .3em;
}

accordion aside.sidebar ul.sideNav > li > a:hover {
}

accordion aside.sidebar ul.sideNav > li > a.selected {
  color: #FFF;
  background: #87c736 !important;
  list-style: none;
  border-radius: 5px;
  text-shadow: none !important
}

accordion aside.sidebar ul.sideNav > li > a.selected:hover {
}

accordion aside.sidebar ul.sideNav > li > a.selected span {
}

accordion aside.sidebar ul.sideNav > li > a.selected span, accordion aside.sidebar ul.sideNav > li > a > i {
  font-size: 1em;
}

accordion aside.sidebar ul.sideNav > li > a > i, aside.sidebar ul.sideNav > li > a > i {
  float: right;
  top: .2em;
  position: relative;
}

aside.sidebar ul.sideNav > li > a > i {
  font-size: 1em;
  display: none;
}

aside.sidebar ul.sideNav > li > a.selected > i {
  display: inherit;
}

/*rightmenu*/
accordion section.detail section.content {
  border: 0
}

accordion aside.sidebar, accordion section.content {
  min-height: 0 !important
}

accordion section.content .box .wrapper {
  /*width:50%;*/
}

accordion section.content .box .wrapper span, section.content .box .wrapper .formBox span {
  display: block;
  margin-top: .5em;
}

accordion section.content .box .wrapper span.error {
  display: inline-block;
}

section.content .box .wrapper input {
  /*width:20%;*/
}

accordion section.detail section.content .box .wrapper input, accordion section.detail section.content .box .wrapper select, section.content .box .wrapper .formRow input, section.content .box .wrapper .formRow select {
  margin: .25em auto !important;
  width: 98%; /*box-sizing: border-box; *//*width:90%;*/
}

accordion section.detail section.content .box .wrapper select {
}

section.detail section.content .box .wrapper select.date + select.date {
  left: 0.3em;
  position: relative;
}

.date {
  width: 49% !important;
  display: inline-block;
}

.date-icon::after {
  left: 85%;
  font-family: 'FontAwesome';
  transform: translateY(-50%);
  position: relative;
  content: "\f133";
  font-size: 15px;
  bottom: 35%;
}

.date-form-icon {
  background-image: url('../img/calendar.svg') !important;
  background-position: 97% !important;
  background-repeat: no-repeat !important;
}

.hourCell {
  margin-top: 8px !important;
}


.dateThird {
  width: 32.5% !important;
  display: inline-block;
}

/*DateTime*/
.three-fields .date {
  width: 32.5% !important;
}

/*prueba*/
.boxed .title {
  font-size: 13px;
  text-align: left;
  font-weight: normal;
  display: block;
  text-decoration: none;
  padding: 8px 0;
  border-radius: .3em;
  cursor: pointer;
  border-bottom: 1px dotted #777;
  color: #434345;
  border-radius: .3em;
  background: #dcdcdc;
}

.boxed .title.selected {
  /*background:#4b958c!important;*/
  background: #EEE !important;
}

.boxed .title.selected i {
  /*color: #FFF!important; */
}

.boxed .title i {
  margin-left: .5em;
}

.boxed .title:hover {
  background: #CCC;
}

.boxed .title div {
  display: inline-block;
  text-transform: uppercase; /*text-shadow: 0 1px 0 #FFF;*/
  font-size: .9em;
  vertical-align: middle;
}

.boxed .title div strong {
  padding-left: .8em;
}

.boxed .title div i + strong {
  padding-left: 0 !important
}

.boxed .title.selected div {
  text-shadow: none; /*color:#FFF;*/
  font-weight: bold; /* text-shadow: 0 1px 1px #333;*/
  text-shadow: 0 1px 0 #FFF;
  font-size: 12px !important;

}

.boxed .title ul {
  display: inline-block;
  /*  right: 0 !important;
    position: absolute;*/
  width: 80%;
  margin: 0;
}

.boxed .title ul li {
  display: inline-block;
  /*padding-right: 8%;*/
}

.boxed .title ul li, .boxed .title ul li a {
  color: #434345; /*text-shadow: 0 1px 0 #FFF;*/
}

/*.boxed .title.selected ul li, */
.boxed .title.selected ul li a, .boxed .title.selected ul li a i /*, .boxed .title:hover*/
{
  /* color:#FFF; text-shadow: 0 1px 1px #333;*/
}

/*.boxed .title ul li a */
.fa-edit, .fa-check {
  color: #01B300;
}

.boxed .title ul li a .fa-times {
  color: #f86c6c;
}

.boxed .title ul li a {
}

.ellipsis .title > div /*, .boxed .title.selected div*/
{
  /*padding-left: 1em;*/
  width: 19%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  vertical-align: middle;
}

.boxed .title > div + ul li:nth-child(1) {
  width: 80%;
}

.boxed .title.selected div {
}

/*Pages--------*/

/*login Page*/
.loginPage img {
  margin-bottom: var(--spacing-4);
}

.page {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  width: 100%;
  background-color: var(--color-base-100);
}

.backend-logo {
  width: 100%;
  max-width: 403px;
}

section.loginPage {
  display: block;
  margin: 0;
  width: 100%;
}

.loginPage .loginForm {
  width: 100%;
  max-width: 403px;
  margin: 0 auto;
}

.loginPage .loginForm .loginFormwrap .login {
  text-align: left;
  width: 100%;
  max-width: 403px;
  margin: 0 auto;
  padding: 0;
}

.loginPage .loginForm .loginFormwrap .login label {
  font-family: 'Inter', sans-serif !important;
  display: block;
  font-weight: 700;
  font-size: 16px;
  color: var(--color-base-700);
  line-height: normal;
}

.loginSubTitles{
  font-weight: 700;
  font-size: 16px;
  color: var(--color-base-700);
  line-height: 24px;
  text-align: center;
  border-bottom: 1px solid var(--color-base-300);
  padding-bottom: 10px;
  margin-top: 24px;
  margin-bottom: 24px;
}

.loginPage .loginForm .loginFormwrap .login .input-prepend {
  width: 100%;
  max-width: 403px;
  margin: 0 0 24px;
  background: transparent;
}

.loginPage input[type="text"], .loginPage input[type="password"] {
  display: block;
  width: 100%;
  max-width: 403px;
  height: 45px;
  padding: 0 .6em;
  margin: 0;
  border: 1px solid var(--color-base-400);
  border-radius: 3px;
  color: var(--color-base-700);
  font-size: 16px;
  outline: none;
  appearance: none;
  box-shadow: none;
}

.loginPage input[type="text"]:hover,
.loginPage input[type="password"]:hover {
  border: 1px solid var(--color-primary-300) !important;
  background-color: var(--color-primary-100);
}

.loginPage input[type="text"]:focus,
.loginPage input[type="password"]:focus {
  outline: none;
  border: 1px solid var(--color-primary-400) !important;
  background-color: #FFFFFF;
}

.loginPage input[type="text"]:not(:placeholder-shown){
  border-color: var(--color-base-600);
}

.loginPage input[type="password"]:not(:placeholder-shown) {
  border-color: var(--color-base-600);
  letter-spacing: 10px;
  font-size: 20px;
}

.loginPage .loginForm .loginFormwrap .login input.btn-form--primary {
  width: 100%;
  height: 45px;
  max-width: 403px;
  padding: var(--spacing-2);
  margin:0 0 24px;
  border-radius: 4px;
  font-weight: 700;
  font-size: 16px;
}

input.btn-form--primary:disabled {
  border: 1px solid var(--color-base-400);
  background: var(--color-base-200);
  color: var(--color-base-500);
  cursor: not-allowed;
}

.login .text-description {
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
  text-align: left;
  color: var(--color-base-600);
  max-width: 403px;
  border-bottom-right-radius: 4px;
  border-top-right-radius: 4px;
  margin: 0 0 24px;
}


.login .formEnd {
  display: flex;
  gap: var(--spacing-4);
}

.login .formEnd .btn-form--secondary,
.login .formEnd .btn-form--primary {
  flex: 1;
  height: 45px;
  padding: 0 16px;
  border-radius: 4px;
  font-weight: 700;
  font-size: 16px;
  color: var(--color-base-700);
  outline: none;
  box-shadow: none !important;
}

.login .formEnd .btn-form--primary:disabled {
  border: 1px solid var(--color-base-400);
  background: var(--color-base-200);
  color: var(--color-base-500)
}

.loginPage .input-prepend .loginErrorHint{
  display: block;
  margin: var(--spacing-1);
  margin-left: 2px;
  background: transparent !important;
  color: var(--color-error-500);
  line-height: normal;
}

.login .is-error,
.login .is-error:focus,
.login .is-error:hover {
  border-color: var(--color-error-500) !important;
  box-shadow: none !important;
}

.loginPage .loginForm .loginFormwrap .login .forgotPass {
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  gap: var(--spacing-2);
}

.loginPage .loginForm .loginFormwrap .login .forgotPass a {
  color: var(--color-base-700);
  text-decoration: none;
  margin: 0 12px;
}

.loginPage .loginForm .loginFormwrap .login .forgotPass a:hover {
  color: var(--color-primary-700);
}

.loginPage .loginForm .loginFormwrap .login .forgotPass .separator {
  display: inline-block;
  width: 0.8px;
  height: 19px;
  background-color: var(--color-primary-600);
  vertical-align: middle;
}

.loginPage .version {
  position: absolute;
  right: 16px;
  font-size: 18px;
}

.loginPage .version h6 {
  cursor: pointer;
  color: #707A8A;
  opacity: .7;
}

/*input[type="submit"]:hover {}
input[type="text"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="text"]:-moz-placeholder, input[type="password"]:-moz-placeholder, input[type="text"]::-moz-placeholder, input[type="password"]::-moz-placeholder  {color: #dbe1e8;}*/

/*Accounts Page*/
.accountPage {
  /*height:100%; overflow:hidden*/
}

.accountPage section.content {
}

.accountPage section.content ul.sub-nav li a.selected, .reportsPage section.content ul.sub-nav li a.selected {
  color: var(--color-primary-400);
}

/*icons*/
.icon {
  color: var(--color-base-700);
}

.icon:hover {
  color: var(--color-base-500);
}

.icon-disabled {
  color: var(--color-base-400);
  cursor: not-allowed !important;
  pointer-events: none;
  opacity: 0.6;
}

/*icons-alerts*/
.accountPage section.content .alerts {
  text-align: center;
}

.accountPage section.content .alerts label {
  display: inline-block;
  margin: 5px 10px;
  font-weight: 500
}

.accountPage section.content .alerts label img {
  display: block;
  margin: 0 auto;
  padding-bottom: 4px;
}

/*.accountPage section.content .alerts label input{vertical-align: top;}*/
/*------*/

/*customer-CreditCard-History*/
i[class^="glyphicon"] {
  padding: 2px;
  border: 1px solid #ccc;
  margin-right: .2em;
}

i[class^="glyphicon"], ul li a i.icon-calculator {
  font-size: .8em;
  color: #777;
  background: #eee;
  border-radius: 3px;
  text-shadow: 1px 1px 0 #FFF;
}


i[class^="glyphicon"], ul li a i.icon-upload {
  font-size: .8em;
  color: #777;
  background: #eee;
  border-radius: 3px;
  text-shadow: 1px 1px 0 #FFF;
}

.glyphicon-chevron-down {
  color: #87c736 !important;
  border: 1px solid #fff;
}

/*customer-account-info*/
ul li a i.icon-calculator {
  padding: 6px;
  color: #689b8a;
  box-shadow: 0 0 2px #777;
  border: 1px solid #fff;
  font-size: 18px;
}

ul li a i.icon-calculator:hover {
  color: #4b958c;
  box-shadow: 0 0 4px #888;
}

ul li a i.icon-upload {
  padding: 6px;
  color: #689b8a;
  box-shadow: 0 0 2px #777;
  border: 1px solid #fff;
  font-size: 18px;
}

ul li a i.icon-upload:hover {
  color: #4b958c;
  box-shadow: 0 0 4px #888;
}

li.btn-calculator {
  position: absolute;
  right: 0;
  margin-top: -4px;
}

li.btn-cloud-upload {
  position: absolute;
  right: 3%;
  margin-top: -4px;
}

/*modal-wrapper-Modal/lightbox*/
.modal-dialog {
  min-width: 50% !important;
}

.modal-content {
  border-radius: 4px !important;
}

.modal-wrapper .col.third span {
  display: block;
  padding-top: 4%;
}

.modal-wrapper .col .formRow, .modal-wrapper .col .formRow input, .modal-wrapper .col .formRow select {
  width: 100% !important;
}

.modal-wrapper .btn.btn-primary {
  display: block;
  margin: 0 auto;
  margin-top: 2%;
}

.modal-footer {
  margin-top: 0 !important;
  border-top: none;
}

/*formRow-transaction error*/
.transactionError {
}

.transactionError .formRow input, .transactionError .formRow select {
  width: 90% !important;
}

.transactionError .formRow .error {
  max-width: 9%;
  text-align: center;
}

/*attempt-Details/lightbox*/
.modal-dialog {
  top: 10%;
}

.modal-dialog .modal-header {
  font-size: 1.4em;
  color: #434345;:
}

.modal-dialog .modal-header i {
  color: #FFF !important;
}

.modal-dialog .modal-body a {
  color: #428bca !important;
  text-decoration: none;
}

.modal-dialog ul.sub-nav {
  padding: 0;
  margin-top: 2em;
  margin-bottom: 2em;
}

.modal-dialog ul.sub-nav li {
  list-style: none;
  display: inline-block;
  border-right: 1px solid #ccc;
  padding: 0 1em;
  font-size: .5em;
}

.modal-dialog ul.sub-nav li:last-of-type {
  border: none !important;
}

.modal-dialog ul.sub-nav li a {
  color: #555;
  text-transform: uppercase;
}

.modal-dialog ul.sub-nav li a span {
  font-size: 11px !important;
}

.modal-dialog ul.sub-nav li a.selected {
  background: #cfe7ab !important;
  -webkit-box-shadow: 0 1px 1px #999999;
  -moz-box-shadow: 0 1px 1px #999999;
  box-shadow: 0 1px 1px #999999;
  padding: 7px 10px 4px !important;
  border-radius: 3px;
  text-decoration: none;
}

.modal-dialog ul.sub-nav li a:hover {
  color: #000;
}

/*Modal-page*/
/*.dialog-main. modal-dialog>.modal-content {width:650px; margin:0 auto; overflow:hidden;}*/
.dialog-main.sm .modal-dialog > .modal-content, .dialog-main.md .modal-dialog > .modal-content, .dialog-main.lg .modal-dialog > .modal-content {
  margin: 0 auto;
  overflow: hidden;
}

.modal-open {
  overflow: auto !important;
}

.dialog-main.sm .modal-dialog > .modal-content {
  width: 500px !important;
  -webkit-box-shadow: none;
}

.dialog-main.md .modal-dialog > .modal-content {
  width: 660px !important;
}

.dialog-main.lg .modal-dialog > .modal-content {
  width: initial !important;
}

.dialog-main.xl .modal-dialog > .modal-content {
  width: fit-content !important;
  background-color: #F5F5F5;
}

/*header---bg-color*/
.dialog-header-confirm {
  background: #89b943;
}

.dialog-header-error {
  background: #d9534f;
}

.dialog-header-wait {
  background: #efa34c;
}

.dialog-header-notify {
  background: #4b958c;
}

div[class^="modal-header"] > h4.modal-title span {
  color: #FFF !important;
}

/*Alerts-Messages--------------------------*/
.alert-messagesText div[class^="alert"] span {
  font-weight: bold;
}

.alert-messagesText div[class^="alert"] span i {
  font-size: 17px;
}

/*alerts-bg*/
.alert-messagesText .alert-successMessages {
  background: #bcdd94;
  border: 1px solid #b0cf8b;
  color: #3c763d;
}

.alert-messagesText .alert-infoMessages {
  background: #b5d0cd;
  border: 1px solid #a7c3c0;
  color: #3c7972;
}

.alert-messagesText .alert-warningMessages {
  background: #f0c487;
  border: 1px solid #e3b97e;
  color: #8a6d3b;
}

.alert-messagesText .alert-dangerMessages {
  background: #f0b3b1;
  border: 1px solid #e3a9a7;
  color: #a94442;
}

/*Bootstrap - Alerts (2)*/
.alert-messagesText .no-bg {
  background: #FFF !important;
  text-align: justify;
}

/*Bootstrap - Alerts (3)*/
.alert-messagesText .notify {
  display: block;
  padding: 12px 18px;
  max-width: 400px;
  margin: 0 auto;
  cursor: pointer;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  margin-bottom: 20px;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 1px 0px;
}

.alert-messagesText .notify span {
  font-size: 20px;
}

.alert-messagesText .notify, .alert-messagesText .notify p {
  text-align: center;
}

.alert-messagesText .notify p {
  color: #444;
  margin-top: 3px;
}

/*-----------------*/

/*spinner------------*/
/*.spinner{ z-index:1!important;}*/

/*setup-processor-order*/
.sortItem {
  background: #EEE !important;
  cursor: move;
}

.sortItem > .col > strong {
  text-transform: uppercase;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@media print,
(-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */
@media print {
  * {
    background: transparent !important;
    color: #000 !important; /* Black prints faster: h5bp.com/s */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]:after {
    content: " (" attr(href) ")";
  }

  abbr[title]:after {
    content: " (" attr(title) ")";
  }

  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: "";
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  thead {
    display: table-header-group; /* h5bp.com/t */
  }

  tr, img {
    page-break-inside: avoid;
  }

  img {
    max-width: 100% !important;
  }

  @page {
    margin: 0.5cm;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {
  /*accordion*/
  /*	.boxed .title ul{width: 62%;}
    .boxed .title ul li{padding-right: 8%;}*/
  /*table-scroll*/
  .wrap-table {
    overflow-x: scroll;
  }

}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
  /*main-menu*/
  .bgtabs .tabsNav li {
    border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
    -moz-border-radius: 3px !important; /*margin-bottom:.4em;*/
  }

  .bgtabs .tabsNav li.selected, .bgtabs .tabsNav li.addTab {
    box-shadow: none !important;
  }

  .bgtabs .tabsNav li.selected {
    /*top:0;*/
  }

  .bgtabs .tabsNav li a {
    padding: .4em;
  }

  .bgtabs .tabsNav li a:nth-child(2) {
    padding: 0;
  }

  .content {
    width: 84%;
  }

  .full, .half, .third, .quarter, .twoThirdResp {
    width: 98%;
    margin: 0 auto;
    display: block
  }

  /*.global{ height:auto;}*/
  aside.sidebar {
    max-height: none !important;
    min-height: none !important;
  }

  .global {
    height: auto !important;
  }

  /*accordion*/
  .boxed .title ul {
    padding-right: 4%;
    display: inline-block;
    position: relative;
    width: 80%;
    margin: 0;
  }

  /*accordion-form*/
  accordion section.detail section.content .box .wrapper input, accordion section.detail section.content .box .wrapper select {
    margin: .25em auto !important;
    width: 100%;
    box-sizing: border-box;
  }

  accordion section.detail section.content .box .wrapper select.date {
    width: 49% !important;
    display: inline-block;
  }

  accordion section.detail section.content .box .wrapper select.date + select.date {
    left: 0.6em;
    position: relative;
  }

  /*table-scroll*/
  .wrap-table {
    overflow-x: scroll;
  }

  /*customer-account-info*/
  li.btn-calculator {
    position: relative !important;
  }

  li.btn-cloud-upload {
    position: relative !important;
  }

  /*Currency-Conversion-Modal/lightbox*/
  .modal-wrapper .col .formRow, .modal-wrapper .col.third span {
    padding-top: 0 !important;
    padding-bottom: 0 !important
  }

  .modal-wrapper .col .formRow input, .modal-wrapper .col .formRow select {
    width: 100% !important;
  }

  /*report-JournalSearch*/
  /*right-button*/
  .col.blockR, .col.blockR button {
    float: right;
    margin-top: 1%;
  }

  /*left-buttons*/
  .col.buttonsGroup {
    margin: 1% 0;
  }

  .col.buttonsGroup button {
    margin: 2% 0;
  }

  /*P2P-processing*/
  .boxed .title > div {
    vertical-align: top;
  }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
  /*Header*/
  .userInfo {
    font-size: 14px;
  }

  header.top .header-inner .logo a {
    width: 300px;
  }

  /*main-menu*/
  .topNav ul.nav li {
    display: block;
  }

  .bgtabs {
    background: none !important
  }

  .bgtabs .tabsNav li {
    border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
    -moz-border-radius: 3px !important;
    margin-bottom: .4em;
  }

  .bgtabs .tabsNav li.selected, .bgtabs .tabsNav li.addTab {
    box-shadow: none !important;
  }

  .bgtabs .tabsNav li.selected {
    border: 1px solid #87c736
  }

  /*ejemplo-------*/
  .bgtabs .tabsNav li.selected, .bgtabs .tabsNav li {
    /*top:0;*/
    width: 90%;
  }

  .bgtabs .tabsNav li {
    border: 1px solid #bbb;
    cursor: pointer;
  }

  .bgtabs .tabsNav li:hover {
    background: #eee;
  }

  .bgtabs .tabsNav li.addTab {
    /*width:5%;*/
  }

  .bgtabs .tabsNav li.addTab a {
  }

  .bgtabs .tabsNav li.addTab a i {
    top: 0;
    left: 0;
  }

  /*--------------*/
  /*sidemenu*/
  .bgtabs .tabsNav li a {
    padding: .4em;
  }

  .bgtabs .tabsNav li a:nth-child(2) {
    padding: 0;
  }

  section.content, aside.sidebar {
    width: 100%;
    min-width: 100%;
  }

  .aside-Fixed {
    position: initial;
  }

  .full, .half, .third, .quarter, .twoThirdResp {
    width: 98%;
    margin: 0 auto;
    display: block
  }

  /*.global{ height:auto;}*/
  .navbar-collapse {
    background: #DDD;
  }

  /*sidebar*/
  aside.sidebar {
    max-height: none !important;
    min-height: 0 !important;
  }

  aside.sidebar ul.sideNav {
    border-top: 2px solid green;
    margin-top: 1%;
  }

  .global {
    height: auto !important;
  }

  /*accordion*/
  .boxed .title ul {
    padding-right: 3%;
    display: inline-block;
    position: relative;
    width: 70%;
    margin: 0;
  }

  /*accordion-form*/
  accordion section.detail section.content .box .wrapper input, accordion section.detail section.content .box .wrapper select {
    margin: .25em auto !important;
    width: 100%;
    box-sizing: border-box;
  }

  accordion section.detail section.content .box .wrapper select.date {
    width: 49% !important;
    display: inline-block;
  }

  accordion section.detail section.content .box .wrapper select.date + select.date {
    left: 0.6em;
    position: relative;
  }

  accordion aside.sidebar ul.sideNav {
    border-top: none;
  }

  /*table-scroll*/
  /*.loading-container*/
  .wrap-table {
    overflow-x: scroll;
  }

  /*customer-account-info*/
  li.btn-calculator {
    position: relative !important;
  }

  li.btn-cloud-upload {
    position: relative !important;
  }

  /*Currency-Conversion-Modal/lightbox*/
  .modal-wrapper .col .formRow, .modal-wrapper .col.third span {
    padding-top: 0 !important;
    padding-bottom: 0 !important
  }

  .modal-wrapper .col .formRow input, .modal-wrapper .col .formRow select {
    width: 100% !important;
  }

  .date-icon::after {
    left: 80%;
  }
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
  /*main-menu*/
  .topNav ul.nav li {
    display: block;
  }

  .ButtonsBlock, .buttonsGroup {
    display: block;
  }

  .buttonsGroup {
    width: 100% !important;
  }

  .buttonsGroup button {
    width: 100%
  }

  .bgtabs {
    background: none !important
  }

  .bgtabs .tabsNav li {
    border-radius: 3px !important;
    -webkit-border-radius: 3px !important;
    -moz-border-radius: 3px !important;
    margin-bottom: .4em;
    border: 1px solid #bbb;
    cursor: pointer;
  }

  .bgtabs .tabsNav li:hover {
    background: #eee;
  }

  .bgtabs .tabsNav li.selected, .bgtabs .tabsNav li.addTab {
    box-shadow: none !important;
  }

  /*ejemplo-------*/
  .bgtabs .tabsNav li.selected, .bgtabs .tabsNav li {
    /*top:0;*/
    width: 90%;
  }

  .bgtabs .tabsNav li.addTab {
    /*width:5%;*/
  }

  .bgtabs .tabsNav li.addTab a i {
    top: 0;
    left: 0;
  }

  /*--------------*/
  .bgtabs .tabsNav li a {
    padding: .4em;
  }

  .bgtabs .tabsNav li a:nth-child(2) {
    padding: 0;
  }

  section.content, aside.sidebar {
    width: 100%;
  }

  .full, .half, .third, .quarter {
    width: 98%;
    margin: 0 auto;
    display: block
  }

  /*.global{ height:auto;}*/
  .navbar-collapse {
    background: #DDD;
  }

  /*sidebar*/
  aside.sidebar {
    max-height: none !important;
    min-height: 0 !important;
  }

  aside.sidebar ul.sideNav {
    border-top: 2px solid green;
    margin-top: 1%;
  }

  .global {
    height: auto !important;
  }

  /*accordion*/
  .boxed .title ul {
    padding-right: 4%;
    display: inline-block;
    position: relative;
    width: 70%;
    margin: 0;
  }

  /*accordion-form*/
  accordion section.detail section.content .box .wrapper input, accordion section.detail section.content .box .wrapper select {
    margin: .25em auto !important;
    width: 100%;
    box-sizing: border-box;
  }

  accordion section.detail section.content .box .wrapper select.date {
    width: 49% !important;
    display: inline-block;
  }

  accordion section.detail section.content .box .wrapper select.date + select.date {
    left: 0.6em;
    position: relative;
  }

  /*table-scroll*/
  .loading-container {
    overflow-x: scroll;
  }

  /*customer-account-info*/
  li.btn-calculator {
    position: relative !important;
    box-shadow: 0 0 2px #777;
    border: 1px solid #fff;
    padding: 0 !important;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    width: 92%;
    margin: 0 auto;
    margin-bottom: 1em;
    margin-top: 1em;
  }

  li.btn-calculator a {
    padding: .2em !important;
    background: #eee;
  }

  li.btn-calculator a:before {
    content: "Conversion Currency";
    padding: 6px;
  }


  li.btn-cloud-upload {
    position: relative !important;
    box-shadow: 0 0 2px #777;
    border: 1px solid #fff;
    padding: 0 !important;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    width: 92%;
    margin: 0 auto;
    margin-bottom: 1em;
    margin-top: 1em;
  }

  li.btn-cloud-upload a {
    padding: .2em !important;
    background: #eee;
  }

  li.btn-cloud-upload a:before {
    content: "Conversion Currency";
    padding: 6px;
  }


  ul li a i.icon-calculator {
    color: #689b8a;
    font-size: 16px;
    padding: 2px 4px;
    border: 0;
    box-shadow: none;
    background: none !important;
  }

  ul li a i.icon-calculator:hover {
    background: none !important;
    box-shadow: none !important;
  }

  ul li a i.icon-upload {
    color: #689b8a;
    font-size: 16px;
    padding: 2px 4px;
    border: 0;
    box-shadow: none;
    background: none !important;
  }

  ul li a i.icon-upload:hover {
    background: none !important;
    box-shadow: none !important;
  }


  /*Currency-Conversion-Modal/lightbox*/
  .modal-wrapper .col .formRow, .modal-wrapper .col.third span {
    padding-top: 0 !important;
    padding-bottom: 0 !important
  }

  .modal-wrapper .col .formRow input, .modal-wrapper .col .formRow select {
    width: 100% !important;
  }

  .date-icon::after {
    left: 85%;
  }
}

/*included by Josua/Fsolis-------------------------------------------------------------------------
-------------------------------------------------------------------------------------------*/

/*bootstrap*styles--------*/
/* Version: 2.1 Timestamp: Tue Jun 12 19:50:25 PDT 2012 */

/*Booststrap-Select2*/
.select2-container {
  position: relative;
  display: inline-block;
  /* inline-block for ie7 */
  zoom: 1;
  *display: inline;
}

.select2-container,
.select2-drop,
.select2-search,
.select2-container .select2-search input {
  /*
    Force border-box so that % widths fit the parent
    container without overlap because of margin/padding.

    More Info : http://www.quirksmode.org/css/box.html
  */
  -moz-box-sizing: border-box; /* firefox */
  -ms-box-sizing: border-box; /* ie */
  -webkit-box-sizing: border-box; /* webkit */
  -khtml-box-sizing: border-box; /* konqueror */
  box-sizing: border-box; /* css3 */
}

.select2-container .select2-choice {
  background-color: #fff;
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eeeeee), color-stop(0.5, white));
  background-image: -webkit-linear-gradient(center bottom, #eeeeee 0%, white 50%);
  background-image: -moz-linear-gradient(center bottom, #eeeeee 0%, white 50%);
  background-image: -o-linear-gradient(bottom, #eeeeee 0%, #ffffff 50%);
  background-image: -ms-linear-gradient(top, #eeeeee 0%, #ffffff 50%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#ffffff', GradientType=0);
  background-image: linear-gradient(top, #eeeeee 0%, #ffffff 50%);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid #aaa;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  height: 26px;
  line-height: 26px;
  padding: 0 0 0 8px;
  color: #444;
  text-decoration: none;
}

.select2-container .select2-choice span {
  margin-right: 26px;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
}

.select2-container .select2-choice abbr {
  display: block;
  position: absolute;
  right: 26px;
  top: 8px;
  width: 12px;
  height: 12px;
  font-size: 1px;
  cursor: pointer;
  text-decoration: none;
  border: 0;
  outline: 0;
}

.select2-container .select2-choice abbr:hover {
  background-position: right -11px;
  cursor: pointer;
}

.select2-container .select2-drop {
  background: #fff;
  border: 1px solid #aaa;
  border-top: 0;
  position: absolute;
  top: 100%;
  -webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
  -moz-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
  -o-box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
  box-shadow: 0 4px 5px rgba(0, 0, 0, .15);
  z-index: 999;
  width: 100%;
  margin-top: -1px;
  -webkit-border-radius: 0 0 4px 4px;
  -moz-border-radius: 0 0 4px 4px;
  border-radius: 0 0 4px 4px;
}

.select2-container .select2-choice div {
  -webkit-border-radius: 0 4px 4px 0;
  -moz-border-radius: 0 4px 4px 0;
  border-radius: 0 4px 4px 0;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  background: #ccc;
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ccc), color-stop(0.6, #eee));
  background-image: -webkit-linear-gradient(center bottom, #ccc 0%, #eee 60%);
  background-image: -moz-linear-gradient(center bottom, #ccc 0%, #eee 60%);
  background-image: -o-linear-gradient(bottom, #ccc 0%, #eee 60%);
  background-image: -ms-linear-gradient(top, #cccccc 0%, #eeeeee 60%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#eeeeee', GradientType=0);
  background-image: linear-gradient(top, #cccccc 0%, #eeeeee 60%);
  border-left: 1px solid #aaa;
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  height: 100%;
  width: 18px;
}

.select2-container .select2-choice div b {
  background: url(../img/select2.png) no-repeat 0 1px;
  display: block;
  width: 100%;
  height: 100%;
}

.select2-container .select2-search {
  display: inline-block;
  white-space: nowrap;
  z-index: 1010;
  min-height: 26px;
  width: 100%;
  margin: 0;
  padding-left: 4px;
  padding-right: 4px;
}

.select2-container .select2-search-hidden {
  display: block;
  position: absolute;
  left: -10000px;
}

.select2-container .select2-search input {
  background: #fff url('select2.png') no-repeat 100% -22px;
  background: url('select2.png') no-repeat 100% -22px, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee));
  background: url('select2.png') no-repeat 100% -22px, -webkit-linear-gradient(center bottom, white 85%, #eeeeee 99%);
  background: url('select2.png') no-repeat 100% -22px, -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%);
  background: url('select2.png') no-repeat 100% -22px, -o-linear-gradient(bottom, white 85%, #eeeeee 99%);
  background: url('select2.png') no-repeat 100% -22px, -ms-linear-gradient(top, #ffffff 85%, #eeeeee 99%);
  background: url('select2.png') no-repeat 100% -22px, linear-gradient(top, #ffffff 85%, #eeeeee 99%);
  padding: 4px 20px 4px 5px;
  outline: 0;
  border: 1px solid #aaa;
  font-family: sans-serif;
  font-size: 1em;
  width: 100%;
  margin: 0;
  height: auto !important;
  min-height: 26px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border-radius: 0;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
}

.select2-container .select2-search input.select2-active {
  background: #fff url('spinner.gif') no-repeat 100%;
  background: url('spinner.gif') no-repeat 100%, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, white), color-stop(0.99, #eeeeee));
  background: url('spinner.gif') no-repeat 100%, -webkit-linear-gradient(center bottom, white 85%, #eeeeee 99%);
  background: url('spinner.gif') no-repeat 100%, -moz-linear-gradient(center bottom, white 85%, #eeeeee 99%);
  background: url('spinner.gif') no-repeat 100%, -o-linear-gradient(bottom, white 85%, #eeeeee 99%);
  background: url('spinner.gif') no-repeat 100%, -ms-linear-gradient(top, #ffffff 85%, #eeeeee 99%);
  background: url('spinner.gif') no-repeat 100%, linear-gradient(top, #ffffff 85%, #eeeeee 99%);
}

.select2-container-active .select2-choice,
.select2-container-active .select2-choices {
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .3);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .3);
  -o-box-shadow: 0 0 5px rgba(0, 0, 0, .3);
  box-shadow: 0 0 5px rgba(0, 0, 0, .3);
  border: 1px solid #5897fb;
  outline: none;
}

.select2-dropdown-open .select2-choice {
  border: 1px solid #aaa;
  border-bottom-color: transparent;
  -webkit-box-shadow: 0 1px 0 #fff inset;
  -moz-box-shadow: 0 1px 0 #fff inset;
  -o-box-shadow: 0 1px 0 #fff inset;
  box-shadow: 0 1px 0 #fff inset;
  background-color: #eee;
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, white), color-stop(0.5, #eeeeee));
  background-image: -webkit-linear-gradient(center bottom, white 0%, #eeeeee 50%);
  background-image: -moz-linear-gradient(center bottom, white 0%, #eeeeee 50%);
  background-image: -o-linear-gradient(bottom, white 0%, #eeeeee 50%);
  background-image: -ms-linear-gradient(top, #ffffff 0%, #eeeeee 50%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0);
  background-image: linear-gradient(top, #ffffff 0%, #eeeeee 50%);
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 0;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-bottomright: 0;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.select2-dropdown-open .select2-choice div {
  background: transparent;
  border-left: none;
}

.select2-dropdown-open .select2-choice div b {
  background-position: -18px 1px;
}

/* results */
.select2-container .select2-results {
  margin: 4px 4px 4px 0;
  padding: 0 0 0 4px;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 200px;
}

.select2-container .select2-results li {
  line-height: 80%;
  padding: 7px 7px 8px;
  margin: 0;
  list-style: none;
  cursor: pointer;
  display: list-item;
}

.select2-container .select2-results .select2-highlighted {
  background: #3875d7;
  color: #fff;
}

.select2-container .select2-results li em {
  background: #feffde;
  font-style: normal;
}

.select2-container .select2-results .select2-highlighted em {
  background: transparent;
}

.select2-container .select2-results .select2-no-results {
  background: #f4f4f4;
  display: list-item;
}

.select2-container .select2-results .select2-disabled {
  display: none;
}

.select2-more-results.select2-active {
  background: #f4f4f4 url('spinner.gif') no-repeat 100%;
}

.select2-more-results {
  background: #f4f4f4;
  display: list-item;
}

/* disabled styles */
.select2-container.select2-container-disabled .select2-choice {
  background-color: #f4f4f4;
  background-image: none;
  border: 1px solid #ddd;
  cursor: default;
}

.select2-container.select2-container-disabled .select2-choice div {
  background-color: #f4f4f4;
  background-image: none;
  border-left: 0;
}

/* multiselect */
.select2-container-multi .select2-choices {
  background-color: #fff;
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff));
  background-image: -webkit-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
  background-image: -moz-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
  background-image: -o-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
  background-image: -ms-linear-gradient(top, #eeeeee 1%, #ffffff 15%);
  background-image: linear-gradient(top, #eeeeee 1%, #ffffff 15%);
  border: 1px solid #aaa;
  margin: 0;
  padding: 0;
  cursor: text;
  overflow: hidden;
  height: auto !important;
  height: 1%;
  position: relative;
}

.select2-container-multi .select2-drop {
  margin-top: 0;
}

.select2-container-multi .select2-choices {
  min-height: 26px;
}

.select2-container-multi.select2-container-active .select2-choices {
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .3);
  -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .3);
  -o-box-shadow: 0 0 5px rgba(0, 0, 0, .3);
  box-shadow: 0 0 5px rgba(0, 0, 0, .3);
  border: 1px solid #5897fb;
  outline: none;
}

.select2-container-multi .select2-choices li {
  float: left;
  list-style: none;
}

.select2-container-multi .select2-choices .select2-search-field {
  white-space: nowrap;
  margin: 0;
  padding: 0;
}

.select2-container-multi .select2-choices .select2-search-field input {
  color: #666;
  background: transparent !important;
  font-family: sans-serif;
  font-size: 100%;
  height: 15px;
  padding: 5px;
  margin: 1px 0;
  outline: 0;
  border: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

.select2-default {
  color: #999 !important;
}

.select2-container-multi .select2-choices .select2-search-choice {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  background-color: #e4e4e4;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f4f4', endColorstr='#eeeeee', GradientType=0);
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee));
  background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: -o-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: -ms-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  -webkit-box-shadow: 0 0 2px #ffffff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
  -moz-box-shadow: 0 0 2px #ffffff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
  box-shadow: 0 0 2px #ffffff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
  color: #333;
  border: 1px solid #aaaaaa;
  line-height: 13px;
  padding: 3px 5px 3px 18px;
  margin: 3px 0 3px 5px;
  position: relative;
  cursor: default;
}

.select2-container-multi .select2-choices .select2-search-choice span {
  cursor: default;
}

.select2-container-multi .select2-choices .select2-search-choice-focus {
  background: #d4d4d4;
}

.select2-search-choice-close {
  display: block;
  position: absolute;
  right: 3px;
  top: 4px;
  width: 12px;
  height: 13px;
  font-size: 1px;
  background: url(../img/select2.png) right top no-repeat;
  outline: none;
}

.select2-container-multi .select2-search-choice-close {
  left: 3px;
}

.select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover {
  background-position: right -11px;
}

.select2-container-multi .select2-choices .select2-search-choice-focus .select2-search-choice-close {
  background-position: right -11px;
}

.select2-container-multi .select2-results {
  margin: -1px 0 0;
  padding: 0;
}

/* disabled styles */
.select2-container-multi.select2-container-disabled .select2-choices {
  background-color: #f4f4f4;
  background-image: none;
  border: 1px solid #ddd;
  cursor: default;
}

.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice {
  background-image: none;
  background-color: #f4f4f4;
  border: 1px solid #ddd;
  padding: 3px 5px 3px 5px;
}

.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice .select2-search-choice-close {
  display: none;
}

/* END Booststrap-Select2 */

/* Booststrap-MultiSelect*/
.multiselect {
  height: 45px;
  font-size: 16px;
  background: white;
  border-radius: 4px;
  color: var(--color-base-500);
  border: 1px solid var(--color-base-300);
  padding-left: 8px;
  padding-right: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: normal;
  margin-left: auto;
}

.multiselect::placeholder .input-form::placeholder {
  color: var(--color-base-500);
}

.multiselect:hover {
  color: var(--color-base-700);
  border: 1px solid var(--color-primary-400);
}

.multiselect:focus {
  outline: none;
  color: var(--color-base-700);
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-300);
}

.multiselect-filled {
  border: 1px solid var(--color-base-400) !important;
}

.multiselect-container {
  position: static;
  list-style-type: none;
  margin: 0;
  padding: 0;
  border-bottom: 8px solid white;
  border-right: 8px solid white;
  border-top: 8px solid white;
}

.multiselect-container .input-group {
  margin: 5px
}

.multiselect-container > li {
  padding: 0
}

.multiselect-container > li > a.multiselect-all label {
  font-weight: 700
}

.multiselect-container > li > label.multiselect-group {
  margin: 0;
  padding: 3px 20px;
  height: 100%;
  font-weight: 700
}

.multiselect-container > li > a {
  padding: 0;
}

.multiselect-container > li > a > label {
  margin: 0;
  height: 100%;
  cursor: pointer;
  font-weight: 400;
  padding: 16px 20px 16px 30px;
}

.multiselect-container > li > a > label.radio, .multiselect-container > li > a > label.checkbox {
  margin: 0;
  border-top: 1px solid var(--color-base-300);
}

.multiselect-container > li > a > label > input[type=checkbox] {
  margin-bottom: 5px;
  accent-color: var(--color-primary-400);
}

#processorList + .btn-group .multiselect-container input[type="radio"] {
  accent-color: var(--color-primary-400); !important;
}

.multiselectText {
  overflow: hidden;
  text-overflow: ellipsis;
}

.multiselect .fa-mid-chevron-down {
  font-size: 20px !important;
}

.btn-group > .btn-group:nth-child(2) > .multiselect.btn {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px
}

.col.full > .btn-group, .btn-group-vertical {
  width: 98% !important;
}

/* END Booststrap-MultiSelect*/

/* Custom simple-select */

.simple-select .multiselect-container input[type="radio"] {
  display: none !important;
}

.simple-select .multiselect-container .checkbox {
  padding-left: 0 !important;
}

.simple-select .multiselect {
  min-width: 166px;
  white-space-collapse: collapse;
  max-height: 45px;
  position: relative;
}

.simple-select .multiselect .multiselectText {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-shrink: 1;              
}

.simple-select .multiselect .caret {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
}

.simple-select .multiselect-container li a label {
  font-size: 16px;
  text-transform: uppercase;
}

.simple-select .multiselect,
.simple-select .multiselect span {
  font-weight: 500;
  font-size: 16px;
  text-align: left;
}

.simple-select .multiselect-container .radio {
  padding-left: 0;
  margin-left: 8px;
  background: none;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
}

.simple-select .multiselect-container li:first-child {
  display: none;
}

.simple-select b.fa-kit.fa-mid-chevron-down {
  font-size: 22px;
  padding-top: 2px; 
}

.simple-select .multiselect-container {
  border: 1px solid var(--color-base-700) !important;
}

.simple-select .multiselect-container li a:hover {
  border: 1px solid var(--color-primary-400) !important;
  border-radius: 4px;
}

.simple-select .multiselect .multiselectText {
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: calc(100% - 18px);
}

/* Prevent conflicts with bootstrap selectors */
.simple-select .multiselect-container li.active a,
.simple-select .multiselect-container li.active a:hover,
.simple-select .multiselect-container li.active a:focus {
    background: none !important;
    color: inherit !important;
    text-decoration: none !important;
    outline: none !important;
}

/* END Custom simple-select */

/*Datepicker for Bootstrap*/
.expirationDate {
  display: inline;
}

.datepicker {
  padding: 4px;
  border-radius: 4px;
  direction: ltr;
}

.datepicker-inline {
  width: 220px;
}

.datepicker.datepicker-rtl {
  direction: rtl;
}

.datepicker.datepicker-rtl table tr td span {
  float: right;
}

.datepicker-dropdown {
  top: 0;
  left: 0;
}

.datepicker-dropdown:before {
  content: '';
  display: inline-block;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #ccc;
  border-top: 0;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  position: absolute;
}

.datepicker-dropdown:after {
  content: '';
  display: inline-block;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
  border-top: 0;
  position: absolute;
}

.datepicker-dropdown.datepicker-orient-left:before {
  left: 6px;
}

.datepicker-dropdown.datepicker-orient-left:after {
  left: 7px;
}

.datepicker-dropdown.datepicker-orient-right:before {
  right: 6px;
}

.datepicker-dropdown.datepicker-orient-right:after {
  right: 7px;
}

.datepicker-dropdown.datepicker-orient-top:before {
  top: -7px;
}

.datepicker-dropdown.datepicker-orient-top:after {
  top: -6px;
}

.datepicker-dropdown.datepicker-orient-bottom:before {
  bottom: -7px;
  border-bottom: 0;
  border-top: 7px solid #999;
}

.datepicker-dropdown.datepicker-orient-bottom:after {
  bottom: -6px;
  border-bottom: 0;
  border-top: 6px solid #fff;
}

.datepicker > div {
  display: none;
}

.datepicker.days div.datepicker-days {
  display: block;
}

.datepicker.months div.datepicker-months {
  display: block;
}

.datepicker.years div.datepicker-years {
  display: block;
}

.datepicker table {
  margin: 0;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.datepicker table tr td,
.datepicker table tr th {
  text-align: center;
  width: 30px;
  height: 30px;
  border-radius: 4px;
  border: none;
}

.table-striped .datepicker table tr td,
.table-striped .datepicker table tr th {
  background-color: transparent;
}

.datepicker table tr td.day:hover,
.datepicker table tr td.day.focused {
  background: #eeeeee;
  cursor: pointer;
}

.datepicker table tr td.old,
.datepicker table tr td.new {
  color: #999999;
}

.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover {
  background: none;
  color: #999999;
  cursor: default;
}

.datepicker table tr td.today,
.datepicker table tr td.today:hover,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover {
  color: #000000;
  background-color: #ffdb99;
  border-color: #ffb733;
}

.datepicker table tr td.today:hover,
.datepicker table tr td.today:hover:hover,
.datepicker table tr td.today.disabled:hover,
.datepicker table tr td.today.disabled:hover:hover,
.datepicker table tr td.today:focus,
.datepicker table tr td.today:hover:focus,
.datepicker table tr td.today.disabled:focus,
.datepicker table tr td.today.disabled:hover:focus,
.datepicker table tr td.today:active,
.datepicker table tr td.today:hover:active,
.datepicker table tr td.today.disabled:active,
.datepicker table tr td.today.disabled:hover:active,
.datepicker table tr td.today.active,
.datepicker table tr td.today:hover.active,
.datepicker table tr td.today.disabled.active,
.datepicker table tr td.today.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td.today,
.open .dropdown-toggle.datepicker table tr td.today:hover,
.open .dropdown-toggle.datepicker table tr td.today.disabled,
.open .dropdown-toggle.datepicker table tr td.today.disabled:hover {
  color: #000000;
  background-color: #ffcd70;
  border-color: #f59e00;
}

.datepicker table tr td.today:active,
.datepicker table tr td.today:hover:active,
.datepicker table tr td.today.disabled:active,
.datepicker table tr td.today.disabled:hover:active,
.datepicker table tr td.today.active,
.datepicker table tr td.today:hover.active,
.datepicker table tr td.today.disabled.active,
.datepicker table tr td.today.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td.today,
.open .dropdown-toggle.datepicker table tr td.today:hover,
.open .dropdown-toggle.datepicker table tr td.today.disabled,
.open .dropdown-toggle.datepicker table tr td.today.disabled:hover {
  background-image: none;
}

.datepicker table tr td.today.disabled,
.datepicker table tr td.today:hover.disabled,
.datepicker table tr td.today.disabled.disabled,
.datepicker table tr td.today.disabled:hover.disabled,
.datepicker table tr td.today[disabled],
.datepicker table tr td.today:hover[disabled],
.datepicker table tr td.today.disabled[disabled],
.datepicker table tr td.today.disabled:hover[disabled],
fieldset[disabled] .datepicker table tr td.today,
fieldset[disabled] .datepicker table tr td.today:hover,
fieldset[disabled] .datepicker table tr td.today.disabled,
fieldset[disabled] .datepicker table tr td.today.disabled:hover,
.datepicker table tr td.today.disabled:hover,
.datepicker table tr td.today:hover.disabled:hover,
.datepicker table tr td.today.disabled.disabled:hover,
.datepicker table tr td.today.disabled:hover.disabled:hover,
.datepicker table tr td.today[disabled]:hover,
.datepicker table tr td.today:hover[disabled]:hover,
.datepicker table tr td.today.disabled[disabled]:hover,
.datepicker table tr td.today.disabled:hover[disabled]:hover,
fieldset[disabled] .datepicker table tr td.today:hover,
fieldset[disabled] .datepicker table tr td.today:hover:hover,
fieldset[disabled] .datepicker table tr td.today.disabled:hover,
fieldset[disabled] .datepicker table tr td.today.disabled:hover:hover,
.datepicker table tr td.today.disabled:focus,
.datepicker table tr td.today:hover.disabled:focus,
.datepicker table tr td.today.disabled.disabled:focus,
.datepicker table tr td.today.disabled:hover.disabled:focus,
.datepicker table tr td.today[disabled]:focus,
.datepicker table tr td.today:hover[disabled]:focus,
.datepicker table tr td.today.disabled[disabled]:focus,
.datepicker table tr td.today.disabled:hover[disabled]:focus,
fieldset[disabled] .datepicker table tr td.today:focus,
fieldset[disabled] .datepicker table tr td.today:hover:focus,
fieldset[disabled] .datepicker table tr td.today.disabled:focus,
fieldset[disabled] .datepicker table tr td.today.disabled:hover:focus,
.datepicker table tr td.today.disabled:active,
.datepicker table tr td.today:hover.disabled:active,
.datepicker table tr td.today.disabled.disabled:active,
.datepicker table tr td.today.disabled:hover.disabled:active,
.datepicker table tr td.today[disabled]:active,
.datepicker table tr td.today:hover[disabled]:active,
.datepicker table tr td.today.disabled[disabled]:active,
.datepicker table tr td.today.disabled:hover[disabled]:active,
fieldset[disabled] .datepicker table tr td.today:active,
fieldset[disabled] .datepicker table tr td.today:hover:active,
fieldset[disabled] .datepicker table tr td.today.disabled:active,
fieldset[disabled] .datepicker table tr td.today.disabled:hover:active,
.datepicker table tr td.today.disabled.active,
.datepicker table tr td.today:hover.disabled.active,
.datepicker table tr td.today.disabled.disabled.active,
.datepicker table tr td.today.disabled:hover.disabled.active,
.datepicker table tr td.today[disabled].active,
.datepicker table tr td.today:hover[disabled].active,
.datepicker table tr td.today.disabled[disabled].active,
.datepicker table tr td.today.disabled:hover[disabled].active,
fieldset[disabled] .datepicker table tr td.today.active,
fieldset[disabled] .datepicker table tr td.today:hover.active,
fieldset[disabled] .datepicker table tr td.today.disabled.active,
fieldset[disabled] .datepicker table tr td.today.disabled:hover.active {
  background-color: #ffdb99;
  border-color: #ffb733;
}

.datepicker table tr td.today:hover:hover {
  color: #000;
}

.datepicker table tr td.today.active:hover {
  color: #fff;
}

.datepicker table tr td.range,
.datepicker table tr td.range:hover,
.datepicker table tr td.range.disabled,
.datepicker table tr td.range.disabled:hover {
  background: #eeeeee;
  border-radius: 0;
}

.datepicker table tr td.range.today,
.datepicker table tr td.range.today:hover,
.datepicker table tr td.range.today.disabled,
.datepicker table tr td.range.today.disabled:hover {
  color: #000000;
  background-color: #f7ca77;
  border-color: #f1a417;
  border-radius: 0;
}

.datepicker table tr td.range.today:hover,
.datepicker table tr td.range.today:hover:hover,
.datepicker table tr td.range.today.disabled:hover,
.datepicker table tr td.range.today.disabled:hover:hover,
.datepicker table tr td.range.today:focus,
.datepicker table tr td.range.today:hover:focus,
.datepicker table tr td.range.today.disabled:focus,
.datepicker table tr td.range.today.disabled:hover:focus,
.datepicker table tr td.range.today:active,
.datepicker table tr td.range.today:hover:active,
.datepicker table tr td.range.today.disabled:active,
.datepicker table tr td.range.today.disabled:hover:active,
.datepicker table tr td.range.today.active,
.datepicker table tr td.range.today:hover.active,
.datepicker table tr td.range.today.disabled.active,
.datepicker table tr td.range.today.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td.range.today,
.open .dropdown-toggle.datepicker table tr td.range.today:hover,
.open .dropdown-toggle.datepicker table tr td.range.today.disabled,
.open .dropdown-toggle.datepicker table tr td.range.today.disabled:hover {
  color: #000000;
  background-color: #f4bb51;
  border-color: #bf800c;
}

.datepicker table tr td.range.today:active,
.datepicker table tr td.range.today:hover:active,
.datepicker table tr td.range.today.disabled:active,
.datepicker table tr td.range.today.disabled:hover:active,
.datepicker table tr td.range.today.active,
.datepicker table tr td.range.today:hover.active,
.datepicker table tr td.range.today.disabled.active,
.datepicker table tr td.range.today.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td.range.today,
.open .dropdown-toggle.datepicker table tr td.range.today:hover,
.open .dropdown-toggle.datepicker table tr td.range.today.disabled,
.open .dropdown-toggle.datepicker table tr td.range.today.disabled:hover {
  background-image: none;
}

.datepicker table tr td.range.today.disabled,
.datepicker table tr td.range.today:hover.disabled,
.datepicker table tr td.range.today.disabled.disabled,
.datepicker table tr td.range.today.disabled:hover.disabled,
.datepicker table tr td.range.today[disabled],
.datepicker table tr td.range.today:hover[disabled],
.datepicker table tr td.range.today.disabled[disabled],
.datepicker table tr td.range.today.disabled:hover[disabled],
fieldset[disabled] .datepicker table tr td.range.today,
fieldset[disabled] .datepicker table tr td.range.today:hover,
fieldset[disabled] .datepicker table tr td.range.today.disabled,
fieldset[disabled] .datepicker table tr td.range.today.disabled:hover,
.datepicker table tr td.range.today.disabled:hover,
.datepicker table tr td.range.today:hover.disabled:hover,
.datepicker table tr td.range.today.disabled.disabled:hover,
.datepicker table tr td.range.today.disabled:hover.disabled:hover,
.datepicker table tr td.range.today[disabled]:hover,
.datepicker table tr td.range.today:hover[disabled]:hover,
.datepicker table tr td.range.today.disabled[disabled]:hover,
.datepicker table tr td.range.today.disabled:hover[disabled]:hover,
fieldset[disabled] .datepicker table tr td.range.today:hover,
fieldset[disabled] .datepicker table tr td.range.today:hover:hover,
fieldset[disabled] .datepicker table tr td.range.today.disabled:hover,
fieldset[disabled] .datepicker table tr td.range.today.disabled:hover:hover,
.datepicker table tr td.range.today.disabled:focus,
.datepicker table tr td.range.today:hover.disabled:focus,
.datepicker table tr td.range.today.disabled.disabled:focus,
.datepicker table tr td.range.today.disabled:hover.disabled:focus,
.datepicker table tr td.range.today[disabled]:focus,
.datepicker table tr td.range.today:hover[disabled]:focus,
.datepicker table tr td.range.today.disabled[disabled]:focus,
.datepicker table tr td.range.today.disabled:hover[disabled]:focus,
fieldset[disabled] .datepicker table tr td.range.today:focus,
fieldset[disabled] .datepicker table tr td.range.today:hover:focus,
fieldset[disabled] .datepicker table tr td.range.today.disabled:focus,
fieldset[disabled] .datepicker table tr td.range.today.disabled:hover:focus,
.datepicker table tr td.range.today.disabled:active,
.datepicker table tr td.range.today:hover.disabled:active,
.datepicker table tr td.range.today.disabled.disabled:active,
.datepicker table tr td.range.today.disabled:hover.disabled:active,
.datepicker table tr td.range.today[disabled]:active,
.datepicker table tr td.range.today:hover[disabled]:active,
.datepicker table tr td.range.today.disabled[disabled]:active,
.datepicker table tr td.range.today.disabled:hover[disabled]:active,
fieldset[disabled] .datepicker table tr td.range.today:active,
fieldset[disabled] .datepicker table tr td.range.today:hover:active,
fieldset[disabled] .datepicker table tr td.range.today.disabled:active,
fieldset[disabled] .datepicker table tr td.range.today.disabled:hover:active,
.datepicker table tr td.range.today.disabled.active,
.datepicker table tr td.range.today:hover.disabled.active,
.datepicker table tr td.range.today.disabled.disabled.active,
.datepicker table tr td.range.today.disabled:hover.disabled.active,
.datepicker table tr td.range.today[disabled].active,
.datepicker table tr td.range.today:hover[disabled].active,
.datepicker table tr td.range.today.disabled[disabled].active,
.datepicker table tr td.range.today.disabled:hover[disabled].active,
fieldset[disabled] .datepicker table tr td.range.today.active,
fieldset[disabled] .datepicker table tr td.range.today:hover.active,
fieldset[disabled] .datepicker table tr td.range.today.disabled.active,
fieldset[disabled] .datepicker table tr td.range.today.disabled:hover.active {
  background-color: #f7ca77;
  border-color: #f1a417;
}

.datepicker table tr td.selected,
.datepicker table tr td.selected:hover,
.datepicker table tr td.selected.disabled,
.datepicker table tr td.selected.disabled:hover {
  color: #ffffff;
  background-color: #999999;
  border-color: #555555;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td.selected:hover,
.datepicker table tr td.selected:hover:hover,
.datepicker table tr td.selected.disabled:hover,
.datepicker table tr td.selected.disabled:hover:hover,
.datepicker table tr td.selected:focus,
.datepicker table tr td.selected:hover:focus,
.datepicker table tr td.selected.disabled:focus,
.datepicker table tr td.selected.disabled:hover:focus,
.datepicker table tr td.selected:active,
.datepicker table tr td.selected:hover:active,
.datepicker table tr td.selected.disabled:active,
.datepicker table tr td.selected.disabled:hover:active,
.datepicker table tr td.selected.active,
.datepicker table tr td.selected:hover.active,
.datepicker table tr td.selected.disabled.active,
.datepicker table tr td.selected.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td.selected,
.open .dropdown-toggle.datepicker table tr td.selected:hover,
.open .dropdown-toggle.datepicker table tr td.selected.disabled,
.open .dropdown-toggle.datepicker table tr td.selected.disabled:hover {
  color: #ffffff;
  background-color: #858585;
  border-color: #373737;
}

.datepicker table tr td.selected:active,
.datepicker table tr td.selected:hover:active,
.datepicker table tr td.selected.disabled:active,
.datepicker table tr td.selected.disabled:hover:active,
.datepicker table tr td.selected.active,
.datepicker table tr td.selected:hover.active,
.datepicker table tr td.selected.disabled.active,
.datepicker table tr td.selected.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td.selected,
.open .dropdown-toggle.datepicker table tr td.selected:hover,
.open .dropdown-toggle.datepicker table tr td.selected.disabled,
.open .dropdown-toggle.datepicker table tr td.selected.disabled:hover {
  background-image: none;
}

.datepicker table tr td.selected.disabled,
.datepicker table tr td.selected:hover.disabled,
.datepicker table tr td.selected.disabled.disabled,
.datepicker table tr td.selected.disabled:hover.disabled,
.datepicker table tr td.selected[disabled],
.datepicker table tr td.selected:hover[disabled],
.datepicker table tr td.selected.disabled[disabled],
.datepicker table tr td.selected.disabled:hover[disabled],
fieldset[disabled] .datepicker table tr td.selected,
fieldset[disabled] .datepicker table tr td.selected:hover,
fieldset[disabled] .datepicker table tr td.selected.disabled,
fieldset[disabled] .datepicker table tr td.selected.disabled:hover,
.datepicker table tr td.selected.disabled:hover,
.datepicker table tr td.selected:hover.disabled:hover,
.datepicker table tr td.selected.disabled.disabled:hover,
.datepicker table tr td.selected.disabled:hover.disabled:hover,
.datepicker table tr td.selected[disabled]:hover,
.datepicker table tr td.selected:hover[disabled]:hover,
.datepicker table tr td.selected.disabled[disabled]:hover,
.datepicker table tr td.selected.disabled:hover[disabled]:hover,
fieldset[disabled] .datepicker table tr td.selected:hover,
fieldset[disabled] .datepicker table tr td.selected:hover:hover,
fieldset[disabled] .datepicker table tr td.selected.disabled:hover,
fieldset[disabled] .datepicker table tr td.selected.disabled:hover:hover,
.datepicker table tr td.selected.disabled:focus,
.datepicker table tr td.selected:hover.disabled:focus,
.datepicker table tr td.selected.disabled.disabled:focus,
.datepicker table tr td.selected.disabled:hover.disabled:focus,
.datepicker table tr td.selected[disabled]:focus,
.datepicker table tr td.selected:hover[disabled]:focus,
.datepicker table tr td.selected.disabled[disabled]:focus,
.datepicker table tr td.selected.disabled:hover[disabled]:focus,
fieldset[disabled] .datepicker table tr td.selected:focus,
fieldset[disabled] .datepicker table tr td.selected:hover:focus,
fieldset[disabled] .datepicker table tr td.selected.disabled:focus,
fieldset[disabled] .datepicker table tr td.selected.disabled:hover:focus,
.datepicker table tr td.selected.disabled:active,
.datepicker table tr td.selected:hover.disabled:active,
.datepicker table tr td.selected.disabled.disabled:active,
.datepicker table tr td.selected.disabled:hover.disabled:active,
.datepicker table tr td.selected[disabled]:active,
.datepicker table tr td.selected:hover[disabled]:active,
.datepicker table tr td.selected.disabled[disabled]:active,
.datepicker table tr td.selected.disabled:hover[disabled]:active,
fieldset[disabled] .datepicker table tr td.selected:active,
fieldset[disabled] .datepicker table tr td.selected:hover:active,
fieldset[disabled] .datepicker table tr td.selected.disabled:active,
fieldset[disabled] .datepicker table tr td.selected.disabled:hover:active,
.datepicker table tr td.selected.disabled.active,
.datepicker table tr td.selected:hover.disabled.active,
.datepicker table tr td.selected.disabled.disabled.active,
.datepicker table tr td.selected.disabled:hover.disabled.active,
.datepicker table tr td.selected[disabled].active,
.datepicker table tr td.selected:hover[disabled].active,
.datepicker table tr td.selected.disabled[disabled].active,
.datepicker table tr td.selected.disabled:hover[disabled].active,
fieldset[disabled] .datepicker table tr td.selected.active,
fieldset[disabled] .datepicker table tr td.selected:hover.active,
fieldset[disabled] .datepicker table tr td.selected.disabled.active,
fieldset[disabled] .datepicker table tr td.selected.disabled:hover.active {
  background-color: #999999;
  border-color: #555555;
}

.datepicker table tr td.active,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active.disabled:hover {
  color: #ffffff;
  background-color: #428bca;
  border-color: #357ebd;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td.active:hover,
.datepicker table tr td.active:hover:hover,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active:focus,
.datepicker table tr td.active:hover:focus,
.datepicker table tr td.active.disabled:focus,
.datepicker table tr td.active.disabled:hover:focus,
.datepicker table tr td.active:active,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.active,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td.active,
.open .dropdown-toggle.datepicker table tr td.active:hover,
.open .dropdown-toggle.datepicker table tr td.active.disabled,
.open .dropdown-toggle.datepicker table tr td.active.disabled:hover {
  color: #ffffff;
  background-color: #3276b1;
  border-color: #285e8e;
}

.datepicker table tr td.active:active,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.active,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td.active,
.open .dropdown-toggle.datepicker table tr td.active:hover,
.open .dropdown-toggle.datepicker table tr td.active.disabled,
.open .dropdown-toggle.datepicker table tr td.active.disabled:hover {
  background-image: none;
}

.datepicker table tr td.active.disabled,
.datepicker table tr td.active:hover.disabled,
.datepicker table tr td.active.disabled.disabled,
.datepicker table tr td.active.disabled:hover.disabled,
.datepicker table tr td.active[disabled],
.datepicker table tr td.active:hover[disabled],
.datepicker table tr td.active.disabled[disabled],
.datepicker table tr td.active.disabled:hover[disabled],
fieldset[disabled] .datepicker table tr td.active,
fieldset[disabled] .datepicker table tr td.active:hover,
fieldset[disabled] .datepicker table tr td.active.disabled,
fieldset[disabled] .datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active:hover.disabled:hover,
.datepicker table tr td.active.disabled.disabled:hover,
.datepicker table tr td.active.disabled:hover.disabled:hover,
.datepicker table tr td.active[disabled]:hover,
.datepicker table tr td.active:hover[disabled]:hover,
.datepicker table tr td.active.disabled[disabled]:hover,
.datepicker table tr td.active.disabled:hover[disabled]:hover,
fieldset[disabled] .datepicker table tr td.active:hover,
fieldset[disabled] .datepicker table tr td.active:hover:hover,
fieldset[disabled] .datepicker table tr td.active.disabled:hover,
fieldset[disabled] .datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active.disabled:focus,
.datepicker table tr td.active:hover.disabled:focus,
.datepicker table tr td.active.disabled.disabled:focus,
.datepicker table tr td.active.disabled:hover.disabled:focus,
.datepicker table tr td.active[disabled]:focus,
.datepicker table tr td.active:hover[disabled]:focus,
.datepicker table tr td.active.disabled[disabled]:focus,
.datepicker table tr td.active.disabled:hover[disabled]:focus,
fieldset[disabled] .datepicker table tr td.active:focus,
fieldset[disabled] .datepicker table tr td.active:hover:focus,
fieldset[disabled] .datepicker table tr td.active.disabled:focus,
fieldset[disabled] .datepicker table tr td.active.disabled:hover:focus,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active:hover.disabled:active,
.datepicker table tr td.active.disabled.disabled:active,
.datepicker table tr td.active.disabled:hover.disabled:active,
.datepicker table tr td.active[disabled]:active,
.datepicker table tr td.active:hover[disabled]:active,
.datepicker table tr td.active.disabled[disabled]:active,
.datepicker table tr td.active.disabled:hover[disabled]:active,
fieldset[disabled] .datepicker table tr td.active:active,
fieldset[disabled] .datepicker table tr td.active:hover:active,
fieldset[disabled] .datepicker table tr td.active.disabled:active,
fieldset[disabled] .datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active:hover.disabled.active,
.datepicker table tr td.active.disabled.disabled.active,
.datepicker table tr td.active.disabled:hover.disabled.active,
.datepicker table tr td.active[disabled].active,
.datepicker table tr td.active:hover[disabled].active,
.datepicker table tr td.active.disabled[disabled].active,
.datepicker table tr td.active.disabled:hover[disabled].active,
fieldset[disabled] .datepicker table tr td.active.active,
fieldset[disabled] .datepicker table tr td.active:hover.active,
fieldset[disabled] .datepicker table tr td.active.disabled.active,
fieldset[disabled] .datepicker table tr td.active.disabled:hover.active {
  background-color: #428bca;
  border-color: #357ebd;
}

.datepicker table tr td span {
  display: block;
  width: 23%;
  height: 54px;
  line-height: 54px;
  float: left;
  margin: 1%;
  cursor: pointer;
  border-radius: 4px;
}

.datepicker table tr td span:hover {
  background: #eeeeee;
}

.datepicker table tr td span.disabled,
.datepicker table tr td span.disabled:hover {
  background: none;
  color: #999999;
  cursor: default;
}

.datepicker table tr td span.active,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled:hover {
  color: #ffffff;
  background-color: #428bca;
  border-color: #357ebd;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td span.active:hover,
.datepicker table tr td span.active:hover:hover,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active.disabled:hover:hover,
.datepicker table tr td span.active:focus,
.datepicker table tr td span.active:hover:focus,
.datepicker table tr td span.active.disabled:focus,
.datepicker table tr td span.active.disabled:hover:focus,
.datepicker table tr td span.active:active,
.datepicker table tr td span.active:hover:active,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active.active,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td span.active,
.open .dropdown-toggle.datepicker table tr td span.active:hover,
.open .dropdown-toggle.datepicker table tr td span.active.disabled,
.open .dropdown-toggle.datepicker table tr td span.active.disabled:hover {
  color: #ffffff;
  background-color: #3276b1;
  border-color: #285e8e;
}

.datepicker table tr td span.active:active,
.datepicker table tr td span.active:hover:active,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active.active,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled:hover.active,
.open .dropdown-toggle.datepicker table tr td span.active,
.open .dropdown-toggle.datepicker table tr td span.active:hover,
.open .dropdown-toggle.datepicker table tr td span.active.disabled,
.open .dropdown-toggle.datepicker table tr td span.active.disabled:hover {
  background-image: none;
}

.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active:hover.disabled,
.datepicker table tr td span.active.disabled.disabled,
.datepicker table tr td span.active.disabled:hover.disabled,
.datepicker table tr td span.active[disabled],
.datepicker table tr td span.active:hover[disabled],
.datepicker table tr td span.active.disabled[disabled],
.datepicker table tr td span.active.disabled:hover[disabled],
fieldset[disabled] .datepicker table tr td span.active,
fieldset[disabled] .datepicker table tr td span.active:hover,
fieldset[disabled] .datepicker table tr td span.active.disabled,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active:hover.disabled:hover,
.datepicker table tr td span.active.disabled.disabled:hover,
.datepicker table tr td span.active.disabled:hover.disabled:hover,
.datepicker table tr td span.active[disabled]:hover,
.datepicker table tr td span.active:hover[disabled]:hover,
.datepicker table tr td span.active.disabled[disabled]:hover,
.datepicker table tr td span.active.disabled:hover[disabled]:hover,
fieldset[disabled] .datepicker table tr td span.active:hover,
fieldset[disabled] .datepicker table tr td span.active:hover:hover,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover:hover,
.datepicker table tr td span.active.disabled:focus,
.datepicker table tr td span.active:hover.disabled:focus,
.datepicker table tr td span.active.disabled.disabled:focus,
.datepicker table tr td span.active.disabled:hover.disabled:focus,
.datepicker table tr td span.active[disabled]:focus,
.datepicker table tr td span.active:hover[disabled]:focus,
.datepicker table tr td span.active.disabled[disabled]:focus,
.datepicker table tr td span.active.disabled:hover[disabled]:focus,
fieldset[disabled] .datepicker table tr td span.active:focus,
fieldset[disabled] .datepicker table tr td span.active:hover:focus,
fieldset[disabled] .datepicker table tr td span.active.disabled:focus,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover:focus,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active:hover.disabled:active,
.datepicker table tr td span.active.disabled.disabled:active,
.datepicker table tr td span.active.disabled:hover.disabled:active,
.datepicker table tr td span.active[disabled]:active,
.datepicker table tr td span.active:hover[disabled]:active,
.datepicker table tr td span.active.disabled[disabled]:active,
.datepicker table tr td span.active.disabled:hover[disabled]:active,
fieldset[disabled] .datepicker table tr td span.active:active,
fieldset[disabled] .datepicker table tr td span.active:hover:active,
fieldset[disabled] .datepicker table tr td span.active.disabled:active,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active:hover.disabled.active,
.datepicker table tr td span.active.disabled.disabled.active,
.datepicker table tr td span.active.disabled:hover.disabled.active,
.datepicker table tr td span.active[disabled].active,
.datepicker table tr td span.active:hover[disabled].active,
.datepicker table tr td span.active.disabled[disabled].active,
.datepicker table tr td span.active.disabled:hover[disabled].active,
fieldset[disabled] .datepicker table tr td span.active.active,
fieldset[disabled] .datepicker table tr td span.active:hover.active,
fieldset[disabled] .datepicker table tr td span.active.disabled.active,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover.active {
  background-color: #428bca;
  border-color: #357ebd;
}

.datepicker table tr td span.old,
.datepicker table tr td span.new {
  color: #999999;
}

.datepicker th.datepicker-switch {
  width: 145px;
}

.datepicker thead tr:first-child th,
.datepicker tfoot tr th {
  cursor: pointer;
}

.datepicker thead tr:first-child th:hover,
.datepicker tfoot tr th:hover {
  background: #eeeeee;
}

.datepicker .cw {
  font-size: 10px;
  width: 12px;
  padding: 0 2px 0 5px;
  vertical-align: middle;
}

.datepicker thead tr:first-child th.cw {
  cursor: default;
  background-color: transparent;
}

.input-group.date .input-group-addon i {
  cursor: pointer;
  width: 98%;
}

.input-daterange input {
  text-align: center;
}

.input-daterange input:first-child {
  border-radius: 3px 0 0 3px;
}

.input-daterange input:last-child {
  border-radius: 0 3px 3px 0;
}

.input-daterange .input-group-addon {
  width: auto;
  min-width: 16px;
  padding: 4px 5px;
  font-weight: normal;
  line-height: 1.428571429;
  text-align: center;
  text-shadow: 0 1px 0 #fff;
  vertical-align: middle;
  background-color: #eeeeee;
  border: solid #cccccc;
  border-width: 1px 0;
  margin-left: -5px;
  margin-right: -5px;
}

.datepicker.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  float: left;
  display: none;
  min-width: 160px;
  list-style: none;
  background-color: #ffffff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 5px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
  *border-right-width: 2px;
  *border-bottom-width: 2px;
  color: #333333;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 13px;
  line-height: 1.428571429;
}

.datepicker.dropdown-menu th,
.datepicker.dropdown-menu td {
  padding: 4px 5px;
}

/*END Datepicker for Bootstrap*/

.text-align-left {
  text-align: left !important;
}

.text-align-right {
  text-align: right !important;
}

.text-align-center {
  text-align: center !important;
}

.text-align-last-center {
  text-align-last: center
}

.text-align-justify {
  text-align: justify !important;
}

.text-align-left thead > tr > th,
.text-align-left tr td {
  text-align: left !important;
}

.pull-center {
  text-align: center !important;
}

.pull-right {
  float: right !important;
}


button[class*="pull-right"] {
  margin-right: 3px !important;
}

/* Notifications */
.growl {
  position: fixed;
  bottom: 10px;
  right: 10px;
  float: right;
  max-width: 550px;
  width: 550px;
  font-size: 13px;
  padding: 15px !important;
  z-index: 10000;
}

.growl-item.ng-enter,
.growl-item.ng-leave {
  -webkit-transition: 0.5s linear all;
  -moz-transition: 0.5s linear all;
  -o-transition: 0.5s linear all;
  transition: 0.5s linear all;
}

.growl-item.ng-enter,
.growl-item.ng-leave.ng-leave-active {
  opacity: 0;
}

.growl-item.ng-leave,
.growl-item.ng-enter.ng-enter-active {
  opacity: 1;
}

/*alert-colors*/

.alert-success {
  color: var(--color-base-700);
  background-color: var(--color-primary-100);
  font-size: 16px;
  border-radius: 4px;
  border-color: var(--color-primary-300);
}

.alert-info {
  color: var(--color-base-600);
  background-color: var(--color-base-200);
  border-color: var(--color-base-400);
  font-size: 16px;
  border-radius: 4px;
}

.alert-info .alert-link {
  color: #245269;
}

.alert-warning {
  color: #fff;
  background-color: #cc856b;
  border-color: #eed3d7
}

.alert-danger, .alert-error {
  color: var(--color-base-700);
  background-color: var(--color-error-100);
  font-size: 16px;
  border-radius: 4px;
  border-color: var(--color-error-200);
}

.error {
  background-color: #d43f3a;
  border-radius: 4px 4px 4px 4px;
  color: white;
  font-weight: bold;
  padding: 6px 12px;
  position: absolute;
  display: inline-block;
  border-bottom: 1px solid #c53b36;
  z-index: 1;
}

.error:before {
  border-color: transparent #d43f3a transparent transparent;
  border-style: solid;
  border-width: 6px 8px;
  content: "";
  display: block;
  height: 0;
  left: -16px;
  position: absolute;
  top: 6px;
  width: 0;
}

.required-field {
  border-radius: 4px 4px 4px 4px;
  color: #d43f3a;
  font-weight: bold;
  position: absolute;
  z-index: 1;
}

/* End Notifications */

.boxContent {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.42857143;
  word-wrap: break-word;
  background-color: #F1F9F8;
  border: 1px solid #DDD;
  border-radius: 4px;
  width: auto;
  color: inherit;
}

.boxContent input {
  margin-left: 5px;
  margin-right: 5px;
}

.box--primary {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
  border-radius: 4px;
  border: 1px solid var(--color-primary-400);
  background: var(--color-base-100);
}

.box-dashed--primary {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
  border-radius: 4px;
  border-top: 1px dashed var(--color-primary-400);
  border-left: 1px dashed var(--color-primary-400);
  border-right: 1px dashed var(--color-primary-400);
  background: var(--color-primary-100);
}

.box-dashed--secondary {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
  border-radius: 4px;
  border-top: 1px dashed var(--color-secondary-400);
  border-left: 1px dashed var(--color-secondary-400);
  border-right: 1px dashed var(--color-secondary-400);
  background: var(--color-base-white);
}

/*Help Format (Tooltip)*/
.help {
  text-decoration: none;
  font-size: 12px;
  position: relative;
}

.help a {
  text-decoration: none;
}

.help img {
  margin-bottom: 3px;
}

.help span {
  margin-left: -999em;
  position: absolute;
}

.help:hover span {
  border-radius: 5px 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
  font-family: Calibri, Tahoma, Geneva, sans-serif;
  position: absolute;
  left: 1em;
  top: 2em;
  z-index: 99;
  margin-left: 0;
  min-width: 200px;
  height: auto;
  word-wrap: break-word;
}

.help:hover span img {
  border: 0;
  margin: -10px 0 0 -55px;
  float: left;
  position: absolute;
}

.help:hover span em {
  font-family: Candara, Tahoma, Geneva, sans-serif;
  font-size: 1.2em;
  font-weight: bold;
  display: block;
  padding: 0.2em 0 0.6em 0;
}

.help .classic {
  padding: 0.8em 1em;
}

.help .custom {
  padding: 0.5em 0.8em 0.8em 2em;
}

/* Colors Box */
.help .info {
  background: #9FDAEE;
  border: 1px solid #2BB0D7;
}

.help .warning {
  background: #BCFF96;
  border: 1px solid #A2DB81;
}

.help .critical {
  background: #FFCCAA;
  border: 1px solid #FF3334;
}

/* Rows Format*/
tr[class^="row"] {
  transition: all .2s ease-out;
}

.row-white {
  background: #ffffff !important;
}

.row-green {
  background: #E7FFD5 !important;
  color: #000000;
}

.row-green:hover {
  background: var(--color-primary-200) !important;
}

.row-lightGreen {
  /*background: #C2E38F !important;*/
  background: #C2E3B2 !important;
}

.row-blueGreen {
  background: #80ABA6 !important;
  color: #FFF;
}

.row-blueGreen:hover {
  /*background: #FCFCFC !important;*/
}

.row-silver {
  background: #ECEBEB !important;
  color: #666666;
}

.row-silver:hover {
  background: #D9D8D8 !important;
}

.row-dark-orange {
  color: #fff;
  background-color: #f0ad4e !important;
  border-color: #eea236;
}

.row-orange {
  background: #F0C487 !important;
  color: #666666;
}

.row-orange:hover {
  /*background: #F3D0A0 !important;*/
}

.row-red {
  background: var(--color-error-100) !important;
  color: var(--color-base-600) !important;
}

.row-red:hover {
  background: #FFC8C8 !important;
}

.row-lightRed {
  background: #EA9F9D !important;
}

.row-yellow {
  background: #F5E998 !important;
  color: #666666;
}

.row-yellow:hover {
  background: #E7DB89 !important;
}

.row-blue {
  background: #C7B9FA !important;
  color: #666666;
}

.row-blue:hover {
  background: #D6CCF9 !important;
}

.row-totals {
  background: #acddd7 !important;
  text-shadow: 1px 1px 1px #FFF;
}

.row-totals-new {
  background-color: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-400) !important;
  color: var(--color-base-600);
}

.row-bold {
  font-weight: bold;
}

/* End Rows Format*/

/* Cursor */
.cursor {
  cursor: pointer;
}

/* Customer  modal-dialog alert */
.modal-body .formRow ol {
  padding: 0;
}

input[type="text"][readonly],
input[type="text"].readonly {
  background-color: white;
}

/* *******chart start ******* */
.custom-bar-chart {
  border-bottom: 1px solid #C9CDD7;
  height: 260px;
  width: 100%;
  margin-top: 20px;
  position: relative;
}

.y-axis {
  color: #555555;
  position: absolute;
  text-align: left;
  width: 100%;
}

.y-axis ul {
  padding: 0 0 0 0 !important;
  margin-top: 0 !important;
  margin-bottom: 10px !important;
}

.y-axis li {
  border-top: 1px dashed #DBDCE0;
  display: block;
  padding: 15.5px;
  width: 100%;
}

.y-axis li:last-child {
  border-top: medium none;
}

.y-axis li span {
  display: block;
  margin: -10px 0 0 -65px;
  padding: 0 12px;
  width: 40px;
}

.contentChart {
  height: inherit;
}

.custom-bar-chart div.bar-groups {
  width: 20%;
  height: 100%;
  display: block;
  float: left;
  position: static;
}

.custom-bar-chart .bar {
  border-radius: 5px 5px 0 0;
  float: left;
  height: 100%;
  margin-left: 10%;
  position: relative;
  text-align: center;
  width: 21%;
}

.custom-bar-chart .bar .value {
  background: none repeat scroll 0 0 #3276b1;
  border-radius: 3px 3px 0 0;
  bottom: 0;
  position: absolute;
  transition: all 0.3s ease 0s;
  width: 100%;
  height: 10%;
}

.custom-bar-chart .bar .title {
  bottom: -20px;
  font-size: 12px;
  position: absolute;
  text-align: center;
  width: 100%;
}

.custom-bar-chart .bar .available {
  background-color: #62a921;
}

.custom-bar-chart .bar .noAvailable {
  background-color: #DF8987;
}

.custom-bar-chart .bar .value:hover {
  background: none repeat scroll 0 0 #4b958c;
  color: #FFFFFF;
}

.custom-bar-chart .bar .value span {
  color: black;
  display: inherit;
  width: 100%;
}

.chartDivision {
  width: 1px;
  height: 100%;
  margin-top: 0;
  margin-left: 13px;
  border: 0.5px dashed #DBDCE0;
  position: absolute;
}

.contentSe {
  display: block;
  margin: 0 auto;
}

.titleSe {
  display: inline-block;
  float: left;
  width: 80px;
  height: 35px;
  margin-top: 50px;
  text-align: center;
}

.total {
  width: 20px;
  height: 20px;
  background-color: #3276b1;
  display: inline-block;
  float: left;
  margin-top: 50px;
  margin-left: 10px;
}

.availableSe {
  width: 20px;
  height: 20px;
  background-color: #62a921;
  display: inline-block;
  float: left;
  margin-top: 50px;
  margin-left: 10px;
}

.noAvailableSe {
  width: 20px;
  height: 20px;
  background-color: #DF8987;
  display: inline-block;
  float: left;
  margin-top: 50px;
  margin-left: 10px;
}

.chart {
  display: inline-block;
  text-align: center;
  width: 100%;
}

.chart .heading {
  text-align: left;
}

.chart .heading span {
  display: block;
}

/** Payout Rules **/
.rule {
  margin: 10px 0;
  padding: 10px;
  width: 50%;
}

.rule-header {
  padding: 10px;
  font-weight: bold;
  display: block;
  margin: 10px 0;
}

.rule-rejected, .rejected-rule-icon {
  color: #CF2326;
}

.rule-approved, .approved-rule-icon {
  color: #00a89c;
}

.rule-pending, .pending-rule-icon {
  color: darkred;
}

.rule.rule-approved, .rule-header-approved {
  background-color: #C7DED3;
}

.rule.rule-rejected, .rule-header-rejected {
  background-color: #FFCDCF;
}

.rule.rule-pending, .rule-header-pending {
  background-color: lightgoldenrodyellow;
}

.rule-list {
  margin-top: 20px;
  margin-left: 20px;
}

.rule-result-list li {
  margin: 5px 0;
}

.rejected-title {
  text-transform: uppercase;
  color: #CF2326;
}

.rule-explanation {
  color: #CF2326;
  margin-left: 25px;
}

.rule-icon {
  width: 14px;
  text-align: center;
}


@media only screen and (max-width: 725px) {
  .custom-bar-chart .bar .title {
    font-size: 10px;
  }
}

@media only screen and (max-width: 500px) {
  .custom-bar-chart .bar .title {
    font-size: 8px;
  }

  .contentSe {
    margin-left: 8px;
  }

  .custom-bar-chart .bar .value span {
    font-size: 18px;
  }
}

.account-info {
  margin-left: 1%;
}

/**
 Here begins the widgets styles
 */
.card {
  margin-top: 0;
  margin-bottom: 1.5rem;
  text-align: left;
  position: relative;
  background: #fff;
  border-radius: 4px;
  transition: all 0.3s ease;
  box-shadow: 2px 4px 8px 0 rgba(46, 61, 73, 0.2);
}

.colored-header {
  cursor: pointer;
  text-align: center;
  background-color: #4b958c !important;
  color: whitesmoke !important;
}

[data-toggle="collapse"] {
  cursor: pointer;
}

.item-panel {
  cursor: pointer;
}

.default {
  color: #999999 !important;
}

.danger {
  color: #b94a48 !important;
}

.warning {
  color: #f89406 !important;
}

.success {
  color: #468847 !important;
}

.info {
  color: #5bc0de !important;
}

.fa-1-2 {
  font-size: 1.5em !important;
}

.flex-grid {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
}

.flex-grid-column {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}

.flex-row {
  flex-direction: row;
}

.space-around {
  justify-content: space-around;
}

.space-between {
  justify-content: space-between;
}

.flex-row-reverse {
  flex-direction: row-reverse;
  flex: 1;
}

.flex-col {
  flex: 1;
}

.flex-end {
  align-self: flex-end;
}

.transaction-container {
  line-height: 1.1;
  padding-top: 5px;
}

.cc-icon-container {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 5px;
}

.align-center {
  align-items: center;
}

.help-block {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  font-size: 0.75em;
}

.badge-vip {
  vertical-align: super;
  font-size: smaller;
  align-self: flex-end;
  border-radius: 10rem;
  padding: .3em;
  min-width: 20px;
}

.badge-board {
  display: flex !important;
  width: 100%;
  justify-content: space-between;
}

.badge-board span:last-of-type {
  background-color: #f0ad4e;
}

.favorite-processor-option {
  display: flex;
}

.favorite-processor-pointer {
  cursor: pointer;
}

.loyalty-program-img {
  width: 100%;
}

.loyalty-program-level-classic {
  width: 80px;
  background-color: #4079b2;
  margin-left: 10px;
  text-align: center;
  color: whitesmoke;
  -webkit-border-radius: 3px 3px 3px 3px;
  position: absolute;
  font-weight: 500;
}

.loyalty-program-level-bronze {
  width: 80px;
  background-color: #B7833D;
  margin-left: 10px;
  text-align: center;
  color: white;
  -webkit-border-radius: 3px 3px 3px 3px;
  position: absolute;
  font-weight: 500;
}

.loyalty-program-level-silver {
  width: 80px;
  background-color: #9F9F9F;
  margin-left: 10px;
  text-align: center;
  color: white;
  -webkit-border-radius: 3px 3px 3px 3px;
  position: absolute;
  font-weight: 500;
}

.loyalty-program-level-gold {
  width: 80px;
  background-color: #E4B335;
  margin-left: 10px;
  text-align: center;
  color: white;
  -webkit-border-radius: 3px 3px 3px 3px;
  position: absolute;
  font-weight: 500;
}

.btn-switchToggleProcessor {
  position: relative;
  display: block;
  width: 55px;
  height: 25px;
  cursor: pointer;
  background-color: #62a921;
  border: 2px solid #62a921;
  border-radius: 40px;
  margin-bottom: -11px;
}

.btn-switch-circleToggleProcessor {
  position: absolute;
  top: -1px;
  left: 0;
  display: block;
  height: 23px;
  width: 24px;
  background-color: #fff;
  border-radius: 40px;
}

.btn-switch--onToggleProcessor {
  background-color: #F27878;
  border: 2px solid #F27878;
}

.btn-switch-circle--onToggleProcessor {
  left: auto;
  right: 0;
}

.enableSwitch {
  font-size: large;
}

.spanSwitch {
  margin-left: 5px;
}

#ldMain .boxed .title {
  background: steelblue !important;
  color: white;
}

.ldMainTitle {
  width: 100% !important;
}

.ldProcessorTitle {
  width: 40% !important;
}

.ldNodeTitle {
  width: 80% !important;
}

.ldNodeTitle i strong {
  font-family: 'Inter', sans-serif !important;
}

.tag--warning-100 {
  height: 45px;
  border-radius: 4px;
  border: 1px solid var(--color-warning-200);
  background: var(--color-warning-100);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  color: var(--color-base-700);
  padding: 8px;
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
}

.tag--secondary-300 {
  height: 45px;
  border-radius: 4px;
  border: 1px solid var(--color-secondary-300);
  background: var(--color-base-200);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  color: var(--color-base-700);
  padding: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
}

#ldNodes .boxed .title {
  background: khaki !important;
  color: black;
}

.cascadingPanelHeading {
  background: steelblue !important;
  color: white !important;
  cursor: pointer;
  padding: 7px 10px !important;
}

.cascadingPanel {
  margin-bottom: 1px;
}

.cascadingPanelTitle {
  font-size: 13px !important;
  text-transform: uppercase !important;
}

.cascadingPanelTitle strong {
  padding-left: .8em !important;
}


.nodePanelHeading {
  background: khaki !important;
  color: black;
  cursor: pointer;
  padding: 7px 10px !important;
}

.nodePanel {
  margin-bottom: 1px;
}

.nodePanelTitle {
  font-size: 13px !important;
  text-transform: uppercase !important;
}

.nodePanelTitle strong {
  padding-left: .8em !important;
}

.processorPanelHeading {
  background: darkseagreen !important;
  color: black;
  cursor: pointer;
  padding: 7px 10px !important;
}

.processorPanel {
  margin-bottom: 1px;
  margin-left: 10px;
  margin-right: 10px;
}

.processorPanelTitle {
  font-size: 13px !important;
  text-transform: uppercase !important;
}

.processorPanelTitle strong {
  padding-left: .8em !important;
}

.accordionPanel {
  margin-bottom: 1px;
  margin-left: 10px;
  margin-right: 10px;
}

.accordionPanelHeading {
  color: black;
  cursor: pointer;
  padding: 8px 16px !important;
  border-bottom: 1px solid var(--color-base-300);
}

.accordionPanelHeadingItem {
  font-size: 16px;
  font-weight: 400;
  color: var(--color-base-700);
  margin-right: 24px;
}

.accordionPanelHeading .panel-title div div {
  display: inline-block;
}

.accordionPanelSelected {
  border-top: 2px solid var(--color-secondary-300);
  border-right: 2px solid var(--color-secondary-300);
  border-left: 2px solid var(--color-secondary-300);
  background: var(--color-secondary-100) !important;
  border-radius: 4px 4px 0 0;
}

.accordionPanelCollapse {
  padding: var(--spacing-4);
  border-radius: 0 0 4px 4px;
  border-right: 2px solid var(--color-secondary-300);
  border-bottom: 2px solid var(--color-secondary-300);
  border-left: 2px solid var(--color-secondary-300);
  background: var(--color-base-white);
}

.ldNodeOption {
  cursor: pointer;
}

.processorValue {
  width: 18%;
}

.processorOrder {
  width: 18%;
}

.processorGlobal {
  width: 18%;
}

.nodePanelTitle i {
  margin-left: .5em;
}

.nodeStatus {
  border-right: 1px solid var(--color-base-300);
  margin-right: 8px;
  padding-right: 8px;
}

#ldProcessors .boxed .title {
  background: darkseagreen !important;
  color: black;
}

.ldChart {
  font-size: 15em !important;
}

.slidecontainer {
  width: 100%; /* Width of the outside container */
}

/* The slider itself */
.slider {
  -webkit-appearance: none; /* Override default CSS styles */
  appearance: none;
  width: 100%; /* Full-width */
  height: 25px; /* Specified height */
  background: #d3d3d3; /* Grey background */
  outline: none; /* Remove outline */
  opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
  -webkit-transition: .2s; /* 0.2 seconds transition on hover */
  transition: opacity .2s;
}

/* Mouse-over effects */
.slider:hover {
  opacity: 1; /* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.slider::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background: #4CAF50; /* Green background */
  cursor: pointer; /* Cursor on hover */
}

.slider::-moz-range-thumb {
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background: #4CAF50; /* Green background */
  cursor: pointer; /* Cursor on hover */
}

.filterVIP {
  width: 50%;
}

.boxContentSetUp {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.42857143;
  word-wrap: break-word;
  background-color: inherit;
  border-radius: 4px;
  width: auto;
  color: inherit;
}

.cascadingLogs {
  margin-left: 15px;
  margin-right: 15px;
}

.wrapWhiteSpace {
  white-space: pre-line;
}

table.dates {
  border: 0;
  background-color: #FFF;
}


/** CUSTOMER INFO RIGHT PANEL UPDATE INFORMATION styles **/
.dgs-data-content {
  border: 1px solid transparent;
  background: transparent;
  display: initial;
}

.dgs-input-editable {
  border: 1px solid #ccc;
  background: #fff;
  min-width: 60px;
  padding: 0 5px;
}

textarea.dgs-data-content {
  width: 90%;
  resize: both;
}

#asideRight table tr td {
  font-size: 12px;
}

.btn-action-customer-info {
  background: transparent;
  border: none;
}

.btn-action-customer-info i {
  color: #1b5c2e;
}

#asideRight .btn-action-customer-info {
  float: right;
}

#asideRight .btn-action-customer-info i {
  color: #fff;
}

.dgs-div-notes-editable {
  background: #fff;
  border: 1px solid #ccc;
  cursor: text;
  width: 100%;
  min-height: 70px;
}

.dgs-top-line {
  border-top: 1px solid #ccc;
}

.error-required {
  right: 16px;
  font-size: 18px;
  margin-right: auto;
  float: right;
}

.error-required h5 {
  color: #707A8A;
  opacity: .7;
  margin-right: 7px;
}

.multiselect-container {
  position: absolute !important;
  padding: 8px;
}

.multiselect-container .dropdown-menu-border ul{
  border-bottom: 1px solid white;
  border-right: 1px solid white;
}

.multiselect-btn-border-radius-left-0 .input-group .multiselect-search{
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.default-scrollbar::-webkit-scrollbar,
.dropdown-menu::-webkit-scrollbar {
  width: 4px;
}

.default-scrollbar::-webkit-scrollbar-track,
.dropdown-menu::-webkit-scrollbar-track {
  background-color: var(--color-primary-100);
}

.default-scrollbar::-webkit-scrollbar-thumb,
.dropdown-menu::-webkit-scrollbar-thumb {
  padding-right: 20px;
  background-color: var(--color-primary-300);
  border-radius: 10px;
}

.dropdown-menu>li>a:hover{
  color: var(--color-base-700);
  background-color: var(--color-primary-100);
}

.risk-high {
  background-color: red;
  width: 60px;
  text-align: center;
  border-radius: 20px;
}

.risk-medium {
  background-color: yellow;
  width: 60px;
  text-align: center;
  border-radius: 20px;
}

.risk-low {
  background-color: greenyellow;
  width: 60px;
  text-align: center;
  border-radius: 20px;
}

#block_container {
  display: flex;
}

.status-clear {
  background-color: green;
  color: white;
  font-weight: bold;
  border-radius: 20%;
  text-align: center
}

.def-fieldset {
  display: block;
  margin-inline-start: 2px;
  margin-inline-end: 2px;
  padding-block-start: 0;
  padding-inline-start: 0.75em;
  padding-inline-end: 0.75em;
  padding-block-end: 0.625em;
  min-inline-size: min-content;
  border-width: 2px;
  border-style: groove;
  border-color: rgb(192, 192, 192);
  border-image: initial;
}

legend {
  width: auto;
  border-bottom: none;
}

.label-left {
  display: block;
  float: left;
  font-weight: normal;
}

.textarea-full {
  width: 100%;
  resize: none;
}

.h5-400 {
  font-weight: 400;
}

.input-default {
  height: 45px;
  border-radius: 4px;
}

.bg-none {
  background: none !important;
}

/* Variables */
:root {
  --color-primary-100: #F7FDF2;
  --color-primary-200: #D5F4BD;
  --color-primary-300: #91DD50;
  --color-primary-400: #5EA620;
  --color-primary-600: #274B0C;
  --color-primary-700: #467C18;
  --color-primary-800: #6EA343;
  --color-error-100: #FFE5E5;
  --color-error-200: #FF7070;
  --color-error-300: #FF3333;
  --color-error-400: #E91C1C;
  --color-error-500: #CD0000;
  --color-secondary-100: #F1F9F8;
  --color-secondary-200: #D5ECEA;
  --color-secondary-300: #90CBC7;
  --color-secondary-400: #4EA7A0;
  --color-secondary-500: #3E847F;
  --color-secondary-600: #204744;
  --color-success-300: #6EA343;
  --color-informative-400: #2298DB;
  --color-informative-500: #117DBB;
  --color-base-white: #FFF;
  --color-base-100: #FCFCFC;
  --color-base-200: #F5F5F5;
  --color-base-300: #EBEBEB;
  --color-base-400: #B6B6B6;
  --color-base-400-opacity-7: #b6b6b6b3;
  --color-base-500: #636363;
  --color-base-600: #3E3E3E;
  --color-base-700: #2B2B2B;
  --color-700: #303030;
  --color-warning-200: #F4A551;
  --color-warning-100: #FFF6ED;
  --color-warning-300: #F9AF10;
  --color-warning-400: #CF7500;
  --color-warning-500: #9E4D00;
  --color-warning-600: #F9CE10;
  --spacing-1: 4px;
  --spacing-2: 8px;
  --spacing-3: 16px;
  --spacing-4: 24px;
  --spacing-5: 48px;
}

/* Text sizes */
.text--size-14 {
  font-size: 14px !important;
}

.text--size-16 {
  font-size: 16px !important;
}

.text--size-18 {
  font-size: 18px !important;
}

.text--size-20 {
  font-size: 20px !important;
}

.text--size-22 {
  font-size: 22px !important;
}

.text--size-24 {
  font-size: 24px !important;
}

.text--size-30 {
  font-size: 30px !important;
}

/* Text colors */
.text {
  font-family: 'Inter', sans-serif !important;
}

.text--primary-300 {
  color: var(--color-primary-300) !important;
}

.text--primary-400 {
  color: var(--color-primary-400) !important;
}

.text--primary-700 {
  color: var(--color-primary-700) !important;
}

.text--secondary-400 {
  color: var(--color-secondary-400) !important;
}

.text--secondary-500 {
  color: var(--color-secondary-500) !important;
}

.text--error-400 {
  color: var(--color-error-400) !important;
}

.text--error-500 {
  color: var(--color-error-500) !important;
}

.text--base-100 {
  color: var(--color-base-100) !important;
}

.text--base-300 {
  color: var(--color-base-300) !important;
}

.text--base-400 {
  color: var(--color-base-400) !important;
}

.text--base-500 {
  color: var(--color-base-500) !important;
}

.text--base-600 {
  color: var(--color-base-600) !important;
}

.text--base-700 {
  color: var(--color-base-700) !important;
}

.text--700 {
  color: var(--color-700) !important;
}

/* Text weights */
.text--warning-200 {
  color: var(--color-warning-200) !important;
}

.text--weight-400 {
  font-weight: 400 !important;
}

.text--warning-400 {
  color: var(--color-warning-400) !important;
}

.text--warning-500 {
  color: var(--color-warning-500) !important;
}

.text--weight-500 {
  font-weight: 500;
}

.text--weight-600 {
  font-weight: 600;
}

.text--weight-700 {
  font-weight: 700;
}

.text--spacing-5 {
  letter-spacing: 5px !important;
}

.text--spacing-3 {
  letter-spacing: 3px !important;
}

.text--spacing {
  letter-spacing: 0.25em; 
}

/*Text line-height modifiers*/

.text--line-height-normal {
  line-height: normal;
}

/*New table design */
.table-form {
  overflow-x: scroll;
  white-space: nowrap;
  font-size: 16px !important;
  font-family: 'Inter', sans-serif !important;
}

.table-form thead {
  color: var(--color-base-600);
  background: var(--color-base-200);
  border: 0 !important;
}

.table-form thead > tr > th:not(.excluded) {
  padding: var(--spacing-3);
  color: var(--color-base-600);
  background: var(--color-base-200);
  text-align: center;
  border: 1px solid var(--color-secondary-300) !important;
}

.table-form thead > tr > th > div {
  max-height: 19px;
  min-height: 19px;
  display: flex;
  align-items: center;
}

.table-form tr:not(.select) td {
  align-content: center;
  text-align: left;
  border-top: 1px solid var(--color-base-300);
  border-left: 1px solid var(--color-base-300);
  border-right: 1px solid var(--color-base-300);
  padding: var(--spacing-3) !important;
}

.table-form.spacing-2 tr:not(.select) td {
  padding: var(--spacing-2) !important;
}

.table-form tr:not(.select) td.no-padding-y {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.table-form tr:not(.select) td.no-padding-x {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.table-form__th--width-0 {
  width :0 !important;
}

.table-form__th--text-left thead > tr > th:not(.excluded),
.table-form--text-left tr td:not(.excluded) {
  text-align: left !important;
}

.table-form__th--text-left thead > tr > th:last-child:not(.excluded),
.table-form--text-left tr td:last-child:not(.excluded){
  text-align: left !important;
}

.table-form-left thead > tr > th:last-child,
.table-form-left tr td:last-child{
  text-align: left !important;
}

.new-wrap-table {
  overflow-x: scroll;
}

.new-wrap-table::-webkit-scrollbar {
  height: 4px;
}

.new-wrap-table::-webkit-scrollbar-track {
  background: var(--color-primary-100);
}

.new-wrap-table::-webkit-scrollbar-thumb {
  background-color: var(--color-primary-300);
  border-radius: 4px;
}

.table-form tr.select{
  border: 1px solid var(--color-secondary-400) !important;
}

.table-form tr.select td{
  background: var(--color-secondary-100);
  border-top: 1px solid var(--color-secondary-400) !important;
  border-bottom: 1px solid var(--color-secondary-400) !important;
  text-align: center;
  align-content: center;
  padding: var(--spacing-3);
}

.table-form tr:nth-child(odd)  {
  vertical-align: middle!important;
  background: var(--color-base-100);
}

.table-form tr:nth-child(even) {
  vertical-align: middle!important;
  background: var(--color-base-200);
}

/* List Form */

.list-form li {
  display: flex;
  padding: var(--spacing-3);
  align-items: center;
  flex: 1 0 0;
  border-bottom: 1px solid var(--color-base-300);
  background: var(--color-base-100);
}

/* Background colors */
.background--base-white {
  background: var(--color-base-white);
}

.background--base-100 {
  background: var(--color-base-100);
}

.background--base-200 {
  background: var(--color-base-200);
}

.background--base-300 {
  background: var(--color-base-300);
}

.background--base-400 {
  background: var(--color-base-400);
}

.background--primary-100 {
  background: var(--color-primary-100);
}

.background--primary-400 {
  background: var(--color-primary-400);
}

.background--secondary-100 {
  background: var(--color-secondary-100);
}

.background--secondary-200 {
  background: var(--color-secondary-200);
}

.background--secondary-300 {
  background: var(--color-secondary-300);
}

.background--secondary-400 {
  background: var(--color-secondary-400) !important;
}

.background--warning-100 {
  background: var(--color-warning-100);
}

.background--warning-200 {
  background: var(--color-warning-200);
}

.background--warning-400 {
  background: var(--color-warning-400);
}

.background--transparent {
  background: transparent;
}

.table-background--secondary-100 {
  background: var(--color-secondary-100) !important;
  border-top: 1px solid var(--color-secondary-400) !important;
  border-bottom: 1px solid var(--color-secondary-400) !important;
}

/* Borders */
.border--primary-400 {
  border: 1px solid var(--color-primary-400);
}

.border--secondary-200 {
  border: 1px solid var(--color-secondary-200);
}

.border--secondary-300 {
  border: 1px solid var(--color-secondary-300);
}

.border--secondary-400 {
  border: 1px solid var(--color-secondary-400);
}

.border--base-200 {
  border: 1px solid var(--color-base-200);
}

.border--base-300 {
  border: 1px solid var(--color-base-300) !important;
}

.border--base-600 {
  border: 1px solid var(--color-base-600);
}

.border-error-500 {
  border: 1px solid var(--color-error-500) !important;
}

.border-warning-200 {
  border: 1px solid var(--color-warning-200);
}

.border-warning-300 {
  border: 1px solid var(--color-warning-300);
}

.border-warning-500 {
  border: 1px solid var(--color-warning-500);
}

.border-warning-400 {
  border: 1px solid var(--color-warning-400);
}

.border-success-300 {
  border: 1px solid var(--color-success-300);
}

.border-informative-400 {
  border: 1px solid var(--color-informative-400);
}

.border-informative-500 {
  border: 1px solid var(--color-informative-500);
}

.border-bottom-base-300 {
  border-bottom: 1px solid var(--color-base-300);
}

.border-radius-4 {
  border-radius: 4px;
}

.border-radius-8 {
  border-radius: 8px;
}

.border--base-400 {
  border: 1px solid var(--color-base-400)
}


/* spacing */
.spacing--margin-right-2 {
  margin-right: var(--spacing-2);
}

.spacing--margin-right-3 {
  margin-right: var(--spacing-3);
}

.spacing--margin-right-4 {
  margin-right: var(--spacing-4);
}

.spacing--margin-right-5 {
  margin-right: var(--spacing-5);
}

.spacing--margin-left-2 {
  margin-left: var(--spacing-2);
}

.spacing--margin-bottom-1-em {
  margin-bottom: 1em;
}

.spacing--margin-bottom-2 {
  margin-bottom: var(--spacing-2);
}

.spacing--margin-bottom-3 {
  margin-bottom: var(--spacing-3);
}

.spacing--margin-bottom-5 {
  margin-bottom: var(--spacing-5);
}

.spacing--margin-top-5 {
  margin-top: var(--spacing-5);
}

.spacing--margin-top-3 {
  margin-top: var(--spacing-3);
}

.spacing--margin-top-2 {
  margin-top: var(--spacing-2);
}

.spacing--margin-top-4 {
  margin-top: var(--spacing-4);
}

.spacing--padding-2 {
  padding: var(--spacing-2);
}

.spacing--padding-3 {
  padding: var(--spacing-3) !important;
}

.spacing--padding-x-2 {
  padding-left: var(--spacing-2);
  padding-right: var(--spacing-2);
}

.spacing--padding-bottom-3 {
  padding-bottom: var(--spacing-3);
}

.spacing--padding-bottom-4 {
  padding-bottom: var(--spacing-4) !important;
}

/* Containers */
.form-container {
  max-width: 500px;
  font-family: 'Inter', sans-serif;
}

.modal-container {
  max-width: 550px;
  font-family: 'Inter', sans-serif;
}

.message-container {
  border-bottom: 1px solid var(--color-base-300);
  background: var(--color-base-white);
  display: flex;
  padding: var(--spacing-2) var(--spacing-3);
  align-self: stretch;
}

/* Inputs */
.multiselect-input .input-group  .multiselect-search,
.input-form {
  height: 45px;
  font-size: 16px;
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 4px;
  color: var(--color-base-500);
  font-family: 'Inter', sans-serif;
  border: 1px solid var(--color-base-300);
  transition: all 0.5s ease;
  text-overflow: ellipsis;
  overflow: hidden;
}

.multiselect-input .input-group  .multiselect-search:hover,
.input-form:hover {
  color: var(--color-base-600);
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-300);
}

.multiselect-input .input-group  .multiselect-search:focus,
.input-form:focus {
  color: var(--color-base-700);
  background: white;
  border: 1px solid var(--color-primary-400);
  outline: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.multiselect-input .input-group {
  margin-bottom: 24px;
}

.input-form.ng-invalid.ng-pristine:not(.input-form--error) {
  border: 1px solid var(--color-base-300);
  color: var(--color-base-500);
  background: #fff;
}

.input-form.input-form--error,
.input-form.input-form--error:hover,
.input-form.input-form--error:focus {
  border: 1px solid var(--color-error-500) !important;
  color: var(--color-base-700);
  background: #fff;
  outline: none;
}

.input-form:disabled .select-form:disabled {
  color: var(--color-base-300);
  background: var(--color-base-200);
  border: 1px solid var(--color-base-300);
}

.select-form {
  height: 45px;
  font-size: 16px;
  background: white;
  border-radius: 4px;
  color: var(--color-base-600);
  border: 1px solid var(--color-base-300);
  padding-left: 8px;
  padding-right: 8px;
}

.select-form::placeholder .input-form::placeholder {
  color: var(--color-base-500);
}

.select-form:hover {
  color: var(--color-base-700);
  border: 1px solid var(--color-primary-400);
}

.select-form:focus {
  outline: none;
  color: var(--color-base-700);
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-300);
}

.select-form option {
  background: white;
  font-family: 'Inter', sans-serif !important;
  color: var(--color-base-600)
}

.input-no-border.editing,
.input-no-border.editing input {
  background: var(--color-primary-100);
  color: var(--color-primary-600);
}

.input-no-border.viewing:focus-within p {
  color: var(--color-primary-600);
  background: transparent;
}

.input-no-border p,
.input-no-border input {
  border: none;
  outline: none;
  background: transparent;
}

.input-no-border p:focus
.input-no-border input:focus {
  background: var(--color-primary-100);
}

.select-filter {
  position: relative;
  display: inline-block;
}

.select-filter select {
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: 1px solid var(--color-base-300);
}

.select-filter .fa-mid-chevron-down {
  position: absolute;
  right: 9px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.input-number-no-spins::-webkit-inner-spin-button,
.input-number-no-spins::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Buttons */
.btn-form {
  font-size: 16px;
  font-weight: 700;
  min-height: 45px;
  border-radius: 4px;
  color: var(--color-base-700);
  font-family: 'Inter', sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
}

.btn-form-icon {
  background: none;
  border: none;
  padding: 0;
}

.btn-form--h-36 {
  min-height: 36px;
}

.btn-form:disabled {
  border: 1px solid var(--color-base-300);
  background: var(--color-base-200);
  color: var(--color-base-500)
}

.btn-form--primary {
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-300);
}

.btn-form--primary:hover {
  border: 1px solid var(--color-primary-400);
}

.btn-form--primary:focus {
  background: var(--color-primary-200);
  border: 1px solid var(--color-primary-400);
}

.btn-form--primary:disabled {
  border: 1px solid var(--color-base-400) !important;
  background: var(--color-base-200) !important;
  color: var(--color-base-500) !important;
  cursor: not-allowed !important;
  pointer-events: none;
}

.btn-form--disabled {
  border: 1px solid var(--color-base-400) !important;
  background: var(--color-base-200) !important;
  color: var(--color-base-500) !important;
}

/* checkbox */
.checkbox-btn {
  display: flex;
  width: 150px;
  height: 45px;
  min-height: 45px;
  max-height: 45px;
  padding: 8px;
  justify-content: space-between;
  align-items: center;

  border-radius: 4px;
  border: 1px solid var(--color-base-300);
  background: var(--color-base-100);

  cursor: pointer;
  user-select: none;
}

.checkbox-btn input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.checkbox-btn__label {
  font-weight: 700;
  font-size: 16px;
}

.checkbox-btn--primary:has(input:checked) {
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-400);
}

.checkbox-btn__icon {
  width: 16px;
  height: 16px;
  border-radius: 3px;
  border: 1px solid var(--color-base-400);
  background: transparent;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.checkbox-btn--primary:has(input:checked) .checkbox-btn__icon::after {
  content: '';
  position: absolute;
  width: 4px;
  height: 8px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  top: 2px;
}

.checkbox-btn--primary:has(input:checked) .checkbox-btn__icon {
  background: var(--color-primary-400);
  border-color: var(--color-primary-400);
}

.checkbox-btn:has(input:disabled) {
  border: 1px solid var(--color-base-400);
  background: var(--color-base-200);
  color: var(--color-base-500);
  cursor: not-allowed;
  pointer-events: none;
}

.checkbox-btn--primary:hover {
  border: 1px solid var(--color-base-600) !important;
  background-color:var(--color-base-100);
}

.checkbox-btn--primary:hover .checkbox-btn__icon {
  border: 1px solid var(--color-base-600) !important;
}

/* radio button */
.radio-btn {
  display: flex;
  width: 150px;
  height: 45px;
  min-height: 45px;
  max-height: 45px;
  padding: 8px;
  justify-content: space-between;
  align-items: center;

  border-radius: 4px;
  border: 1px solid var(--color-base-300);
  background: var(--color-base-100);

  cursor: pointer;
  user-select: none;
}

.radio-btn input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.radio-btn__label {
  font-weight: 700;
  font-size: 16px;
}

.radio-btn--primary:has(input:checked) {
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-400);
}

.radio-btn__icon {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1px solid var(--color-base-400);
  background: transparent;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.radio-btn--primary:has(input:checked) .radio-btn__icon::after {
  content: '';
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-primary-400);
}

.radio-btn--primary:has(input:checked) .radio-btn__icon {
  border-color: var(--color-primary-400);
}

.radio-btn:has(input:disabled) {
  border: 1px solid var(--color-base-400);
  background: var(--color-base-200);
  color: var(--color-base-500);
  cursor: not-allowed;
  pointer-events: none;
}

.radio-btn--primary:hover {
  border: 1px solid var(--color-base-600) !important;
  background-color:var(--color-base-100);
}

.radio-btn--primary:hover .radio-btn__icon{
  border: 1px solid var(--color-base-600) !important;
}

.not-clickeable {
  cursor: not-allowed;
  pointer-events: none;
}

.btn-form--secondary {
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-400);
}

.btn-form--secondary:hover {
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-600);
}

.btn-form--secondary:focus {
  background: var(--color-secondary-200);
  border: 1px solid var(--color-secondary-400);
}

.btn-group--secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 45px;
  color: var(--color-base-500);
  background: var(--color-base-200);
  border: 1px solid var(--color-base-400);
  width: 50%;
}

.btn-group--secondary:hover {
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-600) !important;
}

.btn-group--secondary:focus {
  outline: 0 !important;
  outline-offset: 0;
}

.btn-group--secondary.selected,
.btn-group--secondary.active {
  color: var(--color-base-700);
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-400);
  box-shadow: none;
}

.btn-form--error {
  background: var(--color-error-100);
  border: 1px solid var(--color-error-200);
}

.btn-form--error:hover {
  background: var(--color-error-100);
  border: 1px solid var(--color-error-500);
}

.btn-form--error:focus {
  background: var(--color-error-200);
  border: 1px solid var(--color-error-500);
}

.btn-column {
  min-height: 36px;
  border-radius: 4px;
  font-weight: 500;
  color: var(--color-base-700);
  font-family: 'Inter', sans-serif;
  background: var(--color-base-200);
  border: 1px solid var(--color-secondary-300);
  border-bottom: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
}

.btn-column:hover {
  background: var(--color-base-300);
}

.btn-column:focus {
  background: var(--color-secondary-100);
}

.btn-action-word {
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-200);
  color: var(--color-secondary-500);
}

.btn-action-word:hover {
  border: 1px solid var(--color-secondary-500);
}

.btn-column--large {
  min-height: 50px;
  min-width: 117px;
}

/* Checkbox */
.checkbox-form {
  width: 18px;
  height: 18px;
  gap: 8px;
  border: 2px solid var(--color-primary-600) !important;
}

.checkbox-form:hover {
  accent-color: var(--color-primary-600);
  border: 2px solid var(--color-primary-600) !important;
}

.checkbox-form:checked {
  border: 2px solid var(--color-primary-400) !important;
  accent-color: var(--color-primary-400);
}

/**********************x***********
 ********** Bootstrap ************
 *********************************/
.m-0 {
  margin: 0rem !important;
}

.m-1 {
  margin: 0.25rem !important;
}

.m-2 {
  margin: 0.5rem !important;
}

.m-3 {
  margin: 1rem !important;
}

.m-4 {
  margin: 1.5rem !important;
}

.m-5 {
  margin: 3rem !important;
}

.mt-0 {
  margin-top: 0rem !important;
}

.mt-1 {
  margin-top: 0.25rem !important;
}

.mt-2 {
  margin-top: 0.5rem !important;
}

.mt-3 {
  margin-top: 1rem !important;
}

.mt-4 {
  margin-top: 1.5rem !important;
}

.mt-5 {
  margin-top: 3rem !important;
}

.mb-0 {
  margin-bottom: 0rem !important;
}

.mb-1 {
  margin-bottom: 0.25rem !important;
}

.mb-2 {
  margin-bottom: 0.5rem !important;
}

.mb-3 {
  margin-bottom: 1rem !important;
}

.mb-4 {
  margin-bottom: 1.5rem !important;
}

.mb-5 {
  margin-bottom: 3rem !important;
}

.ml-0 {
  margin-left: 0rem !important;
}

.ml-1 {
  margin-left: 0.25rem !important;
}

.ml-2 {
  margin-left: 0.5rem !important;
}

.ml-3 {
  margin-left: 1rem !important;
}

.ml-4 {
  margin-left: 1.5rem !important;
}

.ml-5 {
  margin-left: 3rem !important;
}

.ml-auto {
  margin-left: auto !important;
}

.mr-0 {
  margin-right: 0rem !important;
}

.mr-1 {
  margin-right: 0.25rem !important;
}

.mr-2 {
  margin-right: 0.5rem !important;
}

.mr-3 {
  margin-right: 1rem !important;
}

.mr-4 {
  margin-right: 1.5rem !important;
}

.mr-5 {
  margin-right: 3rem !important;
}

.p-0 {
  padding: 0rem !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

.pt-0 {
  padding-top: 0rem !important;
}

.pt-1 {
  padding-top: 0.25rem !important;
}

.pt-2 {
  padding-top: 0.5rem !important;
}

.pt-3 {
  padding-top: 1rem !important;
}

.pt-4 {
  padding-top: 1.5rem !important;
}

.pt-5 {
  padding-top: 3rem !important;
}

.pb-0 {
  padding-bottom: 0rem !important;
}

.pb-1 {
  padding-bottom: 0.25rem !important;
}

.pb-2 {
  padding-bottom: 0.5rem !important;
}

.pb-3 {
  padding-bottom: 1rem !important;
}

.pb-4 {
  padding-bottom: 1.5rem !important;
}

.pb-5 {
  padding-bottom: 3rem !important;
}

.pl-0 {
  padding-left: 0rem !important;
}

.pl-1 {
  padding-left: 0.25rem !important;
}

.pl-2 {
  padding-left: 0.5rem !important;
}

.pl-3 {
  padding-left: 1rem !important;
}

.pl-4 {
  padding-left: 1.5rem !important;
}

.pl-5 {
  padding-left: 3rem !important;
}

.pr-0 {
  padding-right: 0rem !important;
}

.pr-1 {
  padding-right: 0.25rem !important;
}

.pr-2 {
  padding-right: 0.5rem !important;
}

.pr-3 {
  padding-right: 1rem !important;
}

.pr-4 {
  padding-right: 1.5rem !important;
}

.pr-5 {
  padding-right: 3rem !important;
}

.my-0 {
  margin-top: 0rem !important;
  margin-bottom: 0rem !important;
}

.my-1 {
  margin-top: 0.25rem !important;
  margin-bottom: 0.25rem !important;
}

.my-2 {
  margin-top: 0.5rem !important;
  margin-bottom: 0.5rem !important;
}

.my-3 {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
}

.my-4 {
  margin-top: 1.5rem !important;
  margin-bottom: 1.5rem !important;
}

.my-5 {
  margin-top: 3rem !important;
  margin-bottom: 3rem !important;
}

.mx-0 {
  margin-left: 0rem !important;
  margin-right: 0rem !important;
}

.mx-1 {
  margin-left: 0.25rem !important;
  margin-right: 0.25rem !important;
}

.mx-2 {
  margin-left: 0.5rem !important;
  margin-right: 0.5rem !important;
}

.mx-3 {
  margin-left: 1rem !important;
  margin-right: 1rem !important;
}

.mx-4 {
  margin-left: 1.5rem !important;
  margin-right: 1.5rem !important;
}

.mx-5 {
  margin-left: 3rem !important;
  margin-right: 3rem !important;
}

.py-0 {
  padding-top: 0rem !important;
  padding-bottom: 0rem !important;
}

.py-1 {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}

.py-2 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.py-3 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.py-4 {
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
}

.py-5 {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}

.px-0 {
  padding-left: 0rem !important;
  padding-right: 0rem !important;
}

.px-1 {
  padding-left: 0.25rem !important;
  padding-right: 0.25rem !important;
}

.px-2 {
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

.px-3 {
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}

.px-4 {
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

.px-5 {
  padding-left: 3rem !important;
  padding-right: 3rem !important;
}

.border-0 {
  border: 0 !important;
}

.border-3 {
  border-width: 3px !important;
}

.border-top-0 {
  border-top: 0 !important;
}

.border-right-0 {
  border-right: 0 !important;
}

.border-bottom-0 {
  border-bottom: 0 !important;
}

.border-left-0 {
  border-left: 0 !important;
}

.border-x-0 {
  border-right: 0 !important;
  border-left: 0 !important;
}

.border-bottom-1 {
  border-bottom: 1px !important;
}

.border-top-1 {
  border-top: 1px;
}

.border-top-left-radius {
  border-top-left-radius: 4px
}

.border-top-right-radius {
  border-top-right-radius: 4px
}

.border-bottom-right-radius {
  border-bottom-right-radius: 4px
}

.border-radius-left-0 {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.border-radius-right-0 {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.d-inline-block {
  display: -ms-flexbox !important;
  display: inline-block !important;
}

.pos-relative {
  position: relative;
}

.d-flex {
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-flex-bottom {
  display: flex;
  align-items: flex-end;
}

.d-flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.d-flex-end {
  display: flex;
  justify-content: flex-end;
}

.d-flex-wrap {
  flex-wrap: wrap;
}

.d-flex-reverse {
  flex-direction: row-reverse;
}

.d-flex-column {
  flex-direction: column;
}

.justify-content-between {
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
}

.justify-content-evenly {
  -ms-flex-pack: justify !important;
  justify-content: space-evenly !important;
}

.justify-content-center {
  -ms-flex-pack: center !important;
  justify-content: center !important;
}

.justify-content-start {
  -ms-flex-pack: start !important;
  justify-content: start !important;
}

.justify-content-end {
  -ms-flex-pack: end !important;
  justify-content: end !important;
}

.justify-content-left {
  justify-content: left !important;
}

.justify-content-right {
  justify-content: right !important;
}

.align-items-start {
  -ms-flex-align: start !important;
  align-items: flex-start !important;
}

.align-vertical {
  vertical-align: middle !important; 
}

.line-height-vertical {
  line-height: 1;
}

.align-items-end {
  -ms-flex-align: end !important;
  align-items: end !important;
}

.align-items-center {
  -ms-flex-align: center !important;
  align-items: center !important;
}

.align-content-center {
   align-content: center;
 }

.align-content-end {
  align-content: end;
}

.justify-item-center {
  justify-items: center;
}

.d-flex-1 {
  flex: 1;
}

.gap--spacing-1 {
  gap: var(--spacing-1);
}

.gap--spacing-2 {
  gap: var(--spacing-2);
}

.gap--spacing-3 {
  gap: var(--spacing-3);
}

.gap--spacing-4 {
  gap: var(--spacing-4);
}

.w-auto {
  width: auto !important;
}

.w-15 {
  width: 15% !important;
}

.w-20 {
  width: 20% !important;
}

.w-24 {
  width: 24% !important;
}

.w-25 {
  width: 25% !important;
}

.w-33 {
  width: 33% !important;
}

.w-50 {
  width: 50% !important;
}

.w-75 {
  width: 75% !important;
}

.w-80 {
  width: 80% !important;
}

.w-100 {
  width: 100% !important;
}

.h-45 {
  height: 100% !important;
}

.h-100 {
  height: 100% !important;
}

.h-auto {
  height: auto;
}

.h-45px {
  height: 45px !important;
}

.h-50 {
  max-height: 50px;
  min-height: 50px;
}

.h-56px {
  height: 56px;
}

.h-82px {
  height: 82px;
}

.min-h-30px {
  min-height: 30px;
}

.w-40px {
  max-width: 40px;
  min-width: 40px;
}

.w-45px {
  max-width: 45px;
  min-width: 45px;
}

.w-51px {
  max-width: 51px;
  min-width: 51px;
}

.w-54px {
  max-width: 54px;
  min-width: 54px;
}

.w-55px {
  max-width: 55px;
  min-width: 55px;
}

.w-75px {
  max-width: 75px;
  min-width: 75px;
}

.w-78px {
  max-width: 78px;
  min-width: 78px;
}

.w-85px {
  max-width: 85px;
  min-width: 85px;
}

.w-88px {
  max-width: 88px;
  min-width: 88px;
}

.w-112px {
  max-width: 112px;
}

.w-134px {
  max-width: 135px;
  min-width: 134px;
}

.w-150px {
  width: 150px !important;
}

.w-154px {
  max-width: 154px;
  min-width: 154px;
}

.w-161px {
  max-width: 161px;
  min-width: 161px;
}

.w-166px {
  max-width: 166px;
  min-width: 166px
}

.w-168px {
  width: 168px;
}

.w-175px {
  max-width: 175px;
  min-width: 175px;
}

.w-177px {
  width: 177px;
}

.w-240px {
  width: 240px;
}

.w-183px {
  max-width: 183px;
  min-width: 183px
}

.w-min-190px {
  min-width: 190px
}

.w-200px {
  max-width: 200px;
  min-width: 200px;
}

.w-204px {
  max-width: 204px;
  min-width: 204px;
}

.w-237px {
  max-width: 237px;
  min-width: 237px;
}

.w-254px {
  max-width: 254px;
  min-width: 254px;
}

.w-255px {
  max-width: 255px;
  min-width: 255px;
}

.w-280px {
  max-width: 280px;
  min-width: 280px;
}

.w-300px {
  width: 300px;
}

.w-305px {
  width: 305px;
}

.w-340px {
  max-width: 340px;
  min-width: 340px;
}

.w-374px {
  max-width: 374px;
  min-width: 374px;
}

.w-337px {
  max-width: 337px;
  min-width: 337px;
}

.w-354px {
  max-width: 354px;
  min-width: 354px;
}

.w-390px {
  max-width: 390px;
  min-width: 390px
}

.w-570px {
  max-width: 570px;
  min-width: 570px
}

.mt-27-px {
  margin-top: 27px;
}

/************************************
 ********** End Bootstrap ***********
 ************************************/

/* MIDAS BACKEND NEW DESIGN */

/* Navigation Customers */

.nav-bar {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.nav-bar li {
  padding-bottom: 4px;
}

.nav-bar li a {
  color: var(--color-base-400);
  text-transform: uppercase;
  font-size: 14px;
  transition: font-weight 0.6s ease-in;
}

.nav-bar li a::after {
  content: "|";
  margin: 0 10px;
  color: #B6B6B6;
}

.nav-bar li:last-child a::after {
  content: none;
}

.nav-bar li a:hover {
  color: var(--color-primary-400);
}

.nav-bar li a.selected {
  color: var(--color-primary-400);
  font-weight: bold;
}

/* Forms Personal/Address Information */

.form-column {
  width: 35%;
  margin-right: 4%;
  margin-left: 1%;
  margin-bottom: 48px;
}

.form-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--color-base-300);
  padding-bottom: 16px;
  margin-bottom: 37px;
}

.form-header button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  margin-left: 10px;
  font-size: 16px;
}

.form-section {
  list-style: none;
}

.form-section li {
  margin-bottom: 16px;
}

.form-section label {
  display: block;
  font-weight: bold;
  margin-bottom: 5px;
  font-size: 16px;
}

.phone-group {
  display: flex;
}

.phone-group input[type="text"] {
  margin-right: 10px;
}

#customerPhoneCode {
  width: 15%;
}

.phone-group input[type="text"]:last-child {
  margin-right: 0;
}

.form-section input[type="text"],
.form-section select,
.form-section section,
.form-section .form-section__input-number {
  width: 100%;
  padding: 8px;
  border: 1px solid var(--color-base-300) !important;
  border-radius: 4px;
  box-sizing: border-box;
  transition: background-color 0.5s ease, border 0.5s ease;
}

.form-section select {
  scrollbar-width: thin;
  scrollbar-color: var(--color-primary-300) #f1f1f1;
}

.form-section select::-webkit-scrollbar {
  width: 12px;
}

.form-section select::-webkit-scrollbar-track {
  background: var(--color-primary-100);
}

.form-section select::-webkit-scrollbar-thumb {
  background-color: var(--color-primary-300);
  border-radius: 10px;
  border: 2px solid #f1f1f1;
}

.form-section select option {
  border-bottom: 1px solid var(--color-base-300);
  background-color: #FFFFFF;
  color: var(--color-base-600);
  padding: 10px;
}

.phone-group input[type="text"]:disabled,
.form-section input[type="text"]:disabled,
.section-disabled, .dob-section,
.form-section .form-section__input-number:disabled{
  background-color: var(--color-base-200);
  color: var(--color-base-400);
  cursor: not-allowed;
  border: 1px solid var(--color-base-400);
}

.phone-group input[type="text"]:not(:disabled):hover,
.form-section input[type="text"]:not(:disabled):hover,
.form-section .form-section__input-number:not(:disabled):hover {
  border: 1px solid var(--color-primary-300) !important;
  background-color: var(--color-primary-100);
}

.phone-group input[type="text"]:not(:disabled):focus,
.form-section input[type="text"]:not(:disabled):focus,
.form-section .form-section__input-number:not(:disabled):focus {
  outline: none;
  border: 1px solid var(--color-primary-400) !important;
  background-color: #FFFFFF;
}

.phone-group input[type="text"].input-filled:not(:disabled),
.form-section input[type="text"].input-filled:not(:disabled),
.form-section select.input-filled:not(:disabled),
.form-section .form-section__input-number.input-filled:not(:disabled) {
  border: 1px solid var(--color-base-600);
}

.form-section select:not(:disabled):hover {
  border: 1px solid var(--color-primary-400);
}

.form-section select:not(:disabled):focus, .form-section select:not(:disabled):active {
  outline: none;
  border: 1px solid var(--color-primary-300);
  background-color: var(--color-primary-100);
}

.form-section__input-number::-webkit-outer-spin-button,
.form-section__input-number::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.form-section__input-number {
  -moz-appearance: textfield;
}

.form-section input:not(:disabled):not(:placeholder-shown),
.form-section .form-section__input-number:not(:disabled):not(:placeholder-shown) {
  border: 1px solid var(--color-base-400) !important;
}

.form-section select.input-filled:not(:disabled) {
  border: 1px solid var(--color-base-400) !important;
}

/* Buttons Verification, Required Documents, Security Information and Other Information */

.item-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 5px;
  border-bottom: 1px solid var(--color-base-300);
  height: 51px;
  font-size: 16px;
}

.unsent-message {
  display: flex;
  height: 36px;
  padding: 8px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 4px;
  border: 1px solid var(--color-warning-200);
  background: var(--color-warning-100);
}

.item-label {
  font-weight: bold;
}

.border-bottom-dashed {
  border-bottom: 1px dashed var(--color-secondary-400) !important;
}

.separator-left {
  padding-left: 8px;
  margin-left: 16px;
  border-left: 1px solid var(--color-base-300);
}

.switch-container {
  display: flex;
  align-items: center;
}

.status-text {
  margin-right: 10px;
  font-weight: 700;
  color: var(--color-base-700);
  text-transform: capitalize;
}

.switch {
  width: 39px;
  height: 18px;
  border: 0;
  border-radius: 20px;
  position: relative;
  transition: background-color 0.5s ease;
}

.switch-on {
  background-color: var(--color-primary-400);
}

.switch-on:hover {
  background-color: var(--color-primary-600);
}

.switch-off {
  background-color: var(--color-base-400);
}

.switch-off:hover {
  background-color: var(--color-base-500);
}

.switch::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 2px;
  width: 16px;
  height: 15px;
  border-radius: 50%;
  background-color: white;
  transform: translateY(-50%);
  transition: left 0.3s;
}

.switch-on::before {
  left: 21px;
}

.switch:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/*Security Information*/

.input-container {
  position: relative;
  display: flex;
  align-items: center;
}

.input-container input,
.input-container section {
  width: 100%;
  padding-right: 40px;
}

.toggle-eye {
  position: absolute;
  right: 10px;
  background: none;
  border: none;
  cursor: pointer;
  outline: none;
}

.circle-dots-4:before {
  content: '● ● ● ●';
}

.circle-dots-9:before {
  content: '● ● ● ● ● ● ● ● ●';
}

/* Last Changes Modal */

.tab-btn {
  background-color: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-300);
  border-bottom-width: 0;
  border-radius: 4px 4px 1px 1px;
  padding: 5px 10px;
  cursor: pointer;
  margin-right: 5px;
  transition: border 0.5s ease;
}

.tab-btn:hover {
  border: 1px solid var(--color-secondary-600);
  border-bottom-width: 0;
}

.tab-btn:active {
  border: 1px solid var(--color-secondary-400);
  border-bottom-width: 0;
  background-color: var(--color-secondary-200);
}

.tab-btn-selected {
  border: 1px solid var(--color-secondary-400);
  border-bottom-width: 0;
  background-color: #D5ECEA !important;
}

.table-data {
  padding: 10px 5px;
  border-bottom: 1px solid var(--color-base-200);
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-move {
  cursor: move;
}

/*Scroll for select and tables */

.table-scroll {
  max-height: 550px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--color-primary-300) #f1f1f1;
}

.table-scroll::-webkit-scrollbar {
  width: 12px;
}

.table-scroll::-webkit-scrollbar-track {
  background: var(--color-primary-100);
}

.table-scroll::-webkit-scrollbar-thumb {
  background-color: var(--color-primary-300);
  border-radius: 10px;
  border: 3px solid #f1f1f1;
}

/* Required Documents*/

.document-images {
  display: flex;
  width: 100%;
  padding: 10px 10px 35px;
}

.column-images {
  width: 100%;
  text-align: center;
  margin-bottom: 10px;
}

.column-images-container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  width: 8%;
  align-items: flex-start;
}

.image-button {
  width: 100%;
  padding: 0;
  position: relative;
  overflow: hidden;
  background: none;
  aspect-ratio: 1;
  border: none;
}

.image-container {
  position: relative;
  height: 100%;
  transition: border 0.5s ease;
}

.image-container img {
  height: 100%;
  object-fit: cover;
  display: block;
}

.image-opaque {
  position: relative;
}

.image-container:hover {
  border: 1px solid var(--color-secondary-300) !important;
}

.image-container::after,
.image-opaque::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #204744B2;
}

.image-container::after {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.image-container:hover::after {
  opacity: 0.5;
}

.image-opaque::after {
  opacity: 1.1;
  pointer-events: none;
  z-index: 1;
  border: 1px solid var(--color-secondary-400);
  transition: border 0.5s ease, opacity 0.5s ease;
}

.show-images-button {
  border: none;
  background: none;
}

.show-images-button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.border-dark {
  border: 1px solid var(--color-base-700);
}

.image-opaque:hover::after {
  border: none;
  opacity: 0.5;
}

.document-img {
  width: 97%;
  margin-left: 2%;
  text-align: left;
  padding-left: 10px;
}

.selected-image-container {
  display: flex;
  justify-content: start;
  align-items: start;
  width: 100%;
  height: 380px;
}

.selected-image-container img {
  border-radius: 4px;
  border: 1px solid var(--color-base-600);
  height: 100%;
  max-height: 100%;
  max-width: 100%;
  object-position: left top;
}

.truncated-text {
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 5px;
  text-align: center;
}

.cell-truncate {
  max-width: 230px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bg-document-image {
  background-color: var(--color-secondary-100) !important;
  padding: 3px 5px;
  border-bottom: 3px var(--color-base-400) solid;
}

.overlay-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #FFFFFF;
  z-index: 2;
}

.enter-comment {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  margin: 0 0 10px 5px;
}

.text-description {
  font-size: 16px;
  font-weight: 400;
  color: var(--color-base-600);
  border-left: 3px solid var(--color-secondary-400);
  background: var(--color-secondary-100);
  margin-bottom: 1rem;
  padding: 10px;
}

.text-wrap {
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.text-lowercase {
  text-transform: lowercase;
}

.description-textarea {
  resize: none;
  min-height: 45px;
  overflow-y: hidden;
}

.description-text {
  font-size: 16px;
}

/* Responsive */

@media only screen and (max-width: 1150px) {
  .last-changes {
    flex-direction: column;
    padding: 3px 2px !important;
  }

  .last-changes .fa-kit {
    padding: 0 !important;
  }

  .item-row, .form-section label {
    font-size: 14px;
  }

  .selected-image-container {
    height: 340px;
  }
}

.reportFilterSize {
  max-width: 270px;
}

@media (min-width: 1024px) and (max-width: 1440px) {
  .reportFilterSize {
    max-width: 180px;
    min-width: 180px;
  }

  .description-text {
    font-size: 14px;
  }
}

/*Miscellaneous*/
.mt-30-px {
  margin-top: 30px;
}

.min-h-45 {
  min-height: 45px;
}

.paginator-input {
  width: 50px; /* Ancho suficiente para mostrar al menos 3 dígitos */
  text-align: center; /* Centrar el valor dentro del input */
  padding: 5px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #f9f9f9;
}

.subNormal {
  font-weight: normal;
}

/*-- Table buttons --*/
.btn__li-primary {
  align-items: center;
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-300);
  border-radius: 4px;
  color: var(--color-base-700);
  display: flex;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  gap: 8px;
  justify-content: center;
  min-height: 45px;
}

.btn__li-primary:hover {
  border: 1px solid var(--color-primary-400);
}

.btn__li-primary:focus {
  background: var(--color-primary-200);
  border: 1px solid var(--color-primary-400);
}

.btn__li-secondary {
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-400);
}

.btn__li-secondary:hover {
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-600);
}

.btn__li-secondary:focus {
  background: var(--color-secondary-200);
  border: 1px solid var(--color-secondary-400);
}

.btn__li-error {
  background: var(--color-error-100);
  border: 1px solid var(--color-error-300);
}

.btn__li-error:hover {
  background: var(--color-error-100);
  border: 1px solid var(--color-error-500);
}

.btn__li-error:focus {
  background: var(--color-error-200);
  border: 1px solid var(--color-error-500);
}

/*--- Anchor ---*/
.li__a {
  color: var(--color-base-700);
  font-size: 16px;
  text-decoration: underline;
}

.selected_anchor {
  text-decoration: none;
}

.selected_anchor span {
  color: var(--color-primary-400);
  font-size: 14px;
  font-weight: 500;
}

/*--- Document File ---*/
.doc-container {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  border-radius: 4px;
}

.btn-doc-modal {
  justify-content: flex-end;
  display: flex;
  gap: 20px;
  margin-top: 48px;
}

.img-text-doc-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-600);
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 10px;
}

.header-doc-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-700);
  font-size: 16px;
  font-weight: 400;
  border-bottom: 1px solid var(--color-secondary-300);
  margin-left: 16px;
  margin-right: 16px;
  margin-top: 16px;
  position: relative;
}

.close-modal-icon {
  position: absolute;
  top: 0;
  right: -5px;
  cursor: pointer;
  color: var(--color-base-700);
  font-size: 24px;
  transition: color 0.2s ease;
}

.review-doc-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-700);
  font-size: 16px;
  font-weight: 700;
  gap: 8px;
  padding-bottom: 16px;
}

.line-doc-modal {
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--color-base-300);
  gap: 8px;
  margin-right: -12px;
}

.dot-doc-modal {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--color-secondary-500);
  margin-bottom: 16px;
  margin-right: 8px;
  margin-left: 4px;
}

.radio-group-doc-modal {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px;
}

.radio-doc-modal {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid var(--color-base-600);
  background-color: white;
  position: relative;
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  outline: none;
  bottom: 2.2px;
}

.radio-doc-modal::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 51%;
  width: 9px;
  height: 9px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background-color: var(--color-primary-400);
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
}

.radio-doc-modal:checked {
  border: 1px solid var(--color-primary-400);
  opacity: 1;
}

.radio-doc-modal:checked::before {
  opacity: 1;
}

.radio-doc-modal:focus {
  outline: none;
  box-shadow: none;
}

.radio-label-doc-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-600);
  font-size: 16px;
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  vertical-align: middle;
  align-content: center;
}

.image-outer-wrapper {
  margin: 0 auto 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  position: relative;
}

.image-rotatable {
  display: flex;
  justify-content: center;
  align-items: center;
  transform-origin: center center;
  --angle: 0deg;
  --scale: 1;
  --x: 50%;
  --y: 50%;
  transform-origin: var(--x) var(--y);
  transform: rotate(var(--angle)) scale(var(--scale));
  transition: transform 0.15s ease-out, width 0.3s ease, height 0.3s ease;
  margin-left: 35px;
}

.image-doc-modal {
  display: block;
  width: auto;
  height: auto;
  max-width: 90%;
  max-height: 100%;
  object-fit: contain;
  transition: transform 0.3s ease;
}

.btn-rotate-doc-modal {
  font-family: 'Inter', sans-serif;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1px 1px;
  gap: 3px;
  border: none;
  color: var(--color-base-700);
  cursor: pointer;
  font-size: 16px;
  margin-bottom: 24px;
  margin-left: 35px;
  margin-right: 35px;
  background-color: #FFFFFF;
}

.btn-rotate-doc-modal i {
  margin-right: 6px;
  width: 24px;
  height: 24px;
  font-size: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-rotate-doc-modal:focus {
  border: none;
  color: var(--color-primary-400);
}

.checkbox-label-doc-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-600);
  font-size: 16px;
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  vertical-align: middle;
}

.checkbox-doc-modal {
  position: relative;
  bottom: 2px;
}

.other-label-doc-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-600);
  font-size: 16px;
  font-weight: 400;
  margin-top: 16px;
  display: block;
}

.input-other-doc-modal {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--color-base-700);
  border: 1px solid var(--color-base-300);
  border-radius: 4px;
  padding: 8px 12px;
  width: 100%;
  margin-top: 8px;
}

.btn-refresh-rate {
  color: var(--color-secondary-500);
}

.btn-refresh-rate:focus,
.btn-refresh-rate:hover {
  color: var(--color-secondary-400)
}
.btn-refresh-rate:disabled {
  color: var(--color-base-400)
}

.document-provider-message {
  white-space: normal;
  word-break: break-word;
}

.separator-between {
  margin: 0 12px;
  border-right: 1px solid var(--color-base-300);
  min-height: 29.5px;
  display: inline-block;
}

#onTrustDocumentValue {
  color: var(--color-primary-600);
}

/*--- Categories order ---*/
.ui-state-highlight {
  background: var(--color-base-200);
  border: 1px solid var(--color-base-100);
  border-radius: 4px;
  height: 50px;
  margin: 8px;
}

body.dragging-category .category-block .ui-state-highlight {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
}

.ui-sortable-helper {
  border: 1px solid var(--color-base-100);
  border-radius: 4px;
}

.input-categoy-order {
  width: 50px;
  height: 50px;
  outline: none;
  border: none;
}

.input-categoy-order-letter {
  width: 50px;
  height: 50px;
  outline: none;
  border: none;
  background: 1px solid var(--color-primary-100);
  border-right: 1px solid var(--color-base-300);
}

.input-categoy-order-letter: hover {
  background: 1px solid var(--color-base-100);
}

.input-categoy-order-letter: focus {
  background: 1px solid white;
}

.input-categoy-order:hover {
  border: 1px solid var(--color-secondary-500);
}

.input-categoy-order:focus {
  border: 1px solid var(--color-secondary-500);
  background: white;
}

.category-block .ui-sortable-placeholder {
  display: none !important;
  height: 0 !important;
}

/* Custom Form Input */

.input-field {
  min-width: 166px;
  max-height: 45px;
  font-size: 16px;
  font-weight: 400;
  padding-left: 8px;
  padding-right: 8px;
  border-radius: 4px;
  color: var(--color-base-700) !important;
  border: 1px solid var(--color-base-400) !important;
  font-family: 'Inter', sans-serif;
  text-overflow: ellipsis;
  overflow: hidden;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

.input-field::placeholder {
  color: var(--color-base-500);
  font-weight: 400;
}

.input-field:hover {
  border: 1px solid var(--color-primary-300) !important;
  background: var(--color-primary-100);
  color: var(--color-base-700);
}

.input-field:focus {
  border: 1px solid var(--color-primary-400) !important;
  color: var(--color-base-700);
  outline: none !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

.input-field.ng-invalid.ng-dirty,
.input-field.input-error {
  border: 1px solid var(--color-error-500) !important;
  color: var(--color-base-700);
  background: #fff;
}

.input-hint-error {
  font-size: 14px;
  margin-top: 4px;
  color: var(--color-error-500);
}

.simple-select .multiselect,
.input-field {
  height: 45px !important;
  border-radius: 4px;
}

/* Label */
.form-label {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: var(--color-base-700);
  margin-bottom: 6px;
  font-weight: 700;
}

.form-group {
  width: 100%;
  margin-bottom: 24px;
}

.form-label-inline {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 6px;
}

.form-label-inline .currency-label {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: var(--color-base-700);
  margin-bottom: 6px;
  font-weight: 700;
}

.btn-next {
  width: 100%;
  height: 45px;
  margin: 16px auto 0 auto;
  font-size: 14px;
}

.form-space{
  width: 100%;
  text-align: center;
  margin-top: 20px;
}

.form-transaction .input-field,
.form-transaction .simple-select .multiselect,
.form-transaction .simple-select .multiselect span,
.form-transaction .simple-select .multiselect-container li a label {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--color-base-700) !important;
  font-family: 'Inter', sans-serif !important;
  text-transform: none !important;
  width: 100%;
}

.form-transaction .simple-select select,
.form-transaction .simple-select .multiselect {
  border: 1px solid var(--color-base-400) !important;
  box-shadow: none !important;
  outline: none !important;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

/* Disabled (inputs + selects) */
.input-field:disabled,
.input-field.disabled,
.simple-select .multiselect:disabled,
.simple-select.disabled .multiselect {
  background: var(--color-base-200) !important;
  border: 1px solid var(--color-base-300) !important;
  color: var(--color-base-700) !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  box-shadow: none !important;
}

select:disabled,
input:disabled {
  background-image: none !important;
  opacity: 1 !important;
}

/* Confirm Step Buttons (Custom) */
.form-confirm-buttons {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: 24px;
}

.form-confirm-buttons .btn-form {
  width: 240px;
  height: 45px;
  font-size: 14px;
  font-weight: 700;
  border-radius: 4px;
  font-family: 'Inter', sans-serif;
}

.btn-form--confirm {
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-300);
  color: var(--color-base-700);
}

.btn-form--confirm:hover {
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-400);
  color: var(--color-base-700);
}

.btn-form--confirm:active,
.btn-form--confirm.selected {
  background: var(--color-primary-200);
  border: 1px solid var(--color-primary-400);
  color: var(--color-base-700);
}

.btn-form--confirm:disabled {
  background: var(--color-base-200);
  border: 1px solid var(--color-base-300);
  color: var(--color-base-500);
  cursor: not-allowed;
  pointer-events: none;
}

/* Back button (Secondary) */
.btn-form--back {
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-400);
  color: var(--color-base-700);
}

.btn-form--back:hover {
  background: var(--color-secondary-100);
  border: 1px solid var(--color-secondary-600);
  color: var(--color-base-700);
}

.btn-form--back:active,
.btn-form--back.selected {
  background: var(--color-secondary-200);
  border: 1px solid var(--color-secondary-400);
  color: var(--color-secondary-600);
}

.btn-form--back:disabled {
  background: var(--color-base-200);
  border: 1px solid var(--color-base-300);
  color: var(--color-base-500);
  cursor: not-allowed;
  pointer-events: none;
}

.btn-form.btn-form--unsubscribe{
  border: 1px solid var(--color-base-500);
}

.process-deposit-layout .process-header {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 35px;
  margin-bottom: 20px;
}

.process-deposit-layout .col.third {
  flex: 1;
  min-width: 280px;
}

.process-deposit-layout .subtitle {
  border-bottom: 1px solid #dddbdb;
  font-weight: 600;
  font-size: 1.1em;
  margin: 0 0 1.2em 0;
  padding-bottom: 0.2em;
}

.process-deposit-layout .subtitle:before {
  content: "•";
  margin-right: 0.4em;
  font-size: 18px;
}

/* Custom User Tag */
.process-deposit-layout .process-header__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  height: 36px;
  border: 1px solid var(--color-secondary-500);
  border-radius: 4px;
  background: var(--color-base-100);
  color: var(--color-base-700);
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
  gap: 6px;
  margin-bottom: 15px;
  box-sizing: border-box;
  width: fit-content;
}

.process-deposit-layout .process-header__tag i {
  color: var(--color-secondary-600);
  font-size: 18px;
}

.process-deposit-layout .process-header .col.third:first-child {
  margin-left: -2px;
}

/* Client Info */
.process-deposit-layout .process-customer-info {
  border-left: 3px solid var(--color-secondary-400);
  padding-left: 10px;
  margin-left: 0;
  margin-top: 8px;
}

.process-deposit-layout .process-customer-info ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.process-deposit-layout .process-customer-info li {
  font-size: 14px;
  color: var(--color-base-700);
  margin-bottom: 4px;
  line-height: 1.4;
  gap: 4px;
}

.process-deposit-layout .process-customer-info li strong {
  font-weight: 600;
  margin-right: 4px;
  color: var(--color-base-700);
}

.process-deposit-layout .process-customer-info li strong::after {
  content: ":";
}

.process-deposit-layout .process-customer-info li span {
  font-weight: 400;
}

/* Custom Checkbox */
.process-deposit-layout .formRow.checkboxGroup {
  all: unset;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
}

.process-deposit-layout .checkbox-wrapper {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  font-size: 14px;
  color: #12121c;
  cursor: pointer;
  width: auto !important;
  height: auto !important;
  line-height: normal !important;
  user-select: none;
}

.process-deposit-layout .checkbox-wrapper input[type="checkbox"] {
  all: unset;
  appearance: none;
  -webkit-appearance: none;
  width: 18px !important;
  height: 18px !important;
  border: 1px solid var(--color-base-400);
  border-radius: 4px;
  background-color: #fff;
  cursor: pointer;
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

/* Checked */
.process-deposit-layout .checkbox-wrapper input[type="checkbox"]:checked {
  background-color: var(--color-primary-400);
  border-color: var(--color-primary-400);
}

.process-deposit-layout .checkbox-wrapper input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 2px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* Label */
.process-deposit-layout .checkbox-label {
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
}
.lim-cus-modal {
  background: var(--color-base-200) !important;
}

.header-lim-cus-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-700);
  font-size: 16px;
  font-weight: 700;
  border-bottom: 1px solid var(--color-secondary-300);
  margin-left: 16px;
  margin-right: 16px;
  margin-top: 16px;
  position: relative;
}

.title-lim-cus-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-700);
  font-size: 16px;
  font-weight: 700;
}

.clear-lim-cus-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-700);
  font-size: 16px;
  font-weight: 400;
  background: none;
  border: none;
  padding: 0;
  box-shadow: none;
  text-decoration: none;
  cursor: pointer;
}

.clear-lim-cus-modal:hover,
.clear-lim-cus-modal:focus {
  color: var(--color-primary-600);
  outline: none;
}

.require-lim-cus-modal {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-600);
  font-size: 14px;
  font-weight: 400;
}

.ms-wrapper { position: relative; }
.ms-wrapper.is-disabled select {
  opacity: .5;
  background-color: var(--color-base-300);
}

.ms-overlay {
  position: absolute; inset: 0;
  cursor: not-allowed;
  pointer-events: auto;
}

.limit-section input[type="number"].input-filled:not(:disabled),
.limit-section .multiselect.select-filled + .btn-group > .multiselect.dropdown-toggle,
.wrapper .multiselect.select-filled + .btn-group > .multiselect.dropdown-toggle {
  border: 1px solid var(--color-base-600);
  color: var(--color-base-700);
}

.lim-cus-modal .btn-form {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: normal;
  height: 42px;
  padding: 3px 16px 0;
}

.process-deposit-layout .checkbox-label {
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
}

.cancel-subscriptions-layout {
  border: 0.5px var(--color-secondary-400);
  border-radius: 0 2.509px 2.509px 0;
  border-left: 4px solid var(--color-secondary-400);
  background: var(--color-secondary-100);
  padding: 7px 12px 3px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1.2;
}

.cancel-subscriptions-layout input[type="checkbox"]{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 18px;
  height: 18px;
  margin: 0;
  cursor: pointer;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 2.509px;
  background: var(--color-secondary-100);
  border: 1.5px solid #000;
  display: inline-block;
  position: relative;
  transform: translateY(2px);
}

.cancel-subscriptions-layout input[type="checkbox"]:checked {
  background: var(--color-secondary-400);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8' fill='none'%3E%3Cpath d='M6.53831 2.125L2.94225 5.72106L1.30768 4.08649' stroke='white' stroke-width='0.934041' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
  border: none;
}

.cancel-subscriptions-layout label,
.cancel-subscriptions-layout {
  font-weight: normal !important;
}

.unsubscribe-confirm-checkbox {
  width: 18px;
  height: 18px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -5px;
}

.dropdown-subscriptions {
  position: relative;
  display: inline-block;
  width: 100%;
}

.dropdown-subscriptions .multiselect {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border: 1px solid #cccccc;
  border-radius: 4px;
  outline: none;
  font-size: 20px;
  background-color: #fff;
  width: 100%;
  cursor: pointer;
  background-image: none !important;
}

.dropdown-subscriptions::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'><path fill-rule='evenodd' clip-rule='evenodd' d='M3.29591 5.16383C3.53909 4.92065 3.93335 4.92065 4.17653 5.16383L7.47238 8.45968L10.7682 5.16383C11.0114 4.92065 11.4057 4.92065 11.6489 5.16383C11.892 5.40701 11.892 5.80127 11.6489 6.04445L7.91269 9.78061C7.66952 10.0238 7.27525 10.0238 7.03207 9.78061L3.29591 6.04445C3.05273 5.80127 3.05273 5.40701 3.29591 5.16383Z' fill='%23636363'/></svg>");
  background-repeat: no-repeat;
  background-size: 18px 18px;
}

.dropdown-subscriptions .multiselect:focus {
  border: 1px solid var(--color-primary-400);
  outline: none !important;
  box-shadow: none !important;
}

.dropdown-subscriptions .multiselect option:hover {
  background: #fff !important;
  color: var(--color-primary-400) !important;
}

.unsubscribe-table thead {
  color: var(--color-base-600);
  border-top: 1px solid var(--color-secondary-300);
  border-left: 1px solid var(--color-secondary-300) ;
  border-right: 1px solid var(--color-secondary-300);
  background: var(--color-base-200);
}

.unsubscribe-table thead,
.unsubscribe-table thead tr,
.unsubscribe-table thead th {
  border-bottom: 1px solid var(--color-secondary-300) !important;
}

.unsubscribe-table tbody td {
  border-right: 0.623px solid #C9C9C9;
}

.unsubscribe-table tbody td:last-child {
  border-right: none;
}

.btn-unsubscribe-warning {
  background: var(--color-warning-100);
  border: 1px solid var(--color-warning-200);
  color: var(--color-warning-400);
  transition: all 0.15s ease-in-out;
}

.btn-unsubscribe-warning:hover {
  background: var(--color-warning-100);
  border-color: var(--color-warning-500);
  color: var(--color-warning-500);
}

.btn-unsubscribe-warning:active,
.btn-unsubscribe-warning:focus {
  background: var(--color-warning-100);
  border-color: var(--color-warning-500);
  color: var(--color-warning-400);
  outline: none;
}

.modal-remove-subscription .close span,
.modal-remove-subscription .close:focus span {
  opacity: 1 !important;
  color: transparent !important;
  text-shadow: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 15 15' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.29591 3.29591C3.53909 3.05273 3.93335 3.05273 4.17653 3.29591L7.47238 6.59176L10.7682 3.29591C11.0114 3.05273 11.4057 3.05273 11.6489 3.29591C11.892 3.53909 11.892 3.93335 11.6489 4.17653L8.353 7.47238L11.6489 10.7682C11.892 11.0114 11.892 11.4057 11.6489 11.6489C11.4057 11.892 11.0114 11.892 10.7682 11.6489L7.47238 8.353L4.17653 11.6489C3.93335 11.892 3.53909 11.892 3.29591 11.6489C3.05273 11.4057 3.05273 11.0114 3.29591 10.7682L6.59176 7.47238L3.29591 4.17653C3.05273 3.93335 3.05273 3.53909 3.29591 3.29591Z' fill='%23000000'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  display: inline-block;
  width: 14px;
  height: 14px;
  line-height: 1;
  font-size: 14px;
  position: relative;
  top: -4px;
}

.modal-remove-subscription .close span::before {
  content: none !important;
}

.modal-content:has(.modal-subscriptions) {
  width: 462px !important;
  max-width: 462px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.modal-content:has(.modal-subscriptions) .modal-subscriptions,
.modal-content:has(.modal-subscriptions) .modal-subscriptions .modal-body {
  width: 462px !important;
  max-width: 462px !important;
  box-sizing: border-box !important;
}

.modal-content:has(.modal-subscriptions) .modal-subscriptions .modal-body {
  height: 323px !important;
  max-height: 323px !important;
  padding: 12px !important;
}

.unsubscribe-table td:nth-child(4),
.unsubscribe-table th:nth-child(4) {
  width: 189px;
  text-align: center;
}

.unsubscribe-table tfoot {
  display: none;
}

.unsubscribe-table td {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  vertical-align: middle !important;
  min-height: 56px !important;
}

.unsubscribe-table p {
  margin: 0 !important;
}

.unsubscribe-table th {
  font-family: inherit;
  font-weight: 600; !important;
  font-size: 16px !important;
}

#customerPhoneCode {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-style: normal;
  letter-spacing: 2.72px;
}

/* Financial Limits */
.right-aside-ul {
  list-style: none;
  margin: 0;
  padding: 24px 16px;

  display: flex;
  flex-direction: column;
  gap: 8px;
}

.limit-row,
.limit-available {
  list-style: none;
  margin: 0;
  display: block;
}

.limit-row {
  padding-bottom: 12px;
  border-bottom: 1px solid #91DD50; /* Line green */
}

.limit-row.with-top-separator {
  border-top: 1px solid #e0e0e0;
  padding-top: 12px;
  padding-bottom: 12px;
}

.limit-row strong,
.limit-available strong {
  font-weight: bold;
  color: #3E3E3E;
  min-width: auto;
  display: inline;
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
}

.limit-row strong::after,
.limit-available strong::after {
  content: ":\00a0";
}

.limit-row span,
.limit-available span {
  font-weight: normal;
  color: #3E3E3E;
  display: inline;
  margin-left: 4px;
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
}

.margin-limit-available{
  margin-top: -5px;
}

.margin-limit{
  margin-top: 25px;
}

li.established-box {
  background-color: #F7FDF2 !important;
  padding: 4px;

  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;

  list-style: none;
  margin-top: -10px;
  border-bottom: 1px solid #91DD50;
}

li.established-box .established-label::after {
  content: ":\00a0";
  font-weight: bold;
}

li.established-box .established-value {
  display: block;
  color: #3E3E3E;
}

.available-item {
  list-style: none;
  border: none;
  padding: 0;
  margin: 0;
  line-height: 1.4;
}

.placeholder-base-500::placeholder {
  color: var(--color-base-500);
  font-family: 'Inter', sans-serif !important;
}

.select-filled-input,
.select-filled-input + .btn-group > .multiselect.dropdown-toggle{
  border: 1px solid var(--color-base-600);
  color: var(--color-base-700) !important;
  font-family: 'Inter', sans-serif !important;
}

.letter-spacing {
  letter-spacing: 2.72px;
}

.doc-option-card {
  font-family: 'Inter', sans-serif;
  color: var(--color-base-700);
  font-size: 16px;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--color-base-300)  !important;
  border-radius: 4px;
  padding: 10px 8px;
  background: #fff;
  cursor: pointer;
  width: 100%;
  box-sizing: border-box;
  height: 45px;
}

.doc-option-card:hover {
  color: var(--color-base-600);
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-300) !important;
}

.doc-option-left {
  display: flex;
  align-items: center;
  gap: 8px;
}

.doc-option-radio {
  appearance: none;
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.doc-option-circle {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid var(--color-base-500);
  box-sizing: border-box;
  position: relative;
}

.doc-option-radio:checked + .doc-option-circle {
  border-color: var(--color-primary-400);
}

.doc-option-radio:checked + .doc-option-circle::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  background: var(--color-primary-400);
}

.status-badge {
  padding: 0 !important;
  height: 40px;
}

.status-badge span {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 36px;
  min-width: 120px;
  padding: 3px 12px 0;
  border-radius: 4px;
  text-transform: capitalize;
  background-color: var(--color-base-100);
  font-weight: 500;
  border: 1px solid transparent;
  background: var(--color-base-100);
  color: var(--color-base-700);
}

/* SENT */
.status-1 span {
  border-color: var(--color-secondary-300);
}

/* APPROVED */
.status-2 span {
  border-color: var(--color-primary-800);
}

/* REJECTED */
.status-3 span {
  border-color: var(--color-error-500);
}

/* UNDER REVIEW */
.status-4 span {
  border-color: #F9CE10;
}

/* EXPIRED */
.status-5 span {
  border-color: #5C0EC1;
}

/* FAILED */
.status-6 span {
  border-color: #F33;
}

/* FAILED IN PROVIDER */
.status-7 span {
  border-color: #FFABAB;
}

/* UNKOWN */
.status-8 span {
  border-color: #BE14F1;
}

/* JIRA OPENED */
.status-9 span {
  border-color: #0AD5C7;
}

/* PENDING */
.status-10 span {
  border-color: var(--color-warning-500);
}

.table tr:not(.select):not(.check) td, .table tr th .table-form tr.row-totals td {
  border-bottom: none;
}

.table-form tr.row-totals td {
  background-color: var(--color-secondary-100) !important;
  border: 1px solid var(--color-secondary-400) !important;
}

.active-option {
  border: 1px solid var(--color-base-300) !important;
  color: var(--color-base-700) !important;
}

.disabled-option {
  opacity: 0.4;
  cursor: not-allowed !important;
  pointer-events: none;
}

.col.quarter > form > .input-group > input.input-form {
  width: 97%;
}

.col.quarter > form > .input-group > .input-group-btn > button {
  width: 45px;
  height: 45px;
}

.lim-cus-modal .modal-header{
  border-bottom: 1px solid var(--Border-Secondary-300, #90CBC7);
}

.lim-cus-modal .limit-info-list{
  border-left: 3px solid var(--Border-Primary-300, #91DD50);
  padding-left: 12px;
}

[ng-controller="CreditCardSearchCtrl"] #transactionStatusList + .btn-group > button.multiselect.dropdown-toggle{
  margin-top: 4px;
}

.rules-select.rules-select--error select.multiselect,
.rules-select.rules-select--error .btn.multiselect {
  border: 1px solid var(--color-error-500);
  background: white;
  color: var(--color-base-700);
}

.rules-select.rules-select--error select.multiselect:hover,
.rules-select.rules-select--error select.multiselect:focus,
.rules-select.rules-select--error .btn.multiselect:hover,
.rules-select.rules-select--error .btn.multiselect:focus {
  border: 1px solid var(--color-error-500);
  outline: none;
}

.input-group.mt-1 {
  width: 100%;
}

.input-group.mt-1 > .input-group-btn {
  width: 100%;
}

.input-group.mt-1 > .input-group-btn > .dropdown-toggle {
  width: 100%;
}

.side-tab-content .subtitle::before,
.side-tab-content .subtitle:before {
  content: none !important;
  display: none !important;
}

/* Personal Info Side-Bar */

.right-aside-ul-sidebar {
  list-style: none;
  margin: 0;
  padding: 24px 16px;
  font-size: 14px;
  padding-left: 15px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.right-aside-ul-sidebar li {
  margin-bottom: 6px;
}

.right-aside-ul--pi .pi-item {
  display: flex;
  flex-direction: column;
  gap: 0;
  background: var(--color-base-200);
  border-radius: var(--pi-radius);
  padding: 0;
  position: relative;
  overflow: hidden;
  margin-bottom: 8px;
  min-height: 60px;
}

.right-aside-ul--pi .pi-label {
  display: flex;
  gap: 8px;
  background: var(--color-base-300);
  border-radius: var(--pi-radius-sm);
  align-items: center;
  padding: 4px 8px;
  position: absolute;
  top: 4px;
  left: 4px;
  right: 4px;
  height: 28px;
  z-index: 2;
  white-space: nowrap;
}

.right-aside-ul--pi .pi-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-secondary-500);
  flex: 0 0 8px;
  margin-top: 0px;
  align-self: center;
}

.right-aside-ul--pi .pi-label strong {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  color: var(--color-base-600);
  font-weight: 700 !important;
  line-height: 18px !important;
  margin: 0;
}

.right-aside-ul--pi .pi-label strong::after {
  content: ":";
  margin-left: 2px;
}

.right-aside-ul--pi .pi-value {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 36px 12px 12px 12px;
  background: var(--color-base-200);
  z-index: 1;
  display: flex;
  align-items: flex-start;
  flex-grow: 1;
  border-radius: 8px;
}

.right-aside-ul--pi .pi-value span {
  font-family: 'Inter', sans-serif !important;
  font-size: 16px !important;
  color: var(--color-base-600);
  font-weight: 500 !important;
  word-break: break-word;
  overflow-wrap: anywhere;
  line-height: 1.2 !important;
  text-align: left;
  width: 100%;
}

.right-aside-ul--pi .pi-value span:empty::before {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 500;
  content: "-";
  color: var(--color-base-500);
}

.right-aside-ul--pi {
  --pi-inset: 4px;
  --pi-gap: 4px;
  --pi-radius: 8px;
  --pi-radius-sm: 4px;
  --pi-label-h: 28px;
}

.aside-background {
  background-color: var(--color-base-100) !important;
}

.right-aside-ul-sidebar li:last-child {
  margin-bottom: 0 !important;
}

/* Tags */
.tag-container {
  border: 1px solid var(--color-base-300);
  border-radius: 6px;
  padding: var(--spacing-2);
  padding-right: var(--spacing-1);
  height: 129px;
  overflow-y: auto;
  overflow-x: hidden;
}

.tag-container::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

.tag-container::-webkit-scrollbar-track {
  background: var(--color-primary-200);
  border-radius: 10px;
}

.tag-container::-webkit-scrollbar-thumb {
  background: var(--color-primary-400);
  border-radius: 10px;
}

.tag-container:not(.is-filled):hover {
  border-color: var(--color-primary-300);
  background-color: var(--color-primary-100);
}

.tag-container:focus-within {
  border-color: var(--color-primary-400);
  background-color: #fff;
}

.tag-container:focus-within:not(.is-filled) {
  border-color: var(--color-primary-400);
}

.tag-container.is-filled {
  border-color: var(--color-base-400);
}

.tag-item {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--color-base-200);
  border-radius: 6px;
  padding: var(--spacing-1);
  color: var(--color-base-600);
  margin-bottom: var(--spacing-1);
  margin-right: var(--spacing-1)
}

.tag-item .x {
  border: 0;
  background: transparent;
  color: var(--color-primary-300);
  font-size: 18px;
  cursor: pointer;
  line-height: 1;
  padding: 0;
}

.tag-item.invalid {
  background: var(--color-error-100);
  color: var(--color-error-500);
}

.tag-item.invalid .x {
  color: var(--color-error-500);
}

.tag-input {
  border: 0;
  outline: none;
  font-size: 16px;
  font-weight: 400;
  flex: 1;
  background: transparent;
}

.tag-placeholder {
  position: absolute;
  pointer-events: none;
  font-size: 16px;
  margin-left: 1px;
  color: var(--color-base-500);
}

.icon-search {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-base-700);
  font-size: 20px;
  pointer-events: none;
}

/*customer-history*/
.center-title {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-left: 16px;
  margin-bottom: 16px;
}

.history-grid {
  display: grid;
  grid-template-columns: 
    auto 
    98px 
    auto 
    98px 
    auto 
    98px 
    1fr;
  gap: 0;
  max-width: 1842px;
  align-items: start;
  margin-left: 16px;
  font-family: 'Inter', sans-serif;
}

/* history dates */
.history-dates {
  display: flex;
  max-width: 150px;
  flex-direction: column;
  margin-right: 0px;
}

.date-block {
  display: flex;
  flex-direction: column;
}

.date-block b {
  font-size: 14px;
  font-weight: 700;
  margin-top: 5.5px;
}

.date-block .input-container {
  min-width: 150px;
}

.date-block .input-form {
  margin: 0;
  box-sizing: border-box;
}

.history-separator {
  width: 2px;
  background-color: var(--color-secondary-200);
  justify-self: center;
  align-self: stretch;
}

.history-section {
  display: flex;
  max-width: 482px;
  max-height: 144px;
  flex-direction: column;
  gap: .25em;
  min-width: 0;
}

.history-section .radio-grid .radio-btn {
    margin-bottom: 0;
}

.history-section:has(.radio-grid){
  max-width: 150px;
}

.checkbox-grid {
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 31px 16px;
  align-items: start;
}

.history-checkboxes {
  padding: 0;
  margin: 0;
}

.checkbox-btn {
  margin: 0 !important;
  white-space: nowrap;
}

.radio-grid {
  display: flex;
  flex-direction: column;
  gap: 31px 16px;
}

.history-action {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 0;
  height: 100%;
  width: 150px;
}

.history-action .btn-form {
  width: 150px;
}

.date-block .toggle-eye {
    right: 0px;
    padding: 0;
}

.date-block .toggle-eye {
    right: 8px;
    padding: 0;
}

.date-block .input-form:hover {
  background: var(--color-primary-100);
  border: 1px solid var(--color-primary-300);
}

@media (max-width: 1550px) {
  .history-grid {
    grid-template-columns: 1fr;
    row-gap: 24px;
  }

  .history-separator {
    display: none;
  }
}

/* Custom arrows for a single-option select */

.custom-select-wrapper {
  position: relative;
  width: 100%;
}

.custom-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 40px !important;
  cursor: pointer;
}

.custom-select-arrows {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: var(--color-base-600);
}

.custom-select-arrows i {
  font-size: 12px;
  line-height: 1;
  display: block;
}

.custom-select-placeholder {
  position: absolute;
  padding-left: var(--spacing-2);
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: var(--color-base-600);
}

.custom-select-wrapper .arrow-up {
  display: none;
}

.custom-select-wrapper .arrow-down {
  display: block;
}

.custom-select-wrapper.select-open .arrow-up {
  display: block;
}

.custom-select-wrapper.select-open .arrow-down {
  display: none;
}

.custom-select-wrapper:hover .custom-select-arrows {
  color: var(--color-primary-400);
}

.custom-select:focus ~ .custom-select-arrows {
  color: var(--color-primary-400);
}

.custom-select:disabled ~ .custom-select-arrows {
  color: var(--color-base-400);
}

.custom-select::-ms-expand {
  display: none;
}

.custom-select-background {
  background-color: var(--color-base-white)!important;
  border: 1px solid var(--color-base-600)!important;
}

.processor-multiselect .btn-group > .multiselect.dropdown-toggle {
  margin-top: 4px;
}

.input-container input.input-form,
.input-container select.input-form {
  height: 45px;
  min-height: 45px;
  box-sizing: border-box;
}

.btn.multiselect {
  height: 45px;
}
