/* ============================================================
   portal.css — cong noi bo TOVINA (dang nhap 3 cap: Khach hang /
   Nhan su / Admin). Dung chung bien mau/radius/shadow tu style.css
   (:root da khai bao o do, portal.html load ca hai file).
   ============================================================ */

:root{
  --portal-sidebar-w: 264px;
  --portal-topbar-h: 64px;
  --success: #1E8E5A;
  --success-soft: #E4F5EC;
  --danger: #D64545;
  --danger-soft: #FBE7E7;
  --warning: #C98A12;
  --warning-soft: #FCF1DC;
  --info: #2F6FE4;
  --info-soft: #E7EFFD;
}

*{box-sizing:border-box;}
html,body{margin:0; padding:0;}
body.portal-body{background:var(--bg); color:var(--ink); font-family:'Be Vietnam Pro','Inter','Segoe UI',-apple-system,system-ui,sans-serif; min-height:100vh;}

/* ---------- Man dang nhap ---------- */
.portal-login-screen{min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(160deg,var(--navy-deep),var(--navy) 60%,#1A1A1A); padding:24px;}
.portal-login-card{width:min(400px,100%); background:#fff; border-radius:var(--radius-xl); box-shadow:var(--shadow-lg); padding:38px 34px;}
.portal-login-back{display:inline-flex; align-items:center; gap:4px; margin:-8px 0 20px -4px; padding:4px 8px 4px 4px; border-radius:6px; font-size:13px; font-weight:600; color:var(--muted); text-decoration:none; transition:color .15s, background .15s;}
.portal-login-back:hover,.portal-login-back:focus-visible{color:var(--accent); background:var(--bg);}
.portal-login-logo.portal-login-logo-img{display:block; margin-bottom:22px; line-height:0;}
.portal-login-logo-img img{display:block; width:240px; max-width:100%; height:auto; user-select:none;}
.portal-login-logo{display:flex; align-items:baseline; gap:8px; margin-bottom:6px; text-decoration:none;}
.portal-login-logo span:first-child{font-weight:800; font-size:22px; color:var(--navy-deep); letter-spacing:.02em;}
.portal-login-logo span:last-child{font-size:12px; color:var(--muted);}
.portal-login-card h1{font-size:19px; margin:14px 0 4px; color:var(--navy-deep);}
.portal-login-card p.sub{font-size:13.5px; color:var(--muted); margin:0 0 22px;}
.portal-login-card label{display:block; font-size:13px; font-weight:600; color:var(--ink); margin-bottom:6px;}
.portal-field{margin-bottom:16px;}
.portal-field input{width:100%; border:1px solid var(--line); border-radius:var(--radius); padding:11px 12px; font:inherit; font-size:14px; color:var(--ink);}
.portal-field input:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);}
.portal-login-submit{width:100%; background:var(--accent); color:#fff; border:none; border-radius:var(--radius); padding:12px; font-weight:700; font-size:14.5px; cursor:pointer; transition:background .15s ease;}
.portal-login-submit:hover{background:#CE5615;}
.portal-login-ok{display:none; background:#E9F6EF; color:#1F6B42; font-size:13px; padding:10px 12px; border-radius:var(--radius); margin-bottom:16px; line-height:1.5;}
.portal-login-ok.show{display:block;}
.portal-link-btn{display:block; margin:14px auto 0; background:none; border:none; padding:4px 6px; font:inherit; font-size:13px; font-weight:600; color:var(--accent); cursor:pointer;}
.portal-link-btn:hover{text-decoration:underline;}
.portal-link-btn:disabled{opacity:.5; cursor:default;}
.portal-body [hidden]{display:none !important;}
/* Trang Cai dat (Admin) */
.portal-settings-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:18px; align-items:start;}
@media (max-width:900px){ .portal-settings-grid{grid-template-columns:1fr;} }
.portal-settings-card{padding:22px 24px;}
.portal-settings-card h3{font-size:16px; margin-bottom:14px; color:var(--navy-deep);}
.portal-settings-card form{max-width:420px;}
.portal-settings-info{display:grid; gap:12px; margin:0 0 16px;}
.portal-settings-info div{display:flex; justify-content:space-between; gap:12px; padding-bottom:10px; border-bottom:1px solid var(--line);}
.portal-settings-info dt{font-size:13px; color:var(--muted);}
.portal-settings-info dd{margin:0; font-size:14px; font-weight:600; color:var(--ink);}
.portal-settings-note{font-size:12.5px; color:var(--muted); line-height:1.6; margin-bottom:14px;}
.portal-settings-save{width:auto; padding:12px 22px;}
.portal-login-error{display:none; background:var(--danger-soft); color:var(--danger); font-size:13px; padding:10px 12px; border-radius:var(--radius); margin-bottom:16px;}
.portal-login-error.show{display:block;}
.portal-login-hint{margin-top:22px; border-top:1px dashed var(--line); padding-top:16px; font-size:12.5px; color:var(--muted); line-height:1.7;}
.portal-login-hint b{color:var(--ink);}
.portal-login-hint .row{display:flex; justify-content:space-between; gap:10px;}
.portal-back-home{display:inline-flex; align-items:center; gap:6px; margin-top:18px; font-size:13px; color:rgba(255,255,255,.8); text-decoration:none;}
.portal-back-home:hover{color:#fff;}

/* ---------- App shell ---------- */
.portal-shell{display:none;}
.portal-shell.active{display:block;}

.portal-sidebar{position:fixed; top:0; left:0; bottom:0; width:var(--portal-sidebar-w); background:var(--navy-deep); color:#fff; display:flex; flex-direction:column; z-index:40; transition:transform .2s ease;}
.portal-sidebar-brand{display:flex; align-items:center; gap:10px; padding:18px 20px; border-bottom:1px solid rgba(255,255,255,.08);}
.portal-sidebar-brand .name{font-weight:800; font-size:17px; letter-spacing:.02em;}
.portal-sidebar-brand .tag{font-size:10.5px; color:rgba(255,255,255,.55); display:block; margin-top:1px;}
.portal-nav-scroll{flex:1; overflow-y:auto; padding:12px 10px 20px;}
.portal-nav-group-label{font-size:10.5px; text-transform:uppercase; letter-spacing:.08em; color:rgba(255,255,255,.4); padding:14px 10px 6px;}
.portal-nav-item{display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:var(--radius); color:rgba(255,255,255,.78); text-decoration:none; font-size:13.6px; font-weight:500; cursor:pointer; margin-bottom:2px; transition:background .12s ease,color .12s ease;}
.portal-nav-item svg{width:18px; height:18px; flex:none; stroke:currentColor; fill:none; stroke-width:1.8;}
.portal-nav-item:hover{background:rgba(255,255,255,.06); color:#fff;}
.portal-nav-item.active{background:var(--accent); color:#fff;}
/* Khoi nen muc dang chon truot giua cac muc (js/portal-nav.js - movePortalNavIndicator) */
.portal-nav-scroll{position:relative;}
.portal-nav-indicator{position:absolute; top:0; left:0; z-index:0; pointer-events:none; border-radius:var(--radius); background:var(--accent); opacity:0;
  transition:transform .38s cubic-bezier(.3,.8,.25,1), height .38s cubic-bezier(.3,.8,.25,1), width .38s cubic-bezier(.3,.8,.25,1), opacity .2s ease;}
.portal-nav-indicator.ready{opacity:1;}
.portal-nav-indicator.no-anim{transition:none;}
.portal-nav-item{position:relative; z-index:1; transition:background .15s ease, color .3s ease;}
.portal-nav-item svg{transition:color .3s ease, opacity .3s ease;}
.portal-nav-scroll:has(.portal-nav-indicator.ready) .portal-nav-item.active{background:transparent;}
@media (prefers-reduced-motion: reduce){ .portal-nav-indicator{transition:none;} }
.portal-sidebar-foot{padding:10px 20px 14px; font-size:11px; color:rgba(255,255,255,.35);}
.portal-brand-mark{width:34px; height:34px; flex:none; border-radius:9px; background:var(--grad-accent); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:17px; box-shadow:0 6px 16px -6px rgba(232,100,28,.7);}
.portal-sidebar-user{display:flex; align-items:center; gap:10px; margin:0 10px; padding:12px 10px; border-top:1px solid rgba(255,255,255,.08);}
.portal-sidebar-user:empty{display:none;}
.portal-sidebar-user .portal-user-avatar{background:rgba(255,255,255,.12); flex:none;}
.portal-sidebar-user-text{min-width:0; display:flex; flex-direction:column; line-height:1.3;}
.portal-sidebar-user-text b{font-size:13px; font-weight:600; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.portal-sidebar-user-text span{font-size:11.5px; color:rgba(255,255,255,.5);}
.portal-page-crumb{font-weight:500; color:var(--muted); opacity:.75;}
.portal-page-crumb::after{content:'/'; margin:0 8px; opacity:.6;}
.portal-theme-btn{display:flex; align-items:center; gap:6px; white-space:nowrap; flex:none; border:1px solid var(--line); background:#fff; border-radius:var(--radius); padding:7px 12px; font:inherit; font-size:12.5px; font-weight:600; color:var(--ink); cursor:pointer;}
.portal-theme-btn:hover{border-color:var(--accent); color:var(--accent);}
.portal-theme-btn .i-sun{display:none;}
.portal-theme-btn[aria-pressed="true"] .i-sun{display:inline;}
.portal-theme-btn[aria-pressed="true"] .i-moon{display:none;}

.portal-main{margin-left:var(--portal-sidebar-w); min-height:100vh;}
.portal-topbar{height:var(--portal-topbar-h); display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 26px; background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:30;}
.portal-topbar-left{display:flex; align-items:center; gap:14px; flex:none;}
.portal-menu-toggle{display:none; width:36px; height:36px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; align-items:center; justify-content:center; cursor:pointer;}
.portal-page-title{font-size:16.5px; font-weight:700; color:var(--navy-deep); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.portal-topbar-right{display:flex; align-items:center; gap:14px; min-width:0; flex:0 1 auto;}
.portal-role-badge{font-size:11px; font-weight:700; padding:4px 10px; border-radius:20px; text-transform:uppercase; letter-spacing:.03em; white-space:nowrap; flex:none;}
.portal-role-badge.role-customer{background:var(--info-soft); color:var(--info);}
.portal-role-badge.role-staff{background:var(--warning-soft); color:var(--warning);}
.portal-role-badge.role-admin{background:var(--accent-soft); color:var(--accent);}
.portal-role-badge.role-accountant{background:var(--success-soft); color:var(--success);}
.portal-user-avatar{width:32px; height:32px; border-radius:50%; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700;}
.portal-logout-btn{display:flex; align-items:center; gap:6px; white-space:nowrap; flex:none; border:1px solid var(--line); background:#fff; border-radius:var(--radius); padding:7px 12px; font-size:12.5px; font-weight:600; color:var(--muted); cursor:pointer;}
.portal-logout-btn:hover{border-color:var(--danger); color:var(--danger);}
.portal-logout-btn svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2;}

.portal-content{padding:26px; max-width:1320px;}
.portal-page{display:none; padding:0;} /* style.css dat section{padding:90px 0} cho web chinh */
.portal-page.active{display:block; animation:portalPageIn .26s cubic-bezier(.2,.7,.2,1) both;}
.portal-page.is-leaving{opacity:0; transform:translateY(4px); transition:opacity .15s ease, transform .15s ease;}
@keyframes portalPageIn{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;}}
@media (prefers-reduced-motion: reduce){
  .portal-page.active{animation:none;}
  .portal-page.is-leaving{transition:none;}
}

/* ---------- Elementos comuns ---------- */
.portal-breadcrumb{font-size:12.5px; color:var(--muted); margin-bottom:4px;}
.portal-page-head{display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:20px; flex-wrap:wrap;}
.portal-page-head h2{margin:0; font-size:21px; color:var(--navy-deep);}
.portal-page-head p{margin:4px 0 0; font-size:13.5px; color:var(--muted);}
.portal-primary-btn{background:var(--accent); color:#fff; border:none; border-radius:var(--radius); padding:10px 18px; font-weight:700; font-size:13.5px; cursor:pointer; white-space:nowrap;}
.portal-primary-btn:hover{background:#CE5615;}
.portal-ghost-btn{background:#fff; border:1px solid var(--line); color:var(--ink); border-radius:var(--radius); padding:9px 14px; font-weight:600; font-size:13px; cursor:pointer;}

.portal-mock-banner{display:flex; align-items:center; gap:9px; background:var(--info-soft); color:#22508F; font-size:12.5px; padding:10px 14px; border-radius:var(--radius); margin-bottom:18px;}
.portal-mock-banner svg{width:16px; height:16px; flex:none; stroke:currentColor; fill:none; stroke-width:2;}

.portal-kpi-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-bottom:22px;}
.portal-kpi-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:18px 20px;}
.portal-kpi-card .label{font-size:12px; color:var(--muted); margin-bottom:8px;}
.portal-kpi-card .value{font-size:22px; font-weight:800; color:var(--navy-deep);}
.portal-kpi-card .delta{font-size:11.5px; margin-top:6px; font-weight:600;}
.portal-kpi-card .delta.up{color:var(--success);}
.portal-kpi-card .delta.down{color:var(--danger);}

.portal-panel{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden;}
.portal-filter-bar{display:flex; flex-wrap:wrap; gap:10px; padding:16px 18px; border-bottom:1px solid var(--line); align-items:center;}
.portal-filter-bar input[type="text"],.portal-filter-bar input[type="search"]{border:1px solid var(--line); border-radius:var(--radius); padding:8px 12px; font-size:13px; min-width:200px; font:inherit;}
.portal-filter-bar select{border:1px solid var(--line); border-radius:var(--radius); padding:8px 10px; font-size:13px; font:inherit; background:#fff;}

.portal-table-wrap{overflow-x:auto;}
table.portal-table{width:100%; border-collapse:collapse; font-size:13.3px;}
table.portal-table th{text-align:left; padding:11px 16px; background:var(--bg); color:var(--muted); font-weight:700; font-size:11.5px; text-transform:uppercase; letter-spacing:.03em; white-space:nowrap; border-bottom:1px solid var(--line);}
table.portal-table td{padding:12px 16px; border-bottom:1px solid var(--line); color:var(--ink); white-space:nowrap;}
table.portal-table tbody tr:last-child td{border-bottom:none;}
table.portal-table tbody tr:hover{background:#FAFAFA;}
.portal-table-empty{padding:40px 20px; text-align:center; color:var(--muted); font-size:13.5px;}

.portal-badge{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700; padding:4px 10px; border-radius:20px;}
.portal-badge.ok{background:var(--success-soft); color:var(--success);}
.portal-badge.warn{background:var(--warning-soft); color:var(--warning);}
.portal-badge.danger{background:var(--danger-soft); color:var(--danger);}
.portal-badge.info{background:var(--info-soft); color:var(--info);}
.portal-badge.muted{background:var(--bg); color:var(--muted);}

/* ---------- The tai khoan dau trang Tong quan (thay loi chao) ---------- */
.portal-identity{display:flex; align-items:center; gap:16px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:18px 22px; margin-bottom:20px;}
.portal-identity-avatar{width:52px; height:52px; flex:none; border-radius:50%; background:var(--navy); color:#fff; display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:800; letter-spacing:.02em;}
.portal-identity-text{min-width:0;}
.portal-identity-name{font-size:17px; font-weight:800; color:var(--navy-deep); line-height:1.4; overflow-wrap:anywhere;}
.portal-identity-meta{display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; margin-top:6px; font-size:12.5px; color:var(--muted);}
.portal-identity-meta strong{color:var(--ink); font-weight:600;}
.portal-identity-sub{font-size:13px; color:var(--muted); margin-top:6px;}
@media (max-width:640px){
  .portal-identity{align-items:flex-start; padding:16px;}
  .portal-identity-avatar{width:42px; height:42px; font-size:15px;}
  .portal-identity-name{font-size:15.5px;}
}

/* ---------- Don hang cua toi: 1 khung / 1 lan dat (bo cuc chung tu) ---------- */
.mo-list{display:grid; gap:20px;}
.mo-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 24px -16px rgba(0,0,0,.18); overflow:hidden; font-variant-numeric:tabular-nums;}
.mo-eyebrow,.mo-label{font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted);}

.mo-head{display:flex; justify-content:space-between; align-items:flex-start; gap:20px; flex-wrap:wrap; padding:20px 24px; border-bottom:1px solid var(--line); border-top:3px solid var(--navy);}
.mo-head-main{min-width:0;}
.mo-title{display:flex; align-items:center; flex-wrap:wrap; gap:8px 10px; margin:4px 0 6px;}
.mo-code{font-size:18px; font-weight:800; color:var(--navy-deep); letter-spacing:.01em;}
.mo-meta{display:flex; align-items:center; flex-wrap:wrap; gap:8px; font-size:13px; color:var(--muted);}
.mo-meta span{display:inline-flex; align-items:center; gap:6px;}
.mo-meta svg{width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round;}
.mo-dot{width:3px; height:3px; border-radius:50%; background:currentColor; opacity:.5;}
.mo-head-total{text-align:right;}
.mo-head-amount{font-size:22px; font-weight:800; color:var(--navy-deep); margin-top:4px; line-height:1.2;}
.mo-head-note{font-size:12px; color:var(--muted); margin-top:2px;}

.mo-info{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px 24px; padding:16px 24px; background:var(--bg); border-bottom:1px solid var(--line);}
.mo-info-item{min-width:0;}
.mo-value{font-size:13.5px; color:var(--ink); margin-top:3px; overflow-wrap:anywhere;}

.mo-table-wrap{overflow-x:auto;}
table.mo-table{width:100%; border-collapse:collapse; font-size:13.3px;}
table.mo-table th{padding:10px 14px; text-align:left; font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); border-bottom:1px solid var(--line); white-space:nowrap; background:#fff;}
table.mo-table td{padding:14px; border-bottom:1px solid var(--line); color:var(--ink); vertical-align:top; white-space:nowrap;}
table.mo-table tbody tr:last-child td{border-bottom:none;}
table.mo-table th:first-child,table.mo-table td:first-child{padding-left:24px;}
table.mo-table th:last-child,table.mo-table td:last-child{padding-right:24px;}
table.mo-table .c-idx{width:1%; color:var(--muted);}
table.mo-table .c-num{text-align:right;}
table.mo-table .c-strong{font-weight:700; color:var(--navy-deep);}
table.mo-table .c-prod{white-space:normal; min-width:240px; width:40%;}
.mo-prod-name{font-weight:600; color:var(--navy-deep); line-height:1.4;}
.mo-prod-sub{font-size:12px; color:var(--muted); margin-top:3px; line-height:1.4;}
.mo-unit{display:block; font-size:11.5px; color:var(--muted); margin-top:2px;}
.mo-vat-chip{display:inline-block; font-size:11.5px; font-weight:700; padding:2px 8px; border-radius:20px; background:var(--info-soft); color:var(--info);}

.mo-foot{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; padding:18px 24px 20px; border-top:1px solid var(--line); background:var(--bg);}
.mo-refs{min-width:0; max-width:520px;}
.mo-ref-list{display:flex; flex-wrap:wrap; gap:6px; margin-top:6px;}
.mo-ref{font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11.5px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:4px; padding:2px 7px;}
.mo-sum{min-width:300px; display:grid; gap:7px;}
.mo-sum-row{display:flex; justify-content:space-between; gap:32px; font-size:13.5px; color:var(--muted);}
.mo-sum-row span:last-child{color:var(--ink); font-weight:600;}
.mo-sum-total{margin-top:4px; padding-top:10px; border-top:1px solid var(--line); font-size:15px; font-weight:800; color:var(--navy-deep);}
.mo-sum-total span:last-child{font-size:17px; font-weight:800; color:var(--accent);}

@media (max-width:640px){
  .mo-head,.mo-info,.mo-foot{padding-left:16px; padding-right:16px;}
  .mo-head-total{text-align:left;}
  table.mo-table th:first-child,table.mo-table td:first-child{padding-left:16px;}
  table.mo-table th:last-child,table.mo-table td:last-child{padding-right:16px;}
  .mo-sum{min-width:0; width:100%;}
}

/* ---------- Bao cao Ke toan (bieu do SVG - js/portal-charts.js) ----------
   Mark spec: cot <=24px, bo 4px o dau du lieu; luoi/truc hairline lien;
   chu dung mau chu (khong dung mau du lieu). */
.acct-kpi-note{font-size:11.5px; color:var(--muted); margin-top:6px; line-height:1.45;}
.acct-filter-row{display:flex; align-items:center; gap:12px; margin:0 0 12px;}
.acct-filter-label{font-size:12.5px; font-weight:600; color:var(--muted);}
.acct-seg{display:inline-flex; border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:2px;}
.acct-seg button{border:0; background:transparent; font:inherit; font-size:12.5px; font-weight:600; color:var(--muted); padding:6px 14px; border-radius:4px; cursor:pointer;}
.acct-seg button:hover{background:var(--bg); color:var(--ink);}
.acct-seg button.active{background:var(--navy-deep); color:#fff;}
.acct-panel{margin-bottom:16px;}
.acct-panel-head{display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding:16px 18px 10px;}
.acct-panel-title{font-size:14px; font-weight:700; color:var(--navy-deep);}
.acct-panel-sub{font-size:12px; color:var(--muted); margin-top:3px;}
.acct-view-btn{flex:none; border:1px solid var(--line); background:#fff; border-radius:var(--radius); padding:6px 12px; font:inherit; font-size:12px; font-weight:600; color:var(--ink); cursor:pointer;}
.acct-view-btn:hover{border-color:var(--navy);}
.acct-legend{display:flex; flex-wrap:wrap; gap:6px 18px; padding:0 18px 4px; font-size:12px; color:var(--muted);}
.acct-legend span{display:inline-flex; align-items:center; gap:7px;}
.acct-legend i{width:12px; height:12px; border-radius:3px; display:inline-block;}
.acct-chart-view{padding:4px 12px 12px;}
.acct-table-view{display:none; border-top:1px solid var(--line);}
.acct-panel.show-table .acct-chart-view,.acct-panel.show-table .acct-legend{display:none;}
.acct-panel.show-table .acct-table-view{display:block;}
.acct-chart-view svg{display:block; max-width:100%; overflow:visible;}
.acct-chart-view .acct-grid{stroke:#EEEEEE; stroke-width:1;}
.acct-chart-view .acct-axis{stroke:#CCCCCC; stroke-width:1;}
.acct-chart-view .acct-tick{font-size:11px; fill:var(--muted); font-variant-numeric:tabular-nums;}
.acct-chart-view .acct-value{font-size:11.5px; font-weight:700; fill:var(--ink);}
.acct-chart-view .acct-hit{fill:transparent; cursor:default; outline:none;}
.acct-chart-view .acct-hit:hover,.acct-chart-view .acct-hit:focus{fill:rgba(0,0,0,.04);}
.acct-grid-2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.acct-grid-2 .acct-panel{margin-bottom:16px;}
.acct-bars{display:grid; gap:4px; padding:6px 18px 18px;}
.acct-bar-row{display:grid; grid-template-columns:minmax(0,46%) 1fr; align-items:center; gap:16px; padding:10px 8px; border-radius:6px; border-bottom:1px solid var(--line); outline:none;}
.acct-bar-row:last-child{border-bottom:0;}
.acct-bar-row:hover,.acct-bar-row:focus{background:var(--bg);}
/* Ten cong ty day du, cho phep xuong dong (khong cat "...") */
.acct-bar-name{font-size:15px; font-weight:600; line-height:1.4; color:var(--ink); white-space:normal; overflow-wrap:anywhere;}
.acct-bar-code{font-size:13px; font-weight:400; color:var(--muted); margin-top:3px; font-variant-numeric:tabular-nums;}
.acct-bar-track{display:flex; align-items:center; gap:10px; min-width:0;}
.acct-bar-fill{height:22px; border-radius:0 4px 4px 0; flex:none; max-width:calc(100% - 84px);}
.acct-bar-value{font-size:15px; font-weight:700; color:var(--ink); white-space:nowrap; font-variant-numeric:tabular-nums;}
@media (max-width:640px){
  .acct-bar-row{grid-template-columns:1fr; gap:8px;}
}
table.acct-num-table th.num,table.acct-num-table td.num{text-align:right; font-variant-numeric:tabular-nums;}
table.acct-num-table tr.acct-total-row td{font-weight:700; background:var(--bg);}
.acct-footnote{font-size:12px; color:var(--muted); margin:4px 2px 0; line-height:1.55;}
.acct-tip{position:fixed; z-index:1000; display:none; pointer-events:none; background:#fff; border:1px solid var(--line); border-radius:8px; box-shadow:0 8px 24px -8px rgba(0,0,0,.25); padding:10px 12px; font-size:12.5px; min-width:180px; max-width:min(440px, calc(100vw - 16px));}
.acct-tip-title{font-weight:700; color:var(--navy-deep); margin-bottom:6px;}
.acct-tip-row{display:flex; align-items:center; gap:8px; margin-top:3px;}
.acct-tip-key{width:12px; height:3px; border-radius:2px; flex:none;}
.acct-tip-row strong{color:var(--ink); font-variant-numeric:tabular-nums; white-space:nowrap;}
.acct-tip-label{color:var(--muted);}
@media (max-width:900px){ .acct-grid-2{grid-template-columns:1fr;} }

/* ---------- Thong ke / Bao cao (Admin) - js/portal-report.js ---------- */
.rpt-loading{padding:30px 0; text-align:center; color:var(--muted); font-size:13.5px;}
.rpt-toolbar{display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px 20px; margin:0 0 8px;}
.rpt-field{display:flex; flex-direction:column; gap:5px;}
.rpt-field > span{font-size:12px; font-weight:600; color:var(--muted);}
.rpt-field select{border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:7px 10px; font:inherit; font-size:13px; min-width:150px;}
.rpt-check{display:inline-flex; align-items:center; gap:7px; font-size:13px; color:var(--ink); padding-bottom:7px; cursor:pointer;}
.rpt-source{font-size:12px; color:var(--muted); margin:0 0 12px;}
.rpt-warn{background:var(--warning-soft); border-radius:var(--radius); padding:10px 14px; margin:0 0 14px; font-size:13px; color:#6b4a06; display:grid; gap:6px;}
.rpt-warn > div{display:flex; gap:8px; align-items:flex-start;}
.rpt-warn svg{width:16px; height:16px; flex:none; stroke:currentColor; fill:none; stroke-width:2; margin-top:1px;}
.rpt-kpis .value{font-size:20px;}
.rpt-kpis .delta{font-weight:600; color:var(--muted);}
table.acct-num-table tr.rpt-strong td{font-weight:700;}
table.acct-num-table tr.rpt-memo td{background:var(--bg); font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--muted);}
.rpt-indent{padding-left:18px; display:inline-block;}
td.rpt-indent{padding-left:34px !important;}
.rpt-muted{font-size:12px; color:var(--muted);}
.rpt-wrap{white-space:normal !important; min-width:160px;}
.rpt-th-sub{font-size:10.5px; font-weight:500; text-transform:none; letter-spacing:0;}
.rpt-note{font-size:12.5px; color:var(--muted); padding:10px 16px 14px;}
.rpt-flow-wrap{padding:0 18px 12px;}
.rpt-subtitle{font-size:12px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; margin:2px 0 6px;}
table.rpt-flow{border:1px solid var(--line); border-radius:var(--radius); max-width:720px;}
table.rpt-flow td{padding:8px 14px;}
.rpt-expand{width:24px; height:24px; border:1px solid var(--line); border-radius:4px; background:#fff; font:inherit; font-weight:700; line-height:1; color:var(--navy-deep); cursor:pointer;}
.rpt-expand:hover{border-color:var(--navy);}
.rpt-obj-name{font-weight:600; white-space:normal; min-width:220px; line-height:1.4;}
tr.rpt-detail > td{background:var(--bg); padding-top:4px; padding-bottom:12px;}
table.rpt-entries{background:#fff; border:1px solid var(--line); border-radius:var(--radius);}
table.rpt-entries td{white-space:normal; vertical-align:top;}
.rpt-doc-lines{margin-top:4px; font-size:12px; color:var(--muted); line-height:1.55;}
tr.rpt-gap td{color:#6b4a06; background:var(--warning-soft);}
tr.rpt-row-warn td{background:var(--warning-soft);}
.rpt-kpi-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; margin-bottom:16px;}
.rpt-kpi{position:relative; display:flex; flex-direction:column;}
.rpt-kpi .value{font-size:24px; font-variant-numeric:tabular-nums;}
.rpt-kpi .delta{color:var(--muted); font-weight:600;}
.rpt-spark{margin-top:auto; padding-top:10px;}
.rpt-spark svg{display:block; max-width:100%;}
.rpt-pad{padding:4px 18px 0;}
.rpt-chart-view .rpt-tick-strong,.acct-chart-view .rpt-tick-strong{font-weight:700; fill:var(--ink);}
.rpt-div{display:grid; gap:2px; padding:4px 18px 16px;}
.rpt-div-row{display:grid; grid-template-columns:minmax(0,34%) 1fr minmax(0,26%); align-items:center; gap:14px; padding:9px 6px; border-radius:6px; outline:none;}
.rpt-div-row:hover,.rpt-div-row:focus{background:var(--bg);}
.rpt-div-total{border-top:1px solid var(--line); margin-top:4px; padding-top:12px; font-weight:700;}
.rpt-div-label{font-size:13.5px; font-weight:600; line-height:1.35;}
.rpt-div-track{position:relative; height:20px;}
.rpt-div-zero{position:absolute; top:-4px; bottom:-4px; width:1px; background:#BBBBBB;}
.rpt-div-fill{position:absolute; top:0; bottom:0; border-radius:3px;}
.rpt-div-value{text-align:right; font-size:13.5px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap;}
.rpt-div-value .rpt-muted{font-weight:500;}
.rpt-bars{display:grid; gap:2px; padding:4px 18px 16px;}
.rpt-bar-row{display:grid; grid-template-columns:minmax(0,44%) 1fr; align-items:center; gap:14px; padding:8px 6px; border-radius:6px; border-bottom:1px solid var(--line); outline:none;}
.rpt-bar-row:last-child{border-bottom:0;}
.rpt-bar-row:hover,.rpt-bar-row:focus{background:var(--bg);}
.rpt-bar-name{font-size:13.5px; font-weight:600; line-height:1.35; overflow-wrap:anywhere;}
.rpt-bar-track{display:flex; align-items:center; gap:8px; min-width:0;}
.rpt-bar-fill{height:18px; border-radius:0 4px 4px 0; flex:none; max-width:calc(100% - 70px);}
.rpt-bar-value{font-size:13px; font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums;}
.rpt-section-title{font-size:15px; color:var(--navy-deep); margin:26px 0 10px;}
/* Muc luc dinh + tieu de phan danh so (trang Thong ke / Bao cao) */
.rpt-secnav{position:sticky; top:var(--portal-topbar-h); z-index:20; display:flex; gap:6px; overflow-x:auto; scrollbar-width:none;
  margin:4px -26px 6px; padding:10px 26px; background:rgba(245,245,245,.88); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border-bottom:1px solid var(--line);}
.rpt-secnav::-webkit-scrollbar{display:none;}
.rpt-secnav a{flex:none; padding:7px 14px; border-radius:999px; font-size:13px; font-weight:600; color:var(--muted); text-decoration:none; border:1px solid transparent; transition:background .15s,color .15s,border-color .15s;}
.rpt-secnav a:hover{color:var(--ink); background:rgba(0,0,0,.04);}
.rpt-secnav a.active{color:var(--accent); background:var(--accent-soft); border-color:rgba(232,100,28,.25);}
.rpt-sec{display:flex; align-items:flex-start; gap:14px; margin:38px 0 16px; scroll-margin-top:calc(var(--portal-topbar-h) + 70px);}
.rpt-sec.rpt-sec-first{margin-top:22px;}
.rpt-sec-num{flex:none; min-width:38px; height:28px; padding:0 8px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center;
  font-size:12.5px; font-weight:800; letter-spacing:.04em; color:var(--accent); background:var(--accent-soft); font-variant-numeric:tabular-nums; margin-top:1px;}
.rpt-sec h3{margin:0; font-size:19px; font-weight:800; letter-spacing:-.01em; color:var(--navy-deep); line-height:1.3;}
.rpt-sec p{margin:3px 0 0; font-size:13.5px; color:var(--muted); line-height:1.5;}

/* Chu, khung, bang - de doc hon (dung chung moi trang trong cong) */
.portal-content{line-height:1.5;}
.acct-panel-head{padding:18px 20px 12px;}
.acct-panel-title{font-size:15px; font-weight:700; letter-spacing:-.005em; line-height:1.35;}
.acct-panel-sub{font-size:12.5px; line-height:1.5; max-width:78ch;}
.portal-page-head p{max-width:90ch; line-height:1.5;}
table.portal-table{font-size:13.6px;}
table.portal-table td{padding:12px 14px; line-height:1.45;}
table.portal-table th{padding:11px 14px; white-space:normal; vertical-align:bottom; line-height:1.35; min-width:72px;}
table.portal-table tbody tr:nth-child(even) td{background:rgba(0,0,0,.018);}
table.portal-table tbody tr:hover td{background:rgba(232,100,28,.045);}
table.portal-table td strong{font-weight:700;}
table.portal-table td.adm-wrap{white-space:normal; overflow-wrap:anywhere; min-width:200px; max-width:320px;}
.portal-kpi-card .value{font-variant-numeric:tabular-nums; letter-spacing:-.01em;}
.acct-footnote{max-width:110ch;}
/* Tom tat tinh hinh kinh doanh (dau trang Thong ke / Bao cao) */
.rpt-exec{padding:20px 22px; margin-bottom:16px;}
.rpt-exec-head{margin-bottom:14px;}
.rpt-exec-verdict{margin-top:8px; padding:10px 14px; border-radius:var(--radius); font-size:15px; font-weight:600; line-height:1.45;}
.rpt-exec-verdict.good{background:var(--success-soft); color:#14603D;}
.rpt-exec-verdict.bad{background:var(--danger-soft); color:#8E2323;}
.rpt-exec-verdict.flat{background:#F1F3F6; color:var(--ink);}
.rpt-trend{display:inline-block; margin-right:10px; padding:2px 10px; border-radius:999px; font-size:13px; font-weight:800; color:#fff; vertical-align:1px;}
.rpt-trend.up{background:var(--success);}
.rpt-trend.down{background:var(--danger);}
.rpt-trend.flat{background:#7A8494;}
.acct-legend .rpt-legend-line{height:3px; border-radius:2px; width:18px; align-self:center;}
.acct-legend .rpt-legend-line.dashed{height:0; border-radius:0; border-top:3px dashed currentColor; background:none;}
.acct-chart-view .acct-value-sm{font-size:10px; font-weight:600; fill:var(--muted);}
.rpt-exec-q{width:100%; border-collapse:collapse; margin-top:12px; font-size:13px; font-variant-numeric:tabular-nums;}
.rpt-exec-q th{font-size:11.5px; font-weight:600; color:var(--muted); text-align:right; padding:4px 6px; border-bottom:1px solid var(--line);}
.rpt-exec-q td{text-align:right; padding:6px; border-bottom:1px dashed var(--line); white-space:nowrap;}
.rpt-exec-q th:first-child,.rpt-exec-q td:first-child{text-align:left; font-weight:600;}
.rpt-exec-q tr:last-child td{border-bottom:0;}
.rpt-exec-q .up{color:var(--success); font-weight:700;}
.rpt-exec-q .down{color:var(--danger); font-weight:700;}
.rpt-verdict-line{display:flex; align-items:baseline; gap:10px;}
.rpt-verdict-line + .rpt-verdict-line{margin-top:7px; padding-top:7px; border-top:1px solid rgba(0,0,0,.07);}
.rpt-verdict-line .rpt-trend{flex:none; margin-right:0;}
.rpt-exec-cap{margin-top:0;}
.rpt-exec-cap td:first-child{font-weight:500; white-space:normal;}
.rpt-exec-cap tr.rpt-exec-cap-total td{border-top:1px solid var(--ink); border-bottom:0; font-weight:700; padding-top:8px;}
.rpt-exec-foot{font-size:11.5px; color:var(--muted); margin:4px 0 14px;}
.rpt-bridge-note{font-size:13px; color:var(--muted); line-height:1.5; padding-bottom:12px;}
.rpt-batch-tiles{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:6px 18px 10px;}
.rpt-batch-tiles > div{border:1px solid var(--line); border-radius:var(--radius); padding:10px 12px; display:flex; flex-direction:column; gap:2px;}
.rpt-batch-tiles span{font-size:12px; color:var(--muted); font-weight:600;}
.rpt-batch-tiles b{font-size:19px; color:var(--navy-deep); font-variant-numeric:tabular-nums;}
.rpt-batch-tiles small{font-size:11.5px; color:var(--muted);}
.rpt-batch-tiles .good b{color:var(--success);}
td.rpt-neg{color:var(--danger);}
.rpt-batch-tiles .warn b{color:var(--warning, #b7791f);}
.rpt-payback{margin-top:16px;}
.rpt-pay-more > summary{list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:6px; margin:0 18px 16px; padding:7px 14px; border:1px solid var(--line); border-radius:8px; font-size:13px; font-weight:600; color:var(--navy-deep); transition:background .15s, border-color .15s;}
.rpt-pay-more > summary::-webkit-details-marker{display:none;}
.rpt-pay-more > summary::after{content:''; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateY(-2px) rotate(45deg); transition:transform .2s;}
.rpt-pay-more[open] > summary::after{transform:translateY(2px) rotate(-135deg);}
.rpt-pay-more > summary:hover{border-color:var(--orange, #f07c1e);}
.rpt-pay-more .when-open,.rpt-pay-more[open] .when-closed{display:none;}
.rpt-pay-more[open] .when-open{display:inline;}
.rpt-payback .rpt-scroll{max-height:560px; overflow:auto;}
.rpt-pay-table thead th{position:sticky; top:0; z-index:1;}
.rpt-pay-table b.rpt-pos{color:var(--success);}
.rpt-pay-table b.rpt-neg{color:var(--danger);}
.rpt-pay-bar{height:5px; margin:5px 0 0 auto; width:96px; max-width:100%; border-radius:3px; background:var(--line); overflow:hidden;}
.rpt-pay-bar i{display:block; height:100%; background:var(--success); border-radius:3px;}
.rpt-pay-tag{display:inline-block; padding:3px 9px; border-radius:999px; font-size:12px; font-weight:600; white-space:nowrap; background:var(--line); color:var(--muted);}
.rpt-pay-tag.good{background:rgba(34,160,90,.13); color:var(--success);}
.rpt-pay-tag.warn{background:rgba(214,140,20,.15); color:#b7791f;}
.rpt-pay-tag.bad{background:rgba(214,69,69,.13); color:var(--danger);}
.adm-table-title{font-size:13px; font-weight:700; color:var(--navy-deep); margin-left:auto;}
.portal-filter-bar select.js-adm-month{height:38px; padding:0 10px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; font:inherit; font-size:13.5px;}
@media (max-width:1200px){ .rpt-batch-tiles{grid-template-columns:repeat(2,minmax(0,1fr));} }
.rpt-exec-tiles{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:18px;}
.rpt-exec-tile{border:1px solid var(--line); border-radius:var(--radius); padding:12px 14px;}
.rpt-exec-tile-label{font-size:12.5px; color:var(--muted); font-weight:600;}
.rpt-exec-tile-value{font-size:24px; margin:4px 0 2px; font-variant-numeric:tabular-nums; color:var(--navy-deep);}
.rpt-exec-tile-note{font-size:12.5px; color:var(--muted);}
.rpt-exec-tile.good .rpt-exec-tile-value{color:var(--success);}
.rpt-exec-tile.bad .rpt-exec-tile-value{color:var(--danger);}
.rpt-exec-body{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:22px;}
.rpt-exec-body .acct-legend{padding:4px 0 0;}
.rpt-exec-sub{font-size:13px; font-weight:700; color:var(--navy-deep); margin:0 0 6px;}
#rpt-exec-chart.acct-chart-view{padding:4px 0 0;}
.rpt-exec-pos{display:grid; gap:2px; margin-bottom:16px; font-size:13.5px;}
.rpt-exec-pos > div{display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:5px 0; border-bottom:1px dashed var(--line); font-variant-numeric:tabular-nums;}
.rpt-exec-pos small{display:block; color:var(--muted); font-size:12px;}
.rpt-exec-pos-total{border-bottom:0 !important; font-weight:700;}
.rpt-exec-notes{list-style:none; margin:0; padding:0; display:grid; gap:7px; font-size:13.5px; line-height:1.5;}
.rpt-exec-notes li{position:relative; padding-left:18px;}
.rpt-exec-notes li::before{content:''; position:absolute; left:2px; top:7px; width:8px; height:8px; border-radius:50%; background:var(--info);}
.rpt-exec-notes li.warn::before{background:var(--warning);}
.rpt-exec-notes li.good::before{background:var(--success);}
@media (max-width:980px){
  .rpt-exec-tiles{grid-template-columns:repeat(2,minmax(0,1fr));}
  .rpt-exec-body{grid-template-columns:1fr;}
}
.rpt-details{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); margin-bottom:10px;}
.rpt-details > summary{display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; padding:14px 18px; cursor:pointer; list-style:none;}
.rpt-details > summary::-webkit-details-marker{display:none;}
.rpt-details > summary::before{content:'+'; display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border:1px solid var(--line); border-radius:4px; font-weight:700; color:var(--navy-deep); flex:none; align-self:center;}
.rpt-details[open] > summary::before{content:'−';}
.rpt-details[open] > summary{border-bottom:1px solid var(--line);}
.rpt-details-title{font-size:14px; font-weight:700; color:var(--navy-deep);}
.rpt-details-body > .portal-panel{border:0; margin:0; border-radius:0;}
.rpt-details-body > .portal-panel > .acct-panel-head{display:none;}
@media (max-width:640px){
  .rpt-div-row{grid-template-columns:1fr; gap:6px;}
  .rpt-div-value{text-align:left;}
  .rpt-bar-row{grid-template-columns:1fr; gap:6px;}
}
.rpt-src{display:inline-block; font-size:10.5px; font-weight:700; padding:1px 6px; border-radius:10px; vertical-align:1px; letter-spacing:.02em;}
.rpt-src-web{background:var(--info-soft); color:var(--info);}
.rpt-src-excel{background:var(--success-soft); color:var(--success);}
.rpt-src-manual{background:var(--warning-soft); color:var(--warning);}
tr.rpt-opening td{background:#F4F7FB;}
table.rpt-cov-table td,table.rpt-cov-table th{padding:8px 10px;}
table.rpt-cov-table td:first-child{white-space:nowrap; font-weight:600; font-size:12.5px;}
td.rpt-cov{text-align:center; font-size:11px; font-weight:700; border-left:2px solid #fff;}
.rpt-cov-excel{background:var(--success-soft); color:var(--success);}
.rpt-cov-web{background:var(--info-soft); color:var(--info);}
.rpt-cov-snap{background:#EEF0F3; color:#5B6573;}
.rpt-cov-none{background:#FAFAFA; color:#C4C4C4;}
.rpt-cov-pend{background:var(--warning-soft); color:var(--warning);}
td.rpt-cov-num{text-align:right; white-space:nowrap; font-size:12px; font-variant-numeric:tabular-nums;}
table.rpt-cov-table td.rpt-cov-neg{color:var(--danger);}
.rpt-guide{margin:0 18px 12px; padding:12px 16px; border-radius:var(--radius); background:var(--info-soft); font-size:13px; line-height:1.6; color:var(--ink);}
.rpt-guide-title{font-weight:700; color:var(--navy-deep); margin-bottom:4px;}
.rpt-guide ol{margin:0; padding-left:20px;}
.rpt-cov-legend{display:flex; flex-wrap:wrap; gap:6px 18px; padding:10px 18px 4px; font-size:12px; color:var(--muted);}
.rpt-cov-legend span{display:inline-flex; align-items:center; gap:6px;}
.rpt-cov-legend i{width:14px; height:14px; border-radius:3px; display:inline-block; border:1px solid var(--line);}
.rpt-imp{margin:12px 18px; padding:16px; border:1px dashed var(--navy); border-radius:var(--radius-lg); background:#FBFCFE;}
.rpt-imp-row{display:flex; flex-wrap:wrap; gap:12px 20px; align-items:flex-end;}
.rpt-field input{border:1px solid var(--line); border-radius:var(--radius); background:#fff; padding:7px 10px; font:inherit; font-size:13px;}
.rpt-imp-help{margin-top:12px; font-size:12.5px; color:var(--muted); line-height:1.7;}
.rpt-imp-help strong{color:var(--ink);}
.rpt-imp-result{margin-top:14px;}
.rpt-imp-map{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:10px 14px; margin-bottom:12px;}
.rpt-imp-map select{min-width:0; width:100%;}
.rpt-imp-map select.rpt-miss{border-color:var(--danger); background:var(--danger-soft);}
.rpt-imp-stats{display:flex; flex-wrap:wrap; gap:6px 18px; font-size:13px; margin:6px 0 8px;}
.rpt-imp-actions{display:flex; align-items:center; gap:12px; margin-top:12px;}
.rpt-imp-actions button:disabled{opacity:.5; cursor:not-allowed;}
.rpt-imp-msg{font-size:12.5px; color:var(--muted);}
.rpt-imp-bottom{padding:4px 18px 14px;}
.rpt-imp-sub{border-top:1px solid var(--line); padding:10px 0 0; margin-top:10px;}
.rpt-imp-sub > summary{cursor:pointer; font-size:13px; font-weight:700; color:var(--navy-deep);}
.rpt-imp-manual{display:flex; flex-wrap:wrap; gap:10px 14px; align-items:flex-end; margin-top:10px;}
.portal-table-wrap.rpt-scroll{max-height:560px; overflow:auto;}
.rpt-debt .portal-filter-bar input,.js-rpt-stock-search{width:100%; max-width:420px;}
.rpt-scroll > table > thead th{position:sticky; top:0; z-index:2;}
.rpt-scroll > table > tfoot td{position:sticky; bottom:0; z-index:2;}
.rpt-scroll > .portal-filter-bar{position:sticky; left:0;}

/* ---------- San pham / Kho ---------- */
.portal-product-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px;}
.portal-product-card{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:16px; display:flex; flex-direction:column; gap:8px;}
.portal-product-card .thumb{aspect-ratio:1/0.8; background:var(--bg); border-radius:var(--radius); display:flex; align-items:center; justify-content:center;}
.portal-product-card .thumb svg{width:44px; height:44px; stroke:var(--navy); fill:none; stroke-width:1.6;}
.portal-product-card .name{font-size:13.5px; font-weight:700; color:var(--navy-deep); line-height:1.4; min-height:38px;}
.portal-product-card .meta{font-size:12px; color:var(--muted);}
.portal-product-card .price{font-size:15px; font-weight:800; color:var(--accent);}
.portal-product-card .add-cart-btn{margin-top:auto; background:var(--navy); color:#fff; border:none; border-radius:var(--radius); padding:9px; font-size:12.5px; font-weight:700; cursor:pointer;}
.portal-product-card .add-cart-btn:hover{background:var(--navy-deep);}
.portal-product-card .add-cart-btn:disabled{background:var(--line); color:var(--muted); cursor:not-allowed;}

/* ---------- Gio hang ---------- */
.portal-cart-list{display:flex; flex-direction:column; gap:12px;}
.portal-cart-row{display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:14px 16px;}
.portal-cart-row .thumb{position:relative; overflow:hidden; width:52px; height:52px; border-radius:var(--radius); background:var(--bg); display:flex; align-items:center; justify-content:center; flex:none;}
.portal-cart-row .thumb svg{width:26px; height:26px; stroke:var(--navy); fill:none; stroke-width:1.6;}
.portal-cart-row .thumb-icon{position:absolute; inset:0; display:flex; align-items:center; justify-content:center;}
.portal-cart-row .thumb-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1;}
.portal-cart-row .info{flex:1; min-width:0;}
.portal-cart-row .info .name{font-size:13.5px; font-weight:700; color:var(--ink);}
.portal-cart-row .info .code{font-size:11.5px; color:var(--muted);}
.portal-qty-ctrl{display:flex; align-items:center; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden;}
.portal-qty-ctrl button{width:28px; height:28px; border:none; background:var(--bg); cursor:pointer; font-size:15px; color:var(--ink);}
.portal-qty-ctrl input{width:40px; text-align:center; border:none; font:inherit; font-size:13px;}
.portal-cart-row .line-total{width:110px; text-align:right; font-weight:700; font-size:13.5px; color:var(--navy-deep);}
.portal-cart-remove{border:none; background:none; color:var(--danger); cursor:pointer; padding:6px;}
.portal-cart-remove svg{width:17px; height:17px; stroke:currentColor; fill:none; stroke-width:2;}
.portal-cart-summary{background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:20px; margin-top:18px; max-width:360px; margin-left:auto;}
.portal-cart-summary .row{display:flex; justify-content:space-between; align-items:baseline; font-size:13.5px; margin-bottom:10px; color:var(--muted);}
.portal-cart-summary .row span:last-child{font-variant-numeric:tabular-nums;}
.portal-cart-summary .row.total{color:var(--navy-deep); font-weight:800; font-size:16px; border-top:1px solid var(--line); padding-top:12px; margin-top:2px; margin-bottom:0;}
.portal-empty-state{padding:60px 20px; text-align:center; color:var(--muted);}
.portal-empty-state svg{width:52px; height:52px; stroke:var(--line); fill:none; stroke-width:1.4; margin-bottom:14px;}

/* ---------- Checkout form ---------- */
.portal-checkout-form{display:grid; grid-template-columns:1fr 1fr; gap:14px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:20px; margin-top:18px;}
.portal-checkout-form .full{grid-column:1/-1;}
.portal-checkout-form label{display:block; font-size:12.5px; font-weight:600; margin-bottom:6px; color:var(--ink);}
.portal-checkout-form input,.portal-checkout-form textarea{width:100%; border:1px solid var(--line); border-radius:var(--radius); padding:10px 12px; font:inherit; font-size:13.5px;}

@media (max-width:980px){
  .portal-sidebar{transform:translateX(-100%);}
  .portal-sidebar.open{transform:translateX(0); box-shadow:var(--shadow-lg);}
  .portal-main{margin-left:0;}
  .portal-menu-toggle{display:flex;}
  .portal-checkout-form{grid-template-columns:1fr;}
}

/* ---------- Dropdown tu ve (js/portal-select.js) thay giao dien <select> ---------- */
.pselect{position:relative; display:inline-block; vertical-align:middle;}
.pselect-native{position:absolute !important; inset:0; width:100% !important; height:100% !important; opacity:0; pointer-events:none;}
.pselect-btn{display:inline-flex; align-items:center; justify-content:space-between; gap:12px; min-width:160px; height:38px; padding:0 12px 0 14px; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--ink); font:inherit; font-size:13.5px; font-weight:600; cursor:pointer; transition:border-color .15s, box-shadow .15s, background .15s;}
.pselect-btn:hover{border-color:#c9ccd3;}
.pselect-btn:focus-visible,.pselect.open .pselect-btn{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);}
.pselect-btn:disabled{opacity:.55; cursor:default;}
.pselect-btn svg{flex:none; color:var(--muted); transition:transform .2s ease;}
.pselect.open .pselect-btn svg{transform:rotate(180deg); color:var(--accent);}
.pselect-value{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.pselect-list{position:absolute; z-index:60; top:calc(100% + 6px); left:0; min-width:100%; max-height:300px; overflow-y:auto; padding:6px; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 18px 40px -14px rgba(16,24,40,.28);
  opacity:0; visibility:hidden; transform:translateY(-4px) scale(.98); transform-origin:top center; transition:opacity .16s ease, transform .16s ease, visibility 0s linear .16s; outline:none;}
.pselect.drop-up .pselect-list{top:auto; bottom:calc(100% + 6px); transform-origin:bottom center; transform:translateY(4px) scale(.98);}
.pselect.open .pselect-list{opacity:1; visibility:visible; transform:none; transition:opacity .16s ease, transform .16s ease;}
.pselect-opt{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:9px 10px 9px 12px; border-radius:8px; font-size:13.5px; color:var(--ink); white-space:nowrap; cursor:pointer;}
.pselect-opt.is-active{background:#F4F5F7;}
.pselect-opt.is-selected{color:var(--accent); font-weight:700; background:var(--accent-soft);}
.pselect-opt.is-disabled{opacity:.45; cursor:default;}
.pselect-opt svg{flex:none; color:var(--accent);}
.pselect-list::-webkit-scrollbar{width:8px;}
.pselect-list::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15); border-radius:8px; border:2px solid transparent; background-clip:padding-box;}
.rpt-field .pselect-btn{height:36px; min-width:170px;}
@media (prefers-reduced-motion: reduce){ .pselect-list,.pselect-btn svg{transition:none;} }
