





.worksheet-generator {
    max-width: 800px;
    margin: 1rem auto;
    padding: 1rem;
    background: #FFFFFF
}
    .worksheet-generator {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between; /* Distributes items evenly with space between them */
    }

    .worksheet-generator .form-group {
        flex: 0 0 calc(50% - 10px); /* Two columns with a 20px gap between them */
        box-sizing: border-box; /* Include padding and border in the element's total width and height */
    }

    /* Optional: Adjust for smaller screens if needed */
    @media (max-width: 768px) {
        .worksheet-generator .form-group {
            flex: 0 0 100%; /* Stack columns on smaller screens */
        }
    }
.form-group {
    margin-bottom: 1rem;
    background: #F7F7F7;;
    padding: 1rem;
    border-radius: 5px;
}


.worksheet-line {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    margin-top: 0.5rem;
}

.char-count {
    display: block;
    font-size: 0.875rem;
    color: #6b7280;
    margin-top: 0.25rem;
}

.generate-button {
    background: #534189;
    color: white;
    padding: 0.65rem 1.5rem;
    border: none;
    border-radius: 7px;
    cursor: pointer;
    font-weight: 600;

    display: block;
    margin: 1.5rem auto 0 auto; /* Top margin + horizontal centering */
}


.generate-button:hover {
    background: #4338ca;
}