/* Phương tiện vận tải — cùng bộ màu, phông, nền với Cổng (kiểu E). Tự chọn giao diện: data-nen × data-mau × phông × cỡ chữ. */
:root{
  --muc:#1C2530; --muc-2:#4A5561; --muc-3:#76808B; --nen:#EEF0EE; --tam:#FFFFFF; --vien:#D3D8D6;
  --do:#D2161E; --xanh:#1E7F4B; --xanh-nhat:#E5F3EA; --vang:#B57A00; --vang-nhat:#FBF1D9;
  --lam:#285FA3; --lam-nhat:#E6EEF8; --xam:#8D969E; --xam-nhat:#ECEEEF; --lien-ket:#24527D;
  --r:12px; --phong:"Nunito"; --co:100%; --bong:0 10px 30px rgba(28,37,48,.10);
  --do-nhat:color-mix(in srgb, var(--do) 11%, #fff); --dam:color-mix(in srgb, var(--do) 14%, #161C24);
}
:root[data-mau="cam"]{--do:#D2600A} :root[data-mau="vang"]{--do:#B07F00} :root[data-mau="luc"]{--do:#1B8A3A}
:root[data-mau="lam"]{--do:#1F5FA8} :root[data-mau="cham"]{--do:#3B3FA6} :root[data-mau="tim"]{--do:#7B2DA6}
:root[data-nen="toi"]{--muc:#E8ECEF;--muc-2:#B7C0C8;--muc-3:#8B96A1;--nen:#11161C;--tam:#1A2129;--vien:#2D3743;
  --do:#FF5058;--xanh:#4CC487;--xanh-nhat:#163527;--vang:#F0B53D;--vang-nhat:#3A2E12;--lam:#7DB0F0;--lam-nhat:#18283C;
  --xam:#6C7782;--xam-nhat:#232B34;--lien-ket:#8DBDF2;--bong:0 10px 30px rgba(0,0,0,.4);
  --do-nhat:color-mix(in srgb, var(--do) 22%, #11161C);--dam:color-mix(in srgb, var(--do) 10%, #0B0F14)}
:root[data-nen="toi"][data-mau="cam"]{--do:#FF8A3D} :root[data-nen="toi"][data-mau="vang"]{--do:#F2C335} :root[data-nen="toi"][data-mau="luc"]{--do:#4CC77A}
:root[data-nen="toi"][data-mau="lam"]{--do:#6FA8F0} :root[data-nen="toi"][data-mau="cham"]{--do:#8C92F2} :root[data-nen="toi"][data-mau="tim"]{--do:#C58AF0}
:root[data-nen="tuong_phan"]{--muc:#000;--muc-2:#111;--muc-3:#333;--nen:#FFF;--tam:#FFF;--vien:#000;--lien-ket:#0000B8;--dam:#000;--bong:none;--xam:#444}
:root[data-nen="tuong_phan"] .the,:root[data-nen="tuong_phan"] .bang-boc{border-width:2px}
:root[data-giam="1"] *{transition:none!important;animation:none!important}

*{box-sizing:border-box}
html{font-size:var(--co)}
body{margin:0;background:var(--nen);color:var(--muc);font-family:var(--phong),"Be Vietnam Pro","Segoe UI",Arial,sans-serif;font-size:15px;line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:var(--lien-ket)}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{margin:0;line-height:1.25}

/* ----- Thanh trên ----- */
.dau{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;padding:8px 16px;background:var(--tam);border-bottom:1px solid var(--vien);min-height:58px}
.dau .nut-menu{display:none}
.nhan-dien{display:flex;flex-direction:column;line-height:1.05;text-decoration:none;color:var(--muc);min-width:0}
.nhan-dien i{font-size:11px;color:var(--muc-3)}
.nhan-dien b{font-size:14px;font-weight:900;letter-spacing:.02em;white-space:nowrap}
.nhan-dien b span{color:var(--do)}
.tram-ten{display:flex;align-items:center;gap:8px;padding:5px 12px;border-radius:999px;background:var(--do-nhat);color:var(--do);font-weight:800;white-space:nowrap}
.tram-ten .cham{width:9px;height:9px;border-radius:50%;background:var(--do);box-shadow:0 0 0 4px color-mix(in srgb,var(--do) 22%,transparent)}
.dau .gian{flex:1}
.o-tim{display:flex;align-items:center;gap:8px;min-width:240px;max-width:420px;flex:1;padding:8px 12px;border:1px solid var(--vien);border-radius:999px;background:var(--nen);color:var(--muc-3);cursor:text}
.o-tim kbd{margin-left:auto;font-size:11px;border:1px solid var(--vien);border-radius:6px;padding:1px 6px;background:var(--tam)}
.nut{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:7px 14px;border-radius:10px;border:1px solid var(--vien);background:var(--tam);cursor:pointer;font-weight:700;white-space:nowrap;text-decoration:none;color:var(--muc)}
.nut:hover{border-color:var(--do)}
.nut.chinh{background:var(--do);border-color:var(--do);color:#fff}
.nut.chinh:hover{filter:brightness(1.08)}
.nut.nhe{background:transparent;border-color:transparent}
.nut.nho{min-height:30px;padding:4px 10px;font-size:13px;border-radius:8px}
.nut.nguy{color:#B3261E;border-color:#E3B4B1}
.nut:disabled{opacity:.5;cursor:not-allowed}
.nguoi{display:flex;align-items:center;gap:8px;cursor:pointer;padding:4px 8px;border-radius:10px}
.nguoi:hover{background:var(--nen)}
.anh-tron{width:34px;height:34px;border-radius:50%;background:var(--dam);color:#fff;display:grid;place-items:center;font-weight:800;font-size:13px}
.nguoi small{display:block;color:var(--muc-3);font-size:12px}

/* ----- Bố cục ----- */
.khung{display:grid;grid-template-columns:var(--rong-menu,250px) 1fr;min-height:calc(100vh - 58px)}
.menu{background:var(--tam);border-right:1px solid var(--vien);padding:12px 10px 40px;overflow:auto;position:sticky;top:58px;height:calc(100vh - 58px)}
.menu .chuong{margin:14px 8px 4px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--muc-3)}
.menu a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;color:var(--muc);text-decoration:none;font-weight:600}
.menu a .bt{width:22px;text-align:center;font-size:16px}
.menu a:hover{background:var(--nen)}
.menu a.dang{background:var(--do-nhat);color:var(--do)}
.menu a .dem{margin-left:auto;background:var(--do);color:#fff;border-radius:999px;font-size:11px;padding:0 7px}
.menu .chan-menu{margin-top:18px;padding:10px;font-size:12px;color:var(--muc-3);border-top:1px dashed var(--vien)}
.noi-dung{padding:18px 22px 60px;min-width:0}
.vb-ap-dung{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 12px;margin-bottom:14px;border-radius:10px;background:var(--lam-nhat);color:var(--muc-2);font-size:13px}
.vb-ap-dung b{color:var(--muc)}
.tieu-de{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;margin-bottom:14px}
.tieu-de h1{font-size:24px;font-weight:900}
.tieu-de p{margin:4px 0 0;color:var(--muc-2)}
.tieu-de .gian{flex:1}
.duong-dan{font-size:13px;color:var(--muc-3);margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.duong-dan a{color:var(--muc-3)}

/* ----- Thẻ, lưới ----- */
.luoi{display:grid;gap:14px}
.luoi.k4{grid-template-columns:repeat(4,minmax(0,1fr))}
.luoi.k3{grid-template-columns:repeat(3,minmax(0,1fr))}
.luoi.k2{grid-template-columns:repeat(2,minmax(0,1fr))}
.the{background:var(--tam);border:1px solid var(--vien);border-radius:var(--r);padding:16px;box-shadow:var(--bong);min-width:0}
.the h2{font-size:16px;font-weight:800;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.the h2 .gian{flex:1}
.kpi{display:flex;flex-direction:column;gap:2px;cursor:pointer;text-decoration:none;color:var(--muc)}
.kpi .so{font-size:30px;font-weight:900;line-height:1}
.kpi .nhan-kpi{color:var(--muc-2);font-weight:700;font-size:13px}
.kpi.do .so{color:#C62828} .kpi.vang .so{color:var(--vang)} .kpi.xanh .so{color:var(--xanh)} .kpi.chu .so{color:var(--do)}
:root[data-nen="toi"] .kpi.do .so{color:#FF6B6B}

/* ----- Bảng ----- */
.cong-cu{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.cong-cu input,.cong-cu select{min-height:38px;padding:6px 10px;border:1px solid var(--vien);border-radius:10px;background:var(--tam)}
.cong-cu .tim{min-width:220px;flex:1;max-width:360px}
.bang-boc{background:var(--tam);border:1px solid var(--vien);border-radius:var(--r);overflow:auto}
table.bang{width:100%;border-collapse:collapse;font-size:14px}
.bang th{position:sticky;top:0;background:var(--nen);text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--muc-2);padding:9px 10px;border-bottom:1px solid var(--vien);white-space:nowrap}
.bang td{padding:9px 10px;border-bottom:1px solid var(--vien);vertical-align:top}
.bang tr.bam{cursor:pointer}
.bang tr.bam:hover td{background:var(--do-nhat)}
.bang td.so,.bang th.so{text-align:right;white-space:nowrap}
.trong{padding:26px;text-align:center;color:var(--muc-3)}
.dem-dong{font-size:12px;color:var(--muc-3);margin-left:auto}

/* ----- Nhãn, hạn, liên kết thông minh ----- */
.nhan{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:800;background:var(--xam-nhat);color:var(--muc-2);white-space:nowrap}
.nhan.xanh{background:var(--xanh-nhat);color:var(--xanh)} .nhan.vang{background:var(--vang-nhat);color:var(--vang)}
.nhan.do{background:#FCE4E4;color:#B3261E} .nhan.lam{background:var(--lam-nhat);color:var(--lam)} .nhan.chu{background:var(--do-nhat);color:var(--do)}
:root[data-nen="toi"] .nhan.do{background:#3B1A1A;color:#FF8A80}
.nguon{display:inline-block;font-size:11px;font-weight:800;padding:1px 6px;border-radius:6px;border:1px solid var(--lam);color:var(--lam);vertical-align:middle;margin-left:4px}
.gia-dinh{display:inline-block;font-size:11px;font-weight:900;padding:1px 6px;border-radius:6px;background:var(--vang-nhat);color:var(--vang);letter-spacing:.03em}
.han{white-space:nowrap;font-weight:700}
.han.qua{color:#C62828} .han.sap{color:var(--vang)} .han.ok{color:var(--xanh)}
:root[data-nen="toi"] .han.qua{color:#FF6B6B}
.lktm{color:var(--lien-ket);font-weight:700;cursor:pointer;border-bottom:1px dashed currentColor;white-space:nowrap}
.mo{color:var(--muc-3);font-size:13px}

/* ----- Tab ----- */
.tab{display:flex;gap:4px;border-bottom:1px solid var(--vien);margin:4px 0 14px;overflow-x:auto}
.tab button{border:0;background:none;padding:9px 14px;font-weight:700;color:var(--muc-2);cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap}
.tab button.dang{color:var(--do);border-bottom-color:var(--do)}

/* ----- Danh sách định nghĩa ----- */
dl.tt{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:6px 14px;margin:0}
dl.tt dt{color:var(--muc-3);font-size:13px} dl.tt dd{margin:0;font-weight:600;min-width:0;overflow-wrap:anywhere}

/* ----- Hộp thoại ----- */
.man{position:fixed;inset:0;background:rgba(10,14,20,.45);z-index:80;display:grid;place-items:center;padding:16px}
.hop{background:var(--tam);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.3);width:min(640px,100%);max-height:calc(100vh - 32px);display:flex;flex-direction:column}
.hop.rong{width:min(980px,100%)}
.hop .dau-hop{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--vien)}
.hop .dau-hop h3{font-size:17px;font-weight:900;flex:1}
.hop .than{padding:16px 18px;overflow:auto}
.hop .chan{display:flex;justify-content:flex-end;gap:8px;padding:12px 18px;border-top:1px solid var(--vien)}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}
.form .rong{grid-column:1/-1}
.form label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:700;color:var(--muc-2)}
.form label .bb{color:#C62828}
.form input,.form select,.form textarea{min-height:40px;padding:8px 10px;border:1px solid var(--vien);border-radius:10px;background:var(--tam);font-weight:600;color:var(--muc)}
.form textarea{min-height:70px;resize:vertical}
.form .goi-y{font-weight:500;color:var(--muc-3);font-size:12px}
.form .chon-nhieu{display:flex;flex-wrap:wrap;gap:6px}
.form .chon-nhieu label{flex-direction:row;align-items:center;gap:4px;padding:4px 10px;border:1px solid var(--vien);border-radius:999px;font-weight:700;cursor:pointer}
.form .chon-nhieu input{min-height:0}
.form .o-chon{flex-direction:row;align-items:center;gap:8px}
.form .o-chon input{min-height:0;width:18px;height:18px}

/* ----- Lỗi chặn, thông báo ----- */
.chan-loi{border:1px solid #E3B4B1;background:#FDF0EF;border-radius:12px;padding:12px 14px;margin:8px 0;color:#5F1410}
:root[data-nen="toi"] .chan-loi{background:#2C1615;border-color:#6B2C28;color:#FFD6D2}
.chan-loi b{display:block;margin-bottom:4px}
.chan-loi .lam-gi{margin-top:6px;font-weight:700}
.den{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border-radius:10px;margin:6px 0;font-size:14px}
.den.do{background:#FDF0EF;color:#7A1A14} .den.vang{background:var(--vang-nhat);color:#6B4A00} .den.xanh{background:var(--xanh-nhat);color:var(--xanh)}
:root[data-nen="toi"] .den.do{background:#2C1615;color:#FFD6D2} :root[data-nen="toi"] .den.vang{color:#F7D27A}
.thong-bao{position:fixed;right:16px;bottom:16px;z-index:99;display:flex;flex-direction:column;gap:8px;max-width:min(420px,calc(100vw - 32px))}
.thong-bao div{background:var(--dam);color:#fff;padding:12px 16px;border-radius:12px;box-shadow:var(--bong);font-weight:700}
.thong-bao div.loi{background:#B3261E}

/* ----- Ctrl+K ----- */
.ctrlk .hop{width:min(680px,100%);align-self:start;margin-top:8vh}
.ctrlk input{width:100%;border:0;outline:0;font-size:18px;padding:16px 18px;background:transparent;border-bottom:1px solid var(--vien)}
.ctrlk .kq{max-height:60vh;overflow:auto;padding:6px}
.ctrlk .kq a{display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:10px;color:var(--muc);text-decoration:none}
.ctrlk .kq a.dang,.ctrlk .kq a:hover{background:var(--do-nhat)}
.ctrlk .kq .nhom{font-size:11px;font-weight:800;color:var(--muc-3);text-transform:uppercase;padding:8px 12px 2px}
.ctrlk .kq small{color:var(--muc-3);margin-left:auto;text-align:right}

/* ----- Giải nghĩa mã ----- */
.gn{position:fixed;z-index:90;width:min(360px,calc(100vw - 24px));background:var(--tam);border:1px solid var(--vien);border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.25);padding:14px}
.gn h4{margin:0 0 2px;font-size:16px}
.gn .tt{margin-top:8px}
.gn .thao{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}

/* ----- Tự chọn giao diện ----- */
.tu-chon .muc-mau{display:flex;flex-wrap:wrap;gap:8px}
.tu-chon .o-mau{width:40px;height:40px;border-radius:50%;border:3px solid transparent;cursor:pointer}
.tu-chon .o-mau.dang{border-color:var(--muc)}
.tu-chon .hang{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 14px}
.tu-chon .hang .nut.dang{border-color:var(--do);color:var(--do);background:var(--do-nhat)}

/* ----- Màn hình đăng nhập ----- */
.cua{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 30% 20%,var(--do-nhat),var(--nen) 60%)}
.cua .the{width:min(460px,100%);padding:28px}
.cua .nhan-dien b{font-size:20px}
.cua .tram-ten{margin:14px 0 18px;display:inline-flex}

/* ----- Bước tiếp theo, dòng thời gian ----- */
.buoc-tiep{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:18px;padding:12px;border:1px dashed var(--vien);border-radius:12px;background:var(--tam)}
.buoc-tiep b{color:var(--muc-2);font-size:13px;margin-right:4px}
.dong-tg{list-style:none;padding:0;margin:0}
.dong-tg li{position:relative;padding:0 0 12px 22px;border-left:2px solid var(--vien);margin-left:6px}
.dong-tg li:before{content:"";position:absolute;left:-7px;top:3px;width:12px;height:12px;border-radius:50%;background:var(--do)}
.dong-tg li small{color:var(--muc-3)}
.goi-y-the{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start;padding:12px;border:1px solid var(--vien);border-radius:12px;margin-bottom:10px;background:var(--tam)}
.goi-y-the .hang-so{width:38px;height:38px;border-radius:50%;background:var(--do);color:#fff;display:grid;place-items:center;font-weight:900}
.goi-y-the ul{margin:6px 0 0;padding-left:18px;color:var(--muc-2);font-size:13px}

@media (max-width:1100px){.luoi.k4{grid-template-columns:repeat(2,minmax(0,1fr))}.luoi.k3{grid-template-columns:1fr 1fr}}
@media (max-width:820px){
  .khung{grid-template-columns:1fr}
  .menu{position:fixed;left:0;top:58px;bottom:0;width:280px;z-index:40;transform:translateX(-105%);transition:transform .2s;box-shadow:var(--bong);height:auto}
  .menu.mo-ra{transform:none}
  .dau .nut-menu{display:inline-flex}
  .o-tim{min-width:0}
  .o-tim span,.o-tim kbd,.tram-ten,.nguoi small,.nguoi .ten,.an-hep{display:none}
  .noi-dung{padding:14px 14px 60px}
  .luoi.k2,.luoi.k3{grid-template-columns:1fr}
  .form{grid-template-columns:1fr}
  .tieu-de h1{font-size:20px}
  table.the-dong thead{display:none}
  table.the-dong tr{display:block;border-bottom:1px solid var(--vien);padding:6px 0}
  table.the-dong td{display:flex;gap:10px;border:0;padding:4px 12px}
  table.the-dong td:before{content:attr(data-nhan);flex:0 0 40%;color:var(--muc-3);font-size:12px;font-weight:700}
  table.the-dong td.so{justify-content:flex-start}
  .goi-y-the{grid-template-columns:auto 1fr}
  .goi-y-the > :last-child{grid-column:1/-1}
}
@media (max-width:480px){.luoi.k4{grid-template-columns:1fr 1fr}.nhan-dien b{font-size:12px}.kpi .so{font-size:24px}}
@media print{.dau,.menu,.buoc-tiep,.cong-cu,.nut{display:none!important}.khung{display:block}}
/* Ô chọn có tên dài (pháp nhân, xe) không đẩy trang tràn ngang trên điện thoại */
select{max-width:100%;text-overflow:ellipsis}
.form label,.form > *{min-width:0}
.form input,.form select,.form textarea{width:100%}
.cong-cu select{min-width:0;flex:1 1 160px}
@media (max-width:820px){
  .dau{gap:6px;padding:8px 10px}
  .nhan-dien{flex:1 1 auto;overflow:hidden}
  .nhan-dien i{display:none}
  .nhan-dien b{font-size:12px;overflow:hidden;text-overflow:ellipsis}
  .o-tim{flex:0 0 40px;max-width:40px;min-width:40px;padding:8px 0;justify-content:center}
  .dau .nut.nho{padding:4px 8px}
  .nguoi{padding:2px}
  .nguoi > div:last-child{display:none}
  .vb-ap-dung{font-size:12px;padding:6px 10px}
  .vb-ap-dung .nguon{display:none}
}

/* ===== V1103: phóng to tối đa, vùng làm việc rộng, cột tự tối ưu, sắp xếp cột ===== */
.khoi-bang{position:relative;min-width:0}
.cong-cu.noi{justify-content:flex-end;margin:-4px 0 4px;gap:2px;opacity:.55;transition:opacity .15s}
.khoi-bang:hover .cong-cu.noi,.khoi-bang:focus-within .cong-cu.noi,.toan-man > .cong-cu.noi{opacity:1}
.cong-cu.noi .nut{min-height:24px;padding:1px 8px;font-size:12px}
.nut-phong-to{font-size:15px;line-height:1}
.bang th.sx{cursor:pointer;user-select:none}
.bang th.sx:hover{color:var(--do)}
.bang th.tang:after{content:" ▲";font-size:9px} .bang th.giam:after{content:" ▼";font-size:9px}
table.bang td.cot-gon,table.bang th.cot-gon{white-space:nowrap}
table.bang td.cot-dai{white-space:normal;overflow-wrap:anywhere}
.toan-man{position:fixed!important;inset:0!important;z-index:85!important;margin:0!important;border-radius:0!important;overflow:auto!important;max-width:none!important;width:auto!important;max-height:none!important;height:100vh!important;background:var(--tam);padding:14px!important}
.khoi-bang.toan-man .bang-boc{max-height:calc(100vh - 80px)}
.man:has(.hop.toan-man){padding:0}
.hop.toan-man .than{max-height:none;flex:1}
body.dang-phong-to{overflow:hidden}
body.vung-rong .khung{grid-template-columns:1fr}
body.vung-rong .menu{display:none}
body.vung-rong .noi-dung{padding:12px 16px 50px}
body.vung-rong .vb-ap-dung{display:none}
.dau .nut-chuong{position:relative}
.dau .nut-chuong.co-nhac{border-color:var(--do);color:var(--do)}
.so-nhac:not(:empty){position:absolute;top:-6px;right:-6px;background:var(--do);color:#fff;border-radius:999px;font-size:11px;min-width:18px;height:18px;display:grid;place-items:center;padding:0 4px}
.gn.nhanh{box-shadow:0 12px 34px rgba(0,0,0,.22)}
.qr-khung{background:#fff;padding:10px;border-radius:12px;max-width:260px;margin:auto}
.qr-khung svg{width:100%;height:auto;display:block}

/* ===== Nhắc của tôi ===== */
.ds-nhac{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ds-nhac li{padding:9px 12px;border:1px solid var(--vien);border-left:4px solid var(--vang);border-radius:10px;cursor:pointer;background:var(--tam)}
.ds-nhac li:hover{background:var(--do-nhat)}
.ds-nhac li.muc-qua_han{border-left-color:#C62828} .ds-nhac li.muc-lenh{border-left-color:var(--lam)}
h3.nhom-nhac{font-size:13px;margin:12px 0 6px;text-transform:uppercase;letter-spacing:.04em}
h3.nhom-nhac.do{color:#C62828} h3.nhom-nhac.vang{color:var(--vang)} h3.nhom-nhac.lam{color:var(--lam)}

/* ===== Đọc giấy tờ tự điền ===== */
.doc-giay-to{border:2px dashed var(--vien);border-radius:12px;padding:10px 12px;margin-bottom:12px;background:var(--nen);cursor:pointer}
.doc-giay-to.keo{border-color:var(--do);background:var(--do-nhat)}
.doc-dong{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.doc-dong .bt{font-size:24px} .doc-dong .gian{flex:1}
.doc-dong .chon-ai{min-height:30px;border:1px solid var(--vien);border-radius:8px;padding:2px 6px;background:var(--tam);max-width:200px}
.doc-dong .o-chon{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:700}
.doc-kq:not(:empty){margin-top:8px;cursor:default}
.doc-kq details{margin-top:6px}
.ai-de-xuat{background:#FFF6D6!important;border-color:#E3B341!important}
:root[data-nen="toi"] .ai-de-xuat{background:#3A3112!important}
.ai-de-xuat.tin-cay-thap{border-color:#D2600A!important;border-width:2px!important}
.nhom-form{font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;color:var(--do);border-bottom:1px solid var(--vien);padding-top:6px}
.o-tep{display:block;margin-bottom:12px;font-weight:700;font-size:13px}

/* ===== LÝ LỊCH XE (CV) ===== */
.cv{display:grid;gap:14px}
.cv-in-dau{display:none}
.cv-dau{display:grid;grid-template-columns:200px 1fr 180px;gap:18px;align-items:start}
.cv-anh{display:grid;gap:8px;justify-items:center}
.cv-anh img{width:200px;height:150px;object-fit:cover;border-radius:12px;border:1px solid var(--vien)}
.cv-anh-trong{width:200px;height:150px;border-radius:12px;border:2px dashed var(--vien);display:grid;place-items:center;font-size:54px;color:var(--muc-3)}
.cv-anh-trong small{font-size:12px;margin-top:-30px}
.cv-loai{font-size:11px;font-weight:900;letter-spacing:.08em;color:var(--muc-3);text-transform:uppercase}
.cv-ten h1{font-size:32px;font-weight:900;letter-spacing:.02em;margin:2px 0}
.cv-phu{font-size:16px;font-weight:700;color:var(--muc-2)}
.cv-nhan{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.cv-nhanh{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 14px;margin-top:6px}
.cv-nhanh > div{display:flex;flex-direction:column;border-left:3px solid var(--do-nhat);padding-left:8px;min-width:0}
.cv-nhanh span{font-size:11px;color:var(--muc-3);font-weight:700;text-transform:uppercase}
.cv-nhanh b{font-size:14px;overflow-wrap:anywhere} .cv-nhanh small{display:block;font-weight:600;color:var(--muc-3)}
.cv-phai{display:grid;justify-items:center;gap:6px;text-align:center}
.diem-tron{width:96px;height:96px;border-radius:50%;display:grid;place-items:center;align-content:center;border:7px solid var(--vien);background:var(--tam)}
.diem-tron b{font-size:30px;line-height:1} .diem-tron small{font-size:11px;color:var(--muc-3)}
.diem-tron.xanh{border-color:var(--xanh)} .diem-tron.vang{border-color:var(--vang)} .diem-tron.do{border-color:#C62828}
.cv-de-xuat{font-weight:800;font-size:13px}
.cv-qr{width:110px;background:#fff;padding:4px;border-radius:8px} .cv-qr svg{width:100%;height:auto;display:block}
.cv-ma-ks{font-size:10px;color:var(--muc-3);word-break:break-all}
.thao-tac-the{padding:10px 12px}
.thanh-thao-tac{display:flex;flex-wrap:wrap;gap:6px}
.cv-thieu{border-left:5px solid var(--vang)} .cv-thieu ul{margin:0;padding-left:20px} .cv-thieu a{font-weight:700}
.cv-muc-luc{position:sticky;top:58px;z-index:5;display:flex;gap:4px;overflow-x:auto;padding:6px;background:var(--nen);border-radius:12px;scrollbar-width:thin}
.cv-muc-luc a{white-space:nowrap;text-decoration:none;font-size:12px;font-weight:800;color:var(--muc-2);border:1px solid var(--vien);border-radius:999px;padding:4px 10px;background:var(--tam)}
.cv-muc-luc a:hover{color:var(--do);border-color:var(--do)}
.cv-muc{scroll-margin-top:110px}
.cv-muc > h2{flex-wrap:wrap}
.so-muc{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--do);color:#fff;font-size:13px}
.cv-tieu{font-size:13px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;color:var(--muc-2);margin:16px 0 8px}
.thanh-tien-do{height:6px;border-radius:999px;background:var(--xam-nhat);overflow:hidden;margin-bottom:10px}
.thanh-tien-do span{display:block;height:100%;background:var(--xanh)}
.luoi-ts{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px}
.o-ts{border:1px solid var(--vien);border-radius:8px;padding:6px 8px;display:flex;flex-direction:column;min-width:0}
.o-ts span{font-size:11px;color:var(--muc-3)} .o-ts b{font-size:13px;overflow-wrap:anywhere}
.o-ts.xac-nhan{border-color:var(--xanh)} .o-ts.xac-nhan span:after{content:" ✓";color:var(--xanh)}
.so-lon{border:1px solid var(--vien);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;background:var(--tam)}
.so-lon b{font-size:24px;font-weight:900;line-height:1.1} .so-lon span{font-size:12px;color:var(--muc-2);font-weight:700}
.so-lon.nho b{font-size:17px} .so-lon.vang b{color:var(--vang)} .so-lon.do b{color:#C62828}
.the-con{border:1px solid var(--vien);border-radius:12px;padding:10px 12px;margin-bottom:10px;display:grid;gap:6px}
.the-con-dau{display:flex;flex-wrap:wrap;gap:6px;align-items:center} .the-con-dau .gian{flex:1}
.so-do-lop{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.o-lop{border:2px solid var(--xanh);border-radius:14px;padding:8px 10px;display:grid;gap:2px}
.o-lop.vang{border-color:var(--vang)} .o-lop.do{border-color:#C62828}
.o-lop small{color:var(--muc-3)}
.nhom-tl{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px}
.dong-tg li.tg-phap_ly:before{background:var(--lam)} .dong-tg li.tg-bao_tri:before{background:var(--xanh)} .dong-tg li.tg-sua_chua:before{background:var(--vang)}
.dong-tg li.tg-an_toan:before{background:#C62828} .dong-tg li.tg-lop:before{background:var(--xam)}
.nut-dong{display:flex;flex-wrap:wrap;gap:4px}
.thanh-diem{display:inline-flex;align-items:center;gap:6px;min-width:110px}
.thanh-diem i{display:block;height:8px;border-radius:999px;background:var(--xanh);flex:0 0 auto;max-width:70px}
.thanh-diem i.vang{background:var(--vang)} .thanh-diem i.do{background:#C62828}
.gplx{display:grid;grid-template-columns:120px 1fr;gap:12px}
.gplx-anh{width:120px;height:80px;border-radius:10px;border:1px solid var(--vien);display:grid;place-items:center;font-size:40px;overflow:hidden}
.gplx-anh img{width:100%;height:100%;object-fit:cover}
.gplx-so{font-family:ui-monospace,Consolas,monospace;font-size:18px;font-weight:900;letter-spacing:.05em}
.gplx-hang{display:flex;gap:4px;margin:4px 0 8px}
.luoi-quet{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-top:12px}
.luoi-quet .nut{min-height:64px;font-size:16px}
.nhac-dau{border-left:5px solid var(--vang)}
@media (max-width:1100px){.cv-dau{grid-template-columns:160px 1fr}.cv-phai{grid-column:1/-1;grid-auto-flow:column;justify-content:start;align-items:center}.cv-anh img,.cv-anh-trong{width:160px;height:120px}}
@media (max-width:820px){
  .cv-dau{grid-template-columns:1fr}.cv-anh{justify-items:start}.cv-nhanh{grid-template-columns:1fr 1fr}.cv-ten h1{font-size:26px}
  .cv-muc-luc{top:58px}.gplx{grid-template-columns:1fr}.cong-cu.noi{opacity:1}
  .doc-dong .chon-ai{max-width:100%}
}
/* ===== In lý lịch xe khổ A4 (LƯU HÀNH NỘI BỘ, mã kiểm soát, QR xác minh) ===== */
@media print{
  @page{size:A4;margin:14mm 12mm}
  body{background:#fff;font-size:11pt}
  .vb-ap-dung,.thao-tac-the,.cv-muc-luc,.cong-cu,.duong-dan,.buoc-tiep,.cv-muc > h2 .nut,.cv-muc > h2 select,.nut,.thong-bao,.gn{display:none!important}
  .cv-in-dau{display:flex;justify-content:space-between;border-bottom:2px solid #000;padding-bottom:4px;font-size:9pt}
  .the{box-shadow:none;border:1px solid #999;break-inside:avoid-page}
  .cv-muc{break-inside:auto} .cv-muc > h2{break-after:avoid}
  .bang th{position:static}
  .lktm{border:0;color:#000}
  details{display:block} details > summary{display:none}
}
.cv-muc > h2 select{min-height:30px;border:1px solid var(--vien);border-radius:8px;padding:2px 8px;background:var(--tam);color:var(--muc);font-size:13px}
.den.khoi{display:block}
.cv > *{min-width:0}
.nhom-tl .nhan{white-space:normal}
@media (max-width:820px){table.the-dong td{flex-wrap:wrap;overflow-wrap:anywhere} table.the-dong td > *{min-width:0;max-width:100%}}
.nut-giao-dien{white-space:nowrap}
.cua{position:relative}
.cua-giao-dien{position:absolute;top:16px;right:16px}
@media (max-width:820px){.dau .nut-giao-dien{padding:4px 8px}}
/* ===== Giám sát xe – Bình Anh ===== */
.mo-ba{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.mo-ba-trai{flex:1 1 420px;min-width:0} .mo-ba-trai p{margin:4px 0}
.buoc-ba{margin:8px 0 0 18px;padding:0} .buoc-ba li{margin:3px 0}
.nut.to{font-size:18px;padding:14px 22px;border-radius:14px}
.luoi-bc{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;margin-top:14px}
.the.bc{display:flex;flex-direction:column;gap:4px;text-decoration:none;color:inherit;padding:12px 14px;transition:border-color .15s,transform .15s}
.the.bc:hover{border-color:var(--do);transform:translateY(-1px)} .the.bc b{color:var(--do)} .the.bc .nhan{align-self:flex-start}
.vung-tha{border:2px dashed var(--vien);border-radius:14px;padding:22px;text-align:center;display:flex;flex-direction:column;gap:4px;align-items:center;cursor:pointer;background:var(--tam)}
.vung-tha.dang,.vung-tha:hover,.vung-tha:focus{border-color:var(--do);outline:none} .vung-tha .to{font-size:30px;line-height:1}
.trich{max-width:620px;min-width:260px;white-space:normal;line-height:1.45;font-size:13.5px}
.nut-dong{display:flex;gap:4px;flex-wrap:wrap;min-width:150px}
.tieu-de-goc{white-space:pre-wrap;background:var(--tam);border-radius:10px;padding:8px 10px;font-size:12.5px;margin:6px 0;font-family:inherit}
.nhan-dinh{margin:6px 0 0 18px;padding:0} .nhan-dinh li{margin:6px 0;line-height:1.5}
.ai-tra-loi{white-space:pre-wrap;line-height:1.55;background:var(--tam);border-left:4px solid var(--lam);border-radius:10px;padding:12px 14px;margin-top:8px}
.loc-ky{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px;padding:10px 12px}
.loc-ky input,.loc-ky select{padding:6px 8px;border-radius:8px;border:1px solid var(--vien);background:var(--nen-o,inherit);color:inherit}
.nhan.cam{background:#FDEBDD;color:#9A4A06}
@media (max-width:640px){.trich{min-width:0;max-width:none}.nut.to{width:100%}}
.chon-ai{padding:7px 10px;border-radius:8px;border:1px solid var(--vien);background:var(--nen-the,var(--tam));color:inherit;font:inherit}
.chon-ai option{color:#111;background:#fff}
.so-lon b.chu-nho{font-size:16px}
.trich{max-width:520px}
.nut-dong{flex-direction:column;align-items:stretch;min-width:92px}
/* ===== Kiểm tra hồ sơ dữ liệu ===== */
.thanh-diem{position:relative;width:110px;height:20px;border-radius:10px;background:var(--vien);overflow:hidden}
.thanh-diem i{position:absolute;left:0;top:0;bottom:0;border-radius:10px} .thanh-diem i.tot{background:#2E9E52} .thanh-diem i.vua{background:#E0A800} .thanh-diem i.kem{background:#D2161E}
.thanh-diem b{position:relative;display:block;text-align:center;font-size:12px;line-height:20px;color:#fff;text-shadow:0 0 3px rgba(0,0,0,.6)}
.van-de{list-style:none;margin:0;padding:0;min-width:300px;max-width:560px} .van-de li{margin:0 0 6px;line-height:1.4;font-size:13.5px}
.van-de li .mo{font-size:12.5px;margin-left:4px}
@media (max-width:640px){.van-de{min-width:0}}
/* ===== Tự chọn giao diện chi tiết (bộ màu, màu tuỳ chỉnh, phông, cỡ chữ, độ thoáng, bo góc, độ rộng menu) ===== */
.menu{background:var(--menu,var(--tam));color:var(--menu-chu,var(--muc))}
.menu a{color:var(--menu-chu,var(--muc))} .menu a:hover{background:var(--menu-hover,var(--nen))}
.menu .chuong,.menu .chan-menu{color:var(--menu-phu,var(--muc-3))}
.nut,.o-tim,input,select,textarea{border-radius:calc(var(--r) * .8)}
.hop{border-radius:calc(var(--r) + 4px)} .so-lon,.kpi,.bang-boc,.den{border-radius:var(--r)}
:root[data-mat-do="gon"] .bang td,:root[data-mat-do="gon"] .bang th{padding:4px 8px} :root[data-mat-do="gon"] .the{padding:10px}
:root[data-mat-do="gon"] .luoi{gap:8px} :root[data-mat-do="gon"] .menu a{padding:5px 10px}
:root[data-mat-do="rong"] .bang td,:root[data-mat-do="rong"] .bang th{padding:13px 14px} :root[data-mat-do="rong"] .the{padding:22px}
:root[data-mat-do="rong"] .luoi{gap:22px} :root[data-mat-do="rong"] .menu a{padding:11px 12px} :root[data-mat-do="rong"] .nut{min-height:44px}
.tu-chon .tc-nhom{border-top:1px solid var(--vien);padding:12px 0 4px} .tu-chon .tc-nhom:first-child{border-top:0;padding-top:0}
.tu-chon h4{margin:0 0 8px;font-size:14px}
.chon-bo-mau{display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.chon-bo-mau button{font:inherit;border:2px solid var(--vien);border-radius:var(--r);padding:0;overflow:hidden;cursor:pointer;background:var(--tam);color:var(--muc);text-align:left}
.chon-bo-mau button.chon{border-color:var(--do);box-shadow:0 0 0 3px var(--do-nhat)}
.chon-bo-mau .mau-thu{height:34px;display:grid;grid-template-columns:1fr 2fr 1fr}
.chon-bo-mau span.ten{display:block;padding:5px 8px;font-size:12.5px;font-weight:700}
.tc-luoi{display:grid;gap:10px 16px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.tc-mau{display:flex;flex-direction:column;gap:4px;font-size:13px}
.o-mau-chon{display:flex;gap:8px;align-items:center} .o-mau-chon input[type=color]{width:44px;height:32px;padding:0;border:1px solid var(--vien);background:none;cursor:pointer}
.o-mau-chon code{font-size:12px;color:var(--muc-3)}
.tc-truot{display:flex;flex-direction:column;gap:4px;font-size:13px} .tc-truot input{width:100%;accent-color:var(--do)}
.tc-xem{border:1px dashed var(--vien);border-radius:var(--r);padding:12px;background:var(--nen)} .tc-xem .bang{background:var(--tam);margin-top:6px}
.ghi-nho{display:grid;grid-template-columns:20px 1fr;gap:8px;align-items:start;margin:12px 0;padding:10px 12px;border:1px solid var(--vien);border-radius:var(--r);font-size:14px;line-height:1.35;cursor:pointer}
.ghi-nho input{margin-top:3px;accent-color:var(--do)} .ghi-nho small{display:block;margin-top:2px;font-size:12.5px}

/* ---------- Tiếp nhận – kiểm kê – mở sổ (V1105) ---------- */
.ct6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:6px 0 12px}
.ct6-o{position:relative;display:flex;flex-direction:column;gap:2px;padding:12px 12px 10px;border:1px solid var(--vien);border-left:4px solid var(--xanh);border-radius:12px;background:var(--tam);min-width:0}
.ct6-o.thieu{border-left-color:var(--do);background:var(--do-nhat)}
.ct6-o .ct6-bt{position:absolute;right:10px;top:8px;font-size:18px;opacity:.55}
.ct6-o small{color:var(--muc-3);font-weight:700;font-size:12px;padding-right:22px}
.ct6-o b{font-size:18px;line-height:1.25;overflow-wrap:anywhere}
.ct6-o.thieu b{color:var(--do);font-size:15px;letter-spacing:.04em}
.ct6-o em{font-style:normal;font-size:12px;color:var(--muc-2)}
.ct6.gon .ct6-o b{font-size:15px}
@media (max-width:1300px){.ct6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.ct6{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ma-dc{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.ma-dc span{font-size:12px;padding:1px 7px;border:1px dashed var(--vien);border-radius:6px;background:var(--nen);white-space:nowrap}
.ma-dc small{color:var(--muc-3);font-weight:700}
.tn-cham{display:inline-flex;gap:3px;vertical-align:middle;margin-right:6px}
.tn-cham i{width:10px;height:10px;border-radius:3px;background:var(--vien)}
.tn-cham i.co{background:var(--xanh)}
.tn-dau{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.tn-dau h1{margin:2px 0;font-size:30px;letter-spacing:.02em}
.tn-ky{display:flex;gap:18px;flex-wrap:wrap}
.tn-ky>div{display:flex;flex-direction:column;min-width:180px;padding:8px 12px;border:1px solid var(--vien);border-radius:10px}
.tn-ky small{color:var(--muc-3)} .tn-ky em{font-size:12px;color:var(--muc-2)}
dl.hai-cot{display:grid;grid-template-columns:minmax(200px,38%) 1fr;gap:4px 14px}
dl.hai-cot dt{color:var(--muc-2)} dl.hai-cot dd{margin:0;font-weight:700}
dl.hai-cot dd.thieu{color:var(--do)}
.bb{color:var(--do)}
.kt-bang select,.kt-bang input{width:100%;min-height:32px;border:1px solid var(--vien);border-radius:8px;padding:3px 6px;background:var(--tam);color:var(--muc)}
.kt-bang tr.kt-do td{background:var(--do-nhat)} .kt-bang tr.kt-vang td{background:var(--vang-nhat)}
.tn-ap{margin-left:auto;font-size:13px;font-weight:600}
.cot-km{display:flex;align-items:flex-end;gap:6px;height:150px;padding:8px 0;border-bottom:1px solid var(--vien)}
.cot-km>div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0}
.cot-km i{display:block;width:70%;background:color-mix(in srgb,var(--do) 70%,transparent);border-radius:4px 4px 0 0}
.cot-km small{font-size:11px;color:var(--muc-3)} .cot-km b{font-size:11px}
.chi-in{display:none}
@media print{.chi-in{display:grid}.tn-chu-ky{grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px;text-align:center}.tn-chu-ky>div{display:flex;flex-direction:column;min-height:110px}
  .ct6{grid-template-columns:repeat(3,1fr)}.tn-phieu .thao-tac-the{display:none}.kt-bang select,.kt-bang input{border:0;appearance:none}}