:root { --ink:#17233c; --muted:#667085; --navy:#132342; --blue:#2563eb; --line:#e6eaf0; --surface:#fff; --canvas:#f4f6fa; }
html { font-size:15px; min-height:100%; }
body { min-height:100vh; background:var(--canvas); color:var(--ink); font-family:Inter,"Segoe UI",Arial,sans-serif; }
.app-header { background:linear-gradient(120deg,#10203d,#193764); box-shadow:0 4px 18px rgba(16,32,61,.18); }
.navbar { min-height:68px; }.navbar-brand { font-weight:700; letter-spacing:-.02em; }.navbar-nav .nav-link { color:#d9e3f3; padding:.7rem .75rem!important; }.navbar-nav .nav-link:hover { color:#fff; }
.brand-mini,.brand-mark { display:inline-grid; place-items:center; color:#fff; background:#3478f6; font-weight:800; border-radius:10px; }.brand-mini { width:36px;height:36px;font-size:.8rem; }.brand-mark{width:54px;height:54px;margin-bottom:1rem;}
.user-box { display:flex;align-items:center;gap:1rem;color:#fff;font-size:.9rem; }.user-box form{margin:0}
.page-heading { display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.5rem; }.page-heading h1 { margin:.1rem 0 .35rem;font-size:1.85rem;font-weight:750;letter-spacing:-.035em; }.page-heading p { margin:0;color:var(--muted); }
.eyebrow { color:var(--blue)!important;font-size:.73rem;font-weight:800;letter-spacing:.13em; }.live-pill { background:#e8f7ef;color:#087443;padding:.45rem .75rem;border-radius:999px;font-size:.8rem;font-weight:700; }
.metric-card,.panel { background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 3px 14px rgba(26,38,64,.04); }.metric-card { padding:1.25rem;min-height:115px;border-top:3px solid #4f78c7; }.metric-card.success{border-top-color:#20a46b}.metric-card.warning{border-top-color:#efa43a}.metric-card.danger{border-top-color:#db4b5b}
.metric-card span { display:block;color:var(--muted);font-size:.82rem;margin-bottom:.8rem; }.metric-card strong { font-size:1.4rem;letter-spacing:-.03em; }.panel { padding:1.35rem; }.panel-title h2 { font-size:1rem;font-weight:750;margin-bottom:1.2rem; }
.process-line { display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap; }.process-line span { padding:.7rem .9rem;background:#f3f6fb;border-radius:8px;font-weight:650;font-size:.86rem; }.process-line i{color:#8da0bc;font-style:normal}.summary-row{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:.7rem 0;margin:0}.summary-row:last-child{border:0}
.filter-bar { display:flex;gap:.75rem;margin-bottom:1rem; }.filter-bar .form-control,.filter-bar .form-select { max-width:340px; }.app-table { margin:0 0 1rem; }.app-table thead th { background:#f8f9fc;color:#596579;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--line);white-space:nowrap; }.app-table td { padding:.9rem .75rem;vertical-align:middle;border-color:#edf0f4; }.status-badge { display:inline-block;background:#edf3ff;color:#2457ad;border-radius:999px;padding:.28rem .62rem;font-size:.75rem;font-weight:700; }
.bootstrap-table .fixed-table-toolbar { margin-bottom:.75rem; }
.bootstrap-table .fixed-table-toolbar .search { width:min(100%,360px); }
.bootstrap-table .fixed-table-toolbar .search .form-control { min-height:40px; }
.bootstrap-table .fixed-table-container { border:0; }
.bootstrap-table .fixed-table-container .table thead th .th-inner { padding:.75rem; }
.bootstrap-table .fixed-table-pagination { color:var(--muted);font-size:.86rem; }
.app-pager { display:flex;align-items:center;justify-content:space-between;gap:1rem;border-top:1px solid var(--line);padding-top:1rem;margin-top:.25rem; }
.app-pager-summary { color:var(--muted);font-size:.86rem; }
.app-pager .page-link { min-width:34px;text-align:center;color:var(--blue); }
.app-pager .active>.page-link { color:#fff;background:var(--blue);border-color:var(--blue); }
.module-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem; }.module-grid a { display:flex;flex-direction:column;gap:.45rem;background:#fff;border:1px solid var(--line);border-radius:14px;padding:1.35rem;color:var(--ink);text-decoration:none;transition:.18s ease; }.module-grid a:hover { transform:translateY(-2px);border-color:#aec8f8;box-shadow:0 8px 22px rgba(37,99,235,.08); }.module-grid span{color:var(--muted);font-size:.86rem}
.locked-data { display:grid;grid-template-columns:120px 1fr;gap:.35rem 1rem;background:#f4f7fc;border-left:4px solid var(--blue);padding:1rem;margin-bottom:1.25rem;border-radius:8px; }.locked-data span{color:var(--muted)}
.login-page { display:grid;place-items:center;padding:2rem;background:radial-gradient(circle at 20% 15%,#2d5da0,#10203d 55%); }.login-card { width:min(440px,100%);background:#fff;border-radius:20px;padding:2.25rem; }.login-card h1{font-size:1.6rem;font-weight:750;}.demo-hint{background:#f4f7fc;border-radius:10px;padding:.9rem;color:#5c6678;font-size:.82rem}.empty-state{text-align:center;padding:5rem 1rem}
.btn-primary{background:#2563eb;border-color:#2563eb}.form-control,.form-select{border-color:#d9dfe8;padding:.65rem .75rem}.form-control:focus,.form-select:focus{border-color:#7aa4ef;box-shadow:0 0 0 .2rem rgba(37,99,235,.12)}
.case-payment-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1rem;margin:0 0 1rem;background:#f4f7fc;border:1px solid #dce5f2;border-radius:10px;color:var(--muted)}.case-payment-toolbar strong{color:var(--ink);font-size:1.1rem}.batch-payment-list{display:grid;gap:.75rem}.batch-payment-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem;border:1px solid var(--line);border-radius:10px}.batch-payment-item strong,.batch-payment-item span{display:block}.batch-payment-item span{color:var(--muted);font-size:.86rem;margin-top:.2rem}
.erp-body{background:#f3f5f9}.erp-shell{min-height:100vh;display:flex}.erp-sidebar{position:fixed;z-index:1030;inset:0 auto 0 0;width:256px;display:flex;flex-direction:column;background:#101c35;color:#c5d0e4;box-shadow:4px 0 16px rgba(15,28,53,.12)}.erp-brand{display:flex;align-items:center;gap:11px;min-height:76px;padding:0 22px;color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}.erp-brand:hover{color:#fff}.erp-brand .brand-mini{flex:0 0 38px;width:38px;height:38px;background:linear-gradient(135deg,#397cff,#21b5ff)}.erp-brand strong,.erp-brand small{display:block}.erp-brand strong{font-size:.98rem}.erp-brand small{color:#91a2c2;font-size:.72rem;margin-top:2px}.erp-nav{padding:19px 12px;overflow-y:auto}.erp-nav-label{margin:18px 10px 8px;color:#7788a8;font-size:.66rem;font-weight:800;letter-spacing:.12em}.erp-nav-label:first-child{margin-top:0}.erp-nav a{display:flex;align-items:center;gap:12px;margin:3px 0;padding:10px 12px;border-radius:8px;color:#c5d0e4;font-size:.9rem;font-weight:600}.erp-nav a i{width:19px;font-size:1.05rem;text-align:center;color:#8ca1c7}.erp-nav a:hover{color:#fff;background:rgba(255,255,255,.06)}.erp-nav a.active{color:#fff;background:linear-gradient(90deg,#2764d7,#2257bf);box-shadow:0 5px 13px rgba(7,39,104,.25)}.erp-nav a.active i{color:#fff}.erp-workspace{width:calc(100% - 256px);min-height:100vh;margin-left:256px}.erp-topbar{height:76px;display:flex;align-items:center;gap:17px;padding:0 28px;background:#fff;border-bottom:1px solid #e4e8f0}.erp-menu-toggle{display:none}.erp-breadcrumb{display:flex;align-items:center;gap:10px;color:#7a8599;font-size:.86rem}.erp-breadcrumb strong{color:#1d2940}.erp-user{display:flex;align-items:center;gap:10px;margin-left:auto}.erp-user strong,.erp-user small{display:block}.erp-user strong{font-size:.84rem}.erp-user small{font-size:.72rem;color:var(--muted)}.erp-user-avatar{display:grid;place-items:center;width:34px;height:34px;background:#e4ecfb;color:#2456b5;border-radius:50%;font-weight:800}.erp-content{padding:28px;max-width:1680px}.erp-page-heading{margin-bottom:1.8rem}.erp-page-actions{display:flex;gap:.6rem;align-items:center}.erp-filter-grid{display:grid;grid-template-columns:minmax(220px,1.3fr) minmax(230px,1fr) minmax(180px,.65fr) auto;gap:14px;align-items:end;margin-bottom:1.2rem;padding:17px;background:#f8faff;border:1px solid #e1e8f4;border-radius:11px}.erp-filter-control label{display:block;margin-bottom:6px;color:#566277;font-size:.76rem;font-weight:750}.erp-filter-control .input-group-text{background:#fff;border-color:#d9dfe8;color:#667a9e}.erp-filter-action{display:flex;gap:8px;white-space:nowrap}.erp-filter-action .btn{height:42px}.tom-select .ts-control{min-height:42px;border-color:#d9dfe8;border-radius:.375rem}.tom-select.focus .ts-control{border-color:#7aa4ef;box-shadow:0 0 0 .2rem rgba(37,99,235,.12)}
@media(max-width:767px){.page-heading{flex-direction:column}.user-box{padding:.75rem 0}.process-line{align-items:stretch;flex-direction:column}.process-line i{display:none}.filter-bar{flex-direction:column}.filter-bar .form-control,.filter-bar .form-select{max-width:none}.app-pager{align-items:flex-start;flex-direction:column}.bootstrap-table .fixed-table-toolbar .search{float:none!important;width:100%}}
@media(max-width:1100px){.erp-sidebar{transform:translateX(-100%);transition:transform .2s}.erp-sidebar-open .erp-sidebar{transform:translateX(0)}.erp-workspace{width:100%;margin-left:0}.erp-menu-toggle{display:inline-grid;place-items:center}.erp-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.erp-filter-action{grid-column:span 2}}
@media(max-width:767px){.erp-topbar{height:64px;padding:0 15px}.erp-breadcrumb span,.erp-breadcrumb i{display:none}.erp-content{padding:18px 14px}.erp-filter-grid{grid-template-columns:1fr}.erp-filter-action{grid-column:auto}.erp-filter-action .btn{flex:1}.case-payment-toolbar{align-items:flex-start;flex-direction:column;width:100%}.batch-payment-item{align-items:flex-start;flex-direction:column}}

/* Customer portal: Hồ sơ / Đơn. All page-specific rules are scoped to .portal-page. */
.portal-page{--portal-primary:#2563eb;--portal-primary-light:#eff6ff;--portal-border:#e2e8f0;--portal-text:#0f172a;--portal-muted:#64748b;--portal-success:#059669;--portal-success-bg:#ecfdf5;--portal-warning:#d97706;--portal-warning-bg:#fff7ed;--portal-danger:#dc2626;--portal-danger-bg:#fef2f2;color:var(--portal-text)}
.portal-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.portal-header h4{margin:0;font-size:22px;font-weight:700;letter-spacing:-.02em}.portal-header-desc{margin:4px 0 0;color:var(--portal-muted);font-size:13px}
.portal-summary{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:14px;margin-bottom:18px}.portal-stat-card{position:relative;min-height:104px;padding:16px;text-align:left;background:#fff;border:1px solid var(--portal-border);border-radius:12px;cursor:pointer;transition:all .18s ease;overflow:hidden}.portal-stat-card:hover{transform:translateY(-2px);border-color:#bfdbfe;box-shadow:0 8px 24px rgba(15,23,42,.07)}.portal-stat-card.active{border-color:var(--portal-primary);box-shadow:0 0 0 2px rgba(37,99,235,.1)}.portal-stat-content{display:flex;align-items:center;gap:13px}.portal-stat-icon{display:flex;flex:0 0 48px;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--portal-primary-light);color:var(--portal-primary);font-size:21px}.portal-stat-card.success .portal-stat-icon{color:var(--portal-success);background:var(--portal-success-bg)}.portal-stat-card.warning .portal-stat-icon{color:var(--portal-warning);background:var(--portal-warning-bg)}.portal-stat-card.danger .portal-stat-icon{color:var(--portal-danger);background:var(--portal-danger-bg)}.portal-stat-card.payment .portal-stat-icon{color:#7e22ce;background:#f3e8ff}.portal-stat-label{display:block;color:#475569;font-size:13px;font-weight:500}.portal-stat-value{display:block;margin-top:2px;color:var(--portal-text);font-size:25px;line-height:1.15;font-weight:700}
.portal-filter-card{margin-bottom:18px;background:#fff;border:1px solid var(--portal-border);border-radius:12px;overflow:hidden}.portal-filter-header{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;background:#f8fbff;border-bottom:1px solid var(--portal-border)}.portal-filter-title{display:flex;gap:8px;align-items:center;color:#1e3a5f;font-weight:650}.portal-filter-body{padding:16px}.portal-filter-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:12px}.portal-filter-grid+.portal-filter-grid{margin-top:12px}.portal-filter-field label{display:block;margin-bottom:5px;color:#475569;font-size:12px;font-weight:600}.portal-filter-field .form-control,.portal-filter-field .form-select,.portal-filter-field .tom-select .ts-control{min-height:40px;height:40px;border-color:#d7e0eb;border-radius:7px;font-size:13px}.portal-filter-field .tom-select .ts-control{height:auto}.portal-filter-field .form-control:focus,.portal-filter-field .form-select:focus{border-color:#93c5fd;box-shadow:0 0 0 3px rgba(37,99,235,.08)}.portal-filter-actions{display:flex;gap:8px;align-items:center;margin-top:14px}.portal-filter-actions .btn{min-height:39px;border-radius:7px;font-size:13px}
.portal-selection-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:11px 14px;margin-bottom:12px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:9px}.portal-selection-info{color:#334155;font-size:13px}.portal-selection-info strong{color:#0f172a}.portal-selection-info span{color:var(--portal-primary);font-size:15px;font-weight:700}
.portal-table-card{background:#fff;border:1px solid var(--portal-border);border-radius:12px;overflow:hidden}.portal-table{margin-bottom:0;font-size:13px}.portal-table thead th{position:sticky;top:0;z-index:2;padding:11px 10px;background:#f1f5f9;border-bottom:1px solid #dbe3ee;color:#334155;font-size:11px;font-weight:700;text-transform:uppercase;white-space:nowrap;vertical-align:middle}.portal-table tbody td{padding:13px 10px;border-color:#edf1f5;vertical-align:middle}.portal-table tbody tr{transition:background .15s}.portal-table tbody tr:hover{background:#f8fbff}.portal-table-card .bootstrap-table .fixed-table-container{border:0}.portal-table-card .bootstrap-table .fixed-table-toolbar{padding:12px 12px 0;margin:0}.portal-table-card .bootstrap-table .fixed-table-toolbar .search{float:none!important;width:min(100%,360px)}.portal-table-card .fixed-table-container{border:0}
.portal-order-number{display:block;color:#075fd8;font-weight:700;text-decoration:none}.portal-order-number:hover{text-decoration:underline}.portal-order-code,.portal-cell-subtext{display:block;margin-top:3px;color:var(--portal-muted);font-size:11px}.portal-badge{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:4px 9px;border-radius:999px;font-size:11px;line-height:1.35;font-weight:600;white-space:nowrap}.portal-badge.processing{color:#1d4ed8;background:#dbeafe}.portal-badge.success{color:#047857;background:#d1fae5}.portal-badge.warning{color:#b45309;background:#fef3c7}.portal-badge.danger{color:#b91c1c;background:#fee2e2}.portal-badge.neutral{color:#475569;background:#e2e8f0}.portal-payment-value{display:block;margin-top:5px;color:#0f172a;font-size:14px;font-weight:700}
.portal-action-group{display:flex;align-items:center;gap:5px}.portal-btn-view{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:5px 11px;background:#fff;border:1px solid #cbd5e1;border-radius:6px;color:#334155;font-size:12px}.portal-btn-view:hover{border-color:#93c5fd;color:var(--portal-primary);background:#f8fbff}.portal-btn-more{width:34px;height:32px;padding:0;border:1px solid #cbd5e1;border-radius:6px;background:#fff}.portal-empty-state{padding:50px 20px;text-align:center;color:var(--portal-muted)}.portal-empty-icon{display:block;margin-bottom:10px;color:#94a3b8;font-size:36px}.portal-error{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:11px 14px;margin-bottom:14px;background:var(--portal-danger-bg);border:1px solid #fecaca;border-radius:8px;color:#b91c1c;font-size:13px}.portal-page .validation-summary-valid{display:none}.portal-page+.modal .modal-content{border:0;border-radius:12px}
.portal-page .app-pager{padding:12px 0 0;margin-top:0;border-top:0}.portal-page .app-pager-summary{font-size:12px}
@media(max-width:1400px){.portal-summary{grid-template-columns:repeat(3,1fr)}.portal-filter-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:992px){.portal-summary{grid-template-columns:repeat(2,1fr)}.portal-filter-grid{grid-template-columns:repeat(2,1fr)}.portal-table{min-width:1120px}.portal-table-card{overflow-x:auto}}
@media(max-width:576px){.portal-summary,.portal-filter-grid{grid-template-columns:1fr}.portal-header,.portal-selection-bar{align-items:stretch;flex-direction:column}.portal-filter-actions{flex-wrap:wrap}.portal-filter-actions .btn{flex:1}.portal-header .live-pill{align-self:flex-start}}

/* Phản hồi xử lý cho các thao tác thanh toán và phát hành hóa đơn. */
.portal-processing-overlay{position:fixed;z-index:2000;inset:0;display:grid;place-items:center;padding:20px;background:rgba(15,23,42,.42);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s ease}.portal-processing-overlay.is-visible{opacity:1;visibility:visible}.portal-processing-card{display:flex;align-items:center;gap:16px;min-width:min(100%,360px);padding:18px 20px;background:rgba(255,255,255,.98);border:1px solid rgba(255,255,255,.8);border-radius:16px;box-shadow:0 22px 54px rgba(15,23,42,.28);transform:translateY(8px) scale(.98);transition:transform .18s ease}.portal-processing-overlay.is-visible .portal-processing-card{transform:translateY(0) scale(1)}.portal-processing-card strong,.portal-processing-card span{display:block}.portal-processing-card strong{color:#17233c;font-size:15px}.portal-processing-card span:last-child{margin-top:3px;color:#667085;font-size:13px}.portal-processing-spinner{position:relative;display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border:3px solid #dbeafe;border-top-color:#2563eb;border-radius:50%;animation:portal-processing-spin .8s linear infinite}.portal-processing-spinner i{position:absolute;width:5px;height:5px;background:#60a5fa;border-radius:50%;animation:portal-processing-pulse 1s ease-in-out infinite}.portal-processing-spinner i:nth-child(1){transform:translateY(-10px)}.portal-processing-spinner i:nth-child(2){transform:translate(9px,5px);animation-delay:.15s}.portal-processing-spinner i:nth-child(3){transform:translate(-9px,5px);animation-delay:.3s}@keyframes portal-processing-spin{to{transform:rotate(360deg)}}@keyframes portal-processing-pulse{50%{opacity:.25;transform:scale(.55)}}@media(prefers-reduced-motion:reduce){.portal-processing-card,.portal-processing-overlay,.portal-processing-spinner,.portal-processing-spinner i{animation:none;transition:none}}