/* Simple animation for the loader */
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.loader {
    width: 24px;
    height: 24px;
    border: 3px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: #ffffff;
    animation: spin 1s ease-in-out infinite;
}

/* Custom styles for rendered table */
#output-table table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
}

#output-table th,
#output-table td {
    border: 1px solid #e2e8f0; /* gray-200 */
    padding: 0.75rem; /* p-3 */
    text-align: left;
}

#output-table th {
    background-color: #f8fafc; /* gray-50 */
    font-weight: 600;
}

#output-table tr:nth-child(even) {
    background-color: #f1f5f9; /* gray-100 */
}

#output-table td:first-child {
    font-weight: 600;
    width: 30%;
}