/*  */
.fade-change { 
  transition-property: opacity;
  transition-duration: 1000ms;   /* your 2s */
  transition-timing-function: ease;
  will-change: opacity;
} 
.opacity-0 { opacity: 0; }     

/*  */
    .has-called-start {
        background-image: linear-gradient(to bottom right, rgba(8, 165, 0, 0.907), rgba(0, 255, 76, 0.685));
    }
/*  */
    .highlight-votebox {
        background-color: orange;
        font-size: 1rem;
    }
/*  */
    .slot-free-indicator {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 100%;
        width: 100%;
        font-size: 0.8rem;
        gap: 1rem;
        font-weight:300;
    }
    .slot-free-indicator .spinner {
        opacity: 0.5;
    }
/*  */
    .round-unpassed-indicator {
        border: 0.05rem outset #495261ab;
    }
    .round-failed-indicator {
        border: 0.05rem outset #ff0000ab;
    }
    .round-passed-indicator {
        border: 0.05rem outset #1cff00;
    }
/*  */
    .spinner {
        border: 0.2rem solid rgba(0, 0, 0, 0.61);
        width: 1rem;
        height: 1rem;
        border-radius: 50%;
        border-left-color: rgb(255, 255, 255);
        animation: spin 3s ease infinite;
    }
    @keyframes spin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }
/*  */
    .loading-dots {
        display: flex;
        gap: 0.3rem;
        justify-content: center;
        align-items: center;
    }
    .loading-dots span {
        width: 0.3rem;
        height: 0.3rem;
        background: #00000073;
        border-radius: 50%;
        display: inline-block;
        animation: bounce 3s infinite ease-in-out;
    }
    .loading-dots span:nth-child(1) {
        animation-delay: 0s;
    }
    .loading-dots span:nth-child(2) {
        animation-delay: 0.2s;
    }
    .loading-dots span:nth-child(3) {
        animation-delay: 0.4s;
    }
    @keyframes bounce {
    0%, 80%, 100% {
        transform: scale(0.4);
        opacity: 0.5;
    }
    40% {
        transform: scale(1);
        opacity: 1;
    }
    }
/*  */
.d-flex {
    display: flex;
}
.d-none {
    display: none;
}
.not-in-use { 
    pointer-events: none;
    filter: brightness(0.1);
}
.correct-answer-mark::before {
    display: grid;
    content: "Correct ✔";
    position: absolute;
    backdrop-filter: blur(0.1rem);
    top: 0rem;
    right: 0rem;
    place-items: center;
    height: 100%;
    width: 100%;
    background: #0d162eb7;
    color: #00ff00;
    border-top-left-radius: 0.3rem;
    border-top-right-radius: 0.3rem;
}
/*  */
.move-up   { 
    transform: translate(-50%, -125%);
} 
.move-down {
    transform: translate(-50%, 0);
}
/*  */