/* 1. Prevent "flash" of content while checking for Auto-OTP */
#kt_app_root {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* 2. Used if no default method is found or during manual login */
.reveal-content #kt_app_root {
    opacity: 1;
}

/* 3. Smooth transition for switching views */
.fade-in {
    animation: fadeIn 0.4s;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.auto-processing {
    cursor: wait !important;
}

/* otp_code_entry_view - moved here from OTPCheckPoint.aspx */
.otp-input {
    background-color: transparent !important;
    height: 60px;
    width: 60px;
    font-size: 2rem;
    text-align: center;
    margin: 5px;
    border: 2px solid #e1e3ea;
}

    .otp-input:focus {
        border-color: #009ef7;
    }
/* Midigta gee, cabbirka fariintana yaree */
#toast-container > .toast {
    width: 300px !important; /* Ballaca yaree */
    padding: 15px 15px 15px 50px !important;
    font-size: 13px !important; /* Qoraalka yaree */
    border-radius: 8px !important;
}

/* Haddii aad rabto in fariintu ay u dhowaato geeska midig */
.toast-top-right {
    top: 20px !important;
    right: 20px !important;
}
/* Hubi in Toastr-ku uu ka sareeyo wax kasta (Z-Index) */
#toast-container {
    z-index: 999999 !important;
}

/* Haddii aad rabto inuu si sax ah midigta u tago */
.toast-top-right {
    top: 20px !important;
    right: 20px !important;
}