/* Root Labs Notebook — blog-specific styles (layered on the main site stylesheet) */

/* Admin bar offset when logged in */
body.admin-bar .sidebar { top: 32px; height: calc(100vh - 32px); }

/* Post meta line under titles */
.post-meta {
    margin-top: 14px;
    display: flex;
    gap: 18px;
    font-family: var(--mono);
    font-size: 12px;
    color: var(--muted);
}
.post-meta a { color: var(--accent); }

/* Article body typography */
.post-body { max-width: 74ch; }
/* bbPress renders through the same page template as regular pages; the
   74ch reading width is right for prose but strands the forum listing
   (topic/voice/post/last-post columns) in a narrow column with a wall of
   empty space beside it. Let forum content use the full available width. */
.post-body:has(#bbpress-forums) { max-width: none; }
.post-body p {
    font-size: 16.5px;
    line-height: 1.75;
    color: var(--ink);
    opacity: 0.92;
    margin-bottom: 18px;
}
.post-body h2, .post-body h3, .post-body h4 {
    font-weight: 700;
    color: var(--ink);
    margin: 34px 0 14px;
    letter-spacing: -0.01em;
}
.post-body h2 { font-size: 24px; }
.post-body h2::before { content: "## "; color: var(--accent); font-family: var(--mono); font-size: 18px; }
.post-body h3 { font-size: 19px; }
.post-body h3::before { content: "### "; color: var(--accent); font-family: var(--mono); font-size: 15px; }
.post-body h4 { font-size: 16px; }
.post-body ul, .post-body ol { margin: 0 0 18px 22px; color: var(--ink); }
.post-body li { font-size: 16.5px; line-height: 1.7; margin-bottom: 8px; opacity: 0.92; }
.post-body blockquote {
    border-left: 3px solid var(--accent);
    padding: 4px 0 4px 18px;
    margin: 0 0 18px;
    color: var(--muted);
}
.post-body blockquote p { color: var(--muted); margin-bottom: 0; }
.post-body code {
    font-family: var(--mono);
    font-size: 14px;
    background: var(--bg-deep);
    border: 1px solid var(--line);
    border-radius: 4px;
    padding: 2px 6px;
}
.post-body pre {
    background: var(--bg-deep);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 16px 18px;
    overflow-x: auto;
    margin-bottom: 18px;
}
.post-body pre code { background: none; border: none; padding: 0; font-size: 13.5px; line-height: 1.7; }
.post-body img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    border: 1px solid var(--line);
}
.post-body figcaption {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--muted);
    margin-top: 8px;
}
.post-body hr { border: none; border-top: 1px dashed var(--line); margin: 30px 0; }
.post-body table { border-collapse: collapse; margin-bottom: 18px; width: 100%; }
.post-body th, .post-body td { border: 1px solid var(--line); padding: 8px 12px; font-size: 14.5px; text-align: left; }
.post-body th { font-family: var(--mono); font-size: 12px; color: var(--muted); }

/* Prev / next links */
.post-nav {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    border-top: 1px solid var(--line);
    font-family: var(--mono);
    font-size: 13px;
}
.post-nav .next { margin-left: auto; text-align: right; }

/* Pagination */
.blog-pagination { margin-top: 28px; font-family: var(--mono); font-size: 13px; }
.blog-pagination .nav-links { display: flex; gap: 12px; flex-wrap: wrap; }
.blog-pagination .page-numbers {
    padding: 6px 12px;
    border: 1px solid var(--line);
    border-radius: 6px;
    color: var(--muted);
}
.blog-pagination .page-numbers.current { border-color: var(--accent); color: var(--accent); }
.blog-pagination a.page-numbers:hover { color: var(--ink); border-color: var(--muted); }

/* ============ Comments ============ */
.comments-section { border-top: 1px solid var(--line); }
.comment-list { list-style: none; margin: 0 0 32px; }
.comment-list .children { list-style: none; margin: 0 0 0 40px; }
li.comment {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--panel);
    padding: 16px 18px;
    margin-bottom: 14px;
}
.comment-body { display: flex; flex-direction: column; gap: 8px; }
.comment-author {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
}
.comment-author .avatar { border-radius: 6px; border: 1px solid var(--line); }
.comment-author .fn { font-style: normal; font-weight: 700; color: var(--ink); }
.comment-metadata {
    font-family: var(--mono);
    font-size: 11px;
    color: var(--muted);
}
.comment-metadata a { color: var(--muted); }
.comment-content p { font-size: 14.5px; color: var(--ink); opacity: 0.92; line-height: 1.6; margin: 0; }
.comment-awaiting-moderation {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--accent);
}
.reply { margin-top: 4px; }
.comment-reply-link {
    font-family: var(--mono);
    font-size: 12px;
    color: var(--accent);
}
#respond {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--panel);
    padding: 22px;
    max-width: 640px;
}
#respond .comment-reply-title { font-family: var(--mono); font-size: 15px; color: var(--muted); margin-bottom: 16px; font-weight: 500; }
#respond .comment-reply-title small a { color: var(--muted); font-size: 12px; margin-left: 8px; }
#respond .comment-form-comment,
#respond .comment-form-author,
#respond .comment-form-email,
#respond .comment-form-url { display: flex; flex-direction: column; gap: 7px; margin-bottom: 14px; }
#respond label { font-family: var(--mono); font-size: 12px; color: var(--muted); }
#respond label::before { content: "> "; color: var(--accent); }
#respond input[type="text"],
#respond input[type="email"],
#respond input[type="url"],
#respond textarea {
    background: var(--bg-deep);
    border: 1px solid var(--line);
    border-radius: 6px;
    color: var(--ink);
    font-family: var(--sans);
    font-size: 15px;
    padding: 10px 12px;
    width: 100%;
}
#respond input:focus, #respond textarea:focus { outline: none; border-color: var(--accent); }
#respond .comment-notes, #respond .logged-in-as { font-size: 13px; color: var(--muted); margin-bottom: 14px; }
#respond .comment-notes a, #respond .logged-in-as a { color: var(--accent); }
.comments-closed { font-family: var(--mono); font-size: 13px; color: var(--muted); }

/* WP alignment helpers */
.alignleft { float: left; margin: 0 18px 12px 0; }
.alignright { float: right; margin: 0 0 12px 18px; }
.aligncenter { display: block; margin: 0 auto 18px; }
.wp-caption { max-width: 100%; }

/* ============ bbPress (forums) ============ */
#bbpress-forums {
    font-family: var(--sans);
    font-size: 15px;
    color: var(--ink);
}
#bbpress-forums ul.bbp-forums,
#bbpress-forums ul.bbp-topics,
#bbpress-forums ul.bbp-replies {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--panel);
    overflow: hidden;
}
#bbpress-forums li.bbp-header {
    background: var(--bg-deep);
    border-bottom: 1px solid var(--line);
    font-family: var(--mono);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--muted);
}
#bbpress-forums li.bbp-body ul.forum,
#bbpress-forums li.bbp-body ul.topic {
    border-bottom: 1px solid var(--line);
}
#bbpress-forums li.bbp-body ul.forum:hover,
#bbpress-forums li.bbp-body ul.topic:hover { background: oklch(0.22 0.02 235 / 0.5); }
#bbpress-forums li.bbp-footer { background: var(--bg-deep); border-top: 1px solid var(--line); }
li.bbp-forum-info .bbp-forum-title,
li.bbp-topic-title .bbp-topic-permalink {
    font-weight: 700;
    color: var(--accent);
    font-size: 16px;
}
.bbp-forum-content, .bbp-topic-meta { color: var(--muted); font-size: 13.5px; }
#bbpress-forums .bbp-forum-freshness a,
#bbpress-forums .bbp-topic-freshness a { color: var(--muted); font-family: var(--mono); font-size: 12px; }
#bbpress-forums div.bbp-forum-author img.avatar,
#bbpress-forums div.bbp-topic-author img.avatar,
#bbpress-forums div.bbp-reply-author img.avatar { border-radius: 6px; border: 1px solid var(--line); }
#bbpress-forums div.bbp-topic-content, #bbpress-forums div.bbp-reply-content { color: var(--ink); }
#bbpress-forums .bbp-reply-header { background: var(--bg-deep); border-top: 1px solid var(--line); font-family: var(--mono); font-size: 12px; color: var(--muted); }
#bbpress-forums fieldset.bbp-form {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--panel);
    padding: 20px;
}
#bbpress-forums fieldset.bbp-form legend { font-family: var(--mono); color: var(--muted); padding: 0 8px; }
#bbpress-forums fieldset.bbp-form label { font-family: var(--mono); font-size: 12px; color: var(--muted); }
#bbpress-forums fieldset.bbp-form input[type="text"],
#bbpress-forums fieldset.bbp-form textarea {
    background: var(--bg-deep);
    border: 1px solid var(--line);
    border-radius: 6px;
    color: var(--ink);
    padding: 10px 12px;
    width: 100%;
}
#bbpress-forums fieldset.bbp-form input[type="text"]:focus,
#bbpress-forums fieldset.bbp-form textarea:focus { outline: none; border-color: var(--accent); }
#bbpress-forums button.button.submit {
    background: var(--accent);
    color: var(--accent-ink);
    border: none;
    border-radius: 6px;
    font-family: var(--mono);
    font-weight: 700;
    padding: 10px 20px;
    cursor: pointer;
}
.bbp-breadcrumb { font-family: var(--mono); font-size: 12px; color: var(--muted); margin-bottom: 16px; }
.bbp-breadcrumb a { color: var(--accent); }
div.bbp-template-notice,
div.bbp-template-notice.info,
div.bbp-template-notice.important,
div.bbp-template-notice.error,
div.bbp-template-notice.warning {
    background: var(--panel) !important;
    border: 1px solid var(--accent-dim);
    border-radius: 8px;
    color: var(--ink) !important;
    padding: 10px 14px;
}
div.bbp-template-notice li { color: var(--ink) !important; }

/* bbPress: beat the plugin's default light backgrounds */
#bbpress-forums li.bbp-body ul.forum,
#bbpress-forums li.bbp-body ul.topic,
#bbpress-forums li.bbp-body ul.reply,
#bbpress-forums div.odd, #bbpress-forums ul.odd,
#bbpress-forums div.even, #bbpress-forums ul.even {
    background: transparent !important;
}
#bbpress-forums ul.bbp-forums,
#bbpress-forums ul.bbp-topics,
#bbpress-forums ul.bbp-replies {
    background: var(--panel) !important;
}
#bbpress-forums li.bbp-header {
    background: var(--bg-deep) !important;
    color: var(--muted) !important;
}
#bbpress-forums li.bbp-footer { background: var(--bg-deep) !important; }
#bbpress-forums li.bbp-header .bbp-forum-info,
#bbpress-forums li.bbp-header .bbp-topic-title { color: var(--muted) !important; }
#bbpress-forums .bbp-forum-topic-count,
#bbpress-forums .bbp-forum-reply-count,
#bbpress-forums .bbp-topic-voice-count,
#bbpress-forums .bbp-topic-reply-count {
    color: var(--muted) !important;
    font-family: var(--mono);
}
#bbpress-forums li.bbp-forum-freshness,
#bbpress-forums li.bbp-topic-freshness,
#bbpress-forums li.bbp-forum-freshness a,
#bbpress-forums li.bbp-topic-freshness a {
    color: var(--muted) !important;
}
#bbpress-forums .bbp-forum-content { color: var(--muted) !important; }

/* bbPress search form */
#bbpress-forums #bbp-search-form,
div.bbp-search-form { margin-bottom: 18px; }
#bbpress-forums #bbp-search-form input[type="text"],
div.bbp-search-form input[type="text"] {
    background: var(--bg-deep);
    border: 1px solid var(--line);
    border-radius: 6px;
    color: var(--ink);
    padding: 8px 12px;
    font-family: var(--sans);
    font-size: 14px;
}
#bbpress-forums #bbp-search-form input[type="text"]:focus,
div.bbp-search-form input[type="text"]:focus { outline: none; border-color: var(--accent); }
#bbpress-forums #bbp-search-form input[type="submit"],
div.bbp-search-form input[type="submit"] {
    background: var(--accent);
    color: var(--accent-ink);
    border: none;
    border-radius: 6px;
    font-family: var(--mono);
    font-weight: 700;
    font-size: 13px;
    padding: 9px 16px;
    margin-left: 6px;
    cursor: pointer;
}