#comment-section {
    padding: var(--spacing-l);
    background-color: var(--color-background-muted);
    border-radius: var(--border-radius-regular);
    box-shadow: var(--box-shadow-card-regular);
}

#comment-section {
   h3 {
        margin-top: 0;
        margin-bottom: var(--spacing-l);
    }

    #comments-list {
        margin-bottom: var(--spacing-l);
    }

    .comment {
        padding: var(--spacing-m);
        margin-bottom: var(--spacing-m);
        background-color: var(--color-background-default);
        border: var(--border-regular);
        border-radius: var(--border-radius-regular);
    }

    .comment p {
        margin: var(--spacing-s) 0;
    }

    .comment strong {
        color: var(--color-text-muted);
    }

    #comment-form {
        display: flex;
        flex-direction: column;
    }

    .form-group {
        margin-bottom: var(--spacing-m);
    }

    .form-group label {
        margin-bottom: var(--spacing-xs);
        font-weight: var(--font-weight-bold);
    }

    .form-group input,
    .form-group textarea {
        width: 100%;
        padding: var(--spacing-s);
        border: var(--border-regular);
        border-radius: var(--border-radius-regular);
    }

    #comment-form input[type="submit"] {
        margin: 0;
    }

}