/* Setup size of comment section */
.comment-section-card {
    width: 50vw;
    max-width: 90vw;
    min-width: 600px;
    margin: 16px auto;
}

/* Adjust comment section size on small screens */
@media (max-width: 599px) {
    .comment-section-card {
        width: 80vw;
        max-width: 90vw;
        min-width: auto;
    }
}

/* Configure form to take up max space provided and have better margins */
.comment-form {
    --form-max-width: 100%;
    margin-top: 16px;
    margin-left: 2px;
    margin-right: 2px;
}

.comment-form-label {
    font-size: 1.2rem;
    text-align: center;
}

/* Set max size for discussion submit button */
button[type="submit"] {
    max-width: 350px;
    margin: 0 auto;
}

.comment {
    margin: 5px 0px;
}

/* When a new comment is added, play an animation to highlight the new comment */
.new-comment {
    animation: new-comment 1s ease-in-out;
}

/* Highlight the new comment briefly */
@keyframes new-comment {
    0% {
        background-color: white;
    }
    50% {
        background-color: var(--accent-color-100);
    }
    100% {
        background-color: white;
    }
}