/* Default light theme styles */
.mask {
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    position: fixed;
    top: 0;
    z-index: 100;
    transition: 1s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.loader {
    position: relative;
}

.loader span {
    position: absolute;
    transform: translate(-50%, -50%);
    font-size: 64px;
    letter-spacing: 5px;
}

.loader span:nth-child(1) {
    color: transparent;
    -webkit-text-stroke: 0.3px rgb(128, 198, 255);
}

.loader span:nth-child(2) {
    color: rgb(128, 198, 255);
    -webkit-text-stroke: 1px rgb(128, 198, 255);
    animation: uiverse723 3s ease-in-out infinite;
}

/* Dark theme styles */
[data-bs-theme="dark"] .mask {
    background-color: #212529;
}

[data-bs-theme="dark"] .loader span:nth-child(1) {
    -webkit-text-stroke: 0.3px rgb(200, 200, 200);
}

[data-bs-theme="dark"] .loader span:nth-child(2) {
    color: rgb(200, 200, 200);
    -webkit-text-stroke: 1px rgb(200, 200, 200);
}

@keyframes uiverse723 {
    0%, 100% {
        clip-path: polygon(0% 45%, 15% 44%, 32% 50%,
        54% 60%, 70% 61%, 84% 59%, 100% 52%, 100% 100%, 0% 100%);
    }
    50% {
        clip-path: polygon(0% 60%, 16% 65%, 34% 66%,
        51% 62%, 67% 50%, 84% 45%, 100% 46%, 100% 100%, 0% 100%);
    }
}

.hide {
    opacity: 0;
}