/* LinKingAudio blog - dark theme overrides (public pages) */
.blog-list-section,
#blog-list-section {
    background: #0d0d0d;
    color: #e8e9ec;
}

.blog-header-title {
    color: #e8e9ec !important;
}

.blog-subtitle {
    color: #a0a4ab !important;
}

.blog-card {
    background: #161616;
    border: 0.0625rem solid #2a2a2a;
}

.blog-card-title {
    color: #e8e9ec !important;
}

.blog-card-summary {
    color: #a0a4ab !important;
}

.blog-card-meta,
.blog-meta-item {
    color: #8b9199 !important;
}

.blog-card-placeholder {
    background: #1f1f1f;
    color: #555;
}

.blog-pagination-btn {
    background: #1a1a1a;
    border-color: #333;
    color: #e8e9ec;
}

.blog-pagination-btn:hover {
    border-color: var(--or, #f7641f);
    color: var(--or, #f7641f);
}

.blog-pagination-btn-active {
    background: var(--or, #f7641f);
    border-color: var(--or, #f7641f);
    color: #fff;
}

.blog-category-chip-active,
.blog-category-chip-all.blog-category-chip-active {
    --chip-bg: color-mix(in srgb, var(--or, #f7641f) 22%, #1a1a1a);
    --chip-border: var(--or, #f7641f);
    --chip-text: #f7641f;
    --chip-count-bg: color-mix(in srgb, var(--or, #f7641f) 28%, #1a1a1a);
    --chip-count-text: #ff8a4d;
    opacity: 1;
    filter: none;
    box-shadow: 0 0.25rem 0.75rem rgba(247, 100, 31, 0.18);
}

.blog-category-chip {
    --chip-bg: hsl(var(--chip-h) 28% 16%);
    --chip-border: hsl(var(--chip-h) 22% 28%);
    --chip-text: hsl(var(--chip-h) 45% 78%);
    --chip-count-bg: hsl(var(--chip-h) 24% 22%);
    --chip-count-text: hsl(var(--chip-h) 42% 86%);
    opacity: 0.88;
    filter: none;
}

.blog-category-chip:hover {
    --chip-bg: hsl(var(--chip-h) 32% 20%);
    --chip-border: hsl(var(--chip-h) 30% 36%);
    opacity: 1;
    filter: none;
}

.blog-category-chip-active .blog-category-chip-count {
    background: var(--chip-count-bg);
    color: var(--chip-count-text);
}

.blog-category-strip:has(.blog-category-chip-active:not(.blog-category-chip-all)) .blog-category-chip:not(.blog-category-chip-active) {
    opacity: 0.48;
    filter: saturate(0.65);
}

.blog-category-strip:has(.blog-category-chip-all.blog-category-chip-active) .blog-category-chip {
    opacity: 0.88;
    filter: none;
}

.blog-card-category {
    background: #1a1a1a;
    color: #8b9199;
    border: 0.0625rem solid #2e2e2e;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.blog-card-category:hover {
    background: #222;
    color: #a89f94;
    border-color: #3a3a3a;
}

.blog-card-category-more {
    background: #1a1a1a;
    color: #6f757d;
    border: 0.0625rem solid #2e2e2e;
}

.blog-tag {
    background: #1a1a1a;
    color: #8b9199;
    border: 0.0625rem solid #2e2e2e;
}

/* Blog detail - layout spacing */
.blogdetail {
    --blog-prose-text: #d4d6da;
    --blog-prose-heading: #e8e9ec;
    --blog-prose-muted: #a0a4ab;
    --blog-prose-link: var(--or, #f7641f);
    --blog-prose-border: #2a2a2a;
    background: #0d0d0d;
    color: var(--blog-prose-text);
    padding: 1.25rem 1.25rem clamp(2.5rem, 4vw, 3.5rem);
}

.blogdetail-header {
    margin-bottom: 1rem;
}

.blogdetail-cover {
    margin-bottom: 1rem;
}

.blogdetail-content {
    margin-top: 0.75rem;
    margin-bottom: 1.5rem;
}

.blogdetail-author-card {
    margin-top: 0;
    padding-top: 1.5rem;
    border-top-color: var(--blog-prose-border);
}

.blogdetail-title {
    color: var(--blog-prose-heading) !important;
}

/* Breadcrumb */
.blogdetail-breadcrumb {
    color: #6f757d;
    margin-bottom: 0.875rem;
}

.blogdetail-breadcrumb .blogdetail-breadcrumb-link,
.blogdetail-breadcrumb-link {
    color: #8b9199 !important;
    text-decoration: none;
    transition: color 0.2s ease, opacity 0.2s ease;
}

.blogdetail-breadcrumb .blogdetail-breadcrumb-link:hover,
.blogdetail-breadcrumb .blogdetail-breadcrumb-link:focus-visible,
.blogdetail-breadcrumb-link:hover,
.blogdetail-breadcrumb-link:focus-visible {
    color: #c4c8ce !important;
    text-decoration: underline;
}

.blogdetail-breadcrumb-separator {
    color: #4a4f56;
}

.blogdetail-breadcrumb-current {
    color: #a0a4ab !important;
    font-weight: 500;
}

.blogdetail-meta-item {
    color: var(--blog-prose-muted) !important;
}

.blogdetail-meta-author,
a.blogdetail-meta-author-link {
    color: #a89f94 !important;
}

.blogdetail-meta-author:hover,
a.blogdetail-meta-author-link:hover {
    color: #c4b8aa !important;
}

.blogdetail-tags .blogdetail-tag {
    background: #1a1a1a;
    color: #8b9199;
    border: 0.0625rem solid #2e2e2e;
}

/* Share row */
.blogdetail-share-buttons {
    border-top-color: var(--blog-prose-border);
    margin-top: 0.75rem;
    padding-top: 0.75rem;
}

.blogdetail-share-label {
    color: var(--blog-prose-muted);
}

.blogdetail-share-btn {
    background: #161616;
    border-color: #333;
    color: var(--blog-prose-muted);
}

/* Article body - dark theme, compact spacing */
.blogdetail-content {
    --blog-read-bg: transparent;
    --blog-read-text: #d4d6da;
    --blog-read-heading: #e8e9ec;
    --blog-read-muted: #a0a4ab;
    --blog-read-link: var(--or, #f7641f);
    background: var(--blog-read-bg);
    color: var(--blog-read-text);
    color-scheme: dark;
    padding: 0.5rem 0 0.75rem;
    border: none;
    border-radius: 0;
    box-shadow: none;
    max-width: 100%;
}

.blogdetail-content :is(h1, h2, h3, h4, h5, h6) {
    color: var(--blog-read-heading) !important;
}

.blogdetail-content :is(p, li, td, th, dd, dt, figcaption, label) {
    color: var(--blog-read-text);
}

.blogdetail-content strong,
.blogdetail-content b {
    color: var(--blog-read-heading);
}

.blogdetail-content a {
    color: var(--blog-read-link) !important;
}

.blogdetail-content a:hover {
    color: #ff8a4d !important;
}

.blogdetail-content blockquote {
    border-left-color: var(--blog-read-link);
    color: var(--blog-read-muted) !important;
}

.blogdetail-content code {
    background: #1f1f1f;
    color: #e8e9ec;
}

.blogdetail-content pre {
    background: #161616;
    color: #e8e9ec;
    border: 0.0625rem solid var(--blog-prose-border);
}

/* Rich-text inline colors from editor (light-theme HTML) */
.blogdetail-content :is(
    [style^="color:"],
    [style*=";color:"],
    [style*="; color:"],
    font[color]
) {
    color: var(--blog-read-text) !important;
}

.blogdetail-content :is(h1, h2, h3, h4, h5, h6):is(
    [style^="color:"],
    [style*=";color:"],
    [style*="; color:"]
) {
    color: var(--blog-read-heading) !important;
}

.blogdetail-content a:is(
    [style^="color:"],
    [style*=";color:"],
    [style*="; color:"]
) {
    color: var(--blog-read-link) !important;
}

.blogdetail-category-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #1a1a1a;
    color: #8b9199;
    border: 0.0625rem solid #2e2e2e;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.blogdetail-category-chip:hover {
    background: #222;
    color: #a89f94;
    border-color: #3a3a3a;
}

.blogdetail-author-card-inner {
    background: #161616;
    border-color: var(--blog-prose-border);
}

.blogdetail-author-name {
    color: var(--blog-prose-heading) !important;
}

.blogdetail-author-bio {
    color: var(--blog-prose-muted) !important;
}

.blogdetail-author-profile-link:hover .blogdetail-author-name {
    color: var(--blog-prose-link) !important;
}

.blogdetail-author-social-link {
    background: #1f1f1f;
    border-color: #333;
    color: var(--blog-prose-muted);
}

.blogdetail-author-social-link:hover {
    border-color: var(--or, #f7641f);
    color: var(--or, #f7641f);
}

.blogdetail-related-blogs {
    background: #0a0a0a;
    border-top: 0.0625rem solid var(--blog-prose-border);
}

.blogdetail-related-blogs-title {
    color: var(--blog-prose-heading) !important;
}

.blogdetail-card {
    background: #161616;
    border-color: var(--blog-prose-border);
}

.blogdetail-card-title {
    color: var(--blog-prose-heading) !important;
}

.blogdetail-card-summary {
    color: var(--blog-prose-muted) !important;
}

.blogdetail-related-card {
    background: #161616;
    border-color: #2a2a2a;
}

/* Author profile page */
.blog-author-page {
    background: #0d0d0d;
    color: #e8e9ec;
    padding: 1.25rem 0 clamp(3rem, 5vw, 4rem);
}

.blog-author-breadcrumb {
    color: #6f757d;
    margin-bottom: 1.25rem;
}

.blog-author-breadcrumb a {
    color: #8b9199;
    text-decoration: none;
}

.blog-author-breadcrumb a:hover,
.blog-author-breadcrumb a:focus-visible {
    color: #c4c8ce;
    text-decoration: underline;
}

.blog-author-breadcrumb-sep {
    color: #4a4f56;
}

.blog-author-breadcrumb > span:last-child {
    color: #a0a4ab;
    font-weight: 500;
}

.blog-author-header {
    background: #161616 !important;
    border-color: #2a2a2a !important;
    margin-bottom: 1.75rem;
}

.blog-author-header-avatar {
    border-color: #2a2a2a;
    box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.45);
}

.blog-author-header-title,
.blog-author-name {
    color: #e8e9ec !important;
}

.blog-author-header-bio,
.blog-author-bio {
    color: #a0a4ab !important;
}

.blog-author-social-link {
    background: #1f1f1f;
    border-color: #333;
    color: #a0a4ab;
}

.blog-author-social-link:hover {
    color: var(--or, #f7641f);
    border-color: var(--or, #f7641f);
    box-shadow: 0 0.125rem 0.5rem rgba(247, 100, 31, 0.2);
}

.blog-author-posts-heading {
    color: #e8e9ec !important;
    margin-bottom: 1.5rem;
}

.blog-author-page .blog-empty {
    color: #a0a4ab;
}

.blog-author-page .blog-card-category:hover {
    color: #a89f94;
}

.blog-authors-index-header {
    text-align: center;
    margin-bottom: 2rem;
}

.blog-authors-index-title {
    margin: 0;
    font-size: 2rem;
    font-weight: 700;
    color: #e8e9ec;
}

.blog-authors-index-subtitle {
    margin: 0.625rem 0 0;
    font-size: 1rem;
    color: #a0a4ab;
}

.blog-authors-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    width: 100%;
}

@media (max-width: 40rem) {
    .blog-authors-grid {
        grid-template-columns: 1fr;
    }
}

.blog-author-card {
    background: #161616;
    border: 0.0625rem solid #2a2a2a;
    border-radius: 0.75rem;
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.blog-author-card:hover {
    border-color: #3a3a3a;
}

.blog-author-card-link {
    display: flex;
    align-items: flex-start;
    gap: 1.125rem;
    padding: 1.25rem 1.5rem;
    text-decoration: none;
    color: inherit;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
}

.blog-author-card-avatar {
    width: 5rem;
    height: 5rem;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 0.0625rem solid #333;
}

.blog-author-card-avatar--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #222;
    color: #8b9199;
    font-size: 1.25rem;
    font-weight: 700;
}

.blog-author-card-body {
    min-width: 0;
}

.blog-author-card-name {
    margin: 0 0 0.375rem;
    font-size: 1.0625rem;
    font-weight: 650;
    color: #e8e9ec;
    line-height: 1.25;
}

.blog-author-card-bio {
    margin: 0 0 0.5rem;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: #8b9199;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-author-card-meta {
    margin: 0;
    font-size: 0.75rem;
    color: #6f757d;
}
