/* SWC Archive theme — comments on blog posts (loaded only on single posts with comments, functions.php).
   A white box under the post, like the post itself; form fields and the submit button use the base.css styles. */

.swc-comments {
    margin-top: 2rem;
    padding: 2rem;
    border-radius: 0.25rem;
    box-shadow: 0 15px 15px -10px rgba(0, 0, 0, 0.05);
}
@media (max-width: 719px) {
    .swc-comments { margin-left: -1rem; margin-right: -1rem; padding: 1.5rem 1rem; }
}
.swc-comments__title { margin: 0 0 1.25rem; font-size: 1.5rem; line-height: 1.3; }
.swc-comments__closed { color: var(--global-palette5); }

/* List */
.swc-comments__list, .swc-comments__list .children { list-style: none; margin: 0; padding: 0; }
.swc-comments__list .children { margin-left: 1.5rem; padding-left: 1.25rem; border-left: 2px solid var(--global-palette7); }
.swc-comments__list .comment-body { padding: 1.25rem 0; border-bottom: 1px solid var(--global-palette7); }
.swc-comments__list > li:last-child > .comment-body { border-bottom: 0; }
.swc-comments__list .comment-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem; margin-bottom: 0.75rem; }
.swc-comments__list .comment-author { display: flex; align-items: center; gap: 0.75rem; font-weight: 700; color: var(--global-palette3); }
.swc-comments__list .comment-author .avatar { width: 48px; height: 48px; border-radius: 50%; }
.swc-comments__list .comment-author .says { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.swc-comments__list .comment-metadata { font-size: 0.85rem; }
.swc-comments__list .comment-metadata a { color: var(--global-palette6); text-decoration: none; }
.swc-comments__list .comment-metadata a:hover { color: var(--global-palette1); }
.swc-comments__list .comment-awaiting-moderation { flex-basis: 100%; margin: 0; font-size: 0.85rem; font-style: italic; color: var(--global-palette5); }
.swc-comments__list .comment-content { padding-left: calc(48px + 0.75rem); }
.swc-comments__list .comment-content > :last-child { margin-bottom: 0; }
.swc-comments__list .reply { padding-left: calc(48px + 0.75rem); margin-top: 0.5rem; font-size: 0.85rem; font-weight: 700; }
.swc-comments__list .reply a { color: var(--global-palette1); text-decoration: none; }
.swc-comments__list .reply a:hover { color: var(--global-palette2); }
@media (max-width: 540px) {
    .swc-comments__list .comment-content, .swc-comments__list .reply { padding-left: 0; }
    .swc-comments__list .children { margin-left: 0.5rem; padding-left: 0.75rem; }
}
.comment-navigation .nav-links { display: flex; justify-content: space-between; margin-top: 1rem; }

/* Form */
.swc-comments__list + .swc-comments__respond,
.comment-navigation + .swc-comments__respond { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--global-palette7); }
.swc-comments__list .swc-comments__respond { margin: 1rem 0 0; padding: 1.25rem; background: var(--global-palette8); border-radius: 0.25rem; }
.comment-reply-title small { margin-left: 0.75rem; font-size: 0.85rem; font-weight: 700; }
.comment-reply-title small a { color: var(--global-palette1); }
.comment-form p { margin: 0 0 1rem; }
.comment-form label { display: block; margin-bottom: 0.35rem; font-weight: 700; font-size: 0.9rem; color: var(--global-palette3); }
.comment-form .required { color: #c53030; }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea { width: 100%; }
.comment-form .comment-notes, .comment-form .logged-in-as { font-size: 0.85rem; color: var(--global-palette5); }
.comment-form .comment-form-cookies-consent { display: flex; align-items: flex-start; gap: 0.5rem; }
.comment-form .comment-form-cookies-consent label { display: inline; margin: 0; font-weight: 400; }
.comment-form .comment-form-cookies-consent input { margin-top: 0.3em; }
.comment-form .form-submit { margin-bottom: 0; }
@media (min-width: 720px) {
    .comment-form { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 1rem; }
    .comment-form > p { grid-column: 1 / -1; }
    .comment-form > .comment-form-author, .comment-form > .comment-form-email, .comment-form > .comment-form-url { grid-column: auto; }
}
