﻿/* Target the image inside the captcha container */
#dnt_CaptchaImg {
    border-radius: 5px;
    /* Example: rounded corners */
    margin-right: 0px;
    /* Example: space between image and input */
    height: 25px;
    /* Example: force specific height */
    width: auto;
    cursor: pointer;
    /* Example: visual cue */
    margin-left: 4px;
}

#dnt_CaptchaRefreshButton {
    pointer-events: none;
    /* disable mouse focus */
}

.rounded-t-5 {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}

@media (min-width: 992px) {
    .rounded-tr-lg-0 {
        border-top-right-radius: 0;
    }

    .rounded-bl-lg-5 {
        border-bottom-left-radius: 0.5rem;
    }
}

section {
    max-width: 500px;
}

.vh-80 {
    min-height: 70vh;
}

.register-link {
    color: #64CCC5;
}

.solid-logo {
    border: 1px solid white;
}

#animatedText span {
    display: inline-block;
    will-change: transform, opacity;
    /* Optimize for animation */
}

.card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1) !important;
}

.animate-fade-in {
    animation: fadeIn 0.8s ease-in-out;
}

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

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

.form-control:focus {
    border-color: #0d6efd;
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}

.btn-primary {
    /* background: linear-gradient(135deg, #0d6efd 0%, #6610f2 100%); */
    border: none;
    transition: all 0.3s ease;
}

.btn-primary:hover {
    /* background: linear-gradient(135deg, #0b5ed7 0%, #5a0de2 100%); */
    /* transform: translateY(-1px); */
    border: 1px solid #0d6efd;
    box-shadow: 0 5px 15px rgba(13, 110, 253, 0.4);
}

/* Password Toggle Animation */
#togglePassword i {
    transition: opacity 0.3s ease;
}

#togglePassword:hover i {
    opacity: 0.7;
}