@media screen{
/* auto từ hkd-ui.css */
#hkd-launcher{background:rgba(243,246,251,.97)}
#hkd-launcher .hkd-home-card{background:#ffffff;border:1px solid #d3deee;box-shadow:0 18px 50px rgba(15,42,74,.12)}
#hkd-launcher .kicker{color:#1b3d66}
#hkd-launcher .title{color:#0f2a4a}
#hkd-launcher .rule{background:#1b3d66}
#hkd-launcher .sub{color:#5a6d86}
#hkd-launch-q{border:1px solid #c9d6e8}
#hkd-launch-count{color:#5a6d86}
.hkd-launch-x{border:1px solid #0f2a4a;color:#0f2a4a}
.hkd-mod{border:1px solid #d3deee}
.hkd-mod:hover{border-color:#1b3d66;box-shadow:0 8px 20px rgba(15,42,74,.08)}
.hkd-mod.cur{border:2px solid #0f2a4a}
.hkd-mod .k{color:#1b3d66}
.hkd-mod h3{color:#0f2a4a}
.hkd-mod p{color:#5a6d86}
.hkd-mod .pill{background:#e7eef8;color:#12315f}
.hkd-launch-empty{color:#5a6d86}
#hkd-launch-btn{border:1px solid #0f2a4a;background:#0f2a4a}
#hkd-launch-btn:hover{background:#1b3d66;border-color:#1b3d66}
#hkd-launcher{background:#f3f6fb}
#hkd-launcher .hkd-home-top{border-bottom:1px solid #d3deee}
#hkd-launcher .hkd-home-top .brand{color:#0f2a4a}
#hkd-launcher .hkd-home-top .who{color:#5a6d86}
.hkd-mod.am .pill{color:#9b2c2c}
.hkd-mod .go{color:#0f2a4a}
#hkd-rpt .rp-head{border-bottom:2px solid #1b3d66}
#hkd-rpt .rp-head .kick{color:#1b3d66}
#hkd-rpt label.bk.cv .code{background:#1b3d66}
.hkd-ovt-bar>div{background:linear-gradient(90deg,#1d4ed8,#1b3d66)}
#hkd-tc .tc-head{border-bottom:2px solid #1b3d66}
#hkd-tc .kick,#hkd-tc-dlg .kick{color:#1b3d66}
#hkd-tc .tc-na{border-left:5px solid #1b3d66}
#hkd-tc .tc-na .ic{color:#1b3d66}
#hkd-tc-dlg .dh{border-bottom:2px solid #1b3d66}
#hkd-tc .tc-sync{background:#1b3d66}
#hkd-tc .tc-q button.on{background:#1b3d66;border-color:#1b3d66}
.hvp-bar i{background:#1b3d66}
.hvp-bar.run i{background:repeating-linear-gradient(45deg,#1b3d66 0 10px,#d4a54a 10px 20px)}
}
/* HKD NAVY THEME — lớp giao diện kiểu VK/SV (navy + trắng). Chỉ đổi màu/khung, không đụng chức năng. In ấn giữ nguyên (chỉ áp cho màn hình). */
@media screen{
:root,html[data-theme],html[data-theme=navy],html[data-theme=be],html[data-theme=dark]{
 --hn:#0f2a4a;--hn2:#0a1e36;--hn3:#1b3d66;--hn4:#2b5d9c;--hn-bg:#f3f6fb;--hn-bd:#d3deee;--hn-bd2:#b7c7de;--hn-tx:#0e1c33;--hn-mu:#5a6d86;
 --app-bg:#f3f6fb;--app-fg:#0e1c33;--surface:#fff;--surface-2:#f7f9fc;--border:#d3deee;--muted:#5a6d86;--muted-2:#8aa0bb;
 --primary:#0f2a4a;--primary-2:#1b3d66;--primary-hover:#0a1e36;--primary-fg:#fff;--focus-ring:#0f2a4a2e;
 --sidebar-bg:#0f2a4a;--sidebar-bg-solid:#0f2a4a;--sidebar-border:#ffffff1a;--sidebar-text:#fff;--sidebar-muted:#ffffff73;--sidebar-hover:#ffffff14;--sidebar-active-bg:#ffffff24;--sidebar-active-text:#fff;
 --brand-50:#e7eef8;--brand-100:#d3deee;--brand-600:#0f2a4a;--brand-700:#1b3d66;--success-bg:#e7eef8;--success-fg:#0f2a4a;
 --secondary-bg:#eef2f7;--secondary-fg:#1b3d66;--secondary-hover:#e2e9f3;--card-shadow:0 1px 2px #0f2a4a0a,0 4px 12px #0f2a4a0d;--input-bg:#fff;--table-head:#0f2a4a;--overlay:#0a1e3680;
 color-scheme:light}
html body{background:var(--hn-bg)!important;color:var(--hn-tx)}
/* SIDEBAR kiểu VK: nền navy, nhóm chữ nhỏ giãn cách, mục chọn = viền trái trắng + nền sáng nhẹ */
aside.sidebar,.sidebar{background:var(--hn)!important;background-color:var(--hn)!important;border-right:1px solid var(--hn2)!important;color:#fff!important}
.sidebar [class*="tracking-[0.08em]"][class*="font-bold"]{color:rgba(255,255,255,.45)!important;letter-spacing:.16em!important;font-size:10px!important}
.sidebar-link{color:rgba(255,255,255,.78)!important;border-radius:0 8px 8px 0!important;border-left:3px solid transparent!important;box-shadow:none!important;background:transparent!important}
.sidebar-link:hover{background:rgba(255,255,255,.08)!important;color:#fff!important}
.sidebar-link-active,.sidebar-link.sidebar-link-active{background:rgba(255,255,255,.15)!important;color:#fff!important;border-left:3px solid #fff!important;box-shadow:none!important;font-weight:800!important}
.sidebar-link-active svg,.sidebar-link-active span{color:#fff!important}
.sidebar select,.sidebar button:not(.sidebar-link){border-color:rgba(255,255,255,.18)!important}
/* TOPBAR trắng, tiêu đề navy đậm */
header.topbar{background:#fff!important;border-bottom:1px solid var(--hn-bd)!important;box-shadow:0 1px 0 #0f2a4a08}
header.topbar p{color:var(--hn-mu)!important;letter-spacing:.06em}
header.topbar p>span:last-child,header.topbar p [data-drv-c]{color:var(--hn)!important;font-weight:900!important}
/* NỘI DUNG: thẻ trắng viền xanh nhạt */
main .card,main [class~="card"],.hkd-kpi,#hkd-filter-bar{background:#fff!important;border:1px solid var(--hn-bd)!important;border-radius:12px!important}
main table thead th,main table th{background:var(--hn)!important;color:#fff!important;border-color:var(--hn2)!important}
main table tbody tr:nth-child(even) td{background:rgba(15,42,74,.03)}
main table tbody tr:hover td{background:rgba(43,93,156,.08)!important}
main input:focus,main select:focus,main textarea:focus{outline:none!important;border-color:var(--hn4)!important;box-shadow:0 0 0 3px rgba(43,93,156,.15)!important}
.btn-primary,button.btn-primary,main button[class*="bg-[var(--primary)]"]{background:var(--hn3)!important;color:#fff!important}
.btn-primary:hover{background:var(--hn)!important}
#hkd-filter-bar button[data-q].on,.hkd-refresh-btn{background:var(--hn)!important;border-color:var(--hn)!important;color:#fff!important}
/* MÀN HÌNH CHỌN PHÂN HỆ (trước nền be) → navy/trắng */
#hkd-launcher{background:var(--hn-bg)!important}
#hkd-launcher .hkd-home-top{border-bottom:0!important;background:var(--hn)!important;margin:0 -18px 18px!important;max-width:none!important;padding:14px 22px!important}
#hkd-launcher .hkd-home-top .brand{color:#fff!important}
#hkd-launcher .hkd-home-top .who{color:rgba(255,255,255,.75)!important}
#hkd-launcher .hkd-home-card{background:#fff!important;border:1px solid var(--hn-bd)!important;box-shadow:0 18px 50px rgba(15,42,74,.10)!important}
#hkd-launcher .kicker,.hkd-mod .k{color:var(--hn4)!important}
#hkd-launcher .rule{background:var(--hn)!important}
#hkd-launcher .title,.hkd-mod h3,.hkd-mod .go{color:var(--hn)!important}
#hkd-launcher .sub,#hkd-launch-count,.hkd-mod p,.hkd-launch-empty{color:var(--hn-mu)!important}
#hkd-launch-q{border:1.5px solid var(--hn-bd)!important}
#hkd-launch-q:focus{border-color:var(--hn4)!important;outline:none}
.hkd-mod{border:1px solid var(--hn-bd)!important}
.hkd-mod:hover{border-color:var(--hn3)!important;box-shadow:0 8px 20px rgba(15,42,74,.10)!important}
.hkd-mod.cur{border:2px solid var(--hn)!important;background:#f5f8fd!important}
.hkd-mod .pill{background:#e7eef8!important;color:#12315f!important}
#hkd-launch-btn{background:var(--hn)!important;border-color:var(--hn)!important}
#hkd-launch-btn:hover{background:var(--hn3)!important;border-color:var(--hn3)!important}
/* SỔ KẾ TOÁN / BÁO CÁO */
#hkd-rpt{background:var(--hn-bg)!important}
#hkd-rpt .rp-head{border-bottom-color:var(--hn)!important}
#hkd-rpt .rp-head .kick{color:var(--hn4)!important}
#hkd-rpt .rp-head .ttl{color:var(--hn)!important}
/* DI ĐỘNG */
@media (max-width:1024px){
 header.topbar{padding-left:10px!important;padding-right:10px!important}
 #hkd-launcher{padding:0 10px 24px!important}
 #hkd-launcher .hkd-home-top{margin:0 -10px 12px!important;padding:12px 14px!important}
 #hkd-launch-q{width:100%!important}
}
}
@media screen{.hkd-hdt-btn{background:#2b5d9c!important;border-color:#2b5d9c!important;color:#fff!important}}
@media screen{
.hn-ham{display:none}
#hn-bd{display:none}
@media (max-width:1024px){
 .hn-ham{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin-right:8px;border-radius:8px;border:1px solid #d3deee;background:#fff;color:#0f2a4a;font-size:18px;font-weight:900;cursor:pointer;flex:0 0 auto}
 aside.sidebar{position:fixed!important;left:0;top:0;bottom:0;z-index:9600!important;transform:translateX(-105%);transition:transform .2s ease;box-shadow:none;height:100vh!important;overflow-y:auto}
 html.hn-open aside.sidebar{transform:none;box-shadow:8px 0 30px rgba(10,30,54,.35)}
 html.hn-open #hn-bd{display:block;position:fixed;inset:0;z-index:9550;background:rgba(10,30,54,.45)}
 header.topbar p{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 #hkd-rpt{left:0!important}
 main{min-width:0;padding:10px!important}
 main h1,main h2{word-break:normal!important;overflow-wrap:anywhere}
 main .overflow-x-auto,main table{max-width:100%}
}}
@media screen and (max-width:1024px){main [class*="justify-between"]{flex-wrap:wrap!important;gap:8px!important}main [class*="justify-between"]>div:first-child{min-width:min(100%,260px)}main h1,main h2{word-break:keep-all!important}}
@media screen and (max-width:1024px){main [class*="justify-between"]>div{flex-wrap:wrap!important}}
@media screen and (max-width:1024px){
 html body main .hkd-cmp-head{flex-wrap:wrap!important;align-items:flex-start!important}
 html body main .hkd-cmp-head>div:first-child{flex:1 1 100%}
 html body main .hkd-cmp-head>div:last-child{flex-wrap:wrap!important;width:100%;gap:6px!important}
 html body main .hkd-cmp-head>div:last-child>*{flex:1 1 calc(50% - 6px);justify-content:center;min-width:0}
 html body main .hkd-cmp-head>div:last-child .btn{white-space:normal!important;height:auto!important;min-height:36px;font-size:11px!important;padding:6px 8px!important}
}
@media screen and (max-width:1024px){
 html body main .hkd-cmp-root .hkd-tax-sel.hkd-tax-sel{position:sticky;left:0;max-width:100%;flex-wrap:wrap!important;row-gap:6px!important}
 html body main .hkd-cmp-root .hkd-tax-sel.hkd-tax-sel label{white-space:nowrap}
 html body main .hkd-cmp-root .hkd-tax-sel.hkd-tax-sel #hkd-tax-del-selected{white-space:nowrap;line-height:1.2}
 html body main .hkd-cmp-root .hkd-tax-sel.hkd-tax-sel #hkd-tax-sel-count{white-space:nowrap}
 html body main .hkd-cmp-root .hkd-tax-sel.hkd-tax-sel .hkd-tax-dbl-hint{display:none!important}
 html body main .hkd-cmp-root .hkd-tax-sel.hkd-tax-sel .hkd-cmp-tot.hkd-cmp-tot{flex:1 1 100%!important;display:flex!important;flex-wrap:wrap!important;gap:4px 14px!important;margin-left:0!important;white-space:normal!important;justify-content:flex-start!important}
 html body main .hkd-cmp-root .hkd-tax-sel.hkd-tax-sel .hkd-cmp-tot span{white-space:nowrap}
 html body .zs-btn.zs-float{top:auto!important;bottom:64px!important;right:12px!important}
}
