 /* Import Google Font */
        @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap');

        /* Reset Styles */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Poppins', sans-serif;
        }

        /* Body Styling */
        

        /* Header Styling */
        header {
            width: 100%;
            text-align: center;
            padding: 20px 0;
            position: fixed;
            top: 0;
            background: rgba(255, 255, 255, 0.2);
            backdrop-filter: blur(10px);
            box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
            z-index: 10;
        }

        .logo-container img {
            width: 150px;
            height: auto;
            margin: 0 10px;
        }

        /* Form Container */
        .glass-container {
            background: rgba(255, 255, 255, 0.6);
            border-radius: 20px;
            padding: 40px;
            width: 800px; /* Increased width */
            backdrop-filter: blur(20px);
            box-shadow: 0 10px 30px rgba(255, 255, 255, 0.3);
            border: 2px solid rgba(255, 255, 255, 0.5);
            text-align: left;
            margin-bottom: 50px;
        }

        /* Form Heading */
        h2 {
            text-align: center;
            color: #333;
            font-weight: 600;
            margin-bottom: 15px;
        }

        /* Input Group */
        .input-group {
            display: flex;
            flex-direction: column;
            margin-bottom: 15px;
        }

        label {
            font-weight: bold;
            margin-bottom: 5px;
            color: #333;
            font-size: 16px;
        }

        /* Input Fields */
        input, select, textarea {
            width: 100%; /* Full width */
            padding: 14px;
            border:  1.5px solid rgba(200, 200, 200, 0.8);;
            background: rgba(255, 255, 255, 0.8);
            color: black;
            font-size: 16px; /* Bigger text */
            transition: 0.3s ease-in-out;
            border-radius: 20px; /* Rounded edges */
        }
        input:focus, select:focus, textarea:focus {
            border-color: #ff7f50; /* Soft highlight on focus */
            box-shadow: 0 0 8px rgba(255, 127, 80, 0.3);
        }

        /* Textarea Styling */
        textarea {
            resize: vertical;
            min-height: 80px;
        }

        /* Multi-column layout for certain sections */
        .form-group {
            display: flex;
            gap: 15px;
            justify-content: space-between;
            margin-bottom: 15px;
        }

        .small-input {
            flex: 1;
        }

        /* Submit Button */
          button {
            width: auto; padding: 6px 12px; font-size: 14px; border-radius: 5px; background-color: #ff7f50; color: white; border: none; cursor: pointer;
            margin-bottom:4px;
        }

        button:hover {
            transform: scale(1.05);
            box-shadow: 0 0 15px rgba(255, 255, 255, 0.7);
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .glass-container {
                width: 90%;
                padding: 20px;
            }
        }
        /* File Upload Styling */
.file-upload {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 15px;
}

.file-upload label {
    font-weight: bold;
    color: #333;
    font-size: 14px;
}

.file-upload input[type="file"] {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 40px;
    cursor: pointer;
}

.file-upload .custom-file-upload {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(255, 255, 255, 0.8);
    padding: 12px;
    border-radius: 8px;
    border: 2px dashed rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transition: 0.3s;
}

.file-upload .custom-file-upload:hover {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(0, 0, 0, 0.5);
}

.file-upload .custom-file-upload span {
    color: #555;
    font-size: 14px;
}

.file-upload .custom-file-upload i {
    color: #ff7e5f;
    font-size: 18px;
}
/* Ensure Full Responsiveness */
@media (max-width: 768px) {
    .glass-container {
        width: 90%; /* Adjust width for smaller screens */
        padding: 20px;
    }

    .form-group {
        flex-direction: column; /* Stack elements vertically */
        gap: 10px;
    }

    .small-input {
        width: 100%; /* Make inputs take full width */
    }

    input, select, textarea {
        font-size: 14px; /* Reduce text size for small screens */
        padding: 12px;
    }

    .custom-file-upload {
        font-size: 14px;
        padding: 10px;
    }

    button {
        font-size: 16px;
        padding: 12px;
    }
}

/* Fix for Larger Screens */
@media (min-width: 1200px) {
    .glass-container {
        width: 800px; /* Increase width for larger screens */
    }
}

/* Form Group Styling for Desktop */
.form-group {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: space-between;
    margin-bottom: 15px;
}

.small-input {
    flex: 1; /* Each input takes equal space */
    min-width: 48%; /* Ensures they don't shrink too much */
}

/* Ensure Select & Date Inputs Align Properly */
.form-group select, .form-group input {
    width: 100%;
}

/* File Upload Section */
.file-upload {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
}

.custom-file-upload {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(255, 255, 255, 0.8);
    padding: 12px;
    border-radius: 8px;
    border: 2px dashed rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transition: 0.3s;
}

.custom-file-upload:hover {
    background: rgba(255, 255, 255, 0.9);
}
/* Reduce spacing between date fields */
.date-group {
    display: inline-block; /* Aligns the labels with inputs */
    margin-right: 10px; /* Adjusts spacing */
    vertical-align: top;
}
label {
    display: block;
    margin-bottom: 5px; /* Space between label and input */
    font-weight: bold;
}

input[type="file"] {
    margin-bottom: 15px; /* Space between input fields */
    padding: 10px;
    width: 100%;
}
#loader {
    position: fixed;
    width: 100%;
    height: 100vh;
    background: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.dots {
    display: flex;
    justify-content: space-between;
    width: 80px;
}

.dots span {
    width: 20px;
    height: 20px;
    background: #007bff;
    border-radius: 50%;
    animation: bounce 1.4s infinite ease-in-out;
}

.dots span:nth-child(1) { animation-delay: -0.32s; }
.dots span:nth-child(2) { animation-delay: -0.16s; }
.dots span:nth-child(3) { animation-delay: 0; }

@keyframes bounce {
    0%, 80%, 100% { transform: scale(0); }
    40% { transform: scale(1); }
}
