/* ---------------- loader AGLAE Cercle Rouge V1.0 ---------------- */
.loader-aglae-v1 {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 200px;
    height: 200px;
    transform: translate(-50%, -50%);

    /* background: black; */
    background-image: url('../assets/images/loaders/AKV-cerlce-rouge-v2-340.png');
    background-size: cover;
    justify-content: center;
    margin: auto;
    /* animation: pulse 1.5s infinite ease-in-out; */
    /* background-position: top;
    color: white;
    padding: 10px 20px;
    border-radius: 100px; */
    /* display: none; */
    transition: opacity 0.7s ease-in-out;
    /* opacity: 0; */
    /* text-align: center;
    text-transform: uppercase;
    font-weight: bold; */
    z-index: 999;

}

/* Animation fade-in (lorsque le loader apparaît) */
.loader-aglae-v1.ng-hide-remove {
    transition: opacity 0.7s ease;
    opacity: 0;
}
.loader-aglae-v1.ng-hide-remove.ng-hide-remove-active {
    opacity: 1;
}
/* Animation fade-out (lorsque le loader disparaît) */
.loader-aglae-v1.ng-hide-add {
    transition: opacity 0.7s ease;
    opacity: 1;
}
.loader-aglae-v1.ng-hide-add.ng-hide-add-active {
    opacity: 0;
}

.loading{
    width: 100%;
}

.loader-aglae-v1.inner{
    position: inherit;
    top: inherit;
    left: inherit;
}
.loader-aglae-v1.inner + .row-dots{
    margin-top: -45px;
}
.loader-aglae-v1.inner + .row-dots + .text-center{
    margin-top: 35px;
}

.loader-aglae-v1.table{
   /*  position: inherit !important;
    top: inherit !important;
    left: inherit !important; */
    transform: translate(0, 0);
    margin-top: 2rem;
}
.loader-aglae-v1.table + .row-dots{
    margin-top: -45px;
}
.loader-aglae-v1.table + .row-dots + .text-center{
    margin-top: 35px;
}

.row-dots{
    display: flex;
    width: 100%;
    justify-content: center;
    gap: 10px;
    margin: 145px 0 10px 0;
}

.dot {
    display: inline-block;
    width: 13px;
    height: 13px;
    background-color: #ffffff;
    border-radius: 50%;
    animation: pulse 1.5s infinite ease-in-out;
/*     position: relative;
    top: 90px; */
    box-shadow: 2px 2px 0 1px rgba(0, 0, 0, 0.5);
    margin-right: 0.4rem;
}

.dot:nth-child(1) {
    animation-delay: 0s;
}
.dot:nth-child(2) {
    animation-delay: 0.2s;
}
.dot:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes pulse {
    0%, 100% {
        transform: scale(1);
        opacity: 0.2;
    }
    50% {
        transform: scale(1.2);
        opacity: 1;
    }
}

#succeded{
    display: flex;
}