/* ============================================================
   TVCH PLUGIN – Dark Theme Override
   Đè hoàn toàn theme WordPress, khớp với file HTML mẫu
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Be+Vietnam+Pro:wght@300;400;500;600&display=swap');

/* ============================================================
   RESET CỨNG – Xóa nền vàng/trắng từ theme
   ============================================================ */

/* Vùng nội dung chứa module plugin */
.tvch-hero,
.tvch-result-wrap,
.tvch-hero ~ *,
body .tvch-hero,
body .tvch-result-wrap {
  font-family: 'Be Vietnam Pro', sans-serif !important;
}

/* Xóa background của các wrapper theme thường dùng */
.site-main,
.entry-content,
.wrap,
#primary,
.tvch-wrap,
.tvch-article,
.tvch-form-container,
.tvch-form-bg,
.tvch-form-box,
article.tvch-article,
.page-content,
.post-content {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  border: none !important;
}

/* Xóa tiêu đề cũ mà template cũ tự chèn */
.tvch-title {
  display: none !important;
}

/* ============================================================
   HERO SECTION – Form nhập liệu
   ============================================================ */
.tvch-hero {
  background:
    linear-gradient(rgba(0,0,0,0.45), rgba(0,0,0,0.45)),
    repeating-linear-gradient(45deg, #888 0px, #888 1px, #999 1px, #999 10px) !important;
  background-color: #888 !important;
  padding: 60px 24px !important;
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.tvch-hero-card {
  background: rgba(255,255,255,0.97) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.35) !important;
  max-width: 740px !important;
  margin: 0 auto !important;
  padding: 40px 48px !important;
  box-sizing: border-box !important;
}

.tvch-hero-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  letter-spacing: 1px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  text-transform: uppercase !important;
  background: none !important;
  border: none !important;
}

.tvch-hero-desc {
  text-align: center !important;
  color: #555 !important;
  font-size: 13px !important;
  margin: 0 0 28px !important;
  line-height: 1.7 !important;
}

/* ── Select placeholder option ── */
.tvch-select-wrap select option[disabled] {
  color: #999 !important;
}

/* ── Radio lịch group ── */
.tvch-lich-group {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  font-size: 13px !important;
  color: #555 !important;
  margin-bottom: 12px !important;
  flex-wrap: wrap !important;
  line-height: 1 !important;
}

.tvch-lich-group span {
  font-size: 12px !important;
  color: #666 !important;
  line-height: 1 !important;
  display: flex !important;
  align-items: center !important;
}

.tvch-lich-group label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  cursor: pointer !important;
  color: #444 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.tvch-lich-group input[type="radio"] {
  accent-color: #e74c3c !important;
  width: 14px !important;
  height: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
  position: relative !important;
  top: 0 !important;
  flex-shrink: 0 !important;
}

/* ── Form rows ── */
.tvch-form-row {
  display: grid !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
}

.tvch-form-row.one-col   { grid-template-columns: 1fr !important; }
.tvch-form-row.two-col   { grid-template-columns: 1fr 1fr !important; }
.tvch-form-row.three-col { grid-template-columns: 1fr 1fr 1fr !important; }

/* ── Select wrapper ── */
.tvch-select-wrap {
  position: relative !important;
}

.tvch-select-wrap::after {
  content: '▾' !important;
  position: absolute !important;
  right: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: #999 !important;
  pointer-events: none !important;
  font-size: 12px !important;
}

/* Select trong hero card – nền TRẮNG */
.tvch-hero-card select,
.tvch-hero-card .tvch-select-wrap select {
  width: 100% !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #d0d0d0 !important;
  border-radius: 4px !important;
  color: #333 !important;
  padding: 10px 32px 10px 14px !important;
  font-family: 'Be Vietnam Pro', sans-serif !important;
  font-size: 13px !important;
  outline: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  transition: border-color 0.2s !important;
  cursor: pointer !important;
  box-shadow: none !important;
  min-height: 40px !important;
}

.tvch-hero-card select:focus {
  border-color: #e74c3c !important;
  box-shadow: none !important;
}

.tvch-select-highlighted select,
.tvch-select-highlighted .tvch-select-wrap select {
  border-color: #e74c3c !important;
}

/* Input text trong hero */
.tvch-hero-card input[type="text"],
.tvch-hero-card input[type="number"] {
  width: 100% !important;
  background: #ffffff !important;
  border: 1px solid #d0d0d0 !important;
  border-radius: 4px !important;
  color: #333 !important;
  padding: 10px 14px !important;
  font-family: 'Be Vietnam Pro', sans-serif !important;
  font-size: 13px !important;
  outline: none !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
}

.tvch-hero-card input[type="text"]::placeholder { color: #aaa !important; }
.tvch-hero-card input[type="text"]:focus { border-color: #e74c3c !important; }

/* ── Radio group ── */
.tvch-radio-group {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  padding: 6px 0 !important;
  font-size: 13px !important;
  margin-bottom: 12px !important;
  flex-wrap: wrap !important;
}

.tvch-radio-group span { font-size: 12px !important; color: #666 !important; }

.tvch-radio-group label {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  color: #444 !important;
  font-size: 13px !important;
}

.tvch-radio-group input[type="radio"] {
  accent-color: #e74c3c !important;
  width: 14px !important;
  height: 14px !important;
}

/* ── Form hint ── */
.tvch-form-hint {
  font-size: 11px !important;
  color: #888 !important;
  margin: -4px 0 10px !important;
}

/* ── Submit button ── */
.tvch-btn-primary {
  display: block !important;
  width: 100% !important;
  background: #c0392b !important;
  background-image: none !important;
  color: #fff !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 11px 20px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  font-family: 'Be Vietnam Pro', sans-serif !important;
  cursor: pointer !important;
  margin-top: 20px !important;
  transition: background 0.2s !important;
  text-align: center !important;
  box-shadow: none !important;
  letter-spacing: 0.5px !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  line-height: 1.4 !important;
  box-sizing: border-box !important;
}

.tvch-btn-primary:hover {
  background: #96281b !important;
  color: #fff !important;
}

/* ============================================================
   RESULT WRAP – Nền ĐEN
   ============================================================ */
.tvch-result-wrap {
  background: #1a1a1a !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 40px 20px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  color: #e8e8e8 !important;
  font-family: 'Be Vietnam Pro', sans-serif !important;
}

/* Inner max-width container */
.tvch-result-wrap > * {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

.tvch-result-section {
  margin-bottom: 32px !important;
}

.tvch-result-section h1 {
  font-family: 'Playfair Display', serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #e8e8e8 !important;
  margin: 0 0 16px !important;
}

.tvch-result-section h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #e8e8e8 !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
}

.tvch-result-section h3 {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #e8e8e8 !important;
  margin: 20px 0 10px !important;
}

.tvch-result-section p {
  color: #aaa !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
  margin-bottom: 12px !important;
}

.tvch-result-section p strong { color: #e8e8e8 !important; }
.tvch-result-section a { color: #e74c3c !important; }

/* ── Info block ── */
.tvch-info-block {
  background: #232323 !important;
  border: 1px solid #333 !important;
  border-radius: 6px !important;
  padding: 20px 24px !important;
  margin-bottom: 16px !important;
}

.tvch-info-block p {
  color: #aaa !important;
  font-size: 13px !important;
  margin-bottom: 6px !important;
  line-height: 1.7 !important;
}

.tvch-info-block p strong { color: #e8e8e8 !important; }

/* ── Tags ── */
.tvch-tag-good { color: #27ae60 !important; font-weight: 600 !important; }
.tvch-tag-bad  { color: #e74c3c !important; font-weight: 600 !important; }

/* ── Ages list ── */
.tvch-ages-list {
  background: #232323 !important;
  border: 1px solid #333 !important;
  border-radius: 6px !important;
  padding: 16px 20px !important;
  color: #aaa !important;
  font-size: 13px !important;
  line-height: 1.9 !important;
}

/* ── Guide list ── */
.tvch-guide-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.tvch-guide-list li {
  color: #aaa !important;
  font-size: 13px !important;
  padding: 5px 0 5px 18px !important;
  position: relative !important;
  line-height: 1.7 !important;
}

.tvch-guide-list li::before {
  content: '-' !important;
  position: absolute !important;
  left: 0 !important;
  color: #aaa !important;
}

/* ============================================================
   BẢNG (table) trong result
   ============================================================ */
.tvch-result-wrap table,
.tvch-result-section table {
  width: 100% !important;
  border-collapse: collapse !important;
  background: #232323 !important;
}

.tvch-result-wrap table td,
.tvch-result-wrap table th,
.tvch-result-section table td,
.tvch-result-section table th {
  padding: 10px 14px !important;
  border: 1px solid #333 !important;
  font-size: 13px !important;
  color: #aaa !important;
  vertical-align: top !important;
  line-height: 1.7 !important;
  background: transparent !important;
}

.tvch-result-wrap table thead th,
.tvch-result-section table thead th {
  background: rgba(192,57,43,0.2) !important;
  color: #e8e8e8 !important;
  font-weight: 600 !important;
  border-color: rgba(192,57,43,0.3) !important;
}

.tvch-result-wrap table tbody tr:nth-child(even) td {
  background: rgba(255,255,255,0.025) !important;
}

.tvch-result-wrap table td strong,
.tvch-result-section table td strong {
  color: #e8e8e8 !important;
}

/* ============================================================
   LÁ SỐ TỬ VI
   ============================================================ */
.tvch-laso-wrap {
  background: #1c1c1c !important;
  border: 1px solid #333 !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  margin-bottom: 24px !important;
}

.tvch-laso-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  border-top: 1px solid #333 !important;
}

.tvch-laso-cell {
  border-right: 1px solid #333 !important;
  border-bottom: 1px solid #333 !important;
  padding: 8px !important;
  font-size: 11px !important;
  min-height: 80px !important;
  position: relative !important;
  background: transparent !important;
}

.tvch-laso-cell:nth-child(4n) { border-right: none !important; }
.tvch-laso-cell .cell-num { position: absolute !important; top: 4px !important; right: 6px !important; font-size: 10px !important; color: #aaa !important; }
.tvch-laso-cell .cell-label { font-size: 10px !important; color: #e74c3c !important; font-weight: 600 !important; }
.tvch-laso-cell .cell-stars { margin-top: 4px !important; font-size: 10px !important; color: #ffcc66 !important; line-height: 1.6 !important; }
.tvch-laso-cell .cell-stars span { display: block !important; }

.tvch-laso-center {
  grid-column: 2 / 4 !important;
  grid-row: 2 / 4 !important;
  border: 1px solid #333 !important;
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  background: #1f1f1f !important;
}

.tvch-laso-center h2 {
  font-family: 'Playfair Display', serif !important;
  font-size: 16px !important;
  color: #d4a853 !important;
  text-align: center !important;
  margin-bottom: 12px !important;
}

.tvch-laso-info { font-size: 11px !important; color: #aaa !important; line-height: 1.8 !important; width: 100% !important; }
.tvch-laso-info .row { display: flex !important; gap: 8px !important; margin-bottom: 2px !important; }
.tvch-laso-info .label { color: #888 !important; flex-shrink: 0 !important; }
.tvch-laso-info .value { color: #e8e8e8 !important; }

.tvch-laso-actions { display: flex !important; gap: 12px !important; padding: 16px !important; border-top: 1px solid #333 !important; justify-content: center !important; }

.tvch-laso-btn {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #2c2c2c !important;
  border: 1px solid #333 !important;
  border-radius: 4px !important;
  color: #e8e8e8 !important;
  padding: 8px 20px !important;
  font-size: 13px !important;
  cursor: pointer !important;
  font-family: 'Be Vietnam Pro', sans-serif !important;
  text-decoration: none !important;
  transition: border-color 0.2s !important;
}

.tvch-laso-btn:hover { border-color: #e74c3c !important; }

/* Bình giải */
.tvch-binh-giai-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #e74c3c !important;
  margin-bottom: 16px !important;
}

.tvch-binh-giai-section { margin-bottom: 28px !important; }
.tvch-binh-giai-section h3 { font-size: 14px !important; font-weight: 600 !important; color: #e8e8e8 !important; margin-bottom: 8px !important; }
.tvch-binh-giai-section p { color: #aaa !important; font-size: 13px !important; line-height: 1.8 !important; margin-bottom: 8px !important; }
.tvch-source-tag { font-size: 11px !important; color: #555 !important; text-align: right !important; font-style: italic !important; margin-top: 8px !important; }

/* 12 cung */
.tvch-cung-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #e74c3c !important;
  margin: 32px 0 16px !important;
}

.tvch-cung-list { border: 1px solid #333 !important; border-radius: 6px !important; overflow: hidden !important; }
.tvch-cung-item { border-bottom: 1px solid #333 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 12px 16px !important; cursor: pointer !important; transition: background 0.2s !important; background: transparent !important; }
.tvch-cung-item:last-child { border-bottom: none !important; }
.tvch-cung-item:hover { background: rgba(255,255,255,0.03) !important; }
.tvch-cung-item .cung-name { display: flex !important; align-items: center !important; gap: 8px !important; font-size: 13px !important; color: #e8e8e8 !important; }
.tvch-cung-item .cung-icon { color: #e74c3c !important; font-size: 12px !important; }
.tvch-cung-item .xem-link { font-size: 12px !important; color: #e74c3c !important; text-decoration: none !important; white-space: nowrap !important; }

/* ============================================================
   COLOR / TEXT UTILS
   ============================================================ */
.tvch-tag-good         { color: #27ae60 !important; font-weight: 600 !important; }
.tvch-tag-bad          { color: #e74c3c !important; font-weight: 600 !important; }
.color-red             { color: #e74c3c !important; }
.color-green           { color: #27ae60 !important; }
.color-white           { color: #fff !important; }
font[color="red"]      { color: #e74c3c !important; }
font[color="blue"]     { color: #6db3ff !important; }
font[color="green"]    { color: #27ae60 !important; }
.text_bold, .font-bold { font-weight: 700 !important; }
.tvch-fs-13  { font-size: 13px !important; }
.tvch-fs-14  { font-size: 14px !important; }
.tvch-fs-16  { font-size: 16px !important; }
.tvch-fs-18  { font-size: 18px !important; }
.tvch-fs-20  { font-size: 20px !important; }
.tvch-font-arial { font-family: Arial, sans-serif !important; }
.text-center, .tvch-text-center { text-align: center !important; }
.tvch-text-justify { text-align: justify !important; }
.tvch-fw-bold, .font-weight-bold { font-weight: 700 !important; }
.tvch-hide { display: none !important; }

/* Spacing */
.mgt5  { margin-top: 5px !important; }
.mgt7  { margin-top: 7px !important; }
.mgt10 { margin-top: 10px !important; }
.mgt15 { margin-top: 15px !important; }
.mgt20 { margin-top: 20px !important; }
.mgb5  { margin-bottom: 5px !important; }
.mgb7  { margin-bottom: 7px !important; }
.mgb15 { margin-bottom: 15px !important; }
.mgb25 { margin-bottom: 25px !important; }
.none_mgb { margin-bottom: 0 !important; }
.none_mgt { margin-top: 0 !important; }
.space_tb10 { margin-top: 10px !important; margin-bottom: 10px !important; }
.pt10  { padding-top: 10px !important; }
.pb10  { padding-bottom: 10px !important; }
.pb15  { padding-bottom: 15px !important; }
.pb20  { padding-bottom: 20px !important; }
.none_pt { padding-top: 0 !important; }
.none_pb { padding-bottom: 0 !important; }
.table-responsive { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; }

/* ============================================================
   RESPONSIVE
   ============================================================ */

/* ── Fix Bootstrap padding gây viền trắng 2 bên ── */
.tvch-result-wrap,
.tvch-hero {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Xóa padding của Bootstrap col khi chứa tvch sections */
[class*="col-"] > .tvch-result-wrap,
[class*="col-"] > .tvch-hero,
.row > .tvch-result-wrap,
.row > .tvch-hero {
  margin-left: -15px !important;
  margin-right: -15px !important;
  width: calc(100% + 30px) !important;
}

/* Reset section cũ bọc kết quả - override theme mạnh hơn */
.tvch-result-wrap section,
.tvch-result-wrap .section__content,
.tvch-result-wrap [class*="section__"],
body .section__content.tvch-ui-result,
body .section__content.mgb30.tvch-ui-result,
body .tvch-ui-result {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  border: none !important;
  box-shadow: none !important;
}

/* Xóa nền trắng từ class của Bootstrap/theme bên trong result-wrap */
.tvch-result-wrap .container,
.tvch-result-wrap .content_xemboi,
.tvch-result-wrap .content_quanthanh {
  background: transparent !important;
  background-color: transparent !important;
}

@media (max-width: 900px) {
  .tvch-hero-card { padding: 28px 24px !important; }
  .tvch-form-row.three-col { grid-template-columns: 1fr 1fr !important; }
  .tvch-laso-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .tvch-laso-center { grid-column: 1 / 3 !important; grid-row: auto !important; }
}

@media (max-width: 600px) {
  .tvch-hero-card { padding: 24px 16px !important; }
  .tvch-hero-title { font-size: 20px !important; }
  .tvch-form-row.two-col,
  .tvch-form-row.three-col { grid-template-columns: 1fr !important; }
  .tvch-radio-group { flex-wrap: wrap !important; gap: 12px !important; }
  .tvch-laso-actions { flex-direction: column !important; }
}


/* === TuViLaSoTuTru - Thăng Long Đạo Quán === */
/* ══════════════════════════════════════════
   THĂNG LONG ĐẠO QUÁN — DARK THEME
   ══════════════════════════════════════════ */
.tlsq-wrap {
    font-family: 'Be Vietnam Pro', 'Segoe UI', Arial, sans-serif;
    max-width: 960px;
    margin: 0 auto;
    background: #141414 !important;
    color: #e0e0e0 !important;
    border: 1px solid #333 !important;
    border-radius: 8px !important;
    overflow: hidden;
}

/* Đảm bảo tất cả child element trong tlsq không bị theme override */
.tlsq-wrap * {
    box-sizing: border-box;
}
.tlsq-wrap p, .tlsq-wrap div, .tlsq-wrap span,
.tlsq-wrap td, .tlsq-wrap th, .tlsq-wrap tr {
    background: unset;
    color: unset;
}

/* ── Header ── */
.tlsq-header {
    background: linear-gradient(180deg, #1c1c1c 0%, #141414 100%);
    border-bottom: 2px solid #8B0000;
    padding: 0;
}
/* Top bar: logo + brand */
.tlsq-hdr-top {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px 8px;
    border-bottom: 1px solid #222;
}
.tlsq-hdr-brand {
    font-size: 17px;
    font-weight: 900;
    color: #cc3333;
    line-height: 1.15;
    font-family: Georgia, serif;
    flex-shrink: 0;
}
.tlsq-hdr-brand span { display: block; }
.tlsq-hdr-divider {
    width: 1px;
    height: 36px;
    background: #333;
    flex-shrink: 0;
}
.tlsq-hdr-info {
    flex: 1;
    min-width: 0;
}
.tlsq-hdr-ten {
    font-size: 13px;
    font-weight: bold;
    color: #e0e0e0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tlsq-hdr-menh {
    font-size: 11px;
    color: #888;
    margin-top: 2px;
}
.tlsq-hdr-menh b { color: #cc3333; }
.tlsq-hdr-site {
    font-size: 10px;
    color: #4d9fff;
    margin-top: 1px;
}

/* Body: thông tin ngày giờ dạng lưới */
.tlsq-hdr-body {
    padding: 10px 16px 12px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px 16px;
}
.tlsq-hdr-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.tlsq-hdr-row.full { grid-column: 1 / -1; }
.tlsq-hdr-lbl {
    font-size: 10px;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.tlsq-hdr-val {
    font-size: 12px;
    color: #ccc;
    font-weight: 500;
}
.tlsq-hdr-val b  { color: #ff5555; font-weight: bold; }
.tlsq-hdr-val em { color: #e0e0e0; font-style: normal; font-weight: bold; }

/* badge giới tính */
.tlsq-gt-badge {
    display: inline-block;
    padding: 1px 7px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: bold;
    background: #1e2a3a;
    color: #4d9fff;
    border: 1px solid #2a3f55;
}

@media (min-width: 520px) {
    .tlsq-hdr-body {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (min-width: 760px) {
    .tlsq-hdr-top { padding: 14px 20px 10px; }
    .tlsq-hdr-body { padding: 10px 20px 14px; grid-template-columns: repeat(4, 1fr); }
    .tlsq-hdr-brand { font-size: 19px; }
    .tlsq-hdr-ten { font-size: 14px; }
}

/* ── Bảng chính ── */
.tlsq-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.tlsq-table th,
.tlsq-table td {
    border: 1px solid #2a2a2a !important;
    padding: 8px 10px !important;
    text-align: center !important;
    vertical-align: middle !important;
    background: #141414 !important;
    color: #e0e0e0 !important;
}
.tlsq-table th {
    background: #1c1c1c !important;
    font-weight: bold !important;
    font-size: 14px !important;
    color: #e0e0e0 !important;
}
.tlsq-table th small {
    font-size: 11px !important;
    font-weight: normal !important;
    color: #666 !important;
    display: block !important;
    margin-top: 2px !important;
}
.tlsq-row-label {
    background: #1a1a1a !important;
    font-weight: bold !important;
    font-size: 11px !important;
    color: #888 !important;
    text-align: left !important;
    white-space: nowrap !important;
    min-width: 95px !important;
    letter-spacing: 0.3px !important;
}

/* ── Hàng Dương lịch ── */
.tlsq-dl td {
    font-size: 15px !important;
    font-weight: bold !important;
    color: #e0e0e0 !important;
    background: #141414 !important;
}

/* ── Hàng Chủ tinh ── */
.tlsq-ct td {
    font-size: 13px !important;
    font-weight: bold !important;
    color: #ccc !important;
    letter-spacing: 0.5px !important;
    background: #141414 !important;
}

/* ── Bát tự: Can (chữ to) ── */
.can-cell {
    font-size: 30px;
    font-weight: 900;
    letter-spacing: 1px;
    line-height: 1.1;
}
/* ── Địa chi ── */
.chi-cell {
    font-size: 24px;
    font-weight: 800;
    line-height: 1.1;
}

/* ── Can tàng ── */
.cantang-wrap {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: center;
    padding: 4px 2px;
}
.cantang-row {
    display: flex;
    align-items: baseline;
    gap: 5px;
    font-size: 12px;
    white-space: nowrap;
}
.cantang-can { font-size: 14px; font-weight: bold; }
.cantang-ct  { font-size: 11px; color: #666; }

/* ── Nhật kiến / Nguyệt kiến / Trụ ── */
.tlsq-ts td {
    font-size: 12px !important;
    font-weight: bold !important;
    color: #ccc !important;
    letter-spacing: 0.3px !important;
    background: #141414 !important;
}

/* ── Thần sát ── */
.tlsq-sat td { font-size: 11px !important; vertical-align: top !important; background: #141414 !important; }
.sat-list {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: flex-start;
    padding: 4px 0;
}
.sat-item-red  { color: #ff5555; font-weight: bold; }
.sat-item-blue { color: #4d9fff; font-weight: bold; }

/* ── Nạp âm ── */
.tlsq-na td {
    font-size: 13px !important;
    font-weight: bold !important;
    color: #bbb !important;
    font-style: italic !important;
    background: #141414 !important;
}

/* ── Dải chú thích dưới bảng ── */
.tlsq-note-bar {
    padding: 6px 14px;
    font-size: 12px;
    color: #4d9fff;
    background: #111;
    border-top: 1px solid #222;
}

/* ── Header Đại Vận ── */
.tlsq-dv-header {
    background: #111;
    border-top: 2px solid #333;
    padding: 10px 14px 6px;
}
.tlsq-dv-header-title {
    font-size: 15px;
    font-weight: bold;
    color: #ff5555;
    display: inline;
}
.tlsq-dv-header-sub {
    font-size: 12px;
    color: #888;
    display: inline;
    margin-left: 8px;
}
.tlsq-dv-header-sub span {
    color: #e0e0e0;
    font-weight: bold;
}

/* ── Bảng Đại Vận ── */
.tlsq-dv-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    table-layout: fixed;
}
.tlsq-dv-table td,
.tlsq-dv-table th {
    border: 1px solid #222;
    vertical-align: top;
    padding: 7px 9px;
}
.tlsq-dv-th {
    background: #161616;
    text-align: left;
}
.tlsq-dv-th .dv-tuoi {
    font-size: 12px;
    color: #ff5555;
    font-weight: bold;
}
.tlsq-dv-th .dv-can-chi {
    font-size: 16px;
    font-weight: bold;
    margin-top: 2px;
}
.tlsq-dv-td {
    font-size: 11px;
    background: #131313;
}
.tv-row {
    display: flex;
    gap: 3px;
    margin: 2px 0;
    align-items: baseline;
}
.tv-nam { color: #555; min-width: 34px; font-size: 10px; }
.tv-can { font-weight: bold; }
.tv-chi { color: #999; }
.tv-ct  { color: #555; font-size: 10px; }

/* ── Legend ── */
.tlsq-legend {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 9px 14px;
    border-top: 1px solid #222;
    font-size: 12px;
    background: #111;
    color: #888;
    flex-wrap: wrap;
}
.legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
}
.legend-box {
    width: 20px;
    height: 12px;
    border-radius: 2px;
    opacity: 0.85;
}

/* ══════════════════════════════════════════
   ĐẠI VẬN — CARD LAYOUT (Mobile-first)
   ══════════════════════════════════════════ */
.dv-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    padding: 12px;
    background: #0f0f0f;
}
.dv-card {
    background: #141414;
    border: 1px solid #252525;
    border-radius: 8px;
    overflow: hidden;
}
.dv-card-head {
    background: #1a1a1a;
    border-bottom: 1px solid #252525;
    padding: 8px 10px;
}
.dv-card-tuoi {
    font-size: 11px;
    color: #ff5555;
    font-weight: bold;
    margin-bottom: 3px;
}
.dv-card-canchi {
    font-size: 18px;
    font-weight: 900;
    line-height: 1.2;
}
.dv-card-ct {
    font-size: 10px;
    color: #666;
    margin-top: 2px;
}
.dv-card-body {
    padding: 6px 10px 8px;
}
.dv-tv-row {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 4px;
    padding: 2px 0;
    border-bottom: 1px solid #1e1e1e;
    font-size: 11px;
    align-items: center;
}
.dv-tv-row:last-child { border-bottom: none; }
.dv-tv-nam {
    color: #444;
    font-size: 10px;
}
.dv-tv-info {
    display: flex;
    gap: 3px;
    align-items: baseline;
    flex-wrap: wrap;
}
.dv-tv-can  { font-weight: bold; font-size: 12px; }
.dv-tv-chi  { color: #888; }
.dv-tv-sep  { color: #333; }
.dv-tv-ct   { color: #555; font-size: 10px; }

/* Desktop: 4 cột */
@media (min-width: 640px) {
    .dv-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
        padding: 10px;
    }
    .dv-card-canchi { font-size: 16px; }
}

/* Mobile nhỏ: 2 cột chặt hơn */
@media (max-width: 400px) {
    .dv-grid { gap: 7px; padding: 8px; }
    .dv-card-head { padding: 6px 8px; }
    .dv-card-body { padding: 4px 8px 6px; }
    .dv-card-canchi { font-size: 16px; }
}

/* ── Bảng tứ trụ: responsive mobile ── */
@media (max-width: 600px) {
    .tlsq-table { font-size: 11px; }
    .tlsq-table th, .tlsq-table td { padding: 5px 5px; }
    .tlsq-row-label { min-width: 70px; font-size: 10px; }
    .can-cell  { font-size: 20px; }
    .chi-cell  { font-size: 16px; }
    .cantang-can { font-size: 12px; }
    .tlsq-ts td { font-size: 10px; }
    .tlsq-na td { font-size: 11px; }
    .sat-list   { font-size: 10px; }
}


/* ============================================================
   TuViLaSo – Lưới Lá Số Tử Vi (prefix: tvch-ls-)
   ============================================================ */

/* ── CSS Variables (nếu chưa có :root) ── */
.tvch-result-wrap {
  --tvls-accent:    #c0392b;
  --tvls-accent-dk: #96281b;
  --tvls-light:     #e8e8e8;
  --tvls-muted:     #aaa;
  --tvls-border:    #333;
  --tvls-gold:      #d4a853;
  --tvls-good:      #66cc66;
  --tvls-bad:       #ff6b6b;
  --tvls-ln:        #4488cc;
}

/* ── Outer wrapper ── */
.tvch-ls-outer {
  max-width: 1200px;
  margin: 0 auto;
  padding: 28px 16px 0 !important;
  color: #e8e8e8 !important;
  font-family: 'Be Vietnam Pro', sans-serif !important;
}

/* ── Wrapper lưới ── */
.tvch-ls-wrap {
  background: #1c1c1c !important;
  border: 2px solid #4a4a4a !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  box-shadow: 0 0 0 1px #222, 0 4px 24px rgba(0,0,0,0.6) !important;
}

/* ── Grid 4×4 ── */
.tvch-ls-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  grid-template-rows: repeat(4, minmax(160px, auto)) !important;
  grid-template-areas:
    "c11 c0  c1  c2"
    "c10 mid mid c3"
    "c9  mid mid c4"
    "c8  c7  c6  c5" !important;
  border-top: 2px solid #4a4a4a !important;
}

/* Grid area cho 12 cung */
.tvch-ls-cell[data-chi="11"] { grid-area: c11 !important; }
.tvch-ls-cell[data-chi="0"]  { grid-area: c0  !important; }
.tvch-ls-cell[data-chi="1"]  { grid-area: c1  !important; }
.tvch-ls-cell[data-chi="2"]  { grid-area: c2  !important; }
.tvch-ls-cell[data-chi="3"]  { grid-area: c3  !important; }
.tvch-ls-cell[data-chi="4"]  { grid-area: c4  !important; }
.tvch-ls-cell[data-chi="5"]  { grid-area: c5  !important; }
.tvch-ls-cell[data-chi="6"]  { grid-area: c6  !important; }
.tvch-ls-cell[data-chi="7"]  { grid-area: c7  !important; }
.tvch-ls-cell[data-chi="8"]  { grid-area: c8  !important; }
.tvch-ls-cell[data-chi="9"]  { grid-area: c9  !important; }
.tvch-ls-cell[data-chi="10"] { grid-area: c10 !important; }

/* ── Ô trung tâm ── */
.tvch-ls-center {
  grid-area: mid !important;
  padding: 14px 12px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  background: #1f1f1f !important;
}

.tvch-ls-center-brand {
  font-size: 9px !important;
  color: #aaa !important;
  text-align: center !important;
  margin-bottom: 6px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}

.tvch-ls-center-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #c0392b !important;
  text-align: center !important;
  margin: 0 0 10px !important;
  letter-spacing: 2px !important;
  border: none !important;
  padding: 0 !important;
  background: none !important;
}

/* Info block trung tâm */
.tvch-ls-info              { font-size: 11px !important; color: #aaa !important; line-height: 1.9 !important; width: 100% !important; }
.tvch-ls-info-row          { display: flex !important; gap: 5px !important; margin-bottom: 1px !important; }
.tvch-ls-info-lbl          { color: #666 !important; flex-shrink: 0 !important; min-width: 76px !important; }
.tvch-ls-info-val          { color: #e8e8e8 !important; }
.tvch-ls-gold              { color: #d4a853 !important; }
.tvch-ls-tuhoa-row         { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; }
.tvch-ls-hoa-good          { color: #66cc66 !important; font-weight: 600 !important; }
.tvch-ls-hoa-ky            { color: #ff6b6b !important; font-weight: 600 !important; }

/* ── Ô cung ── */
.tvch-ls-cell {
  border-right: 1px solid #444 !important;
  border-bottom: 1px solid #444 !important;
  min-height: 160px !important;
  display: flex !important;
  flex-direction: column !important;
  font-size: 11px !important;
}

/* Hàng dưới cùng (Thân=8, Mùi=7, Ngọ=6, Tỵ=5): border-bottom ngoài viền */
.tvch-ls-cell[data-chi="8"],
.tvch-ls-cell[data-chi="7"],
.tvch-ls-cell[data-chi="6"],
.tvch-ls-cell[data-chi="5"] { border-bottom: 1px solid #444 !important; }

/* Header ô */
.tvch-ls-cell-top {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 4px 6px 3px !important;
  border-bottom: 1px solid #444 !important;
  background: rgba(192,57,43,0.08) !important;
}

.tvch-ls-cell-cf  { font-size: 10.5px !important; font-weight: 700 !important; color: #e05a4a !important; }
.tvch-ls-cell-num { font-size: 9.5px !important; color: #bbb !important; margin-left: 3px !important; font-weight: 400 !important; }
.tvch-ls-cell-ts  { font-size: 9.5px !important; color: #888 !important; white-space: nowrap !important; }

/* Badges */
.tvch-ls-badges      { display: flex !important; gap: 3px !important; flex-wrap: wrap !important; padding: 2px 6px 0 !important; }
.tvch-ls-badge-menh  { background: #d4a853 !important; color: #000 !important; font-size: 9px !important; padding: 1px 4px !important; border-radius: 2px !important; font-weight: 700 !important; }
.tvch-ls-badge-than  { background: #2ecc71 !important; color: #000 !important; font-size: 9px !important; padding: 1px 4px !important; border-radius: 2px !important; font-weight: 700 !important; }
.tvch-ls-badge-misc  { background: #555 !important; color: #ccc !important; font-size: 9px !important; padding: 1px 4px !important; border-radius: 2px !important; }

/* Body 2 cột */
.tvch-ls-body-cols {
  flex: 1 !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 3px !important;
  padding: 3px 6px 2px !important;
  align-content: start !important;
  overflow: hidden !important;
}

.tvch-ls-col-main,
.tvch-ls-col-phu { display: flex !important; flex-direction: column !important; }

.tvch-ls-col-main span,
.tvch-ls-col-phu span {
  display: block !important;
  line-height: 1.45 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Màu sao */
.tvch-ls-star-main    { font-weight: 700 !important; font-size: 12px !important; color: #fff !important; }
.tvch-ls-star-good    { color: #66cc66 !important; font-size: 10.5px !important; }
.tvch-ls-star-bad     { color: #ff6b6b !important; font-size: 10.5px !important; }
.tvch-ls-star-neutral { color: #aaa !important; font-size: 10px !important; }
.tvch-ls-star-ln      { color: #4488cc !important; font-size: 9.5px !important; font-style: italic !important; }

/* Hóa badge */
.tvch-ls-hoa-badge {
  font-size: 8.5px !important;
  background: #d4a853 !important;
  color: #000 !important;
  padding: 0 2px !important;
  border-radius: 2px !important;
  margin-left: 1px !important;
  font-weight: 700 !important;
}
.tvch-ls-hoa-badge.tvch-ls-hoa-ky { background: #c0392b !important; color: #fff !important; }

/* Footer ô */
.tvch-ls-cell-footer {
  border-top: 1px solid #444 !important;
  font-size: 9.5px !important;
  color: #aaa !important;
  background: rgba(255,255,255,0.03) !important;
}

.tvch-ls-footer-top {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 3px 6px !important;
}

.tvch-ls-footer-bottom {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 2px 5px 3px !important;
  background: rgba(192,57,43,0.07) !important;
  border-top: 1px solid rgba(192,57,43,0.15) !important;
  font-size: 8.5px !important;
}

.tvch-ls-chi-name    { color: #e05a4a !important; font-weight: 700 !important; font-size: 10px !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; }
.tvch-ls-footer-thang{ color: #aaa !important; }
.tvch-ls-footer-dv   { color: #e8a000 !important; font-weight: 600 !important; }
.tvch-ls-footer-ts   { color: #888 !important; font-weight: 500 !important; }
.tvch-ls-footer-ln   { color: #4488cc !important; font-weight: 600 !important; }

/* ── Chú thích màu sao ── */
.tvch-ls-legend {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 7px 12px !important;
  background: #161616 !important;
  border-top: 1px solid #333 !important;
  font-size: 9.5px !important;
  color: #aaa !important;
}
.tvch-ls-legend-grp  { display: flex !important; align-items: center !important; gap: 8px !important; flex-wrap: wrap !important; }
.tvch-ls-legend-item { display: flex !important; align-items: center !important; gap: 4px !important; }
.tvch-ls-dot         { width: 9px !important; height: 9px !important; border-radius: 2px !important; flex-shrink: 0 !important; }

/* ── Phân biệt hàng theo vị trí ── */
/* Hàng trên (Hợi, Tý, Sửu, Dần) */
.tvch-ls-cell[data-chi="11"],
.tvch-ls-cell[data-chi="0"],
.tvch-ls-cell[data-chi="1"],
.tvch-ls-cell[data-chi="2"] {
  border-top: 1px solid #444 !important;
}
/* Hàng dưới (Thân, Mùi, Ngọ, Tỵ) */
.tvch-ls-cell[data-chi="8"],
.tvch-ls-cell[data-chi="7"],
.tvch-ls-cell[data-chi="6"],
.tvch-ls-cell[data-chi="5"] {
  border-bottom: 1px solid #444 !important;
}

/* ─────────────────────────────────────────────────────
   Cột trái (Tuất=10, Dậu=9): border-right tiếp giáp center
   ───────────────────────────────────────────────────── */
.tvch-ls-cell[data-chi="10"],
.tvch-ls-cell[data-chi="9"] {
  border-right: 1px solid #444 !important;
}

/* ─────────────────────────────────────────────────────
   Cột phải (Mão=3, Thìn=4): border-left tiếp giáp center
   ───────────────────────────────────────────────────── */
.tvch-ls-cell[data-chi="3"],
.tvch-ls-cell[data-chi="4"] {
  border-left: 1px solid #444 !important;
}

/* Cột ngoài cùng bên phải (Dần=2, Tỵ=5, Thân=8, Hợi=11): border-right ngoài viền */
.tvch-ls-cell[data-chi="2"],
.tvch-ls-cell[data-chi="5"],
.tvch-ls-cell[data-chi="8"],
.tvch-ls-cell[data-chi="11"] {
  border-right: 1px solid #444 !important;
}

/* Cột ngoài cùng bên trái (Hợi=11, Tuất=10, Dậu=9, Thân=8): border-left ngoài viền */
.tvch-ls-cell[data-chi="11"],
.tvch-ls-cell[data-chi="10"],
.tvch-ls-cell[data-chi="9"],
.tvch-ls-cell[data-chi="8"] {
  border-left: 1px solid #444 !important;
}

/* Center cell: 4 cạnh rõ ràng */
.tvch-ls-center {
  border-top:    1px solid #444 !important;
  border-bottom: 1px solid #444 !important;
  border-left:   1px solid #444 !important;
  border-right:  1px solid #444 !important;
}

/* ── Nút hành động ── */
.tvch-ls-actions {
  display: flex !important;
  gap: 12px !important;
  padding: 12px !important;
  border-top: 1px solid #333 !important;
  justify-content: center !important;
}

.tvch-ls-action-btn {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #2c2c2c !important;
  border: 1px solid #333 !important;
  border-radius: 4px !important;
  color: #e8e8e8 !important;
  padding: 8px 20px !important;
  font-size: 13px !important;
  cursor: pointer !important;
  font-family: 'Be Vietnam Pro', sans-serif !important;
  text-decoration: none !important;
  transition: border-color .2s !important;
}

.tvch-ls-action-btn:hover { border-color: #c0392b !important; }

/* ── Bảng đại vận ── */
.tvch-ls-dv-wrap  { max-width: 1200px !important; margin: 20px auto 0 !important; padding: 0 16px !important; }
.tvch-ls-dv-title { font-family: 'Playfair Display', serif !important; font-size: 15px !important; color: #d4a853 !important; margin-bottom: 10px !important; }
.tvch-ls-dv-table { width: 100% !important; border-collapse: collapse !important; font-size: 11px !important; }
.tvch-ls-dv-table th,
.tvch-ls-dv-table td { border: 1px solid #333 !important; padding: 5px 8px !important; text-align: center !important; }
.tvch-ls-dv-table th { background: #2a2a2a !important; color: #aaa !important; }
.tvch-ls-dv-ht { background: #4a3200 !important; color: #f0c060 !important; font-weight: 700 !important; border: 1px solid #d4a853 !important; box-shadow: inset 0 0 0 1px rgba(212,168,83,0.3) !important; }

/* ── Bình giải ── */
.tvch-ls-binh-giai { max-width: 1200px !important; margin: 24px auto 0 !important; padding: 0 16px 32px !important; }

.tvch-ls-bg-title {
  font-family: 'Playfair Display', serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #c0392b !important;
  margin-bottom: 14px !important;
  border: none !important;
  padding: 0 !important;
  background: none !important;
}

.tvch-ls-bg-card {
  background: #222 !important;
  border-radius: 6px !important;
  padding: 16px 20px !important;
  margin-bottom: 12px !important;
  font-size: 13px !important;
  line-height: 1.9 !important;
}

.tvch-ls-bg-sub {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #d4a853 !important;
  margin-bottom: 8px !important;
  border: none !important;
  padding: 0 !important;
  background: none !important;
}

.tvch-ls-bg-card p  { color: #ccc !important; }
.tvch-ls-bg-note    { color: #aaa !important; font-size: 12px !important; }

/* ── Accordion 12 cung ── */
.tvch-ls-accordion {
  border: 1px solid #333 !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  margin-bottom: 24px !important;
}

.tvch-ls-acc-item { border-bottom: 1px solid #333 !important; }
.tvch-ls-acc-item:last-child { border-bottom: none !important; }

.tvch-ls-acc-head {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 12px 16px !important;
  font-size: 13px !important;
  cursor: pointer !important;
  color: #e8e8e8 !important;
  transition: background .2s !important;
}
.tvch-ls-acc-head:hover { background: rgba(255,255,255,.04) !important; }
.tvch-ls-acc-head.open  { background: rgba(255,255,255,.05) !important; }

.tvch-ls-acc-dash   { color: #c0392b !important; margin-right: 6px !important; }
.tvch-ls-acc-chinh  { color: #d4a853 !important; font-size: 12px !important; margin-left: 8px !important; }

.tvch-ls-acc-arrow {
  font-size: 18px !important;
  color: #c0392b !important;
  transition: transform .25s !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}
.tvch-ls-acc-head.open .tvch-ls-acc-arrow { transform: rotate(90deg) !important; }

.tvch-ls-acc-body {
  display: none !important;
  padding: 12px 20px 16px !important;
  font-size: 13px !important;
  line-height: 1.9 !important;
  color: #ccc !important;
  border-top: 1px solid #333 !important;
  background: #1e1e1e !important;
}
.tvch-ls-acc-body.open { display: block !important; }

/* ── Lỗi validation ── */
.tvch-ls-errors {
  background: #2a0000 !important;
  border: 1px solid #c0392b !important;
  border-radius: 4px !important;
  padding: 10px 14px !important;
  margin-bottom: 14px !important;
  font-size: 13px !important;
  color: #ff8080 !important;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .tvch-ls-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    grid-template-rows: auto !important;
    grid-template-areas: none !important;
  }
  .tvch-ls-cell[data-chi]  { grid-area: auto !important; }
  .tvch-ls-center           { grid-column: 1 / -1 !important; grid-row: 1 !important; order: -1 !important; }

  /* Reset tất cả border về trạng thái cơ bản cho layout 2 cột */
  .tvch-ls-cell[data-chi] {
    border-left:   none !important;
    border-right:  1px solid #444 !important;
    border-bottom: 1px solid #444 !important;
    border-top:    none !important;
  }

  /* Cột trái (odd): viền ngoài cùng bên trái + border-right chia đôi */
  .tvch-ls-cell:nth-child(odd) {
    border-left:  1px solid #444 !important;
    border-right: 1px solid #444 !important;
  }

  /* Cột phải (even): viền ngoài cùng bên phải */
  .tvch-ls-cell:nth-child(even) {
    border-right: 1px solid #444 !important;
  }

  /* 2 ô đầu tiên (hàng đầu sau center): border-top */
  .tvch-ls-cell:nth-child(2),
  .tvch-ls-cell:nth-child(3) {
    border-top: 1px solid rgba(192,57,43,0.5) !important;
  }

  /* 2 ô cuối cùng (hàng cuối): border-bottom */
  .tvch-ls-cell:nth-last-child(1),
  .tvch-ls-cell:nth-last-child(2) {
    border-bottom: 1px solid rgba(192,57,43,0.5) !important;
  }
}

@media (max-width: 600px) {
  .tvch-ls-outer,
  .tvch-ls-dv-wrap,
  .tvch-ls-binh-giai { padding-left: 8px !important; padding-right: 8px !important; }
}

@media print {
  .tvch-hero, .tvch-ls-actions,
  .tvch-ls-binh-giai, .tvch-ls-dv-wrap { display: none !important; }
  body { background: #fff; color: #000; }
  .tvch-ls-wrap             { border: none !important; }
  .tvch-ls-grid             { border: 1px solid #999 !important; }
  .tvch-ls-cell,
  .tvch-ls-center           { background: #fff !important; border: 1px solid #999 !important; }
  .tvch-ls-star-main        { color: #000 !important; }
  .tvch-ls-star-good        { color: #006600 !important; }
  .tvch-ls-star-bad         { color: #cc0000 !important; }
  .tvch-ls-star-neutral     { color: #555 !important; }
  .tvch-ls-chi-name         { color: #8B0000 !important; }
  .tvch-ls-cell-cf          { color: #8B0000 !important; }
}

/* ============================================================
   TVCH MODULE THEME — CSS Variables & Global Overrides
   Chỉnh tại đây để thay đổi toàn bộ XinXam + GieoQue modules
   ============================================================ */

:root {
  /* ── Nền chính ── */
  --tvch-bg-page:       #141414;   /* Nền trang result */
  --tvch-bg-card:       #1e1e1e;   /* Nền card/panel */
  --tvch-bg-card-head:  #1a1a1a;   /* Nền header của card */
  --tvch-bg-body:       #181818;   /* Nền body section */
  --tvch-bg-item:       #202020;   /* Nền grid item / chi-item */
  --tvch-bg-item-hover: #262626;   /* Hover trên grid item */
  --tvch-bg-sec:        #1a1a1a;   /* Nền section row */

  /* ── Border ── */
  --tvch-border:        #2e2e2e;   /* Border thông thường */
  --tvch-border-light:  #3a3a3a;   /* Border hover */

  /* ── Text ── */
  --tvch-text-primary:  #e8e8e8;   /* Chữ chính */
  --tvch-text-body:     #c8c8c8;   /* Chữ nội dung / lời bình */
  --tvch-text-muted:    #999;      /* Chữ phụ (dịch thơ, âm việt) */
  --tvch-text-label:    #888;      /* Label nhỏ (sec-lbl, gi-no) */
  --tvch-text-sub:      #aaa;      /* Chi-val, meta text */
  --tvch-text-name:     #ddd;      /* Tên quẻ/xăm trong grid */
}

/* ─────────────────────────────────────────────
   OVERRIDE tất cả nền card / body / item
   của xx* và gq* modules
   ───────────────────────────────────────────── */

/* Nền tổng cho toàn bộ result section */
[class*="xx"][class$="-wrap"],
[class*="gq"][class$="-wrap"] {
  background: var(--tvch-bg-page) !important;
}

/* Card wrapper */
[class*="xx"][class$="-card"],
[class*="gq"][class$="-card"] {
  background: var(--tvch-bg-card) !important;
  border-color: var(--tvch-border) !important;
}

/* Card header */
[class*="xx"][class$="-card-header"],
[class*="gq"][class$="-card-header"],
[class*="gq"][class$="-que-header"] {
  background: var(--tvch-bg-card-head) !important;
  border-bottom-color: var(--tvch-border) !important;
}

/* Body section */
[class*="xx"][class$="-body"],
[class*="gq"][class$="-body"] {
  background: var(--tvch-bg-body) !important;
}

/* Section row trong body */
[class*="xx"][class$="-sec"],
[class*="gq"][class$="-sec"] {
  background: var(--tvch-bg-sec) !important;
  border-bottom-color: var(--tvch-border) !important;
}

/* Grid item (danh sách quẻ/xăm) */
[class*="xx"][class$="-gi"],
[class*="gq"][class$="-gi"] {
  background: var(--tvch-bg-item) !important;
  border-color: var(--tvch-border) !important;
}
[class*="xx"][class$="-gi"]:hover,
[class*="gq"][class$="-gi"]:hover {
  background: var(--tvch-bg-item-hover) !important;
  border-color: var(--tvch-border-light) !important;
}

/* Chi tiết item (bảng chi tiết) */
[class*="xx"][class$="-chi-item"],
[class*="gq"][class$="-chi-item"] {
  background: var(--tvch-bg-item) !important;
  border-color: var(--tvch-border) !important;
}

/* ─────────────────────────────────────────────
   OVERRIDE TEXT COLORS — sáng rõ, dễ đọc
   ───────────────────────────────────────────── */

/* Chữ nội dung chính */
[class*="xx"][class$="-loi-ban"],
[class*="gq"][class$="-loi-ban"],
[class*="gq"][class$="-loi-giai"],
[class*="gq"][class$="-giai-nghia"] {
  color: var(--tvch-text-body) !important;
}

/* Âm việt, dịch thơ */
[class*="xx"][class$="-am-viet"],
[class*="xx"][class$="-dich-tho"],
[class*="gq"][class$="-am-viet"],
[class*="gq"][class$="-dich-tho"] {
  color: var(--tvch-text-muted) !important;
}

/* Label nhỏ phía trên */
[class*="xx"][class$="-sec-lbl"],
[class*="gq"][class$="-sec-lbl"],
[class*="xx"][class$="-gi-no"],
[class*="gq"][class$="-gi-no"],
[class*="gq"][class$="-que-no"],
[class*="xx"][class$="-chi-lbl"],
[class*="gq"][class$="-chi-lbl"],
[class*="xx"][class$="-symbol-no"],
[class*="gq"][class$="-symbol-no"],
[class*="xx"][class$="-countdown-label"],
[class*="gq"][class$="-countdown-label"],
[class*="xx"][class$="-hero-sub"],
[class*="gq"][class$="-hero-sub"] {
  color: var(--tvch-text-label) !important;
}

/* Text phụ - chi val, meta */
[class*="xx"][class$="-chi-val"],
[class*="gq"][class$="-chi-val"],
[class*="gq"][class$="-card-nom"],
[class*="gq"][class$="-card-tich"] {
  color: var(--tvch-text-sub) !important;
}

/* Tên trong grid */
[class*="xx"][class$="-gi-name"],
[class*="gq"][class$="-gi-name"] {
  color: var(--tvch-text-name) !important;
}

/* Tiêu đề card */
[class*="xx"][class$="-card-name"],
[class*="gq"][class$="-card-name"],
[class*="xx"][class$="-list-h"],
[class*="gq"][class$="-list-h"] {
  color: var(--tvch-text-primary) !important;
}

/* Hán văn — giữ màu accent riêng nhưng sáng hơn */
[class*="xx"][class$="-han-van"],
[class*="gq"][class$="-han-van"] {
  color: #e88 !important;  /* đỏ nhạt dễ đọc hơn #c81810 */
}

/* Luan box */
[class*="xx"][class$="-luan-box"],
[class*="gq"][class$="-luan-box"] {
  color: #f08080 !important;
  background: rgba(192,57,43,0.08) !important;
  border-left-color: rgba(192,57,43,0.5) !important;
}

/* ─────────────────────────────────────────────
   GRID SIZE — tối thiểu 200px, thoải mái hơn
   ───────────────────────────────────────────── */
[class*="xx"][class$="-grid"],
[class*="gq"][class$="-grid"] {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: 12px !important;
}

@media (max-width: 600px) {
  [class*="xx"][class$="-grid"],
  [class*="gq"][class$="-grid"] {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
    gap: 8px !important;
  }
}

/* ─────────────────────────────────────────────
   SEC-LBL line separator sáng hơn
   ───────────────────────────────────────────── */
[class*="xx"][class$="-sec-lbl"]::after,
[class*="gq"][class$="-sec-lbl"]::after {
  background: var(--tvch-border) !important;
}

/* ─────────────────────────────────────────────
   DIVIDER line
   ───────────────────────────────────────────── */
[class*="xx"][class$="-div"],
[class*="gq"][class$="-div"] {
  color: var(--tvch-text-label) !important;
}
[class*="xx"][class$="-div"]::before,
[class*="xx"][class$="-div"]::after,
[class*="gq"][class$="-div"]::before,
[class*="gq"][class$="-div"]::after {
  background: linear-gradient(90deg, transparent, var(--tvch-border), transparent) !important;
}

/* ─────────────────────────────────────────────
   TVCH-INTRO — khối giới thiệu SEO sau module
   ───────────────────────────────────────────── */
.tvch-intro {
  background: #1a1a1a !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 0 20px 48px !important;
  margin: 0 !important;
  font-family: 'Be Vietnam Pro', sans-serif !important;
  color: #c8c8c8 !important;
}

.tvch-intro-inner {
  max-width: 900px !important;
  margin: 0 auto !important;
  padding: 36px 0 0 !important;
  border-top: 1px solid rgba(255,255,255,0.08) !important;
}

/* Tiêu đề h1–h3 trong intro */
.tvch-intro-inner h1,
.tvch-intro-inner h2,
.tvch-intro-inner h3 {
  font-family: 'Playfair Display', serif !important;
  color: #e8e8e8 !important;
  font-weight: 700 !important;
  margin: 28px 0 10px !important;
  line-height: 1.4 !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
}

.tvch-intro-inner h1 { font-size: 22px !important; }
.tvch-intro-inner h2 { font-size: 19px !important; }
.tvch-intro-inner h3 { font-size: 16px !important; color: #ccc !important; }

/* Đoạn văn */
.tvch-intro-inner p {
  color: #c8c8c8 !important;
  font-size: 14px !important;
  line-height: 1.85 !important;
  margin: 0 0 14px !important;
  text-align: justify !important;
}

/* Danh sách */
.tvch-intro-inner ul,
.tvch-intro-inner ol {
  padding-left: 20px !important;
  margin: 0 0 14px !important;
}

.tvch-intro-inner li {
  color: #c8c8c8 !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
  margin-bottom: 4px !important;
}

/* Strong / em */
.tvch-intro-inner strong {
  color: #e8e8e8 !important;
  font-weight: 600 !important;
}

.tvch-intro-inner em {
  color: #aaa !important;
}

/* Link */
.tvch-intro-inner a {
  color: #c9a96e !important;
  text-decoration: none !important;
}

.tvch-intro-inner a:hover {
  color: #e8c98a !important;
  text-decoration: underline !important;
}

/* Blockquote */
.tvch-intro-inner blockquote {
  border-left: 3px solid rgba(201,169,110,0.5) !important;
  margin: 16px 0 !important;
  padding: 10px 16px !important;
  background: rgba(255,255,255,0.03) !important;
  color: #aaa !important;
  font-style: italic !important;
  font-size: 13px !important;
}

@media (max-width: 600px) {
  .tvch-intro {
    padding: 0 14px 36px !important;
  }
  .tvch-intro-inner {
    padding: 24px 0 0 !important;
  }
  .tvch-intro-inner h1 { font-size: 18px !important; }
  .tvch-intro-inner h2 { font-size: 16px !important; }
  .tvch-intro-inner p,
  .tvch-intro-inner li { font-size: 13px !important; }
}