/* Responsive Login Page Styles */

/* Base styles */
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    background-color: #1A2980;
}

.welcome-heading {
    font-size: 22px !important;
    font-family: 'Times New Roman', Times, serif !important;
}

.developer-credit {
    font-family: 'Times New Roman', Times, serif !important;
}
.background-radial-gradient {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 100vh;
    width: 100%;
    background: #1A2980;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #26D0CE, #1A2980);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #26D0CE, #1A2980); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background-size: cover;
    background-attachment: fixed;
}

/* Shape elements removed */

.bg-glass {
    background-color: hsla(0, 0%, 100%, 0.9) !important;
    backdrop-filter: saturate(200%) blur(25px);
    border-radius: 1rem;
}

/* Extra small devices (phones, less than 576px) */
@media (max-width: 575.98px) {
    .card {
        margin: 0.5rem;
    }

    .card-body {
        padding: 1rem !important;
    }

    h6.display-3 {
        font-size: 18px !important;
        margin-top: 0.5rem !important;
        margin-bottom: 0.5rem !important;
    }

    .form-outline {
        margin-bottom: 0.75rem !important;
    }

    .btn {
        padding: 0.5rem !important;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
    .card {
        margin: 1rem;
    }

    h6.display-3 {
        font-size: 20px !important;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .card {
        margin: 1.5rem;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    /* Shape elements removed */
}

@media (max-width: 767px) {
    .background-radial-gradient {
        height: 100vh;
        width: 100vw;
    }

    .welcome-heading {
        font-size: 18px !important;
    }

    .container {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }
}

/* RTL specific adjustments */
[dir="rtl"] .form-label {
    text-align: right;
}

/* Input field focus styles */
.form-control:focus {
    border-color: #ad1fff;
    box-shadow: 0 0 0 0.25rem rgba(173, 31, 255, 0.25);
}

/* Button hover effect */
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 7px 14px rgba(50, 50, 93, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}