/* Overlay styling */
.loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1050; /* Above everything else */
}

/* Hide the overlay by default */
.loading-overlay.hidden {
    display: none;
}
/* MODAL POPUP */
.flatpickr-current-month{
    color: black;
}
.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month{
   fill: black;
}
@keyframes mdl-fadein {
    0%    { opacity: 0; }
    100%   { opacity: 0.1; }
  }
  
  @keyframes mdl-fadeout {
    0%    { opacity: 0.1; }
    100%   { opacity: 0; }
  }
  
  @-webkit-keyframes mdl-show {
    0% {
      transform: scale(.5);
    }
  
    100% {
      transform: scale(1);
    }
  }
  
  @keyframes mdl-show {
    0% {
      transform: scale(.5);
    }
  
    100% {
      transform: scale(1);
    }
  }
  
  @-webkit-keyframes mdl-hide {
    0% {
      transform: scale(1);
      opacity: 1;
    }
  
    100% {
      transform: scale(.5);
      opacity: 0;
    }
  }
  
  @keyframes mdl-hide {
    0% {
      transform: scale(1);
      opacity: 1;
    }
  
    100% {
      transform: scale(.5);
      opacity: 0;
    }
  }
  
  html.mdl-shown,
  body.mdl-shown {
      height:100%;
      overflow: hidden;
  }
  
  .mdl-spinner{color:#0062cc}
  
  .mdl-container {
      display: flex;
      position: fixed;
      z-index: 1091;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      min-height: 100vh;
      align-items: center;
      background: 0 0;
      justify-content: center;
      flex-direction: row;
      overflow-x: hidden;
      overflow-y: auto!important;
      transition: all .15s;
      -webkit-transition: all .15s;
      -o-transition: all .15s; 
      -webkit-overflow-scrolling: touch;
  }
  
  .mdl-container.mdl-touch-none {
      opacity:0;
      pointer-events:none;
  }
  
  .mdl-container.mdl-backdrop-show {
    background: rgba(0,0,0,.1) !important;
    -webkit-animation: mdl-fadein .15s backwards;
    animation: mdl-fadein .15s backwards;
    animation-iteration-count: 1;
  }
  
  .mdl-container.mdl-backdrop-hide {
    background: 0 0!important;
  }
  
  .mdl-container.mdl-backdrop-none{
      background: rgba(0,0,0,0) !important;
  }
  
  .mdl-container .mdl-popup {
      position: relative;
      display: none;
      justify-content: center;
      align-items: center;
      width: 100%;
      max-width:500px;
      height: 100%;
      margin: 0 15px;
  }
  
  .mdl-container .mdl-popup.mdl-md-ws{
      max-width:600px;
  }
  
  .mdl-container .mdl-popup.mdl-lg-ws{
      max-width:800px;
  }
  
  .mdl-container .mdl-popup.mdl-xl-ws{
      max-width:1000px;
  }
  .mdl-container .mdl-popup.mdl-xxl-ws{
      max-width:1200px;
  }
  .mdl-container .mdl-popup.mdl-fullscreen-ws{
      max-width: 100%;
      margin: 0;
  }
  
  .mdl-show {
      display: flex !important;
      -webkit-animation: mdl-show .15s backwards;
      animation: mdl-show .15s backwards;
      animation-iteration-count: 1;
  }
  
  .mdl-hide {
      display: flex !important;
      -webkit-animation: mdl-hide .15s forwards;
      animation: mdl-hide .15s forwards;
      animation-iteration-count: 1;
  }
  
  .mdl-container .mdl-popup .mdl-modal {
      width: 100%;
      margin: auto;
  }
  
  .mdl-popup .mdl-modal .mdl-wrapper{
      position: relative;
      background-color:#fff;
      background-clip: padding-box;
      border-radius: 0.3125rem;
      margin:1rem 0;
      box-shadow: 0 2px 14px rgba(38, 60, 85, 0.16);
  }
  
  .dark-style .mdl-popup .mdl-modal .mdl-wrapper{
      background-color: #283144;
  }
  
  .mdl-popup .mdl-modal .mdl-wrapper.mdl-loading {
      min-height:100px;
      display:flex;
      justify-content:center;
      align-items:center;
  }
  
  .mdl-wrapper.mdl-text-center{
      text-align:center;
  }
  
  .mdl-wrapper .mdl-close{
      position:absolute;
      right:0;
      top:0;
      display:flex;
      justify-content:center;
      align-items:center;
      width: 1.2em;
      height: 1.2em;
      font-family: monospace;
      font-size: 2.5em;
      cursor:pointer;
  }
  
  .mdl-wrapper .modal-header,.mdl-wrapper .modal-body,.mdl-wrapper .modal-footer{
      padding:1rem !important;
  }
  
  .mdl-modal-icon {
      display:flex;
      width: 100%;
      align-items: center;
      justify-content: center;
      margin-bottom:1.25rem;
      transform: scale(0.6);
      transform-origin: top center;
      margin-bottom: calc((0.6 - 1) * 150px);
  }
  
  .success-icon {
    display: inline-block;
    width: 8em;
    height: 8em;
    font-size: 20px;
    border-radius: 50%;
    border: 4px solid #96df8f;
    background-color: #fff;
    position: relative;
    overflow: hidden;
    transform-origin: center;
    -webkit-animation: showSuccess 180ms ease-in-out;
    animation: showSuccess 180ms ease-in-out;
  }
  
  .success-icon__tip {
    width: 2.4em;
    top: 4.3em;
    left: 1.4em;
    transform: rotate(45deg);
    -webkit-animation: tipInPlace 300ms ease-in-out;
    animation: tipInPlace 300ms ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 180ms;
    animation-delay: 180ms;
    visibility: hidden;
  }
  
  .success-icon__long {
    width: 4em;
    transform: rotate(-45deg);
    top: 3.7em;
    left: 2.75em;
    -webkit-animation: longInPlace 140ms ease-in-out;
    animation: longInPlace 140ms ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    visibility: hidden;
    -webkit-animation-delay: 440ms;
    animation-delay: 440ms;
  }
  
  .success-icon__tip, .success-icon__long {
    display: block;
    position: absolute;
    height: 4px;
    background-color: #96df8f;
    border-radius: 10px;
  }
  
  .error-icon {
    display: inline-block;
    width: 8em;
    height: 8em;
    font-size: 20px;
    border-radius: 50%;
    border: 4px solid #f27474;
    background-color: #fff;
    position: relative;
    overflow: hidden;
    transform-origin: center;
    -webkit-animation: error-icon .5s;
    animation: error-icon .5s;
  }
  
  .error-icon__x-mark {
    position: relative;
    flex-grow: 1;
    -webkit-animation: error-x-mark .5s;
    animation: error-x-mark .5s;
  }
  
  .error-icon__x-mark-line-left,
  .error-icon__x-mark-line-right{
      display: block;
      position: absolute;
      top: 3.5em;
      width: 4em;
      height: .3em;
      border-radius: .4em;
      background-color: #f27474;
  }
  .error-icon__x-mark-line-left{
      left: 1.8em;
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg);
  }
  .error-icon__x-mark-line-right{
      right: 1.8em;
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg);
  }
  @keyframes showSuccess {
    from {
      transform: scale(0);
    }
    to {
      transform: scale(1);
    }
  }
  
  @keyframes tipInPlace {
    from {
      width: 0em;
      top: 0em;
      left: -1.6em;
    }
    to {
      width: 2.4em;
      top: 4.3em;
      left: 1.4em;
      visibility: visible;
    }
  }
  
  @keyframes longInPlace {
    from {
      width: 0em;
      top: 5.1em;
      left: 3.2em;
    }
    to {
      width: 4em;
      top: 3.7em;
      left: 2.75em;
      visibility: visible;
    }
  }
  
  @-webkit-keyframes error-x-mark{
      0%{
          margin-top:1.625em;
          -webkit-transform:scale(.4);
          transform:scale(.4);
          opacity:0
      }
      50%{
          margin-top:1.625em;
          -webkit-transform:scale(.4);
          transform:scale(.4);
          opacity:0
      }
      80%{
          margin-top:-.375em;
          -webkit-transform:scale(.8);
          transform:scale(.8)
      }
      100%{
          margin-top:0;
          -webkit-transform:scale(1);
          transform:scale(1);
          opacity:1
      }
  }
  @keyframes error-x-mark{
      0%{
          margin-top:1.625em;
          -webkit-transform:scale(.4);
          transform:scale(.4);
          opacity:0
      }
      50%{
          margin-top:1.625em;
          -webkit-transform:scale(.4);
          transform:scale(.4);
          opacity:0
      }
      80%{
          margin-top:-.375em;
          -webkit-transform:scale(.8);
          transform:scale(.8)
      }
      100%{
          margin-top:0;
          -webkit-transform:scale(1);
          transform:scale(1);
          opacity:1
      }
  }
  @-webkit-keyframes error-icon{
      0%{
          -webkit-transform:rotateX(100deg);
          transform:rotateX(100deg);
          opacity:0
      }
      100%{
          -webkit-transform:rotateX(0);
          transform:rotateX(0);
          opacity:1
      }
  }
  @keyframes error-icon{
      0%{
          -webkit-transform:rotateX(100deg);
          transform:rotateX(100deg);
          opacity:0
      }
      100%{
          -webkit-transform:rotateX(0);
          transform:rotateX(0);
          opacity:1
      }
  }
  
  /* END MODAL POPUP */
  
  .form-select:disabled{background-color:#fff}
  
  table.dataTable thead .sorting::before,
  table.dataTable thead .sorting_asc::before,
  table.dataTable thead .sorting_desc::before{top:0.5rem;content:"\ea32";}
  table.dataTable thead .sorting::after,
  table.dataTable thead .sorting_asc::after,
  table.dataTable thead .sorting_desc::after{top:1rem;content:"\ea29";}
  div.dataTables_wrapper div.dataTables_paginate ul.pagination .page-link{text-align:center;border-radius:2px}
  .formbox-wrapper{margin-bottom:1rem}
  .formbox-items{
      display:flex;
      flex-wrap:wrap;
      align-items:stretch;
      margin-right: calc(1.5rem * -0.5);
      margin-left: calc(1.5rem * -0.5);
  }
  .formbox-item{
      flex-shrink: 0;
      width:33.333333%;
      max-width: 100%;
      padding-right: calc(1.5rem * 0.5);
      padding-left: calc(1.5rem * 0.5);
      margin-bottom:.25rem;
  }
  .formbox-item textarea {
    resize: none;
  }
  
  .formbox-subitems{
      width:100%;
  }
  
  .formbox-subitems .formbox-subitem{position:relative;margin-bottom:3.75rem}
  .formbox-subitems .formbox-subitem::last-child{margin-bottom:54px}
  
  .formbox-subitems .formbox-subitem:not(::last-child) {
      margin-bottom:.5rem;
  }
  
  .formbox-subitems .formbox-subitem .formbox-button-container{
      position: absolute;
      width: 100%;
      display:flex;
      justify-content: flex-end;
      margin-top:1.25rem;
  }
  
  .formbox-subitems .formbox-subitem.dummy{
      position:relative;
      pointer-events:none;
      height:89.7px;
  }
  
  .formbox-subitems .formbox-subitem:not(.dummy)::before{
      content:attr(data-number);;
      position: absolute;
      bottom:1px;
      right:1px;
      background-color: rgba(244,244,244,.6);
      padding: 1px 10px;
      margin-left: 4px;
      font-weight:bold;
      border-radius: 5px 0 0 5px;
  }
  
  .formbox-subitems .formbox-subitem::last-child.dummy{
      height:143.7px;
  }
  
  .formbox-subitem .invalid-feedback{
      position:absolute;
      top:100%;
      left:0;
  }
  
  .formview-wrapper{
      position:relative;
      overflow:hidden;
      overflow-x:auto;
  }
  
  .formview-wrapper .page-break{
      page-break-before: always;
  }
  
  .formview-wrapper .page-auto{
      page-break-before: auto;
  }
  
  .formview-wrapper table{width:100%}
  
  .formview-wrapper .formhead-table,.formview-wrapper .formview-table,.formview-wrapper .formsocial-table{
      width:100%;
      border-collapse: collapse;
      border-spacing:0;
  }
  
  .formview-wrapper h3{margin:0 0 .5rem 0}
  
  .formview-wrapper .formhead-table thead{
      display:table-header-group;
  }
  
  .formview-wrapper .formsocial-table th{
      white-space:nowrap;
  }
  
  .formview-wrapper .formsocial-table th,.formview-wrapper .formsocial-table td{
      border:0;
      font-size:12px;
      padding:5px;
  }
  
  .formview-wrapper .formhead-table td{
      width:50%;
      font-size:0.812rem;
      vertical-align:middle;
  }
  
  .formview-wrapper .formview-table{border-bottom:1px solid #000}
  
  .formview-wrapper .formview-table td{
      width:20%;
      font-size:12px;
      border:1px solid #000;
      padding: .2515rem;
      letter-spacing: 1px;
      vertical-align:middle;
      color:#000;
      page-break-inside: avoid;
  }
  
  .formview-wrapper .formview-table td.bold:not(.wrap){
      width:1%;
      font-weight: bold;
  }
  
  .formview-wrapper .formview-table td.bold.wrap{
      width:1%;
      white-space: nowrap;
      font-weight: bold;
  }
  
  .formview-wrapper .formview-table td.bold span{
      font-weight: normal;
  }
  
  .formview-wrapper .formview-table td.fm{
      font-size: .55rem;
      text-align:center;
      font-style: italic;
  }
  
  .formview-wrapper .formview-table tr.gray{
      background-color:#e7e6e6;
  }
  
  .formview-wrapper .formview-table tr.gray.thick td{
      border-top:2px solid #000 !important;
  }
  
  .formview-wrapper .formview-table tr.by-0 > td{
      border-top:0;
      border-bottom:0;
      vertical-align:top;
  }
  
  .formview-wrapper .formview-table tr.bb-0 > td{
      border-bottom:0;
  }
  
  .formview-wrapper .formview-table td.bx-0{
      border-left:0;
      border-right:0;
  }
  
  .formview-wrapper .formview-table td.br-0{
      border-right:0;
  }
  .formview-wrapper .formview-table td.bl-0{
      border-left:0;
  }
  
  .formview-wrapper .formview-table td.p-0{
      padding:0;
  }
  
  .formview-wrapper .formview-table td.py-0{
      padding-top:0;
      padding-bottom:0;
  }
  
  .formview-wrapper .formview-table tr.bb-1 > td{
      border-bottom:1px solid #000 !important;
  }
  
  .formview-wrapper .formview-table td .line-up{
      display: inline-block;
      padding: .2515rem;
      border-right:1px solid #000;
  }
  
  .formview-wrapper .formview-table td img.logo,.formview-wrapper .formhead-table td img{width:128px}
  
  .formview-wrapper .formview-table td img,.formview-wrapper .formview-table td svg{
      text-align:center;
      vertical-align:middle;
      border:0;
      margin: 5px;
  }
  
  .badge {
      font-size:.75rem;
  }
  
  .flatpickr-months{
      background-color:#fff;
  }
  
  .flatpickr-day.selected{
      background-color:#4b38b3;
  }
  
  .formview-wrapper .d-block{
      display:block !important;
  }
  
  .formview-wrapper .text-center{
      text-align:center !important;
  }
  
  .formview-wrapper .text-right{
      text-align:right !important;
  }
  
  .formview-wrapper .text-success{
      color:rgba(69,203,133,1) !important;
  }
  
  .formview-wrapper .text-danger{
      color:rgba(240,101,72,1) !important;
  }
  
  .formview-wrapper .text-wrap{
      white-space:nowrap;
  }
  
  .form-evidence-items{
      display:flex;
      flex-wrap:wrap;
      margin-right: -5px;
      margin-left: -5px;
  }
  .form-evidence-item{
      padding-right: 5px;
      padding-left: 5px;
      margin-bottom: 5px;
  }
  .form-evidence-box{
      position:relative;
      display:flex;
      align-items:center;
      justify-content:center;
      width:82px;
      height:82px;
      background-color:#f4f4f4;
      border-radius:4px;
  }
  .form-evidence-box img{
      max-width:100%;
      max-height:100%;
  }
  .form-evidence-box .form-evidence-close{
      position:absolute;
      top:-10px;
      right:-10px;
      display:flex;
      align-items:center;
      justify-content:center;
      width:20px;
      height:20px;
      background-color:#f06548;
      color:#fff;
      border-radius:100%;
      cursor:pointer;
  }
  .form-evidence-box.plus .form-evidence-close{
      display:none;
  }
  .form-evidence-box input[type=file]{
      position:absolute;
      top:0;left:0;
      font-size:500px;
      opacity:0;
      pointer-events:none;
      cursor:pointer;
  }
  .form-evidence-box.plus input[type=file]{
      pointer-events:visible;
  }
  .form-evidence-box.plus.max input[type=file]{
      pointer-events:none;
      cursor:default;
  }
  .form-evidence-box.plus{
      overflow:hidden;
      cursor:pointer;
  }
  .form-evidence-box.plus::before,
  .form-evidence-box.plus.max::before{
      content: "\eb1c";
      position:absolute;
      font-family: boxicons !important;
      font-weight: 400;
      font-style: normal;
      font-variant: normal;
      line-height: 1;
      text-rendering: auto;
      text-transform: none;
      font-size:56px;
      color:#333;
  }
  .form-evidence-box.plus.max::before{
      content:"\ec8e";
      color:#d4d4d4;
  }
  
  @media (max-width: 992px){
      .formbox-item{
          flex: 0 0 auto;
          width: 100%;
      }
      .formbox-subitems .formbox-subitem.dummy{
          height:auto;
      }
  }
  .border-high{
    --vz-text-opacity: 1;
    border-color: rgb(255 129 0) !important;
    }
    .bg-high{
        --vz-text-opacity: 1;
        background-color: rgb(255 129 0) !important;
    }