/**
 * Javelin Blog Toolbox — frontend styles (Author Box, TOC, TL;DR).
 * Neutral palette so it inherits the client theme; overridable per-module via
 * custom_css pushed from the panel.
 */

/* ── Author box ─────────────────────────────────────────────────────────── */
.javelin-author-box { margin: 40px 0; clear: both; }
.javelin-author-box * { box-sizing: border-box; }
.javelin-author-box-inner { display: flex; gap: 24px; align-items: flex-start; }
.javelin-author-photo { flex-shrink: 0; }
.javelin-author-avatar { width: 100px; height: 100px; border-radius: 50%; object-fit: cover; display: block; }
.javelin-author-avatar-placeholder { background: linear-gradient(135deg, #5a6b7d 0%, #2e3a47 100%); }
.javelin-author-info { flex: 1; min-width: 0; }
.javelin-author-header { margin-bottom: 12px; }
.javelin-author-name { margin: 0 0 4px 0; font-size: 1.25rem; font-weight: 600; line-height: 1.3; color: inherit; }
.javelin-author-position { display: inline-block; font-size: 0.875rem; color: #666; }
.javelin-author-bio { margin-bottom: 16px; font-size: 0.9375rem; line-height: 1.6; color: #444; }
.javelin-author-bio p:last-child { margin-bottom: 0; }
.javelin-author-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.javelin-author-social { display: flex; gap: 8px; }
.javelin-author-social-link { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: #f0f0f0; color: #555; text-decoration: none; transition: all 0.2s ease; }
.javelin-author-social-link:hover { background: #333; color: #fff; }
.javelin-author-button { display: inline-block; padding: 10px 20px; background: #333; color: #fff; font-size: 0.875rem; font-weight: 500; text-decoration: none; border-radius: 6px; transition: all 0.2s ease; }
.javelin-author-button:hover { background: #555; color: #fff; text-decoration: none; }

/* Style variants */
.javelin-author-style-default .javelin-author-box-inner { padding: 24px; background: #f9f9f9; border: 1px solid #e0e0e0; border-radius: 8px; }
.javelin-author-style-modern .javelin-author-box-inner { padding: 32px; background: linear-gradient(135deg, #3e4c5b 0%, #1d2630 100%); border-radius: 16px; color: #fff; }
.javelin-author-style-modern .javelin-author-name { color: #fff; }
.javelin-author-style-modern .javelin-author-position { color: rgba(255, 255, 255, 0.75); }
.javelin-author-style-modern .javelin-author-bio { color: rgba(255, 255, 255, 0.9); }
.javelin-author-style-modern .javelin-author-social-link { background: rgba(255, 255, 255, 0.18); color: #fff; }
.javelin-author-style-modern .javelin-author-social-link:hover { background: #fff; color: #3e4c5b; }
.javelin-author-style-modern .javelin-author-button { background: #fff; color: #1d2630; }
.javelin-author-style-minimal .javelin-author-box-inner { padding: 24px 0; border-top: 2px solid #333; }
.javelin-author-style-minimal .javelin-author-avatar { width: 80px; height: 80px; }
.javelin-author-style-minimal .javelin-author-button { background: transparent; color: #333; border: 2px solid #333; padding: 8px 16px; }
.javelin-author-style-minimal .javelin-author-button:hover { background: #333; color: #fff; }
.javelin-author-style-card .javelin-author-box-inner { flex-direction: column; align-items: center; text-align: center; padding: 32px; background: #fff; border-radius: 16px; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1); }
.javelin-author-style-card .javelin-author-avatar { width: 120px; height: 120px; }
.javelin-author-style-card .javelin-author-info { display: flex; flex-direction: column; align-items: center; }
.javelin-author-style-card .javelin-author-footer { flex-direction: column; gap: 16px; }

@media (max-width: 600px) {
    .javelin-author-box-inner { flex-direction: column; align-items: center; text-align: center; }
    .javelin-author-footer { flex-direction: column; align-items: center; }
    .javelin-author-info { display: flex; flex-direction: column; align-items: center; }
}

/* ── TL;DR ──────────────────────────────────────────────────────────────── */
.javelin-tldr { background-color: #f4f7fa; border-left: 5px solid #44525f; padding: 20px 25px; margin: 30px 0; border-radius: 4px; }
.javelin-tldr-title { margin: 0 0 15px 0 !important; font-size: 1.2rem !important; font-weight: 700; display: flex; align-items: center; gap: 8px; color: #1d2327; }
.javelin-tldr-title svg { flex-shrink: 0; color: #44525f; }
.javelin-tldr-list { margin: 0 !important; padding-left: 20px !important; list-style-type: disc !important; }
.javelin-tldr-list li { margin-bottom: 8px; line-height: 1.5; color: #3c434a; }
.javelin-tldr-list li:last-child { margin-bottom: 0; }

/* ── Table of contents ──────────────────────────────────────────────────── */
.javelin-toc { margin: 30px 0; padding: 20px; background: #fff; border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05); }
.javelin-toc-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; cursor: pointer; }
.javelin-toc-title { font-weight: 700; font-size: 1.1rem; }
.javelin-toc-toggle { background: none; border: none; cursor: pointer; padding: 4px; color: #555; line-height: 0; transition: transform 0.3s ease; }
.javelin-toc-list { margin: 0 !important; padding: 0 !important; list-style: none !important; max-height: 2000px; transition: max-height 0.3s ease; overflow: hidden; }
ol.javelin-toc-list { list-style: decimal !important; padding-left: 24px !important; }
.javelin-toc-item { margin-bottom: 8px; line-height: 1.4; }
.javelin-toc-link { text-decoration: none; color: #2271b1; font-size: 0.95rem; display: block; transition: color 0.2s; }
.javelin-toc-link:hover { color: #135e96; text-decoration: underline; }

/* Indent per heading level */
.javelin-toc-item-h3 { margin-left: 20px; }
.javelin-toc-item-h4 { margin-left: 40px; }
.javelin-toc-item-h5 { margin-left: 60px; }
.javelin-toc-item-h6 { margin-left: 80px; }

/* Desktop: sticky sidebar variant (settings.sticky) */
@media (min-width: 1200px) {
    .javelin-toc.javelin-toc-sticky { float: right; width: 300px; margin: 0 0 20px 30px; position: sticky; top: 40px; z-index: 10; }
    .javelin-toc.javelin-toc-sticky .javelin-toc-toggle { display: none; }
    .javelin-toc.javelin-toc-sticky .javelin-toc-header { cursor: default; }
}

/* Mobile (and non-sticky everywhere): collapsible */
.javelin-toc.collapsed .javelin-toc-list { max-height: 0; }
.javelin-toc.collapsed .javelin-toc-toggle { transform: rotate(-90deg); }