.select2-container--bootstrap4 .select2-selection--single,
.select2-container--bootstrap4 .select2-selection--multiple {
  height: 32px !important;
  min-height: 32px !important;
  border: 1px solid #e2e8f0;
}

.select2-container--bootstrap4 .select2-selection--multiple {
  min-height: calc(32px - 2px);
  height: auto !important;
  overflow: visible;
}

.select2-search.select2-search--inline {
  height: 30px !important;
}

.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__rendered {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
  min-height: 30px;
}

.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
  margin-top: 1px;
  margin-bottom: 1px;
}

.select2-container .select2-search--inline .select2-search__field {
  margin-top: 0 !important;
  width: 100% !important; /* Force width to respect parent container */
  max-width: calc(100% - 10px) !important; /* Add some padding */
}

/* Fix for search field width calculation */
.select2-container--bootstrap4 .select2-selection--multiple .select2-search--inline {
  flex: 1;
  min-width: 0;
  max-width: 100%;
  height: 30px;
}

/* Add checkboxes for multiple-select options */
.select2-container--bootstrap4 .select2-results__option[aria-selected] {
  position: relative;
}

.select2-container--bootstrap4 .select2-results__option[aria-selected] {
  padding-left: 15px !important;
}

/* Remove border from the last option */
.select2-container--bootstrap4 .select2-results__option:last-child {
  border-bottom: none;
}

.select2-container--bootstrap4 [aria-multiselectable=true] .select2-results__option[aria-selected]::before {
  content: '';
  display: inline-block;
  position: absolute;
  right: 15px; /* Shifted to the right side */
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  border: 1px solid #aaa;
  border-radius: 3px;
  background-color: #fff;
}

.select2-container--bootstrap4 [aria-multiselectable=true] .select2-results__option[aria-selected=true]::before {
  content: '';
  background-color: #1db954;
  /* background-color: #EEF1F7; */
  border-color: #1db954;
}

.select2-container--bootstrap4 [aria-multiselectable=true] .select2-results__option[aria-selected=true]::after {
  content: '';
  display: inline-block;
  position: absolute;
  right: 20px; /* Shifted to the right side */
  top: 50%;
  transform: translateY(-65%) rotate(40deg);
  width: 6px;
  height: 12px;
  border-right: 2px solid #EEF1F7;
  border-bottom: 2px solid #EEF1F7;
  animation: bounceIn 0.3s; /* Added bounce effect */
}

@keyframes bounceIn {
  0% {
    transform: translateY(-65%) rotate(40deg) scale(0);
  }
  50% {
    transform: translateY(-65%) rotate(40deg) scale(1.3);
  }
  100% {
    transform: translateY(-65%) rotate(40deg) scale(1);
  }
}

/* for scrollbar */

.select2-results__options::-webkit-scrollbar {
  width: 4px;
}
.select2-results__options::-webkit-scrollbar-track {
  background: linear-gradient(135deg, rgba(29, 185, 84, 0.2), rgba(124, 58, 237, 0.2)); /* Updated to a gradient mixing greenary and purple colors with a darker tone */
  border-radius: 4px;
}

.select2-results__options::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, rgba(29, 185, 84, 0.4), rgba(124, 58, 237, 0.4)); /* Updated to a gradient mixing greenary and purple colors with a darker tone */
  border-radius: 4px;
}

/* changing highlight color */


.select2-container--bootstrap4 .select2-results__option--highlighted, .select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected="true"] {
  background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}


/* increasing select2 dropdown width */
.select2-dropdown.select2-dropdown--below {
  border: none; /* Remove default border */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2), 0 6px 20px rgba(0, 0, 0, 0.15); /* Enhanced shadow for depth */
  background-color: #ffffff; /* White background for contrast */
  overflow: hidden; /* Prevent overflow */
}

/* selected background color */
.select2-container--bootstrap4 .select2-results__option[aria-selected="true"] {
  background-color: #EEF1F7 !important;
}

/* removing single line selected item */
/* .select2-results__options:not([aria-multiselectable]) .select2-results__option[aria-selected=true] {
  display: none !important;
} */

/* padding to inner results */
/* .select2-dropdown .select2-results {
  padding: 15px;
} */
/* 
.select2-dropdown .select2-results__options {
  padding: 10px;
  border-radius: 5px;
  border: 1px solid #e0e5eb;
}

*/
.select2-dropdown .select2-results__options li {
  padding: 5px;
  /* overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis; */
  width: 100%;
  
}

/* hiding multiselected items */
.select2-container .select2-selection--multiple li.select2-selection__choice,
.select2-container .select2-selection--multiple .select2-selection__choice__remove {
  display: none; /* Hide all choices */
}

.select2-container .select2-selection--multiple .select2-selection__rendered{
  padding-left: 10.5px !important;
}

.select2-container .select2-selection--multiple .select2-selection__rendered li:nth-child(2) {
  display: inline-block; /* Show only the first element */
}


.select2-container .select2-selection--multiple .select2-selection__choice {
  color: #495057 !important; /* Changed to a solid color */
  border: 0 !important;
}


/* this is after */

.select2-container--bootstrap4 .select2-selection--single{
  height: 32px!important;
}


.input-group .select2-container.select2-container--bootstrap4{
width: calc(100% - 150px) !important;
}

.select2Template i{
font-size: 12px;
color: #7e7e7e;
}

.select2-results__option .select2Template{
  color: gray;
}

.select2-results__option--highlighted .select2Template i{
  color: white;
}

.select2-results__option{
border-bottom: 1px solid #ddd;
}

.select2-container--bootstrap4 .select2-results__option{
padding: 1px 10px;
}



.tbody .select2-container--bootstrap4 .select2-selection {
  border:  none;
}

/* Secondary font color */

.chosen-disabled .chosen-single a {
    color: #8da0aa;
}
/* Primary background color */

.chosen-container .chosen-results li.active-result.highlighted {
    color: #fff;
    background: #1E9FF2;
}

.bg-danger-lite{
  background: #F0B8AC !important;
}

/* Default border color */

div .has-success>.chosen-container > a{
    /*border-color: #5cb85c;*/
    border: 1px solid #5cb85c !important;
}
div .has-error>.chosen-container > a {
    border: 1px solid red !important;
    /*border-color: red;*/
}
div .has-error>.chosen-container>.chosen-container-single .chosen-single div {
    color: #a94442;
    background-color: #f2dede;
}

/* Dropdown hover/active/focus */

.chosen-container-single .chosen-single div, .chosen-container-multi .chosen-choices li.search-choice {
    color: #2b2f33;
    background: #eff4f6;
    /*width: 25px !important;*/
    padding-left: 8px;
}

.chosen-results li.highlighted {
    border-radius: 2px;
}

/* Disabled */

.chosen-disabled {
    cursor: not-allowed !important;
    opacity: .65;
    filter: alpha(opacity=65);
}

.form-control:focus {
  color: #495057;
  background-color: #fff;
  border-color: #80bdff;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.form-control-success,
.form-control-warning,
.form-control-danger {
  padding-right: 2.25rem;
  background-repeat: no-repeat;
  background-position: center right 0.5625rem;
  -webkit-background-size: 1.125rem 1.125rem;
          background-size: 1.125rem 1.125rem;
}

.has-success .form-control-feedback,
.has-success .form-control-label,
.has-success .col-form-label,
.has-success .form-check-label,
.has-success .custom-control {
  color: #5cb85c;
}

.has-success .form-control {
  border-color: #5cb85c;
}

.has-success .input-group-addon {
  color: #5cb85c;
  border-color: #5cb85c;
  background-color: #eaf6ea;
}

.has-success .form-control-success {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E");
}


.has-error .form-control,
div .has-error>.chosen-container > a  {
  border-color: rgb(255, 0, 0);
}

.has-error .form-control-position{
  color: rgb(255, 0, 0);
}

.has-error .help-block {
  color: rgb(255, 0, 0);
}

.help-block{
  padding-top: 5px;
  margin: 0px;
  width: 100%;
}

/*.has-error .input-group-addon {
  color: #d9534f;
  border-color: #d9534f;
  background-color: #fdf7f7;
}
*/


.has-error input:focus{
  color: red;
  background-color: #fff;
  border-color: red;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(255, 0, 0, 0.25);
}

html body .content .content-wrapper {
  padding: 10px;
}

/*fixing chosen with addon*/


.input-group-text, input, select, .btn-sm{
  height: 32px !important;
}

.table.table-xs td, .table.table-xs th {
  padding: .4rem 0.4rem;
}

.tr-small{
  line-height: 15px;
  white-space: nowrap;
}

.tr-small-10px{
  line-height: 12px !important;
}

.tr-small-10px span {
  font-weight: bold;
}

.tr-small span{
  font-weight: bold;
  float: right !important;
  line-height: normal;
  /*text-align: right !important;*/
  display: block;
}

.tr-small input{
  height: 20px !important;
}

.amount-field{
  padding: 15px !important;
  /* font-weight: bold; */
  line-height: normal;
  font-size: 16px;
}

.chosenbtnadded{
  padding: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f8f9fa;
  border: 1px 0 solid #ced4da;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.chosen-container .chosen-drop {
  z-index: 1049 !important;
}

.input-group-text{
  padding: .5rem .3rem;
  background-color: #eff4f6;
  /*background-color: rgba(0,0,0,0.04);*/
}


/*theme customizer positions*/
.customizer .customizer-toggle {
  top: 85px;
  width: 45px;
  left: -45px;
}

.fixedPosition{
  position: fixed !important;
}

.textarea{
  height: 32px;
  padding: 6px;
  line-height: 20px;
  resize: none;
  overflow: hidden;
  font-size: 14px;
}

/*overflow for chosen select from dialog box*/
.ui-widget-content {
    overflow: visible !important;
}

.footer-calculator{
  font-size: 18px;
  color: #2ecc71;
  cursor: pointer;
}

/*when dialog box is open*/
.ui-widget-overlay {
  background: black !important;
  opacity: 0.2 !important;
}


/*for datepickers */
.datepicker table tr td.active.active{
  background: red !important;
}

.datepicker table tr td.today{
  border: 1px solid #FAD42E !important;
  background: #FBEC88 !important;
}

div#ndp-nepali-box td.ndp-current {
  background: red !important;
}

div#ndp-nepali-box td.ndp-current a {
    color: white !important;
}

.modal-footer {
  border-top: 1px solid #dfe8f1;
}
.modal-header {
  border-bottom: 1px solid #dfe8f1;
}

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

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

/* webkit solution */
::-webkit-input-placeholder { text-align:left; }
/* mozilla solution */
input:-moz-placeholder { text-align:left; }

input, select, textarea, .chosen-single {
  font-size: 14px !important;
}

.tdchosen .chosen-container-single{
  width: calc(100%) !important;
}

/*input icons for login*/
.form-control-position{
  margin-top: -6px !important;
}

.btn-xs,
.btn-group-xs > .btn {
  padding: 1px 5px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}

.table-inside {
    /* border: none !important; */
    width: calc(100% + 0.4%) !important;
    margin-top: -2px;
    /* margin-right: -10px; */
    margin-left: -1px;
    margin-bottom: -1px;
}

/*for report*/
.reportPadding{
  padding-bottom: 25px !important;
}
/*breadcrumbs*/



.breadcrumbs {
  /*centering*/
  cursor: pointer;
  text-align: center;
  display: inline-block;
  box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.35);
  overflow: hidden;
  border-radius: 5px;
  /*Lets add the numbers for each link using CSS counters. flag is the name of the counter. to be defined using counter-reset in the parent element of the links*/
  counter-reset: flag; 
}

.breadcrumbs li {
  text-decoration: none;
  outline: none;
  display: block;
  float: left;
  font-size: 12px;
  line-height: 36px;
  color: white;
  /*need more margin on the left of links to accomodate the numbers*/
  padding: 0 10px 0 60px;
  background: #666;
  background: linear-gradient(#666, #333);
  position: relative;
}
/*since the first link does not have li triangle before it we can reduce the left padding to make it look consistent with other links*/
.breadcrumbs li:first-child {
  padding-left: 46px;
  border-radius: 5px 0 0 5px; /*to match with the parent's radius*/
}
.breadcrumbs li:first-child:before {
  left: 14px;
}
.breadcrumbs li:last-child {
  border-radius: 0 5px 5px 0; /*this was to prevent glitches on hover*/
  padding-right: 20px;
}

/*hover/active styles*/
.breadcrumbs li.active, .breadcrumbs li:hover{
  background: #333;
  background: linear-gradient(#333, #000);
}
.breadcrumbs li.active:after, .breadcrumbs li:hover:after {
  background: #333;
  background: linear-gradient(135deg, #333, #000);
}

/*adding the arrows for the breadcrumbss using rotated pseudo elements*/
.breadcrumbs li:after {
  content: '';
  position: absolute;
  top: 0; 
  right: -18px; /*half of square's length*/
  /*same dimension as the line-height of .breadcrumbs li */
  width: 36px; 
  height: 36px;
  /*as you see the rotated square takes li larger height. which makes it tough to position it properly. So we are going to scale it down so that the diagonals become equal to the line-height of the link. We scale it to 70.7% because if square's: 
  length = 1; diagonal = (1^2 + 1^2)^0.5 = 1.414 (pythagoras theorem)
  if diagonal required = 1; length = 1/1.414 = 0.707*/
  transform: scale(0.707) rotate(45deg);
  /*we need to prevent the arrows from getting buried under the next link*/
  z-index: 1;
  /*background same as links but the gradient will be rotated to compensate with the transform applied*/
  background: #666;
  background: linear-gradient(135deg, #666, #333);
  /*stylish arrow design using box shadow*/
  box-shadow: 
    2px -2px 0 2px rgba(0, 0, 0, 0.4), 
    3px -3px 0 2px rgba(255, 255, 255, 0.1);
  /*
    5px - for rounded arrows and 
    50px - to prevent hover glitches on the border created using shadows*/
  border-radius: 0 5px 0 50px;
}
/*we dont need an arrow after the last link*/
.breadcrumbs li:last-child:after {
  content: none;
}
/*we will use the :before element to show numbers*/
.breadcrumbs li:before {
  content: counter(flag);
  counter-increment: flag;
  /*some styles now*/
  border-radius: 100%;
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin: 8px 0;
  position: absolute;
  top: 0;
  left: 30px;
  background: #444;
  background: linear-gradient(#444, #222);
  font-weight: bold;
}


.flat li, .flat li:after {
  background: white;
  color: black;
  transition: all 0.5s;
}
.flat li:before {
  background: white;
  box-shadow: 0 0 0 1px #ccc;
}
.flat li:hover, .flat li.active, 
.flat li:hover:after, .flat li.active:after{
  background: #9EEB62;
}


  /* Dropdown menu */
  
  .dropup,
  .dropdown {
      position: relative;
      display: inline-block;
  }
  .ui-dialog,
  .ui-datepicker,
  .dropdown-menu,
  .popover,
  .ui-menu,
  .minicolors-panel {
      position: absolute;
      z-index: 1050 !important;
      top: 105%;
      left: 0;
      display: none;
      float: left;
      min-width: 150px;
      margin: 5px 0 0;
      padding: 5px;
      list-style: none;
      text-align: left;
      border-width: 1px;
      border-style: solid;
      background: #fff;
  }
  .ui-datepicker {
      padding: 0;
  }
  .popover,
  .dropdown-menu,
  .ui-dialog {
      box-shadow: 0 1px 7px 2px rgba(135, 158, 171, 0.2);
  }
  .dropdown-menu {
      font-size: 13px;
      line-height: 1.6em;
      min-width: 100%;
      padding: 5px 0;
      text-transform: none;
      border: 0;
  }
  .dropdown-menu {
      min-width: 150px;
  }
  .dropdown-menu,
  .popover,
  .ui-menu,
  .minicolors-panel {
      top: 100%;
  }
  .dropdown-menu .divider {
      margin: 5px 1px;
  }
  .dropdown-menu.float-right {
      right: 0;
      left: auto;
  }
  .dropdown-menu .header {
      font-size: 11px;
      font-weight: bold;
      line-height: 1.4em;
      margin: 0 0 5px;
      padding: 5px 5px 10px;
      text-transform: uppercase;
      color: #888;
      border-bottom: #dfe8f1 solid 1px;
  }
  .dropdown-menu .dropdown-header {
      font-size: 11px;
      font-weight: 300;
      padding: 5px 15px;
      text-transform: uppercase;
      color: #000;
  }
  .dropdown-menu li {
      position: relative;
  }
  .dropdown-menu li > a,
  .ui-menu li > a {
      font-weight: normal;
      line-height: 20px;
      position: relative;
      display: block;
      clear: both;
      margin: 0;
      padding: 3px 20px 3px 15px;
      padding: 5px 15px;
      cursor: pointer;
      white-space: nowrap;
  }
  .dropdown > .dropdown-menu:before,
  .minicolors-position-bottom .minicolors-panel:before {
      position: absolute;
      top: -7px;
      left: 7px;
      display: inline-block;
      content: '';
      border-right: 7px solid transparent;
      border-bottom: 7px solid transparent;
      border-bottom-color: transparent;
      border-left: 7px solid transparent;
  }
  .dropdown > .dropdown-menu:after,
  .minicolors-position-bottom .minicolors-panel:after {
      position: absolute;
      top: -6px;
      left: 8px;
      display: inline-block;
      content: '';
      border-right: 6px solid transparent;
      border-bottom: 6px solid #fff;
      border-left: 6px solid transparent;
  }
  .dropdown > .dropdown-menu.float-right:before,
  .dropup > .dropdown-menu.float-right:before,
  .minicolors-position-right .minicolors-panel:before {
      right: 7px;
      left: auto;
  }
  .dropdown > .dropdown-menu.float-right:after,
  .dropup > .dropdown-menu.float-right:after,
  .minicolors-position-right .minicolors-panel:after {
      right: 8px;
      left: auto;
  }
  .minicolors-inline .minicolors-panel:after,
  .minicolors-inline .minicolors-panel:before {
      display: none;
  }
  .dropdown-dividers {
      padding: 0;
  }
  .dropdown-dividers li {
      padding: 3px;
      border-bottom: #ccc solid 1px;
  }
  .dropdown-dividers li:last-child {
      border-bottom: 0;
  }
  .dropdown-dividers li > a {
      padding: 2px 10px;
  }
  .push-left {
      left: 100% !important;
      margin-left: -30px;
  }
  .open {
      z-index: 1000;
  }
  .open > .dropdown-menu {
      display: block;
  }
  .dropup .dropdown-menu {
      top: auto;
      bottom: 100%;
      margin-bottom: 8px;
  }
  .dropup > .dropdown-menu:before,
  .minicolors-position-top .minicolors-panel:before {
      position: absolute;
      bottom: -7px;
      left: 7px;
      display: inline-block;
      content: '';
      border-top: 7px solid #ccc;
      border-top-color: rgba(0, 0, 0, .2);
      border-right: 7px solid transparent;
      border-left: 7px solid transparent;
  }
  .dropup > .dropdown-menu:after,
  .minicolors-position-top .minicolors-panel:after {
      position: absolute;
      bottom: -6px;
      left: 8px;
      display: inline-block;
      content: '';
      border-top: 6px solid #fff;
      border-right: 6px solid transparent;
      border-left: 6px solid transparent;
  }
  .minicolors-position-top.minicolors-position-right .minicolors-panel:before {
      right: 6px;
      left: auto;
  }
  .minicolors-position-top.minicolors-position-right .minicolors-panel:after {
      right: 7px;
      left: auto;
  }
  .dropdown-submenu {
      position: relative;
      z-index: 40;
  }
  .dropdown-submenu > .dropdown-menu {
      top: 50%;
      left: 90%;
      margin-top: -6px;
      margin-left: -1px;
      border-radius: 0 4px 4px 4px;
  }
  .dropdown-submenu:hover > .dropdown-menu {
      display: block;
  }
  .dropup .dropdown-submenu > .dropdown-menu {
      top: auto;
      bottom: 0;
      margin-top: 0;
      margin-bottom: -2px;
      border-radius: 4px 4px 4px 0;
  }
  .dropdown-submenu > a:after {
      position: relative;
      display: block;
      float: right;
      width: 0;
      height: 0;
      margin-top: 5px;
      margin-right: -5px;
      content: ' ';
      opacity: .40;
      border-width: 5px 0 5px 5px;
      border-style: solid;
      border-color: transparent;
      border-left-color: #ccc;
      -moz-opacity: .40;
      filter: alpha(opacity=40);
  }
  .dropdown-submenu.float-left > .dropdown-menu {
      left: -100%;
  }
  .dropdown-submenu:hover > a:after {
      border-left-color: #fff;
  }
  .dropdown-submenu.float-left {
      float: none !important;
  }
  .dropdown-submenu.float-left > .dropdown-menu {
      left: -110%;
      margin-left: 10px;
      border-radius: 4px 0 4px 4px;
  }
  .dropdown-submenu.float-left > .dropdown-menu.dropdown-dividers {
      margin-left: 20px;
  }
  .ui-menu-item {
      padding: 3px 6px;
  }

/*end of dropdown menu*/


/*for table word wrap
.table{
  white-space: nowrap;
}
*/


/*disable text selection */
.noselect {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}



/*alignment*/
.center {
  text-align: center !important;
}

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

.form-normal{
  width: 100%;
  border: none;
  text-align: right;
  font-weight: bold;
  padding-right: 2px;
  resize: none;
}

.form-normal:focus{
  outline: none;
}


.borderless td, .borderless th {
  border: none !important;
}


/*buttons*/
.btn-outline-info.focus, .btn-outline-info:focus {
  color: white !important;
  background-color: #1E9FF2 !important;
}

.btn-outline-danger.focus, .btn-outline-danger:focus {
  color: white !important;
  background-color: #FF4961 !important;
}


.btn-outline-success.focus, .btn-outline-success:focus {
  color: white !important;
  background-color: #28D094 !important;
}


/* for report */
.right{
  text-align: right !important;
    padding-right:5px !important;
}
.left{
  text-align: left !important;
}
.center{
  text-align: center !important;
}
.subparent {
  font-weight: bold !important;
  padding-left: 25px !important;
}
.children {
  padding-left: 50px !important;
  font-style: italic !important; 
}

.italic {
  font-style: italic !important; 
}


/* for table color */


.shortcut {
  display: inline-block;
  margin: 0 auto;
  background: #c4c6bf;
  width: 45px;
  height: 1.5rem;
  line-height: 1.4rem;
  text-align: center;
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: 4px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.5),
    0 2px 2px rgba(0,0,0,0.3),
    0 0 4px 1px rgba(0,0,0,0.2);
  /* Font styles */
  text-decoration: none;
  text-shadow: 0 1px rgba(255,255,255,0.7);
}

#toast-container>div{
  width: 400px !important;
  opacity: .95 !important;
}


/*contextmenu */

.context-menu-icon.context-menu-icon-save:before
{
  font-family: FontAwesome !important;
}

.context-menu-icon.context-menu-icon-save:before {
  content: "\f0c7"; /* fa-floppy-o */
}


/*new ui*/

.inputnoborder {
        border: 0 !important;
        outline: 0 !important;
        padding: 5px;
        background: transparent;
    }
    .tbody .form-control {
        height: 32px !important;
        border-radius: 0;
    }

    .tbody .chosen-container-single .chosen-single {
        border: 0;
        border-radius: 0;
    }

    .tbody tr:hover {
        box-shadow: 0 4px 5px -2px #e5e5e5,
        0 -2px 4px -2px #e5e5e5;
    }
    .remove {
        text-align: center;
    }

    thead.header {
        background: linear-gradient(#fafafa, #f1f2f4);

    }

    thead.header th {
        text-align: center;
        height: 35px;
        vertical-align: middle;
    }
    .form-control:disabled,
    .form-control[readonly],
    .input-group-addon {
        background-color: transparent;
    }

    .readonly {
      background-color: #0000000d;
    }

    .input-group-text{
        padding: .5rem .3rem;
        background: linear-gradient(#fafafa, #f1f2f4);
    }

    /* .btn{
        box-shadow: rgba(255,255,255,0.3) 0 0 0 1px inset;
    }
    .btn-success {
        border: 1px solid #52ac33 !important;
        background: linear-gradient(#63b235, #70cd3f) !important;
    }
    .btn-success:hover {
        border: 1px solid #52ac33 !important;
    }
    .btn-danger {
        border: 1px solid #949a9e !important;
        background: linear-gradient(#b8bcc0, #949a9e) !important;
    }

    .btn-danger:hover {
        border: 1px solid #949a9e !important;
    }

    .btn-primary {
        border: 1px solid #0078a5 !important;
        background: linear-gradient(#00b1e6,#0382b3);
    }

    .btn-primary:hover {
        background-color: #0079a1 !important;
        border: 1px solid #0079a1 !important;
    }

    .btn-primary:focus{
      background: linear-gradient(#00c1e6,#0342b3);
      border: 1px solid green !important;
    } */



    /** Button Icon **/
    .btn-iconed {
        -webkit-transition: .15s ease-in-out;
        transition: .15s ease-in-out;
        padding-left: 1.3rem;
        padding-right: .25rem;
    }
    .btn-iconed [class~=fa],
    .btn-iconed [class~=typcn]::before{
        opacity: 0;
        -webkit-transform-origin: left right;
        transform-origin: left right;
        -webkit-transform: translateX(-10px) scale(1.25);
        transform: translateX(-10px) scale(1.25);
        -webkit-transition: .15s ease-out;
        transition: .15s ease-out;
    }
    .btn-iconed:hover [class~=oi], .btn-iconed:hover [class~=fa],
    .btn-iconed:hover [class~=mdi]::before, .btn-iconed:hover [class~=icon]::before, .btn-iconed:hover [class~="typcn"]::before {
        opacity: 1;
        -webkit-transform: translateX(0px) scale(0.75);
        transform: translateX(0px) scale(0.75);

    }

    .btn-pure{
      padding: .40rem .25rem !important;
    }

    .active-result{
      border-bottom: 1px solid #ddd;
      color: #000;
    }

    .main-menu.menu-light .navigation li a,
    .main-menu.menu-light,
    .input-group-text,
    .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6,
    body
    {
      color: #000;
    }

.box-title{
    padding: 10px 10px 10px 20px;
    color: #0B0C0F;
    border-radius: 5px;
    font-size: 25px;
    display: block;
}
.title-sales{
    background: linear-gradient(#fafafa, #f1f2f4);
    border: 1px solid #FFF;
    box-shadow: 0 0 8px #d3d3d3;
}
.title-purchase{
    background: linear-gradient(#dfe9f3, #ffffff);
    border: 1px solid #dfe9f3;
    box-shadow: 0 0 8px #dfe9f3;

}


/*chosen item hover */
.chosen-container .chosen-results .d-flex span{
  color: rgba(0,0,0,0.5);
}

.chosen-container .chosen-results .highlighted .d-flex span{
  color: white;
}


.tncContent li{
    list-style: inherit !important;
  }


/* for dashboard or party details cards */
.party-info-container {
    height: 85px;
    background: linear-gradient(135deg, #ffffff 0%, #f8f7ff 100%);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0,0,0,0.08);
    border: 1px solid rgba(230,232,236,0.8);
}

.party-info-flex {
    display: flex;
    height: 100%;
}

.balance-section {
    width: 180px;
    padding: 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: linear-gradient(to right, rgba(248,247,255,0.8), rgba(248,247,255,0.4));
    position: relative;
}

.balance-section::after {
    content: '';
    position: absolute;
    right: 0;
    top: 15%;
    height: 70%;
    width: 1px;
    background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.08), transparent);
}

.balance-label {
    color: #6d28d9;
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.balance-amount {
    color: #7c3aed;
    font-size: 1.2em;
    font-weight: 600;
    margin-top: 5px;
}

.details-section {
    flex: 1;
    padding: 5px 15px;
    background: linear-gradient(to right, rgba(248,247,255,0.4), rgba(255,255,255,0.8));
}

.details-scroll {
    height: 100%;
    overflow-y: auto;
    padding-right: 5px;
}

.details-scroll::-webkit-scrollbar {
    width: 4px;
}

.details-scroll::-webkit-scrollbar-track {
    background: rgba(124,58,237,0.05);
    border-radius: 4px;
}

.details-scroll::-webkit-scrollbar-thumb {
    background: rgba(124,58,237,0.1);
    border-radius: 4px;
}

.detail-row {
    color: #5f6368;
    padding: 3px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    font-size: 0.9em;
}

.detail-row span {
    display: flex;
    align-items: center;
}

.detail-row i {
    margin-right: 8px;
    color: #7c3aed;
}

.party-info-empty {
    height: 85px;
    border: 1px solid rgba(230,232,236,0.8);
    padding: 5px;
    border-radius: 12px;
    background: linear-gradient(135deg, #f8f7ff 0%, #f3f4ff 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

.party-info-empty .empty-text {
    text-align: center;
    color: #6d28d9;
    font-size: 0.95rem;
}

/* for input and select  */

/* Input and Select Styling */
input.form-control,
select.form-control,
textarea.form-control {
    height: 42px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #ffffff;
    transition: all 0.2s;
    font-size: 0.875rem;
    padding: 8px 12px;
    color: #1e293b;
}

input.form-control:hover,
select.form-control:hover,
textarea.form-control:hover {
    border-color: #cbd5e1;
}

input.form-control:focus,
select.form-control:focus, 
textarea.form-control:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
    outline: none;
}

.input-group-text {
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    color: #64748b;
    font-size: 0.875rem;
    border-radius: 8px 0 0 8px;
    transition: all 0.2s;
}

.input-group .form-control {
    border-radius: 0 8px 8px 0;
}

.input-group:hover .input-group-text {
    border-color: #cbd5e1;
}

.input-group:focus-within .input-group-text {
    border-color: #6366f1;
}
/* Select2 Custom Styling */
	.select2-container--default .select2-selection--single {
		height: 48px;
		border: 2px solid #e2e8f0;
		border-radius: 8px;
		background: #ffffff;
		transition: all 0.2s;
	}
	.select2-container--default .select2-selection--single:hover {
		border-color: #cbd5e1;
	}
	.select2-container--default.select2-container--open .select2-selection--single {
		border-color: #6366f1;
		box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.1);
	}
	.select2-container--default .select2-selection--single .select2-selection__rendered {
		line-height: 46px;
		padding-left: 16px;
		color: #1e293b;
	}
	.select2-container--default .select2-selection--single .select2-selection__arrow {
		height: 46px;
		width: 30px;
	}
	.select2-container--default .select2-results__option--highlighted[aria-selected] {
		background-color: #6366f1;
	}
	.select2-dropdown {
		border: 2px solid #6366f1;
		border-radius: 8px;
		box-shadow: 0 4px 12px rgba(0,0,0,0.1);
	}
	.select2-search--dropdown .select2-search__field {
		padding: 8px;
		border: 2px solid #e2e8f0;
		border-radius: 6px;
	}
	.select2-search--dropdown .select2-search__field:focus {
		border-color: #6366f1;
		outline: none;
	}
	.select2-results__option {
		padding: 10px 16px;
		font-size: 0.95rem;
	}
	.select2-results__option[aria-selected=true] {
		background-color: #f1f5f9;
	}

/* Material Button Styles */
.btn {
    position: relative;
    border: none;
    border-radius: 6px;
    transition: all 0.2s ease;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

.btn:hover {
    box-shadow: 0 3px 6px rgba(0,0,0,0.16);
    transform: translateY(-1px);
}

.btn:active {
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    transform: translateY(0);
}

.btn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 5px;
    height: 5px;
    background: rgba(255,255,255,0.6);
    opacity: 0;
    border-radius: 100%;
    transform: scale(1, 1) translate(-50%);
    transform-origin: 50% 50%;
}

.btn:focus:not(:active)::after {
    animation: ripple 0.8s ease-out;
}

/* Modern Material Design Colors */
.btn-primary {
    background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
    color: #ffffff;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%);
}

.btn-success {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: #ffffff;
}

.btn-success:hover {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
}

.btn-danger {
    background: linear-gradient(135deg, #f43f5e 0%, #e11d48 100%);
    color: #ffffff;
}

.btn-danger:hover {
    background: linear-gradient(135deg, #e11d48 0%, #be123c 100%);
}

.btn-warning {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: #ffffff;
}

.btn-warning:hover {
    background: linear-gradient(135deg, #d97706 0%, #b45309 100%);
}

.btn-info {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    color: #ffffff;
}

.btn-info:hover {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
}

/* Ripple Animation */
@keyframes ripple {
    0% {
        transform: scale(0, 0);
        opacity: 1;
    }
    20% {
        transform: scale(25, 25);
        opacity: 0.8;
    }
    100% {
        opacity: 0;
        transform: scale(40, 40);
    }
}


/* Cool Typography Styles */

/* Modern Sans-Serif */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Body Text */
p, li, td, th, input, select, textarea {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    line-height: 1.6;
    color: #475569;
}

/* Links */
a {
    font-weight: 500;
    color: #6366f1;
    text-decoration: none;
    transition: color 0.2s;
}

a:hover {
    color: #4f46e5;
    /* text-decoration: underline; */
}

/* Labels & Small Text */
label, .small-text {
    font-family: 'Inter', sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.025em;
    color: #64748b;
}

/* Code & Monospace */
code, pre {
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    font-size: 0.9em;
    background: #f8fafc;
    padding: 0.2em 0.4em;
    border-radius: 4px;
}

/* Blockquotes */
blockquote {
    font-family: 'Merriweather', serif;
    font-style: italic;
    font-size: 1.1em;
    line-height: 1.7;
    color: #334155;
    border-left: 4px solid #6366f1;
    padding-left: 1.5em;
    margin: 1.5em 0;
}

/* Font Import */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Poppins:wght@500;600;700&family=Merriweather:ital@0;1&family=JetBrains+Mono&display=swap');


/* for payment  */
.charge-card {
  background: #ffffff;
  border-radius: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  padding: 32px;
  margin-bottom: 24px;
  transition: all 0.3s ease;
}
.charge-card-header {
  margin-bottom: 32px;
  position: relative;
  padding-bottom: 16px;
  border-bottom: 2px solid #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.charge-card-header:after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 60px;
  height: 2px;
  background: #6366f1;
  border-radius: 2px;
}
.charge-card-header h5 {
  color: #1e293b;
  font-weight: 700;
  font-size: 1.25rem;
  margin: 0;
}
.charge-card-body {
  margin-bottom: 24px;
}
.form-group {
  margin-bottom: 24px;
}
.transactionChargeCard {
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.transactionChargeCard.show {
  display: block;
  opacity: 1;
}
.label-text {
  font-size: 14px;
  font-weight: 600;
  line-height: 21px;
  color: rgb(71, 79, 92);
}
.charge-toggle-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
}
.charge-toggle-label {
  margin: 0;
}
.charge-toggle-text {
  font-size: 14px;
  font-weight: 600;
  line-height: 21px;
  color: rgb(71, 79, 92);
}
.amount-label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.amount-icon {
  color: #6366f1;
}
.amount-words {
  min-height: 100px;
  padding: 16px;
  font-size: 1.1rem;
  font-weight: 500;
  color:rgb(28, 42, 66);
  background: #f8fafc;
  border: 1px dashed #cbd5e1;
  border-radius: 12px;
  transition: all 0.2s;
}
.textarea {
  min-height: 50px !important;
  font-size: 1.1rem;
  color: #1e293b;
  border: 1px dashed #cbd5e1 !important;
  border-radius: 12px;
  transition: all 0.2s;
}

.card-hover:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
  transition: all 0.3s ease;
  border-color: #e3e6f0;
}


/* for maintenance */
.tag-badge {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 15px;
  background: linear-gradient(135deg, #818cf8, #6366f1);
  color: white;
  font-weight: 500;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  transition: all 0.3s ease;
  opacity: 1;
  transform: scale(1);
}
.tag-badge.new-tag {
  animation: tagFadeIn 0.3s ease-in-out forwards;
}

.tag-badge:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 6px rgba(0,0,0,0.15);
}
.tag-container {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.tag-close {
  cursor: pointer;
  margin-left: 0.5rem;
  opacity: 0.8;
  transition: opacity 0.2s ease;
}
.tag-close:hover {
  opacity: 1;
}
@keyframes tagFadeIn {
  0% {
      opacity: 0;
      transform: scale(0.8);
  }
  100% {
      opacity: 1;
      transform: scale(1);
  }
}

/* for swal template */
/* Materialize style for SweetAlert */
.swal2-popup {
  border-radius: 4px !important;
  padding: 1.5rem !important;
  font-family: 'Roboto', sans-serif !important;
  box-shadow: 0 8px 16px rgba(0,0,0,0.1) !important;
}

.swal2-title {
  font-size: 1.5rem !important;
  font-weight: 500 !important;
  color: rgba(0,0,0,0.87) !important;
  margin-bottom: 0.5rem !important;
}

.swal2-html-container {
  /* font-size: 1rem !important; */
  color: rgba(0,0,0,0.67) !important;
  line-height: 1.5 !important;
}

.swal2-actions {
  margin-top: 1.5rem !important;
  gap: 0.75rem !important;
}

/* Button styles */
.swal2-styled {
  position: relative !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  letter-spacing: 0.5px !important;
  font-size: 0.875rem !important;
  padding: 0.75rem 1.5rem !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 3px 1px -2px rgba(0,0,0,0.2), 
              0 2px 2px 0 rgba(0,0,0,0.14), 
              0 1px 5px 0 rgba(0,0,0,0.12) !important;
  border: none !important;
  outline: none !important;
}

.swal2-styled:focus {
  box-shadow: 0 5px 5px -3px rgba(0,0,0,0.2), 
              0 8px 10px 1px rgba(0,0,0,0.14), 
              0 3px 14px 2px rgba(0,0,0,0.12) !important;
}

.swal2-styled::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: rgba(255,255,255,0.1) !important;
  opacity: 0 !important;
  transition: opacity 0.2s !important;
  border-radius: inherit !important;
}

.swal2-styled:hover::before {
  opacity: 1 !important;
}
.swal2-styled.swal2-confirm {
  box-shadow: 0 4px 6px rgba(0,0,0,0.15);
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important; /* Changed to green */
  color: #fff !important;
}

.swal2-styled.swal2-cancel {
  box-shadow: 0 4px 6px rgba(0,0,0,0.15);
  background: linear-gradient(135deg, #f43f5e 0%, #e11d48 100%) !important; /* Changed to red */
  color: #fff !important;
}

/* Icon styles */
.swal2-icon {
  border-width: 2px !important;
  margin: 1.5rem auto !important;
}

.swal2-icon.swal2-warning {
  border-color: #ff9800 !important;
  color: #ff9800 !important;
}

.swal2-icon.swal2-error {
  border-color: #f44336 !important;
  color: #f44336 !important;
}

.swal2-icon.swal2-success {
  border-color: #4CAF50 !important;
  color: #4CAF50 !important;
}

.swal2-icon.swal2-info {
  border-color: #2196F3 !important;
  color: #2196F3 !important;
}

.swal2-icon.swal2-question {
  border-color: #673ab7 !important;
  color: #673ab7 !important;
}

/* Animation */
.swal2-show {
  animation: swal2-show 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.swal2-hide {
  animation: swal2-hide 0.15s forwards !important;
}

@keyframes swal2-show {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes swal2-hide {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(0.8);
    opacity: 0;
  }
}

.input-group>.input-group-append>.input-group-text {
  border-radius: 0px 8px 8px 0px !important;
}


/* for tinymce */
.tox-tinymce {
  border-radius: 4px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  border: 1px solid #e0e0e0 !important;
}
.tox-editor-container {
  background-color: #fff;
}
.tox-toolbar {
  background-color: #f8f9fa !important;
  border-bottom: 1px solid #e0e0e0 !important;
}
.tox-toolbar__group {
  border-right: 1px solid #e0e0e0 !important;
}
.tox-tbtn {
  border-radius: 3px !important;
  transition: background-color 0.2s ease;
}
.tox-tbtn:hover {
  background-color: #e9ecef !important;
}
.tox-tbtn--enabled {
  background-color: #e9ecef !important;
}
.tox-edit-area {
  border-top: 1px solid #e0e0e0 !important;
}
.tox-statusbar {
  border-top: 1px solid #e0e0e0 !important;
}
.quotation_content {
  min-height: 250px;
  width: 100%;
}
.tox-collection__item {
  transition: background-color 0.2s ease;
}
.tox-collection__item--active {
  background-color: #007bff !important;
  color: white !important;
}

.tox-statusbar__right-container {
  display: none !important;
}

/* for dropdown menu used in reports etc. */

.dropdown-menu {
  max-height: 300px;
  overflow-y: auto;
  border-radius: 4px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  padding: 8px 0;
  background: #fff;
  /* Custom Scrollbar */
  scrollbar-width: thin;
  scrollbar-color: rgba(0,0,0,0.2) transparent;
}

.dropdown-menu::-webkit-scrollbar {
  width: 6px;
}

.dropdown-menu::-webkit-scrollbar-track {
  background: transparent;
}

.dropdown-menu::-webkit-scrollbar-thumb {
  background-color: rgba(0,0,0,0.2);
  border-radius: 3px;
}

.dropdown-menu li {
  position: relative;
}

.dropdown-menu li:not(:last-child) {
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

.dropdown-menu .dropdown_label {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 12px 16px;
  margin: 0;
  cursor: pointer;
  transition: background-color 0.2s;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dropdown-menu .dropdown_label:hover {
  background-color: rgba(0,0,0,0.04);
}

.dropdown-menu .switch {
  margin-right: 12px;
  flex-shrink: 0;
}

/* for report placeholder */

#table-area {
  margin: 30px 10px;
}

.report-placeholder {
  margin: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px 20px;
  text-align: center;
}

.report-placeholder svg {
  width: 120px;
  height: 120px;
  margin-bottom: 20px;
}

.report-placeholder h3 {
  color: #555;
  margin-bottom: 15px;
  font-weight: 500;
}

.report-placeholder p {
  color: #777;
  max-width: 500px;
  margin: 0 auto 20px;
}

.report-steps {
  display: flex;
  justify-content: center;
  margin-top: 15px;
  flex-wrap: wrap;
}

.report-step {
  display: flex;
  align-items: center;
  margin: 5px 15px;
  color: #666;
}

.report-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background-color: #1db954;
  color: white;
  border-radius: 50%;
  margin-right: 8px;
  font-size: 14px;
}

/* for modal */

.modal-content {
  border: none;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.modal-header {
  border-bottom: 1px solid #f0f0f0;
  padding: 20px 24px;
}

.modal-title, .modal-header h4, .modal-header h5, .ui-dialog-title {
  font-weight: 600;
  color: #1a237e;
}

.modal-body {
  min-height: auto;
  max-height: 75vh;
  overflow-y: auto;
}

/* Toggle Switch */
.switch {
  position: relative;
  display: inline-block;
  width: 33px;
  height: 12px;
  margin: 0;
}


.slider_switch {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #888ea8;
  transition: 0.2s ease-in-out;
}

.slider_switch:before {
  position: absolute;
  content: "";
  height: 18px;
  width: 18px;
  left: 0px;
  bottom: -2.8px !important;
  background-color: white;
  transition: 0.2s ease-in-out;
  box-shadow: 0 1px 15px 1px rgba(52, 40, 104, 0.34);
}

.slider_switch:after {
  position: absolute;
  left: 5px;
  top: -1px;
  content: "\f011"; /* FontAwesome 4 power off icon */
  font-family: 'FontAwesome';
  font-size: 10px;
  text-align: center;
  color:rgb(202, 14, 14);
  transition: 0.2s ease-in-out;
  line-height: 1.5;
}

input:checked + .slider_switch:after {
  color: #1db954;
}

input:checked + .slider_switch {
  background-color: #1db954;
}

input:checked + .slider_switch:before, input:checked + .slider_switch:after {
  transform: translateX(16px);
}

.slider_switch.round:before {
  border-radius: 50%;
}

input.form-not-editable{
	background-color: rgb(242 245 252) !important;
	cursor: not-allowed !important;
}