[data-component="imjs-file-uploader-progress"] .imjs-file-uploader {
    cursor: pointer !important;
}

[data-component="imjs-file-uploader-progress"].loading .imjs-file-uploader {
    display: none;
}


/* Button: loading */

.upload-progress-button.loading::after {
    content: "";
    background-image: url("../lightGallery/style/images/loading.gif");
    background-size: 20px;
    background-repeat: no-repeat;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: -30px;
    margin-left: 10px;
    opacity: 0.5;
}

.upload-progress-button.loading {
    position: relative;
    cursor: wait !important;
}

.upload-progress-button.loading::before {
    content: "";
    position: absolute;
    right: 0px;
    bottom: 0px;
    height: 100%;
    display: block;
    background-color: black;
    width: 100%;
    opacity: 0.5;
    z-index: 0;
}

.upload-progress-button:not(.outline).transparent.icon.loading::before {
    width: 0;
}

.upload-progress-button.loading[data-progress="0"]::before, .upload-progress-button.loading[data-progress^="0."]::before {
    width: 100% !important;
}

.upload-progress-button.loading[data-progress="1"]::before, .upload-progress-button.loading[data-progress^="1."]::before {
    transition: width 0.1s ease;
    width: 99% !important;
}

.upload-progress-button.loading[data-progress="2"]::before, .upload-progress-button.loading[data-progress^="2."]::before {
    transition: width 0.1s ease;
    width: 98% !important;
}

.upload-progress-button.loading[data-progress="3"]::before, .upload-progress-button.loading[data-progress^="3."]::before {
    transition: width 0.1s ease;
    width: 97% !important;
}

.upload-progress-button.loading[data-progress="4"]::before, .upload-progress-button.loading[data-progress^="4."]::before {
    transition: width 0.1s ease;
    width: 96% !important;
}

.upload-progress-button.loading[data-progress="5"]::before, .upload-progress-button.loading[data-progress^="5."]::before {
    transition: width 0.1s ease;
    width: 95% !important;
}

.upload-progress-button.loading[data-progress="6"]::before, .upload-progress-button.loading[data-progress^="6."]::before {
    transition: width 0.1s ease;
    width: 94% !important;
}

.upload-progress-button.loading[data-progress="7"]::before, .upload-progress-button.loading[data-progress^="7."]::before {
    transition: width 0.1s ease;
    width: 93% !important;
}

.upload-progress-button.loading[data-progress="8"]::before, .upload-progress-button.loading[data-progress^="8."]::before {
    transition: width 0.1s ease;
    width: 92% !important;
}

.upload-progress-button.loading[data-progress="9"]::before, .upload-progress-button.loading[data-progress^="9."]::before {
    transition: width 0.1s ease;
    width: 91% !important;
}

.upload-progress-button.loading[data-progress="10"]::before, .upload-progress-button.loading[data-progress^="10."]::before {
    transition: width 0.1s ease;
    width: 90% !important;
}

.upload-progress-button.loading[data-progress="11"]::before, .upload-progress-button.loading[data-progress^="11."]::before {
    transition: width 0.1s ease;
    width: 89% !important;
}

.upload-progress-button.loading[data-progress="12"]::before, .upload-progress-button.loading[data-progress^="12."]::before {
    transition: width 0.1s ease;
    width: 88% !important;
}

.upload-progress-button.loading[data-progress="13"]::before, .upload-progress-button.loading[data-progress^="13."]::before {
    transition: width 0.1s ease;
    width: 87% !important;
}

.upload-progress-button.loading[data-progress="14"]::before, .upload-progress-button.loading[data-progress^="14."]::before {
    transition: width 0.1s ease;
    width: 86% !important;
}

.upload-progress-button.loading[data-progress="15"]::before, .upload-progress-button.loading[data-progress^="15."]::before {
    transition: width 0.1s ease;
    width: 85% !important;
}

.upload-progress-button.loading[data-progress="16"]::before, .upload-progress-button.loading[data-progress^="16."]::before {
    transition: width 0.1s ease;
    width: 84% !important;
}

.upload-progress-button.loading[data-progress="17"]::before, .upload-progress-button.loading[data-progress^="17."]::before {
    transition: width 0.1s ease;
    width: 83% !important;
}

.upload-progress-button.loading[data-progress="18"]::before, .upload-progress-button.loading[data-progress^="18."]::before {
    transition: width 0.1s ease;
    width: 82% !important;
}

.upload-progress-button.loading[data-progress="19"]::before, .upload-progress-button.loading[data-progress^="19."]::before {
    transition: width 0.1s ease;
    width: 81% !important;
}

.upload-progress-button.loading[data-progress="20"]::before, .upload-progress-button.loading[data-progress^="20."]::before {
    transition: width 0.1s ease;
    width: 80% !important;
}

.upload-progress-button.loading[data-progress="21"]::before, .upload-progress-button.loading[data-progress^="21."]::before {
    transition: width 0.1s ease;
    width: 79% !important;
}

.upload-progress-button.loading[data-progress="22"]::before, .upload-progress-button.loading[data-progress^="22."]::before {
    transition: width 0.1s ease;
    width: 78% !important;
}

.upload-progress-button.loading[data-progress="23"]::before, .upload-progress-button.loading[data-progress^="23."]::before {
    transition: width 0.1s ease;
    width: 77% !important;
}

.upload-progress-button.loading[data-progress="24"]::before, .upload-progress-button.loading[data-progress^="24."]::before {
    transition: width 0.1s ease;
    width: 76% !important;
}

.upload-progress-button.loading[data-progress="25"]::before, .upload-progress-button.loading[data-progress^="25."]::before {
    transition: width 0.1s ease;
    width: 75% !important;
}

.upload-progress-button.loading[data-progress="26"]::before, .upload-progress-button.loading[data-progress^="26."]::before {
    transition: width 0.1s ease;
    width: 74% !important;
}

.upload-progress-button.loading[data-progress="27"]::before, .upload-progress-button.loading[data-progress^="27."]::before {
    transition: width 0.1s ease;
    width: 73% !important;
}

.upload-progress-button.loading[data-progress="28"]::before, .upload-progress-button.loading[data-progress^="28."]::before {
    transition: width 0.1s ease;
    width: 72% !important;
}

.upload-progress-button.loading[data-progress="29"]::before, .upload-progress-button.loading[data-progress^="29."]::before {
    transition: width 0.1s ease;
    width: 71% !important;
}

.upload-progress-button.loading[data-progress="30"]::before, .upload-progress-button.loading[data-progress^="30."]::before {
    transition: width 0.1s ease;
    width: 70% !important;
}

.upload-progress-button.loading[data-progress="31"]::before, .upload-progress-button.loading[data-progress^="31."]::before {
    transition: width 0.1s ease;
    width: 69% !important;
}

.upload-progress-button.loading[data-progress="32"]::before, .upload-progress-button.loading[data-progress^="32."]::before {
    transition: width 0.1s ease;
    width: 68% !important;
}

.upload-progress-button.loading[data-progress="33"]::before, .upload-progress-button.loading[data-progress^="33."]::before {
    transition: width 0.1s ease;
    width: 67% !important;
}

.upload-progress-button.loading[data-progress="34"]::before, .upload-progress-button.loading[data-progress^="34."]::before {
    transition: width 0.1s ease;
    width: 66% !important;
}

.upload-progress-button.loading[data-progress="35"]::before, .upload-progress-button.loading[data-progress^="35."]::before {
    transition: width 0.1s ease;
    width: 65% !important;
}

.upload-progress-button.loading[data-progress="36"]::before, .upload-progress-button.loading[data-progress^="36."]::before {
    transition: width 0.1s ease;
    width: 64% !important;
}

.upload-progress-button.loading[data-progress="37"]::before, .upload-progress-button.loading[data-progress^="37."]::before {
    transition: width 0.1s ease;
    width: 63% !important;
}

.upload-progress-button.loading[data-progress="38"]::before, .upload-progress-button.loading[data-progress^="38."]::before {
    transition: width 0.1s ease;
    width: 62% !important;
}

.upload-progress-button.loading[data-progress="39"]::before, .upload-progress-button.loading[data-progress^="39."]::before {
    transition: width 0.1s ease;
    width: 61% !important;
}

.upload-progress-button.loading[data-progress="40"]::before, .upload-progress-button.loading[data-progress^="40."]::before {
    transition: width 0.1s ease;
    width: 60% !important;
}

.upload-progress-button.loading[data-progress="41"]::before, .upload-progress-button.loading[data-progress^="41."]::before {
    transition: width 0.1s ease;
    width: 59% !important;
}

.upload-progress-button.loading[data-progress="42"]::before, .upload-progress-button.loading[data-progress^="42."]::before {
    transition: width 0.1s ease;
    width: 58% !important;
}

.upload-progress-button.loading[data-progress="43"]::before, .upload-progress-button.loading[data-progress^="43."]::before {
    transition: width 0.1s ease;
    width: 57% !important;
}

.upload-progress-button.loading[data-progress="44"]::before, .upload-progress-button.loading[data-progress^="44."]::before {
    transition: width 0.1s ease;
    width: 56% !important;
}

.upload-progress-button.loading[data-progress="45"]::before, .upload-progress-button.loading[data-progress^="45."]::before {
    transition: width 0.1s ease;
    width: 55% !important;
}

.upload-progress-button.loading[data-progress="46"]::before, .upload-progress-button.loading[data-progress^="46."]::before {
    transition: width 0.1s ease;
    width: 54% !important;
}

.upload-progress-button.loading[data-progress="47"]::before, .upload-progress-button.loading[data-progress^="47."]::before {
    transition: width 0.1s ease;
    width: 53% !important;
}

.upload-progress-button.loading[data-progress="48"]::before, .upload-progress-button.loading[data-progress^="48."]::before {
    transition: width 0.1s ease;
    width: 52% !important;
}

.upload-progress-button.loading[data-progress="49"]::before, .upload-progress-button.loading[data-progress^="49."]::before {
    transition: width 0.1s ease;
    width: 51% !important;
}

.upload-progress-button.loading[data-progress="50"]::before, .upload-progress-button.loading[data-progress^="50."]::before {
    transition: width 0.1s ease;
    width: 50% !important;
}

.upload-progress-button.loading[data-progress="51"]::before, .upload-progress-button.loading[data-progress^="51."]::before {
    transition: width 0.1s ease;
    width: 49% !important;
}

.upload-progress-button.loading[data-progress="52"]::before, .upload-progress-button.loading[data-progress^="52."]::before {
    transition: width 0.1s ease;
    width: 48% !important;
}

.upload-progress-button.loading[data-progress="53"]::before, .upload-progress-button.loading[data-progress^="53."]::before {
    transition: width 0.1s ease;
    width: 47% !important;
}

.upload-progress-button.loading[data-progress="54"]::before, .upload-progress-button.loading[data-progress^="54."]::before {
    transition: width 0.1s ease;
    width: 46% !important;
}

.upload-progress-button.loading[data-progress="55"]::before, .upload-progress-button.loading[data-progress^="55."]::before {
    transition: width 0.1s ease;
    width: 45% !important;
}

.upload-progress-button.loading[data-progress="56"]::before, .upload-progress-button.loading[data-progress^="56."]::before {
    transition: width 0.1s ease;
    width: 44% !important;
}

.upload-progress-button.loading[data-progress="57"]::before, .upload-progress-button.loading[data-progress^="57."]::before {
    transition: width 0.1s ease;
    width: 43% !important;
}

.upload-progress-button.loading[data-progress="58"]::before, .upload-progress-button.loading[data-progress^="58."]::before {
    transition: width 0.1s ease;
    width: 42% !important;
}

.upload-progress-button.loading[data-progress="59"]::before, .upload-progress-button.loading[data-progress^="59."]::before {
    transition: width 0.1s ease;
    width: 41% !important;
}

.upload-progress-button.loading[data-progress="60"]::before, .upload-progress-button.loading[data-progress^="60."]::before {
    transition: width 0.1s ease;
    width: 40% !important;
}

.upload-progress-button.loading[data-progress="61"]::before, .upload-progress-button.loading[data-progress^="61."]::before {
    transition: width 0.1s ease;
    width: 39% !important;
}

.upload-progress-button.loading[data-progress="62"]::before, .upload-progress-button.loading[data-progress^="62."]::before {
    transition: width 0.1s ease;
    width: 38% !important;
}

.upload-progress-button.loading[data-progress="63"]::before, .upload-progress-button.loading[data-progress^="63."]::before {
    transition: width 0.1s ease;
    width: 37% !important;
}

.upload-progress-button.loading[data-progress="64"]::before, .upload-progress-button.loading[data-progress^="64."]::before {
    transition: width 0.1s ease;
    width: 36% !important;
}

.upload-progress-button.loading[data-progress="65"]::before, .upload-progress-button.loading[data-progress^="65."]::before {
    transition: width 0.1s ease;
    width: 35% !important;
}

.upload-progress-button.loading[data-progress="66"]::before, .upload-progress-button.loading[data-progress^="66."]::before {
    transition: width 0.1s ease;
    width: 34% !important;
}

.upload-progress-button.loading[data-progress="67"]::before, .upload-progress-button.loading[data-progress^="67."]::before {
    transition: width 0.1s ease;
    width: 33% !important;
}

.upload-progress-button.loading[data-progress="68"]::before, .upload-progress-button.loading[data-progress^="68."]::before {
    transition: width 0.1s ease;
    width: 32% !important;
}

.upload-progress-button.loading[data-progress="69"]::before, .upload-progress-button.loading[data-progress^="69."]::before {
    transition: width 0.1s ease;
    width: 31% !important;
}

.upload-progress-button.loading[data-progress="70"]::before, .upload-progress-button.loading[data-progress^="70."]::before {
    transition: width 0.1s ease;
    width: 30% !important;
}

.upload-progress-button.loading[data-progress="71"]::before, .upload-progress-button.loading[data-progress^="71."]::before {
    transition: width 0.1s ease;
    width: 29% !important;
}

.upload-progress-button.loading[data-progress="72"]::before, .upload-progress-button.loading[data-progress^="72."]::before {
    transition: width 0.1s ease;
    width: 28% !important;
}

.upload-progress-button.loading[data-progress="73"]::before, .upload-progress-button.loading[data-progress^="73."]::before {
    transition: width 0.1s ease;
    width: 27% !important;
}

.upload-progress-button.loading[data-progress="74"]::before, .upload-progress-button.loading[data-progress^="74."]::before {
    transition: width 0.1s ease;
    width: 26% !important;
}

.upload-progress-button.loading[data-progress="75"]::before, .upload-progress-button.loading[data-progress^="75."]::before {
    transition: width 0.1s ease;
    width: 25% !important;
}

.upload-progress-button.loading[data-progress="76"]::before, .upload-progress-button.loading[data-progress^="76."]::before {
    transition: width 0.1s ease;
    width: 24% !important;
}

.upload-progress-button.loading[data-progress="77"]::before, .upload-progress-button.loading[data-progress^="77."]::before {
    transition: width 0.1s ease;
    width: 23% !important;
}

.upload-progress-button.loading[data-progress="78"]::before, .upload-progress-button.loading[data-progress^="78."]::before {
    transition: width 0.1s ease;
    width: 22% !important;
}

.upload-progress-button.loading[data-progress="79"]::before, .upload-progress-button.loading[data-progress^="79."]::before {
    transition: width 0.1s ease;
    width: 21% !important;
}

.upload-progress-button.loading[data-progress="80"]::before, .upload-progress-button.loading[data-progress^="80."]::before {
    transition: width 0.1s ease;
    width: 20% !important;
}

.upload-progress-button.loading[data-progress="81"]::before, .upload-progress-button.loading[data-progress^="81."]::before {
    transition: width 0.1s ease;
    width: 19% !important;
}

.upload-progress-button.loading[data-progress="82"]::before, .upload-progress-button.loading[data-progress^="82."]::before {
    transition: width 0.1s ease;
    width: 18% !important;
}

.upload-progress-button.loading[data-progress="83"]::before, .upload-progress-button.loading[data-progress^="83."]::before {
    transition: width 0.1s ease;
    width: 17% !important;
}

.upload-progress-button.loading[data-progress="84"]::before, .upload-progress-button.loading[data-progress^="84."]::before {
    transition: width 0.1s ease;
    width: 16% !important;
}

.upload-progress-button.loading[data-progress="85"]::before, .upload-progress-button.loading[data-progress^="85."]::before {
    transition: width 0.1s ease;
    width: 15% !important;
}

.upload-progress-button.loading[data-progress="86"]::before, .upload-progress-button.loading[data-progress^="86."]::before {
    transition: width 0.1s ease;
    width: 14% !important;
}

.upload-progress-button.loading[data-progress="87"]::before, .upload-progress-button.loading[data-progress^="87."]::before {
    transition: width 0.1s ease;
    width: 13% !important;
}

.upload-progress-button.loading[data-progress="88"]::before, .upload-progress-button.loading[data-progress^="88."]::before {
    transition: width 0.1s ease;
    width: 12% !important;
}

.upload-progress-button.loading[data-progress="89"]::before, .upload-progress-button.loading[data-progress^="89."]::before {
    transition: width 0.1s ease;
    width: 11% !important;
}

.upload-progress-button.loading[data-progress="90"]::before, .upload-progress-button.loading[data-progress^="90."]::before {
    transition: width 0.1s ease;
    width: 10% !important;
}

.upload-progress-button.loading[data-progress="91"]::before, .upload-progress-button.loading[data-progress^="91."]::before {
    transition: width 0.1s ease;
    width: 9% !important;
}

.upload-progress-button.loading[data-progress="92"]::before, .upload-progress-button.loading[data-progress^="92."]::before {
    transition: width 0.1s ease;
    width: 8% !important;
}

.upload-progress-button.loading[data-progress="93"]::before, .upload-progress-button.loading[data-progress^="93."]::before {
    transition: width 0.1s ease;
    width: 7% !important;
}

.upload-progress-button.loading[data-progress="94"]::before, .upload-progress-button.loading[data-progress^="94."]::before {
    transition: width 0.1s ease;
    width: 6% !important;
}

.upload-progress-button.loading[data-progress="95"]::before, .upload-progress-button.loading[data-progress^="95."]::before {
    transition: width 0.1s ease;
    width: 5% !important;
}

.upload-progress-button.loading[data-progress="96"]::before, .upload-progress-button.loading[data-progress^="96."]::before {
    transition: width 0.1s ease;
    width: 4% !important;
}

.upload-progress-button.loading[data-progress="97"]::before, .upload-progress-button.loading[data-progress^="97."]::before {
    transition: width 0.1s ease;
    width: 3% !important;
}

.upload-progress-button.loading[data-progress="98"]::before, .upload-progress-button.loading[data-progress^="98."]::before {
    transition: width 0.1s ease;
    width: 2% !important;
}

.upload-progress-button.loading[data-progress="99"]::before, .upload-progress-button.loading[data-progress^="99."]::before {
    transition: width 0.1s ease;
    width: 1% !important;
}

.upload-progress-button.loading[data-progress="100"]::before, .upload-progress-button.loading[data-progress^="100."]::before {
    transition: width 0.1s ease;
    width: 0% !important;
}
