/* ==========================================================================
   VietLOD Econometrics 201 — Jannah Theme × EazyDocs Pro × MathJax v4 Bridge
   File: wp-content/themes/jannah-child/assets/css/jannah-eazydocs-bridge.css
   ========================================================================== */

/* 1. Khử xung đột Dark Mode OS (Conflict #2): Giữ bảng màu sáng học thuật chuẩn
      trừ khi người dùng chủ động bật nút Dark Mode của EazyDocs (.body_dark) */
.single-docs .doc_documentation_area:not(.body_dark) {
  --text-dark: #1e293b;
  --text-light: #334155;
  --text-muted: #64748b;
  --code-background: #f1f5f9;
  --code-color: #0f172a;
  --border-color: #e2e8f0;
  color: #1e293b;
}

/* 2. Định dạng chuẩn thẻ <code> nội dòng bên trong văn bản và bên trong [box] */
.single-docs .doc-scrollable :not(pre) > code,
.single-post .entry-content :not(pre) > code {
  background-color: rgba(15, 23, 42, 0.06) !important;
  color: #b91c1c !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  font-family: "JetBrains Mono", "Fira Code", Consolas, monospace !important;
  font-size: 0.9em !important;
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  white-space: nowrap;
}

/* 3. Bảo vệ độ tương phản tuyệt đối cho 4 loại hộp [box] của Jannah (Conflict #2 & #4) */
.single-docs .doc-scrollable div.box,
.single-post .entry-content div.box {
  border-radius: 8px !important;
  padding: 18px 20px 18px 68px !important;
  margin: 22px 0 !important;
  line-height: 1.75 !important;
  color: #1e293b !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.05) !important;
  position: relative !important;
}
.single-docs .doc-scrollable div.box.info,
.single-post .entry-content div.box.info    { background-color: #e0f2fe !important; border-left: 4px solid #0284c7 !important; }
.single-docs .doc-scrollable div.box.note,
.single-post .entry-content div.box.note    { background-color: #fef9c3 !important; border-left: 4px solid #ca8a04 !important; }
.single-docs .doc-scrollable div.box.success,
.single-post .entry-content div.box.success { background-color: #dcfce7 !important; border-left: 4px solid #16a34a !important; }
.single-docs .doc-scrollable div.box.warning,
.single-post .entry-content div.box.warning { background-color: #fee2e2 !important; border-left: 4px solid #dc2626 !important; }

/* 4. Cố định FontAwesome 4 cho toàn bộ icon của [box], [tie_list] và [toggle] (Conflict #3) */
.single-docs .doc-scrollable .tie-shortcode-boxicon:before,
.single-docs .doc-scrollable .tie-list-shortcode ul li:before,
.single-docs .doc-scrollable .toggle .toggle-head span.fa:before,
.single-post .entry-content .tie-shortcode-boxicon:before,
.single-post .entry-content .tie-list-shortcode ul li:before,
.single-post .entry-content .toggle .toggle-head span.fa:before {
  font-family: "FontAwesome" !important;
  font-weight: normal !important;
  font-style: normal !important;
  text-rendering: auto !important;
  -webkit-font-smoothing: antialiased !important;
}

/* 5. Thanh Tab Chuyển đổi Ngôn ngữ (Stata 18 MP | R 4.x | Python 3.11+) bọc ngoài [toggle] */
.vietlod-tri-tabs {
  margin: 24px 0 !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  overflow: visible !important;
}
.vietlod-tri-tab-nav {
  display: flex !important;
  gap: 6px !important;
  background: #f8fafc !important;
  padding: 8px 12px 0 12px !important;
  border-bottom: 1px solid #cbd5e1 !important;
  border-radius: 10px 10px 0 0 !important;
  flex-wrap: wrap !important;
}
.vietlod-tri-tab-btn {
  appearance: none;
  border: 1px solid transparent !important;
  border-bottom: none !important;
  background: transparent !important;
  color: #475569 !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  padding: 9px 18px !important;
  border-radius: 8px 8px 0 0 !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}
.vietlod-tri-tab-btn:hover {
  color: #0f172a !important;
  background: rgba(226, 232, 240, 0.6) !important;
}
.vietlod-tri-tab-btn.is-active {
  background: #ffffff !important;
  color: #0284c7 !important;
  border-color: #cbd5e1 !important;
  margin-bottom: -1px !important;
  padding-bottom: 10px !important;
}
.vietlod-tri-tab-panel {
  display: none;
  padding: 16px !important;
}
.vietlod-tri-tab-panel.is-active {
  display: block;
}

/* 6. Khử xung đột [toggle] bên trong EazyDocs (Conflict #1 & #4) */
.single-docs .doc-scrollable .toggle {
  margin-bottom: 12px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
}
.single-docs .doc-scrollable .toggle h3.toggle-head {
  background: #f8fafc !important;
  color: #0f172a !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  margin: 0 !important;
  padding: 12px 44px 12px 16px !important;
  cursor: pointer !important;
}
/* Tuyệt đối ẩn ký hiệu neo # của EazyDocs bên trong tiêu đề [toggle] */
.single-docs .doc-scrollable .toggle h3.toggle-head .anchorjs-link {
  display: none !important;
}

/* 7. Chuẩn hóa hiển thị công thức MathJax v4 ($...\tag{n}$) & Bảng học thuật */
.single-docs .doc-scrollable mjx-container[jax="CHTML"][display="true"],
.single-post .entry-content mjx-container[jax="CHTML"][display="true"] {
  margin: 1.15em 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  max-width: 100% !important;
  padding: 4px 0 !important;
}
.single-docs .doc-scrollable table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 20px 0 !important;
  font-size: 15px !important;
}
.single-docs .doc-scrollable table th {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
  font-weight: 600 !important;
  border: 1px solid #cbd5e1 !important;
  padding: 10px 12px !important;
}
.single-docs .doc-scrollable table td {
  border: 1px solid #e2e8f0 !important;
  padding: 10px 12px !important;
  color: #1e293b !important;
}

/* 8. Đảm bảo [tie_tooltip] luôn nổi lên trên cùng không bị cắt (Conflict #5) */
.tooltip {
  z-index: 99999 !important;
}