@import '_content/SmartSoftware.Framework.Ui.Blazor/SmartSoftware.Framework.Ui.Blazor.yybcoi1uk1.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.AuditLogging.Blazor/SmartSoftware.ModularMonolith.AuditLogging.Blazor.h556ljyuab.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.BlobStoring.Blazor/SmartSoftware.ModularMonolith.BlobStoring.Blazor.nj03umtn68.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Contract.Blazor/SmartSoftware.ModularMonolith.Contract.Blazor.quqd3pbsx3.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Distribution.Blazor/SmartSoftware.ModularMonolith.Distribution.Blazor.zvepsfkioe.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Finance.Blazor/SmartSoftware.ModularMonolith.Finance.Blazor.n8uoo8fhkt.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Finance.Cash.Blazor/SmartSoftware.ModularMonolith.Finance.Cash.Blazor.sjsiimmkrc.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Goal.Blazor/SmartSoftware.ModularMonolith.Goal.Blazor.zidh4ife7i.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Identity.Blazor/SmartSoftware.ModularMonolith.Identity.Blazor.9cqo6tik4x.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.InputInvoice.Blazor/SmartSoftware.ModularMonolith.InputInvoice.Blazor.gfvkc6uemo.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Inventory.Blazor/SmartSoftware.ModularMonolith.Inventory.Blazor.45gr1l5x7u.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Invoicing.Blazor/SmartSoftware.ModularMonolith.Invoicing.Blazor.6d3b4shscc.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.MasterData.Blazor/SmartSoftware.ModularMonolith.MasterData.Blazor.ouunyksmvl.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.OpeningBalance.Blazor/SmartSoftware.ModularMonolith.OpeningBalance.Blazor.1rh0sdrihr.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Payroll.Blazor/SmartSoftware.ModularMonolith.Payroll.Blazor.dnhash8rwj.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Payroll.Categories.Blazor/SmartSoftware.ModularMonolith.Payroll.Categories.Blazor.sorvwmo6oj.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.PriceSimulation.Blazor/SmartSoftware.ModularMonolith.PriceSimulation.Blazor.p217gqvv6f.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Promotion.Blazor/SmartSoftware.ModularMonolith.Promotion.Blazor.kpqqh6hik2.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Purchase.Blazor/SmartSoftware.ModularMonolith.Purchase.Blazor.nkznsgmt1t.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.Sales.Blazor/SmartSoftware.ModularMonolith.Sales.Blazor.zprgl7gdnx.bundle.scp.css';
@import '_content/SmartSoftware.ModularMonolith.SalesCashFund.Blazor/SmartSoftware.ModularMonolith.SalesCashFund.Blazor.hge9qt13cf.bundle.scp.css';

/* /Layout/Component/Sidebar/ErpSidebar.razor.rz.scp.css */
/* ErpSidebar.razor.css — CSS cô lập (scoped). Chỉ áp cho markup của component này.
   Không dùng :root: bộ biến khai báo ngay trên .sb-slot để không phụ thuộc style ngoài.
   Khác bản handoff: font theo biến app (--app-font-family), .sb-slot chiếm hết phần
   aside còn lại dưới logo banner, icon là <i> FontAwesome (.sb-ico-fa) thay vì SVG. */

.sb-slot[b-wr5y5tvktx] {
    /* Màu lấy từ token toàn app (smart-theme.css, khai ở :root nên CSS scoped vẫn đọc được) */
    --sb-bg: var(--st-surface-1);
    --sb-ink: #201e1d;
    --sb-ink-70: rgba(32, 30, 29, .7);
    --sb-ink-88: rgba(32, 30, 29, .88);
    --sb-rule: var(--st-border);
    --sb-hover: #f3f6fb;
    --sb-hover-bar: rgba(37, 99, 235, .45);
    --sb-accent: #2563eb;
    --sb-accent-700: #1d4ed8;
    --sb-accent-050: #eef4ff;
    --sb-font: var(--app-font-family, system-ui, sans-serif);

    position: relative;
    flex: 1;
    min-height: 0;
    transition: width .22s ease;
}

.sb[b-wr5y5tvktx] {
    position: relative;
    top: 0;
    left: 0;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--sb-bg);
    border-right: 1px solid var(--sb-rule);
    font-family: var(--sb-font);
    transition: width .2s ease, box-shadow .2s ease;
    /* Cao hơn nội dung/grid trong layout-main, nhưng vẫn dưới header (1000)
       và các lớp dialog/popup của Bootstrap (>=1050) */
    z-index: 900;
}

/* Khi thu gọn: sidebar nổi lên trên nội dung khi hover, không đẩy layout */
.sb-float[b-wr5y5tvktx] {
    position: absolute;
}

.sb-float:hover[b-wr5y5tvktx] {
    box-shadow: 0 12px 32px rgba(45, 43, 43, .22);
}

/* — vùng cuộn: luôn chừa rãnh, thanh cuộn chỉ hiện khi hover — */
.sb-scroll[b-wr5y5tvktx] {
    flex: 1;
    min-height: 0;
    padding-top: 10px;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
    transition: scrollbar-color .2s ease;
}

.sb-scroll:hover[b-wr5y5tvktx] {
    scrollbar-color: rgba(32, 30, 29, .32) transparent;
}

.sb-scroll[b-wr5y5tvktx]::-webkit-scrollbar {
    width: 8px;
}

.sb-scroll[b-wr5y5tvktx]::-webkit-scrollbar-track {
    background: transparent;
}

.sb-scroll[b-wr5y5tvktx]::-webkit-scrollbar-thumb {
    background: transparent;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.sb-scroll:hover[b-wr5y5tvktx]::-webkit-scrollbar-thumb {
    background: rgba(32, 30, 29, .32);
    background-clip: padding-box;
}

.sb-shut .sb-scroll[b-wr5y5tvktx] {
    scrollbar-width: none;
}

.sb-shut .sb-scroll[b-wr5y5tvktx]::-webkit-scrollbar {
    width: 0;
}

/* — hàng menu — */
.sb-row[b-wr5y5tvktx] {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
    padding: 0 18px;
    overflow: hidden;
    background: transparent;
    border: 0;
    border-radius: 0;
    text-align: left;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    color: var(--sb-ink-88);
}

.sb-parent[b-wr5y5tvktx] {
    height: 33px;
    flex: none;
    padding: 0 10px 0 14px;
    font: 500 14px var(--sb-font);
    color: rgb(48 48 48 / 88%);
}

.sb-child[b-wr5y5tvktx] {
    height: 29px;
    padding: 0 14px 0 16px;
    font: 500 13px var(--sb-font);
    color: rgba(32, 30, 29, .8);
}

/* cấp 3 */
.sb-grand[b-wr5y5tvktx] {
    height: 27px;
    padding: 0 14px;
    font: 400 13px var(--sb-font);
    color: rgba(32, 30, 29, .7);
}

.sb-row:hover[b-wr5y5tvktx] {
    background: var(--sb-hover);
    box-shadow: inset 3px 0 0 var(--sb-hover-bar);
}

.sb-row:focus-visible[b-wr5y5tvktx] {
    outline: 2px solid var(--sb-accent);
    outline-offset: -2px;
}

/* Nhóm đang mở / mục đang chọn: thanh xanh chủ đạo, chữ xanh đậm */
/* Nhóm đang mở: nền trắng + thanh xanh. Mục đang chọn: nền xanh nhạt. */
.sb-row.is-open[b-wr5y5tvktx] {
    background: #fff;
    color: var(--sb-accent-700);
    box-shadow: inset 3px 0 0 var(--sb-accent);
    font-weight: 600;
}

.sb-row.is-active[b-wr5y5tvktx] {
    background: var(--sb-accent-050);
    color: var(--sb-accent-700);
    box-shadow: inset 3px 0 0 var(--sb-accent);
    font-weight: 600;
}

.sb-child.is-active[b-wr5y5tvktx] {
    font-weight: 600;
}

/* hàng cấp 2 đang mở nhóm con: thanh xanh mảnh hơn (2px) để phân biệt cấp */
.sb-branch.is-open[b-wr5y5tvktx] {
    box-shadow: inset 2px 0 0 var(--sb-accent);
    font-weight: 600;
}

.sb-chev-sm[b-wr5y5tvktx] {
    stroke-width: 2.2;
}

/* Tên dài: cắt bằng … (tooltip title hiện đầy đủ khi hover) */
/* line-height PHẢI đủ chỗ cho dấu tiếng Việt chồng hai tầng (Ế, Ồ, Ữ...).
   Đo 26/08/2026 với Inter: "KẾ TOÁN" 13px cần 14px trên baseline, mà line box
   `normal` chỉ cho 13px ascent -> `overflow: hidden` ở đây CẮT MẤT dấu sắc,
   "KẾ" hiện ra thành "KÊ". Glyph tràn khỏi line box không làm scrollHeight đổi
   nên đo bằng scrollHeight/clientHeight không thấy gì. 1.55 cho dư ~1px. */
.sb-label[b-wr5y5tvktx] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 1.55;
}

/* Icon FontAwesome từ CMS: khung 20×20 cố định, icon căn giữa trong khung —
   glyph FA rộng hẹp khác nhau nhưng cột chữ luôn bắt đầu cùng một mốc */
.sb-ico-fa[b-wr5y5tvktx] {
    flex: none;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-size: 16px;
    line-height: 1;
    color: currentColor;
}

/* Icon nhóm: xám xanh khi thường, đậm khi rê chuột, xanh chủ đạo khi nhóm mở / đang chọn */
.sb-parent .sb-ico-fa[b-wr5y5tvktx] {
    color: #64748b;
    transition: color .15s ease;
}

.sb-parent:hover .sb-ico-fa[b-wr5y5tvktx] {
    color: #334155;
}

.sb-row.is-open .sb-ico-fa[b-wr5y5tvktx],
.sb-row.is-active .sb-ico-fa[b-wr5y5tvktx] {
    color: var(--sb-accent-700);
}

.sb-chev[b-wr5y5tvktx] {
    flex: none;
    margin-left: auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    transform: rotate(-90deg);
    transition: transform .22s ease;
}

.sb-row.is-open .sb-chev[b-wr5y5tvktx] {
    transform: rotate(0deg);
}

/* — nhóm con: trượt mở/đóng — */
.sb-sub[b-wr5y5tvktx] {
    margin-left: 30px;
    border-left: 1px solid rgba(32, 30, 29, .18);
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    padding: 0;
    transition: max-height .26s ease, opacity .18s ease, padding .26s ease;
}

.sb-sub.is-open[b-wr5y5tvktx] {
    max-height: var(--sb-sub-h, 200px);
    opacity: 1;
    padding: 2px 0 6px;
}

/* khối cấp 3: thụt thêm, đường dọc mảnh hơn, không padding dọc */
.sb-sub-3[b-wr5y5tvktx] {
    margin-left: 14px;
    border-left-color: rgba(32, 30, 29, .14);
    transition: max-height .24s ease, opacity .16s ease;
}

.sb-sub-3.is-open[b-wr5y5tvktx] {
    padding: 0;
}

/* — tooltip tự vẽ: hiện bên phải con trỏ, trượt nhẹ vào kèm fade —
   hiện có độ trễ 250ms như tooltip hệ thống, tắt thì biến ngay */
.sb-tip[b-wr5y5tvktx] {
    position: fixed;
    z-index: 1100;
    padding: 6px 9px;
    border-radius: 6px;
    background: rgb(31 41 55 / .96);
    box-shadow: 0 6px 18px rgb(16 24 40 / .22), 0 1px 3px rgb(16 24 40 / .16);
    color: #fff;
    font: 500 13px/1.45 var(--sb-font);
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    transform: translate(6px, -50%);
    transition: opacity .12s ease, transform .12s ease;
}

.sb-tip.is-on[b-wr5y5tvktx] {
    opacity: 1;
    transform: translate(0, -50%);
    transition: opacity .18s ease .25s, transform .18s ease .25s;
}

/* — trạng thái thu gọn: chỉ icon, không lộ chữ — */
.sb-shut .sb-label[b-wr5y5tvktx],
.sb-shut .sb-chev[b-wr5y5tvktx] {
    display: none;
}

.sb-shut .sb-row[b-wr5y5tvktx] {
    justify-content: center;
    padding: 0;
    gap: 0;
}

.sb-shut .sb-sub[b-wr5y5tvktx] {
    max-height: 0;
    opacity: 0;
    padding: 0;
    margin-left: 0;
    border-left: 0;
}
/* /Layout/Component/Topbar/TopbarContext.razor.rz.scp.css */
/* Ô "Đơn vị · Năm" trên thanh đầu trang và bảng chọn thả xuống — tông xanh chủ đạo. */
.tc[b-j9uofrqr9b] {
	position: relative;
	margin-right: 8px;
}

.tc-btn[b-j9uofrqr9b] {
	height: 30px;
	max-width: 340px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 0 8px 0 10px;
	border: 1px solid #e3e8f0;
	border-radius: 7px;
	background: #fff;
	color: #1f2937;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}

.tc-btn:hover[b-j9uofrqr9b], .tc-btn.on[b-j9uofrqr9b] {
	border-color: #c7dbff;
	background: #f6f9ff;
}

.tc-btn.on[b-j9uofrqr9b] {
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.tc-ic[b-j9uofrqr9b] {
	color: #2563eb;
	font-size: 15px;
}

.tc-unit[b-j9uofrqr9b] {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.tc-sep[b-j9uofrqr9b] {
	width: 1px;
	height: 16px;
	background: #e3e8f0;
	flex: none;
}

.tc-year[b-j9uofrqr9b] {
	flex: none;
	padding: 1px 8px;
	border-radius: 20px;
	background: #eef4ff;
	color: #1d4ed8;
	font-size: 14px;
	font-variant-numeric: tabular-nums;
}

.tc-chev[b-j9uofrqr9b] {
	flex: none;
	font-size: 14px;
	color: #8a94a6;
	transition: transform .15s ease;
}

.tc-btn.on .tc-chev[b-j9uofrqr9b] {
	transform: rotate(180deg);
}

.tc-veil[b-j9uofrqr9b] {
	position: fixed;
	inset: 0;
	z-index: 1040;
}

.tc-pop[b-j9uofrqr9b] {
	position: absolute;
	right: 0;
	top: calc(100% + 6px);
	z-index: 1041;
	width: 360px;
	max-width: calc(100vw - 24px);
	padding: 12px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	background: #fff;
	border: 1px solid #e6eaf1;
	border-radius: 12px;
	box-shadow: 0 18px 48px rgba(16, 24, 40, .16), 0 2px 6px rgba(16, 24, 40, .06);
}

.tc-h[b-j9uofrqr9b] {
	margin-bottom: 6px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .3px;
	text-transform: uppercase;
	color: #5b6577;
}

.tc-search[b-j9uofrqr9b] {
	width: 100%;
	height: var(--smart-search-h, 28px);
	box-sizing: border-box;
	margin-bottom: 6px;
	padding: 0 10px;
	border: 1px solid #e3e8f0;
	border-radius: 8px;
	font-size: 14px;
	outline: none;
}

.tc-search:focus[b-j9uofrqr9b] {
	border-color: #2563eb;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.tc-list[b-j9uofrqr9b] {
	max-height: 260px;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.tc-item[b-j9uofrqr9b] {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 7px 10px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	text-align: left;
	font-size: 14px;
	color: #1f2937;
	cursor: pointer;
}

.tc-item:hover[b-j9uofrqr9b] {
	background: #f3f6fb;
}

.tc-item.sel[b-j9uofrqr9b] {
	background: #eef4ff;
	color: #1d4ed8;
	font-weight: 600;
}

.tc-type[b-j9uofrqr9b] {
	flex: none;
	padding: 1px 7px;
	border-radius: 20px;
	background: #eef4ff;
	color: #1d4ed8;
	font-size: 14px;
	font-weight: 600;
}

.tc-name[b-j9uofrqr9b] {
	min-width: 0;
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.tc-tick[b-j9uofrqr9b] {
	flex: none;
	color: #2563eb;
}

.tc-empty[b-j9uofrqr9b] {
	padding: 10px;
	font-size: 14px;
	color: #8a94a6;
	text-align: center;
}

.tc-years[b-j9uofrqr9b] {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.tc-yr[b-j9uofrqr9b] {
	min-width: 64px;
	height: 30px;
	border: 1px solid #e3e8f0;
	border-radius: 8px;
	background: #fff;
	font-size: 14px;
	font-weight: 600;
	color: #334155;
	font-variant-numeric: tabular-nums;
	cursor: pointer;
}

.tc-yr-all[b-j9uofrqr9b] {
	padding: 0 10px;
}

.tc-yr:hover[b-j9uofrqr9b] {
	border-color: #c7dbff;
	background: #f6f9ff;
}

.tc-yr.sel[b-j9uofrqr9b] {
	border-color: #2563eb;
	background: #2563eb;
	color: #fff;
}
/* /Layout/Component/Topbar/TopbarLanguage.razor.rz.scp.css */
/* Nút chọn ngôn ngữ trên thanh đầu trang — cùng kiểu menu tài khoản, tông xanh chủ đạo. */
.tl[b-rve01tgs6t] {
	position: relative;
	margin-right: 4px;
}

.tl-btn[b-rve01tgs6t] {
	height: 28px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 0 8px;
	border: 1px solid transparent;
	border-radius: 20px;
	background: transparent;
	color: #5b6577;
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease;
}

.tl-btn:hover[b-rve01tgs6t], .tl-btn.on[b-rve01tgs6t] {
	background: #f3f6fb;
	border-color: #e3e8f0;
	color: #1f2937;
}

.tl-ic[b-rve01tgs6t] {
	font-size: 14px;
}

.tl-code[b-rve01tgs6t] {
	font-size: 14px;
	font-weight: 650;
	letter-spacing: .3px;
}

.tl-veil[b-rve01tgs6t] {
	position: fixed;
	inset: 0;
	z-index: 1040;
}

.tl-pop[b-rve01tgs6t] {
	position: absolute;
	right: 0;
	top: calc(100% + 6px);
	z-index: 1041;
	min-width: 180px;
	padding: 6px;
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e6eaf1;
	border-radius: 12px;
	box-shadow: 0 18px 48px rgba(16, 24, 40, .16), 0 2px 6px rgba(16, 24, 40, .06);
}

.tl-item[b-rve01tgs6t] {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	height: 28px;
	padding: 0 10px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	text-align: left;
	font-size: 14px;
	color: #1f2937;
	cursor: pointer;
}

.tl-item:hover[b-rve01tgs6t] {
	background: #eef4ff;
	color: #1d4ed8;
}

.tl-item.sel[b-rve01tgs6t] {
	color: #1d4ed8;
	font-weight: 600;
}

.tl-badge[b-rve01tgs6t] {
	flex: none;
	width: 26px;
	padding: 1px 0;
	border-radius: 6px;
	background: #eef4ff;
	color: #2563eb;
	font-size: 14px;
	font-weight: 700;
	text-align: center;
}

.tl-name[b-rve01tgs6t] {
	flex: 1;
	min-width: 0;
}

.tl-tick[b-rve01tgs6t] {
	color: #2563eb;
}
/* /Layout/Component/Topbar/TopbarNotifications.razor.rz.scp.css */
/* Nút thông báo trên thanh đầu trang và khung danh sách thả xuống — cùng kiểu menu tài khoản. */
.tn[b-ql0lspjja3] {
	position: relative;
	margin-right: 6px;
}

.tn-btn[b-ql0lspjja3] {
	position: relative;
	width: 32px;
	height: 32px;
	display: inline-grid;
	place-items: center;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 50%;
	background: transparent;
	color: #475569;
	font-size: 16px;
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.tn-btn:hover[b-ql0lspjja3], .tn-btn.on[b-ql0lspjja3] {
	background: #f3f6fb;
	border-color: #e3e8f0;
	color: #2563eb;
}

.tn-badge[b-ql0lspjja3] {
	position: absolute;
	top: -3px;
	right: -4px;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	display: inline-grid;
	place-items: center;
	border: 2px solid #fff;
	border-radius: 10px;
	background: #dc2626;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	font-variant-numeric: tabular-nums;
	box-sizing: content-box;
}

.tn-veil[b-ql0lspjja3] {
	position: fixed;
	inset: 0;
	z-index: 1040;
}

.tn-pop[b-ql0lspjja3] {
	position: absolute;
	right: 0;
	top: calc(100% + 6px);
	z-index: 1041;
	width: min(360px, calc(100vw - 24px));
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e6eaf1;
	border-radius: 12px;
	box-shadow: 0 18px 48px rgba(16, 24, 40, .16), 0 2px 6px rgba(16, 24, 40, .06);
	overflow: hidden;
	outline: none;
}

.tn-head[b-ql0lspjja3] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 10px 12px 10px 14px;
	background: linear-gradient(180deg, #f2f6ff, #fff);
	border-bottom: 1px solid #eef1f6;
}

.tn-head b[b-ql0lspjja3] {
	font-size: 14px;
	font-weight: 650;
	color: #1f2937;
}

.tn-all[b-ql0lspjja3] {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 8px;
	border: 0;
	border-radius: 7px;
	background: transparent;
	color: #2563eb;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	white-space: nowrap;
}

.tn-all:hover[b-ql0lspjja3] {
	background: #eef4ff;
}

.tn-all:disabled[b-ql0lspjja3] {
	opacity: .6;
	cursor: default;
}

.tn-list[b-ql0lspjja3] {
	max-height: min(440px, calc(100vh - 120px));
	overflow-y: auto;
	padding: 6px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.tn-item[b-ql0lspjja3] {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	width: 100%;
	padding: 8px 10px 8px 8px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	text-align: left;
	cursor: pointer;
}

.tn-item:hover[b-ql0lspjja3] {
	background: #f3f6fb;
}

.tn-item.unread[b-ql0lspjja3] {
	background: #f6f9ff;
}

.tn-item.unread:hover[b-ql0lspjja3] {
	background: #eef4ff;
}

.tn-dot[b-ql0lspjja3] {
	flex: none;
	width: 8px;
	height: 8px;
	margin-top: 5px;
	border-radius: 50%;
	background: transparent;
}

.tn-item.unread .tn-dot[b-ql0lspjja3] {
	background: #2563eb;
}

.tn-text[b-ql0lspjja3] {
	min-width: 0;
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 2px;
	line-height: 1.35;
}

.tn-text b[b-ql0lspjja3] {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 500;
	color: #1f2937;
}

.tn-item.unread .tn-text b[b-ql0lspjja3] {
	font-weight: 650;
}

.tn-body[b-ql0lspjja3] {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14px;
	color: #475569;
	word-break: break-word;
}

.tn-text small[b-ql0lspjja3] {
	font-size: 14px;
	color: #8a94a6;
}

.tn-state[b-ql0lspjja3] {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 22px 10px;
	font-size: 14px;
	color: #8a94a6;
}

.tn-more[b-ql0lspjja3] {
	margin: 4px 0 2px;
	padding: 7px 10px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: #2563eb;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.tn-more:hover[b-ql0lspjja3] {
	background: #eef4ff;
}
/* /Layout/Component/Topbar/TopbarUserMenu.razor.rz.scp.css */
/* Menu tài khoản trên thanh đầu trang — tông xanh chủ đạo, Đăng xuất màu đỏ. */
.tu[b-p0tg2ozg8l] {
	position: relative;
	margin-right: 4px;
}

.tu-btn[b-p0tg2ozg8l] {
	height: 32px;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 0 8px 0 3px;
	border: 1px solid transparent;
	border-radius: 20px;
	background: transparent;
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease;
}

.tu-btn:hover[b-p0tg2ozg8l], .tu-btn.on[b-p0tg2ozg8l] {
	background: #f3f6fb;
	border-color: #e3e8f0;
}

.tu-ava[b-p0tg2ozg8l] {
	width: 26px;
	height: 26px;
	flex: none;
	display: inline-grid;
	place-items: center;
	border-radius: 50%;
	background: linear-gradient(135deg, #2563eb, #38bdf8);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .3px;
}

.tu-ava.lg[b-p0tg2ozg8l] {
	width: 42px;
	height: 42px;
	font-size: 15px;
}

.tu-who[b-p0tg2ozg8l] {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	line-height: 1.15;
	max-width: 160px;
}

.tu-who b[b-p0tg2ozg8l] {
	font-size: 14px;
}

.tu-who small[b-p0tg2ozg8l] {
	font-size: 14px;
}

.tu-who b[b-p0tg2ozg8l], .tu-card-who b[b-p0tg2ozg8l] {
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 650;
	color: #1f2937;
}

.tu-who small[b-p0tg2ozg8l], .tu-card-who small[b-p0tg2ozg8l] {
	font-size: 14px;
	color: #8a94a6;
}

.tu-chev[b-p0tg2ozg8l] {
	font-size: 14px;
	color: #8a94a6;
	transition: transform .15s ease;
}

.tu-btn.on .tu-chev[b-p0tg2ozg8l] {
	transform: rotate(180deg);
}

.tu-veil[b-p0tg2ozg8l] {
	position: fixed;
	inset: 0;
	z-index: 1040;
}

.tu-pop[b-p0tg2ozg8l] {
	position: absolute;
	right: 0;
	top: calc(100% + 6px);
	z-index: 1041;
	width: 270px;
	background: #fff;
	border: 1px solid #e6eaf1;
	border-radius: 12px;
	box-shadow: 0 18px 48px rgba(16, 24, 40, .16), 0 2px 6px rgba(16, 24, 40, .06);
	overflow: hidden;
}

.tu-card[b-p0tg2ozg8l] {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px;
	background: linear-gradient(180deg, #f2f6ff, #fff);
	border-bottom: 1px solid #eef1f6;
}

.tu-card-who[b-p0tg2ozg8l] {
	min-width: 0;
	flex: 1;
	display: flex;
	flex-direction: column;
	line-height: 1.3;
}

.tu-role[b-p0tg2ozg8l] {
	flex: none;
	padding: 2px 8px;
	border-radius: 20px;
	background: #eef4ff;
	color: #1d4ed8;
	font-size: 14px;
	font-weight: 700;
}

.tu-list[b-p0tg2ozg8l] {
	padding: 6px;
	display: flex;
	flex-direction: column;
}

.tu-item[b-p0tg2ozg8l] {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 8px 10px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	text-align: left;
	font-size: 14px;
	color: #1f2937;
	cursor: pointer;
}

.tu-item i[b-p0tg2ozg8l], .tu-ver i[b-p0tg2ozg8l] {
	width: 18px;
	text-align: center;
	color: #64748b;
}

.tu-item:hover[b-p0tg2ozg8l] {
	background: #eef4ff;
	color: #1d4ed8;
}

.tu-item:hover i[b-p0tg2ozg8l] {
	color: #2563eb;
}

.tu-item.danger[b-p0tg2ozg8l] {
	color: #dc2626;
}

.tu-item.danger i[b-p0tg2ozg8l] {
	color: #dc2626;
}

.tu-item.danger:hover[b-p0tg2ozg8l] {
	background: #fdecec;
	color: #b91c1c;
}

.tu-ver[b-p0tg2ozg8l] {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 6px 10px;
	font-size: 14px;
	color: #8a94a6;
}

.tu-div[b-p0tg2ozg8l] {
	height: 1px;
	margin: 4px 6px;
	background: #eef1f6;
}

/* Màn hẹp: chỉ còn avatar */
@media (max-width: 900px) {
	.tu-who[b-p0tg2ozg8l], .tu-chev[b-p0tg2ozg8l] {
		display: none;
	}
}

/* Ảnh đại diện phủ kín vòng tròn */
.tu-ava[b-p0tg2ozg8l] {
	overflow: hidden;
}

.tu-ava img[b-p0tg2ozg8l] {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* /Layout/Component/UpdateListener.razor.rz.scp.css */
.floating-update-button[b-gnyia913yu] {
    position: relative;
    top: 0;
    padding: 1rem 1.5rem;
    width: 100%;
}
/* /Layout/MainLayout.razor.rz.scp.css */
.layout-drawer-body[b-yat0g2t9xi]  .groupbox {
    margin-top: 1rem;
}

.layout-drawer-body[b-yat0g2t9xi]  .btn-info {
    margin-bottom: 1rem;
}

.layout-item[b-yat0g2t9xi] {
    --bb-layout-sidebar-bg: #f8f9fa;
    --bb-layout-footer-bg: #e9ecef;
    cursor: pointer;
    border: 2px solid #e9ecef;
    padding: 4px;
    border-radius: 4px;
    height: 80px;
    width: 120px;
    transition: border .3s linear;
}

    .layout-item:hover[b-yat0g2t9xi],
    .layout-item.active[b-yat0g2t9xi] {
        border: 2px solid #28a745;
    }

    .layout-item .layout-left[b-yat0g2t9xi] {
        width: 30%;
        border-right: 1px solid var(--bs-border-color);
    }

        .layout-item .layout-left .layout-left-header[b-yat0g2t9xi] {
            height: 16px;
            background-color: var(--bb-header-bg);
        }

        .layout-item .layout-left .layout-left-body[b-yat0g2t9xi],
        .layout-item .layout-body .layout-left[b-yat0g2t9xi] {
            background-color: var(--bb-layout-sidebar-bg);
        }

    .layout-item .layout-right .layout-right-header[b-yat0g2t9xi],
    .layout-item .layout-top[b-yat0g2t9xi] {
        background-color: var(--bb-header-bg);
        height: 16px;
    }

    .layout-item .layout-right .layout-right-footer[b-yat0g2t9xi],
    .layout-item .layout-right-footer[b-yat0g2t9xi] {
        background-color: var(--bb-layout-footer-bg);
        height: 12px;
    }

    .layout-item .layout-top[b-yat0g2t9xi],
    .layout-item .layout-body[b-yat0g2t9xi],
    .layout-item .layout-right-footer[b-yat0g2t9xi] {
        width: 100%;
    }

#blazor-error-ui[b-yat0g2t9xi] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-yat0g2t9xi] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.custom-logout[b-yat0g2t9xi] {
    font-weight: 500;
    cursor: pointer;
    margin-right: 10px;
    padding: 4px 8px;
    color: var(--st-red-700);
    font-weight: 500;
}
    .custom-logout:hover[b-yat0g2t9xi] {
        background-color: var(--st-red-050);
        border-radius:6px;
    }

/* /Pages/DisplayOptions/DisplayOptionsPage.razor.rz.scp.css */
/* Màn Tùy chọn hiển thị: cây menu trái, mỗi hàng = tay nắm kéo, nút mở / thu nhóm, ô tích hiện / ẩn, biểu tượng, ô tên, nút lên / xuống (kiểu menu Cột của bảng). */
.do-card[b-6re4rysuxz] {
	container-type: inline-size;
}

.do-body[b-6re4rysuxz] {
	padding: 6px 0 10px;
}

.do-tree[b-6re4rysuxz] {
	max-width: 760px;
}

.do-row[b-6re4rysuxz] {
	display: flex;
	align-items: center;
	gap: 6px;
	min-height: 32px;
	padding: 2px 10px 2px calc(8px + var(--do-depth, 0) * 22px);
	border-top: 2px solid transparent;
	border-bottom: 2px solid transparent;
	user-select: none;
}

.do-row:hover[b-6re4rysuxz] {
	background: #f4f6fa;
}

.do-row.dragging[b-6re4rysuxz] {
	opacity: .45;
}

.do-row.drop-before[b-6re4rysuxz] {
	border-top-color: #2563eb;
}

.do-row.drop-after[b-6re4rysuxz] {
	border-bottom-color: #2563eb;
}

.do-grip[b-6re4rysuxz] {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 16px;
	height: 22px;
	color: #94a3b8;
	cursor: grab;
	border-radius: 4px;
}

.do-grip:hover[b-6re4rysuxz] {
	color: #2563eb;
	background: #eff6ff;
}

.do-toggle[b-6re4rysuxz],
.do-move[b-6re4rysuxz] {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #8a94a6;
	cursor: pointer;
}

.do-toggle:hover[b-6re4rysuxz],
.do-move:hover:not(:disabled)[b-6re4rysuxz] {
	color: #2563eb;
	background: #eff6ff;
}

.do-move:disabled[b-6re4rysuxz] {
	opacity: .35;
	cursor: default;
}

.do-toggle svg[b-6re4rysuxz] {
	transition: transform .15s ease;
}

.do-toggle.open svg[b-6re4rysuxz] {
	transform: rotate(90deg);
}

.do-toggle-gap[b-6re4rysuxz] {
	flex: none;
	width: 26px;
}

.do-icon[b-6re4rysuxz] {
	flex: none;
	width: 18px;
	text-align: center;
	font-size: 14px;
	color: #5b6577;
}

.do-rename[b-6re4rysuxz] {
	flex: 1 1 auto;
	min-width: 0;
	height: 28px;
	padding: 0 8px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #1f2937;
	font: inherit;
	font-size: 14px;
	text-overflow: ellipsis;
	user-select: text;
}

.do-rename:hover:not(:disabled)[b-6re4rysuxz] {
	border-color: #e6eaf1;
	background: #fff;
}

.do-rename:focus[b-6re4rysuxz] {
	outline: 0;
	border-color: #2563eb;
	background: #fff;
	box-shadow: 0 0 0 3px #eef4ff;
}

.do-rename.custom[b-6re4rysuxz] {
	color: #2563eb;
	font-weight: 600;
}

.do-row.off .do-rename[b-6re4rysuxz],
.do-row.off .do-icon[b-6re4rysuxz] {
	color: #a3acba;
	text-decoration: line-through;
}

.do-moves[b-6re4rysuxz] {
	flex: none;
	display: inline-flex;
	gap: 2px;
}

/* Khung hẹp: bớt thụt lề theo cấp và bỏ biểu tượng để ô tên đủ chỗ. */
@container (max-width: 480px) {
	.do-row[b-6re4rysuxz] {
		padding-left: calc(4px + var(--do-depth, 0) * 12px);
		gap: 4px;
	}

	.do-icon[b-6re4rysuxz] {
		display: none;
	}
}
