/* ====================================================================
   EduMaster Single Post / Product / Course Styles - v4.2
   从 single.php 内联 <style> 提取，通过 wp_enqueue_style 加载。
   ==================================================================== */

/* ---------- CSS Variables (shared with theme root) ---------- */
:root {
    --c: #00A3FF; --cd: #0071BC; --s: #10B981; --w: #F59E0B; --e: #EF4444; --p: #8B5CF6;
    --g50: #F9FAFB; --g100: #F3F4F6; --g200: #E5E7EB; --g300: #D1D5DB; --g400: #9CA3AF;
    --g500: #6B7280; --g600: #4B5563; --g700: #374151; --g800: #1F2937; --g900: #111827;
    --r: 12px; --r2: 16px; --r3: 20px; --r4: 24px;
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
    --shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
    --shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1);
}

/* ---------- Base Container ---------- */
.single-main {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'PingFang SC', sans-serif;
    background: #f5f6f7;
    color: var(--g900);
    line-height: 1.7;
    padding: 0 0 60px;
}
.container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }

/* ---------- Top Bar ---------- */
.top-bar{background:linear-gradient(135deg,#667eea,#764ba2);padding:12px 0;}
.top-bar-inner{max-width:1100px;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between;}
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:14px;color:rgba(255,255,255,0.9);}
.breadcrumb a{color:rgba(255,255,255,0.9);text-decoration:none;}
.breadcrumb span{color:rgba(255,255,255,0.6);}
.top-actions{display:flex;gap:8px;}
.top-actions button{background:rgba(255,255,255,0.15);border:none;padding:6px 12px;border-radius:20px;color:#fff;font-size:12px;cursor:pointer;}

/* ---------- Top Nav ---------- */
.top-nav{background:linear-gradient(135deg,#667eea,#764ba2);padding:16px 0;position:relative;overflow:hidden;}
.top-nav::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");opacity:0.5;}
.top-nav-content{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1;}
.breadcrumb a:hover{text-decoration:underline;}
.top-actions button{background:rgba(255,255,255,0.15);border:none;padding:8px 16px;border-radius:20px;color:#fff;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all 0.2s;}
.top-actions button:hover{background:rgba(255,255,255,0.25);}

/* ---------- Hero ---------- */
.hero{position:relative;height:400px;margin-top:-60px;}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;}
.hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);}
.hero-content{position:absolute;bottom:0;left:0;right:0;padding:40px;z-index:1;}
.category-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;background:var(--c);color:#fff;border-radius:20px;font-size:13px;font-weight:500;margin-bottom:16px;}
.hero-title{font-size:36px;font-weight:700;color:#fff;margin:0 0 20px 0;line-height:1.3;text-shadow:0 2px 4px rgba(0,0,0,0.3);}
.hero-meta{display:flex;align-items:center;flex-wrap:wrap;gap:20px;color:rgba(255,255,255,0.9);font-size:14px;}
.hero-meta-item{display:flex;align-items:center;gap:6px;}
.hero-meta svg{width:16px;height:16px;opacity:0.8;}

/* ---------- Author Card ---------- */
.author-card{background:#fff;border-radius:var(--r3);padding:24px;margin:24px 0;box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:20px;}
.author-avatar{width:72px;height:72px;border-radius:50%;object-fit:cover;border:3px solid var(--g100);}
.author-info{flex:1;}
.author-name{font-size:18px;font-weight:600;color:var(--g900);margin-bottom:4px;}
.author-bio{font-size:14px;color:var(--g500);margin-bottom:8px;line-height:1.5;}
.author-stats{display:flex;gap:16px;font-size:13px;color:var(--g400);}
.author-stats span{color:var(--c);font-weight:600;}
.author-actions button{padding:10px 20px;border:none;border-radius:var(--r);font-size:14px;font-weight:500;cursor:pointer;transition:all 0.2s;}
.btn-follow{background:var(--c);color:#fff;}
.btn-follow:hover{background:var(--cd);}
.btn-message{background:var(--g100);color:var(--g700);}
.btn-message:hover{background:var(--g200);}

/* ---------- Stats Card ---------- */
.site-stats-card{background:#fff;border-radius:24px;padding:22px 20px;margin:24px auto;max-width:760px;box-shadow:var(--shadow-sm);text-align:center;}
.site-stats-card h2{font-size:18px;font-weight:700;color:var(--g900);margin-bottom:14px;}
.site-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(100px,1fr));gap:14px;margin:16px 0;}
.site-stats-item{padding:18px 14px;border:1px solid rgba(59,130,246,0.12);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,0.96),#fff);}
.site-stats-item span{display:block;font-size:22px;font-weight:700;color:var(--c);line-height:1;}
.site-stats-item p{margin:8px 0 0;color:var(--g600);font-size:13px;}
.site-stats-speed{font-size:13px;color:var(--g600);}

/* ---------- Info Card ---------- */
.info-card{background:#fff;border-radius:var(--r3);padding:24px;margin-bottom:24px;box-shadow:var(--shadow-sm);}
.info-title{font-size:16px;font-weight:600;margin:0 0 20px 0;color:var(--g800);display:flex;align-items:center;gap:8px;}
.info-title::before{content:'';width:4px;height:20px;background:var(--c);border-radius:2px;}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;}
.info-item{padding:20px;background:linear-gradient(135deg,#f8fafc,#f1f5f9);border-radius:var(--r);text-align:center;transition:all 0.3s;}
.info-item:hover{transform:translateY(-2px);box-shadow:var(--shadow);}
.info-value{font-size:22px;font-weight:700;margin-bottom:4px;}
.info-value.price{color:var(--c);}
.info-value.stock{color:var(--s);}
.info-value.soldout{color:var(--e);}
.info-label{font-size:13px;color:var(--g500);}

/* ---------- Action Buttons ---------- */
.action-buttons{display:flex;gap:12px;margin-top:24px;padding-top:20px;border-top:1px solid var(--g100);}
.action-btn{flex:1;padding:14px 24px;border:none;border-radius:var(--r);font-size:15px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all 0.2s;}
.btn-primary{background:linear-gradient(135deg,var(--c),var(--cd));color:#fff;}
.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);}
.btn-secondary{background:var(--g100);color:var(--g700);}
.btn-secondary:hover{background:var(--g200);}

/* ---------- Article Content ---------- */
.article-container{display:grid;grid-template-columns:1fr 280px;gap:24px;}
.main-content{background:#fff;border-radius:var(--r3);padding:32px;box-shadow:var(--shadow-sm);}
.article-header{margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid var(--g100);}
.article-title{font-size:28px;font-weight:700;margin:0 0 16px 0;line-height:1.4;color:var(--g900);}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:14px;color:var(--g500);}
.article-meta-item{display:flex;align-items:center;gap:6px;}
.article-meta svg{width:16px;height:16px;}
.article-content{font-size:16px;line-height:1.9;color:var(--g700);}
.article-content img{max-width:100%;height:auto;border-radius:var(--r);margin:24px 0;box-shadow:var(--shadow);}
.article-content h2{font-size:22px;font-weight:700;margin:32px 0 16px 0;color:var(--g900);padding-bottom:8px;border-bottom:2px solid var(--g100);}
.article-content h3{font-size:18px;font-weight:600;margin:24px 0 12px 0;color:var(--g800);}
.article-content p{margin:0 0 20px 0;}
.article-content a{color:var(--c);text-decoration:none;border-bottom:1px solid transparent;}
.article-content a:hover{border-bottom-color:var(--c);}
.article-content blockquote{margin:24px 0;padding:20px 24px;background:linear-gradient(135deg,#f8fafc,#f0f9ff);border-left:4px solid var(--c);border-radius:0 var(--r) var(--r) 0;font-style:italic;}
.article-content pre{padding:20px;background:var(--g800);border-radius:var(--r);overflow-x:auto;color:#e5e7eb;font-size:14px;line-height:1.6;margin:24px 0;}
.article-content code{padding:2px 8px;background:var(--g100);border-radius:4px;font-family:'Fira Code',monospace;font-size:13px;color:var(--c);}
.article-content pre code{background:none;padding:0;color:inherit;}
.article-content ul,.article-content ol{margin:16px 0;padding-left:24px;}
.article-content li{margin:8px 0;}
.article-content table{width:100%;border-collapse:collapse;margin:24px 0;}
.article-content th,.article-content td{padding:12px;border:1px solid var(--g200);text-align:left;}
.article-content th{background:var(--g50);font-weight:600;}

/* ---------- Tags ---------- */
.article-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px;padding-top:20px;border-top:1px solid var(--g100);}
.tag{display:inline-flex;align-items:center;padding:6px 14px;background:var(--g100);border-radius:100px;font-size:13px;color:var(--g600);text-decoration:none;transition:all 0.2s;}
.tag:hover{background:var(--c);color:#fff;}

/* ---------- Sidebar ---------- */
.sidebar{position:sticky;top:20px;height:fit-content;}
.sidebar-widget{background:#fff;border-radius:var(--r3);padding:20px;margin-bottom:20px;box-shadow:var(--shadow-sm);}
.widget-title{font-size:16px;font-weight:600;margin:0 0 16px 0;color:var(--g800);display:flex;align-items:center;gap:8px;}
.widget-title::before{content:'📌';}

/* ---------- TOC ---------- */
.toc{position:relative;max-height:400px;overflow-y:auto;}
.toc-list{list-style:none;padding:0;margin:0;}
.toc-item{margin:8px 0;}
.toc-link{display:block;padding:8px 12px;border-radius:var(--r);color:var(--g600);text-decoration:none;font-size:14px;transition:all 0.2s;}
.toc-link:hover,.toc-link.active{background:var(--c);color:#fff;}

/* ---------- Related Posts ---------- */
.related-posts{background:#fff;border-radius:var(--r3);padding:24px;margin-top:24px;box-shadow:var(--shadow-sm);}
.related-title{font-size:18px;font-weight:600;margin:0 0 20px 0;color:var(--g800);}
.related-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;}
.related-item{text-decoration:none;color:inherit;}
.related-thumb{width:100%;height:120px;object-fit:cover;border-radius:var(--r);margin-bottom:8px;}
.related-item-title{font-size:14px;font-weight:500;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* ---------- Locked Content ---------- */
.locked{text-align:center;padding:60px 24px;background:#fff;border-radius:var(--r3);margin:24px 0;}
.locked svg{width:64px;height:64px;color:var(--g300);margin-bottom:20px;}
.locked h3{font-size:20px;font-weight:600;margin:0 0 12px 0;}
.locked p{color:var(--g500);margin:0 0 24px 0;}
.locked .btn{background:var(--c);color:#fff;padding:14px 32px;border-radius:var(--r);text-decoration:none;font-weight:600;display:inline-block;}

/* ---------- Share ---------- */
.share-section{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:32px;padding:20px;background:var(--g50);border-radius:var(--r);}
.share-label{font-size:14px;color:var(--g500);}
.share-buttons{display:flex;gap:12px;}
.share-btn{width:40px;height:40px;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:18px;transition:all 0.2s;}
.share-wechat{background:#07C160;color:#fff;}
.share-weibo{background:#E6162D;color:#fff;}
.share-qq{background:#12B7F5;color:#fff;}
.share-btn:hover{transform:scale(1.1);}

/* ---------- Bottom Mobile Nav ---------- */
.bottom-nav {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  padding: 8px 0;
  background: #fff;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.12);
  z-index: 9999;
}
.bottom-nav-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.bottom-nav-item {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: var(--g500);
  text-decoration: none;
  font-size: 12px;
  padding: 8px 0;
  text-align: center;
}
.bottom-nav-item svg { width: 20px; height: 20px; }
.bottom-nav-item.active { color: var(--c); }

/* ---------- Responsive (Mobile) ---------- */
@media(max-width:768px) {
.bottom-nav {display:flex !important;}
.single-main {padding:0 !important; padding-bottom:92px !important;}
.container {padding:0 10px !important;}
.top-bar {padding:6px 0 !important;}
.top-bar-inner {flex-direction:column !important;gap:4px !important;padding:0 10px !important;}
.breadcrumb {font-size:9px !important;flex-wrap:wrap !important;justify-content:center !important;gap:2px !important;}
.top-actions {width:100% !important;justify-content:center !important;gap:2px !important;}
.top-actions button {padding:3px 6px !important;font-size:9px !important;}
.hero {height:120px !important;margin-top:-20px !important;}
.hero-content {padding:8px !important;}
.hero-title {font-size:14px !important;}
.category-tag {font-size:8px !important;padding:2px 6px !important;}
.hero-meta {font-size:9px !important;gap:4px !important;}
.author-card {flex-direction:column !important;padding:8px !important;gap:6px !important;}
.author-avatar {width:36px !important;height:36px !important;}
.author-name {font-size:12px !important;}
.author-bio {display:none !important;}
.author-stats {font-size:9px !important;}
.author-actions {width:100% !important;flex-direction:row !important;gap:4px !important;}
.author-actions button {padding:6px !important;font-size:10px !important;}
.article-container {grid-template-columns:1fr !important;gap:8px !important;}
.main-content {padding:10px !important;border-radius:4px !important;}
.article-title {font-size:14px !important;}
.article-meta {font-size:9px !important;}
.article-content {font-size:12px !important;line-height:1.5 !important;}
.article-content p {margin:0 0 8px !important;}
.article-content img {margin:8px 0 !important;border-radius:4px !important;}
.article-content h2 {font-size:14px !important;margin:12px 0 6px !important;}
.article-content h3 {font-size:13px !important;margin:10px 0 4px !important;}
.info-card {padding:8px !important;border-radius:4px !important;margin-bottom:8px !important;}
.info-grid {gap:4px !important;}
.info-item {padding:6px !important;}
.info-value {font-size:12px !important;}
.info-label {font-size:9px !important;}
.action-buttons {gap:4px !important;margin-top:8px !important;padding-top:8px !important;}
.action-btn {padding:8px !important;font-size:11px !important;}
.related-posts {padding:8px !important;border-radius:4px !important;margin-top:8px !important;}
.related-title {font-size:12px !important;}
.related-list {gap:4px !important;}
.related-thumb {height:50px !important;}
.share-section {padding:8px !important;margin-top:10px !important;}
.share-btn {width:24px !important;height:24px !important;font-size:10px !important;}
.article-tags {margin-top:10px !important;padding-top:8px !important;}
.tag {font-size:9px !important;padding:2px 6px !important;}
.sidebar {display:none !important;}
}
@media(max-width:768px){
/* Duplicate responsive block from original (merged) */
.hero {height:150px !important;margin-top:-20px !important;}
.hero-content {padding:10px !important;}
.hero-title {font-size:16px !important;margin-bottom:6px !important;}
.category-tag {font-size:9px !important;padding:2px 6px !important;margin-bottom:4px !important;}
.hero-meta {gap:4px !important;font-size:10px !important;flex-wrap:wrap !important;}
.hero-meta-item svg {width:10px !important;height:10px !important;}
.author-card {flex-direction:column !important;padding:10px !important;gap:8px !important;}
.author-avatar {width:40px !important;height:40px !important;}
.author-info {text-align:center !important;}
.author-name {font-size:13px !important;}
.author-bio {font-size:11px !important;display:none !important;}
.author-stats {justify-content:center !important;font-size:10px !important;}
.author-actions {width:100% !important;flex-direction:row !important;gap:6px !important;}
.author-actions button {width:auto !important;flex:1 !important;padding:6px !important;font-size:11px !important;}
.article-container {grid-template-columns:1fr !important;gap:10px !important;padding:0 10px !important;}
.sidebar {display:none !important;}
.main-content {padding:12px !important;border-radius:6px !important;width:100% !important;}
.article-header {padding-bottom:10px !important;margin-bottom:10px !important;}
.article-title {font-size:15px !important;line-height:1.3 !important;}
.article-meta {font-size:10px !important;gap:4px !important;}
.article-meta svg {width:10px !important;height:10px !important;}
.article-content {font-size:13px !important;line-height:1.6 !important;width:100% !important;}
.article-content img {max-width:100% !important;height:auto !important;margin:10px 0 !important;border-radius:4px !important;}
.article-content h2 {font-size:15px !important;margin:16px 0 8px !important;}
.article-content h3 {font-size:14px !important;margin:14px 0 6px !important;}
.article-content p {margin:0 0 10px !important;}
.article-content pre {padding:8px !important;font-size:11px !important;border-radius:4px !important;overflow-x:auto !important;}
.article-content blockquote {padding:8px 10px !important;margin:10px 0 !important;border-radius:4px !important;}
.article-content ul,.article-content ol {padding-left:12px !important;margin:10px 0 !important;}
.article-content li {margin:4px 0 !important;}
.info-card {padding:10px !important;border-radius:6px !important;margin-bottom:10px !important;}
.info-title {font-size:13px !important;margin-bottom:8px !important;}
.info-grid {grid-template-columns:repeat(2,1fr) !important;gap:6px !important;}
.info-item {padding:6px !important;}
.info-value {font-size:14px !important;}
.info-label {font-size:10px !important;}
.action-buttons {flex-direction:column !important;gap:6px !important;margin-top:10px !important;padding-top:10px !important;}
.action-btn {padding:8px !important;font-size:12px !important;}
.related-posts {padding:10px !important;border-radius:6px !important;margin-top:10px !important;}
.related-title {font-size:13px !important;margin-bottom:8px !important;}
.related-list {grid-template-columns:1fr 1fr !important;gap:6px !important;}
.related-thumb {height:60px !important;}
.share-section {padding:10px !important;margin-top:12px !important;border-radius:4px !important;}
.share-buttons {gap:4px !important;}
.share-btn {width:28px !important;height:28px !important;font-size:12px !important;}
.article-tags {margin-top:12px !important;padding-top:10px !important;}
.tag {padding:3px 6px !important;font-size:10px !important;}
}
