/*! Tiêu đề mục trong bài (h2/h3): hiện đại, đậm, tách rõ khỏi bảng/đoạn bên dưới.
 * Overlay — không rebuild theme. Thắng typography/wiki serif + [&_h2]:text-lg. */
html.storefront-root .news-article-content h2,
html.storefront-root .unified-content h2,
html.storefront-root .tutorial-content h2,
html.storefront-root .product-description-content h2,
html.admin-root .admin-rich-text-preview h2,
html.admin-root .html-content-light h2,
.news-article-content h2,
.unified-content h2,
.tutorial-content h2,
.product-description-content h2,
.admin-rich-text-preview h2,
.html-content-light h2 {
  font-family: Inter, "Be Vietnam Pro", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif !important;
  font-size: 1.5rem !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.02em !important;
  color: #0b1f2a !important;
  margin: 2.25rem 0 1.05rem !important;
  padding: 0.82rem 1.15rem 0.82rem 1.1rem !important;
  border: none !important;
  border-left: 4px solid #0891b2 !important;
  background: #e7f6fa !important;
  border-radius: 0 12px 12px 0 !important;
  box-shadow: none !important;
  text-transform: none !important;
  scroll-margin-top: 5.5rem;
}

html.storefront-root .news-article-content h3,
html.storefront-root .unified-content h3,
html.storefront-root .tutorial-content h3,
html.storefront-root .product-description-content h3,
html.admin-root .admin-rich-text-preview h3,
html.admin-root .html-content-light h3,
.news-article-content h3,
.unified-content h3,
.tutorial-content h3,
.product-description-content h3,
.admin-rich-text-preview h3,
.html-content-light h3 {
  font-family: Inter, "Be Vietnam Pro", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.015em !important;
  color: #122033 !important;
  margin: 1.85rem 0 0.85rem !important;
  padding: 0.62rem 1rem 0.62rem 0.95rem !important;
  border: none !important;
  border-left: 3px solid #0891b2 !important;
  background: #eef8f6 !important;
  border-radius: 0 10px 10px 0 !important;
  box-shadow: none !important;
  text-transform: none !important;
  scroll-margin-top: 5.5rem;
}

html.storefront-root .news-article-content h2:first-child,
html.storefront-root .news-article-content h2:first-of-type,
html.storefront-root .unified-content h2:first-child,
html.storefront-root .unified-content h2:first-of-type,
html.storefront-root .tutorial-content h2:first-child,
html.storefront-root .tutorial-content h2:first-of-type,
html.storefront-root .product-description-content h2:first-child,
html.storefront-root .product-description-content h2:first-of-type,
.news-article-content h2:first-child,
.news-article-content h2:first-of-type,
.unified-content h2:first-child,
.unified-content h2:first-of-type,
.tutorial-content h2:first-child,
.tutorial-content h2:first-of-type,
.admin-rich-text-preview h2:first-child,
.html-content-light h2:first-child {
  margin-top: 0.65rem !important;
}

html.storefront-root .news-article-content h2 + table,
html.storefront-root .news-article-content h3 + table,
html.storefront-root .unified-content h2 + table,
html.storefront-root .unified-content h3 + table,
html.storefront-root .tutorial-content h2 + table,
html.storefront-root .tutorial-content h3 + table,
html.storefront-root .product-description-content h2 + table,
html.storefront-root .product-description-content h3 + table,
.news-article-content h2 + table,
.news-article-content h3 + table,
.unified-content h2 + table,
.unified-content h3 + table,
.tutorial-content h2 + table,
.tutorial-content h3 + table,
.admin-rich-text-preview h2 + table,
.admin-rich-text-preview h3 + table,
.html-content-light h2 + table,
.html-content-light h3 + table {
  margin-top: 0.15rem !important;
  border: 1px solid #c5d5dd !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05) !important;
}

html.storefront-root :is(.news-article-content, .unified-content, .tutorial-content, .product-description-content) table,
html.admin-root :is(.admin-rich-text-preview, .html-content-light) table,
:is(.news-article-content, .unified-content, .tutorial-content, .product-description-content, .admin-rich-text-preview, .html-content-light) table {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.9rem 0 1.35rem !important;
  border: 1px solid #c5d5dd !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05) !important;
  background: #ffffff !important;
}

html.storefront-root :is(.news-article-content, .unified-content, .tutorial-content, .product-description-content) table :is(thead th, thead td),
html.storefront-root :is(.news-article-content, .unified-content, .tutorial-content, .product-description-content) table > tbody > tr:first-child > th,
html.storefront-root :is(.news-article-content, .unified-content, .tutorial-content, .product-description-content) table:not(:has(thead)) > tbody > tr:first-child > td,
html.admin-root :is(.admin-rich-text-preview, .html-content-light) table :is(thead th, thead td),
html.admin-root :is(.admin-rich-text-preview, .html-content-light) table:not(:has(thead)) > tbody > tr:first-child > td,
:is(.news-article-content, .unified-content, .tutorial-content, .product-description-content, .admin-rich-text-preview, .html-content-light) table :is(thead th, thead td),
:is(.news-article-content, .unified-content, .tutorial-content, .product-description-content, .admin-rich-text-preview, .html-content-light) table:not(:has(thead)) > tbody > tr:first-child > td {
  background: #0e7490 !important;
  color: #ffffff !important;
  font-family: Inter, "Be Vietnam Pro", ui-sans-serif, system-ui, sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.4 !important;
  padding: 0.78rem 1rem !important;
  border: none !important;
  border-bottom: 1px solid #0b6279 !important;
  text-align: left !important;
  vertical-align: middle !important;
}

html.storefront-root :is(.news-article-content, .unified-content, .tutorial-content, .product-description-content) table :is(thead th, thead td) :is(a, strong, b, span),
:is(.news-article-content, .unified-content, .tutorial-content, .product-description-content, .admin-rich-text-preview, .html-content-light) table :is(thead th, thead td) :is(a, strong, b, span) {
  color: #ffffff !important;
}

html.storefront-root :is(.news-article-content, .unified-content, .tutorial-content, .product-description-content) table tbody td,
html.admin-root :is(.admin-rich-text-preview, .html-content-light) table tbody td,
:is(.news-article-content, .unified-content, .tutorial-content, .product-description-content, .admin-rich-text-preview, .html-content-light) table tbody td {
  padding: 0.68rem 1rem !important;
  border: none !important;
  border-top: 1px solid #e4eef2 !important;
  color: #334155 !important;
  background: #ffffff !important;
  font-size: 0.95rem !important;
  font-weight: 400 !important;
  vertical-align: top !important;
}

html.storefront-root :is(.news-article-content, .unified-content, .tutorial-content, .product-description-content) table tbody :is(th, td:first-child),
html.admin-root :is(.admin-rich-text-preview, .html-content-light) table tbody :is(th, td:first-child),
:is(.news-article-content, .unified-content, .tutorial-content, .product-description-content, .admin-rich-text-preview, .html-content-light) table tbody :is(th, td:first-child) {
  font-weight: 600 !important;
  color: #0f172a !important;
  background: #f4fafc !important;
}

html.storefront-root :is(.news-article-content, .unified-content, .tutorial-content, .product-description-content) table tbody tr:nth-child(even) td:not(:first-child),
:is(.news-article-content, .unified-content, .tutorial-content, .product-description-content, .admin-rich-text-preview, .html-content-light) table tbody tr:nth-child(even) td:not(:first-child) {
  background: #f8fbfc !important;
}

/* Không áp dụng khối tiêu đề sáng lên editor tối */
html.admin-root .html-content-dark h2,
html.admin-root .html-content-dark h3,
.html-content-dark h2,
.html-content-dark h3 {
  background: none !important;
  border-left-color: #22d3ee !important;
  color: #f1f5f9 !important;
}
