/* ============================================================
   WEB.CSS PHẦN 2 — khối dựng ở Đợt 2 trở đi
   ------------------------------------------------------------
   Tách khỏi web.css vì trần 350 dòng, không vì lý do nào khác. Ranh giới
   là THỜI ĐIỂM DỰNG, không phải chủ đề: web.css giữ thư viện của Đợt A–C,
   tệp này nhận phần thêm về sau. Nạp SAU web.css.
   ============================================================ */
/* ---------- Khối LỘ TRÌNH trong sidebar (NAV.loTrinhHtml) ----------
   .nav-c chung chặn ở max-height:1400px — đủ cho một nhóm 6 mục, KHÔNG đủ
   cho 55 mục: quá ngưỡng là danh sách bị cắt ngang, im lặng, không cuộn. */
.nav-lt.open{max-height:3600px}
.lt-tong{margin-left:auto;font-variant-numeric:tabular-nums;font-size:10px;opacity:.55}
.lt-dot{margin:12px 10px 2px;padding-top:9px;border-top:1px solid var(--sidebar-line);
        display:flex;align-items:baseline;gap:7px;font-size:11px;font-weight:700;color:rgba(255,255,255,.8)}
.lt-dem{margin-left:auto;font-variant-numeric:tabular-nums;font-size:9.5px;font-weight:400;opacity:.5}
.lt-mota{margin:0 10px 5px;font-size:10px;line-height:1.45;color:rgba(255,255,255,.42)}
/* Màn 🚧 — hai đoạn văn, đoạn dưới là "hôm nay có gì" */
.lt-mo{margin-top:7px;max-width:600px;margin-left:auto;margin-right:auto;line-height:1.55}
.lt-nay{margin-top:9px;padding-top:9px;border-top:1px solid var(--border);font-size:12.5px;color:var(--text2)}

/* ---------- Cây vị trí (b1-cay) ----------
   Thụt lề theo CẤP chứ không lồng thẻ: lồng 5 cấp thì mỗi cấp ăn thêm
   padding của cha và cấp sâu nhất bị đẩy ra khỏi thẻ. */
.cay { font-size: 12.5px }
.cay-n { display:flex; align-items:center; gap:8px; padding:5px 8px; border-radius:var(--r-sm) }
.cay-n[data-mo-cay] { cursor:pointer }
.cay-n:hover { background:var(--surface-soft) }
.cay-n.cap1 { padding-left:24px } .cay-n.cap2 { padding-left:44px }
.cay-n.cap3 { padding-left:64px } .cay-n.cap4 { padding-left:84px }
.cay-ar { color:var(--muted); font-size:10px; transition:.15s; flex:none }
.cay-n.mo .cay-ar { transform:rotate(90deg) }
.cay-t { font-weight:600 }
.cay-l { color:var(--muted); font-size:11px }
.cay-d { margin-left:auto; font-variant-numeric:tabular-nums; font-size:11px; color:var(--accent-ink) }
.cay-c { display:none } .cay-c.open { display:block }

/* ---------- Lưới tầng PCCC (b4-sd) ---------- */
.sd-luoi { display:flex; flex-wrap:wrap; gap:5px }
.sd-o { width:62px; height:46px; border:1px solid var(--border2); border-radius:var(--r-sm);
        display:flex; flex-direction:column; align-items:center; justify-content:center;
        cursor:pointer; background:var(--surface-soft); transition:.12s }
.sd-o:hover { border-color:var(--accent); background:var(--accent-soft) }
.sd-o.xau { background:var(--danger-soft); border-color:var(--danger) }
.sd-t { font-variant-numeric:tabular-nums; font-size:10.5px; font-weight:700 }
.sd-n { font-size:11px; color:var(--muted) }
.sd-o.xau .sd-n { color:var(--danger-ink); font-weight:700 }

/* ---------- Biểu đồ cột (a4, b14) ----------
   Dựng bằng div, không thư viện: 13 cột thì thư viện đồ hoạ nặng hơn dữ liệu. */
.bi-cot { display:flex; align-items:flex-end; gap:6px; height:170px; padding-top:6px }
.bi-k { flex:1; display:flex; flex-direction:column; align-items:center; height:100%;
        min-width:0; cursor:default }
.bi-c { flex:1; width:100%; display:flex; align-items:flex-end; justify-content:center;
        gap:2px; min-height:0 }
.bi-dt, .bi-cp { width:42%; border-radius:2px 2px 0 0; min-height:2px }
.bi-dt { background:var(--accent) } .bi-cp { background:var(--border2) }
.bi-l { font-size:9.5px; color:var(--muted); margin-top:5px; white-space:nowrap;
        transform:rotate(-45deg); transform-origin:center; height:16px }
.bi-l.am { color:var(--danger-ink); font-weight:700 }

/* ---------- Lưới căn hộ (b7-sd) ---------- */
.mb-o { width:74px; height:44px; border:1px solid var(--border2); border-radius:var(--r-sm);
        display:flex; flex-direction:column; align-items:center; justify-content:center;
        cursor:pointer; transition:.12s }
.mb-o:hover { border-color:var(--accent) }
.mb-m { font-variant-numeric:tabular-nums; font-size:11px; font-weight:700 }
.mb-d { font-size:9.5px; color:var(--muted) }
.mb-occupied { background:var(--green-soft) } .mb-rented { background:var(--accent-soft) }
.mb-vacant { background:var(--surface-soft) }
.mb-cn { display:inline-block; width:11px; height:11px; border-radius:3px;
         border:1px solid var(--border2); vertical-align:-1px; margin-right:3px }

/* ---------- Câu hỏi trong ngăn kéo trợ lý (Ctrl+K) ---------- */
.ai-q { padding:9px 11px; margin-bottom:6px; border:1px solid var(--border2);
        border-radius:var(--r-sm); background:var(--surface); cursor:pointer;
        font-size:12.5px; line-height:1.45; transition:.12s }
.ai-q:hover { border-color:var(--accent); background:var(--accent-soft) }

/* ═══════════ BỘ CHUYỂN VỎ — một địa chỉ mở được cả ba bản ═══════════ *
   Trên Web: nằm ngay dưới thương hiệu, TRÊN bộ chọn ngữ cảnh — đúng thứ
   tự thu hẹp dần: đang ở bản nào ▸ toà nào ▸ màn nào.
   Trên hai app: khung máy chiếm giữa sân khấu nên thanh này nổi ở góc,
   NGOÀI viền máy — nó là điều khiển của người trình bày, không phải của
   app; đặt trong viền là nói dối khách rằng app có nút đó. */
.vo-bar { display:flex; gap:4px; padding:9px 10px; border-bottom:1px solid var(--sidebar-line) }
.vo-o { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:7px 3px 6px; border-radius:var(--r-sm); text-decoration:none; cursor:pointer;
  font-size:9.5px; font-weight:600; line-height:1.25; text-align:center;
  color:rgba(255,255,255,.62); background:rgba(255,255,255,.05); transition:.13s }
.vo-o i { font-style:normal; font-size:15px; line-height:1 }
.vo-o:hover { background:rgba(255,255,255,.14); color:#fff }
.vo-o.on { background:linear-gradient(135deg,var(--accent),#3fa0e8); color:#fff; cursor:default;
  box-shadow:0 2px 8px rgba(31,116,196,.4) }
html[data-shell="ops"] .vo-bar, html[data-shell="res"] .vo-bar {
  position:fixed; top:14px; left:16px; z-index:60; width:272px; padding:7px 8px;
  border:0; border-radius:13px; background:rgba(14,44,71,.93); box-shadow:var(--sh-lg) }
@media print { .vo-bar { display:none !important } }
