/*── Portoijo Post Styles ──*/
/* Single post, author bio, comments, share, focus mode, reading progress */

/*── POST META — labels ──*/
.entry-meta{display:flex;align-items:center;flex-wrap:wrap;gap:0.35rem 1rem;font-size:0.82rem;color:var(--color-text-muted);margin-bottom:2rem}
.meta-author{display:flex;align-items:center;gap:0.5rem}
.author-name-inline{font-weight:600;color:var(--color-heading)}
.author-name-inline:hover{color:var(--color-accent)}
.meta-label{font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted);margin-right:0.25rem}

/*── POST TAGS — botanical pills ──*/
.post-tags{margin-bottom:1.5rem}
.post-tags-label{font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--color-text-muted);margin-bottom:0.6rem}
.tag-list{display:flex;flex-wrap:wrap;gap:0.4rem}
.tag-list a,
a.tag{display:inline-flex;align-items:center;padding:0.3rem 0.85rem;font-size:0.75rem;font-weight:500;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:2rem;transition:all 0.2s;text-decoration:none}
.tag-list a:hover,
a.tag:hover{background:var(--color-accent);color:#fff;border-color:var(--color-accent);transform:translateY(-1px);box-shadow:var(--shadow-sm)}

/*── POST TOC — collapsible (matching static pages) ──*/
.post-toc{margin:1.5rem 0 2rem;background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}
.post-toc-toggle{display:flex;align-items:center;gap:0.6rem;padding:0.9rem 1.25rem;cursor:pointer;font-size:0.9rem;font-weight:600;color:var(--color-heading);user-select:none;list-style:none}
.post-toc-toggle::-webkit-details-marker{display:none}
.post-toc-toggle .toc-chevron{font-size:0.65rem;transition:transform 0.2s;margin-left:auto;color:var(--color-text-muted)}
.post-toc[open] .toc-chevron{transform:rotate(180deg)}
.post-toc-content{padding:0 1.25rem 1.25rem}
.post-toc-content ul{list-style:none;padding:0;margin:0}
.post-toc-content li{margin-bottom:0.15rem}
.post-toc-content a{display:block;font-size:0.85rem;color:var(--color-text-light);line-height:1.55;padding:0.25rem 0.5rem;border-radius:0.35rem;text-decoration:none;transition:all 0.15s;border-left:2px solid transparent}
.post-toc-content a:hover{color:var(--color-accent);background:var(--color-accent-soft);border-left-color:var(--color-accent)}
.post-toc-content .h2-toc > a{font-weight:600;color:var(--color-heading);font-size:0.87rem;padding:0.35rem 0.5rem}
.post-toc-content .h3-toc{padding-left:1.25rem;margin:0.2rem 0 0.4rem;border-left:1px solid var(--color-border-light)}
.post-toc-content .h3-toc-item > a{font-size:0.8rem;color:var(--color-text-light);font-weight:400;padding:0.2rem 0.5rem}
/* Active TOC link (scroll-spy) */
.post-toc-content a.active{color:var(--color-accent);background:var(--color-accent-soft);border-left-color:var(--color-accent)}

/*── POST SHARE — compact row ──*/
.post-share{display:flex;align-items:center;gap:0.5rem;margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--color-border)}
.post-share-label{font-size:0.75rem;font-weight:600;color:var(--color-text-muted);margin-right:0.25rem}
.share-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:var(--color-surface);color:var(--color-text-light);transition:all 0.2s;border:1px solid var(--color-border);cursor:pointer}
.share-btn:hover{background:var(--color-accent);color:#fff;border-color:var(--color-accent);transform:translateY(-2px)}
.share-btn.copy-link-btn{font-size:0.85rem;width:auto;padding:0 0.75rem;border-radius:2rem}

/*── PROGRESS BAR WITH % ──*/
#progress-bar{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--color-accent),var(--color-gold));z-index:1000;transition:width 0.15s linear}
#progress-pct{position:fixed;top:8px;right:12px;font-size:0.7rem;font-weight:700;color:var(--color-accent);z-index:1001;background:var(--color-card);padding:0.15rem 0.5rem;border-radius:2rem;border:1px solid var(--color-border);opacity:0;transition:opacity 0.2s}
#progress-pct.visible{opacity:1}

/*── SERIES NAVIGATION BOX ──*/
.series-nav-box{background:var(--color-accent-soft);border:1px solid var(--color-accent);border-left:4px solid var(--color-accent);border-radius:var(--radius-lg);padding:1rem 1.25rem;margin-bottom:1.5rem}
.series-nav-label{display:block;font-size:0.78rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-accent);margin-bottom:0.35rem}
.series-nav-count{font-size:0.85rem;color:var(--color-heading);font-weight:600;margin-bottom:0.75rem;display:block}
.series-nav-links{display:flex;gap:0.4rem;flex-wrap:wrap}
.series-dot{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;font-size:0.75rem;font-weight:600;background:var(--color-card);color:var(--color-text);border:1px solid var(--color-border);transition:all 0.2s}
.series-dot:hover{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}
.series-dot.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-soft)}

/*── AI DISCLOSURE BADGE ──*/
.ai-disclosure-badge{display:flex;align-items:flex-start;gap:0.6rem;padding:0.75rem 1rem;background:#f0f9ff;border:1px solid #bae6fd;border-radius:var(--radius);font-size:0.8rem;color:var(--color-text-light);line-height:1.5;margin-bottom:1rem}
[data-theme="dark"] .ai-disclosure-badge{background:rgba(186,230,253,0.08);border-color:rgba(186,230,253,0.2);color:rgba(255,255,255,0.6)}

/*── STICKY SHARE BAR (Mobile) ──*/
.sticky-share-bar{position:fixed;bottom:58px;left:0;right:0;background:var(--color-card);border-top:1px solid var(--color-border);z-index:998;display:flex;justify-content:center;gap:0.5rem;padding:0.5rem 1rem;padding-bottom:max(0.5rem,env(safe-area-inset-bottom));transform:translateY(100%);transition:transform 0.35s cubic-bezier(0.25,0.46,0.45,0.94);box-shadow:0 -2px 15px rgba(0,0,0,0.08)}
.sticky-share-bar.visible{transform:translateY(0)}
.sticky-share-bar .share-label{display:none;font-size:0.7rem;font-weight:600;color:var(--color-text-muted);align-items:center;margin-right:0.25rem}
@media(min-width:480px){.sticky-share-bar .share-label{display:flex}}
.sticky-share-bar .share-pill{display:inline-flex;align-items:center;gap:0.35rem;padding:0.45rem 0.85rem;border-radius:2rem;font-size:0.75rem;font-weight:600;text-decoration:none;border:1px solid var(--color-border);color:var(--color-text);background:var(--color-surface);transition:all 0.2s;cursor:pointer;font-family:var(--font-body)}
.sticky-share-bar .share-pill:hover{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}
.sticky-share-bar .share-pill.copy-pill{background:var(--color-card)}
@media(min-width:769px){.sticky-share-bar{display:none}}

/*── FONT SIZE ADJUSTER ──*/
.font-adjuster{display:inline-flex;align-items:center;gap:0.2rem;margin-left:0.5rem}
.font-adjuster button{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--color-border);background:var(--color-card);color:var(--color-text-light);font-size:0.7rem;font-weight:700;cursor:pointer;transition:all 0.15s;font-family:var(--font-body);line-height:1}
.font-adjuster button:hover{border-color:var(--color-accent);color:var(--color-accent)}
.font-adjuster button.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}
.font-adjuster .font-label{font-size:0.65rem;color:var(--color-text-muted);margin:0 0.15rem;font-weight:500}

/*── UPDATE NOTICE (E-E-A-T) ──*/
.update-notice{display:flex;align-items:flex-start;gap:0.6rem;padding:0.75rem 1rem;background:var(--color-accent-soft);border:1px solid var(--color-accent);border-radius:var(--radius);font-size:0.82rem;color:var(--color-heading);line-height:1.5;margin-bottom:1rem}
.update-notice-old{background:#fef9c3;border-color:#facc15;color:#854d0e}
[data-theme="dark"] .update-notice-old{background:rgba(250,204,21,0.1);border-color:rgba(250,204,21,0.25);color:#fde68a}

/*── CITE BUTTON ──*/
.cite-btn{font-size:0.75rem;width:auto;padding:0 0.7rem;border-radius:2rem;font-weight:600;gap:0.3rem}
.cite-btn.copied{background:var(--color-accent);color:#fff}

/*── SCROLL TO TOP ──*/
.scroll-to-top{position:fixed;bottom:2rem;right:2rem;width:42px;height:42px;border-radius:50%;background:var(--color-accent);color:#fff;font-size:1.2rem;font-weight:700;border:none;cursor:pointer;z-index:999;opacity:0;transform:translateY(20px);transition:all 0.3s;box-shadow:var(--shadow-lg)}
.scroll-to-top.visible{opacity:1;transform:translateY(0)}
.scroll-to-top:hover{background:var(--color-primary);transform:translateY(-2px)}

/*── LIGHTBOX ──*/
.lightbox-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.92);z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity 0.3s;cursor:zoom-out}
.lightbox-overlay.active{opacity:1}
.lightbox-overlay img{max-width:92vw;max-height:92vh;object-fit:contain;border-radius:var(--radius);box-shadow:0 20px 60px rgba(0,0,0,0.5)}
.lightbox-close{position:absolute;top:1.5rem;right:1.5rem;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.1);color:#fff;font-size:1.5rem;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s;z-index:1}
.lightbox-close:hover{background:rgba(255,255,255,0.2);transform:scale(1.1)}

/*── NEWSLETTER FEEDBACK ──*/
.newsletter-success{display:none;text-align:center;padding:1rem;color:var(--color-accent);font-weight:600;font-size:0.9rem;margin-top:0.5rem}
.newsletter-success.show{display:block;animation:fade-in-up 0.4s ease}
@keyframes fade-in-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/*── BREADCRUMB MOBILE ──*/
@media(max-width:480px){
  .breadcrumb{font-size:0.7rem;flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;padding:0.5rem 0;gap:0.2rem;mask-image:linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,#000 10%,#000 90%,transparent 100%)}
}

/*── RELATED POST THUMBNAILS ──*/
.related-post-link{display:block;padding:0;overflow:hidden;border-radius:var(--radius);background:var(--color-card);border:1px solid var(--color-border);transition:all 0.25s}
.related-post-link:hover{border-color:var(--color-accent);box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.related-post-thumb{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--color-surface)}
.related-post-thumb img{width:100%;height:100%;object-fit:cover;transition:transform 0.4s ease}
.related-post-link:hover .related-post-thumb img{transform:scale(1.05)}
.related-post-title{display:block;font-weight:600;font-size:0.85rem;color:var(--color-heading);padding:0.75rem 1rem 0.25rem;line-height:1.35}
.related-post-date{display:block;font-size:0.72rem;color:var(--color-text-muted);padding:0 1rem 0.75rem}

/*── TYPE BADGE ──*/
.post-type-badge{font-size:0.65rem;padding:0.1em 0.5em;background:var(--color-accent-soft);border-radius:1rem;margin-left:0.35rem;vertical-align:middle}

/*── CAT VIEW COUNT ──*/
.cat-view-count{font-size:0.7rem;color:var(--color-text-muted);margin-left:0.5rem}

/*── AUTHOR BOX (E-E-A-T) ──*/
.author-box{margin-top:2.5rem;padding-top:2rem;border-top:2px solid var(--color-accent-soft)}
.author-box-inner{display:flex;gap:1.25rem;align-items:flex-start;padding:1.5rem;background:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border)}
.author-avatar-wrapper{position:relative;flex-shrink:0}
.author-avatar{width:72px;height:72px;border-radius:50%;object-fit:cover;border:3px solid var(--color-accent-soft)}
.author-verified{position:absolute;bottom:0;right:0;width:22px;height:22px;border-radius:50%;background:var(--color-accent);display:flex;align-items:center;justify-content:center;border:2px solid var(--color-bg)}
.author-verified svg{color:#fff;width:12px;height:12px}
.author-name-row{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap;margin-bottom:0.35rem}
.author-name{font-family:var(--font-display);font-size:1rem;font-weight:700;color:var(--color-heading);margin:0}
.author-name a{color:inherit;text-decoration:none}
.author-name a:hover{color:var(--color-accent)}
.author-badge{font-size:0.62rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;padding:0.15em 0.6em;background:var(--color-accent-soft);color:var(--color-accent);border-radius:1rem}
.author-bio{font-size:0.85rem;color:var(--color-text-light);line-height:1.6;margin-bottom:0.75rem;max-width:520px}
.author-links{display:flex;gap:0.75rem;flex-wrap:wrap}
.author-link{font-size:0.78rem;font-weight:500;color:var(--color-accent);transition:all 0.2s}
.author-link:hover{color:var(--color-accent-hover);transform:translateX(2px)}
.author-link.support{color:var(--color-gold);font-weight:600}
.author-link.support:hover{color:#b58434}
@media(max-width:480px){
  .author-box-inner{flex-direction:column;align-items:center;text-align:center}
  .author-name-row{justify-content:center}
  .author-bio{max-width:100%;text-align:center}
  .author-links{justify-content:center}
  .update-notice,.ai-disclosure-badge{margin-left:1rem;margin-right:1rem;border-radius:var(--radius-sm)}
}

/*── Mobile tables — horizontal scroll ──*/
@media(max-width:768px){
  .entry-content table{
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    white-space:nowrap;
  }
}