/* =====================================================================
   THẦY PHONG VŨ – "HÔM NAY" (2026-11-05)
   .tpv-hn   khối lịch âm hôm nay đầu trang chủ (+ ô ngày của riêng khách)
   .tpv-hnb  hộp nhắc nhỏ ở các trang khác
   Màu theo biến --pg-* (tối mặc định, html.tpv-light ghi đè). Tăng TPV_HN_VER (hom-nay.php) khi sửa.
   ===================================================================== */
.tpv-hn { --hn-tot: #6ee7a8; --hn-xau: #ff9a8a; --hn-binh: #e8c77d;
  max-width: 1040px; margin: 14px auto 26px; padding: 16px 20px 18px; border-radius: 18px; border: 1px solid var(--pg-line);
  background: radial-gradient(110% 140% at 0% 0%, rgba(232,199,125,.13), transparent 55%), linear-gradient(160deg, #22134f, #120a2e);
  font-family: var(--tpv-sans); color: var(--pg-text); box-shadow: 0 14px 36px rgba(0,0,0,.28); }
.tpv-hn__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; }
.tpv-hn__head .tpv-sec__k { margin: 0; }
.tpv-hn__more { font-size: 13.5px; font-weight: 600; color: var(--pg-gold); text-decoration: none; white-space: nowrap; }
.tpv-hn__more:hover { text-decoration: underline; }

.tpv-hn__day { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 18px; align-items: start; }
.tpv-hn__date { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--pg-line); background: rgba(255,255,255,.04); text-align: center; }
.tpv-hn__solar { display: flex; flex-direction: column; font-size: 13px; color: var(--pg-muted); }
.tpv-hn__solar b { font-size: 16px; color: var(--pg-text); font-weight: 600; }
.tpv-hn__lunar { display: flex; align-items: center; justify-content: center; gap: 10px; padding-top: 8px; border-top: 1px dashed var(--pg-line); }
.tpv-hn__lunar b { font-family: var(--pg-serif, Georgia, serif); font-size: 52px; line-height: 1; color: var(--pg-gold); font-weight: 600; }
.tpv-hn__lunar span { font-size: 13px; line-height: 1.35; text-align: left; color: var(--pg-muted); }
.tpv-hn__mung { position: absolute; top: -9px; right: -6px; padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-style: normal; font-weight: 700; background: #b8932f; color: #1b1048; }

.tpv-hn__info { min-width: 0; }
.tpv-hn__verdict { margin: 0 0 8px !important; font-size: 15px; line-height: 1.45; }
.tpv-hn__verdict span { display: inline-block; margin-right: 6px; padding: 2px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; border: 1px solid currentColor; }
.tpv-hn__verdict.is-tot span { color: var(--hn-tot); } .tpv-hn__verdict.is-xau span { color: var(--hn-xau); } .tpv-hn__verdict.is-binh span { color: var(--hn-binh); }
.tpv-hn__verdict b { color: var(--pg-gold-2); font-weight: 600; }
#main .tpv-hn__facts, .tpv-hn__facts { display: flex; flex-wrap: wrap; gap: 6px 8px; margin: 0 0 8px !important; padding: 0 !important; list-style: none; }
.tpv-hn__facts li { margin: 0 !important; padding: 3px 10px; border-radius: 8px; font-size: 13px; line-height: 1.4; background: rgba(255,255,255,.05); border: 1px solid var(--pg-line-soft, rgba(255,255,255,.1)); }
.tpv-hn__facts li i { font-style: normal; color: var(--pg-muted); margin-right: 5px; }
.tpv-hn__facts li.is-bad { color: var(--hn-xau); }
.tpv-hn__nk { display: flex; flex-direction: column; gap: 2px; margin: 0 0 8px !important; font-size: 13.5px; line-height: 1.45; }
.tpv-hn__nk .is-nen::first-letter, .tpv-hn__nk .is-ky::first-letter { text-transform: uppercase; }
.tpv-hn__nk .is-ky { color: var(--pg-muted); }
.tpv-hn__gio { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.tpv-hn__gio > span { font-size: 12.5px; font-weight: 700; color: var(--pg-gold); text-transform: uppercase; letter-spacing: .04em; }
#main .tpv-hn__gio ul, .tpv-hn__gio ul { display: flex; flex-wrap: wrap; gap: 5px; margin: 0 !important; padding: 0 !important; list-style: none; }
.tpv-hn__gio li { margin: 0 !important; padding: 2px 8px; border-radius: 999px; font-size: 12.5px; border: 1px solid var(--pg-line); }
.tpv-hn__gio li b { font-weight: 600; margin-right: 4px; color: var(--pg-gold-2); }
.tpv-hn__gio li span { color: var(--pg-muted); }

/* Lời mời (chưa có hồ sơ) */
.tpv-hn__ask { display: flex; align-items: center; justify-content: space-between; gap: 12px 18px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--pg-line); }
.tpv-hn__ask p { margin: 0 !important; font-size: 14px; line-height: 1.5; color: var(--pg-muted); }
.tpv-hn__ask p b { color: var(--pg-text); }
.tpv-hn__ask .tpv-btn, .tpv-hn__me-foot .tpv-btn { flex: 0 0 auto; white-space: nowrap; }
.tpv-hn.is-loading .tpv-hn__ask { visibility: hidden; }

/* Ngày của riêng khách */
.tpv-hn__me { margin-top: 14px; padding: 14px 16px; border-radius: 14px; border: 1px solid rgba(232,199,125,.45);
  background: linear-gradient(135deg, rgba(232,199,125,.10), rgba(124,58,237,.10)); animation: tpv-hn-in .35s ease both; }
@keyframes tpv-hn-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.tpv-hn__me-top { display: flex; gap: 14px; align-items: flex-start; }
.tpv-hn__score { flex: 0 0 auto; display: flex; align-items: baseline; justify-content: center; width: 70px; height: 70px; padding-top: 18px; box-sizing: border-box; border-radius: 50%; border: 3px solid currentColor; }
.tpv-hn__score b { font-size: 24px; line-height: 1; font-weight: 700; }
.tpv-hn__score span { font-size: 11px; opacity: .8; }
.tpv-hn__score.is-tot { color: var(--hn-tot); } .tpv-hn__score.is-xau { color: var(--hn-xau); } .tpv-hn__score.is-binh { color: var(--hn-binh); }
.tpv-hn__me-t { min-width: 0; }
.tpv-hn__me-k { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--pg-gold); }
#main .tpv-hn__me-t h3, .tpv-hn__me-t h3 { margin: 2px 0 4px; font-family: var(--tpv-sans); font-size: 19px; line-height: 1.3; font-weight: 600; color: var(--pg-text); }
.tpv-hn__me-t h3 em { font-style: normal; }
.tpv-hn__me-t h3 em.is-tot { color: var(--hn-tot); } .tpv-hn__me-t h3 em.is-xau { color: var(--hn-xau); } .tpv-hn__me-t h3 em.is-binh { color: var(--hn-binh); }
.tpv-hn__me-t p { margin: 0 !important; font-size: 14px; line-height: 1.5; color: var(--pg-muted); }
#main .tpv-hn__src, .tpv-hn__src { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0 !important; padding: 0 !important; list-style: none; }
.tpv-hn__src li { margin: 0 !important; padding: 3px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; border: 1px solid currentColor; }
.tpv-hn__src li i { font-style: normal; font-weight: 400; margin-right: 5px; color: var(--pg-muted); }
.tpv-hn__src li.is-tot { color: var(--hn-tot); } .tpv-hn__src li.is-xau { color: var(--hn-xau); } .tpv-hn__src li.is-binh { color: var(--hn-binh); }
.tpv-hn__adv { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.tpv-hn__adv > div { padding: 8px 12px; border-radius: 10px; background: rgba(255,255,255,.04); border: 1px solid var(--pg-line-soft, rgba(255,255,255,.1)); }
.tpv-hn__adv b { font-size: 13px; }
.tpv-hn__adv .is-nen b { color: var(--hn-tot); } .tpv-hn__adv .is-ky b { color: var(--hn-xau); }
#main .tpv-hn__adv ul, .tpv-hn__adv ul { margin: 4px 0 0 !important; padding: 0 0 0 18px !important; }
.tpv-hn__adv li { margin: 0 0 2px !important; font-size: 13.5px; line-height: 1.45; }
.tpv-hn__adv li::first-letter { text-transform: uppercase; }
.tpv-hn__gh { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 10px 0 0 !important; font-size: 13.5px; line-height: 1.45; }
.tpv-hn__gh i { font-style: normal; font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: var(--pg-gold); margin-right: 6px; }
.tpv-hn__gh small { color: var(--pg-muted); }
.tpv-hn__me-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 12px; }
.tpv-hn__me-foot p { flex: 1 1 300px; margin: 0 !important; font-size: 13.5px; line-height: 1.5; color: var(--pg-muted); }
.tpv-hn__me-foot p b { color: var(--pg-text); }
.tpv-hn__me-foot small { display: block; margin-top: 2px; font-size: 12.5px; }
.tpv-hn__other { font-size: 13px; color: var(--pg-muted); text-decoration: underline; }

@media (max-width: 849px) {
  .tpv-hn { margin: 10px 0 20px; padding: 14px 14px 16px; border-radius: 16px; }
  .tpv-hn__day { grid-template-columns: 1fr; gap: 12px; }
  .tpv-hn__date { flex-direction: row; align-items: center; justify-content: space-between; text-align: left; padding: 10px 12px; }
  .tpv-hn__lunar { padding-top: 0; border-top: 0; padding-left: 12px; border-left: 1px dashed var(--pg-line); }
  .tpv-hn__lunar b { font-size: 40px; }
  .tpv-hn__ask { flex-direction: column; align-items: stretch; text-align: left; }
  .tpv-hn__ask .tpv-btn, .tpv-hn__me-foot .tpv-btn { text-align: center; justify-content: center; }
  .tpv-hn__me { padding: 12px; }
  .tpv-hn__score { width: 58px; height: 58px; padding-top: 14px; } .tpv-hn__score b { font-size: 20px; }
  #main .tpv-hn__me-t h3, .tpv-hn__me-t h3 { font-size: 17px; }
  .tpv-hn__adv { grid-template-columns: 1fr; }
  /* Điện thoại: chỉ hé một phần – 1 ý nên/tránh, tóm tắt 3 dòng, bỏ nạp âm */
  .tpv-hn__adv li:nth-child(n+2) { display: none; }
  .tpv-hn__me-t p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .tpv-hn__facts li.is-na { display: none; }
  .tpv-hn__nk { font-size: 13px; }
  .tpv-hn__me-foot { flex-direction: column; align-items: stretch; }
  .tpv-hn__me-foot p { flex-basis: auto; }
  .tpv-hn__other { text-align: center; }
}

/* ---------- Hộp nhắc nhỏ ---------- */
.tpv-hnb { position: fixed; left: 16px; bottom: 18px; z-index: 991; display: flex; align-items: stretch; width: 330px; max-width: calc(100vw - 32px);
  border-radius: 14px; border: 1px solid rgba(232,199,125,.5); background: linear-gradient(150deg, #22134f, #120a2e); color: #ece6fb;
  box-shadow: 0 14px 36px rgba(0,0,0,.45); font-family: var(--tpv-sans); opacity: 0; transform: translateY(14px); transition: opacity .25s, transform .25s; }
.tpv-hnb.is-in { opacity: 1; transform: none; }
.tpv-hnb__a { flex: 1; display: flex; gap: 12px; align-items: center; padding: 11px 34px 11px 12px; color: inherit !important; text-decoration: none !important; }
.tpv-hnb__ic { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; font-size: 20px;
  color: #f8e6b4; border: 1px solid rgba(232,199,125,.5); background: radial-gradient(circle at 35% 30%, rgba(124,58,237,.55), rgba(124,58,237,.12) 72%); }
.tpv-hnb__b { display: flex; flex-direction: column; gap: 1px; min-width: 0; font-size: 13px; line-height: 1.35; }
.tpv-hnb__k { font-size: 11.5px; color: #b3a7d6; }
.tpv-hnb__b b { font-weight: 600; font-size: 14px; color: #fff; }
.tpv-hnb__b em { font-style: normal; color: #e8c77d; }
.tpv-hnb.is-tot .tpv-hnb__b em { color: #6ee7a8; } .tpv-hnb.is-xau .tpv-hnb__b em { color: #ff9a8a; }
.tpv-hnb__go { margin-top: 2px; font-weight: 600; color: #e8c77d; }
.tpv-hnb__x { position: absolute; top: 4px; right: 4px; width: 28px; height: 28px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 50%; line-height: 1;
  font-size: 20px; background: transparent; color: #b3a7d6; cursor: pointer; }
.tpv-hnb__x:hover { color: #fff; background: rgba(255,255,255,.08); }
body.has-tpv-tb .tpv-hnb { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
@media (min-width: 1100px) { body:has(.tpv-float:not([hidden])) .tpv-hnb { bottom: 120px; } }
@media (max-width: 849px) {
  .tpv-hnb { left: 10px; right: 10px; width: auto; max-width: none; }
  .tpv-hnb__a { padding: 9px 34px 9px 10px; } .tpv-hnb__ic { width: 34px; height: 34px; font-size: 17px; }
  /* đẩy nút Nền sáng/tối lên trên hộp nhắc */
  body.has-tpv-hnb .tpv-tm { bottom: calc(18px + var(--hnb-h, 70px) + 10px); transition: bottom .25s; }
  body.has-tpv-hnb.has-tpv-tb .tpv-tm { bottom: calc(76px + var(--hnb-h, 70px) + 10px + env(safe-area-inset-bottom, 0px)); }
}
@media print { .tpv-hn, .tpv-hnb { display: none !important; } }

/* ---------- Giao diện sáng ---------- */
html.tpv-light .tpv-hn { --hn-tot: #1a7f4b; --hn-xau: #b42318; --hn-binh: #7a5600;
  background: #fffdf8; border-color: rgba(138,99,0,.4); box-shadow: 0 8px 26px rgba(60,40,10,.1); }
html.tpv-light .tpv-hn__date { background: #fbf4e4; }
html.tpv-light .tpv-hn__facts li, html.tpv-light .tpv-hn__adv > div { background: rgba(70,45,120,.04); }
html.tpv-light .tpv-hn__me { background: linear-gradient(135deg, #fdf6e3, #f4effd); border-color: rgba(138,99,0,.4); }
html.tpv-light .tpv-hn__mung { background: #7a5600; color: #fff; }
html.tpv-light .tpv-hnb { background: #fffdf8; color: #2a2140; border-color: rgba(138,99,0,.45); box-shadow: 0 10px 30px rgba(60,40,10,.22); }
html.tpv-light .tpv-hnb__k, html.tpv-light .tpv-hnb__x { color: #5c5373; }
html.tpv-light .tpv-hnb__b b { color: #2a2140; }
html.tpv-light .tpv-hnb__b em, html.tpv-light .tpv-hnb__go { color: #7a5600; }
html.tpv-light .tpv-hnb.is-tot .tpv-hnb__b em { color: #1a7f4b; } html.tpv-light .tpv-hnb.is-xau .tpv-hnb__b em { color: #b42318; }
html.tpv-light .tpv-hnb__ic { color: #7a5600; background: #fbf4e4; border-color: rgba(138,99,0,.4); }
html.tpv-light .tpv-hnb__x:hover { background: rgba(60,40,10,.06); color: #2a2140; }
