
        body {
            font-family: 'Arial', sans-serif;
            background-color: #f8f9fa;
            color: #333;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 100vh;
            margin: 0;
            padding: 20px;
        }

        #test-container {
    display: none; /* Initially hidden, but will be shown via JavaScript */
    visibility: visible !important;
    opacity: 1 !important;
    background: #ffffff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
    padding: 30px;
    width: 90%;
    max-width: 600px;
    text-align: center;
    margin-top: 20px;
    min-height: 300px; /* Ensure it's not collapsing */
    position: relative; /* Prevent layering issues */
    z-index: 10; /* Ensure it's above other elements */
}


#results {
    display: none;
    font-size: 1.2em;
    padding: 20px;
    max-height: 70vh; /* Prevent overflow */
    overflow-y: auto;
    text-align: left;
}


        #timer {
            font-size: 1.2em;
            font-weight: bold;
            color: #dc3545;
            margin-bottom: 15px;
        }

        .question {
            font-size: 1.2em;
            margin-bottom: 20px;
        }

        button {
            display: block;
            width: 100%;
            padding: 15px;
            margin: 10px 0;
            font-size: 1em;
            border: none;
            border-radius: 8px;
            cursor: pointer;
            transition: 0.3s;
        }

        button:hover {
            opacity: 0.8;
        }

        button:active {
            transform: scale(0.98);
        }

        .start-btn {
            background: #28a745;
            color: white;
                max-width: 600px;
        }

        .option-btn {
    background: #007bff;
    color: white;
    border: 2px solid transparent;
    padding: 12px;
    margin: 10px 0;
    font-size: 1em;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.3s, border-color 0.3s;
}
.option-btn:hover, .option-btn:focus {
    background: #0056b3;
    border-color: white;
    outline: 3px solid #ffcc00; /* Highlight selection for keyboard users */
}

        .submit-btn {
            background: #ff9800;
            color: white;
        }

        #results {
            display: none;
            font-size: 1.2em;
            padding: 20px;
            max-height: 70vh;
            /* Limit max height */
            overflow-y: auto;
            /* Enable scrolling if needed */
            text-align: left;
        }

        .restart-btn {
    background: #007bff;
    color: white;
    font-size: 1em;
    padding: 12px 20px;
    margin-top: 20px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: 0.3s;
    display: block;
    width: 100%;
}

.restart-btn:hover {
    opacity: 0.8;
} 
#feedback {
    font-size: 1.2em;
    margin-top: 15px;
}
.option-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.next-btn {
    background: #ff9800;
    color: white;
    font-size: 1em;
    padding: 12px 20px;
    margin-top: 20px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    width: 100%;
    text-align: center;
}

.next-btn:hover, .next-btn:focus {
    background: #e68900;
    outline: 3px solid #ffcc00;
}

#start-container{
    width: 60%;
}





        @media (max-width: 600px) {
            body {
                padding: 10px;
            }

            #test-container,
            #results {
                width: 100%;
                padding: 20px;
            }
        }

#disclaimer {
    background: #fff3cd;
    border: 1px solid #ffecb5;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
    text-align: left;
    max-width: 600px;
}

#disclaimer h2, #disclaimer h3 {
    color: #856404;
}

#disclaimer ul {
    padding-left: 20px;
}

#disclaimer p {
    font-size: 14px;
}

#accept-disclaimer {
    margin-right: 5px;
}

#start-test-btn:disabled {
    background-color: #ccc;
    cursor: not-allowed;
}

    
