/* V13: blog và nội dung rich text phía user. */
/* BLOG_SEO_CONTENT_20260627_V1 */
.blog-hero-card{border-color:rgba(56,189,248,.32)}
.blog-grid{align-items:stretch}.blog-card{display:flex;flex-direction:column;gap:10px;overflow:hidden}.blog-card h2{margin-bottom:4px}.blog-card .actions{margin-top:auto}.blog-cover-link{display:block;margin:-18px -18px 8px}.blog-cover,.blog-detail-cover{display:block;width:100%;height:auto;border-radius:14px;background:#020617;object-fit:cover}.blog-card .blog-cover{aspect-ratio:16/9;border-radius:16px 16px 0 0}.blog-excerpt,.blog-detail-excerpt{color:#cbd5e1;line-height:1.65}.blog-date{font-size:13px;margin:0 0 6px}.blog-detail-card{max-width:920px;margin-left:auto;margin-right:auto}.blog-detail-card h1{font-size:34px;line-height:1.2}.blog-detail-cover{max-height:520px;object-fit:cover;margin:16px 0}.blog-content{font-size:16px;line-height:1.8;color:#e5e7eb}.blog-content p{margin:.85rem 0}.blog-content h2,.blog-content h3,.blog-content h4,.blog-content h5,.blog-content h6{margin:1.45rem 0 .65rem;line-height:1.3}.blog-content img,.rich-text img,.product-desc img{display:block;max-width:100%;height:auto;border-radius:14px;margin:12px auto;background:#020617}.blog-content figure{margin:16px 0}.blog-content figcaption{font-size:13px;color:#94a3b8;text-align:center}.home-blog-card{border-color:rgba(34,197,94,.28)}.blog-card-mini{background:#111827;border:1px solid #334155;border-radius:14px;padding:14px}.blog-card-mini .blog-cover{aspect-ratio:16/9;margin:0 0 10px}.blog-card-mini h2{font-size:18px;margin-bottom:8px}.admin-image-preview.blog-cover-preview img{max-height:220px;object-fit:contain}.blog-admin-table td:nth-child(3){min-width:260px}.note-editor .note-editable img{max-width:100%;height:auto}
@media(max-width:760px){.blog-detail-card h1{font-size:26px}.blog-cover-link{margin:-14px -14px 8px}.blog-content{font-size:15px;line-height:1.7}.blog-admin-table{display:block;overflow-x:auto}.home-blog-grid{grid-template-columns:1fr}}


/* USER_BLOG_READABILITY_20260726_V10
   Đồng bộ trang Blog với giao diện user sáng: chữ mặc định rõ trên nền thẻ sáng,
   nhưng không ghi đè màu được admin đặt trực tiếp trong trình soạn thảo. */
body.user-admin-like .blog-card,
body.user-admin-like .blog-detail-card{
  background:linear-gradient(145deg,#ffffff 0%,#f8fbff 100%)!important;
  color:#334155!important;
  border-color:#dbe4ef!important;
  box-shadow:0 12px 30px rgba(15,23,42,.09)!important;
}
body.user-admin-like .blog-card h2,
body.user-admin-like .blog-card h2 a,
body.user-admin-like .blog-detail-card > h1{
  color:#0f172a!important;
}
body.user-admin-like .blog-excerpt,
body.user-admin-like .blog-detail-excerpt,
body.user-admin-like .blog-content{
  color:#334155!important;
}
body.user-admin-like .blog-content p:not([style*="color"]),
body.user-admin-like .blog-content li:not([style*="color"]),
body.user-admin-like .blog-content div:not([style*="color"]),
body.user-admin-like .blog-content blockquote:not([style*="color"]){
  color:#334155;
}
body.user-admin-like .blog-content h2:not([style*="color"]),
body.user-admin-like .blog-content h3:not([style*="color"]),
body.user-admin-like .blog-content h4:not([style*="color"]),
body.user-admin-like .blog-content h5:not([style*="color"]),
body.user-admin-like .blog-content h6:not([style*="color"]){
  color:#0f172a!important;
}
body.user-admin-like .blog-content a:not(.btn){
  color:#1d4ed8;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
}
body.user-admin-like .blog-content blockquote{
  margin:1rem 0;
  padding:12px 16px;
  border-left:4px solid #38bdf8;
  border-radius:0 12px 12px 0;
  background:#f1f5f9;
}
body.user-admin-like .blog-content hr{
  border:0;
  border-top:1px solid #dbe4ef;
  margin:1.4rem 0;
}
body.user-admin-like .blog-content table{
  background:#fff!important;
  color:#334155!important;
}
body.user-admin-like .blog-content th{
  background:#f1f5f9!important;
  color:#0f172a!important;
}
body.user-admin-like .blog-content td{
  color:#334155!important;
}
body.user-admin-like .blog-content figcaption{
  color:#64748b!important;
}
body.user-admin-like .blog-cover,
body.user-admin-like .blog-detail-cover,
body.user-admin-like .blog-content img{
  background:#f1f5f9;
  border:1px solid rgba(148,163,184,.22);
}
@media(max-width:760px){
  body.user-admin-like .blog-detail-card{
    padding:16px!important;
  }
  body.user-admin-like .blog-detail-card > h1{
    font-size:clamp(25px,8vw,34px);
  }
}
