.progress_wrapper{
    width: 100%;
    z-index: 999;
    color: var( --primary-text-color);
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 1rem;
    transition: 0.3s ease-in-out;
  }
  
  
  
  .progress_modal{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    visibility: visible;
    opacity: 1;
    background-color:rgb(46, 46, 46,0.3);
    transition: 0.2s ease-in-out;
  }
  
  .modal_hidden{
    visibility: hidden;
    opacity: 0;
  }
  
  .progress_hidden{
    top: -4px;
    visibility: hidden;
  }
  
  .progress_active{
    visibility: visible;
    top: 0;
  }
  
  .progress {
      position: relative;
      height: 4px;
      display: block;
      width: 100%;
      background-color: #E6E6E6;
      border-radius: 2px;
      background-clip: padding-box;
      overflow: hidden;
    z-index: 999; }
      .progress .indeterminate {
        background-color: rgb(25, 113, 194); }
        .progress .indeterminate:before {
          content: '';
          position: absolute;
          background-color: inherit;
          top: 0;
          left: 0;
          bottom: 0;
          will-change: left, right;
          -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
                  animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite; }
        .progress .indeterminate:after {
          content: '';
          position: absolute;
          background-color: inherit;
          top: 0;
          left: 0;
          bottom: 0;
          will-change: left, right;
          -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
                  animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
          -webkit-animation-delay: 1.15s;
                  animation-delay: 1.15s; }
    
    @-webkit-keyframes indeterminate {
      0% {
        left: -35%;
        right: 100%; }
      60% {
        left: 100%;
        right: -90%; }
      100% {
        left: 100%;
        right: -90%; } }
    @keyframes indeterminate {
      0% {
        left: -35%;
        right: 100%; }
      60% {
        left: 100%;
        right: -90%; }
      100% {
        left: 100%;
        right: -90%; } }
    @-webkit-keyframes indeterminate-short {
      0% {
        left: -200%;
        right: 100%; }
      60% {
        left: 107%;
        right: -8%; }
      100% {
        left: 107%;
        right: -8%; } }
    @keyframes indeterminate-short {
      0% {
        left: -200%;
        right: 100%; }
      60% {
        left: 107%;
        right: -8%; }
      100% {
        left: 107%;
        right: -8%; } }