/**
 * XEM NGÀY TỐT XẤU THEO TUỔI (/xem-ngay-tot-xau-theo-tuoi/) — giao diện "Lịch tháng" (12/10/2026).
 * Nạp SAU hoptuoi.css, kethon.css và muaxe.css (khung nhập, lịch 7 cột, ô chi tiết ngày dùng chung với Xem ngày tốt mua xe).
 * Phần riêng: chọn việc, mức "Ngày xấu", giờ hợp / xung tuổi, ô hôm nay trên lịch, dải 6 tháng tới, bảng 12 Trực theo việc.
 * Màu chỉ lấy từ biến của cute.css; trung tính, không emoji.
 */
body.page-template-page-xem-ngay-tot-xau-theo-tuoi .page-header, body.page-template-page-xem-ngay-tot-xau-theo-tuoi .nevo-breadcrumb { display: none !important; }

/* ---------- Khung nhập ---------- */
.nt-tool-head { background: linear-gradient(115deg, color-mix(in srgb, var(--boi-butter) 75%, var(--theme-bg-elevated)), color-mix(in srgb, var(--boi-peach) 60%, var(--theme-bg-elevated)) 55%, color-mix(in srgb, var(--boi-mint) 70%, var(--theme-bg-elevated))); }
.nt-owner { --ht-c: var(--boi-butter); }
.nt-vnote { margin: 8px 0 0; font-size: .84rem; line-height: 1.5; color: var(--theme-text-secondary); }
.nt-vnote a { font-weight: 800; color: var(--theme-gold-text); }

/* ---------- Mức "Ngày xấu" ---------- */
.is-low { --kh-t: var(--boi-peach); }
.mx-cal-d.is-low { background: color-mix(in srgb, var(--boi-peach) 45%, var(--theme-bg-elevated)); border: 2px dashed color-mix(in srgb, var(--theme-gold-text) 55%, transparent); }
.mx-cal-d.is-low[aria-pressed="true"] { border-style: solid; border-color: var(--theme-gold-text); }
.nt-legend .is-low::before { box-sizing: border-box; border: 2px dashed color-mix(in srgb, var(--theme-gold-text) 55%, transparent); }
.mx-cal-d.is-today::after { content: ""; position: absolute; top: 6px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: var(--theme-gold-text); }

/* ---------- Chi tiết ngày ---------- */
.nt-verdict { margin: 0; font-size: .92rem; line-height: 1.55; color: var(--theme-text-body); }
.nt-hours li { position: relative; }
.nt-hours li i { margin-top: 2px; font-style: normal; font-size: .68rem; font-weight: 800; }
.nt-hours li.is-hop { background: color-mix(in srgb, var(--boi-mint) 65%, transparent); }
.nt-hours li.is-hop i { color: var(--boi-sticker-ink); }
.nt-hours li.is-xung { background: color-mix(in srgb, var(--boi-pink) 55%, transparent); }
.nt-hours li.is-xung i { color: var(--boi-sticker-ink); }
.nt-hnote { margin: 0; font-size: .84rem; line-height: 1.5; color: var(--theme-text-secondary); }
.nt-one .mx-dd { box-shadow: 0 0 0 2px var(--kh-t); }

/* ---------- 6 tháng tới ---------- */
.nt-ov-l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.nt-ov-l li { margin: 0; }
.nt-ov-b { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px 6px; border-radius: var(--boi-r-md, 18px);
    border: 2px solid var(--theme-border); background: var(--theme-bg-elevated); color: var(--theme-text-secondary); cursor: pointer; font-family: var(--boi-font-body); }
.nt-ov-b span { font-size: .8rem; font-weight: 800; }
.nt-ov-b strong { font: 900 1.6rem/1.1 var(--boi-font-head); color: var(--theme-text-strong); }
.nt-ov-b em { font-style: normal; font-size: .74rem; text-align: center; }
.nt-ov-b small { margin-top: 2px; padding: 1px 8px; border-radius: 999px; font-size: .68rem; font-weight: 800; color: var(--boi-sticker-ink); background: var(--boi-butter); }
.nt-ov-b.is-on { border-color: var(--theme-gold-text); background: color-mix(in srgb, var(--boi-mint) 45%, var(--theme-bg-elevated)); }
.nt-ov-b:focus-visible { outline: 3px solid var(--theme-gold-text); outline-offset: 2px; }

/* ---------- Bảng tra trong bài ---------- */
.nt-truc-table td, .nt-truc-table th[scope="col"] { text-align: center; }
.nt-truc-table td.is-good, .nt-giap-table td.is-good { background: color-mix(in srgb, var(--boi-mint) 45%, transparent); }
.nt-truc-table td.is-mid { background: color-mix(in srgb, var(--boi-butter) 45%, transparent); }
.nt-truc-table td.is-hard, .nt-giap-table td.is-hard { background: color-mix(in srgb, var(--boi-pink) 40%, transparent); }
.nt .ht-learn .nt-crit-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---------- Nền tối ---------- */
:root:not([data-theme="light"]) .nt-tool-head { background: linear-gradient(115deg, var(--boi-butter), var(--boi-peach) 55%, var(--boi-mint)); }
:root:not([data-theme="light"]) .mx-cal-d.is-low { background: color-mix(in srgb, var(--boi-peach) 20%, var(--theme-bg-elevated)); }
:root:not([data-theme="light"]) .nt-hours li.is-hop { background: color-mix(in srgb, var(--boi-mint) 30%, transparent); }
:root:not([data-theme="light"]) .nt-hours li.is-xung { background: color-mix(in srgb, var(--boi-pink) 22%, transparent); }
:root:not([data-theme="light"]) .nt-hours li.is-hop i, :root:not([data-theme="light"]) .nt-hours li.is-xung i { color: var(--theme-text-strong); }
:root:not([data-theme="light"]) .nt-ov-b.is-on { background: color-mix(in srgb, var(--boi-mint) 16%, var(--theme-bg-elevated)); }
:root:not([data-theme="light"]) .nt-truc-table td.is-good, :root:not([data-theme="light"]) .nt-giap-table td.is-good { background: color-mix(in srgb, var(--boi-mint) 14%, transparent); }
:root:not([data-theme="light"]) .nt-truc-table td.is-mid { background: color-mix(in srgb, var(--boi-butter) 14%, transparent); }
:root:not([data-theme="light"]) .nt-truc-table td.is-hard, :root:not([data-theme="light"]) .nt-giap-table td.is-hard { background: color-mix(in srgb, var(--boi-pink) 14%, transparent); }

/* ---------- Tablet ---------- */
@media (max-width: 1100px) {
    .nt-ov-l { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---------- Điện thoại ---------- */
@media (max-width: 768px) {
    .nt-ov-l { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .nt .ht-learn .nt-crit-cards { grid-template-columns: 1fr 1fr; }
    .nt-truc-table { min-width: 560px; }
    .nt-truc-table caption { text-align: left; }
    .nt .ht-learn .ht-table th, .nt .ht-learn .ht-table td { overflow-wrap: normal; word-break: normal; }
    .nt-truc-table th, .nt-truc-table td { white-space: nowrap; word-break: normal; overflow-wrap: normal; padding-inline: 8px; }
    .mx-cal-d.is-today::after { top: 4px; right: 4px; width: 6px; height: 6px; }
}