/* ===========================================================
   Giúp Việc Gia Hoàng — ERP · Bộ giao diện thương hiệu (Tabler)
   Màu: xanh #006600 / #004400 · cam #F58220 · bo góc 16px
   =========================================================== */
/* Font tiếng Việt TỰ HOST (không phụ thuộc Google Fonts) — hiển thị đúng dấu chữ hoa Ề/Ễ/Ồ/Ỗ/Ắ */
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/bvp/BeVietnamPro-Regular.woff2') format('woff2')}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/bvp/BeVietnamPro-Medium.woff2') format('woff2')}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/bvp/BeVietnamPro-SemiBold.woff2') format('woff2')}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/bvp/BeVietnamPro-Bold.woff2') format('woff2')}
@font-face{font-family:'Be Vietnam Pro';font-style:normal;font-weight:800;font-display:swap;src:url('/fonts/bvp/BeVietnamPro-ExtraBold.woff2') format('woff2')}
:root{
  --gh-green:#006600; --gh-green-dark:#004400; --gh-green-soft:#e6f0e6;
  --gh-orange:#F58220; --gh-orange-soft:#fdeede;
  /* === DESIGN TOKENS (nguồn chân lý — không gõ hex trong view) === */
  /* Bảng màu CHUẨN: xanh lá là màu thương hiệu; các màu còn lại dùng bản ĐẬM để chữ luôn rõ. */
  --gh-orange-dark:#c25e00;                      /* cam đậm — dùng cho CHỮ/số trên nền sáng */
  --gh-red:#c92a2a;    --gh-red-soft:#fdecec;    /* đỏ đậm */
  --gh-blue:#1d4ed8;   --gh-blue-soft:#e8f0fe;   /* xanh dương đậm */
  --gh-pink:#c2185b;   --gh-pink-soft:#fde7f0;   /* hồng đậm */
  --gh-yellow:#8a6d00; --gh-yellow-soft:#fff7e6; /* vàng đậm (chữ) */
  --gh-teal:#0b7285;   --gh-purple-soft:#f4e9fb;
  --gh-ink:#111827;    --gh-ink-2:#334155;       /* đen/xám đậm cho chữ */
  --gh-info:#2f6feb; --gh-success:#16a34a; --gh-warn:#ca8a04; --gh-danger:#d63939; --gh-purple:#7048e8; --gh-muted:#6b7280;
  --gh-line:#e6e9ee; --gh-bg-soft:#f6f8f6; --gh-radius:16px; --gh-radius-sm:10px; --gh-shadow:0 2px 10px rgba(0,40,0,.05); --gh-shadow-hover:0 8px 22px rgba(0,40,0,.1);
  --tblr-primary:#006600; --tblr-primary-rgb:0,102,0; --tblr-primary-fg:#fff;
  --tblr-font-sans-serif:'Be Vietnam Pro',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --tblr-border-radius:12px; --tblr-border-radius-lg:16px; --tblr-body-bg:#F8F9FA;
}
body{font-family:var(--tblr-font-sans-serif);-webkit-font-smoothing:antialiased;letter-spacing:-.01em;}

/* Sidebar */
.navbar-vertical.navbar{background:#fff;border-right:1px solid var(--tblr-border-color);box-shadow:0 1px 2px rgba(0,0,0,.03);}
[data-bs-theme="dark"] .navbar-vertical.navbar{background:#1a2234;}
.gh-brand{display:flex;align-items:center;gap:.7rem;padding:.4rem 0;}
.gh-logo{width:46px;height:46px;border-radius:14px;flex:0 0 46px;background:linear-gradient(140deg,#0a8a0a,var(--gh-green) 55%,var(--gh-green-dark));display:grid;place-items:center;box-shadow:0 6px 16px rgba(0,102,0,.30),inset 0 1px 0 rgba(255,255,255,.28);border:1px solid rgba(255,255,255,.14);}
.gh-logo svg{width:26px;height:26px;}
.gh-brand-text strong{font-weight:800;font-size:1.02rem;line-height:1.05;color:var(--gh-green);letter-spacing:-.02em;}
[data-bs-theme="dark"] .gh-brand-text strong{color:#fff;}
.gh-brand-text span{font-size:.68rem;color:var(--tblr-secondary);letter-spacing:.06em;text-transform:uppercase;}
.navbar-vertical .nav-link{border-radius:10px;margin:1px .25rem;font-weight:500;font-size:.875rem;color:var(--tblr-body-color);transition:all .15s;}
.navbar-vertical .nav-link .nav-link-icon{opacity:.85;}
.navbar-vertical .nav-link:hover{background:var(--gh-green-soft);color:var(--gh-green);}
[data-bs-theme="dark"] .navbar-vertical .nav-link:hover{background:rgba(255,255,255,.06);color:#fff;}
.navbar-vertical .nav-item.active>.nav-link{background:var(--gh-green);color:#fff;}
.navbar-vertical .nav-link::after{display:none !important;content:none !important;border:0 !important;}
.navbar,.navbar-vertical,.navbar-nav{--tblr-navbar-active-border-color:transparent !important;}
.navbar-vertical .nav-item::after,.navbar-vertical .nav-item.active::after,.navbar-vertical .nav-link.active::after{display:none !important;content:none !important;border:0 !important;background:none !important;}
.navbar-vertical .nav-item.active>.nav-link .nav-link-icon{opacity:1;}
.nav-section-label{font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--tblr-secondary);padding:.9rem .9rem .35rem;opacity:.7;}
.nav-sub{list-style:none;margin:.1rem 0 .2rem 0;padding-left:2.1rem;}
.nav-sub .nav-link{font-size:.83rem;padding:.4rem .7rem;color:var(--tblr-secondary);position:relative;}
.nav-sub .nav-link:before{content:"";position:absolute;left:-.55rem;top:50%;transform:translateY(-50%);width:5px;height:5px;border-radius:50%;background:var(--tblr-border-color);}
.nav-sub .nav-link.active{background:var(--gh-green-soft);color:var(--gh-green);font-weight:600;}
.nav-sub .nav-link.active:before{background:var(--gh-green);}
.nav-parent>.nav-link .chev{margin-left:auto;transition:.2s;}
.nav-parent.open>.nav-link .chev{transform:rotate(90deg);}

/* Header */
.app-header{background:#fff;border-bottom:1px solid var(--tblr-border-color);}
[data-bs-theme="dark"] .app-header{background:#1a2234;}
.mega-search{position:relative;min-width:320px;}
.mega-search .form-control{border-radius:12px;background:var(--tblr-body-bg);border-color:transparent;padding-left:2.4rem;height:42px;}
.mega-search .form-control:focus{background:#fff;border-color:var(--gh-green);box-shadow:0 0 0 3px rgba(0,102,0,.1);}
[data-bs-theme="dark"] .mega-search .form-control:focus{background:#0f1626;}
.mega-search .search-ico{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);color:var(--tblr-secondary);font-size:1.05rem;}
.mega-search kbd{position:absolute;right:.6rem;top:50%;transform:translateY(-50%);font-size:.68rem;}
.header-icon-btn{width:42px;height:42px;border-radius:12px;border:1px solid var(--tblr-border-color);background:transparent;display:grid;place-items:center;color:var(--tblr-body-color);position:relative;transition:.15s;}
/* Tên module hiện ở Header — canh trái */
.gh-module-title{font-weight:700;color:var(--gh-green);font-size:1.02rem;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw;}
[data-bs-theme="dark"] .gh-module-title{color:#fff;}
@media(min-width:768px){ .gh-module-title{font-size:1.14rem;max-width:32vw;} }
.header-icon-btn:hover{background:var(--gh-green-soft);color:var(--gh-green);border-color:transparent;}
[data-bs-theme="dark"] .header-icon-btn:hover{background:rgba(255,255,255,.06);color:#fff;}
.header-icon-btn .badge-dot{position:absolute;top:8px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--gh-orange);border:2px solid #fff;}
[data-bs-theme="dark"] .header-icon-btn .badge-dot{border-color:#1a2234;}

/* Cards & components */
.card{border-radius:16px;border:1px solid var(--tblr-border-color);box-shadow:0 1px 3px rgba(15,23,42,.04);}
.card-hover{transition:transform .2s,box-shadow .2s;}
.card-hover:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(15,23,42,.1);}
.page-title-lg{font-weight:800;letter-spacing:-.02em;}
.quick-pill{border-radius:12px;font-weight:600;font-size:.8rem;}
.btn-orange{background:var(--gh-orange);border-color:var(--gh-orange);color:#fff;}
.btn-orange:hover{background:#e0741a;border-color:#e0741a;color:#fff;}
.avatar-ring{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--gh-green-soft);}
.stat-ico{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;font-size:1.5rem;}
.ico-green{background:var(--gh-green-soft);color:var(--gh-green);}
.ico-orange{background:var(--gh-orange-soft);color:var(--gh-orange);}
.ico-blue{background:#e7f0fb;color:#206bc4;}
.ico-purple{background:#f0ebfa;color:#7048e8;}
.ico-teal{background:#e3f5f3;color:#0ca678;}
.ico-pink{background:#fce9f1;color:#d6336c;}
.ico-red{background:#fbe9e9;color:#d63939;}
.stat-value{font-size:1.6rem;font-weight:800;letter-spacing:-.02em;line-height:1.1;}

.type-tabs{display:flex;gap:.5rem;flex-wrap:wrap;}
.type-tab{border:1px solid var(--tblr-border-color);background:#fff;border-radius:12px;padding:.5rem .9rem;font-size:.83rem;font-weight:600;color:var(--tblr-body-color);cursor:pointer;display:flex;align-items:center;gap:.45rem;transition:.15s;text-decoration:none;}
.type-tab:hover{border-color:var(--gh-green);color:var(--gh-green);}
.type-tab.active{background:var(--gh-green);border-color:var(--gh-green);color:#fff;}
[data-bs-theme="dark"] .type-tab{background:#1a2234;}

.table thead th{font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;color:var(--tblr-secondary);font-weight:600;}
.req-code{font-weight:700;color:var(--gh-green);font-size:.82rem;}
[data-bs-theme="dark"] .req-code{color:#7bd49b;}

.offcanvas{border-radius:18px 0 0 18px;}
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-thumb{background:#cfd6e0;border-radius:8px;}
[data-bs-theme="dark"] ::-webkit-scrollbar-thumb{background:#33415c;}

/* Approval flow */
.flow{display:flex;align-items:flex-start;}
.flow-step{flex:1;text-align:center;position:relative;}
.flow-step:not(:last-child):after{content:"";position:absolute;top:15px;left:50%;width:100%;height:2px;background:var(--tblr-border-color);z-index:0;}
.flow-step.done:not(:last-child):after{background:var(--gh-green);}
.flow-dot{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;margin:0 auto .4rem;position:relative;z-index:1;background:#fff;border:2px solid var(--tblr-border-color);color:var(--tblr-secondary);}
.flow-step.done .flow-dot{background:var(--gh-green);border-color:var(--gh-green);color:#fff;}
.flow-step.current .flow-dot{background:var(--gh-orange);border-color:var(--gh-orange);color:#fff;}
.flow-step.reject .flow-dot{background:#d63939;border-color:#d63939;color:#fff;}
.flow-label{font-size:.72rem;font-weight:600;}

/* Suggestion (kiến nghị) cards */
.kn-card{border-radius:16px;border:1px solid var(--tblr-border-color);background:#fff;height:100%;transition:.18s;}
.kn-card:hover{box-shadow:0 12px 30px rgba(15,23,42,.1);transform:translateY(-2px);}
[data-bs-theme="dark"] .kn-card{background:#1a2234;}
.vote-btn{display:flex;flex-direction:column;align-items:center;min-width:52px;border:1px solid var(--tblr-border-color);border-radius:12px;padding:.35rem;cursor:pointer;background:var(--tblr-body-bg);transition:.15s;line-height:1;}
.vote-btn:hover{border-color:var(--gh-green);background:var(--gh-green-soft);color:var(--gh-green);}
.kn-reply{margin-top:.9rem;padding:.7rem .85rem;border-radius:12px;background:var(--gh-green-soft);border-left:3px solid var(--gh-green);font-size:.82rem;}
[data-bs-theme="dark"] .kn-reply{background:rgba(0,102,0,.18);}

/* Permission matrix + settings */
.set-nav{list-style:none;margin:0;padding:.5rem;}
.set-nav a{display:flex;align-items:center;gap:.6rem;padding:.6rem .8rem;border-radius:12px;font-size:.88rem;font-weight:500;color:var(--tblr-body-color);text-decoration:none;transition:.15s;margin-bottom:2px;}
.set-nav a:hover{background:var(--gh-green-soft);color:var(--gh-green);}
.set-nav a.active{background:var(--gh-green);color:#fff;box-shadow:0 4px 12px rgba(0,102,0,.2);}
.set-nav a .lock{margin-left:auto;opacity:.7;}
.set-nav .group-lbl{font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--tblr-secondary);padding:.8rem .8rem .3rem;}
.perm-table th,.perm-table td{padding:.7rem .8rem;border-bottom:1px solid var(--tblr-border-color);font-size:.85rem;text-align:center;}
.perm-table th:first-child,.perm-table td:first-child{text-align:left;font-weight:600;}
.form-check-input:checked{background-color:var(--gh-green);border-color:var(--gh-green);}

/* ============================================================
   v1.15 — Tối ưu tương phản, dark/light, ô nhập, mobile
   ============================================================ */

/* (1) Tương phản: chữ TRẮNG trên mọi nền xanh đậm */
.list-group-item.active,
.list-group-item-action.active{ background:var(--gh-green) !important; border-color:var(--gh-green) !important; }
.list-group-item.active, .list-group-item.active *{ color:#fff !important; }
.list-group-item.active .text-secondary,
.list-group-item.active small{ color:rgba(255,255,255,.82) !important; }
.bg-green, .bg-gh-green{ color:#fff !important; }
.btn-gh-green,.btn-gh-dark,.btn-gh-red,.btn-gh-orange,.btn-orange{ color:#fff !important; }
.set-nav a.active,.set-nav a.active *{ color:#fff !important; }
.type-tab.active,.type-tab.active *{ color:#fff !important; }
.navbar-vertical .nav-item.active>.nav-link,
.navbar-vertical .nav-item.active>.nav-link *{ color:#fff !important; }

/* (2) Dark/Light: nền & chữ theo chế độ cho mọi thành phần tuỳ biến */
[data-bs-theme="dark"]{ --tblr-body-bg:#0f1626; }
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .modal-content,
[data-bs-theme="dark"] .dropdown-menu,
[data-bs-theme="dark"] .offcanvas,
[data-bs-theme="dark"] .type-tab,
[data-bs-theme="dark"] .emp-card,
[data-bs-theme="dark"] .cs-icard{ background:#1a2234; color:#e6e9ef; }
[data-bs-theme="dark"] .modal-header,
[data-bs-theme="dark"] .modal-footer{ border-color:#2a3550; }
[data-bs-theme="dark"] .list-group-flush>.list-group-item{ background:transparent; color:#e6e9ef; }
[data-bs-theme="dark"] .table{ --tblr-table-bg:transparent; color:#e6e9ef; }
[data-bs-theme="dark"] .btn-white{ background:#222d44; color:#e6e9ef; border-color:#2a3550; }
[data-bs-theme="dark"] .dropdown-item{ color:#e6e9ef; }
[data-bs-theme="dark"] .dropdown-item:hover{ background:rgba(255,255,255,.06); }

/* (3) Ô nhập đồng bộ trên mọi giao diện + tương phản 2 chế độ */
.form-control,.form-select{ border-radius:10px; }
.form-control:focus,.form-select:focus{ border-color:var(--gh-green); box-shadow:0 0 0 3px rgba(0,102,0,.12); }
.form-label{ font-weight:600; font-size:.82rem; margin-bottom:.25rem; }
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select,
[data-bs-theme="dark"] textarea.form-control{ background:#0f1626; border-color:#33415c; color:#e6e9ef; }
[data-bs-theme="dark"] .form-control::placeholder{ color:#7a869a; }
[data-bs-theme="dark"] .input-group-text{ background:#222d44; border-color:#33415c; color:#cfd6e0; }

/* (4) Mobile: nút "Lưu" không bị che — footer dính đáy, chừa safe-area */
@media (max-width: 600px){
  .modal-dialog{ margin:.4rem; }
  .modal-dialog-scrollable .modal-content{ max-height:calc(100dvh - .8rem); }
  .modal-footer{ position:sticky; bottom:0; z-index:6;
    background:var(--tblr-bg-surface,#fff);
    padding-bottom:calc(.55rem + env(safe-area-inset-bottom,0px));
    box-shadow:0 -4px 14px rgba(0,0,0,.08); }
  [data-bs-theme="dark"] .modal-footer{ background:#1a2234; }
  .gh-2col{ column-count:1 !important; }
  .modal-footer .btn{ min-height:42px; }
}

/* ============================================================
   v1.17 — HỆ THỐNG CỠ CHỮ & KÍCH THƯỚC THỐNG NHẤT (PC ↔ Mobile)
   Dùng clamp() để mọi thứ co giãn mượt theo bề rộng màn hình.
   ============================================================ */
:root{
  /* thang cỡ chữ fluid: nhỏ gọn trên ĐT, thoải mái trên PC */
  --fs-page-title: clamp(1.18rem, 1.02rem + .9vw, 1.5rem);
  --fs-section:    clamp(1.0rem,  0.95rem + .4vw, 1.18rem);
  --fs-card-title: clamp(.92rem,  0.88rem + .25vw, 1.02rem);
  --fs-stat:       clamp(1.3rem,  1.05rem + 1.1vw, 1.7rem);
  --fs-body:       clamp(.86rem,  0.83rem + .18vw, .94rem);
  --fs-small:      clamp(.74rem,  0.72rem + .12vw, .82rem);
  --fs-label:      clamp(.78rem,  0.76rem + .1vw, .84rem);
  --grid-gap:      clamp(.55rem,  0.4rem + .8vw, 1rem);
}

/* Cỡ chữ gốc co giãn nhẹ: ĐT ~14px → PC 16px (mọi rem theo đó đồng bộ) */
html{ font-size: clamp(14px, 0.62rem + 1.05vw, 16px); }

/* Tiêu đề trang — gom mọi kiểu (kể cả style nội tuyến 1.5rem) về một cỡ */
.page-title-lg{ font-size: var(--fs-page-title) !important; line-height:1.2; font-weight:800; }
h1[style*="font-size:1.5rem"], h2[style*="font-size:1.5rem"]{ font-size: var(--fs-page-title) !important; line-height:1.2; }

/* Thẻ (card) đồng nhất */
.card{ border-radius:16px; }
.card-title{ font-size: var(--fs-card-title) !important; }
.stat-value{ font-size: var(--fs-stat) !important; }
.stat-ico{ width: clamp(42px,9vw,50px); height: clamp(42px,9vw,50px); font-size: clamp(1.2rem,3.2vw,1.5rem); border-radius:14px; }
.settings-ico{ width: clamp(52px,13vw,62px); height: clamp(52px,13vw,62px); font-size: clamp(1.5rem,4.2vw,1.8rem); }
.settings-title{ font-size: var(--fs-section) !important; }
.settings-desc{ font-size: var(--fs-small) !important; }

/* Lưới card — khoảng cách đồng nhất, không quá thưa trên ĐT */
.row-cards, .row.row-cards{ --tblr-gutter-x: var(--grid-gap); --tblr-gutter-y: var(--grid-gap); }

/* Ô nhập & nhãn đồng nhất */
.form-control, .form-select{ font-size: var(--fs-body); }
.form-label{ font-size: var(--fs-label) !important; font-weight:600; }
.btn{ font-size: var(--fs-body); }
.badge{ font-weight:600; }

/* Bảng gọn gàng, tiêu đề không xuống dòng */
.table{ font-size: var(--fs-body); }
.table thead th{ white-space:nowrap; }
.table td, .table th{ vertical-align:middle; }

/* ===== Tinh chỉnh riêng cho điện thoại ===== */
@media (max-width: 600px){
  .page-title-lg, h1[style*="font-size:1.5rem"], h2[style*="font-size:1.5rem"]{ font-size:1.22rem !important; }
  .stat-value{ font-size:1.4rem !important; }
  /* cho phép bảng rộng cuộn ngang thay vì vỡ khung */
  .card .table-responsive{ -webkit-overflow-scrolling:touch; }
  /* khối tiêu đề + nút gọn lại, không tràn */
  .page-title-lg + .text-secondary, .text-secondary{ overflow-wrap:anywhere; }
  .btn.quick-pill{ padding:.45rem .7rem; }
}

/* Màn lớn: giới hạn bề rộng nội dung cho dễ đọc, căn giữa */
@media (min-width: 1600px){
  .page-body > .container-xl, .page-body > .container-fluid{ max-width:1500px; margin-inline:auto; }
}

/* v1.18.2 — Khi đang mở hộp thoại: ẩn nút nổi để không che nút Lưu/Cập nhật */
body.modal-open #tcWidget,
body.modal-open #pwaInstallBtn{ display:none !important; }

/* v1.20 — Logo thương hiệu trong sidebar */
.gh-logo-img{height:48px;width:auto;max-width:100%;object-fit:contain;display:block;filter:drop-shadow(0 3px 8px rgba(0,40,0,.14))}
@media (max-width:991px){ .gh-logo-img{height:40px} }

/* ===== Header đồng bộ (v1.29) ===== */
h1[style*="font-size:1.4rem"], h2[style*="font-size:1.4rem"],
h1[style*="font-size:1.3rem"], h2[style*="font-size:1.3rem"]{ font-size: var(--fs-page-title) !important; line-height:1.2; font-weight:800; }
.page-title-lg{ color: var(--gh-green); }
.page-title-lg + .text-secondary{ font-size:.85rem; }
[data-bs-theme="dark"] .page-title-lg{ color:#5fd38a; }

/* ===== Thanh nhấn tiêu đề trang — màu thương hiệu (v1.30) ===== */
.page-title-lg{ position:relative; padding-left:.72rem; }
.page-title-lg::before{ content:""; position:absolute; left:0; top:.14em; bottom:.14em; width:4px; border-radius:3px;
    background:linear-gradient(180deg, var(--gh-green), #FF6600); }
/* Khối tiêu đề + nút thao tác: căn đều, cách dòng gọn */
.gh-pagehead{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem; margin-bottom:1.4rem; }
.gh-pagehead .text-secondary{ font-size:.85rem; }

/* Tiêu đề tất cả form (modal/offcanvas) màu xanh thương hiệu */
.modal-title, .offcanvas-title { color: var(--gh-green, #006600); }

/* ===================================================================
   BỘ CLASS DÙNG CHUNG (.gh-*) — thay dần emp-/ld-/kh-/nc-/cs- theo từng module
   =================================================================== */
.gh-sec-h{font-size:.82rem;font-weight:700;color:#5b6470;display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:0 0 .5rem}
.gh-cnt{background:var(--gh-green-soft);color:var(--gh-green);border-radius:20px;padding:0 8px;font-size:.7rem}
/* Lưới thẻ */
.gh-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:.7rem}
.gh-card{display:flex;flex-direction:column;gap:.5rem;background:#fff;border:1px solid var(--gh-line);border-radius:var(--gh-radius);padding:.75rem .8rem;box-shadow:var(--gh-shadow);transition:transform .15s,box-shadow .15s}
.gh-card:hover{transform:translateY(-2px);box-shadow:var(--gh-shadow-hover)}
.gh-card-top{display:flex;align-items:flex-start;gap:.55rem}
.gh-card-id{flex:1 1 auto;min-width:0}
.gh-card-nm{font-weight:600;font-size:.92rem;line-height:1.15}
.gh-card-sub{font-size:.7rem;color:#7a828c;margin-top:2px}
.gh-card-note{font-size:.78rem;color:#3b4754;background:var(--gh-bg-soft);border-radius:9px;padding:.35rem .5rem;line-height:1.3}
.gh-card-foot{display:flex;align-items:center;justify-content:space-between;gap:.4rem;border-top:1px dashed var(--gh-line);padding-top:.45rem;margin-top:auto}
/* Danh sách dòng gọn */
.gh-list{display:flex;flex-direction:column;gap:.5rem}
.gh-row{display:flex;align-items:center;gap:.65rem;background:#fff;border:1px solid var(--gh-line);border-radius:12px;padding:.55rem .7rem;box-shadow:0 1px 4px rgba(0,40,0,.04)}
.gh-row:hover{border-color:#bcd3bc}
.gh-row-main{flex:1 1 auto;min-width:0}
.gh-row-nm{font-weight:600;font-size:.9rem;line-height:1.2}
/* Avatar tròn nhỏ */
.gh-av{flex:0 0 auto;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,var(--gh-green-soft),#e3efe3);color:var(--gh-green);font-size:1.1rem}
.gh-av--round{border-radius:50%;width:34px;height:34px;font-size:1.05rem}
/* Cụm nhãn + thao tác */
.gh-badges{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;margin-top:3px;font-size:.74rem}
.gh-badges .badge{font-size:.66rem}
.gh-acts{flex:0 0 auto;display:flex;gap:.25rem;align-items:center}
@media(max-width:576px){.gh-row{flex-wrap:wrap}.gh-acts{width:100%;justify-content:flex-end}}

/* Hồ sơ ngoài quyền xem — danh sách gọn, viền cam nhẹ, làm mờ phần nhạy cảm */
.gh-masked{border-left:3px solid var(--gh-orange);background:#fffdf8}
.gh-blur{filter:blur(.5px);opacity:.93}  /* mờ nhẹ, vẫn đọc được — chỉ để gợi ý "ngoài quyền" */

/* Nút menu (hamburger) — đồng bộ hệ thống, chuẩn cảm ứng */
.navbar-toggler{width:44px;height:44px;padding:0;border-radius:12px;border:1px solid var(--tblr-border-color);background:transparent;display:grid;place-items:center;color:var(--gh-green);transition:.15s;box-shadow:none}
.navbar-toggler:focus{box-shadow:0 0 0 .2rem var(--gh-green-soft)}
.navbar-toggler:hover{background:var(--gh-green-soft);border-color:transparent}
.navbar-toggler .navbar-toggler-icon{width:22px;height:22px;-webkit-mask:none!important;mask:none!important;background-color:transparent!important;border-radius:0!important;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23006600' stroke-width='2.2' stroke-linecap='round'%3e%3cpath d='M4 7h16M4 12h16M4 17h16'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:center;background-size:contain}
.navbar-toggler .navbar-toggler-icon::before,.navbar-toggler .navbar-toggler-icon::after{content:none!important;display:none!important}

/* ====================================================================
   v2.25.14 — Menu mobile: trượt từ TRÁI, rộng theo nội dung,
   hamburger to hơn & không bị logo xanh đè
   ==================================================================== */
@media (max-width: 991.98px){
  .navbar-vertical > .container-fluid{ display:flex; align-items:center; flex-wrap:nowrap; gap:.5rem; }
  .navbar-vertical .navbar-toggler{ order:-1; flex:0 0 auto; width:48px; height:48px; z-index:3; }
  .navbar-vertical .navbar-toggler .navbar-toggler-icon{ width:26px; height:26px; }
  /* ẩn logo/brand xanh (giọt mực) trên di động — tránh đè lên hamburger; Header đã có tên module */
  .navbar-vertical .navbar-brand{ display:none !important; }
  /* panel menu: bó sát nội dung (chữ đến đâu nền đến đó), KHÔNG full màn hình */
  #sidebar-menu.offcanvas{ width:auto; min-width:0; max-width:86vw; }
  #sidebar-menu .navbar-nav{ width:auto; }
  #sidebar-menu .offcanvas-body{ overflow-y:auto; }
}
/* Desktop (>=992px): menu hiển thị tĩnh trong sidebar dọc như cũ */
@media (min-width: 992px){
  #sidebar-menu.offcanvas{ position:static; transform:none; visibility:visible; background:transparent;
                           box-shadow:none; width:auto; border:0; }
  #sidebar-menu.offcanvas .offcanvas-header{ display:none; }
  #sidebar-menu.offcanvas .offcanvas-body{ padding:0; overflow:visible; }
}

/* ====================================================================
   v2.25.17 — Menu dọc: căn TRÁI nội dung (icon+chữ) thay vì căn giữa,
   để thẳng hàng với nhãn nhóm (.nav-section-label)
   ==================================================================== */
.navbar-vertical .navbar-nav{ align-items: stretch; }
.navbar-vertical .nav-item{ width: 100%; }
.navbar-vertical .nav-item > .nav-link{
  width: 100%;
  justify-content: flex-start;   /* về sát trái thay vì giữa */
  text-align: left;
}

/* ===== v2.25.32 — Pop-up cao cấp dùng chung (Bình luận / Yêu cầu giao / Từ chối) ===== */
.gh-pop .modal-content{border:none;border-radius:20px;box-shadow:0 30px 80px rgba(0,30,0,.26);overflow:hidden}
.gh-pop .modal-header{border:0;padding:1.15rem 1.3rem .45rem;align-items:center;gap:.7rem}
.gh-pop .modal-title{display:flex;align-items:center;gap:.55rem;font-weight:700;font-size:1.04rem;margin:0;line-height:1.2}
.gh-pop-ic{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;font-size:1.25rem;flex:0 0 40px}
.gh-pop .modal-body{padding:.4rem 1.3rem 1.05rem}
.gh-pop .modal-footer{border:0;padding:.2rem 1.3rem 1.2rem;gap:.55rem}
.gh-pop .gh-pop-sub{font-size:.86rem;color:var(--gh-muted,#6b7280);line-height:1.55;margin-bottom:.75rem}
.gh-pop .form-control{border-radius:13px;border-color:var(--gh-line,#e6e9ee)}
.gh-pop .form-control:focus{border-color:var(--gh-green);box-shadow:0 0 0 3px rgba(0,102,0,.10)}
.gh-pop .btn{border-radius:12px;font-weight:600;padding:.5rem 1.05rem}
.gh-pop .modal-header .btn-close{margin:0 0 0 auto;padding:.4rem;opacity:.5}
.gh-pop .modal-header .btn-close:hover{opacity:.9}
[data-bs-theme="dark"] .gh-pop .modal-content{background:#161d29}

/* ===== v2.25.33 — Nút thao tác Lao động: màu nổi bật + icon to ===== */
/* ===== v2.25.40 — Đồng bộ màu nút Lao động theo Nhu cầu (palette thương hiệu) ===== */
.ld-c-view,.ld-c-edit,.ld-c-assign,.ld-c-status{color:#fff !important;border:none !important}
.ld-c-view{background:var(--gh-green) !important}        /* Xem — xanh lá thương hiệu (như Nhu cầu) */
.ld-c-edit{background:var(--gh-orange) !important}       /* Sửa — cam thương hiệu (như Nhu cầu) */
.ld-c-assign{background:var(--gh-green-dark) !important} /* Giao / Giới thiệu — xanh đậm */
.ld-c-status{background:var(--gh-danger) !important}     /* Trạng thái — đỏ cảnh báo */
.ld-c-cmt{background:#fff !important;color:var(--gh-muted,#6b7280) !important;border:1px solid var(--gh-line,#e6e9ee) !important}  /* Bình luận — trắng/trung tính (như Nhu cầu) */
.ld-c-view:hover,.ld-c-edit:hover,.ld-c-assign:hover,.ld-c-status:hover{color:#fff !important;filter:brightness(1.08)}
.ld-c-cmt:hover{background:#f6f8f6 !important;color:var(--gh-green) !important;border-color:var(--gh-green) !important}
[data-bs-theme="dark"] .ld-c-cmt{background:#1a2230 !important;color:#cdd3dc !important;border-color:#2a3346 !important}
/* v2.25.44 — Nút icon chức năng đồng bộ ~28px (giảm 25% so với 38px) cho Lao động / Khách hàng / Nhu cầu */
.ld-cta{min-width:28px !important;width:28px !important;height:28px !important;padding:0 !important;border-radius:8px !important;
    display:inline-flex;align-items:center;justify-content:center;gap:.1rem;font-size:0 !important;line-height:1;box-shadow:0 2px 6px rgba(0,0,0,.13)}
.ld-cta i{font-size:.94rem}
.ld-cta.dropdown-toggle::after{font-size:.56rem;margin-left:.04rem}
.ld-acts{gap:.3rem !important;align-items:center}
.emp-actions{gap:.3rem;align-items:center}
@media(max-width:576px){.ld-cta{min-width:28px !important;width:28px !important;height:28px !important}.ld-cta i{font-size:.94rem}}
/* Đồng bộ Khách hàng (.kh-acts) — cùng 28px */
.kh-acts .btn-icon{width:28px !important;height:28px !important;min-width:28px !important;padding:0 !important;border-radius:8px !important}
.kh-acts .btn-icon i{font-size:.94rem}
/* v2.25.45 — Nút màu thương hiệu dùng chung (Nhu cầu / Khách hàng): Tạo HĐ · Sửa · Giao · Xóa */
.btn-gh-green{background:var(--gh-green);color:#fff !important;border:none}
.btn-gh-orange{background:var(--gh-orange);color:#fff !important;border:none}
.btn-gh-assign{background:var(--gh-green-dark);color:#fff !important;border:none}
.btn-gh-del{background:var(--gh-danger);color:#fff !important;border:none}
.btn-gh-green:hover,.btn-gh-green:focus,.btn-gh-green:active,.btn-gh-green.show{background:var(--gh-green) !important;color:#fff !important;filter:brightness(1.07)}
.btn-gh-orange:hover,.btn-gh-orange:focus,.btn-gh-orange:active,.btn-gh-orange.show{background:var(--gh-orange) !important;color:#fff !important;filter:brightness(1.07)}
.btn-gh-assign:hover,.btn-gh-assign:focus,.btn-gh-assign:active,.btn-gh-assign.show{background:var(--gh-green-dark) !important;color:#fff !important;filter:brightness(1.12)}
.btn-gh-del:hover,.btn-gh-del:focus,.btn-gh-del:active,.btn-gh-del.show{background:var(--gh-danger) !important;color:#fff !important;filter:brightness(1.07)}

/* ===== Select có ô tìm kiếm (gh-search) — theme Gia Hoàng ===== */
.gh-ss{position:relative;display:inline-block;vertical-align:top}
.gh-ss-btn{display:flex;align-items:center;gap:.5rem;width:100%;background:#fff;border:1px solid var(--gh-line);border-radius:10px;padding:.42rem .7rem;font-size:.9rem;color:var(--gh-ink);cursor:pointer;text-align:left;min-height:38px}
.gh-ss-btn:hover{border-color:var(--gh-green)}
.gh-ss.open .gh-ss-btn{border-color:var(--gh-green);box-shadow:0 0 0 3px var(--gh-green-soft)}
.gh-ss-btn[aria-disabled="true"]{background:#f3f4f6;color:var(--gh-muted);cursor:not-allowed;pointer-events:none}
.gh-ss-txt{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gh-ss-txt.ph{color:var(--gh-muted)}
.gh-ss-car{flex:0 0 auto;color:var(--gh-muted);transition:transform .15s}
.gh-ss.open .gh-ss-car{transform:rotate(180deg);color:var(--gh-green)}
.gh-ss-pan{position:absolute;z-index:1080;top:calc(100% + 4px);left:0;width:max-content;min-width:240px;max-width:340px;background:#fff;border:1px solid var(--gh-line);border-radius:12px;box-shadow:var(--gh-shadow-hover);padding:8px;display:none}
.gh-ss.open .gh-ss-pan{display:block}
.gh-ss-search{width:100%;box-sizing:border-box;border:1px solid var(--gh-line);border-radius:8px;padding:.45rem .6rem;font-size:.9rem;margin-bottom:6px;outline:none}
.gh-ss-search:focus{border-color:var(--gh-green)}
.gh-ss-list{max-height:260px;overflow:auto;display:flex;flex-direction:column;gap:2px}
.gh-ss-opt{flex:0 0 auto;padding:.5rem .6rem;border-radius:8px;font-size:.9rem;color:var(--gh-ink);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5}
.gh-ss-opt:hover,.gh-ss-opt.active{background:var(--gh-green-soft);color:var(--gh-green-dark)}
.gh-ss-opt.sel{background:var(--gh-green);color:#fff;font-weight:600}
.gh-ss-empty{padding:.6rem;color:var(--gh-muted);font-size:.85rem;text-align:center}

/* ===== Combobox tìm kiếm cho select trong form (gh-combo) — dùng chung ===== */
.ghcb{position:relative}
.ghcb-panel{position:absolute;z-index:1065;left:0;right:0;top:100%;margin-top:3px;background:var(--tblr-bg-surface,#fff);border:1px solid var(--tblr-border-color,var(--gh-line));border-radius:10px;box-shadow:0 10px 28px rgba(0,0,0,.16);max-height:240px;overflow:auto;display:none}
.ghcb-panel.show{display:block}
.ghcb-opt{padding:.42rem .62rem;font-size:.86rem;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ghcb-opt.active,.ghcb-opt:hover{background:var(--gh-green);color:#fff}
.ghcb-empty{padding:.5rem .62rem;font-size:.8rem;color:var(--gh-muted)}
[data-bs-theme="dark"] .ghcb-panel{background:var(--gh-ink);border-color:var(--gh-ink)}
/* 19/09: ô nhập giờ kiểu gõ số tự nhận (input.gh-time) — "1400" -> "14:00" khi rời ô */
.gh-time{font-variant-numeric:tabular-nums;letter-spacing:.03em;text-align:center;max-width:110px}

/* 2.130.35: KHÔNG gạch chân chữ khi rê chuột / bấm vào thông báo, thống kê, chức năng (thẻ, nút, menu, tab, chip) */
a.gh-kpi, a.gh-kpi:hover, a.gh-kpi:focus, a.gh-kpi *,
a.tk-chip, a.tk-chip:hover, a.tk-c, a.tk-c:hover, a.tk-c *, a.cc, a.cc:hover, a.cc *,
a.card-link, a.card-link:hover, a.card-link *, a[class*="stat"], a[class*="stat"]:hover, a[class*="stat"] *, a[class*="kpi"], a[class*="kpi"]:hover,
.gh-notif-menu a, .gh-notif-menu a:hover, .gh-notif-menu a *, .gh-notif-item, .gh-notif-item:hover, .gh-notif-item *,
a.btn, a.btn:hover, a.btn *, .nav-link, .nav-link:hover, .dropdown-item, .dropdown-item:hover, .list-group-item-action, .list-group-item-action:hover,
.kht-seg a, .kht-seg a:hover, a.kht-nhac, a.kht-nhac:hover, a.kht-btn, a.kht-btn:hover, .type-tab, .type-tab:hover, .set-nav a, .set-nav a:hover,
.page-header a.btn, .navbar a, .navbar a:hover { text-decoration: none !important; }