:root{--bg:#f6f8fb;--card:#fff;--text:#172033;--muted:#687184;--line:#e5e9f0;--primary:#2563eb;--primary-soft:#eaf1ff;--success:#059669;--success-soft:#e8fff5;--danger:#dc2626;--danger-soft:#fff0f0;--warning:#f59e0b;--shadow:0 14px 35px rgba(21,32,54,.08);--radius:20px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text)}a{color:inherit;text-decoration:none}.app-shell{display:flex;min-height:100vh}.sidebar{width:285px;background:#0f172a;color:#dbeafe;padding:22px;position:sticky;top:0;height:100vh;overflow:auto}.brand{display:flex;gap:12px;align-items:center;margin-bottom:24px}.brand.center{justify-content:center}.brand-mark{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#60a5fa,#22c55e);display:grid;place-items:center;color:#fff;font-weight:900}.brand strong{display:block;font-size:16px}.brand span,.user-menu small{display:block;color:#94a3b8;font-size:12px}.nav{display:grid;gap:8px}.nav a{padding:12px 14px;border-radius:14px;color:#cbd5e1}.nav a:hover,.nav a.active{background:rgba(255,255,255,.1);color:#fff}.main{flex:1;min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 28px;background:rgba(246,248,251,.9);backdrop-filter:blur(10px);position:sticky;top:0;z-index:5;border-bottom:1px solid var(--line)}.topbar h1{margin:0;font-size:26px}.topbar p{margin:4px 0 0;color:var(--muted)}.menu-button{display:none}.user-menu{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.content{padding:28px;display:grid;gap:22px}.card,.kpi,.login-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.card{padding:20px}.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px}.card-head h2{margin:0 0 4px;font-size:18px}.card-head p{margin:0;color:var(--muted)}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.kpi{padding:18px}.kpi span{color:var(--muted);font-size:13px}.kpi strong{display:block;font-size:24px;margin-top:6px}.kpi small{color:var(--muted)}.grid.two{display:grid;grid-template-columns:1fr 1fr;gap:22px}.grid.three{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px}table{width:100%;border-collapse:collapse;background:#fff;min-width:860px}th,td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{background:#f8fafc;font-size:12px;text-transform:uppercase;color:#64748b;letter-spacing:.04em}tr:last-child td{border-bottom:0}.badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:700}.badge.success{background:var(--success-soft);color:var(--success)}.badge.primary{background:var(--primary-soft);color:var(--primary)}.badge.danger{background:var(--danger-soft);color:var(--danger)}.badge.muted{background:#f1f5f9;color:#64748b}.button,button{border:0;border-radius:13px;padding:10px 14px;background:#eef2f7;color:#172033;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}.button.primary,button.primary{background:var(--primary);color:#fff}.button.danger,button.danger{background:var(--danger);color:#fff}.button.ghost{background:#fff;border:1px solid var(--line)}.button.tiny{font-size:12px;padding:7px 9px;border-radius:10px}.button.full{width:100%}.form-panel{background:#f8fafc;border:1px solid var(--line);border-radius:18px;padding:16px}.form-grid{display:grid;gap:14px}.form-grid.cols-4{grid-template-columns:repeat(4,1fr)}.form-grid.cols-3{grid-template-columns:repeat(3,1fr)}.span-2{grid-column:span 2}.span-3{grid-column:span 3}.span-4{grid-column:span 4}label{display:grid;gap:7px;font-size:13px;font-weight:700;color:#334155}input,select,textarea{width:100%;border:1px solid #d8dee9;border-radius:12px;padding:11px 12px;background:#fff;color:#172033;font:inherit}textarea{min-height:92px}.form-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.inline-filter{display:flex;gap:10px;flex-wrap:wrap;align-items:end}.inline-filter input,.inline-filter select{min-width:160px}.actions{display:flex;gap:8px;flex-wrap:wrap}.alert{padding:14px 18px;border-radius:16px;background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe}.alert.success{background:#ecfdf5;color:#047857;border-color:#a7f3d0}.alert.danger{background:#fff1f2;color:#be123c;border-color:#fecdd3}.bar-list{display:grid;gap:14px}.bar-row{display:grid;grid-template-columns:1.2fr 2fr auto;gap:12px;align-items:center}.bar-row span{display:block;color:var(--muted);font-size:12px}.bar{height:10px;background:#edf2f7;border-radius:999px;overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,#60a5fa,#22c55e);border-radius:999px}.login-body{display:grid;place-items:center;min-height:100vh;padding:22px;background:radial-gradient(circle at top left,#e0f2fe,transparent 35%),var(--bg)}.login-card{width:min(440px,100%);padding:30px}.login-card h1{text-align:center;margin:10px 0}.login-card p{text-align:center;color:var(--muted)}.login-form{display:grid;gap:14px;margin:20px 0}.pill-row{display:flex;gap:10px;flex-wrap:wrap}.pill{padding:10px 12px;border-radius:999px;background:#f1f5f9;color:#334155;font-size:13px}.role-team .sidebar{background:#052e2b}.role-team .brand-mark{background:linear-gradient(135deg,#14b8a6,#22c55e)}.muted{color:var(--muted)}.text-right{text-align:right}.mini{font-size:12px;color:var(--muted)}
@media(max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.grid.two,.grid.three{grid-template-columns:1fr}.form-grid.cols-4,.form-grid.cols-3{grid-template-columns:repeat(2,1fr)}.span-3,.span-4{grid-column:span 2}}
@media(max-width:760px){.app-shell{display:block}.sidebar{position:fixed;z-index:20;left:-300px;transition:.2s;width:280px}.sidebar.open{left:0}.menu-button{display:inline-flex}.topbar{align-items:flex-start;padding:16px}.topbar h1{font-size:20px}.top-title p{font-size:13px}.user-menu{font-size:13px}.content{padding:16px}.kpi-grid{grid-template-columns:1fr}.form-grid.cols-4,.form-grid.cols-3{grid-template-columns:1fr}.span-2,.span-3,.span-4{grid-column:auto}.card-head{display:grid}.inline-filter{display:grid}.inline-filter input,.inline-filter select{min-width:0}.bar-row{grid-template-columns:1fr}.card{padding:16px}table{min-width:760px}}

/* V3 UX improvements: brand footer, compact bulk input, and mobile-first behavior */
.app-footer{padding:14px 28px 22px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;border-top:1px solid var(--line);font-size:13px}.app-footer strong{color:var(--text)}.login-footer{display:block;margin-top:20px;text-align:center;color:var(--muted);font-size:12px}.toast{position:fixed;right:22px;bottom:22px;z-index:50;max-width:min(420px,calc(100vw - 32px));padding:14px 16px;border-radius:16px;background:#0f172a;color:#fff;box-shadow:var(--shadow)}.toast.danger{background:#991b1b}.compact-card,.quick-card{scroll-margin-top:90px}.quick-form{display:grid;gap:12px}.quick-head,.debt-head{display:grid;gap:8px;align-items:center;color:#64748b;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;padding:0 42px 0 0}.quick-head{grid-template-columns:1.05fr 1.2fr 1.2fr 1.4fr .95fr 1.8fr .8fr .95fr .95fr .95fr .95fr .9fr 32px}.role-team .quick-head{grid-template-columns:1.05fr 1.2fr 1.2fr 1.4fr 1.8fr .8fr .95fr .95fr .95fr .95fr .9fr 32px}.debt-head{grid-template-columns:1.05fr 1.3fr 1fr 1.1fr 1.8fr 1fr 1.05fr 32px}.quick-rows,.debt-rows{display:grid;gap:10px}.quick-row,.debt-row{display:grid;gap:8px;align-items:end;background:#fff;border:1px solid var(--line);border-radius:16px;padding:10px}.quick-row{grid-template-columns:1.05fr 1.2fr 1.2fr 1.4fr .95fr 1.8fr .8fr .95fr .95fr .95fr .95fr .9fr 32px}.role-team .quick-row{grid-template-columns:1.05fr 1.2fr 1.2fr 1.4fr 1.8fr .8fr .95fr .95fr .95fr .95fr .9fr 32px}.debt-row{grid-template-columns:1.05fr 1.3fr 1fr 1.1fr 1.8fr 1fr 1.05fr 32px}.quick-row label,.debt-row label{gap:4px}.quick-row label span,.debt-row label span{display:none}.quick-row input,.quick-row select,.debt-row input,.debt-row select{padding:9px 10px;border-radius:10px;font-size:13px}.quick-row .wide,.debt-row .wide{min-width:0}.sticky-actions{position:sticky;bottom:10px;background:rgba(248,250,252,.93);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:16px;padding:10px;z-index:3}.recent-box{margin-top:16px}.recent-box h3{margin:0 0 10px;font-size:15px}.compact-table table{min-width:620px}.form-panel.is-saving{opacity:.72;pointer-events:none}.row-flash{animation:rowFlash 1.8s ease-out}@keyframes rowFlash{from{background:#ecfdf5}to{background:transparent}}
@media(max-width:1280px){.quick-head,.debt-head{display:none}.quick-row,.role-team .quick-row,.debt-row{grid-template-columns:repeat(3,1fr)}.quick-row label span,.debt-row label span{display:block;color:#64748b;font-size:11px;text-transform:uppercase}.quick-row .wide,.debt-row .wide{grid-column:span 2}.quick-row [data-remove-row],.debt-row [data-remove-row]{align-self:stretch}}
@media(max-width:760px){.topbar{position:sticky}.topbar .button.ghost{padding:8px 10px}.quick-row,.role-team .quick-row,.debt-row{grid-template-columns:1fr}.quick-row .wide,.debt-row .wide{grid-column:auto}.quick-row,.debt-row{padding:12px}.hide-mobile{display:none!important}.sticky-actions{bottom:0;margin-left:-4px;margin-right:-4px;border-radius:14px}.sticky-actions .button{flex:1}.app-footer{padding:12px 16px 20px}.toast{right:12px;bottom:12px}.card.quick-card{padding:14px}.table-wrap{border-radius:14px}}

/* V5 production helpers: printable reports, attachment input, audit/tools page */
.quick-row input[type=file]{padding:7px;background:#f8fafc}.code,code{background:#f1f5f9;border-radius:7px;padding:2px 6px}.page-break{break-before:page}
@media print{.sidebar,.topbar,.app-footer,.button,button,.inline-filter,.form-actions,.toast{display:none!important}.app-shell,.main,.content{display:block!important;padding:0!important}.card,.kpi,.login-card{box-shadow:none!important;border:1px solid #cbd5e1!important}.table-wrap{overflow:visible!important}table{min-width:0!important;font-size:11px}body{background:#fff!important}.kpi-grid{grid-template-columns:repeat(2,1fr)!important}}

/* V6 PWA/offline queue + final-data workflow */
.offline-badge{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:80;background:#0f172a;color:#fff;border-radius:999px;padding:10px 14px;font-size:13px;font-weight:800;box-shadow:var(--shadow)}
.alert.danger{background:#fff1f2;color:#be123c;border-color:#fecdd3}.badge.warning{background:#fff7ed;color:#c2410c}
@media(max-width:760px){.offline-badge{left:12px;right:12px;transform:none;text-align:center;border-radius:14px}.card-head .actions{display:grid;width:100%}.card-head .actions .button{width:100%}}

/* V7 reconciliation/cash/account additions */
.quick-head{grid-template-columns:1.05fr 1.2fr 1.2fr 1.4fr .95fr 1fr 1.8fr .8fr .95fr .95fr .95fr .95fr .9fr 32px}
.role-team .quick-head{grid-template-columns:1.05fr 1.2fr 1.2fr 1.4fr 1fr 1.8fr .8fr .95fr .95fr .95fr .95fr .9fr 32px}
.quick-row{grid-template-columns:1.05fr 1.2fr 1.2fr 1.4fr .95fr 1fr 1.8fr .8fr .95fr .95fr .95fr .95fr .9fr 32px}
.role-team .quick-row{grid-template-columns:1.05fr 1.2fr 1.2fr 1.4fr 1fr 1.8fr .8fr .95fr .95fr .95fr .95fr .9fr 32px}
.diff-positive{background:#fff7ed}.diff-ok{background:#ecfdf5}.metric-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.metric-strip .mini-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px}.mini-card span{display:block;color:var(--muted);font-size:12px}.mini-card strong{display:block;margin-top:5px;font-size:18px}.device-log{font-size:12px;color:var(--muted);max-width:320px;word-break:break-word}
@media(max-width:1100px){.metric-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.metric-strip{grid-template-columns:1fr}}

/* V8.2 mobile-fit and sidebar hide/show fixes */
html,body{max-width:100%;overflow-x:hidden}.app-shell,.main,.content,.card,.grid,.kpi-grid,.metric-strip,.form-panel,.table-wrap{min-width:0;max-width:100%}.content{width:100%}.card{overflow-wrap:anywhere}.grid.two,.grid.three{align-items:start}.grid.two>*,.grid.three>*{min-width:0}.kpi strong,.mini-card strong{font-size:clamp(18px,2.2vw,24px);line-height:1.18;word-break:break-word}.table-wrap{width:100%;overflow-x:auto;overscroll-behavior-inline:contain}table{min-width:0!important;max-width:100%;table-layout:auto}th,td{overflow-wrap:anywhere;word-break:normal}.topbar{min-width:0}.top-title{min-width:0;flex:1}.user-menu{min-width:0}.sidebar-toggle-label{display:inline}.sidebar-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.42);z-index:18;opacity:0;pointer-events:none;transition:.2s}.sidebar-backdrop.show{opacity:1;pointer-events:auto}.sidebar-close{display:none;width:100%;margin:0 0 14px;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.18)}
@media(min-width:761px){.menu-button{display:inline-flex}.sidebar{transition:width .2s ease,padding .2s ease,transform .2s ease}.sidebar-collapsed .sidebar{width:0;padding-left:0;padding-right:0;overflow:hidden}.sidebar-collapsed .main{max-width:100vw}.sidebar-collapsed .topbar{padding-left:20px}.sidebar-collapsed .sidebar *{visibility:hidden}.sidebar-collapsed .sidebar-backdrop{display:none}}
@media(max-width:980px){.content{padding:16px}.card-head{display:grid}.card-head .actions,.card-head .form-actions{display:grid;width:100%}.card-head .actions .button,.card-head .form-actions .button{width:100%}.table-wrap.responsive-cards{border:0;overflow:visible;background:transparent}.table-wrap.responsive-cards table,.table-wrap.responsive-cards thead,.table-wrap.responsive-cards tbody,.table-wrap.responsive-cards tr,.table-wrap.responsive-cards th,.table-wrap.responsive-cards td{display:block;width:100%;min-width:0!important}.table-wrap.responsive-cards thead{display:none}.table-wrap.responsive-cards tr{background:#fff;border:1px solid var(--line);border-radius:16px;margin:0 0 12px;box-shadow:0 8px 22px rgba(21,32,54,.05);overflow:hidden}.table-wrap.responsive-cards td{display:grid;grid-template-columns:minmax(110px,38%) minmax(0,1fr);gap:10px;align-items:start;border-bottom:1px solid #eef2f7;padding:10px 12px;text-align:left}.table-wrap.responsive-cards td:last-child{border-bottom:0}.table-wrap.responsive-cards td::before{content:attr(data-label);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:#64748b}.table-wrap.responsive-cards .actions{display:grid}.table-wrap.responsive-cards .actions .button{width:100%}.inline-filter{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}.inline-filter label,.inline-filter .button,.inline-filter button{min-width:0;width:100%}.form-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.form-actions .button,.form-actions button{width:100%}}
@media(max-width:760px){.sidebar{height:100dvh}.sidebar-close{display:inline-flex}.topbar{display:grid;grid-template-columns:auto 1fr;gap:10px}.top-title{grid-column:2}.user-menu{grid-column:1 / -1;justify-content:flex-start;display:grid;grid-template-columns:1fr auto auto;width:100%}.user-menu small{grid-column:1 / -1}.sidebar-toggle-label{display:none}.inline-filter{grid-template-columns:1fr}.form-actions{grid-template-columns:1fr}.table-wrap.responsive-cards td{grid-template-columns:1fr;gap:4px}.kpi-grid{gap:12px}.kpi{padding:15px}.content{padding:14px}.card{padding:14px;border-radius:16px}.topbar h1{font-size:19px}.topbar p{line-height:1.35}.app-footer{display:grid}.button,button{min-height:42px}}
@media(max-width:420px){.user-menu{grid-template-columns:1fr}.user-menu .button{width:100%}.topbar{padding:12px}.content{padding:12px}.kpi strong{font-size:18px}.table-wrap.responsive-cards td{padding:9px 10px}}

/* V8.3 hard mobile/page-fit fix: no horizontal page scroll, icon sidebar, safer tables */
html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important}body{position:relative}.app-shell{width:100%!important;max-width:100vw!important;overflow-x:clip!important}.main{flex:1 1 auto!important;width:100%!important;min-width:0!important;max-width:100%!important;overflow-x:clip!important}.content{width:100%!important;max-width:100%!important;overflow-x:clip!important}.card,.kpi,.login-card,.form-panel,.table-wrap,.grid,.grid>*{min-width:0!important;max-width:100%!important}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))!important}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))!important}.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))!important}.table-wrap{width:100%!important;overflow-x:hidden!important}.table-wrap.keep-table{overflow-x:auto!important}.table-wrap table{width:100%!important;min-width:0!important;max-width:100%!important;table-layout:auto!important}.table-wrap th,.table-wrap td{white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important}.table-wrap th{line-height:1.25}.card-head{min-width:0}.card-head>*{min-width:0}.inline-filter{max-width:100%}.inline-filter label{min-width:0}.inline-filter input,.inline-filter select{min-width:0!important}.button,button{white-space:normal}.topbar{width:100%;max-width:100%;overflow-x:clip}.top-title,.user-menu{min-width:0}.user-menu span{overflow-wrap:anywhere}.icon-button,.menu-button.icon-button,.sidebar-close.icon-button{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:15px;display:inline-grid;place-items:center;background:#fff;border:1px solid var(--line);box-shadow:0 8px 20px rgba(21,32,54,.07);color:#0f172a;font-size:20px;line-height:1}.icon-button:hover,.menu-button.icon-button:hover,.sidebar-close.icon-button:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(21,32,54,.11)}.sidebar-close.icon-button{margin:0 0 14px auto;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:#fff}.sidebar{flex:0 0 285px;max-width:285px}.sidebar-collapsed .sidebar{display:none!important}.sidebar-collapsed .main{width:100%!important;max-width:100vw!important}.sidebar-collapsed .app-shell{display:block}.sidebar-collapsed .topbar{padding-left:28px}.nav a{display:flex;align-items:center;min-width:0}.brand{min-width:0}.brand>div:last-child{min-width:0}.brand strong,.brand span{overflow-wrap:anywhere}
@media(max-width:1600px){.grid.two,.grid.three{grid-template-columns:1fr!important}}
@media(max-width:1180px){.table-wrap.responsive-cards{border:0!important;overflow:visible!important;background:transparent!important}.table-wrap.responsive-cards table,.table-wrap.responsive-cards thead,.table-wrap.responsive-cards tbody,.table-wrap.responsive-cards tr,.table-wrap.responsive-cards th,.table-wrap.responsive-cards td{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important}.table-wrap.responsive-cards thead{display:none!important}.table-wrap.responsive-cards tr{background:#fff;border:1px solid var(--line);border-radius:16px;margin:0 0 12px;box-shadow:0 8px 22px rgba(21,32,54,.05);overflow:hidden}.table-wrap.responsive-cards td{display:grid!important;grid-template-columns:minmax(130px,34%) minmax(0,1fr);gap:10px;align-items:start;border-bottom:1px solid #eef2f7;padding:10px 12px;text-align:left!important}.table-wrap.responsive-cards td:last-child{border-bottom:0}.table-wrap.responsive-cards td::before{content:attr(data-label);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:#64748b}.table-wrap.responsive-cards .actions{display:grid}.table-wrap.responsive-cards .actions .button{width:100%}}
@media(max-width:760px){.app-shell{display:block!important;overflow-x:hidden!important}.sidebar{display:block!important;position:fixed!important;left:0!important;top:0!important;width:min(290px,88vw)!important;max-width:min(290px,88vw)!important;transform:translateX(-105%);transition:transform .22s ease;z-index:20}.sidebar.open{transform:translateX(0)}.sidebar-collapsed .sidebar{display:block!important}.sidebar-collapsed .app-shell{display:block!important}.topbar{grid-template-columns:44px minmax(0,1fr)!important}.user-menu{grid-template-columns:1fr 1fr!important}.user-menu span,.user-menu small{grid-column:1 / -1}.user-menu .button{width:100%}.table-wrap.responsive-cards td{grid-template-columns:1fr!important}.card-head .button,.card-head button{width:100%}.topbar,.content,.app-footer{max-width:100vw!important}.content{padding-left:12px!important;padding-right:12px!important}.kpi strong{font-size:clamp(18px,6vw,23px)!important}.icon-button,.menu-button.icon-button{width:42px;height:42px;min-width:42px;min-height:42px}}

/* V8.4 final horizontal-scroll fix + cleaner sidebar control
   Root cause fixed: V8.3 gave .main width:100% while sidebar also occupied width,
   and several rules used 100vw. This version uses grid with minmax(0,1fr)
   so the content area can shrink without pushing the page to the right. */
:root{--sidebar-w:285px}
html,body{width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important}
body{position:relative!important}
.app-shell{display:grid!important;grid-template-columns:var(--sidebar-w) minmax(0,1fr)!important;width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important}
.sidebar{grid-column:1!important;width:var(--sidebar-w)!important;max-width:var(--sidebar-w)!important;min-width:0!important;flex:none!important;box-sizing:border-box!important}
.main{grid-column:2!important;width:auto!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important;flex:none!important}
.topbar,.content,.app-footer{width:auto!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important;box-sizing:border-box!important}
.content{display:grid!important;grid-template-columns:minmax(0,1fr)!important}
.content>*{min-width:0!important;max-width:100%!important}
.card,.kpi,.login-card,.form-panel,.table-wrap,.grid,.grid>*,.kpi-grid,.metric-strip,.bar-list,.quick-form,.quick-rows,.debt-rows{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
.grid.two,.grid.three{grid-template-columns:1fr!important}
.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))!important}
.table-wrap{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
.table-wrap.keep-table{overflow-x:auto!important}
.table-wrap table{width:100%!important;min-width:0!important;max-width:100%!important;table-layout:fixed!important}
.table-wrap th,.table-wrap td{white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;min-width:0!important}
.card-head,.inline-filter,.form-actions,.actions,.user-menu{min-width:0!important;max-width:100%!important}
.card-head>*{min-width:0!important;max-width:100%!important}
.inline-filter input,.inline-filter select,.inline-filter label{min-width:0!important;max-width:100%!important}
.button,button{max-width:100%;white-space:normal!important}
.sidebar-close{display:none!important}
.menu-button.icon-button{width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;padding:0!important;border-radius:14px!important;display:inline-grid!important;place-items:center!important;background:#fff!important;border:1px solid var(--line)!important;box-shadow:0 8px 18px rgba(21,32,54,.08)!important;color:#0f172a!important;font-size:20px!important;line-height:1!important}
.menu-button.icon-button:hover{transform:none!important;box-shadow:0 10px 22px rgba(21,32,54,.12)!important}
.sidebar-collapsed .app-shell{grid-template-columns:minmax(0,1fr)!important}
.sidebar-collapsed .sidebar{display:none!important}
.sidebar-collapsed .main{grid-column:1!important;width:auto!important;max-width:100%!important}
.sidebar-collapsed .topbar{padding-left:28px!important}
@media(max-width:1180px){
  .table-wrap.responsive-cards{border:0!important;overflow:visible!important;background:transparent!important}
  .table-wrap.responsive-cards table,.table-wrap.responsive-cards thead,.table-wrap.responsive-cards tbody,.table-wrap.responsive-cards tr,.table-wrap.responsive-cards th,.table-wrap.responsive-cards td{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important}
  .table-wrap.responsive-cards thead{display:none!important}
  .table-wrap.responsive-cards tr{background:#fff;border:1px solid var(--line);border-radius:16px;margin:0 0 12px;box-shadow:0 8px 22px rgba(21,32,54,.05);overflow:hidden}
  .table-wrap.responsive-cards td{display:grid!important;grid-template-columns:minmax(130px,34%) minmax(0,1fr);gap:10px;align-items:start;border-bottom:1px solid #eef2f7;padding:10px 12px;text-align:left!important}
  .table-wrap.responsive-cards td:last-child{border-bottom:0!important}
  .table-wrap.responsive-cards td::before{content:attr(data-label);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:#64748b}
}
@media(max-width:760px){
  .app-shell{display:block!important;width:100%!important;max-width:100%!important;overflow-x:hidden!important}
  .main{display:block!important;width:auto!important;max-width:100%!important;overflow-x:hidden!important}
  .sidebar{display:block!important;position:fixed!important;left:0!important;top:0!important;height:100dvh!important;width:min(286px,86vw)!important;max-width:min(286px,86vw)!important;transform:translateX(-105%)!important;transition:transform .22s ease!important;z-index:20!important}
  .sidebar.open{transform:translateX(0)!important}
  .sidebar-collapsed .sidebar{display:block!important}
  .sidebar-collapsed .app-shell{display:block!important}
  .topbar{display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;gap:10px!important;padding:12px!important}
  .top-title{grid-column:2!important;min-width:0!important}
  .user-menu{grid-column:1 / -1!important;display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important;justify-content:stretch!important}
  .user-menu span,.user-menu small{grid-column:1 / -1!important}
  .user-menu .button{width:100%!important}
  .content{padding:12px!important;gap:14px!important}
  .card{padding:14px!important;border-radius:16px!important}
  .card-head{display:grid!important;gap:10px!important}
  .inline-filter,.form-actions,.actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important}
  .inline-filter .button,.form-actions .button,.form-actions button,.actions .button,.actions button{width:100%!important}
  .table-wrap.responsive-cards td{grid-template-columns:1fr!important;gap:4px!important}
  .kpi-grid{grid-template-columns:1fr!important}
  .kpi strong{font-size:clamp(18px,6vw,23px)!important}
  .toast{max-width:calc(100% - 24px)!important;right:12px!important;left:12px!important}
}

/* V8.5 sidebar/footer scroll fix.
   Screenshot audit showed the dark sidebar stopped before the page bottom when the
   dashboard content was taller than the sidebar. Desktop sidebar is now fixed to
   the viewport, while the main area owns the document scroll. */
@media(min-width:761px){
  html,body{overflow-x:hidden!important;width:100%!important;max-width:100%!important;}
  .app-shell{
    display:block!important;
    min-height:100vh!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
    background:var(--bg)!important;
  }
  .sidebar{
    position:fixed!important;
    inset:0 auto 0 0!important;
    width:var(--sidebar-w)!important;
    max-width:var(--sidebar-w)!important;
    min-height:100dvh!important;
    height:100dvh!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    z-index:30!important;
    box-shadow:1px 0 0 rgba(255,255,255,.06)!important;
  }
  .main{
    display:block!important;
    margin-left:var(--sidebar-w)!important;
    width:calc(100% - var(--sidebar-w))!important;
    max-width:calc(100% - var(--sidebar-w))!important;
    min-width:0!important;
    overflow-x:hidden!important;
  }
  .sidebar-collapsed .sidebar{display:none!important;}
  .sidebar-collapsed .main{
    margin-left:0!important;
    width:100%!important;
    max-width:100%!important;
  }
  .topbar,.content,.app-footer{
    max-width:100%!important;
    overflow-x:hidden!important;
  }
  .topbar{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr) minmax(240px,max-content)!important;
    align-items:center!important;
  }
  .top-title{min-width:0!important;}
  .user-menu{min-width:0!important;}
  .sidebar-backdrop{display:none!important;}
}

/* Wider dashboard tables should never force the entire page sideways. */
.card,.content,.grid,.kpi-grid,.table-wrap,.topbar,.app-footer{min-width:0!important;}
.table-wrap{max-width:100%!important;}
.table-wrap:not(.keep-table){overflow-x:hidden!important;}
.table-wrap:not(.keep-table) table{min-width:0!important;width:100%!important;table-layout:fixed!important;}
.table-wrap:not(.keep-table) th,.table-wrap:not(.keep-table) td{white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;}

/* On tablet and small laptop widths, turn tables into cards earlier so the
   dashboard never creates a horizontal page scrollbar. */
@media(max-width:1320px){
  .table-wrap.responsive-cards{border:0!important;overflow:visible!important;background:transparent!important;}
  .table-wrap.responsive-cards table,.table-wrap.responsive-cards thead,.table-wrap.responsive-cards tbody,.table-wrap.responsive-cards tr,.table-wrap.responsive-cards th,.table-wrap.responsive-cards td{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;}
  .table-wrap.responsive-cards thead{display:none!important;}
  .table-wrap.responsive-cards tr{background:#fff;border:1px solid var(--line);border-radius:16px;margin:0 0 12px;box-shadow:0 8px 22px rgba(21,32,54,.05);overflow:hidden;}
  .table-wrap.responsive-cards td{display:grid!important;grid-template-columns:minmax(120px,30%) minmax(0,1fr);gap:10px;align-items:start;border-bottom:1px solid #eef2f7;padding:10px 12px;text-align:left!important;}
  .table-wrap.responsive-cards td:last-child{border-bottom:0!important;}
  .table-wrap.responsive-cards td::before{content:attr(data-label);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:#64748b;}
}
@media(max-width:920px) and (min-width:761px){
  .topbar{grid-template-columns:42px minmax(0,1fr)!important;}
  .user-menu{grid-column:1 / -1!important;display:flex!important;justify-content:flex-start!important;}
}

/* V8.6 final UI polish: fixed full-height sidebar, cleaner spacing, no horizontal body scroll */
:root{--sidebar-w:285px}
html,body{width:100%;max-width:100%;overflow-x:hidden!important}
body{line-height:1.45}
@media(min-width:761px){
  body:not(.sidebar-collapsed)::before{content:"";position:fixed;z-index:0;left:0;top:0;bottom:0;width:var(--sidebar-w);background:#0f172a;pointer-events:none}
  body.role-team:not(.sidebar-collapsed)::before{background:#052e2b}
  .app-shell{display:block!important;min-height:100vh;background:var(--bg);position:relative;overflow-x:hidden!important}
  .sidebar{position:fixed!important;z-index:31!important;left:0!important;top:0!important;bottom:0!important;width:var(--sidebar-w)!important;height:100vh!important;min-height:100vh!important;overflow-y:auto!important;overflow-x:hidden!important;border-radius:0!important;padding:22px 18px!important;overscroll-behavior:contain;scrollbar-width:thin}
  .main{margin-left:var(--sidebar-w)!important;width:calc(100vw - var(--sidebar-w))!important;max-width:calc(100vw - var(--sidebar-w))!important;min-width:0!important;overflow-x:hidden!important;position:relative;z-index:1}
  .sidebar-collapsed::before{display:none!important}
  .sidebar-collapsed .sidebar{display:none!important}
  .sidebar-collapsed .main{margin-left:0!important;width:100vw!important;max-width:100vw!important}
  .topbar{display:grid!important;grid-template-columns:42px minmax(0,1fr) auto!important;gap:16px!important;align-items:center!important;max-width:100%!important;overflow:hidden!important}
  .content{max-width:100%!important;overflow-x:hidden!important}
}
.content{gap:20px!important}.card{padding:22px!important}.card+.card{margin-top:0}.card-head{gap:14px!important}.kpi-grid{gap:14px!important}.kpi{padding:18px!important;min-width:0!important}.kpi strong{font-size:clamp(20px,2vw,25px)!important;overflow-wrap:anywhere}.grid.two,.grid.three{gap:20px!important;min-width:0!important}.grid.two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))!important}.topbar,.content,.app-footer,.card,.table-wrap{min-width:0!important;max-width:100%!important}.app-footer{position:relative;z-index:1}.table-wrap{overflow-x:hidden!important}.table-wrap.keep-table{overflow-x:auto!important}table{max-width:100%!important}.table-wrap:not(.keep-table) table{table-layout:fixed!important;min-width:0!important;width:100%!important}.table-wrap:not(.keep-table) th,.table-wrap:not(.keep-table) td{white-space:normal!important;overflow-wrap:anywhere!important;word-break:normal!important;line-height:1.35}.actions{align-items:center}.button,button{min-height:38px;line-height:1.1;white-space:normal}.button.tiny{min-height:30px}.inline-filter{row-gap:12px!important}.inline-filter label{min-width:170px}.inline-filter label:has(select[name="status"]){min-width:230px}.form-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.form-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
/* Checkbox compact fix */
.pill{display:inline-flex!important;align-items:center!important;gap:8px!important;line-height:1.2!important;min-height:36px!important}.pill input[type="checkbox"],input[type="checkbox"]{width:16px!important;height:16px!important;min-width:16px!important;margin:0!important;accent-color:var(--primary);vertical-align:middle}
/* Bulk input column balance: wider type, smaller ref, clear unit */
.quick-head{grid-template-columns:1fr 1.55fr 1.15fr 1.3fr .9fr .72fr 1.65fr .78fr .72fr .95fr .95fr .95fr .95fr .9fr 32px!important;padding-right:42px!important}.quick-row{grid-template-columns:1fr 1.55fr 1.15fr 1.3fr .9fr .72fr 1.65fr .78fr .72fr .95fr .95fr .95fr .95fr .9fr 32px!important}.role-team .quick-head{grid-template-columns:1fr 1.55fr 1.15fr 1.3fr .72fr 1.65fr .78fr .72fr .95fr .95fr .95fr .95fr .9fr 32px!important}.role-team .quick-row{grid-template-columns:1fr 1.55fr 1.15fr 1.3fr .72fr 1.65fr .78fr .72fr .95fr .95fr .95fr .95fr .9fr 32px!important}.quick-row select,.quick-row input{min-width:0}.quick-row label.ref-col input{font-size:12px}.quick-row label.type-col select{font-size:13px}.unit-hint{font-size:11px;color:var(--muted);font-weight:600;margin-top:2px}.attachment-actions{display:flex;gap:6px;flex-wrap:wrap}
/* Responsive cards earlier and cleaner */
@media(max-width:1380px){.grid.two,.grid.three{grid-template-columns:1fr!important}.table-wrap.responsive-cards{border:0!important;background:transparent!important;overflow:visible!important}.table-wrap.responsive-cards table,.table-wrap.responsive-cards thead,.table-wrap.responsive-cards tbody,.table-wrap.responsive-cards tr,.table-wrap.responsive-cards th,.table-wrap.responsive-cards td{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important}.table-wrap.responsive-cards thead{display:none!important}.table-wrap.responsive-cards tr{background:#fff;border:1px solid var(--line);border-radius:16px;margin:0 0 12px;box-shadow:0 8px 22px rgba(21,32,54,.05);overflow:hidden}.table-wrap.responsive-cards td{display:grid!important;grid-template-columns:minmax(145px,32%) minmax(0,1fr);gap:10px;align-items:start;border-bottom:1px solid #eef2f7!important;padding:10px 12px!important;text-align:left!important}.table-wrap.responsive-cards td:last-child{border-bottom:0!important}.table-wrap.responsive-cards td::before{content:attr(data-label);font-size:11px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;color:#64748b}.quick-head,.debt-head{display:none!important}.quick-row,.role-team .quick-row,.debt-row{grid-template-columns:repeat(3,minmax(0,1fr))!important}.quick-row label span,.debt-row label span{display:block!important;color:#64748b;font-size:11px;text-transform:uppercase}.quick-row .wide,.debt-row .wide{grid-column:span 2}}
@media(max-width:900px){.topbar{grid-template-columns:42px minmax(0,1fr)!important}.user-menu{grid-column:1 / -1!important;justify-content:flex-start!important}.form-grid.cols-2,.form-grid.cols-3,.form-grid.cols-4{grid-template-columns:1fr!important}.span-2,.span-3,.span-4{grid-column:auto!important}}
@media(max-width:760px){body::before{display:none!important}.sidebar{height:100dvh!important;min-height:100dvh!important}.main{margin-left:0!important;width:100%!important;max-width:100%!important}.content{padding:12px!important;gap:14px!important}.card{padding:14px!important}.quick-row,.role-team .quick-row,.debt-row{grid-template-columns:1fr!important}.quick-row .wide,.debt-row .wide{grid-column:auto!important}.inline-filter label{min-width:0!important}.table-wrap.responsive-cards td{grid-template-columns:1fr!important}.user-menu{display:grid!important;grid-template-columns:1fr 1fr!important}.user-menu span,.user-menu small{grid-column:1 / -1}.user-menu .button{width:100%}}
/* Modal viewer */
.modal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.62);z-index:80;display:none;align-items:center;justify-content:center;padding:18px}.modal-backdrop.show{display:flex}.modal-card{width:min(980px,100%);max-height:92dvh;background:#fff;border-radius:22px;box-shadow:0 30px 80px rgba(15,23,42,.3);overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr) auto}.modal-head,.modal-foot{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}.modal-foot{border-bottom:0;border-top:1px solid var(--line);justify-content:flex-end}.modal-body{padding:12px;overflow:auto;background:#f8fafc}.modal-body img{display:block;max-width:100%;height:auto;margin:auto;border-radius:14px}.modal-body iframe{width:100%;height:72dvh;border:0;border-radius:14px;background:#fff}.modal-title{font-weight:900}.modal-close{font-size:20px;width:38px;height:38px;border-radius:12px;padding:0}
.menu-button.icon-button{display:inline-flex!important;width:42px!important;height:42px!important;padding:0!important;border:1px solid var(--line)!important;background:#fff!important;border-radius:14px!important;font-size:20px!important;box-shadow:0 6px 18px rgba(21,32,54,.06)!important}
.operational-row{grid-template-columns:1fr 1.15fr 2fr .75fr .85fr 1fr 1fr .9fr 32px!important}
@media(max-width:1380px){.operational-row{grid-template-columns:repeat(3,minmax(0,1fr))!important}.operational-row .wide{grid-column:span 2!important}}
@media(max-width:760px){.operational-row{grid-template-columns:1fr!important}.operational-row .wide{grid-column:auto!important}}

/* V8.7 UI repair: consistent sidebar, stable tables, cleaner quick forms */
:root{--sidebar-w:260px;--sidebar-bg:#0f172a;--sidebar-fg:#dbeafe;--sidebar-muted:#94a3b8}
html,body{overflow-x:hidden!important;max-width:100%!important}
body.role-team .sidebar,body.role-team:not(.sidebar-collapsed)::before{background:var(--sidebar-bg)!important;color:var(--sidebar-fg)!important}
body.role-team .brand-mark{background:linear-gradient(135deg,#60a5fa,#22c55e)!important}
@media(min-width:761px){
  body:not(.sidebar-collapsed)::before{width:var(--sidebar-w)!important;background:var(--sidebar-bg)!important}
  .sidebar{width:var(--sidebar-w)!important;max-width:var(--sidebar-w)!important;background:var(--sidebar-bg)!important;color:var(--sidebar-fg)!important;position:fixed!important;left:0!important;top:0!important;bottom:0!important;height:100dvh!important;min-height:100dvh!important;padding:18px 14px!important;overflow-y:auto!important;overflow-x:hidden!important}
  .brand{gap:10px!important;margin-bottom:18px!important}.brand-mark{width:40px!important;height:40px!important;border-radius:13px!important}.brand strong{font-size:14px!important}.brand span{color:var(--sidebar-muted)!important}
  .nav{gap:5px!important}.nav a{padding:10px 12px!important;border-radius:12px!important;font-size:14px!important;line-height:1.2!important;color:#dbeafe!important}.nav a:hover,.nav a.active{background:rgba(255,255,255,.1)!important;color:#fff!important}
  .main{margin-left:var(--sidebar-w)!important;width:calc(100vw - var(--sidebar-w))!important;max-width:calc(100vw - var(--sidebar-w))!important;overflow-x:hidden!important;min-width:0!important}
  .sidebar-collapsed .main{margin-left:0!important;width:100vw!important;max-width:100vw!important}
  .topbar{padding:18px 22px!important}.content{padding:22px!important;gap:24px!important}.app-footer{padding-left:22px!important;padding-right:22px!important}
}
.card{overflow:hidden!important}.card-head{margin-bottom:18px!important}.card .table-wrap{margin-top:16px!important}.quick-card + .card,.kpi-grid + .card,.grid + .card{margin-top:2px!important}
.table-wrap{width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;border-radius:16px!important}.table-wrap table{min-width:760px!important;table-layout:auto!important}.table-wrap th,.table-wrap td{overflow-wrap:break-word!important;word-break:normal!important}.table-wrap td.actions,.table-wrap th:last-child{min-width:120px!important}.actions{min-width:0!important;gap:6px!important}.actions form{margin:0!important}.action-muted{display:inline-flex;align-items:center;min-height:30px;color:#64748b;font-size:12px;font-weight:800;background:#f1f5f9;border-radius:999px;padding:6px 10px}
.inline-filter{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;align-items:end!important;gap:14px!important;margin-bottom:18px!important}.inline-filter label{min-width:0!important}.inline-filter button,.inline-filter .button{align-self:end!important}.inline-filter label:has(select[name="status"]){min-width:0!important;grid-column:span 1!important}
/* Quick input is intentionally card based, not 14 tiny columns. */
.quick-head,.debt-head{display:none!important}.quick-rows,.debt-rows{gap:14px!important}.quick-row,.role-team .quick-row,.debt-row,.operational-row{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;padding:16px!important;border-radius:18px!important;align-items:end!important;background:#fff!important}.quick-row label span,.debt-row label span{display:block!important;color:#64748b!important;font-size:11px!important;text-transform:uppercase!important;letter-spacing:.04em!important}.quick-row .wide,.debt-row .wide,.operational-row .wide{grid-column:span 2!important}.quick-row input,.quick-row select,.debt-row input,.debt-row select{min-height:40px!important;padding:9px 10px!important}.quick-row input[type=file]{font-size:12px!important;max-width:100%!important}.quick-row [data-remove-row],.debt-row [data-remove-row]{align-self:end!important;width:40px!important;height:40px!important;padding:0!important}
.button,button{border-radius:12px!important}.button.primary,button.primary{box-shadow:0 8px 18px rgba(37,99,235,.2)}
@media(max-width:1180px){.quick-row,.role-team .quick-row,.debt-row,.operational-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}.quick-row .wide,.debt-row .wide,.operational-row .wide{grid-column:span 2!important}}
@media(max-width:760px){
  .sidebar{background:var(--sidebar-bg)!important;color:var(--sidebar-fg)!important;width:280px!important;max-width:calc(100vw - 38px)!important;height:100dvh!important;position:fixed!important;top:0!important;bottom:0!important;overflow-y:auto!important}
  .content{padding:12px!important;gap:16px!important}.card{padding:14px!important;border-radius:18px!important}.card-head{display:grid!important;gap:10px!important}.card-head .actions,.form-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important}.quick-row,.role-team .quick-row,.debt-row,.operational-row{grid-template-columns:1fr!important;padding:14px!important;gap:10px!important}.quick-row .wide,.debt-row .wide,.operational-row .wide{grid-column:auto!important}.inline-filter{grid-template-columns:1fr!important;gap:10px!important}.inline-filter button{width:100%!important}.table-wrap.responsive-cards{overflow:visible!important;border:0!important;margin-top:12px!important}.table-wrap.responsive-cards table,.table-wrap.responsive-cards thead,.table-wrap.responsive-cards tbody,.table-wrap.responsive-cards tr,.table-wrap.responsive-cards th,.table-wrap.responsive-cards td{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important}.table-wrap.responsive-cards thead{display:none!important}.table-wrap.responsive-cards tr{background:#fff!important;border:1px solid var(--line)!important;border-radius:16px!important;margin-bottom:12px!important;box-shadow:0 8px 22px rgba(21,32,54,.05)!important;overflow:hidden!important}.table-wrap.responsive-cards td{display:grid!important;grid-template-columns:1fr!important;gap:4px!important;border-bottom:1px solid #eef2f7!important;padding:10px 12px!important}.table-wrap.responsive-cards td::before{content:attr(data-label);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;color:#64748b}.table-wrap.responsive-cards td:last-child{border-bottom:0!important}.actions{display:flex!important}.actions .button,.actions button,.actions form{width:auto!important}.user-menu{grid-template-columns:1fr 1fr!important}.user-menu .button{width:100%!important}
}


/* V8.8 final layout guard: login/install must never inherit app/sidebar layout */
body.login-body::before{display:none!important;content:none!important;width:0!important}
body.login-body{display:grid!important;place-items:center!important;min-height:100dvh!important;margin:0!important;overflow-x:hidden!important;padding:22px!important;background:radial-gradient(circle at top left,#e0f2fe,transparent 35%),var(--bg)!important}
body.login-body .sidebar,body.login-body .topbar,body.login-body .app-shell,body.login-body .sidebar-backdrop{display:none!important}
body.login-body .login-card{margin:auto!important;max-width:100%!important}
body.app-body::before{content:"";position:fixed;left:0;top:0;bottom:0;width:var(--sidebar-w);background:var(--sidebar-bg);z-index:0}
@media(min-width:761px){body.app-body:not(.sidebar-collapsed)::before{display:block!important}body.app-body.sidebar-collapsed::before{display:none!important}.app-body .app-shell{display:block!important}.app-body .sidebar{z-index:10!important}.app-body .main{position:relative;z-index:1!important}}

/* V8.8 input modules: separate compact forms by transaction purpose */
.input-type-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:16px;align-items:start}
details.input-module{background:#f8fafc;border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 8px 22px rgba(21,32,54,.04)}
details.input-module[open]{background:#fff}
details.input-module>summary{cursor:pointer;list-style:none;padding:15px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:900;color:#0f172a;border-bottom:1px solid transparent}
details.input-module[open]>summary{border-bottom-color:var(--line)}
details.input-module>summary::-webkit-details-marker{display:none}
details.input-module>summary::after{content:'+';width:28px;height:28px;display:grid;place-items:center;border-radius:10px;background:#eaf1ff;color:#2563eb;font-weight:900}
details.input-module[open]>summary::after{content:'−'}
.input-module .form-panel{border:0;border-radius:0;background:transparent;padding:14px}.quick-section-note{margin:0 0 12px;color:var(--muted);font-size:13px}.quick-row.type-specific{grid-template-columns:repeat(3,minmax(0,1fr))!important}.quick-row.type-specific .wide{grid-column:span 2!important}.quick-row.type-specific .full-line{grid-column:1/-1!important}.quick-row.type-specific .ref-col{max-width:170px!important}.quick-row input[readonly]{background:#f8fafc;color:#334155;font-weight:800}.quick-row input[type=checkbox]{width:18px!important;height:18px!important;min-height:18px!important;padding:0!important}.quick-row .inline-check{display:flex!important;align-items:center!important;gap:8px!important;min-height:42px!important}
.upload-field{position:relative;display:grid!important;gap:7px}.upload-field input[type=file]{position:absolute;inset:23px 0 0 0;opacity:0;cursor:pointer;height:44px!important}.upload-cta{display:flex;align-items:center;justify-content:center;min-height:42px;border:1px dashed #9bb3d1;background:#f8fafc;border-radius:12px;color:#2563eb;font-weight:900;font-size:13px;padding:9px 10px}.upload-field:hover .upload-cta{background:#eaf1ff;border-color:#2563eb}.upload-name{color:#64748b;font-size:12px;font-weight:700;min-height:16px}.attachment-actions{display:flex;gap:6px;flex-wrap:wrap}.actions{align-items:flex-start}.actions .button,.actions button{white-space:nowrap!important}.table-wrap td.actions{min-width:148px!important}
@media(max-width:1180px){.quick-row.type-specific{grid-template-columns:repeat(2,minmax(0,1fr))!important}.quick-row.type-specific .wide{grid-column:span 2!important}}
@media(max-width:760px){.input-type-grid{grid-template-columns:1fr!important}.quick-row.type-specific{grid-template-columns:1fr!important}.quick-row.type-specific .wide,.quick-row.type-specific .full-line{grid-column:auto!important}.quick-row.type-specific .ref-col{max-width:100%!important}details.input-module>summary{padding:14px}.upload-field input[type=file]{height:44px!important}}

/* V8.9 polish: professional finance UI, no wrapped type badges, sticky footer, cleaner quick input */
html, body { min-height:100%; }
body.app-body { min-height:100dvh; }
body.app-body .main { min-height:100dvh!important; display:flex!important; flex-direction:column!important; }
body.app-body .content { flex:1 0 auto!important; }
body.app-body .app-footer { margin-top:auto!important; background:#f6f8fb!important; }
.badge { white-space:nowrap!important; word-break:keep-all!important; overflow-wrap:normal!important; line-height:1.15!important; text-align:center!important; }
td:has(.badge), th:nth-child(2) { min-width:118px!important; }
.product-pill { display:inline-flex; align-items:center; justify-content:center; min-height:28px; padding:6px 10px; border-radius:999px; font-size:12px; font-weight:900; white-space:nowrap; line-height:1.1; }
.product-kopra { background:#ecfdf5; color:#047857; }
.product-bungkil { background:#fff7ed; color:#c2410c; }
.product-kelapa { background:#eff6ff; color:#1d4ed8; }
.product-kemiri { background:#f5f3ff; color:#6d28d9; }
.product-default { background:#f1f5f9; color:#475569; }
.quick-type-tabs { display:flex; gap:10px; flex-wrap:wrap; margin:4px 0 16px; padding:10px; border:1px solid var(--line); border-radius:18px; background:#f8fafc; }
.quick-type-tab { min-height:40px; padding:10px 14px!important; border-radius:999px!important; background:#fff!important; border:1px solid #d8dee9!important; color:#334155!important; box-shadow:none!important; }
.quick-type-tab.active { background:#2563eb!important; border-color:#2563eb!important; color:#fff!important; }
.quick-type-panels { display:block!important; }
.quick-type-panels details.input-module { display:none!important; margin:0!important; }
.quick-type-panels details.input-module.active { display:block!important; }
details.input-module>summary { display:none!important; }
.input-module .form-panel { padding:18px!important; }
.quick-section-note { margin-bottom:16px!important; background:#eff6ff; border:1px solid #bfdbfe; color:#1d4ed8; padding:10px 12px; border-radius:14px; }
.quick-row.type-specific { grid-template-columns:repeat(4,minmax(0,1fr))!important; gap:14px!important; padding:18px!important; border-radius:20px!important; }
.quick-row.type-specific .wide { grid-column:span 2!important; }
.quick-row.type-specific .ref-col { max-width:none!important; }
.ref-col { display:none!important; }
.upload-field { align-self:end; }
.upload-field input[type=file] { position:absolute!important; width:1px!important; height:1px!important; opacity:0!important; pointer-events:none!important; }
.upload-cta { min-height:44px!important; border:1px solid #c7d2fe!important; background:#eef2ff!important; color:#3730a3!important; border-radius:14px!important; gap:8px; }
.upload-cta::before { content:''; display:none; }
.upload-name { display:block; padding-left:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.inline-filter { background:#f8fafc; border:1px solid var(--line); border-radius:18px; padding:14px!important; margin-bottom:20px!important; }
.inline-filter noscript { display:none; }
.table-wrap.transactions-table { margin-top:22px!important; }
.table-wrap.transactions-table td, .table-wrap.transactions-table th { vertical-align:middle!important; }
.table-wrap.transactions-table td:nth-child(2), .table-wrap.transactions-table td:nth-child(3) { white-space:nowrap!important; overflow-wrap:normal!important; word-break:keep-all!important; }
.card { margin-bottom:2px; }
.card-head { gap:18px!important; }
input, select, textarea { box-shadow:0 1px 0 rgba(15,23,42,.03); }
input:focus, select:focus, textarea:focus { outline:3px solid rgba(37,99,235,.13); border-color:#2563eb; }
.button:hover, button:hover { transform:translateY(-1px); }
@media(max-width:1180px){
  .quick-row.type-specific { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .quick-row.type-specific .wide { grid-column:span 2!important; }
}
@media(max-width:760px){
  .quick-type-tabs { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:8px; }
  .quick-type-tab { width:100%; min-height:38px; padding:9px 10px!important; font-size:13px; }
  .quick-row.type-specific { grid-template-columns:1fr!important; padding:14px!important; gap:11px!important; }
  .quick-row.type-specific .wide { grid-column:auto!important; }
  .table-wrap.responsive-cards td:nth-child(2), .table-wrap.responsive-cards td:nth-child(3) { white-space:normal!important; }
  .badge, .product-pill { white-space:normal!important; text-align:left!important; justify-content:flex-start!important; max-width:100%; }
  .inline-filter { padding:12px!important; }
}


/* V9 additions: closing, reconciliation, cleaner admin tools */
.inline-check{display:flex;align-items:center;gap:10px}.inline-check input{width:auto}.page-status-note{padding:12px 14px;border-radius:14px;background:#f8fafc;border:1px dashed var(--line);color:var(--muted)}
select[multiple]{min-height:150px}.metric-strip .mini-card strong.negative,.negative{color:var(--danger)}.metric-strip .mini-card strong.positive,.positive{color:var(--success)}
@media(max-width:760px){.grid.two,.grid.three{gap:14px}.card-head .actions{width:100%}.card-head .actions .button{flex:1}.form-actions .button{min-height:42px}}

/* V9.1 visual fixes requested from screenshots: readable money, action column, upload UI, optional receipt */
.finance-table-wrap{
  overflow-x:auto!important;
  overflow-y:visible!important;
  -webkit-overflow-scrolling:touch;
}
.finance-table-wrap table{
  table-layout:auto!important;
  width:100%!important;
  min-width:max-content!important;
}
.performance-table table{min-width:980px!important;}
.summary-type-table table{min-width:720px!important;}
.transactions-table table{min-width:1180px!important;}
.money-cell,
.performance-table td:nth-child(n+2),
.performance-table th:nth-child(n+2){
  white-space:nowrap!important;
  word-break:keep-all!important;
  overflow-wrap:normal!important;
  min-width:112px!important;
  font-variant-numeric:tabular-nums;
}
.performance-table td:first-child,
.performance-table th:first-child{min-width:120px!important;}
.performance-table th:last-child,
.performance-table td:last-child{min-width:76px!important;text-align:right!important;}
.transactions-table th:last-child,
.transactions-table td.actions-cell{
  min-width:168px!important;
  width:168px!important;
  white-space:normal!important;
}
.transactions-table td.actions-cell .actions,
.actions-cell{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
.transactions-table td.actions-cell form{margin:0!important;display:inline-flex!important;}
.transactions-table td.actions-cell .button,
.transactions-table td.actions-cell button{
  min-width:58px!important;
  white-space:nowrap!important;
  padding:8px 10px!important;
}
.action-muted{
  display:inline-flex;
  min-height:30px;
  align-items:center;
  padding:7px 10px;
  border-radius:999px;
  background:#f1f5f9;
  color:#64748b;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}
.upload-field{position:relative!important;gap:8px!important;}
.upload-field input[type=file]{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  opacity:0!important;
  cursor:pointer!important;
  pointer-events:auto!important;
}
.upload-cta{
  min-height:46px!important;
  border:1px solid #bfdbfe!important;
  background:linear-gradient(180deg,#f8fbff,#eef6ff)!important;
  color:#1d4ed8!important;
  border-radius:14px!important;
  box-shadow:0 4px 12px rgba(37,99,235,.08)!important;
  font-weight:900!important;
}
.upload-field:hover .upload-cta{background:#eaf1ff!important;border-color:#2563eb!important;}
.upload-name{
  display:block!important;
  min-height:18px!important;
  color:#64748b!important;
  font-size:12px!important;
  font-weight:700!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
@media(max-width:760px){
  .finance-table-wrap.responsive-cards{overflow:visible!important;}
  .finance-table-wrap.responsive-cards table{min-width:0!important;width:100%!important;}
  .performance-table table,.summary-type-table table,.transactions-table table{min-width:0!important;}
  .performance-table .money-cell,
  .performance-table td:nth-child(n+2){white-space:normal!important;min-width:0!important;text-align:left!important;}
  .transactions-table td.actions-cell{width:auto!important;min-width:0!important;}
  .transactions-table td.actions-cell .button,.transactions-table td.actions-cell button{flex:1 1 auto!important;}
}


/* V9.2 notification + dashboard/action UI polish */
.topbar{overflow:visible!important}.user-menu{position:relative}.notif-button{position:relative;width:42px;height:42px;border-radius:14px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 20px rgba(15,23,42,.06);padding:0}.notif-button b{position:absolute;top:-7px;right:-7px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#dc2626;color:#fff;font-size:11px;line-height:20px}.notif-panel{position:absolute;right:0;top:52px;z-index:70;width:min(380px,calc(100vw - 28px));background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 70px rgba(15,23,42,.18);padding:12px}.notif-head,.notif-foot{display:flex;justify-content:space-between;align-items:center;gap:10px}.notif-list{display:grid;gap:8px;max-height:360px;overflow:auto;margin:10px 0}.notif-item,.notif-card{display:flex;justify-content:space-between;gap:10px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#fff}.notif-item.unread,.notif-card.unread{background:#eff6ff;border-color:#bfdbfe}.notif-item strong,.notif-card strong{display:block;font-size:13px}.notif-item p,.notif-card p{margin:4px 0;color:#475569;font-size:13px;line-height:1.35}.notif-item small,.notif-card small{color:#64748b}.notif-dot{width:10px;height:10px;flex:0 0 10px;border-radius:999px;background:#2563eb;margin-top:5px}.notif-page-list{display:grid;gap:10px}.perf-table-clean table{min-width:1040px!important}.perf-table-clean th,.perf-table-clean td{padding:10px 12px!important;vertical-align:middle!important}.perf-table-clean .money-cell{white-space:nowrap!important;min-width:126px!important;font-size:13px!important;line-height:1.25!important;letter-spacing:-.01em}.perf-table-clean .team-name{font-weight:800;white-space:nowrap}.perf-table-clean .pct-cell{white-space:nowrap;text-align:right}.action-buttons{display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-wrap:nowrap!important;min-height:36px}.action-buttons form{margin:0!important;display:inline-flex!important}.actions-cell{vertical-align:middle!important;white-space:nowrap!important}.actions-cell .button,.actions-cell button{height:34px!important;min-width:62px!important;padding:7px 11px!important;line-height:1!important}.transactions-table th:last-child,.transactions-table td.actions-cell{width:150px!important;min-width:150px!important}.upload-field .upload-name:empty{display:none!important}.upload-field{align-content:start}.upload-cta{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important}.upload-cta:before{content:'';display:none}.table-wrap + .table-wrap,.card .table-wrap{margin-top:4px}.content{gap:24px!important}.card{padding:22px!important}.card-head{margin-bottom:18px!important}
@media(max-width:760px){.notif-panel{right:-4px;top:48px}.perf-table-clean table{min-width:0!important}.perf-table-clean .money-cell{white-space:normal!important;min-width:0!important}.action-buttons{flex-wrap:wrap!important}.transactions-table td.actions-cell{width:auto!important;min-width:0!important}.actions-cell .button,.actions-cell button{flex:1 1 90px}.card{padding:16px!important}}

/* V9.3: clearer dashboard finance cards, full input details, and safer text wrapping */
.team-performance-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.team-perf-card{border:1px solid var(--line);border-radius:18px;background:#fff;padding:16px;box-shadow:0 10px 24px rgba(15,23,42,.05)}
.team-perf-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:12px;border-bottom:1px solid var(--line);padding-bottom:10px}
.team-perf-head strong{font-size:18px}.team-perf-head span{font-size:12px;color:var(--muted);font-weight:800;text-align:right}
.finance-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.finance-mini-grid div{background:#f8fafc;border:1px solid #edf2f7;border-radius:14px;padding:10px;min-width:0}
.finance-mini-grid span{display:block;color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.035em;font-weight:900;margin-bottom:4px}
.finance-mini-grid b{display:block;font-size:14px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.finance-mini-grid .pos{color:#047857}.finance-mini-grid .neg,.neg{color:#dc2626}.pos{color:#047857}
.input-detail-list{display:grid;gap:14px}.input-detail-card{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:18px}.input-detail-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px}.input-detail-head h3{margin:10px 0 0;font-size:18px}.detail-status{text-align:right;display:grid;gap:6px;justify-items:end}.detail-status small{color:var(--muted);font-weight:800}.input-detail-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.input-detail-grid>div{background:#f8fafc;border:1px solid #edf2f7;border-radius:14px;padding:10px;min-width:0}.input-detail-grid>div.wide{grid-column:span 2}.input-detail-grid span{display:block;color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.035em;font-weight:900;margin-bottom:5px}.input-detail-grid b{display:block;font-size:13px;line-height:1.35;word-break:break-word}.input-detail-grid .attachment-actions{display:flex;gap:6px;flex-wrap:wrap}.content .kpi strong,.money-cell,.finance-mini-grid b{font-variant-numeric:tabular-nums}.notif-foot-note{font-size:12px;color:var(--muted);line-height:1.35;margin-top:8px}
@media(max-width:1180px){.team-performance-cards{grid-template-columns:1fr 1fr}.input-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.team-performance-cards{grid-template-columns:1fr}.team-perf-head,.input-detail-head{display:grid;text-align:left}.detail-status{justify-items:start;text-align:left}.finance-mini-grid,.input-detail-grid{grid-template-columns:1fr}.input-detail-grid>div.wide{grid-column:auto}.finance-mini-grid b{white-space:normal}.input-detail-card{padding:14px}}
.grid.two .team-performance-cards{grid-template-columns:1fr}

/* V9.4: clean sidebar icons, bell-only notifications, bottom mobile nav, detail/actions polish */
.nav a{gap:10px}.nav-icon{width:24px;height:24px;display:inline-grid;place-items:center;flex:0 0 24px;border-radius:10px;background:rgba(255,255,255,.08);color:#dbeafe;font-size:13px;font-weight:900}.nav a.active .nav-icon,.nav a:hover .nav-icon{background:#fff;color:#0f172a}.user-identity{display:grid;gap:2px;min-width:110px}.notif-button{font-size:18px}.notif-foot-note{font-size:11px;color:var(--muted);line-height:1.25}.mobile-bottom-nav{display:none}.notification-permission-card{position:fixed;right:22px;bottom:22px;z-index:95;width:min(440px,calc(100vw - 28px));display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 24px 80px rgba(15,23,42,.20);padding:16px}.notification-permission-card .permission-icon{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:#eaf1ff;color:#2563eb;font-size:22px}.permission-copy strong{display:block;font-size:16px}.permission-copy p{margin:4px 0 0;color:#64748b;font-size:13px;line-height:1.4}.permission-actions{grid-column:1/-1;display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}.detail-actions,.input-detail-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.detail-actions form,.input-detail-actions form{margin:0}.button.view{background:#eef6ff;color:#1d4ed8;border:1px solid #bfdbfe}.button.edit{background:#f8fafc;border:1px solid #d8dee9;color:#334155}.button.delete{background:#fff1f2;border:1px solid #fecdd3;color:#be123c}.action-buttons{display:flex!important;align-items:center!important;gap:7px!important;flex-wrap:nowrap!important;justify-content:flex-start!important}.action-buttons form{display:inline-flex!important;margin:0!important}.action-buttons .button,.action-buttons button{height:34px!important;min-width:auto!important;padding:7px 10px!important;white-space:nowrap!important}.transactions-table th:last-child,.transactions-table td.actions-cell{width:236px!important;min-width:236px!important}.detail-modal-card{width:min(960px,calc(100vw - 28px))!important}.detail-modal-card .modal-body{max-height:min(74vh,760px);overflow:auto}.input-detail-modal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.input-detail-modal-grid>div{background:#f8fafc;border:1px solid #edf2f7;border-radius:14px;padding:11px}.input-detail-modal-grid .wide{grid-column:span 3}.input-detail-modal-grid span{display:block;color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.04em;font-weight:900;margin-bottom:5px}.input-detail-modal-grid b{display:block;font-size:13px;line-height:1.35;word-break:break-word}.input-detail-summary{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}.input-detail-card{transition:transform .16s ease,box-shadow .16s ease}.input-detail-card:hover{transform:translateY(-1px);box-shadow:0 18px 42px rgba(15,23,42,.09)}

/* V9.4: minimalist team performance cards */
.team-performance-cards.clean{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px}.team-perf-card.clean{padding:16px;border-radius:22px;box-shadow:0 10px 28px rgba(15,23,42,.06);background:linear-gradient(180deg,#fff,#fbfdff);overflow:hidden}.team-perf-card.clean .team-perf-head{border:0;padding:0;margin:0 0 12px;align-items:center}.team-avatar{width:42px;height:42px;border-radius:15px;background:#eaf1ff;color:#1d4ed8;display:grid;place-items:center;font-weight:900}.team-title{display:flex;gap:10px;align-items:center;min-width:0}.team-title strong{font-size:16px;line-height:1.15}.team-title small{display:block;color:#64748b;font-size:11px;margin-top:2px}.team-net-pill{padding:8px 10px;border-radius:999px;background:#ecfdf5;color:#047857;font-size:12px;font-weight:900;white-space:nowrap}.team-net-pill.neg{background:#fff1f2;color:#be123c}.team-flow{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.team-flow>div,.team-metric-list>div{border:1px solid #edf2f7;background:#f8fafc;border-radius:16px;padding:11px;min-width:0}.team-flow span,.team-metric-list span{display:flex;align-items:center;gap:6px;color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.035em;font-weight:900;margin-bottom:5px}.team-flow b,.team-metric-list b{font-variant-numeric:tabular-nums;font-size:14px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.team-metric-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.team-metric-list .wide{grid-column:1/-1}.team-settlement-note{margin-top:10px;padding:10px 12px;border:1px dashed #d8dee9;border-radius:16px;color:#64748b;font-size:12px;line-height:1.35;background:#fff}.team-settlement-note b{color:#172033}

@media(max-width:980px){.transactions-table th:last-child,.transactions-table td.actions-cell{width:auto!important;min-width:0!important}.action-buttons{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;flex-wrap:wrap!important}.action-buttons .button,.action-buttons button{width:100%!important}.input-detail-modal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.input-detail-modal-grid .wide{grid-column:span 2}}
@media(max-width:760px){body.app-body{padding-bottom:72px}.mobile-bottom-nav{position:fixed;left:10px;right:10px;bottom:10px;z-index:82;display:grid;grid-template-columns:repeat(5,1fr);gap:4px;padding:8px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);box-shadow:0 18px 50px rgba(15,23,42,.16)}.mobile-bottom-nav a,.mobile-bottom-nav button{position:relative;min-height:52px;padding:7px 4px!important;border-radius:16px!important;border:0!important;background:transparent!important;color:#64748b!important;display:grid!important;gap:2px;place-items:center;font-weight:800}.mobile-bottom-nav a.active,.mobile-bottom-nav button.active{background:#eaf1ff!important;color:#1d4ed8!important}.mobile-bottom-nav span{font-size:18px;line-height:1}.mobile-bottom-nav em{font-style:normal;font-size:10px}.mobile-bottom-nav b{position:absolute;top:3px;right:14px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#dc2626;color:#fff;font-size:10px;line-height:18px}.notification-permission-card{left:12px;right:12px;bottom:86px;width:auto;grid-template-columns:auto 1fr;padding:14px}.permission-actions{justify-content:stretch}.permission-actions .button{flex:1}.user-menu{grid-template-columns:auto 1fr auto!important;align-items:center}.user-menu>a.button[href*="logout"]{display:none}.notif-panel{position:fixed!important;left:12px!important;right:12px!important;top:auto!important;bottom:84px!important;width:auto!important;max-height:70vh;overflow:auto}.team-flow,.team-metric-list{grid-template-columns:1fr}.team-flow b,.team-metric-list b{white-space:normal}.input-detail-modal-grid{grid-template-columns:1fr}.input-detail-modal-grid .wide{grid-column:auto}.detail-actions,.input-detail-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.detail-actions .button,.detail-actions button,.input-detail-actions .button,.input-detail-actions button{width:100%}}


/* V9.5 mobile-app polish, Bootstrap Icons, notification sheet, separated input details */
:root{
  --app-soft:#f6f8fc;
  --app-card:#ffffff;
  --app-border:#e6ebf2;
  --app-ink:#0f172a;
  --app-muted:#64748b;
}
body.app-body{background:linear-gradient(180deg,#f8fafc 0%,#eef3f9 100%)!important}
.bi{line-height:1;display:inline-flex;align-items:center;justify-content:center}
.button .bi,button .bi,.nav-icon .bi,.mobile-bottom-nav .bi{font-size:1.05em}
.button,button{gap:7px!important;border-radius:14px!important;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.button:hover,button:hover{transform:translateY(-1px)}
.card,.kpi,.input-detail-card,.team-perf-card{border-color:var(--app-border)!important;box-shadow:0 14px 36px rgba(15,23,42,.06)!important}
.card{background:rgba(255,255,255,.96)!important}
.kpi{display:grid;gap:5px;min-height:102px}
.kpi strong{letter-spacing:-.03em;line-height:1.05}
.topbar{background:rgba(248,250,252,.92)!important}
.nav-icon{font-size:15px!important}
.nav-icon .bi{font-size:15px!important}

/* Floating menu button for mobile */
.floating-menu-toggle{display:none!important}
@media(max-width:760px){
  .floating-menu-toggle{
    display:flex!important;
    position:fixed!important;
    left:14px!important;
    bottom:88px!important;
    z-index:86!important;
    min-height:46px!important;
    padding:10px 13px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:rgba(15,23,42,.94)!important;
    color:#fff!important;
    box-shadow:0 14px 38px rgba(15,23,42,.26)!important;
    backdrop-filter:blur(12px)!important;
  }
  body.sidebar-mobile-open .floating-menu-toggle,body.notif-sheet-open .floating-menu-toggle{display:none!important}
  .topbar .menu-button{display:none!important}
}

/* Notification sheet */
.notif-button .bi{font-size:19px}
.notif-head strong{display:flex;align-items:center;gap:8px}
.notif-item{
  align-items:flex-start!important;
  text-decoration:none!important;
  transition:background .15s ease,transform .15s ease,border .15s ease;
}
.notif-item:hover{transform:translateY(-1px);background:#f8fbff}
.notif-item-icon{
  width:34px;height:34px;border-radius:13px;display:grid;place-items:center;flex:0 0 34px;
  background:#eef6ff;color:#2563eb;
}
.notif-item.unread .notif-item-icon{background:#2563eb;color:#fff}
.empty-notif{display:grid!important;place-items:center;gap:8px;padding:28px 12px!important;text-align:center}
.empty-notif .bi{font-size:30px;color:#94a3b8}
.permission-icon .bi{font-size:22px}
@media(max-width:760px){
  .user-menu{position:static!important}
  .notif-panel{
    position:fixed!important;
    inset:12px 12px 84px 12px!important;
    width:auto!important;
    max-height:none!important;
    display:flex!important;
    flex-direction:column!important;
    padding:14px!important;
    border-radius:26px!important;
    box-shadow:0 30px 90px rgba(15,23,42,.28)!important;
  }
  .notif-panel[hidden]{display:none!important}
  .notif-head{
    position:sticky;top:0;background:#fff;z-index:2;padding:2px 2px 10px 2px;
    border-bottom:1px solid #eef2f7;margin-bottom:8px;
  }
  .notif-list{max-height:none!important;overflow:auto!important;flex:1;margin:0!important;padding:2px 0 8px}
  .notif-foot{
    position:sticky;bottom:0;background:#fff;border-top:1px solid #eef2f7;padding:10px 2px 0 2px;
  }
  .notif-foot .button{width:100%}
  .notif-foot-note{display:none}
}

/* Transaction table: fewer columns, aligned actions, no text collisions */
.transactions-table table{min-width:980px!important;table-layout:fixed!important}
.transactions-table th:nth-child(1){width:105px}
.transactions-table th:nth-child(2){width:290px}
.transactions-table th:nth-child(3){width:135px}
.transactions-table th:nth-child(4),
.transactions-table th:nth-child(5),
.transactions-table th:nth-child(6){width:128px}
.transactions-table th:nth-child(7){width:160px}
.transactions-table th:nth-child(8){width:230px}
.date-cell b,.qty-price-cell b,.trx-main-cell strong{display:block;color:#0f172a}
.date-cell small,.qty-price-cell small,.trx-main-cell small,.status-proof-cell small{display:block;color:#64748b;margin-top:4px;font-size:12px;line-height:1.35}
.trx-main-cell{overflow-wrap:anywhere}
.trx-line{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:7px}
.money-cell{white-space:nowrap!important;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.status-proof-cell{display:grid;gap:7px;align-content:start}
.proof-inline .attachment-actions{display:flex;gap:5px;flex-wrap:wrap}
.action-buttons{align-items:center!important;gap:6px!important;flex-wrap:wrap!important}
.action-buttons form{margin:0!important;display:inline-flex!important}
.actions-cell{vertical-align:middle!important}
.actions-cell .button,.actions-cell button{height:34px!important;padding:7px 9px!important;min-width:68px!important}
.action-muted{white-space:nowrap}
@media(max-width:760px){
  .transactions-table.keep-table{overflow:visible!important;border:0!important}
  .transactions-table.keep-table table,
  .transactions-table.keep-table thead,
  .transactions-table.keep-table tbody,
  .transactions-table.keep-table tr,
  .transactions-table.keep-table th,
  .transactions-table.keep-table td{display:block!important;width:100%!important;min-width:0!important}
  .transactions-table.keep-table thead{display:none!important}
  .transactions-table.keep-table tr{background:#fff;border:1px solid var(--line);border-radius:20px;margin-bottom:12px;box-shadow:0 12px 30px rgba(15,23,42,.06);overflow:hidden}
  .transactions-table.keep-table td{border-bottom:1px solid #eef2f7!important;padding:11px 13px!important}
  .transactions-table.keep-table td::before{content:attr(data-label);display:block;margin-bottom:5px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:#64748b}
  .transactions-table.keep-table td:last-child{border-bottom:0!important}
  .action-buttons{display:grid!important;grid-template-columns:1fr 1fr;gap:8px!important;width:100%}
  .action-buttons .button,.action-buttons button,.action-buttons form{width:100%!important}
}

/* Detail Input separation and edit-in-place UI */
.edit-detail-summary{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px;
}
.edit-detail-summary>div,.input-section-stats span{
  background:#f8fafc;border:1px solid #edf2f7;border-radius:16px;padding:12px;
}
.edit-detail-summary span{display:block;color:#64748b;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em;margin-bottom:5px}
.edit-detail-summary b{display:block;color:#0f172a;line-height:1.35}
.input-detail-section{display:grid;gap:12px}
.input-section-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:rgba(255,255,255,.94);border:1px solid var(--app-border);border-radius:22px;
  padding:14px 16px;box-shadow:0 12px 30px rgba(15,23,42,.05);
}
.input-section-title{display:flex;align-items:center;gap:12px}
.input-section-icon{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:#eef6ff;color:#2563eb;flex:0 0 46px}
.input-section-title span:not(.input-section-icon){display:block;color:#64748b;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.input-section-title h2{margin:0;font-size:18px}
.input-section-title p{margin:3px 0 0;color:#64748b;font-size:13px}
.input-section-stats{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.input-section-stats span{font-size:12px;font-weight:900;color:#334155}
.input-detail-list{display:grid;gap:12px}
.input-detail-card{
  border:1px solid var(--app-border)!important;border-radius:22px!important;background:#fff!important;
  padding:16px!important;overflow:hidden!important;
}
.input-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.input-detail-head h3{margin:8px 0 0;font-size:16px;line-height:1.3;color:#0f172a}
.detail-status{display:grid;justify-items:end;gap:10px;flex:0 0 auto}
.input-detail-grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px;
}
.input-detail-grid>div{
  background:#f8fafc;border:1px solid #edf2f7;border-radius:15px;padding:11px;min-width:0;
}
.input-detail-grid span{display:block;color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.05em;font-weight:900;margin-bottom:5px}
.input-detail-grid b{display:block;word-break:break-word;line-height:1.35}
.input-detail-modal-grid>div{background:#f8fafc!important}
.input-detail-actions .button,.input-detail-actions button{min-height:40px}
@media(max-width:980px){
  .edit-detail-summary,.input-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .edit-detail-summary,.input-detail-grid{grid-template-columns:1fr}
  .input-section-head{display:grid;gap:12px;padding:13px}
  .input-section-stats{justify-content:stretch}
  .input-section-stats span{flex:1}
  .input-detail-head{display:grid}
  .detail-status{justify-items:stretch}
  .detail-actions{grid-template-columns:1fr 1fr!important}
}

/* Cleaner performance per team */
.team-performance-cards.clean{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr))!important;gap:14px!important}
.team-perf-card.clean{
  border-radius:24px!important;padding:16px!important;background:linear-gradient(180deg,#fff,#fbfdff)!important;
}
.team-perf-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.team-title{display:flex;align-items:center;gap:10px}
.team-avatar{width:44px;height:44px;border-radius:16px;display:grid;place-items:center;background:#0f172a;color:#fff;font-weight:900}
.team-title strong{display:block;font-size:15px;color:#0f172a}
.team-title small{display:block;color:#64748b;margin-top:2px}
.team-net-pill{white-space:nowrap;border-radius:999px;padding:8px 10px;background:#ecfdf5;color:#047857;font-size:12px;font-weight:900}
.team-net-pill.neg{background:#fff1f2;color:#be123c}
.team-flow{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin-bottom:10px}
.team-flow>div,.team-metric-list>div{
  background:#f8fafc;border:1px solid #edf2f7;border-radius:16px;padding:11px;min-width:0;
}
.team-flow span,.team-metric-list span{display:flex!important;align-items:center;gap:6px;color:#64748b!important;font-size:11px!important;font-weight:900!important;text-transform:uppercase;letter-spacing:.04em}
.team-flow b,.team-metric-list b{display:block;margin-top:6px;font-size:14px;color:#0f172a;white-space:nowrap;letter-spacing:-.02em}
.team-metric-list{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
.team-settlement-note{margin-top:10px;padding:10px 12px;border-radius:16px;background:#f8fafc;border:1px dashed #dbe4ee;color:#475569;font-size:12px;line-height:1.45}
@media(max-width:760px){
  .team-flow,.team-metric-list{grid-template-columns:1fr!important}
  .team-flow b,.team-metric-list b{white-space:normal}
}

/* Mobile app simplification */
@media(max-width:760px){
  body.app-body{background:#f7f9fc!important}
  .content{padding:12px 12px 18px!important;gap:14px!important}
  .topbar{border-bottom:0!important;box-shadow:0 12px 28px rgba(15,23,42,.05)!important}
  .topbar h1{font-size:19px!important}
  .topbar p{display:none}
  .card,.kpi,.input-detail-card{border-radius:22px!important}
  .kpi-grid{gap:10px!important}
  .mobile-bottom-nav{border-radius:26px!important}
  .mobile-bottom-nav i{font-size:19px!important}
  .mobile-bottom-nav span{display:none!important}
}

/* V9.6: clean mobile app UI, fixed notification route, full transaction table, XLS-grouped details */
.topbar{padding-right:36px!important}.user-menu{padding-right:6px!important}.user-menu .button.ghost{min-height:40px!important}.user-identity{margin-right:2px!important}.nav a{display:flex!important;align-items:center!important}.nav a span:last-child{line-height:1.25}.sidebar{scrollbar-width:thin}.sidebar::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:99px}
.notification-page-shell{display:grid;gap:14px}.notification-hero{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center}.notification-hero h2{margin:0 0 4px;font-size:22px}.notification-hero p{margin:0;color:#64748b;line-height:1.45}.notification-hero-icon{width:58px;height:58px;border-radius:20px;display:grid;place-items:center;background:#eaf1ff;color:#2563eb;font-size:25px}.notification-hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.notification-hero-actions form{margin:0}.notification-count-card{background:#f8fafc;border:1px solid #edf2f7;border-radius:18px;padding:12px 16px;min-width:118px;text-align:center}.notification-count-card span{display:block;color:#64748b;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.notification-count-card strong{display:block;font-size:28px;letter-spacing:-.04em}.notif-page-list.clean{display:grid;gap:10px}.notif-page-list.clean .notif-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:12px;border-radius:18px;padding:14px 15px;box-shadow:0 10px 26px rgba(15,23,42,.04)}.notif-card-copy strong{font-size:14px}.notif-card-copy p{margin:4px 0 5px}.empty-notif-page{display:grid;place-items:center;text-align:center;gap:7px;padding:34px!important;color:#64748b}.empty-notif-page i{font-size:32px;color:#94a3b8}.empty-notif-page strong{color:#0f172a}
.transactions-table.finance-table-wrap{overflow-x:auto!important;overflow-y:visible!important;border-radius:18px!important}.transactions-table table{min-width:1680px!important;width:max-content!important;table-layout:fixed!important}.transactions-table th,.transactions-table td{vertical-align:middle!important;padding:11px 12px!important}.transactions-table th:nth-child(1){width:112px}.transactions-table th:nth-child(2){width:142px}.transactions-table th:nth-child(3){width:135px}.transactions-table th:nth-child(4){width:230px}.transactions-table th:nth-child(5){width:180px}.transactions-table th:nth-child(6){width:126px}.transactions-table th:nth-child(7),.transactions-table th:nth-child(8),.transactions-table th:nth-child(9),.transactions-table th:nth-child(10){width:132px}.transactions-table th:nth-child(11){width:118px}.transactions-table th:nth-child(12){width:150px}.transactions-table th:nth-child(13){width:210px}.transactions-table th:nth-child(14){width:244px}.transactions-table th:last-child,.transactions-table td.actions-cell{position:sticky;right:0;z-index:2;background:#fff!important;box-shadow:-10px 0 20px rgba(15,23,42,.04);width:244px!important;min-width:244px!important}.transactions-table th:last-child{background:#f8fafc!important;z-index:3}.transactions-table .description-cell,.transactions-table .partner-cell,.transactions-table .source-cell{white-space:normal!important;overflow-wrap:anywhere!important}.transactions-table .description-cell b{display:block;font-size:13px;line-height:1.35}.transactions-table .description-cell small,.transactions-table .status-cell small,.transactions-table .source-cell small,.transactions-table .date-cell small{display:block;margin-top:4px;color:#64748b;font-size:11px;line-height:1.3}.transactions-table .money-cell{white-space:nowrap!important;text-align:right!important;font-variant-numeric:tabular-nums}.transactions-table .proof-cell .attachment-actions{display:grid;gap:5px}.transactions-table .status-cell{display:grid;gap:6px;align-content:center}.transactions-table .actions-cell{white-space:normal!important}.action-buttons{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;align-items:center!important;width:100%!important}.action-buttons form{display:block!important;margin:0!important;width:100%!important}.action-buttons .button,.action-buttons button{width:100%!important;min-width:0!important;height:36px!important;padding:7px 8px!important;line-height:1!important;white-space:nowrap!important}.action-buttons .action-muted{grid-column:1/-1;justify-content:center}.button.view,.button.edit,.button.delete{box-shadow:none!important}.button.view .bi,.button.edit .bi,.button.delete .bi{font-size:14px!important}
.input-source-section{display:grid;gap:14px;margin-bottom:18px}.input-source-head{display:flex;align-items:center;justify-content:space-between;gap:14px;background:linear-gradient(180deg,#ffffff,#f9fbff);border:1px solid var(--app-border);border-radius:24px;padding:16px;box-shadow:0 14px 34px rgba(15,23,42,.06)}.input-section-head.compact{border-radius:20px;background:#fff;box-shadow:none}.input-detail-section{margin-left:12px;border-left:3px solid #eaf1ff;padding-left:14px}.input-detail-summary .pill{display:inline-flex;align-items:center;gap:5px}.input-detail-card{border-radius:22px!important}.input-detail-head h3{word-break:break-word}.input-detail-modal-grid .wide b{white-space:pre-wrap}.edit-detail-card .card-head h2{display:flex;align-items:center;gap:8px}.kpi small{line-height:1.35}.team-performance-cards.clean{gap:16px!important}.team-perf-card.clean{border-radius:26px!important;padding:18px!important}.team-perf-head{align-items:center!important}.team-avatar{box-shadow:inset 0 0 0 1px rgba(37,99,235,.12)}.team-metric-list>div,.team-flow>div{min-height:74px}.team-settlement-note{display:block!important;background:#f9fbff!important}
@media(max-width:760px){body.app-body{padding-bottom:78px!important}.topbar{padding:14px 16px 14px 64px!important;gap:10px!important;border-radius:0 0 22px 22px!important}.topbar .top-title{min-width:0}.topbar h1{font-size:18px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-menu{margin-left:auto!important;padding-right:0!important;gap:7px!important;flex-wrap:nowrap!important}.user-identity{display:none!important}.user-menu .button.ghost{padding:9px!important;min-width:40px!important;width:40px!important;height:40px!important}.user-menu .button.ghost{font-size:0!important}.user-menu .button.ghost .bi{font-size:17px!important}.notif-button{width:40px!important;height:40px!important}.floating-menu-toggle{top:12px!important;left:12px!important;bottom:auto!important;width:44px!important;height:44px!important;min-height:44px!important;padding:0!important;border-radius:16px!important;background:#0f172a!important;box-shadow:0 14px 34px rgba(15,23,42,.24)!important;z-index:120!important}.floating-menu-toggle .bi{font-size:22px!important}.floating-menu-toggle span{display:none!important}body.sidebar-mobile-open .floating-menu-toggle{display:flex!important;left:292px!important;background:#fff!important;color:#0f172a!important;border-color:#dbe4ee!important}.sidebar{z-index:110!important;width:280px!important;padding-top:20px!important}.sidebar-backdrop.show{z-index:100!important}.mobile-bottom-nav{left:12px!important;right:12px!important;bottom:10px!important;border-radius:24px!important;padding:7px!important}.mobile-bottom-nav a,.mobile-bottom-nav button{min-height:54px!important}.mobile-bottom-nav em{font-size:10px!important}.notification-hero{grid-template-columns:1fr!important;text-align:left;padding:16px!important}.notification-hero-icon{width:52px;height:52px}.notification-count-card{text-align:left}.notification-hero-actions{display:grid}.notification-hero-actions .button,.notification-hero-actions form{width:100%}.notif-page-list.clean .notif-card{grid-template-columns:auto minmax(0,1fr) auto;border-radius:20px}.transactions-table.finance-table-wrap{margin-left:-4px;margin-right:-4px;border-radius:16px!important}.transactions-table table{min-width:1540px!important}.transactions-table th:last-child,.transactions-table td.actions-cell{position:sticky;right:0;width:226px!important;min-width:226px!important}.action-buttons{gap:6px!important}.action-buttons .button,.action-buttons button{height:34px!important;font-size:12px!important;padding:6px!important}.input-source-head,.input-section-head.compact{display:grid!important;gap:12px;padding:14px!important}.input-detail-section{margin-left:0;padding-left:0;border-left:0}.input-section-stats{display:grid!important;grid-template-columns:1fr 1fr!important}.detail-actions,.input-detail-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important}.detail-actions .button,.detail-actions button,.input-detail-actions .button,.input-detail-actions button{font-size:12px!important;padding:8px!important}.team-perf-card.clean{padding:15px!important}.team-metric-list>div,.team-flow>div{min-height:auto}.content{padding-top:14px!important}}
@media(max-width:760px){.transactions-table.keep-table{overflow-x:auto!important;overflow-y:visible!important;border:1px solid var(--line)!important;background:#fff!important}.transactions-table.keep-table table{display:table!important;width:max-content!important;min-width:1540px!important}.transactions-table.keep-table thead{display:table-header-group!important}.transactions-table.keep-table tbody{display:table-row-group!important}.transactions-table.keep-table tr{display:table-row!important;background:#fff!important;border:0!important;border-radius:0!important;margin:0!important;box-shadow:none!important;overflow:visible!important}.transactions-table.keep-table th,.transactions-table.keep-table td{display:table-cell!important;width:auto!important;border-bottom:1px solid var(--line)!important}.transactions-table.keep-table td::before{display:none!important;content:none!important}.transactions-table.keep-table th:last-child,.transactions-table.keep-table td.actions-cell{width:226px!important;min-width:226px!important}}

/* V9.7 - Audit XLS + tabel transaksi lebih stabil */
.audit-hero{background:linear-gradient(180deg,#fff,#f8fbff)}
.audit-note-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.audit-note-grid>div{border:1px solid var(--line);background:#fff;border-radius:18px;padding:14px}.audit-note-grid b{display:block;margin-bottom:4px}.audit-note-grid span{color:#64748b;font-size:13px;line-height:1.4}.quality-issue-list{display:grid;gap:12px}.quality-issue-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,260px);gap:16px;border:1px solid var(--line);border-radius:22px;background:#fff;padding:15px;box-shadow:0 12px 30px rgba(15,23,42,.05)}.quality-issue-card.error{border-color:#fecdd3;background:#fff7f8}.quality-issue-card.warning{border-color:#fde68a;background:#fffdf4}.quality-issue-head{display:flex;gap:8px;align-items:center;margin-bottom:8px}.quality-issue-card h3{margin:0 0 6px;font-size:16px}.quality-issue-card p{margin:0 0 8px;color:#475569;line-height:1.45}.quality-issue-card small{display:flex;gap:6px;align-items:center;color:#64748b}.mini-metrics{display:grid;gap:6px;background:#fff;border:1px solid rgba(15,23,42,.07);border-radius:16px;padding:10px}.mini-metrics span{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:#64748b}.mini-metrics b{font-size:13px;color:#0f172a}.issue-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.audit-sheet-table table{min-width:1080px}.source-quality-alerts{display:grid;gap:8px;margin:-4px 0 12px}.source-quality-alert{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:16px;background:#fff;padding:10px 12px}.source-quality-alert.warning{border-color:#fde68a;background:#fffdf4}.source-quality-alert.error{border-color:#fecdd3;background:#fff7f8}.source-quality-alert i{margin-top:2px}.source-quality-alert b{display:block;font-size:13px}.source-quality-alert span{display:block;color:#64748b;font-size:12px;line-height:1.35}.transactions-table.finance-table-wrap table{border-collapse:separate!important;border-spacing:0!important}.transactions-table.finance-table-wrap tbody tr{height:auto!important}.transactions-table.finance-table-wrap td.actions-cell{vertical-align:middle!important}.transactions-table.finance-table-wrap .action-buttons{display:grid!important;grid-template-columns:repeat(3,1fr)!important;align-items:center!important;gap:6px!important}.transactions-table.finance-table-wrap .action-buttons .button,.transactions-table.finance-table-wrap .action-buttons button{display:inline-flex!important;align-items:center!important;justify-content:center!important;height:34px!important;line-height:1!important;margin:0!important}.transactions-table.finance-table-wrap .action-buttons form{display:flex!important;align-items:center!important;margin:0!important}.transactions-table.finance-table-wrap .source-cell .badge{margin-top:6px;display:inline-flex;align-items:center;gap:4px}.transactions-table.finance-table-wrap .description-cell,.transactions-table.finance-table-wrap .partner-cell,.transactions-table.finance-table-wrap .source-cell{line-height:1.35!important}.input-detail-modal-grid .badge{display:inline-flex!important;width:max-content}.kpi.warn strong{color:#b45309}
@media(max-width:760px){.audit-note-grid,.quality-issue-card{grid-template-columns:1fr}.quality-issue-side{display:grid;gap:8px}.issue-actions{display:grid;grid-template-columns:1fr 1fr}.issue-actions .button{width:100%}.transactions-table.finance-table-wrap .action-buttons{grid-template-columns:1fr!important}.transactions-table.finance-table-wrap th:last-child,.transactions-table.finance-table-wrap td.actions-cell{width:132px!important;min-width:132px!important}.transactions-table.finance-table-wrap .action-buttons .button,.transactions-table.finance-table-wrap .action-buttons button{font-size:0!important;padding:8px!important}.transactions-table.finance-table-wrap .action-buttons .bi{font-size:16px!important;margin:0!important}.source-quality-alerts{margin-top:0}}

/* V9.8: mobile header cleanup, floating icon-only sidebar toggle, safe transaction table */
@media(max-width:760px){
  .topbar{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    min-height:62px!important;
    padding:12px 14px 12px 64px!important;
    border-radius:0 0 22px 22px!important;
    overflow:visible!important;
  }
  .topbar .menu-button,.topbar .topbar-notif,.topbar .topbar-account,.topbar #notifPanel,.topbar .user-identity{display:none!important}
  .topbar .top-title{grid-column:auto!important;flex:1 1 auto!important;min-width:0!important;max-width:100%!important}
  .topbar h1{font-size:18px!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .topbar .user-menu{display:flex!important;grid-column:auto!important;flex:0 0 auto!important;width:auto!important;margin:0!important;padding:0!important;gap:0!important;justify-content:flex-end!important}
  .topbar .topbar-logout{display:inline-flex!important;width:40px!important;height:40px!important;min-width:40px!important;padding:0!important;border-radius:14px!important;font-size:0!important;background:#fff!important;border:1px solid #e2e8f0!important;box-shadow:0 8px 20px rgba(15,23,42,.06)!important}
  .topbar .topbar-logout .bi{font-size:18px!important;margin:0!important}

  .floating-menu-toggle{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:fixed!important;
    top:12px!important;
    left:12px!important;
    right:auto!important;
    bottom:auto!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
    padding:0!important;
    border-radius:15px!important;
    background:#0f172a!important;
    color:#fff!important;
    border:1px solid rgba(255,255,255,.16)!important;
    box-shadow:0 14px 34px rgba(15,23,42,.25)!important;
    z-index:140!important;
    font-size:0!important;
  }
  .floating-menu-toggle .bi{font-size:22px!important;line-height:1!important;margin:0!important}
  body.sidebar-mobile-open .floating-menu-toggle{
    display:inline-flex!important;
    left:12px!important;
    top:12px!important;
    background:#fff!important;
    color:#0f172a!important;
    border-color:#dbe4ee!important;
  }
  .sidebar{z-index:130!important;padding-top:68px!important}
  .sidebar-backdrop.show{z-index:120!important}
}

.transactions-table.finance-table-wrap{
  overflow-x:auto!important;
  overflow-y:visible!important;
  border-radius:18px!important;
  background:#fff!important;
  -webkit-overflow-scrolling:touch!important;
}
.transactions-table.finance-table-wrap table{
  min-width:1720px!important;
  width:1720px!important;
  max-width:none!important;
  table-layout:fixed!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}
.transactions-table.finance-table-wrap th,
.transactions-table.finance-table-wrap td{
  box-sizing:border-box!important;
  vertical-align:middle!important;
  padding:11px 12px!important;
  line-height:1.35!important;
  overflow:visible!important;
}
.transactions-table.finance-table-wrap th:nth-child(1),.transactions-table.finance-table-wrap td:nth-child(1){width:112px!important}
.transactions-table.finance-table-wrap th:nth-child(2),.transactions-table.finance-table-wrap td:nth-child(2){width:140px!important}
.transactions-table.finance-table-wrap th:nth-child(3),.transactions-table.finance-table-wrap td:nth-child(3){width:132px!important}
.transactions-table.finance-table-wrap th:nth-child(4),.transactions-table.finance-table-wrap td:nth-child(4){width:234px!important}
.transactions-table.finance-table-wrap th:nth-child(5),.transactions-table.finance-table-wrap td:nth-child(5){width:174px!important}
.transactions-table.finance-table-wrap th:nth-child(6),.transactions-table.finance-table-wrap td:nth-child(6){width:124px!important}
.transactions-table.finance-table-wrap th:nth-child(7),.transactions-table.finance-table-wrap td:nth-child(7),
.transactions-table.finance-table-wrap th:nth-child(8),.transactions-table.finance-table-wrap td:nth-child(8),
.transactions-table.finance-table-wrap th:nth-child(9),.transactions-table.finance-table-wrap td:nth-child(9),
.transactions-table.finance-table-wrap th:nth-child(10),.transactions-table.finance-table-wrap td:nth-child(10){width:130px!important}
.transactions-table.finance-table-wrap th:nth-child(11),.transactions-table.finance-table-wrap td:nth-child(11){width:116px!important}
.transactions-table.finance-table-wrap th:nth-child(12),.transactions-table.finance-table-wrap td:nth-child(12){width:146px!important}
.transactions-table.finance-table-wrap th:nth-child(13),.transactions-table.finance-table-wrap td:nth-child(13){width:206px!important}
.transactions-table.finance-table-wrap th:nth-child(14),.transactions-table.finance-table-wrap td:nth-child(14){width:246px!important}
.transactions-table.finance-table-wrap .date-cell b,
.transactions-table.finance-table-wrap .description-cell b,
.transactions-table.finance-table-wrap .qty-price-cell b{display:block!important;min-width:0!important;max-width:100%!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.transactions-table.finance-table-wrap .date-cell small,
.transactions-table.finance-table-wrap .description-cell small,
.transactions-table.finance-table-wrap .status-cell small,
.transactions-table.finance-table-wrap .source-cell small{display:block!important;margin-top:4px!important;color:#64748b!important;font-size:11px!important;line-height:1.3!important;overflow-wrap:anywhere!important}
.transactions-table.finance-table-wrap .money-cell{white-space:nowrap!important;text-align:right!important;font-variant-numeric:tabular-nums!important;overflow:hidden!important;text-overflow:ellipsis!important}
.transactions-table.finance-table-wrap th:last-child,
.transactions-table.finance-table-wrap td.actions-cell{
  position:sticky!important;
  right:0!important;
  width:246px!important;
  min-width:246px!important;
  max-width:246px!important;
  background:#fff!important;
  z-index:4!important;
  box-shadow:-12px 0 24px rgba(15,23,42,.06)!important;
}
.transactions-table.finance-table-wrap th:last-child{background:#f8fafc!important;z-index:5!important}
.transactions-table.finance-table-wrap td.actions-cell{white-space:normal!important;text-align:center!important;vertical-align:middle!important}
.transactions-table.finance-table-wrap .action-buttons{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:6px!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:38px!important;
}
.transactions-table.finance-table-wrap .action-buttons form{display:block!important;width:100%!important;margin:0!important;padding:0!important}
.transactions-table.finance-table-wrap .action-buttons .button,
.transactions-table.finance-table-wrap .action-buttons button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  width:100%!important;
  height:36px!important;
  min-width:0!important;
  padding:0 8px!important;
  margin:0!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.transactions-table.finance-table-wrap .action-buttons .bi{flex:0 0 auto!important;margin:0!important}
.transactions-table.finance-table-wrap .action-muted{grid-column:1/-1!important;display:flex!important;align-items:center!important;justify-content:center!important;color:#64748b!important;font-size:12px!important}

@media(max-width:760px){
  .transactions-table.finance-table-wrap{margin-left:0!important;margin-right:0!important;border-radius:16px!important}
  .transactions-table.finance-table-wrap table{min-width:1540px!important;width:1540px!important;max-width:none!important}
  .transactions-table.finance-table-wrap th,.transactions-table.finance-table-wrap td{padding:10px 10px!important;font-size:12px!important}
  .transactions-table.finance-table-wrap th:nth-child(4),.transactions-table.finance-table-wrap td:nth-child(4){width:205px!important}
  .transactions-table.finance-table-wrap th:nth-child(5),.transactions-table.finance-table-wrap td:nth-child(5){width:150px!important}
  .transactions-table.finance-table-wrap th:nth-child(13),.transactions-table.finance-table-wrap td:nth-child(13){width:170px!important}
  .transactions-table.finance-table-wrap th:last-child,
  .transactions-table.finance-table-wrap td.actions-cell{width:156px!important;min-width:156px!important;max-width:156px!important}
  .transactions-table.finance-table-wrap .action-buttons{grid-template-columns:repeat(3,44px)!important;gap:5px!important;justify-content:center!important}
  .transactions-table.finance-table-wrap .action-buttons .button,
  .transactions-table.finance-table-wrap .action-buttons button{width:44px!important;height:36px!important;padding:0!important;font-size:0!important;border-radius:12px!important}
  .transactions-table.finance-table-wrap .action-buttons .bi{font-size:16px!important}
}

/* V9.8.1 - Tabel Data Transaksi rapi: tanpa overlay sticky, aksi sejajar, mobile card */
.clean-transaction-table.finance-table-wrap{
  overflow-x:auto!important;
  overflow-y:visible!important;
  border-radius:20px!important;
  border:1px solid #e2e8f0!important;
  background:#fff!important;
  box-shadow:0 10px 28px rgba(15,23,42,.04)!important;
  -webkit-overflow-scrolling:touch!important;
}
.clean-transaction-table.finance-table-wrap table{
  width:1880px!important;
  min-width:1880px!important;
  max-width:none!important;
  table-layout:fixed!important;
  border-collapse:separate!important;
  border-spacing:0!important;
  background:#fff!important;
}
.clean-transaction-table.finance-table-wrap thead th{
  position:static!important;
  top:auto!important;
  background:#f8fafc!important;
  color:#475569!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  border-bottom:1px solid #e2e8f0!important;
}
.clean-transaction-table.finance-table-wrap th,
.clean-transaction-table.finance-table-wrap td{
  position:static!important;
  box-sizing:border-box!important;
  vertical-align:middle!important;
  padding:12px 14px!important;
  line-height:1.38!important;
  overflow:hidden!important;
  border-right:1px solid #f1f5f9!important;
}
.clean-transaction-table.finance-table-wrap th:last-child,
.clean-transaction-table.finance-table-wrap td:last-child{border-right:0!important}
.clean-transaction-table.finance-table-wrap tbody tr:hover td{background:#fbfdff!important}
.clean-transaction-table.finance-table-wrap th:nth-child(1),.clean-transaction-table.finance-table-wrap td:nth-child(1){width:120px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(2),.clean-transaction-table.finance-table-wrap td:nth-child(2){width:145px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(3),.clean-transaction-table.finance-table-wrap td:nth-child(3){width:140px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(4),.clean-transaction-table.finance-table-wrap td:nth-child(4){width:270px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(5),.clean-transaction-table.finance-table-wrap td:nth-child(5){width:190px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(6),.clean-transaction-table.finance-table-wrap td:nth-child(6){width:135px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(7),.clean-transaction-table.finance-table-wrap td:nth-child(7),
.clean-transaction-table.finance-table-wrap th:nth-child(8),.clean-transaction-table.finance-table-wrap td:nth-child(8),
.clean-transaction-table.finance-table-wrap th:nth-child(9),.clean-transaction-table.finance-table-wrap td:nth-child(9),
.clean-transaction-table.finance-table-wrap th:nth-child(10),.clean-transaction-table.finance-table-wrap td:nth-child(10){width:138px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(11),.clean-transaction-table.finance-table-wrap td:nth-child(11){width:132px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(12),.clean-transaction-table.finance-table-wrap td:nth-child(12){width:152px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(13),.clean-transaction-table.finance-table-wrap td:nth-child(13){width:235px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(14),.clean-transaction-table.finance-table-wrap td:nth-child(14){width:295px!important;min-width:295px!important;max-width:295px!important;background:#fff!important;box-shadow:none!important;right:auto!important;z-index:auto!important}
.clean-transaction-table.finance-table-wrap .date-cell b,
.clean-transaction-table.finance-table-wrap .description-cell b,
.clean-transaction-table.finance-table-wrap .qty-price-cell b{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.clean-transaction-table.finance-table-wrap .date-cell small,
.clean-transaction-table.finance-table-wrap .description-cell small,
.clean-transaction-table.finance-table-wrap .status-cell small,
.clean-transaction-table.finance-table-wrap .source-cell small{
  display:block!important;
  max-width:100%!important;
  margin-top:4px!important;
  color:#64748b!important;
  font-size:11px!important;
  line-height:1.35!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.clean-transaction-table.finance-table-wrap .partner-cell,
.clean-transaction-table.finance-table-wrap .product-cell,
.clean-transaction-table.finance-table-wrap .trx-type-cell,
.clean-transaction-table.finance-table-wrap .proof-cell,
.clean-transaction-table.finance-table-wrap .status-cell,
.clean-transaction-table.finance-table-wrap .source-cell{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.clean-transaction-table.finance-table-wrap .money-cell{
  text-align:right!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
  font-size:12px!important;
}
.clean-transaction-table.finance-table-wrap .actions-cell{
  text-align:center!important;
  overflow:visible!important;
  white-space:normal!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:8px!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-height:40px!important;
}
.clean-transaction-table.finance-table-wrap .transaction-action-form,
.clean-transaction-table.finance-table-wrap .action-buttons form{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons .button,
.clean-transaction-table.finance-table-wrap .action-buttons button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  min-width:0!important;
  height:38px!important;
  padding:0 10px!important;
  margin:0!important;
  border-radius:12px!important;
  line-height:1!important;
  font-size:12px!important;
  font-weight:800!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons .button span,
.clean-transaction-table.finance-table-wrap .action-buttons button span{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons .bi{flex:0 0 auto!important;font-size:14px!important;margin:0!important}
.clean-transaction-table.finance-table-wrap .action-muted{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  height:38px!important;
  padding:0 10px!important;
  border:1px solid #e2e8f0!important;
  border-radius:12px!important;
  background:#f8fafc!important;
  color:#64748b!important;
  font-size:12px!important;
  font-weight:800!important;
  white-space:nowrap!important;
}
.clean-transaction-table.finance-table-wrap .attachment-actions{display:grid!important;grid-template-columns:1fr!important;gap:5px!important}
.clean-transaction-table.finance-table-wrap .attachment-actions .button{width:100%!important;height:30px!important;padding:0 8px!important;font-size:11px!important}

@media(max-width:760px){
  .clean-transaction-table.finance-table-wrap{
    overflow:visible!important;
    border:0!important;
    box-shadow:none!important;
    background:transparent!important;
  }
  .clean-transaction-table.finance-table-wrap table,
  .clean-transaction-table.finance-table-wrap thead,
  .clean-transaction-table.finance-table-wrap tbody,
  .clean-transaction-table.finance-table-wrap th,
  .clean-transaction-table.finance-table-wrap td,
  .clean-transaction-table.finance-table-wrap tr{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }
  .clean-transaction-table.finance-table-wrap table{background:transparent!important;border-collapse:separate!important;border-spacing:0!important}
  .clean-transaction-table.finance-table-wrap thead{display:none!important}
  .clean-transaction-table.finance-table-wrap tbody{display:grid!important;gap:12px!important}
  .clean-transaction-table.finance-table-wrap tbody tr{
    background:#fff!important;
    border:1px solid #e2e8f0!important;
    border-radius:18px!important;
    padding:12px!important;
    box-shadow:0 10px 26px rgba(15,23,42,.05)!important;
    overflow:hidden!important;
  }
  .clean-transaction-table.finance-table-wrap td{
    display:grid!important;
    grid-template-columns:108px minmax(0,1fr)!important;
    align-items:start!important;
    gap:12px!important;
    padding:9px 0!important;
    border:0!important;
    border-bottom:1px solid #f1f5f9!important;
    background:transparent!important;
    text-align:left!important;
    overflow:visible!important;
  }
  .clean-transaction-table.finance-table-wrap td::before{
    content:attr(data-label)!important;
    color:#64748b!important;
    font-size:11px!important;
    font-weight:900!important;
    letter-spacing:.04em!important;
    text-transform:uppercase!important;
    padding-top:2px!important;
  }
  .clean-transaction-table.finance-table-wrap td:last-child{border-bottom:0!important}
  .clean-transaction-table.finance-table-wrap .money-cell{text-align:left!important;font-size:13px!important}
  .clean-transaction-table.finance-table-wrap .date-cell b,
  .clean-transaction-table.finance-table-wrap .description-cell b,
  .clean-transaction-table.finance-table-wrap .qty-price-cell b,
  .clean-transaction-table.finance-table-wrap .date-cell small,
  .clean-transaction-table.finance-table-wrap .description-cell small,
  .clean-transaction-table.finance-table-wrap .status-cell small,
  .clean-transaction-table.finance-table-wrap .source-cell small{
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .clean-transaction-table.finance-table-wrap .actions-cell{
    display:block!important;
    padding-top:12px!important;
  }
  .clean-transaction-table.finance-table-wrap .actions-cell::before{display:none!important}
  .clean-transaction-table.finance-table-wrap .action-buttons{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .clean-transaction-table.finance-table-wrap .action-buttons .button,
  .clean-transaction-table.finance-table-wrap .action-buttons button,
  .clean-transaction-table.finance-table-wrap .action-muted{
    height:40px!important;
    padding:0 8px!important;
    font-size:12px!important;
    border-radius:13px!important;
  }
  .clean-transaction-table.finance-table-wrap .action-buttons .button span,
  .clean-transaction-table.finance-table-wrap .action-buttons button span{display:inline!important}
}

@media(max-width:420px){
  .clean-transaction-table.finance-table-wrap td{grid-template-columns:92px minmax(0,1fr)!important;gap:10px!important}
  .clean-transaction-table.finance-table-wrap .action-buttons{grid-template-columns:1fr!important}
  .clean-transaction-table.finance-table-wrap .action-buttons .button,
  .clean-transaction-table.finance-table-wrap .action-buttons button,
  .clean-transaction-table.finance-table-wrap .action-muted{width:100%!important}
}

/* V9.8.2: critical audit warning visibility */
@keyframes hsaDangerPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,.34);border-color:#ef4444;background:#fff1f2}
  50%{box-shadow:0 0 0 8px rgba(220,38,38,.08);border-color:#b91c1c;background:#ffe4e6}
}
@keyframes hsaIconBlink{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.42;transform:scale(.92)}
}
.blink-danger{animation:hsaDangerPulse 1.25s ease-in-out infinite!important}
.critical-audit-banner{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  margin:0 0 16px;
  padding:14px 16px;
  border:2px solid #ef4444;
  border-radius:22px;
  background:#fff1f2;
  color:#7f1d1d;
}
.critical-audit-banner>i{font-size:26px;color:#dc2626;animation:hsaIconBlink .9s ease-in-out infinite}
.critical-audit-banner strong{display:block;font-size:15px;color:#7f1d1d;margin-bottom:2px}
.critical-audit-banner span{display:block;font-size:13px;line-height:1.45;color:#991b1b}
.nav a.has-alert{position:relative;border-color:rgba(239,68,68,.35)!important}
.nav a.has-alert .nav-icon{color:#dc2626!important;background:rgba(254,226,226,.16)!important}
.nav-label{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;width:100%}
.nav-alert-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-width:22px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  border:1px solid #fecaca;
  background:#fee2e2;
  color:#b91c1c;
  font-style:normal;
  font-size:12px;
  font-weight:900;
  line-height:1;
  animation:hsaIconBlink .9s ease-in-out infinite;
}
.nav-alert-badge .bi{font-size:13px!important}.nav-alert-badge b{font-size:11px;line-height:1}
.quality-issue-card.error,.quality-issue-card.warning{
  border:2px solid #ef4444!important;
  background:#fff1f2!important;
  outline:2px solid rgba(239,68,68,.22)!important;
  outline-offset:2px!important;
}
.quality-issue-card .issue-title{display:flex;align-items:flex-start;gap:9px;color:#7f1d1d!important;line-height:1.25}
.quality-issue-card .issue-title .bi{color:#dc2626;font-size:18px;line-height:1.2;animation:hsaIconBlink .9s ease-in-out infinite;flex:0 0 auto}
.quality-issue-card .quality-issue-head .badge.primary,
.quality-issue-card .quality-issue-head .badge.danger{background:#dc2626!important;color:#fff!important;border-color:#b91c1c!important}
.source-quality-alert.error,.source-quality-alert.warning{
  border:2px solid #ef4444!important;
  background:#fff1f2!important;
  outline:2px solid rgba(239,68,68,.22)!important;
  outline-offset:2px!important;
}
.source-quality-alert.error i,.source-quality-alert.warning i{color:#dc2626!important;animation:hsaIconBlink .9s ease-in-out infinite}
.source-quality-alert b{color:#7f1d1d!important;font-size:14px!important}.source-quality-alert span{color:#991b1b!important}
.source-quality-alert small{display:flex!important;align-items:center;gap:6px;margin-top:6px;color:#7f1d1d!important;font-size:12px!important;line-height:1.35!important}
.source-quality-alert small i{animation:none!important;font-size:12px!important;color:#b91c1c!important}
.kpi.warn{border:2px solid #ef4444!important;background:#fff1f2!important;outline:2px solid rgba(239,68,68,.16)!important;outline-offset:2px!important}
.kpi.warn span,.kpi.warn small{color:#991b1b!important}.kpi.warn strong{color:#b91c1c!important}
@media(max-width:760px){
  .critical-audit-banner{grid-template-columns:auto minmax(0,1fr);align-items:flex-start;border-radius:18px;padding:13px}
  .critical-audit-banner .button{grid-column:1 / -1;width:100%}
  .nav-alert-count b{display:none}.nav-alert-badge{min-width:20px;height:20px;padding:0 5px}
}
@media(prefers-reduced-motion:reduce){.blink-danger,.nav-alert-badge,.critical-audit-banner>i,.quality-issue-card .issue-title .bi,.source-quality-alert.error i,.source-quality-alert.warning i{animation:none!important}}

/* V9.8.3: final alignment for Data Transaksi + team warning badges */
.clean-transaction-table.finance-table-wrap{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  border:1px solid #dde7f3!important;
  border-radius:20px!important;
  background:#fff!important;
}
.clean-transaction-table.finance-table-wrap table{
  width:1960px!important;
  min-width:1960px!important;
  max-width:none!important;
  table-layout:fixed!important;
  border-collapse:collapse!important;
  border-spacing:0!important;
}
.clean-transaction-table.finance-table-wrap th,
.clean-transaction-table.finance-table-wrap td{
  position:static!important;
  box-sizing:border-box!important;
  height:68px!important;
  min-height:68px!important;
  padding:12px 14px!important;
  border:1px solid #e7edf5!important;
  vertical-align:middle!important;
  background:#fff!important;
  line-height:1.35!important;
  overflow:hidden!important;
}
.clean-transaction-table.finance-table-wrap thead th{
  height:42px!important;
  min-height:42px!important;
  background:#f8fafc!important;
  color:#334155!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  text-align:left!important;
}
.clean-transaction-table.finance-table-wrap tbody tr:hover td{background:#fcfdff!important}
.clean-transaction-table.finance-table-wrap th:nth-child(1),.clean-transaction-table.finance-table-wrap td:nth-child(1){width:126px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(2),.clean-transaction-table.finance-table-wrap td:nth-child(2){width:150px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(3),.clean-transaction-table.finance-table-wrap td:nth-child(3){width:145px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(4),.clean-transaction-table.finance-table-wrap td:nth-child(4){width:285px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(5),.clean-transaction-table.finance-table-wrap td:nth-child(5){width:195px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(6),.clean-transaction-table.finance-table-wrap td:nth-child(6){width:140px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(7),.clean-transaction-table.finance-table-wrap td:nth-child(7),
.clean-transaction-table.finance-table-wrap th:nth-child(8),.clean-transaction-table.finance-table-wrap td:nth-child(8),
.clean-transaction-table.finance-table-wrap th:nth-child(9),.clean-transaction-table.finance-table-wrap td:nth-child(9),
.clean-transaction-table.finance-table-wrap th:nth-child(10),.clean-transaction-table.finance-table-wrap td:nth-child(10){width:142px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(11),.clean-transaction-table.finance-table-wrap td:nth-child(11){width:115px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(12),.clean-transaction-table.finance-table-wrap td:nth-child(12){width:190px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(13),.clean-transaction-table.finance-table-wrap td:nth-child(13){width:305px!important}
.clean-transaction-table.finance-table-wrap th:nth-child(14),.clean-transaction-table.finance-table-wrap td:nth-child(14){width:265px!important;min-width:265px!important;max-width:265px!important}
.clean-transaction-table.finance-table-wrap .date-cell b,
.clean-transaction-table.finance-table-wrap .description-cell b,
.clean-transaction-table.finance-table-wrap .qty-price-cell b,
.clean-transaction-table.finance-table-wrap .partner-cell,
.clean-transaction-table.finance-table-wrap .product-cell,
.clean-transaction-table.finance-table-wrap .trx-type-cell,
.clean-transaction-table.finance-table-wrap .proof-cell{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.clean-transaction-table.finance-table-wrap .date-cell small,
.clean-transaction-table.finance-table-wrap .description-cell small,
.clean-transaction-table.finance-table-wrap .source-cell small,
.clean-transaction-table.finance-table-wrap .status-cell small{
  display:block!important;
  max-width:100%!important;
  margin-top:5px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:#64748b!important;
  font-size:11px!important;
}
.clean-transaction-table.finance-table-wrap .money-cell{
  text-align:right!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
  font-size:12px!important;
  font-weight:800!important;
}
.clean-transaction-table.finance-table-wrap .status-cell{
  text-align:left!important;
  vertical-align:middle!important;
  overflow:hidden!important;
}
.clean-transaction-table.finance-table-wrap .status-stack{
  display:flex!important;
  min-height:42px!important;
  width:100%!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:4px!important;
  overflow:hidden!important;
}
.clean-transaction-table.finance-table-wrap .status-stack .badge{
  max-width:100%!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.clean-transaction-table.finance-table-wrap .source-cell{vertical-align:middle!important}
.clean-transaction-table.finance-table-wrap .actions-cell{
  text-align:center!important;
  vertical-align:middle!important;
  overflow:visible!important;
  white-space:normal!important;
  background:#fff!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons{
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  width:100%!important;
  min-height:42px!important;
}
.clean-transaction-table.finance-table-wrap .transaction-action-form,
.clean-transaction-table.finance-table-wrap .action-buttons form{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons .button,
.clean-transaction-table.finance-table-wrap .action-buttons button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  width:74px!important;
  min-width:74px!important;
  max-width:74px!important;
  height:38px!important;
  min-height:38px!important;
  padding:0 8px!important;
  margin:0!important;
  border-radius:12px!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons .bi{font-size:14px!important;line-height:1!important;margin:0!important;flex:0 0 auto!important}
.mobile-bottom-nav a.has-alert{position:relative;color:#dc2626!important}
.mobile-alert-dot{
  position:absolute;
  top:5px;
  right:18px;
  display:grid;
  place-items:center;
  width:18px;
  height:18px;
  border-radius:999px;
  border:1px solid #fecaca;
  background:#fee2e2;
  color:#b91c1c;
  font-size:10px;
  animation:hsaIconBlink .9s ease-in-out infinite;
}
.mobile-alert-dot i{font-size:10px!important;line-height:1!important}

@media(max-width:760px){
  .clean-transaction-table.finance-table-wrap{
    overflow:visible!important;
    border:0!important;
    box-shadow:none!important;
    background:transparent!important;
  }
  .clean-transaction-table.finance-table-wrap table,
  .clean-transaction-table.finance-table-wrap thead,
  .clean-transaction-table.finance-table-wrap tbody,
  .clean-transaction-table.finance-table-wrap th,
  .clean-transaction-table.finance-table-wrap td,
  .clean-transaction-table.finance-table-wrap tr{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
  }
  .clean-transaction-table.finance-table-wrap table{background:transparent!important;border-collapse:separate!important;border-spacing:0!important}
  .clean-transaction-table.finance-table-wrap thead{display:none!important}
  .clean-transaction-table.finance-table-wrap tbody{display:grid!important;gap:12px!important}
  .clean-transaction-table.finance-table-wrap tbody tr{
    background:#fff!important;
    border:1px solid #e2e8f0!important;
    border-radius:18px!important;
    padding:12px!important;
    box-shadow:0 10px 26px rgba(15,23,42,.05)!important;
    overflow:hidden!important;
  }
  .clean-transaction-table.finance-table-wrap td{
    display:grid!important;
    grid-template-columns:110px minmax(0,1fr)!important;
    gap:12px!important;
    align-items:center!important;
    padding:9px 0!important;
    border:0!important;
    border-bottom:1px solid #f1f5f9!important;
    background:transparent!important;
    text-align:left!important;
    overflow:visible!important;
  }
  .clean-transaction-table.finance-table-wrap td::before{
    content:attr(data-label)!important;
    color:#64748b!important;
    font-size:11px!important;
    font-weight:900!important;
    letter-spacing:.04em!important;
    text-transform:uppercase!important;
  }
  .clean-transaction-table.finance-table-wrap td:last-child{border-bottom:0!important}
  .clean-transaction-table.finance-table-wrap .money-cell{text-align:left!important;font-size:13px!important}
  .clean-transaction-table.finance-table-wrap .date-cell b,
  .clean-transaction-table.finance-table-wrap .description-cell b,
  .clean-transaction-table.finance-table-wrap .qty-price-cell b,
  .clean-transaction-table.finance-table-wrap .date-cell small,
  .clean-transaction-table.finance-table-wrap .description-cell small,
  .clean-transaction-table.finance-table-wrap .status-cell small,
  .clean-transaction-table.finance-table-wrap .source-cell small{
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .clean-transaction-table.finance-table-wrap .status-stack{min-height:0!important;align-items:flex-start!important;justify-content:flex-start!important}
  .clean-transaction-table.finance-table-wrap .actions-cell{display:block!important;padding-top:12px!important}
  .clean-transaction-table.finance-table-wrap .actions-cell::before{display:none!important}
  .clean-transaction-table.finance-table-wrap .action-buttons{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .clean-transaction-table.finance-table-wrap .action-buttons .button,
  .clean-transaction-table.finance-table-wrap .action-buttons button,
  .clean-transaction-table.finance-table-wrap .action-muted{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:40px!important;
    min-height:40px!important;
    font-size:12px!important;
    padding:0 8px!important;
  }
}
@media(max-width:420px){
  .clean-transaction-table.finance-table-wrap td{grid-template-columns:92px minmax(0,1fr)!important;gap:10px!important}
  .clean-transaction-table.finance-table-wrap .action-buttons{grid-template-columns:1fr!important}
}
@media(prefers-reduced-motion:reduce){.mobile-alert-dot{animation:none!important}}

/* V9.8.4: stable Data Transaksi table + warning only on audit/detail menus */
.nav a[href="index.php?page=transactions"].has-alert,
.mobile-bottom-nav a[href="index.php?page=transactions"].has-alert{
  border-color:transparent!important;
  color:inherit!important;
}
.nav a[href="index.php?page=transactions"] .nav-alert-badge,
.mobile-bottom-nav a[href="index.php?page=transactions"] .mobile-alert-dot{display:none!important}

.clean-transaction-table.finance-table-wrap{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  border:1px solid #dfe8f3!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:0 14px 34px rgba(15,23,42,.05)!important;
  -webkit-overflow-scrolling:touch!important;
}
.clean-transaction-table.finance-table-wrap table{
  width:2470px!important;
  min-width:2470px!important;
  max-width:none!important;
  table-layout:fixed!important;
  border-collapse:collapse!important;
  border-spacing:0!important;
  background:#fff!important;
}
.clean-transaction-table.finance-table-wrap col.col-date{width:120px!important}
.clean-transaction-table.finance-table-wrap col.col-type{width:150px!important}
.clean-transaction-table.finance-table-wrap col.col-product{width:150px!important}
.clean-transaction-table.finance-table-wrap col.col-desc{width:280px!important}
.clean-transaction-table.finance-table-wrap col.col-partner{width:200px!important}
.clean-transaction-table.finance-table-wrap col.col-qty{width:135px!important}
.clean-transaction-table.finance-table-wrap col.col-price{width:135px!important}
.clean-transaction-table.finance-table-wrap col.col-in{width:145px!important}
.clean-transaction-table.finance-table-wrap col.col-out{width:145px!important}
.clean-transaction-table.finance-table-wrap col.col-total{width:145px!important}
.clean-transaction-table.finance-table-wrap col.col-proof{width:125px!important}
.clean-transaction-table.finance-table-wrap col.col-status{width:170px!important}
.clean-transaction-table.finance-table-wrap col.col-source{width:300px!important}
.clean-transaction-table.finance-table-wrap col.col-actions{width:270px!important}
.clean-transaction-table.finance-table-wrap th,
.clean-transaction-table.finance-table-wrap td{
  position:static!important;
  box-sizing:border-box!important;
  height:66px!important;
  min-height:66px!important;
  max-height:66px!important;
  padding:10px 14px!important;
  border:1px solid #e8eef6!important;
  border-left:0!important;
  border-top:0!important;
  background:#fff!important;
  vertical-align:middle!important;
  line-height:1.28!important;
  overflow:hidden!important;
}
.clean-transaction-table.finance-table-wrap th:last-child,
.clean-transaction-table.finance-table-wrap td:last-child{border-right:0!important}
.clean-transaction-table.finance-table-wrap thead th{
  height:46px!important;
  min-height:46px!important;
  max-height:46px!important;
  padding:10px 14px!important;
  background:#f8fafc!important;
  color:#334155!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  text-align:left!important;
}
.clean-transaction-table.finance-table-wrap tbody tr:hover td{background:#fbfdff!important}
.clean-transaction-table.finance-table-wrap .date-cell b,
.clean-transaction-table.finance-table-wrap .description-cell b,
.clean-transaction-table.finance-table-wrap .qty-price-cell b,
.clean-transaction-table.finance-table-wrap .partner-cell,
.clean-transaction-table.finance-table-wrap .product-cell,
.clean-transaction-table.finance-table-wrap .trx-type-cell,
.clean-transaction-table.finance-table-wrap .proof-cell,
.clean-transaction-table.finance-table-wrap .source-cell small,
.clean-transaction-table.finance-table-wrap .status-cell small{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
}
.clean-transaction-table.finance-table-wrap .date-cell small,
.clean-transaction-table.finance-table-wrap .description-cell small,
.clean-transaction-table.finance-table-wrap .source-cell small,
.clean-transaction-table.finance-table-wrap .status-cell small{
  margin-top:5px!important;
  color:#64748b!important;
  font-size:11px!important;
  line-height:1.2!important;
}
.clean-transaction-table.finance-table-wrap .money-cell{
  text-align:right!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
  font-size:12px!important;
  font-weight:800!important;
}
.clean-transaction-table.finance-table-wrap .status-cell{
  text-align:left!important;
  vertical-align:middle!important;
  overflow:hidden!important;
}
.clean-transaction-table.finance-table-wrap .status-stack{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:4px!important;
  width:100%!important;
  min-height:42px!important;
  max-height:52px!important;
  overflow:hidden!important;
}
.clean-transaction-table.finance-table-wrap .status-stack .badge,
.clean-transaction-table.finance-table-wrap .badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:28px!important;
  padding:6px 10px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  line-height:1!important;
}
.clean-transaction-table.finance-table-wrap .actions-cell{
  text-align:center!important;
  vertical-align:middle!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  background:#fff!important;
  box-shadow:none!important;
  right:auto!important;
  z-index:auto!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  width:100%!important;
  min-height:40px!important;
  max-height:42px!important;
  overflow:hidden!important;
}
.clean-transaction-table.finance-table-wrap .transaction-action-form,
.clean-transaction-table.finance-table-wrap .action-buttons form{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  flex:0 0 auto!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons .button,
.clean-transaction-table.finance-table-wrap .action-buttons button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  width:78px!important;
  min-width:78px!important;
  max-width:78px!important;
  height:38px!important;
  min-height:38px!important;
  max-height:38px!important;
  padding:0 8px!important;
  margin:0!important;
  border-radius:12px!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  flex:0 0 78px!important;
}
.clean-transaction-table.finance-table-wrap .action-buttons .bi{
  flex:0 0 auto!important;
  font-size:14px!important;
  line-height:1!important;
  margin:0!important;
}
.clean-transaction-table.finance-table-wrap .action-muted{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  width:78px!important;
  height:38px!important;
  padding:0 8px!important;
  border:1px solid #e2e8f0!important;
  border-radius:12px!important;
  background:#f8fafc!important;
  color:#64748b!important;
  font-size:12px!important;
  font-weight:900!important;
  white-space:nowrap!important;
  flex:0 0 78px!important;
}

@media(max-width:760px){
  .clean-transaction-table.finance-table-wrap{
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:transparent!important;
  }
  .clean-transaction-table.finance-table-wrap table,
  .clean-transaction-table.finance-table-wrap thead,
  .clean-transaction-table.finance-table-wrap tbody,
  .clean-transaction-table.finance-table-wrap th,
  .clean-transaction-table.finance-table-wrap td,
  .clean-transaction-table.finance-table-wrap tr{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
  }
  .clean-transaction-table.finance-table-wrap colgroup{display:none!important}
  .clean-transaction-table.finance-table-wrap table{background:transparent!important;border-collapse:separate!important;border-spacing:0!important}
  .clean-transaction-table.finance-table-wrap thead{display:none!important}
  .clean-transaction-table.finance-table-wrap tbody{display:grid!important;gap:12px!important}
  .clean-transaction-table.finance-table-wrap tbody tr{
    background:#fff!important;
    border:1px solid #e2e8f0!important;
    border-radius:18px!important;
    padding:12px!important;
    box-shadow:0 10px 26px rgba(15,23,42,.05)!important;
    overflow:hidden!important;
  }
  .clean-transaction-table.finance-table-wrap td{
    display:grid!important;
    grid-template-columns:105px minmax(0,1fr)!important;
    align-items:start!important;
    gap:11px!important;
    padding:9px 0!important;
    border:0!important;
    border-bottom:1px solid #f1f5f9!important;
    background:transparent!important;
    text-align:left!important;
    overflow:visible!important;
    white-space:normal!important;
  }
  .clean-transaction-table.finance-table-wrap td::before{
    content:attr(data-label)!important;
    color:#64748b!important;
    font-size:11px!important;
    font-weight:900!important;
    letter-spacing:.04em!important;
    text-transform:uppercase!important;
    padding-top:3px!important;
  }
  .clean-transaction-table.finance-table-wrap td:last-child{border-bottom:0!important}
  .clean-transaction-table.finance-table-wrap .money-cell{text-align:left!important;font-size:13px!important}
  .clean-transaction-table.finance-table-wrap .date-cell b,
  .clean-transaction-table.finance-table-wrap .description-cell b,
  .clean-transaction-table.finance-table-wrap .qty-price-cell b,
  .clean-transaction-table.finance-table-wrap .partner-cell,
  .clean-transaction-table.finance-table-wrap .product-cell,
  .clean-transaction-table.finance-table-wrap .trx-type-cell,
  .clean-transaction-table.finance-table-wrap .proof-cell,
  .clean-transaction-table.finance-table-wrap .source-cell small,
  .clean-transaction-table.finance-table-wrap .status-cell small{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
  }
  .clean-transaction-table.finance-table-wrap .status-stack{min-height:0!important;max-height:none!important;align-items:flex-start!important}
  .clean-transaction-table.finance-table-wrap .actions-cell{
    display:block!important;
    padding-top:12px!important;
  }
  .clean-transaction-table.finance-table-wrap .actions-cell::before{display:none!important}
  .clean-transaction-table.finance-table-wrap .action-buttons{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .clean-transaction-table.finance-table-wrap .action-buttons .button,
  .clean-transaction-table.finance-table-wrap .action-buttons button,
  .clean-transaction-table.finance-table-wrap .action-muted{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:40px!important;
    flex:initial!important;
    font-size:12px!important;
  }
}
@media(max-width:420px){
  .clean-transaction-table.finance-table-wrap td{grid-template-columns:92px minmax(0,1fr)!important;gap:10px!important}
  .clean-transaction-table.finance-table-wrap .action-buttons{grid-template-columns:1fr!important}
}

/* V9.8.5 - Data Transaksi table rebuild: isolated classes, no overlay, no collision */
.hsa-transactions-table-wrap{width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:visible!important;border:1px solid #dbe5f0!important;border-radius:22px!important;background:#fff!important;box-shadow:0 14px 34px rgba(15,23,42,.045)!important;-webkit-overflow-scrolling:touch!important}
.hsa-transactions-table{width:2100px!important;min-width:2100px!important;max-width:none!important;table-layout:fixed!important;border-collapse:separate!important;border-spacing:0!important;background:#fff!important;margin:0!important}
.hsa-transactions-table col.col-date{width:120px!important}.hsa-transactions-table col.col-type{width:140px!important}.hsa-transactions-table col.col-product{width:145px!important}.hsa-transactions-table col.col-desc{width:270px!important}.hsa-transactions-table col.col-partner{width:190px!important}.hsa-transactions-table col.col-qty{width:125px!important}.hsa-transactions-table col.col-price{width:135px!important}.hsa-transactions-table col.col-in{width:145px!important}.hsa-transactions-table col.col-out{width:145px!important}.hsa-transactions-table col.col-total{width:145px!important}.hsa-transactions-table col.col-proof{width:110px!important}.hsa-transactions-table col.col-status{width:185px!important}.hsa-transactions-table col.col-source{width:290px!important}.hsa-transactions-table col.col-actions{width:250px!important}
.hsa-transactions-table th,.hsa-transactions-table td{position:static!important;box-sizing:border-box!important;padding:12px 14px!important;border:0!important;border-right:1px solid #e7eef7!important;border-bottom:1px solid #e7eef7!important;background:#fff!important;vertical-align:middle!important;line-height:1.28!important;overflow:hidden!important;overflow-wrap:normal!important;word-break:normal!important}
.hsa-transactions-table th:last-child,.hsa-transactions-table td:last-child{border-right:0!important}
.hsa-transactions-table thead th{height:48px!important;min-height:48px!important;padding:12px 14px!important;background:#f8fafc!important;color:#334155!important;font-size:11px!important;font-weight:900!important;letter-spacing:.055em!important;text-transform:uppercase!important;white-space:nowrap!important;text-align:left!important}
.hsa-transactions-table tbody td{height:64px!important;min-height:64px!important;max-height:64px!important}.hsa-transactions-table tbody tr:hover td{background:#fbfdff!important}
.hsa-transactions-table .date-cell b,.hsa-transactions-table .description-cell b,.hsa-transactions-table .qty-price-cell b,.hsa-transactions-table .partner-cell,.hsa-transactions-table .product-cell,.hsa-transactions-table .trx-type-cell,.hsa-transactions-table .proof-cell,.hsa-transactions-table .source-cell small,.hsa-transactions-table .status-cell small{display:block!important;width:100%!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;overflow-wrap:normal!important;word-break:normal!important}
.hsa-transactions-table .description-cell b,.hsa-transactions-table .qty-price-cell b,.hsa-transactions-table .partner-cell,.hsa-transactions-table .product-cell,.hsa-transactions-table .trx-type-cell{font-size:13px!important;color:#0f172a!important}.hsa-transactions-table .date-cell small,.hsa-transactions-table .description-cell small,.hsa-transactions-table .source-cell small,.hsa-transactions-table .status-cell small{margin-top:5px!important;color:#64748b!important;font-size:11px!important;line-height:1.18!important}
.hsa-transactions-table .money-cell{text-align:right!important;white-space:nowrap!important;font-variant-numeric:tabular-nums!important;font-size:12px!important;font-weight:850!important;color:#0f172a!important}.hsa-transactions-table .proof-cell,.hsa-transactions-table .status-cell,.hsa-transactions-table .actions-cell{text-align:center!important}.hsa-transactions-table .status-cell{overflow:hidden!important;text-align:left!important}
.hsa-transactions-table .status-stack{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:4px!important;width:100%!important;height:40px!important;min-height:40px!important;max-height:40px!important;overflow:hidden!important}
.hsa-transactions-table .badge{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:max-content!important;max-width:100%!important;min-height:26px!important;padding:6px 10px!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.hsa-transactions-table .source-cell .badge{margin-top:5px!important;max-width:100%!important}
.hsa-transactions-table .actions-cell{overflow:visible!important;white-space:nowrap!important;background:#fff!important}.hsa-transactions-table .action-buttons{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;gap:8px!important;width:100%!important;min-height:38px!important;max-height:40px!important;overflow:visible!important}.hsa-transactions-table .transaction-action-form,.hsa-transactions-table .action-buttons form{display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;width:auto!important;margin:0!important;padding:0!important}
.hsa-transactions-table .action-buttons .button,.hsa-transactions-table .action-buttons button{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;flex:0 0 74px!important;width:74px!important;min-width:74px!important;max-width:74px!important;height:36px!important;min-height:36px!important;max-height:36px!important;padding:0 7px!important;margin:0!important;border-radius:12px!important;font-size:12px!important;font-weight:900!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;box-shadow:none!important}.hsa-transactions-table .action-buttons .button span,.hsa-transactions-table .action-buttons button span{display:inline!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.hsa-transactions-table .action-buttons .bi{flex:0 0 auto!important;margin:0!important;font-size:14px!important;line-height:1!important}.hsa-transactions-table .action-muted{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;flex:0 0 74px!important;width:74px!important;height:36px!important;border:1px solid #e2e8f0!important;border-radius:12px!important;background:#f8fafc!important;color:#64748b!important;font-size:12px!important;font-weight:900!important;white-space:nowrap!important}
@media(max-width:760px){.hsa-transactions-table-wrap{overflow:visible!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important}.hsa-transactions-table,.hsa-transactions-table thead,.hsa-transactions-table tbody,.hsa-transactions-table tr,.hsa-transactions-table th,.hsa-transactions-table td{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;height:auto!important;min-height:0!important;max-height:none!important}.hsa-transactions-table{background:transparent!important;border-collapse:separate!important;border-spacing:0!important;margin:0!important}.hsa-transactions-table colgroup,.hsa-transactions-table thead{display:none!important}.hsa-transactions-table tbody{display:grid!important;gap:12px!important}.hsa-transactions-table tbody tr{background:#fff!important;border:1px solid #e2e8f0!important;border-radius:18px!important;padding:12px!important;box-shadow:0 10px 26px rgba(15,23,42,.05)!important;overflow:hidden!important}.hsa-transactions-table td{display:grid!important;grid-template-columns:108px minmax(0,1fr)!important;align-items:start!important;gap:11px!important;padding:9px 0!important;border:0!important;border-bottom:1px solid #f1f5f9!important;background:transparent!important;text-align:left!important;overflow:visible!important;white-space:normal!important}.hsa-transactions-table td::before{content:attr(data-label)!important;color:#64748b!important;font-size:11px!important;font-weight:900!important;letter-spacing:.04em!important;text-transform:uppercase!important;padding-top:3px!important}.hsa-transactions-table td:last-child{border-bottom:0!important}.hsa-transactions-table .money-cell{text-align:left!important;font-size:13px!important}.hsa-transactions-table .date-cell b,.hsa-transactions-table .description-cell b,.hsa-transactions-table .qty-price-cell b,.hsa-transactions-table .partner-cell,.hsa-transactions-table .product-cell,.hsa-transactions-table .trx-type-cell,.hsa-transactions-table .proof-cell,.hsa-transactions-table .source-cell small,.hsa-transactions-table .status-cell small{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important}.hsa-transactions-table .status-stack{height:auto!important;min-height:0!important;max-height:none!important;align-items:flex-start!important}.hsa-transactions-table .actions-cell{display:block!important;padding-top:12px!important;text-align:left!important}.hsa-transactions-table .actions-cell::before{display:none!important}.hsa-transactions-table .action-buttons{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;min-height:0!important;max-height:none!important;overflow:visible!important}.hsa-transactions-table .action-buttons .button,.hsa-transactions-table .action-buttons button,.hsa-transactions-table .action-muted{width:100%!important;min-width:0!important;max-width:none!important;flex:initial!important;height:40px!important;min-height:40px!important;max-height:40px!important;font-size:12px!important}}
@media(max-width:420px){.hsa-transactions-table td{grid-template-columns:92px minmax(0,1fr)!important;gap:10px!important}.hsa-transactions-table .action-buttons{grid-template-columns:1fr!important}}

/* V9.8.5b - hard cell wrappers so row height stays aligned */
.hsa-transactions-table tbody td{padding:0!important;height:auto!important;min-height:0!important;max-height:none!important}
.hsa-transactions-table .hsa-cell{box-sizing:border-box!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:flex-start!important;gap:4px!important;width:100%!important;height:64px!important;min-height:64px!important;max-height:64px!important;padding:12px 14px!important;overflow:hidden!important;background:transparent!important}
.hsa-transactions-table .money-cell .hsa-cell{align-items:flex-end!important;text-align:right!important}.hsa-transactions-table .proof-cell .hsa-cell,.hsa-transactions-table .actions-cell .hsa-cell{align-items:center!important;text-align:center!important}.hsa-transactions-table .actions-cell .hsa-cell{overflow:visible!important}.hsa-transactions-table .status-cell .hsa-cell,.hsa-transactions-table .source-cell .hsa-cell{align-items:flex-start!important}.hsa-transactions-table .hsa-cell>.badge,.hsa-transactions-table .hsa-cell>span{max-width:100%!important}.hsa-transactions-table .hsa-cell>.attachment-actions{max-width:100%!important;overflow:hidden!important}
@media(max-width:760px){.hsa-transactions-table tbody td{padding:9px 0!important}.hsa-transactions-table .hsa-cell{height:auto!important;min-height:0!important;max-height:none!important;padding:0!important;align-items:flex-start!important;overflow:visible!important}.hsa-transactions-table .money-cell .hsa-cell{align-items:flex-start!important;text-align:left!important}.hsa-transactions-table .actions-cell .hsa-cell{align-items:stretch!important}.hsa-transactions-table .proof-cell .hsa-cell{text-align:left!important;align-items:flex-start!important}}

/* V9.9.0 - Final UI rebuild: clean app shell + collision-proof transaction grid */
:root{
  --hsa-bg:#f4f7fb;
  --hsa-surface:#ffffff;
  --hsa-soft:#f8fafc;
  --hsa-line:#dfe7f1;
  --hsa-text:#0f172a;
  --hsa-muted:#64748b;
  --hsa-primary:#2563eb;
  --hsa-primary-soft:#eff6ff;
  --hsa-danger:#dc2626;
  --hsa-danger-soft:#fff1f2;
  --hsa-success:#059669;
  --hsa-success-soft:#ecfdf5;
  --hsa-radius:20px;
  --hsa-shadow:0 16px 42px rgba(15,23,42,.07);
}
body.app-body{background:var(--hsa-bg)!important;color:var(--hsa-text)!important;font-size:14px!important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.app-body .main{background:linear-gradient(180deg,#f8fbff 0,#f4f7fb 280px,#f4f7fb 100%)!important}
.sidebar{background:#0b1220!important;color:#dbeafe!important;border-right:1px solid rgba(255,255,255,.08)!important}
.brand{padding:8px 6px 16px!important;margin-bottom:12px!important;border-bottom:1px solid rgba(255,255,255,.08)!important}
.brand-mark{box-shadow:0 12px 30px rgba(37,99,235,.35)!important}
.nav{gap:5px!important}.nav a{display:flex!important;align-items:center!important;gap:11px!important;min-height:42px!important;padding:10px 11px!important;border-radius:14px!important;color:#cbd5e1!important;font-weight:800!important;line-height:1.2!important;border:1px solid transparent!important}.nav a:hover,.nav a.active{background:rgba(255,255,255,.09)!important;color:#fff!important;border-color:rgba(255,255,255,.08)!important}.nav-icon{display:inline-grid!important;place-items:center!important;width:28px!important;height:28px!important;flex:0 0 28px!important;border-radius:10px!important;background:rgba(255,255,255,.08)!important}.nav-icon .bi{font-size:16px!important;line-height:1!important}.nav-label{display:inline-flex!important;align-items:center!important;gap:8px!important;min-width:0!important}.nav-alert-badge{display:inline-flex!important;align-items:center!important;gap:3px!important;color:#ef4444!important;font-style:normal!important;animation:hsaIconBlink .95s ease-in-out infinite}.nav-alert-badge b{font-size:10px!important;background:#ef4444!important;color:#fff!important;border-radius:999px!important;min-width:18px!important;height:18px!important;display:inline-grid!important;place-items:center!important;padding:0 5px!important}
.topbar{background:rgba(248,251,255,.92)!important;border-bottom:1px solid var(--hsa-line)!important;box-shadow:0 10px 30px rgba(15,23,42,.04)!important}.topbar h1{letter-spacing:-.025em!important}.topbar p{color:var(--hsa-muted)!important}.user-menu{padding-right:14px!important}.card,.kpi,.login-card{border:1px solid var(--hsa-line)!important;border-radius:22px!important;background:var(--hsa-surface)!important;box-shadow:var(--hsa-shadow)!important}.card-head h2{letter-spacing:-.02em!important}.card-head p{line-height:1.45!important}.inline-filter{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(155px,1fr))!important;align-items:end!important;gap:12px!important;background:#fff!important;border:1px solid var(--hsa-line)!important;border-radius:20px!important;box-shadow:0 10px 28px rgba(15,23,42,.035)!important}.inline-filter label{min-width:0!important}.inline-filter input,.inline-filter select{min-width:0!important;border-radius:13px!important}.button,button{transition:transform .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease!important}.button:hover,button:hover{transform:translateY(-1px)!important}.button.primary,button.primary{box-shadow:0 10px 20px rgba(37,99,235,.16)!important}.badge{border:1px solid transparent!important}.badge.success{border-color:#bbf7d0!important}.badge.primary{border-color:#bfdbfe!important}.badge.danger{border-color:#fecdd3!important}.badge.muted{border-color:#e2e8f0!important}

.tx-grid-shell{width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:visible!important;border:1px solid var(--hsa-line)!important;border-radius:24px!important;background:#fff!important;box-shadow:0 14px 32px rgba(15,23,42,.055)!important;-webkit-overflow-scrolling:touch!important}.tx-grid{display:grid!important;grid-template-columns:126px 142px 146px 270px 190px 130px 138px 142px 142px 142px 118px 170px 260px 250px!important;min-width:2376px!important}.tx-grid-head{position:sticky!important;top:0!important;z-index:2!important;background:#f8fafc!important;border-bottom:1px solid var(--hsa-line)!important}.tx-grid-head>div{display:flex!important;align-items:center!important;min-height:50px!important;padding:0 14px!important;color:#334155!important;font-size:11px!important;font-weight:950!important;letter-spacing:.06em!important;text-transform:uppercase!important;border-right:1px solid var(--hsa-line)!important;white-space:nowrap!important}.tx-grid-head>div:last-child{border-right:0!important}.tx-grid-body{display:grid!important;min-width:2376px!important}.tx-grid-row{border-bottom:1px solid #e7eef7!important;background:#fff!important}.tx-grid-row:nth-child(even){background:#fcfdff!important}.tx-grid-row:hover{background:#f8fbff!important}.tx-grid-row:last-child{border-bottom:0!important}.tx-cell{display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:flex-start!important;gap:5px!important;min-width:0!important;min-height:66px!important;padding:12px 14px!important;border-right:1px solid #edf2f7!important;line-height:1.25!important;overflow:hidden!important}.tx-cell:last-child{border-right:0!important}.tx-cell strong,.tx-cell span,.tx-cell small{max-width:100%!important;min-width:0!important}.tx-cell>strong,.tx-cell>span:not(.badge):not(.product-pill),.tx-cell>small{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.tx-date strong,.tx-desc strong,.tx-qty strong,.tx-total strong{font-size:13px!important;font-weight:900!important;color:#0f172a!important}.tx-cell small{font-size:11px!important;color:#64748b!important;line-height:1.25!important}.tx-desc strong{font-weight:850!important}.tx-muted{color:#94a3b8!important}.tx-money{align-items:flex-end!important;text-align:right!important;font-variant-numeric:tabular-nums!important;font-size:13px!important;font-weight:900!important;color:#0f172a!important;white-space:nowrap!important}.tx-money-in{color:#047857!important}.tx-money-out{color:#b91c1c!important}.tx-total{font-size:13px!important}.tx-status{align-items:flex-start!important}.tx-status .badge{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.tx-source small{width:100%!important}.tx-source .tx-warning-badge{margin-top:2px!important;display:inline-flex!important;gap:5px!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.tx-proof .attachment-actions{display:flex!important;gap:6px!important;flex-wrap:wrap!important}.tx-proof .attachment-actions .button{height:30px!important;min-height:30px!important;padding:0 8px!important;font-size:11px!important;border-radius:10px!important}.tx-actions-cell{align-items:stretch!important;justify-content:center!important;overflow:visible!important}.tx-actions{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:8px!important;align-items:center!important;width:100%!important}.tx-action-form{display:block!important;width:100%!important;margin:0!important;padding:0!important}.tx-action{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;width:100%!important;height:38px!important;min-height:38px!important;border-radius:13px!important;border:1px solid #d8e3f1!important;background:#fff!important;color:#0f172a!important;font-size:12px!important;font-weight:900!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;box-shadow:0 6px 14px rgba(15,23,42,.035)!important}.tx-action .bi{font-size:14px!important;line-height:1!important;flex:0 0 auto!important}.tx-action-view{background:#eff6ff!important;border-color:#bfdbfe!important;color:#1d4ed8!important}.tx-action-edit{background:#f8fafc!important;border-color:#cbd5e1!important;color:#0f172a!important}.tx-action-delete{background:#fff1f2!important;border-color:#fecdd3!important;color:#e11d48!important;cursor:pointer!important}.tx-action-lock{background:#f1f5f9!important;color:#64748b!important}.tx-empty{min-width:2376px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;min-height:86px!important;color:#64748b!important;font-weight:800!important;background:#fff!important}

@media(max-width:760px){body.app-body .content{padding:14px 12px 92px!important;gap:16px!important}.card,.kpi{border-radius:20px!important}.card-head{gap:12px!important}.card-head .actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important}.inline-filter{grid-template-columns:1fr!important;padding:12px!important;border-radius:18px!important}.tx-grid-shell{overflow:visible!important;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important}.tx-grid-head{display:none!important}.tx-grid-body{display:grid!important;gap:12px!important;min-width:0!important}.tx-grid-row{display:grid!important;grid-template-columns:1fr!important;min-width:0!important;border:1px solid var(--hsa-line)!important;border-radius:20px!important;background:#fff!important;box-shadow:0 12px 30px rgba(15,23,42,.055)!important;padding:12px!important;overflow:hidden!important}.tx-cell{display:grid!important;grid-template-columns:104px minmax(0,1fr)!important;align-items:start!important;min-height:0!important;padding:9px 0!important;border-right:0!important;border-bottom:1px solid #f1f5f9!important;gap:10px!important;overflow:visible!important}.tx-cell::before{content:attr(data-label)!important;color:#64748b!important;font-size:10px!important;font-weight:950!important;letter-spacing:.055em!important;text-transform:uppercase!important;padding-top:3px!important}.tx-cell:last-child{border-bottom:0!important}.tx-cell>strong,.tx-cell>span:not(.badge):not(.product-pill),.tx-cell>small{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important}.tx-money{align-items:start!important;text-align:left!important}.tx-status .badge,.tx-cell .badge,.tx-cell .product-pill{width:max-content!important;max-width:100%!important;white-space:normal!important;text-align:left!important}.tx-actions-cell{display:block!important;padding-top:12px!important}.tx-actions-cell::before{display:none!important}.tx-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}.tx-action{height:42px!important;min-height:42px!important}.tx-empty{min-width:0!important;border:1px solid var(--hsa-line)!important;border-radius:18px!important}.topbar{padding-left:64px!important}.mobile-bottom-nav{box-shadow:0 16px 50px rgba(15,23,42,.2)!important}}
@media(max-width:420px){.tx-cell{grid-template-columns:92px minmax(0,1fr)!important}.tx-actions{grid-template-columns:1fr!important}.tx-action{height:40px!important}}

/* V9.9.1 - Final Data Transaksi table: tabel asli + scroll horizontal khusus area tabel */
.transaction-table-scroll{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  border:1px solid #dbe6f2!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 14px 34px rgba(15,23,42,.05)!important;
  margin-top:16px!important;
}
.transaction-table-scroll::after{
  content:'Geser tabel ke samping untuk melihat semua kolom';
  display:none;
  padding:9px 12px;
  color:#64748b;
  font-size:12px;
  font-weight:800;
  border-top:1px solid #e5edf7;
  background:#f8fafc;
}
.transaction-table-final{
  width:2410px!important;
  min-width:2410px!important;
  max-width:none!important;
  table-layout:fixed!important;
  border-collapse:separate!important;
  border-spacing:0!important;
  margin:0!important;
  background:#fff!important;
}
.transaction-table-final col.col-date{width:126px!important}
.transaction-table-final col.col-type{width:150px!important}
.transaction-table-final col.col-product{width:150px!important}
.transaction-table-final col.col-desc{width:285px!important}
.transaction-table-final col.col-partner{width:205px!important}
.transaction-table-final col.col-qty{width:135px!important}
.transaction-table-final col.col-price{width:140px!important}
.transaction-table-final col.col-in{width:145px!important}
.transaction-table-final col.col-out{width:145px!important}
.transaction-table-final col.col-total{width:145px!important}
.transaction-table-final col.col-proof{width:130px!important}
.transaction-table-final col.col-status{width:190px!important}
.transaction-table-final col.col-source{width:300px!important}
.transaction-table-final col.col-actions{width:264px!important}
.transaction-table-final th,
.transaction-table-final td{
  box-sizing:border-box!important;
  border:0!important;
  border-right:1px solid #e7eef7!important;
  border-bottom:1px solid #e7eef7!important;
  background:#fff!important;
  vertical-align:middle!important;
  text-align:left!important;
  padding:0 14px!important;
  overflow:hidden!important;
  position:static!important;
}
.transaction-table-final th:last-child,
.transaction-table-final td:last-child{border-right:0!important}
.transaction-table-final thead th{
  height:48px!important;
  line-height:48px!important;
  background:#f8fafc!important;
  color:#334155!important;
  font-size:11px!important;
  font-weight:950!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
.transaction-table-final tbody td{
  height:68px!important;
  min-height:68px!important;
  max-height:68px!important;
  color:#0f172a!important;
  font-size:13px!important;
}
.transaction-table-final tbody tr:hover td{background:#fbfdff!important}
.transaction-table-final .cell-stack{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:5px!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}
.transaction-table-final .cell-badges,
.transaction-table-final .cell-status{gap:6px!important}
.transaction-table-final .text-ellipsis,
.transaction-table-final .cell-stack>strong,
.transaction-table-final .cell-stack>span:not(.badge):not(.product-pill),
.transaction-table-final .cell-stack>small,
.transaction-table-final .cell-source small{
  display:block!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
}
.transaction-table-final small{
  color:#64748b!important;
  font-size:11px!important;
  line-height:1.2!important;
  font-weight:700!important;
}
.transaction-table-final strong{font-weight:900!important}
.transaction-table-final .muted-text{color:#94a3b8!important;font-weight:800!important}
.transaction-table-final .badge,
.transaction-table-final .product-pill{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:26px!important;
  padding:6px 10px!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.transaction-table-final .money-cell,
.transaction-table-final .num-cell{
  text-align:right!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
  font-size:13px!important;
  font-weight:900!important;
}
.transaction-table-final .money-in{color:#047857!important}
.transaction-table-final .money-out{color:#b91c1c!important}
.transaction-table-final .total-cell{color:#0f172a!important}
.transaction-table-final .proof-box{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  height:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.transaction-table-final .proof-box .attachment-actions{
  display:flex!important;
  gap:6px!important;
  flex-wrap:nowrap!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.transaction-table-final .proof-box .button{
  height:30px!important;
  min-height:30px!important;
  padding:0 8px!important;
  font-size:11px!important;
  border-radius:10px!important;
  white-space:nowrap!important;
}
.transaction-table-final .actions-cell-final{
  padding:0 12px!important;
  overflow:hidden!important;
  white-space:nowrap!important;
}
.transaction-table-final .row-actions-final{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  height:100%!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  flex-wrap:nowrap!important;
}
.transaction-table-final .row-actions-final form{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:0!important;
  flex:0 0 auto!important;
}
.transaction-table-final .action-btn-final{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  width:74px!important;
  min-width:74px!important;
  max-width:74px!important;
  height:38px!important;
  min-height:38px!important;
  max-height:38px!important;
  padding:0 8px!important;
  margin:0!important;
  border-radius:13px!important;
  border:1px solid #d8e3f1!important;
  background:#fff!important;
  color:#0f172a!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  box-shadow:0 6px 14px rgba(15,23,42,.035)!important;
  transform:none!important;
  cursor:pointer!important;
}
.transaction-table-final .action-btn-final i{font-size:14px!important;line-height:1!important;flex:0 0 auto!important;margin:0!important}
.transaction-table-final .action-btn-final span{display:inline!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.transaction-table-final .action-btn-final.view{background:#eff6ff!important;border-color:#bfdbfe!important;color:#1d4ed8!important}
.transaction-table-final .action-btn-final.edit{background:#f8fafc!important;border-color:#cbd5e1!important;color:#0f172a!important}
.transaction-table-final .action-btn-final.delete{background:#fff1f2!important;border-color:#fecdd3!important;color:#e11d48!important}
.transaction-table-final .action-btn-final.locked{background:#f1f5f9!important;border-color:#e2e8f0!important;color:#64748b!important}
.transaction-table-final .empty-row{
  height:86px!important;
  text-align:center!important;
  color:#64748b!important;
  font-weight:850!important;
  background:#fff!important;
}
@media(max-width:900px){
  .transaction-table-scroll{border-radius:18px!important;margin-left:0!important;margin-right:0!important}
  .transaction-table-scroll::after{display:block!important}
  .transaction-table-final{width:2410px!important;min-width:2410px!important}
  .transaction-table-final th,.transaction-table-final td{padding-left:12px!important;padding-right:12px!important}
}
@media(max-width:520px){
  .transaction-table-final thead th{height:46px!important;line-height:46px!important;font-size:10px!important}
  .transaction-table-final tbody td{height:64px!important;min-height:64px!important;max-height:64px!important;font-size:12px!important}
  .transaction-table-final .action-btn-final{height:36px!important;width:72px!important;min-width:72px!important;max-width:72px!important;font-size:11px!important}
}

/* V9.9.2 - table text normal weight + reusable row action context menu */
.table-wrap tbody td,
.table-wrap tbody td strong,
.table-wrap tbody td b,
.table-wrap tbody td .money-cell,
.table-wrap tbody td .num-cell,
.transaction-table-final tbody td,
.transaction-table-final tbody td strong,
.transaction-table-final tbody td b,
.transaction-table-final .money-cell,
.transaction-table-final .num-cell,
.transaction-table-final .total-cell,
.transaction-table-final .cell-stack>strong,
.transaction-table-final .cell-stack>span:not(.badge):not(.product-pill),
.transaction-table-final .cell-stack>small{
  font-weight:500!important;
}
.table-wrap tbody td small,
.transaction-table-final small{
  font-weight:400!important;
}
.table-wrap tbody td .badge,
.table-wrap tbody td .product-pill,
.transaction-table-final .badge,
.transaction-table-final .product-pill{
  font-weight:600!important;
}
.table-wrap tbody td .button,
.table-wrap tbody td button,
.transaction-table-final .action-btn-final{
  font-weight:600!important;
}
.transaction-table-scroll{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
}
.transaction-table-final{
  width:2410px!important;
  min-width:2410px!important;
  table-layout:fixed!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}
.transaction-table-final tbody td{
  height:64px!important;
  min-height:64px!important;
  max-height:64px!important;
  vertical-align:middle!important;
}
.transaction-table-final .cell-stack{
  height:64px!important;
  justify-content:center!important;
}
.transaction-table-final .actions-cell-final{
  overflow:hidden!important;
}
.transaction-table-final .row-actions-final{
  height:64px!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  gap:8px!important;
}
.table-action-context-menu{
  position:fixed;
  z-index:9999;
  min-width:210px;
  max-width:min(280px,calc(100vw - 24px));
  padding:8px;
  border:1px solid #dbe5f0;
  border-radius:18px;
  background:#fff;
  box-shadow:0 22px 60px rgba(15,23,42,.22);
  display:none;
  gap:6px;
}
.table-action-context-menu.show{display:grid;animation:hsaContextPop .14s ease-out}
@keyframes hsaContextPop{from{opacity:0;transform:translateY(4px) scale(.98)}to{opacity:1;transform:none}}
.table-action-context-menu .menu-title{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px 6px;
  color:#64748b;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.table-action-context-menu button{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  width:100%;
  min-height:40px;
  padding:10px 12px;
  border:0;
  border-radius:13px;
  background:#fff;
  color:#0f172a;
  font-size:13px;
  font-weight:600;
  text-align:left;
  box-shadow:none;
}
.table-action-context-menu button:hover,
.table-action-context-menu button:focus{background:#f1f5f9;outline:none}
.table-action-context-menu button.danger{background:#fff1f2;color:#be123c}
.table-action-context-menu button.danger:hover,
.table-action-context-menu button.danger:focus{background:#ffe4e6}
.table-action-context-menu button i{font-size:16px;line-height:1;flex:0 0 auto}
@media(max-width:760px){
  .table-action-context-menu{
    left:12px!important;
    right:12px!important;
    bottom:18px!important;
    top:auto!important;
    width:auto!important;
    max-width:none;
    border-radius:22px;
    padding:10px;
  }
  .table-action-context-menu button{min-height:48px;font-size:14px;border-radius:15px}
}
.table-action-context-menu + .context-row-active,
.context-row-active td{background:#f8fbff!important}

/* V9.9.3 - toast must float above mobile bottom navigation, not behind it */
@media(max-width:760px){
  .toast{
    left:12px!important;
    right:12px!important;
    bottom:calc(92px + env(safe-area-inset-bottom,0px))!important;
    max-width:none!important;
    z-index:140!important;
    text-align:left!important;
  }
  .notification-permission-card{
    bottom:calc(96px + env(safe-area-inset-bottom,0px))!important;
    z-index:135!important;
  }
  .table-action-context-menu{
    bottom:calc(92px + env(safe-area-inset-bottom,0px))!important;
    z-index:145!important;
  }
}
.logic-note{display:flex;gap:8px;align-items:flex-start;margin-top:12px;padding:12px 14px;border:1px solid #bfdbfe;background:#eff6ff;color:#1e40af;border-radius:16px;font-size:13px;line-height:1.45}.logic-note .bi{margin-top:2px;flex:0 0 auto}.kpi strong,.mini-card strong{font-weight:650!important}

/* V9.9.4 - filter otomatis tanpa tombol + UI stabil */
.inline-filter[data-auto-filter]{position:relative;align-items:end}
.js-enabled .inline-filter[data-auto-filter] button[type="submit"],
.js-enabled .inline-filter[data-auto-filter] input[type="submit"]{display:none!important}
.js-enabled .inline-filter[data-auto-filter] noscript button{display:initial!important}
.auto-filter-hint{align-self:center;justify-self:start;display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:6px 10px;border-radius:999px;background:#eef6ff;color:#2563eb;font-size:11px;font-weight:700;white-space:nowrap}
.auto-filter-hint::before{content:"\\F3E2";font-family:"bootstrap-icons";font-size:13px;line-height:1}
.inline-filter.is-loading .auto-filter-hint::before{content:"\\F130";animation:hsaSpin .8s linear infinite;display:inline-block}
.content-loading{opacity:.72;transition:opacity .15s ease}
@keyframes hsaSpin{to{transform:rotate(360deg)}}
.share-percent-form input[readonly]{background:#f8fafc;color:#334155;border-style:dashed;cursor:not-allowed}
.table-wrap td.actions,.table-wrap .actions{align-items:center!important;vertical-align:middle!important}
.table-wrap td.actions{white-space:nowrap!important;min-width:180px!important}
.table-wrap td.actions .inline-action-form{display:inline-flex!important;width:auto!important;margin:0!important;padding:0!important;vertical-align:middle!important}
.table-wrap td.actions .button,.table-wrap td.actions button{width:auto!important;min-width:70px!important}
@media(max-width:760px){.auto-filter-hint{grid-column:1/-1;justify-self:stretch;justify-content:center}.table-wrap td.actions{min-width:210px!important}.table-wrap td.actions .button,.table-wrap td.actions button{min-height:38px!important}}

/* V9.9.5: modal-first workflow, safer toast placement, cleaner table/action surfaces */
@media(max-width:760px){
  .toast{left:12px!important;right:12px!important;bottom:calc(86px + env(safe-area-inset-bottom,0px))!important;max-width:none!important;z-index:120!important;text-align:left;}
  .offline-badge{bottom:calc(86px + env(safe-area-inset-bottom,0px))!important;max-width:calc(100vw - 24px);white-space:normal;text-align:center;}
}
.hsa-edit-modal-card{width:min(1040px,calc(100vw - 24px));max-height:94dvh;}
.hsa-edit-modal-card .modal-body{padding:16px;background:#f6f8fb;}
.hsa-edit-modal-card .card{box-shadow:none!important;margin:0!important;border-radius:18px!important;}
.hsa-edit-modal-card .sticky-actions{position:sticky;bottom:0;z-index:2;}
.modal-loading{display:flex;align-items:center;justify-content:center;gap:10px;min-height:140px;color:var(--muted);font-weight:800;}
.modal-loading .bi{animation:hsaSpin 1s linear infinite;}
@keyframes hsaSpin{to{transform:rotate(360deg)}}
.table-action-context-menu{z-index:160!important;}
.table-wrap table td,.transaction-table-final td{font-weight:400!important;}
.table-wrap table td strong,.transaction-table-final td strong{font-weight:500!important;}
.table-wrap table th,.transaction-table-final th{font-weight:700!important;}
.actions form,.actions-cell-final form{margin:0!important;display:inline-flex!important;}
.actions,.actions-cell-final,.row-actions-final{align-items:center!important;}


/* V9.9.6 - clean mobile app UI, polished popups, modal-first forms, comma inputs */
:root{
  --radius:18px;
  --shadow:0 14px 36px rgba(15,23,42,.065);
}
body.app-body{background:#f6f8fb!important;}
.card,.kpi,.login-card,.input-detail-card,.team-perf-card{
  border-radius:18px!important;
  box-shadow:0 10px 28px rgba(15,23,42,.055)!important;
}
.card{padding:18px!important;}
.card-head{margin-bottom:14px!important;}
.card-head h2{font-size:17px!important;letter-spacing:-.01em!important;}
.card-head p,.mini,.muted{line-height:1.45!important;}
.button,button{
  min-height:38px;
  border-radius:12px!important;
  font-weight:650!important;
  box-shadow:none!important;
}
.button:hover,button:hover{transform:none!important;}
input,select,textarea{
  border-radius:12px!important;
  min-height:42px;
  font-size:14px!important;
  background:#fff!important;
}
label{font-weight:650!important;color:#334155!important;}
.form-panel{
  border-radius:18px!important;
  background:#f8fafc!important;
  padding:15px!important;
}
.form-grid{gap:12px!important;}
.table-wrap{
  border-radius:16px!important;
  background:#fff!important;
}
.table-wrap table td,
.transaction-table-final td{
  font-weight:400!important;
}
.table-wrap table td strong,
.table-wrap table td b,
.transaction-table-final td strong,
.transaction-table-final td b{
  font-weight:500!important;
}
.table-wrap th,
.transaction-table-final th{
  font-weight:700!important;
}
.toast{
  z-index:220!important;
  border-radius:16px!important;
  box-shadow:0 18px 48px rgba(15,23,42,.22)!important;
}
.modal-backdrop.show{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:16px!important;
  background:rgba(15,23,42,.48)!important;
  backdrop-filter:blur(8px)!important;
}
.modal-card{
  border-radius:22px!important;
  border:1px solid rgba(226,232,240,.96)!important;
  box-shadow:0 30px 100px rgba(15,23,42,.26)!important;
  max-width:calc(100vw - 24px)!important;
}
.clean-confirm{
  width:min(460px,calc(100vw - 24px))!important;
  display:grid!important;
  grid-template-columns:64px minmax(0,1fr)!important;
  gap:14px!important;
  padding:18px!important;
  background:#fff!important;
}
.clean-confirm .confirm-visual span{
  width:58px;height:58px;border-radius:20px;
  display:grid;place-items:center;
  background:#eff6ff;color:#2563eb;font-size:27px;
}
.clean-confirm.danger .confirm-visual span{background:#fff1f2;color:#dc2626;}
.clean-confirm.primary .confirm-visual span{background:#ecfdf5;color:#059669;}
.clean-confirm .confirm-content{min-width:0;}
.clean-confirm .confirm-head{
  padding:0!important;
  margin:0 0 8px!important;
  border:0!important;
}
.clean-confirm .modal-title{
  font-size:18px!important;
  font-weight:800!important;
  color:#0f172a!important;
  letter-spacing:-.01em;
}
.clean-confirm .modal-close{
  width:36px!important;height:36px!important;min-height:36px!important;
  padding:0!important;border-radius:12px!important;
  background:#f8fafc!important;border:1px solid #e2e8f0!important;
}
.clean-confirm .confirm-body{
  padding:0!important;
  color:#334155!important;
}
.confirm-message{margin:0 0 6px!important;line-height:1.5!important;}
.confirm-subtext{margin:0!important;color:#64748b!important;font-size:13px!important;line-height:1.4!important;}
.clean-confirm .confirm-foot{
  display:flex!important;
  justify-content:flex-end!important;
  gap:9px!important;
  padding:16px 0 0!important;
  border:0!important;
}
.prompt-field{display:grid!important;gap:8px!important;}
.prompt-field textarea{min-height:112px!important;}
.hsa-edit-modal-card,
.form-modal-card{
  width:min(960px,calc(100vw - 24px))!important;
  max-height:92dvh!important;
  overflow:hidden!important;
}
.hsa-edit-modal-card .modal-body,
.form-modal-card .modal-body{
  max-height:calc(92dvh - 70px)!important;
  overflow:auto!important;
  padding:15px!important;
  background:#f6f8fb!important;
}
.popup-form-launcher{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 15px;
  border:1px solid #dbeafe;
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#f8fbff);
}
.popup-form-launcher strong{
  display:block;
  font-size:15px;
  color:#0f172a;
  margin-bottom:2px;
}
.popup-form-launcher small{
  display:block;
  color:#64748b;
  font-size:12px;
  line-height:1.35;
}
.popup-form-placeholder[hidden]{display:none!important;}
.number-comma-input{
  text-align:right;
  font-variant-numeric:tabular-nums;
}
.qty-decimal-input{
  font-variant-numeric:tabular-nums;
}
.form-modal-card .form-panel,
.hsa-edit-modal-card .form-panel{
  box-shadow:none!important;
  margin:0!important;
  border-color:#e2e8f0!important;
}
.form-modal-card .sticky-actions,
.hsa-edit-modal-card .sticky-actions{
  bottom:0!important;
  border-radius:16px!important;
}
.actions,.actions-cell,.actions-cell-final{
  vertical-align:middle!important;
}
.actions form,.actions-cell form,.actions-cell-final form{
  margin:0!important;
  display:inline-flex!important;
}
@media(max-width:760px){
  body.app-body{padding-bottom:86px!important;}
  .content{
    padding:14px 12px 18px!important;
    gap:14px!important;
  }
  .card{padding:14px!important;border-radius:18px!important;}
  .card-head{gap:10px!important;margin-bottom:12px!important;}
  .card-head h2{font-size:16px!important;}
  .topbar{
    min-height:58px!important;
    border-radius:0 0 20px 20px!important;
  }
  .mobile-bottom-nav{
    left:10px!important;right:10px!important;bottom:10px!important;
    border-radius:22px!important;
    padding:7px!important;
    z-index:150!important;
  }
  .toast{
    left:12px!important;
    right:12px!important;
    bottom:calc(98px + env(safe-area-inset-bottom,0px))!important;
    max-width:none!important;
    z-index:220!important;
  }
  .offline-badge{
    bottom:calc(98px + env(safe-area-inset-bottom,0px))!important;
    z-index:215!important;
  }
  .clean-confirm{
    grid-template-columns:1fr!important;
    width:calc(100vw - 24px)!important;
    padding:16px!important;
    border-radius:24px!important;
  }
  .clean-confirm .confirm-visual span{
    width:52px;height:52px;border-radius:18px;font-size:24px;
  }
  .clean-confirm .confirm-foot{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  .clean-confirm .confirm-foot .button{
    width:100%!important;
  }
  .hsa-edit-modal-card,
  .form-modal-card{
    width:calc(100vw - 18px)!important;
    max-height:calc(100dvh - 24px)!important;
    border-radius:24px!important;
  }
  .hsa-edit-modal-card .modal-body,
  .form-modal-card .modal-body{
    max-height:calc(100dvh - 96px)!important;
    padding:12px!important;
  }
  .popup-form-launcher{
    display:grid;
    grid-template-columns:1fr;
    padding:13px;
  }
  .popup-form-launcher .button{
    width:100%;
  }
  .form-grid.cols-4,.form-grid.cols-3,.grid.two,.grid.three{
    grid-template-columns:1fr!important;
  }
  .span-2,.span-3,.span-4{grid-column:auto!important;}
  input,select,textarea{font-size:14px!important;min-height:42px!important;}
  .form-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  .form-actions .button,.form-actions button{
    width:100%!important;
  }
  .table-wrap{
    -webkit-overflow-scrolling:touch!important;
  }
}

/* V10.0.0 audit resolve: review/compare first, then resolve */
.audit-review-panel{border:1px solid #bfdbfe;background:linear-gradient(180deg,#f8fbff,#fff);box-shadow:0 18px 50px rgba(37,99,235,.08)}
.audit-review-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,520px);gap:16px;align-items:start}
.audit-review-summary{border:1px solid var(--line);border-radius:20px;background:#fff;padding:16px;display:grid;gap:10px}
.audit-review-summary.error{border-color:#fecdd3;background:#fff7f8}.audit-review-summary.warning{border-color:#fde68a;background:#fffdf4}
.audit-review-summary h3{margin:0;display:flex;gap:10px;align-items:flex-start;font-size:17px;line-height:1.25;color:#0f172a}
.audit-review-summary h3 .bi{color:#dc2626;font-size:20px;line-height:1.1;flex:0 0 auto}.audit-review-summary p{margin:0;color:#475569;line-height:1.5;white-space:normal}
.audit-review-location{display:flex;gap:8px;align-items:flex-start;color:#475569;font-size:13px;border-top:1px dashed rgba(15,23,42,.12);padding-top:10px}
.audit-review-actions{display:flex;gap:8px;flex-wrap:wrap}.audit-review-form{border:1px solid var(--line);border-radius:20px;background:#fff;padding:16px;display:grid;gap:12px}
.audit-review-form label{display:grid;gap:7px;font-size:13px;color:#475569}.audit-review-form input,.audit-review-form textarea,.audit-review-form select{width:100%}
.audit-review-form .form-grid.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.compact-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.audit-review-compare{margin-top:14px}.audit-compare-metrics{grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.audit-review-tables{display:grid;gap:16px;margin-top:16px}.audit-review-tables h3{margin:0 0 8px;font-size:15px;display:flex;gap:8px;align-items:center}.mini-table-wrap{max-height:340px;overflow:auto}.mini-table-wrap table{min-width:900px}.row-focus td{background:#fff7ed!important;outline:1px solid #f97316;outline-offset:-1px}.issue-actions .button{white-space:nowrap}
@media(max-width:900px){.audit-review-grid{grid-template-columns:1fr}.audit-review-form .form-grid.three{grid-template-columns:1fr}.audit-compare-metrics{grid-template-columns:1fr 1fr}.compact-actions .button{flex:1 1 150px}.audit-review-actions .button{flex:1 1 160px}}
@media(max-width:620px){.audit-review-panel{border-radius:18px;margin-left:-2px;margin-right:-2px}.audit-compare-metrics{grid-template-columns:1fr}.audit-review-summary,.audit-review-form{border-radius:16px;padding:13px}.audit-review-tables{gap:12px}.compact-actions{display:grid;grid-template-columns:1fr}.compact-actions .button{width:100%}}

/* V10.0.1: clean filter mode and audit review forms */
.inline-filter.period-all-mode .period-month-field[hidden],
.inline-filter.period-month-mode .period-month-field[hidden]{display:none !important;}
.audit-review-kind{display:flex;gap:12px;align-items:flex-start;margin:10px 0 14px;padding:12px 14px;border:1px solid rgba(15,23,42,.10);background:#f8fafc;border-radius:16px;box-shadow:0 8px 20px rgba(15,23,42,.04)}
.audit-review-kind i{width:36px;height:36px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;background:#fff;color:#dc2626;border:1px solid rgba(220,38,38,.18);font-size:18px;flex:0 0 auto}
.audit-review-kind strong{display:block;color:#0f172a;font-size:.95rem;margin-bottom:3px}
.audit-review-kind span{display:block;color:#64748b;font-size:.82rem;line-height:1.45}
.audit-review-values label,.audit-review-extra label{font-weight:500;color:#334155}
.audit-review-extra{margin-top:10px;padding-top:10px;border-top:1px dashed rgba(15,23,42,.10)}
.audit-review-form input,.audit-review-form textarea,.audit-review-form select{font-size:.92rem}
@media (max-width:720px){.audit-review-kind{border-radius:14px;padding:11px}.audit-review-kind i{width:32px;height:32px;border-radius:12px}.audit-review-extra{grid-template-columns:1fr !important}.audit-review-values{grid-template-columns:1fr !important}}

/* V10.0.2 final UI audit: calmer tables, stable action rows, compact mobile-app polish */
.transaction-table-final td,
.transaction-table-final td span:not(.badge):not(.product-pill),
.transaction-table-final td small,
.table-wrap table td,
.table-wrap table td span:not(.badge):not(.product-pill),
.table-wrap table td small{
  font-weight:400!important;
}
.transaction-table-final td strong,
.transaction-table-final td b,
.table-wrap table td strong,
.table-wrap table td b{
  font-weight:400!important;
}
.transaction-table-final .badge,
.transaction-table-final .product-pill,
.table-wrap .badge,
.table-wrap .product-pill{
  font-weight:600!important;
}
.transaction-table-final th,
.table-wrap table th{
  font-weight:650!important;
}
.transaction-table-scroll{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  max-width:100%!important;
  scrollbar-gutter:stable both-edges;
}
.transaction-table-final{
  width:2410px!important;
  min-width:2410px!important;
  table-layout:fixed!important;
}
.transaction-table-final tbody td{
  vertical-align:middle!important;
  height:66px!important;
  min-height:66px!important;
  max-height:66px!important;
}
.transaction-table-final .cell-stack{
  min-height:44px!important;
  height:auto!important;
  max-height:54px!important;
  justify-content:center!important;
  align-items:flex-start!important;
  overflow:hidden!important;
}
.transaction-table-final .actions-cell-final{
  padding:8px 10px!important;
  vertical-align:middle!important;
  overflow:hidden!important;
}
.transaction-table-final .row-actions-final{
  height:48px!important;
  min-height:48px!important;
  justify-content:center!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  gap:6px!important;
}
.transaction-table-final .action-btn-final{
  height:36px!important;
  min-height:36px!important;
  max-height:36px!important;
  width:72px!important;
  min-width:72px!important;
  max-width:72px!important;
  font-weight:600!important;
  border-radius:12px!important;
}
.transaction-table-final .status-badge,
.transaction-table-final .cell-status .badge{
  align-self:flex-start!important;
}
@media(max-width:760px){
  .content{padding-bottom:96px!important;}
  .card{padding:14px!important;border-radius:16px!important;}
  .card-head{gap:10px!important;align-items:flex-start!important;}
  .transaction-table-scroll{border-radius:16px!important;margin-left:0!important;margin-right:0!important;}
  .transaction-table-final{width:2310px!important;min-width:2310px!important;}
  .transaction-table-final col.col-actions{width:248px!important;}
  .transaction-table-final .action-btn-final{width:68px!important;min-width:68px!important;max-width:68px!important;font-size:11px!important;}
  .inline-filter{gap:9px!important;}
  .inline-filter label{min-width:145px!important;}
  .popup-form-launcher small{display:none!important;}
}

/* V10.0.3: compact Quick Input for faster multi-row entry */
.card.quick-card{
  padding:16px!important;
  border-radius:18px!important;
}
.quick-card .card-head{
  margin-bottom:10px!important;
  gap:10px!important;
  align-items:flex-start!important;
}
.quick-card .card-head h2{
  font-size:17px!important;
  line-height:1.2!important;
  margin:0!important;
}
.quick-card .card-head p{
  margin-top:3px!important;
  font-size:12.5px!important;
  line-height:1.35!important;
  color:#64748b!important;
}
.quick-card .card-head .badge{
  min-height:28px!important;
  padding:6px 9px!important;
  font-size:11px!important;
}
.quick-type-tabs{
  display:flex!important;
  flex-wrap:nowrap!important;
  gap:7px!important;
  overflow-x:auto!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:thin!important;
  margin:0 0 9px!important;
  padding:7px!important;
  border-radius:14px!important;
}
.quick-type-tab{
  min-height:32px!important;
  padding:7px 10px!important;
  font-size:12px!important;
  line-height:1.05!important;
  white-space:nowrap!important;
  flex:0 0 auto!important;
  border-radius:999px!important;
}
.input-module .form-panel{
  padding:10px!important;
  gap:8px!important;
}
.quick-section-note{
  display:none!important;
}
.quick-rows{
  gap:8px!important;
}
.quick-row.type-specific,
.role-team .quick-row.type-specific{
  grid-template-columns:repeat(6,minmax(118px,1fr))!important;
  gap:8px!important;
  padding:10px!important;
  border-radius:14px!important;
  align-items:end!important;
  background:#fff!important;
  border-color:#e5eaf3!important;
  box-shadow:0 6px 16px rgba(15,23,42,.035)!important;
}
.quick-row.type-specific label{
  gap:3px!important;
}
.quick-row.type-specific label span{
  display:block!important;
  font-size:10px!important;
  line-height:1.1!important;
  letter-spacing:.035em!important;
  text-transform:uppercase!important;
  color:#64748b!important;
  font-weight:650!important;
}
.quick-row.type-specific input,
.quick-row.type-specific select,
.quick-row.type-specific textarea{
  min-height:34px!important;
  height:34px!important;
  padding:6px 8px!important;
  border-radius:10px!important;
  font-size:12.5px!important;
  line-height:1.1!important;
}
.quick-row.type-specific .wide{
  grid-column:span 2!important;
}
.quick-row.type-specific .ref-col{
  max-width:none!important;
}
.quick-row.type-specific .inline-check{
  min-height:34px!important;
  height:34px!important;
  border:1px solid #e2e8f0!important;
  border-radius:10px!important;
  padding:6px 8px!important;
  background:#f8fafc!important;
}
.quick-row.type-specific .inline-check span{
  font-size:11.5px!important;
  text-transform:none!important;
  letter-spacing:0!important;
}
.quick-row.type-specific [data-remove-row]{
  width:34px!important;
  min-width:34px!important;
  height:34px!important;
  min-height:34px!important;
  border-radius:10px!important;
  padding:0!important;
  align-self:end!important;
}
.quick-card .sticky-actions{
  position:sticky!important;
  bottom:8px!important;
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  align-items:center!important;
  justify-content:flex-end!important;
  margin-top:8px!important;
  padding:8px!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 8px 24px rgba(15,23,42,.08)!important;
}
.quick-card .sticky-actions .button,
.quick-card .sticky-actions button{
  min-height:34px!important;
  height:34px!important;
  padding:7px 12px!important;
  border-radius:11px!important;
  font-size:12px!important;
  width:auto!important;
  flex:0 0 auto!important;
}
.quick-card .upload-field{
  align-self:end!important;
  min-width:0!important;
}
.quick-card .upload-field>span:first-child{
  display:block!important;
  font-size:10px!important;
  line-height:1.1!important;
  letter-spacing:.035em!important;
  text-transform:uppercase!important;
  color:#64748b!important;
  font-weight:650!important;
}
.quick-card .upload-field input[type=file]{
  inset:18px 0 0 0!important;
  width:100%!important;
  height:34px!important;
  pointer-events:auto!important;
}
.quick-card .upload-cta{
  min-height:34px!important;
  height:34px!important;
  padding:6px 8px!important;
  border-radius:10px!important;
  font-size:11px!important;
  line-height:1!important;
  text-align:center!important;
  justify-content:center!important;
  align-items:center!important;
  letter-spacing:.04em!important;
  text-transform:uppercase!important;
  width:100%!important;
}
.quick-card .upload-name{
  min-height:0!important;
  height:0!important;
  padding:0!important;
  margin:0!important;
  font-size:0!important;
}
.quick-card .upload-name:not(:empty){
  height:14px!important;
  min-height:14px!important;
  font-size:10.5px!important;
  line-height:1.2!important;
  margin-top:2px!important;
}

@media(max-width:1280px){
  .quick-row.type-specific,
  .role-team .quick-row.type-specific{
    grid-template-columns:repeat(4,minmax(112px,1fr))!important;
  }
}
@media(max-width:900px){
  .quick-row.type-specific,
  .role-team .quick-row.type-specific{
    grid-template-columns:repeat(3,minmax(104px,1fr))!important;
  }
  .quick-row.type-specific .wide{grid-column:span 2!important;}
}
@media(max-width:760px){
  .card.quick-card{padding:12px!important;border-radius:16px!important;}
  .quick-card .card-head{margin-bottom:8px!important;}
  .quick-card .card-head p{display:none!important;}
  .quick-card .card-head .badge{display:none!important;}
  .quick-type-tabs{
    display:flex!important;
    grid-template-columns:none!important;
    gap:6px!important;
    padding:6px!important;
    margin-bottom:8px!important;
  }
  .quick-type-tab{
    width:auto!important;
    min-height:30px!important;
    padding:7px 9px!important;
    font-size:11.5px!important;
  }
  .input-module .form-panel{padding:8px!important;}
  .quick-row.type-specific,
  .role-team .quick-row.type-specific{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    padding:9px!important;
    border-radius:14px!important;
  }
  .quick-row.type-specific .wide,
  .quick-row.type-specific .full-line{
    grid-column:1 / -1!important;
  }
  .quick-row.type-specific input,
  .quick-row.type-specific select,
  .quick-row.type-specific textarea{
    min-height:33px!important;
    height:33px!important;
    font-size:12px!important;
    padding:6px 7px!important;
  }
  .quick-card .upload-cta,
  .quick-row.type-specific [data-remove-row],
  .quick-row.type-specific .inline-check{
    min-height:33px!important;
    height:33px!important;
  }
  .quick-card .sticky-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr 1fr!important;
    gap:6px!important;
    padding:7px!important;
    bottom:calc(78px + env(safe-area-inset-bottom,0px))!important;
  }
  .quick-card .sticky-actions .button,
  .quick-card .sticky-actions button{
    width:100%!important;
    min-height:33px!important;
    height:33px!important;
    padding:6px 8px!important;
    font-size:11.5px!important;
  }
}
@media(max-width:380px){
  .quick-row.type-specific,
  .role-team .quick-row.type-specific{
    grid-template-columns:1fr!important;
  }
  .quick-row.type-specific .wide,
  .quick-row.type-specific .full-line{grid-column:auto!important;}
  .quick-card .sticky-actions{grid-template-columns:1fr!important;}
}

/* V10.0.4: denser mobile tables + safe Quick Input mobile actions */
@media(max-width:760px){
  .table-wrap,
  .transaction-table-scroll{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    border-radius:12px!important;
    scrollbar-width:thin!important;
  }
  .table-wrap table:not(.transaction-table-final){
    min-width:720px!important;
    width:max-content!important;
    max-width:none!important;
    table-layout:auto!important;
    font-size:11px!important;
  }
  .table-wrap th,
  .table-wrap td{
    padding:6px 7px!important;
    font-size:11px!important;
    line-height:1.25!important;
    vertical-align:middle!important;
    white-space:nowrap!important;
  }
  .table-wrap td .badge,
  .table-wrap td .product-pill,
  .table-wrap td .status-badge{
    padding:3px 6px!important;
    font-size:10px!important;
    line-height:1.1!important;
  }
  .table-wrap td small,
  .table-wrap .mini{
    font-size:10px!important;
    line-height:1.2!important;
  }
  .table-wrap .actions,
  .table-wrap .row-actions-final,
  .table-wrap .action-buttons{
    gap:4px!important;
    flex-wrap:nowrap!important;
  }
  .table-wrap .button.tiny,
  .table-wrap .actions .button,
  .table-wrap .actions button{
    min-height:28px!important;
    height:28px!important;
    padding:4px 7px!important;
    font-size:10.5px!important;
    border-radius:8px!important;
    white-space:nowrap!important;
  }
  .transaction-table-final{
    width:1680px!important;
    min-width:1680px!important;
    max-width:none!important;
    table-layout:fixed!important;
    font-size:10.5px!important;
  }
  .transaction-table-final col.col-date{width:82px!important;}
  .transaction-table-final col.col-type{width:105px!important;}
  .transaction-table-final col.col-product{width:92px!important;}
  .transaction-table-final col.col-desc{width:190px!important;}
  .transaction-table-final col.col-partner{width:128px!important;}
  .transaction-table-final col.col-qty{width:88px!important;}
  .transaction-table-final col.col-price{width:104px!important;}
  .transaction-table-final col.col-in{width:104px!important;}
  .transaction-table-final col.col-out{width:104px!important;}
  .transaction-table-final col.col-total{width:112px!important;}
  .transaction-table-final col.col-proof{width:78px!important;}
  .transaction-table-final col.col-status{width:116px!important;}
  .transaction-table-final col.col-source{width:160px!important;}
  .transaction-table-final col.col-actions{width:217px!important;}
  .transaction-table-final th,
  .transaction-table-final td{
    padding:6px 7px!important;
    font-size:10.5px!important;
    line-height:1.2!important;
    white-space:normal!important;
  }
  .transaction-table-final tbody td{
    height:46px!important;
    min-height:46px!important;
    max-height:50px!important;
    vertical-align:middle!important;
  }
  .transaction-table-final .cell-stack{
    min-height:30px!important;
    max-height:40px!important;
    gap:2px!important;
    justify-content:center!important;
    overflow:hidden!important;
  }
  .transaction-table-final .text-ellipsis,
  .transaction-table-final .cell-stack small{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    display:block!important;
    max-width:100%!important;
  }
  .transaction-table-final .money-cell{
    white-space:nowrap!important;
    font-size:10.5px!important;
  }
  .transaction-table-final .actions-cell-final{
    padding:5px 6px!important;
  }
  .transaction-table-final .row-actions-final{
    height:32px!important;
    min-height:32px!important;
    gap:4px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:nowrap!important;
  }
  .transaction-table-final .action-btn-final{
    width:64px!important;
    min-width:64px!important;
    max-width:64px!important;
    height:30px!important;
    min-height:30px!important;
    max-height:30px!important;
    border-radius:9px!important;
    font-size:10px!important;
    padding:0 5px!important;
    gap:3px!important;
    white-space:nowrap!important;
  }
  .transaction-table-final .action-btn-final .bi{font-size:12px!important;}
  .quick-card .sticky-actions{
    position:static!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    margin-top:10px!important;
    padding:7px!important;
    background:#fff!important;
    box-shadow:none!important;
    border:1px solid var(--line)!important;
  }
  .quick-card .sticky-actions .button,
  .quick-card .sticky-actions button{
    min-width:0!important;
    width:100%!important;
    font-size:11px!important;
  }
  .quick-card .upload-field{
    min-height:50px!important;
    position:relative!important;
    z-index:1!important;
  }
  .quick-card .upload-field input[type=file]{
    inset:17px 0 auto 0!important;
    height:33px!important;
  }
  .quick-card .upload-cta{
    display:flex!important;
    text-align:center!important;
    justify-content:center!important;
    align-items:center!important;
    width:100%!important;
    min-height:33px!important;
    height:33px!important;
  }
  .quick-card .upload-name:not(:empty){
    display:block!important;
    height:auto!important;
    min-height:12px!important;
    font-size:10px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .card,
  .form-panel,
  .input-module .form-panel{
    overflow:visible!important;
  }
}
@media(max-width:420px){
  .transaction-table-final{width:1580px!important;min-width:1580px!important;}
  .transaction-table-final col.col-desc{width:170px!important;}
  .transaction-table-final col.col-partner{width:112px!important;}
  .transaction-table-final col.col-source{width:138px!important;}
  .transaction-table-final col.col-actions{width:198px!important;}
  .transaction-table-final .action-btn-final{width:58px!important;min-width:58px!important;max-width:58px!important;font-size:0!important;}
  .transaction-table-final .action-btn-final .bi{font-size:13px!important;}
  .quick-card .sticky-actions{grid-template-columns:1fr 1fr!important;}
  .quick-card .sticky-actions .button.primary{grid-column:1/-1!important;}
}

/* V10.0.5: mobile compact 4-column summary grids */
@media(max-width:760px){
  /* Ringkasan kotak-kotak: tampil 4 ke samping, baru turun bila item lebih banyak */
  .kpi-grid,
  .metric-strip,
  .audit-note-grid,
  .team-flow,
  .team-metric-list,
  .input-detail-grid,
  .edit-detail-summary{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:6px!important;
    align-items:stretch!important;
  }

  .kpi,
  .metric-strip .mini-card,
  .audit-note-grid>div,
  .team-flow>div,
  .team-metric-list>div,
  .input-detail-grid>div,
  .edit-detail-summary>div{
    min-width:0!important;
    min-height:0!important;
    border-radius:12px!important;
    padding:7px 6px!important;
    box-shadow:0 6px 16px rgba(15,23,42,.045)!important;
  }

  .kpi span,
  .mini-card span,
  .audit-note-grid span,
  .team-flow span,
  .team-metric-list span,
  .input-detail-grid span,
  .edit-detail-summary span{
    display:block!important;
    font-size:8.5px!important;
    line-height:1.12!important;
    letter-spacing:.02em!important;
    margin:0 0 3px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .kpi strong,
  .mini-card strong,
  .audit-note-grid b,
  .team-flow b,
  .team-metric-list b,
  .input-detail-grid b,
  .edit-detail-summary b{
    display:block!important;
    font-size:clamp(9px,2.45vw,12px)!important;
    line-height:1.12!important;
    margin:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    word-break:normal!important;
  }

  .kpi small,
  .team-settlement-note{
    display:none!important;
  }

  .team-metric-list .wide,
  .input-detail-grid>div.wide{
    grid-column:auto!important;
  }

  .input-section-stats{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:6px!important;
    justify-content:stretch!important;
  }
  .input-section-stats span{
    min-width:0!important;
    border-radius:11px!important;
    padding:6px!important;
    font-size:9px!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  /* Jangan ubah form input menjadi 4 kolom penuh supaya tidak terpotong. */
  .form-grid,
  .quick-row,
  .debt-row{
    max-width:100%!important;
  }
}

@media(max-width:340px){
  .kpi-grid,
  .metric-strip,
  .audit-note-grid,
  .team-flow,
  .team-metric-list,
  .input-detail-grid,
  .edit-detail-summary,
  .input-section-stats{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

/* V10.0.6: mobile overflow guard + compact forms */
@media(max-width:760px){
  html,body{max-width:100%!important;overflow-x:hidden!important;}
  .app-shell,.main,.content,.card,.grid,.grid.two,.grid.three,.form-panel,.table-wrap,.finance-table-wrap,.summary-type-table{
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  .content>*{min-width:0!important;max-width:100%!important;}
  .grid.two,.grid.three{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:14px!important;}

  /* Semua grid ringkasan tetap 4 kolom, tetapi tidak boleh mendorong layar melebar. */
  .kpi-grid,
  .metric-strip,
  .audit-note-grid,
  .team-flow,
  .team-metric-list,
  .input-detail-grid,
  .edit-detail-summary,
  .input-section-stats{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    overflow:hidden!important;
  }
  .kpi,
  .metric-strip .mini-card,
  .audit-note-grid>div,
  .team-flow>div,
  .team-metric-list>div,
  .input-detail-grid>div,
  .edit-detail-summary>div,
  .input-section-stats span{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  .kpi span,.kpi strong,.kpi small,
  .metric-strip .mini-card span,.metric-strip .mini-card strong,
  .audit-note-grid span,.audit-note-grid b,
  .team-flow span,.team-flow b,
  .team-metric-list span,.team-metric-list b,
  .input-detail-grid span,.input-detail-grid b,
  .edit-detail-summary span,.edit-detail-summary b,
  .input-section-stats span{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    word-break:normal!important;
  }
  .kpi strong,
  .metric-strip .mini-card strong,
  .audit-note-grid b,
  .team-flow b,
  .team-metric-list b,
  .input-detail-grid b,
  .edit-detail-summary b{
    font-size:clamp(8.5px,2.15vw,11px)!important;
    letter-spacing:-.02em!important;
  }

  /* Ringkasan Tipe Transaksi: area tabel wajib scroll sendiri, bukan mendorong layar. */
  .summary-type-table,
  .finance-table-wrap,
  .table-wrap{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x pan-y!important;
  }
  .summary-type-table table{
    width:560px!important;
    min-width:560px!important;
    max-width:none!important;
    table-layout:fixed!important;
    font-size:10.5px!important;
  }
  .summary-type-table th,
  .summary-type-table td{
    padding:6px 7px!important;
    font-size:10.5px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    vertical-align:middle!important;
  }
  .summary-type-table th:nth-child(1),.summary-type-table td:nth-child(1){width:138px!important;}
  .summary-type-table th:nth-child(2),.summary-type-table td:nth-child(2){width:54px!important;text-align:center!important;}
  .summary-type-table th:nth-child(3),.summary-type-table td:nth-child(3),
  .summary-type-table th:nth-child(4),.summary-type-table td:nth-child(4){width:112px!important;text-align:right!important;}
  .summary-type-table th:nth-child(5),.summary-type-table td:nth-child(5){width:124px!important;}
  .summary-type-table .badge{max-width:100%!important;font-size:9.5px!important;padding:3px 5px!important;}

  /* Filter mobile dibuat kecil dan clean. */
  .inline-filter{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    padding:9px!important;
    border-radius:14px!important;
    margin:0!important;
    align-items:end!important;
  }
  .inline-filter label{gap:3px!important;font-size:10.5px!important;line-height:1.1!important;min-width:0!important;}
  .inline-filter input,
  .inline-filter select{
    min-width:0!important;
    height:34px!important;
    min-height:34px!important;
    padding:6px 8px!important;
    border-radius:10px!important;
    font-size:12px!important;
  }
  .inline-filter .button,
  .inline-filter button{
    min-height:34px!important;
    height:34px!important;
    padding:6px 9px!important;
    font-size:11.5px!important;
    border-radius:10px!important;
  }

  /* Semua form input mobile dibuat lebih minimalis tanpa memotong isi penting. */
  .form-panel{padding:10px!important;border-radius:15px!important;}
  .form-grid,
  .form-grid.cols-4,
  .form-grid.cols-3,
  .form-grid.two,
  .form-grid.three{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .form-grid label,
  .form-panel label,
  .quick-row label,
  .debt-row label{
    min-width:0!important;
    gap:4px!important;
    font-size:11px!important;
    line-height:1.15!important;
  }
  .form-grid label.span-2,
  .form-grid label.span-3,
  .form-grid label.span-4,
  .form-grid .span-2,
  .form-grid .span-3,
  .form-grid .span-4{
    grid-column:1/-1!important;
  }
  input,select,textarea{
    min-height:34px!important;
    padding:6px 8px!important;
    border-radius:10px!important;
    font-size:12px!important;
    line-height:1.25!important;
  }
  textarea{min-height:58px!important;}
  input[type=file]{font-size:10.5px!important;padding:5px!important;}
  .form-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    margin-top:10px!important;
  }
  .form-actions .button,.form-actions button{
    width:100%!important;
    min-height:34px!important;
    height:34px!important;
    padding:6px 9px!important;
    font-size:11.5px!important;
    border-radius:10px!important;
  }

  /* Quick Input tetap compact dan tidak overlap. */
  .quick-card,.quick-card .form-panel,.input-module,.input-module .form-panel{max-width:100%!important;overflow:visible!important;}
  .quick-row.type-specific,.role-team .quick-row.type-specific{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    overflow:visible!important;
  }
  .quick-card .upload-field{grid-column:1/-1!important;min-height:52px!important;z-index:1!important;}
  .quick-card .upload-cta{justify-content:center!important;text-align:center!important;}
  .quick-card .sticky-actions{position:static!important;margin-top:9px!important;z-index:1!important;}
}

@media(max-width:380px){
  .inline-filter{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .form-grid,
  .form-grid.cols-4,
  .form-grid.cols-3,
  .form-grid.two,
  .form-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .kpi-grid,
  .metric-strip,
  .audit-note-grid,
  .team-flow,
  .team-metric-list,
  .input-detail-grid,
  .edit-detail-summary,
  .input-section-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}


/* V10.0.7: global alignment polish for mobile + desktop. */
html{width:100%;max-width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%;}
body{width:100%;max-width:100%;overflow-x:hidden;}
img,svg,canvas,video{max-width:100%;height:auto;}
.main,.content,.card,.form-panel,.table-wrap,.modal-card{min-width:0;max-width:100%;}
.card-head,.topbar,.user-menu,.actions,.form-actions,.inline-filter{min-width:0;}
.card-head>*{min-width:0;}
.card-head h2,.topbar h1{overflow-wrap:anywhere;}
.actions{align-items:center;}
.actions .inline-action-form{display:inline-flex;margin:0;vertical-align:middle;}
.actions .button,.actions button{white-space:nowrap;}
.table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
th,td{word-break:normal;overflow-wrap:anywhere;}
.device-log{max-width:340px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
input,select,textarea,button,.button{max-width:100%;}
.form-grid>*{min-width:0;}
.modal-backdrop{padding:16px;}
.modal-card{width:min(720px,100%);max-height:calc(100vh - 32px);overflow:auto;}

@media(min-width:901px){
  .content{width:100%;}
  .form-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
  .form-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
  .grid.two{grid-template-columns:repeat(2,minmax(0,1fr));}
  .grid.three{grid-template-columns:repeat(3,minmax(0,1fr));}
  .kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
}

@media(max-width:900px){
  .app-shell{display:block;min-height:100vh;width:100%;}
  .main{width:100%;}
  .topbar{padding:12px 14px;gap:10px;align-items:center;}
  .topbar h1{font-size:18px;line-height:1.2;}
  .topbar p{font-size:12px;line-height:1.25;}
  .content{padding:12px;gap:12px;width:100%;}
  .card{padding:12px;border-radius:16px;}
  .card-head{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:12px;}
  .card-head h2{font-size:16px;line-height:1.25;}
  .card-head p{font-size:12px;line-height:1.35;}
  .grid.two,.grid.three,.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .kpi{padding:12px;border-radius:16px;}
  .kpi strong{font-size:18px;line-height:1.2;}
  .table-wrap{border-radius:14px;}
  table{min-width:720px;}
  th,td{padding:9px 10px;font-size:12px;vertical-align:middle;}
  .actions{gap:6px;flex-wrap:nowrap;}
  .actions .button,.actions button{min-height:32px;padding:6px 8px;font-size:11px;border-radius:10px;}
  .badge{padding:4px 7px;font-size:11px;line-height:1.1;}
  .modal-backdrop{padding:10px;align-items:flex-start;overflow:auto;}
  .modal-card{width:100%;max-height:calc(100vh - 20px);border-radius:16px;}
}

@media(max-width:560px){
  .content{padding:10px;gap:10px;}
  .card{padding:10px;border-radius:15px;}
  .grid.two,.grid.three,.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .inline-filter{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .form-grid,.form-grid.cols-4,.form-grid.cols-3,.form-grid.two,.form-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .form-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .form-actions .button,.form-actions button{min-width:0;}
  .user-menu{gap:6px;}
  .user-menu .button{padding:7px 9px;font-size:11px;}
  .device-log{max-width:220px;}
}

/* V10.0.8 - full UI alignment audit: desktop/tablet tables stay tabular, mobile stays card-based, silent actions do not visually jump. */
:root{--hsa-safe-bottom:env(safe-area-inset-bottom,0px)}
html,body{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
body.app-body{min-width:0!important}
.app-shell,.main,.content,.card,.grid,.kpi-grid,.metric-strip,.form-panel,.table-wrap,.transaction-table-scroll,.modal-card{min-width:0!important;max-width:100%!important}
.card,.kpi,.form-panel,.modal-card{overflow-wrap:anywhere!important}
input,select,textarea,button,.button{min-width:0;max-width:100%}
.actions,.form-actions,.card-head,.inline-filter,.user-menu{min-width:0!important}
.actions form,.inline-action-form{margin:0!important;display:inline-flex!important;align-items:center!important}
.button,.actions button,.actions .button{line-height:1.1!important;text-align:center!important}

@media(min-width:761px){
  .grid.two{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .grid.three{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .form-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .form-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .metric-strip{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .card-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:16px!important}
  .card-head .actions{display:flex!important;width:auto!important;justify-content:flex-end!important;flex-wrap:wrap!important}
  .form-actions{display:flex!important;width:auto!important;grid-template-columns:none!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap!important}
  .form-actions .button,.form-actions button{width:auto!important}
  .inline-filter{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(160px,1fr))!important;align-items:end!important}
  .inline-filter .button,.inline-filter button{width:auto!important;min-width:0!important}
  .table-wrap,.table-wrap.responsive-cards{display:block!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;border:1px solid var(--line)!important;border-radius:16px!important;background:#fff!important;-webkit-overflow-scrolling:touch!important}
  .table-wrap.responsive-cards table{display:table!important;width:100%!important;min-width:760px!important;max-width:none!important;border-collapse:collapse!important;table-layout:auto!important;background:#fff!important}
  .table-wrap.responsive-cards thead{display:table-header-group!important}
  .table-wrap.responsive-cards tbody{display:table-row-group!important}
  .table-wrap.responsive-cards tr{display:table-row!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fff!important;overflow:visible!important}
  .table-wrap.responsive-cards th,.table-wrap.responsive-cards td{display:table-cell!important;width:auto!important;min-width:0!important;max-width:none!important;padding:10px 12px!important;border-bottom:1px solid var(--line)!important;vertical-align:middle!important;text-align:left!important;background:inherit!important}
  .table-wrap.responsive-cards td::before{display:none!important;content:none!important}
  .table-wrap.responsive-cards td.actions,.table-wrap.responsive-cards .actions{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important}
  .table-wrap.responsive-cards td.actions{min-width:170px!important;white-space:nowrap!important}
}

@media(min-width:761px) and (max-width:1180px){
  .kpi-grid,.metric-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .form-grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .grid.three{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .quick-row,.role-team .quick-row,.debt-row,.operational-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .quick-row .wide,.debt-row .wide,.operational-row .wide{grid-column:span 2!important}
}

@media(max-width:760px){
  body.app-body{padding-bottom:calc(88px + var(--hsa-safe-bottom))!important}
  .main{width:100%!important;max-width:100%!important;margin-left:0!important;overflow-x:hidden!important}
  .content{width:100%!important;padding:12px 12px calc(100px + var(--hsa-safe-bottom))!important;gap:12px!important;overflow-x:hidden!important}
  .topbar{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;min-height:62px!important;padding:12px 12px 12px 64px!important;border-radius:0 0 20px 20px!important;overflow:visible!important}
  .topbar .menu-button,.topbar .topbar-notif,.topbar #notifPanel,.topbar .user-identity{display:none!important}
  .topbar .top-title{min-width:0!important;flex:1 1 auto!important;grid-column:auto!important}
  .topbar h1{font-size:18px!important;line-height:1.15!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;margin:0!important}
  .topbar p{display:none!important}
  .topbar .user-menu{display:flex!important;grid-column:auto!important;width:auto!important;flex:0 0 auto!important;align-items:center!important;justify-content:flex-end!important;gap:6px!important;margin:0!important;padding:0!important;flex-wrap:nowrap!important}
  .topbar .topbar-account,.topbar .topbar-logout{display:inline-flex!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;padding:0!important;border-radius:14px!important;font-size:0!important;background:#fff!important;border:1px solid #e2e8f0!important}
  .topbar .topbar-account .bi,.topbar .topbar-logout .bi{font-size:18px!important;margin:0!important}
  .floating-menu-toggle{display:inline-flex!important;align-items:center!important;justify-content:center!important;position:fixed!important;top:12px!important;left:12px!important;right:auto!important;bottom:auto!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;padding:0!important;border-radius:15px!important;background:#0f172a!important;color:#fff!important;z-index:150!important;font-size:0!important}
  .floating-menu-toggle .bi{font-size:22px!important;line-height:1!important;margin:0!important}
  body.sidebar-mobile-open .floating-menu-toggle{left:12px!important;top:12px!important;background:#fff!important;color:#0f172a!important;border-color:#dbe4ee!important}
  .sidebar{z-index:140!important;width:min(280px,88vw)!important;max-width:min(280px,88vw)!important;padding-top:68px!important}
  .sidebar-backdrop.show{z-index:130!important}
  .card{padding:12px!important;border-radius:16px!important;overflow:hidden!important}
  .card-head{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin-bottom:12px!important}
  .card-head .actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important;gap:8px!important}
  .card-head .actions .button,.card-head .actions button{width:100%!important}
  .grid.two,.grid.three,.kpi-grid,.metric-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .kpi,.metric-strip .mini-card{min-height:0!important;padding:11px!important;border-radius:15px!important}
  .kpi strong,.mini-card strong{font-size:clamp(16px,5vw,20px)!important;line-height:1.15!important}
  .inline-filter{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;padding:10px!important;margin-bottom:10px!important;border-radius:14px!important}
  .inline-filter label{font-size:11px!important;gap:4px!important;min-width:0!important}
  .inline-filter input,.inline-filter select,.inline-filter button,.inline-filter .button{width:100%!important;min-width:0!important;min-height:36px!important;height:36px!important;font-size:12px!important;padding:6px 8px!important;border-radius:10px!important}
  .form-grid,.form-grid.cols-4,.form-grid.cols-3,.form-grid.two,.form-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .form-grid .span-2,.form-grid .span-3,.form-grid .span-4,.span-2,.span-3,.span-4{grid-column:1/-1!important}
  .form-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;width:100%!important}
  .form-actions .button,.form-actions button{width:100%!important;min-height:38px!important;height:auto!important}
  .table-wrap.responsive-cards{border:0!important;overflow:visible!important;background:transparent!important;margin-top:10px!important}
  .table-wrap.responsive-cards table,.table-wrap.responsive-cards thead,.table-wrap.responsive-cards tbody,.table-wrap.responsive-cards tr,.table-wrap.responsive-cards th,.table-wrap.responsive-cards td{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important}
  .table-wrap.responsive-cards thead{display:none!important}
  .table-wrap.responsive-cards tbody{display:grid!important;gap:10px!important}
  .table-wrap.responsive-cards tr{margin:0!important;border:1px solid var(--line)!important;border-radius:16px!important;background:#fff!important;box-shadow:0 8px 22px rgba(15,23,42,.045)!important;overflow:hidden!important}
  .table-wrap.responsive-cards td{display:grid!important;grid-template-columns:96px minmax(0,1fr)!important;align-items:start!important;gap:10px!important;padding:9px 11px!important;border:0!important;border-bottom:1px solid #eef2f7!important;text-align:left!important;white-space:normal!important;overflow:visible!important}
  .table-wrap.responsive-cards td::before{content:attr(data-label)!important;font-size:10px!important;font-weight:900!important;letter-spacing:.04em!important;text-transform:uppercase!important;color:#64748b!important;padding-top:2px!important}
  .table-wrap.responsive-cards td:last-child{border-bottom:0!important}
  .table-wrap.responsive-cards td.actions,.table-wrap.responsive-cards .actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important;width:100%!important;min-width:0!important;white-space:normal!important}
  .table-wrap.responsive-cards td.actions::before{grid-column:1/-1!important}
  .table-wrap.responsive-cards td.actions .button,.table-wrap.responsive-cards td.actions button,.table-wrap.responsive-cards td.actions form{width:100%!important;min-width:0!important}
  .summary-type-table.responsive-cards,.finance-table-wrap.summary-type-table.responsive-cards{display:block!important;overflow-x:auto!important;overflow-y:hidden!important;border:1px solid var(--line)!important;border-radius:14px!important;background:#fff!important;-webkit-overflow-scrolling:touch!important}
  .summary-type-table.responsive-cards table{display:table!important;width:560px!important;min-width:560px!important;max-width:none!important;table-layout:fixed!important}
  .summary-type-table.responsive-cards thead{display:table-header-group!important}
  .summary-type-table.responsive-cards tbody{display:table-row-group!important}
  .summary-type-table.responsive-cards tr{display:table-row!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}
  .summary-type-table.responsive-cards th,.summary-type-table.responsive-cards td{display:table-cell!important;width:auto!important;padding:7px 8px!important;border-bottom:1px solid var(--line)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .summary-type-table.responsive-cards td::before{display:none!important;content:none!important}
  .mobile-bottom-nav{display:grid!important;left:10px!important;right:10px!important;bottom:calc(10px + var(--hsa-safe-bottom))!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;z-index:120!important}
  .toast,.offline-badge{bottom:calc(92px + var(--hsa-safe-bottom))!important;z-index:160!important}
}

@media(max-width:420px){
  .grid.two,.grid.three,.kpi-grid,.metric-strip,.inline-filter,.form-grid,.form-grid.cols-4,.form-grid.cols-3,.form-actions{grid-template-columns:1fr!important}
  .table-wrap.responsive-cards td{grid-template-columns:1fr!important;gap:4px!important}
  .table-wrap.responsive-cards td.actions{grid-template-columns:1fr!important}
  .topbar .topbar-account{display:none!important}
}

/* V10.0.9 - collision audit fix: audit compare tables + safer responsive layout. */
:root{--hsa-table-min:720px}
.card,.form-panel,.audit-review-panel{overflow:visible!important}
.content,.card,.form-panel,.audit-review-panel,.audit-review-grid,.audit-review-tables,.audit-review-table-card{min-width:0!important;max-width:100%!important}
.table-wrap{overflow-x:auto!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important}
.table-wrap table{max-width:none!important}
.table-wrap th,.table-wrap td{box-sizing:border-box!important}

/* Audit review must not inherit the generic overflow-y:hidden/card-table rules. */
.audit-review-panel{position:relative!important;isolation:isolate!important}
.audit-review-grid{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(340px,520px)!important;gap:16px!important;align-items:start!important}
.audit-review-grid>*{min-width:0!important;max-width:100%!important}
.audit-review-form,.audit-review-summary{min-width:0!important;max-width:100%!important;overflow:visible!important}
.audit-review-location,.audit-review-summary p,.audit-review-kind span{overflow-wrap:anywhere!important;word-break:normal!important}
.audit-review-tables{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important;margin-top:16px!important;overflow:visible!important}
.audit-review-table-card{display:grid!important;gap:10px!important;padding:14px!important;border:1px solid #dbe6f2!important;border-radius:18px!important;background:#fff!important;box-shadow:0 10px 26px rgba(15,23,42,.045)!important;overflow:visible!important}
.audit-review-table-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px!important;min-width:0!important}
.audit-review-table-head h3{margin:0!important;font-size:15px!important;line-height:1.25!important;display:flex!important;align-items:center!important;gap:8px!important;min-width:0!important}
.audit-review-table-head span{display:inline-flex!important;align-items:center!important;min-height:26px!important;padding:5px 9px!important;border-radius:999px!important;background:#f8fafc!important;color:#64748b!important;border:1px solid #e2e8f0!important;font-size:11px!important;font-weight:650!important;line-height:1.2!important;white-space:normal!important;text-align:right!important;max-width:280px!important}
.audit-review-panel .mini-table-wrap,
.audit-review-panel .audit-compare-table-wrap,
.audit-review-panel .audit-structured-table-wrap{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  max-height:380px!important;
  min-height:0!important;
  overflow:auto!important;
  overflow-x:auto!important;
  overflow-y:auto!important;
  border:1px solid #dfe8f3!important;
  border-radius:14px!important;
  background:#fff!important;
  -webkit-overflow-scrolling:touch!important;
}
.audit-review-panel .mini-table-wrap table{
  display:table!important;
  width:max-content!important;
  min-width:980px!important;
  max-width:none!important;
  table-layout:fixed!important;
  border-collapse:separate!important;
  border-spacing:0!important;
  margin:0!important;
  background:#fff!important;
}
.audit-review-panel .audit-compare-table-wrap table{min-width:1080px!important}
.audit-review-panel .audit-structured-table-wrap table{min-width:1040px!important}
.audit-review-panel .mini-table-wrap thead{display:table-header-group!important}
.audit-review-panel .mini-table-wrap tbody{display:table-row-group!important}
.audit-review-panel .mini-table-wrap tr{display:table-row!important;background:#fff!important;border:0!important;border-radius:0!important;box-shadow:none!important;margin:0!important;overflow:visible!important}
.audit-review-panel .mini-table-wrap th,
.audit-review-panel .mini-table-wrap td{
  display:table-cell!important;
  width:auto!important;
  padding:9px 10px!important;
  border:0!important;
  border-right:1px solid #eef2f7!important;
  border-bottom:1px solid #eef2f7!important;
  vertical-align:top!important;
  text-align:left!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  line-height:1.35!important;
  background:inherit!important;
  height:auto!important;
  max-height:none!important;
}
.audit-review-panel .mini-table-wrap th{position:sticky!important;top:0!important;z-index:3!important;background:#f8fafc!important;color:#475569!important;font-size:11px!important;font-weight:800!important;letter-spacing:.04em!important;text-transform:uppercase!important;white-space:nowrap!important}
.audit-review-panel .mini-table-wrap td::before{display:none!important;content:none!important}
.audit-review-panel .audit-compare-table-wrap th:nth-child(1),.audit-review-panel .audit-compare-table-wrap td:nth-child(1){width:72px!important;white-space:nowrap!important;text-align:center!important}
.audit-review-panel .audit-compare-table-wrap th:nth-child(2),.audit-review-panel .audit-compare-table-wrap td:nth-child(2){width:140px!important}
.audit-review-panel .audit-compare-table-wrap th:nth-child(3),.audit-review-panel .audit-compare-table-wrap td:nth-child(3){width:120px!important}
.audit-review-panel .audit-compare-table-wrap th:nth-child(4),.audit-review-panel .audit-compare-table-wrap td:nth-child(4){width:470px!important}
.audit-review-panel .audit-compare-table-wrap th:nth-child(5),.audit-review-panel .audit-compare-table-wrap td:nth-child(5){width:278px!important}
.audit-review-panel .audit-structured-table-wrap th:nth-child(1),.audit-review-panel .audit-structured-table-wrap td:nth-child(1){width:76px!important;white-space:nowrap!important}
.audit-review-panel .audit-structured-table-wrap th:nth-child(2),.audit-review-panel .audit-structured-table-wrap td:nth-child(2){width:140px!important}
.audit-review-panel .audit-structured-table-wrap th:nth-child(3),.audit-review-panel .audit-structured-table-wrap td:nth-child(3){width:118px!important;white-space:nowrap!important}
.audit-review-panel .audit-structured-table-wrap th:nth-child(4),.audit-review-panel .audit-structured-table-wrap td:nth-child(4){width:145px!important}
.audit-review-panel .audit-structured-table-wrap th:nth-child(5),.audit-review-panel .audit-structured-table-wrap td:nth-child(5){width:120px!important}
.audit-review-panel .audit-structured-table-wrap th:nth-child(6),.audit-review-panel .audit-structured-table-wrap td:nth-child(6),
.audit-review-panel .audit-structured-table-wrap th:nth-child(7),.audit-review-panel .audit-structured-table-wrap td:nth-child(7){width:128px!important;white-space:nowrap!important;text-align:right!important}
.audit-review-panel .audit-structured-table-wrap th:nth-child(8),.audit-review-panel .audit-structured-table-wrap td:nth-child(8){width:125px!important}
.audit-review-panel .audit-structured-table-wrap th:nth-child(9),.audit-review-panel .audit-structured-table-wrap td:nth-child(9){width:132px!important;text-align:center!important}
.audit-review-panel .mini-table-wrap .button{white-space:nowrap!important;min-height:30px!important;padding:6px 9px!important}
.audit-review-panel .mini-table-wrap .badge{white-space:nowrap!important;max-width:100%!important}
.audit-review-panel .row-focus td{background:#fff7ed!important;box-shadow:inset 0 0 0 1px #fdba74!important;outline:0!important}

/* Undo overly aggressive 4-column mobile compression for text-heavy sections. */
@media(max-width:760px){
  .audit-review-grid{grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
  .audit-review-panel{margin-left:0!important;margin-right:0!important;border-radius:16px!important;overflow:visible!important}
  .audit-review-table-card{padding:11px!important;border-radius:16px!important;gap:8px!important}
  .audit-review-table-head{display:grid!important;grid-template-columns:1fr!important;gap:6px!important}
  .audit-review-table-head span{max-width:none!important;text-align:left!important;justify-content:flex-start!important;font-size:10.5px!important;border-radius:11px!important}
  .audit-review-panel .mini-table-wrap{max-height:58dvh!important;border-radius:12px!important;overflow:auto!important;overflow-x:auto!important;overflow-y:auto!important}
  .audit-review-panel .mini-table-wrap table{font-size:11px!important}
  .audit-review-panel .audit-compare-table-wrap table{min-width:880px!important;width:880px!important}
  .audit-review-panel .audit-structured-table-wrap table{min-width:900px!important;width:900px!important}
  .audit-review-panel .mini-table-wrap th,.audit-review-panel .mini-table-wrap td{padding:7px 8px!important;font-size:11px!important;line-height:1.28!important}
  .audit-review-panel .audit-compare-table-wrap th:nth-child(4),.audit-review-panel .audit-compare-table-wrap td:nth-child(4){width:360px!important}
  .audit-review-panel .audit-compare-table-wrap th:nth-child(5),.audit-review-panel .audit-compare-table-wrap td:nth-child(5){width:220px!important}
  .audit-note-grid{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;overflow:visible!important}
  .audit-note-grid>div{padding:11px!important;border-radius:14px!important;overflow:visible!important}
  .audit-note-grid b,.audit-note-grid span{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.35!important}
  .audit-note-grid b{font-size:13px!important}.audit-note-grid span{font-size:12px!important}
  .quality-issue-card{grid-template-columns:1fr!important;gap:10px!important;overflow:visible!important}
  .quality-issue-card small{align-items:flex-start!important;overflow-wrap:anywhere!important}
  .mini-metrics span{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;min-width:0!important}
  .mini-metrics b{min-width:0!important;overflow-wrap:anywhere!important;text-align:right!important}
  .card,.form-panel{overflow:visible!important}
  .table-wrap:not(.responsive-cards){overflow:auto!important;overflow-x:auto!important;overflow-y:auto!important}
}

@media(max-width:560px){
  .inline-filter,.form-grid,.form-grid.cols-4,.form-grid.cols-3,.form-grid.two,.form-grid.three,.form-actions{grid-template-columns:1fr!important}
  .compact-actions,.audit-review-form .form-actions{grid-template-columns:1fr!important;display:grid!important}
  .compact-actions .button,.audit-review-form .form-actions .button,.audit-review-form .form-actions button{width:100%!important}
  .audit-compare-metrics{grid-template-columns:1fr!important}
  .topbar .topbar-account{display:none!important}
}


/* V10.0.10 - simple minimal dashboard + mobile collision reset. */
:root{
  --hsa-min-card-radius:18px;
  --hsa-min-gap:14px;
}

.dashboard-admin-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:18px!important;
  align-items:start!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}
.dashboard-admin-grid>.card,
.dashboard-summary-card,
.dashboard-team-card{
  min-width:0!important;
  max-width:100%!important;
  overflow:visible!important;
}
.dashboard-team-card .card-head{
  margin-bottom:14px!important;
}
.team-performance-cards.clean{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important;
  gap:12px!important;
  align-items:stretch!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:visible!important;
}
.team-perf-card.clean{
  display:grid!important;
  gap:12px!important;
  min-width:0!important;
  max-width:100%!important;
  padding:16px!important;
  border-radius:var(--hsa-min-card-radius)!important;
  border:1px solid #e2e8f0!important;
  background:#fff!important;
  box-shadow:0 8px 22px rgba(15,23,42,.045)!important;
  overflow:hidden!important;
}
.team-perf-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:start!important;
  gap:10px!important;
  margin:0!important;
  min-width:0!important;
}
.team-title{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  align-items:center!important;
  gap:10px!important;
}
.team-avatar{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  border-radius:13px!important;
  font-size:14px!important;
  box-shadow:none!important;
}
.team-title strong,
.team-title small{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.team-net-pill{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  max-width:170px!important;
  min-width:0!important;
  padding:6px 9px!important;
  border-radius:999px!important;
  font-size:12px!important;
  line-height:1.15!important;
  font-weight:850!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.team-flow,
.team-metric-list{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:0!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:visible!important;
  border:1px solid #eef2f7!important;
  border-radius:14px!important;
  background:#fff!important;
}
.team-flow>div,
.team-metric-list>div{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(120px,auto)!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  min-height:0!important;
  padding:10px 12px!important;
  border:0!important;
  border-bottom:1px solid #eef2f7!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.team-flow>div:last-child,
.team-metric-list>div:last-child{
  border-bottom:0!important;
}
.team-flow span,
.team-metric-list span{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  color:#64748b!important;
  font-size:12px!important;
  line-height:1.25!important;
  font-weight:750!important;
  letter-spacing:0!important;
  text-transform:none!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.team-flow span .bi,
.team-metric-list span .bi{
  flex:0 0 auto!important;
  font-size:14px!important;
}
.team-flow b,
.team-metric-list b{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  color:#0f172a!important;
  font-size:13px!important;
  line-height:1.25!important;
  font-weight:850!important;
  text-align:right!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.team-settlement-note{
  display:block!important;
  margin:0!important;
  padding:10px 12px!important;
  border-radius:14px!important;
  background:#f8fafc!important;
  border:1px solid #eef2f7!important;
  color:#475569!important;
  font-size:12px!important;
  line-height:1.45!important;
  overflow-wrap:anywhere!important;
}
.team-settlement-note b{
  color:#0f172a!important;
  font-weight:850!important;
}

@media(min-width:1181px){
  .dashboard-admin-grid{gap:20px!important;}
  .team-performance-cards.clean{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important;}
}

@media(max-width:760px){
  body.app-body{background:#f6f8fb!important;}
  body.app-body .content{
    padding:12px 10px calc(96px + var(--hsa-safe-bottom,0px))!important;
    gap:12px!important;
    overflow-x:hidden!important;
  }
  .card,
  .kpi,
  .form-panel,
  .login-card,
  .team-perf-card.clean{
    border-radius:16px!important;
    box-shadow:0 6px 18px rgba(15,23,42,.04)!important;
  }
  .card{padding:12px!important;overflow:visible!important;}
  .card-head{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin-bottom:12px!important;
  }
  .card-head h2{font-size:16px!important;line-height:1.25!important;}
  .card-head p{font-size:12px!important;line-height:1.35!important;}
  .card-head .button,
  .card-head button{
    width:100%!important;
  }

  /* Minimal mobile: one clean column instead of cramped 2/4 column grids. */
  .dashboard-admin-grid,
  .grid.two,
  .grid.three,
  .kpi-grid,
  .metric-strip,
  .team-performance-cards.clean,
  .team-flow,
  .team-metric-list,
  .inline-filter,
  .form-grid,
  .form-grid.cols-4,
  .form-grid.cols-3,
  .form-grid.two,
  .form-grid.three,
  .form-actions,
  .input-detail-grid,
  .edit-detail-summary,
  .input-section-stats{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }
  .kpi,
  .metric-strip .mini-card{
    min-height:0!important;
    padding:12px!important;
    overflow:visible!important;
  }
  .kpi span,
  .metric-strip .mini-card span{
    display:block!important;
    margin:0 0 4px!important;
    font-size:12px!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .kpi strong,
  .metric-strip .mini-card strong{
    display:block!important;
    font-size:18px!important;
    line-height:1.18!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .kpi small{
    display:block!important;
    margin-top:5px!important;
    font-size:11px!important;
    line-height:1.35!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  .inline-filter{
    padding:10px!important;
    margin:0!important;
    border-radius:14px!important;
  }
  .inline-filter label,
  label{
    font-size:12px!important;
    line-height:1.25!important;
    gap:5px!important;
  }
  .inline-filter input,
  .inline-filter select,
  .inline-filter .button,
  .inline-filter button,
  input,
  select,
  textarea{
    width:100%!important;
    min-width:0!important;
    min-height:40px!important;
    height:auto!important;
    padding:8px 10px!important;
    border-radius:11px!important;
    font-size:13px!important;
    line-height:1.25!important;
  }
  textarea{min-height:72px!important;}
  .form-actions .button,
  .form-actions button,
  .button,
  button{
    width:100%!important;
    min-width:0!important;
    min-height:40px!important;
    padding:9px 11px!important;
    border-radius:12px!important;
    white-space:normal!important;
  }
  .actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
    width:100%!important;
  }
  .actions form,
  .actions .button,
  .actions button{
    width:100%!important;
    min-width:0!important;
  }

  .team-perf-card.clean{
    padding:14px!important;
    gap:10px!important;
    overflow:hidden!important;
  }
  .team-perf-head{
    grid-template-columns:minmax(0,1fr)!important;
    gap:9px!important;
  }
  .team-net-pill{
    justify-content:center!important;
    max-width:100%!important;
    width:100%!important;
    text-align:center!important;
  }
  .team-title{grid-template-columns:36px minmax(0,1fr)!important;}
  .team-avatar{width:36px!important;height:36px!important;min-width:36px!important;}
  .team-title strong,
  .team-title small{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .team-flow,
  .team-metric-list{
    gap:0!important;
    border-radius:13px!important;
    overflow:hidden!important;
  }
  .team-flow>div,
  .team-metric-list>div{
    grid-template-columns:minmax(0,1fr)!important;
    gap:4px!important;
    padding:10px!important;
  }
  .team-flow span,
  .team-metric-list span,
  .team-flow b,
  .team-metric-list b{
    text-align:left!important;
  }
  .team-flow b,
  .team-metric-list b{font-size:14px!important;}
  .team-settlement-note{font-size:12px!important;display:block!important;}

  /* Mobile tables: keep as scrollable tables, never compressed over each other. */
  .table-wrap,
  .table-wrap.responsive-cards,
  .finance-table-wrap,
  .summary-type-table{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    overflow:auto!important;
    overflow-x:auto!important;
    overflow-y:auto!important;
    border-radius:14px!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .table-wrap table,
  .table-wrap.responsive-cards table,
  .finance-table-wrap table,
  .summary-type-table table{
    display:table!important;
    width:max-content!important;
    min-width:640px!important;
    max-width:none!important;
    table-layout:auto!important;
  }
  .table-wrap thead,.table-wrap.responsive-cards thead{display:table-header-group!important;}
  .table-wrap tbody,.table-wrap.responsive-cards tbody{display:table-row-group!important;}
  .table-wrap tr,.table-wrap.responsive-cards tr{display:table-row!important;border-radius:0!important;box-shadow:none!important;margin:0!important;}
  .table-wrap th,.table-wrap td,
  .table-wrap.responsive-cards th,.table-wrap.responsive-cards td{
    display:table-cell!important;
    width:auto!important;
    padding:8px 9px!important;
    font-size:12px!important;
    line-height:1.3!important;
    border-bottom:1px solid #eef2f7!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    vertical-align:middle!important;
  }
  .table-wrap td::before,
  .table-wrap.responsive-cards td::before{
    display:none!important;
    content:none!important;
  }
  .table-wrap .actions,
  .table-wrap td.actions{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px!important;
    width:auto!important;
    min-width:150px!important;
  }
  .table-wrap td.actions .button,
  .table-wrap td.actions button,
  .table-wrap td.actions form{
    width:auto!important;
    min-height:32px!important;
    font-size:11px!important;
    padding:6px 8px!important;
  }

  .topbar{
    min-width:0!important;
    overflow:visible!important;
  }
  .topbar h1{
    max-width:100%!important;
    font-size:17px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

@media(max-width:420px){
  body.app-body .content{padding-left:8px!important;padding-right:8px!important;}
  .card{padding:10px!important;border-radius:15px!important;}
  .team-perf-card.clean{padding:12px!important;}
  .table-wrap table,
  .table-wrap.responsive-cards table,
  .finance-table-wrap table,
  .summary-type-table table{min-width:600px!important;}
}

/* V10.0.11 - mobile grid, minimal filters, normal-weight forms, account table without scroll. */
:root{
  --hsa-mobile-grid-gap:7px;
  --hsa-mobile-control-h:34px;
}

/* Form typography: labels and inputs should feel light/minimal, not bold. */
label,
.form-panel label,
.inline-filter label,
.quick-row label,
.debt-row label,
.operational-row label{
  font-weight:500!important;
  color:#475569!important;
}
input,
select,
textarea,
.form-panel input,
.form-panel select,
.form-panel textarea,
.inline-filter input,
.inline-filter select{
  font-weight:400!important;
}
input::placeholder,
textarea::placeholder{font-weight:400!important;color:#94a3b8!important;}

@media(max-width:760px){
  /* Requested: mobile grids stay side-by-side, max 4 cards per row. */
  .kpi-grid,
  .metric-strip,
  .input-section-stats,
  .edit-detail-summary,
  .summary-grid,
  .stats-grid,
  .mini-grid,
  .dashboard-mini-grid{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:var(--hsa-mobile-grid-gap)!important;
    align-items:stretch!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  /* Keep generic content grids readable while KPI/stat grids are 4 columns. */
  .grid.two,
  .grid.three,
  .dashboard-admin-grid,
  .team-performance-cards.clean{
    grid-template-columns:minmax(0,1fr)!important;
  }

  .kpi,
  .metric-strip .mini-card,
  .input-section-stats > *,
  .edit-detail-summary > *,
  .summary-grid > *,
  .stats-grid > *,
  .mini-grid > *,
  .dashboard-mini-grid > *{
    min-width:0!important;
    min-height:70px!important;
    padding:8px 6px!important;
    border-radius:14px!important;
    overflow:hidden!important;
    box-shadow:0 4px 12px rgba(15,23,42,.035)!important;
  }
  .kpi span,
  .metric-strip .mini-card span,
  .input-section-stats span,
  .edit-detail-summary span,
  .summary-grid span,
  .stats-grid span,
  .mini-grid span,
  .dashboard-mini-grid span{
    display:block!important;
    margin:0 0 4px!important;
    font-size:9.5px!important;
    line-height:1.15!important;
    font-weight:500!important;
    letter-spacing:0!important;
    text-transform:none!important;
    color:#64748b!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }
  .kpi strong,
  .metric-strip .mini-card strong,
  .input-section-stats strong,
  .edit-detail-summary strong,
  .summary-grid strong,
  .stats-grid strong,
  .mini-grid strong,
  .dashboard-mini-grid strong{
    display:block!important;
    margin:0!important;
    font-size:clamp(10px,2.8vw,13px)!important;
    line-height:1.12!important;
    font-weight:700!important;
    letter-spacing:-.02em!important;
    color:#0f172a!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .kpi small,
  .metric-strip .mini-card small,
  .input-section-stats small,
  .edit-detail-summary small,
  .summary-grid small,
  .stats-grid small,
  .mini-grid small,
  .dashboard-mini-grid small{
    display:none!important;
  }

  /* Minimal filter form: compact 2-column by default, no bold labels, buttons align cleanly. */
  .inline-filter{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    padding:9px!important;
    margin:0 0 10px!important;
    border-radius:14px!important;
    background:#fff!important;
    border:1px solid #e5e9f0!important;
    box-shadow:none!important;
  }
  .inline-filter label{
    min-width:0!important;
    gap:4px!important;
    font-size:10.5px!important;
    line-height:1.15!important;
    font-weight:500!important;
  }
  .inline-filter input,
  .inline-filter select,
  .inline-filter .button,
  .inline-filter button{
    min-width:0!important;
    width:100%!important;
    min-height:var(--hsa-mobile-control-h)!important;
    height:var(--hsa-mobile-control-h)!important;
    padding:5px 8px!important;
    border-radius:10px!important;
    font-size:12px!important;
    line-height:1.15!important;
    font-weight:400!important;
  }
  .inline-filter .button,
  .inline-filter button{
    font-weight:600!important;
  }
  .inline-filter noscript,
  .inline-filter .full,
  .inline-filter .span-2,
  .inline-filter [style*="grid-column"]{
    grid-column:1/-1!important;
  }

  /* All form inputs: lighter/minimal, not bold. */
  label,
  .form-panel label,
  .quick-row label,
  .debt-row label,
  .operational-row label{
    font-size:11px!important;
    line-height:1.18!important;
    font-weight:500!important;
  }
  input,
  select,
  textarea,
  .form-panel input,
  .form-panel select,
  .form-panel textarea,
  .quick-row input,
  .quick-row select,
  .debt-row input,
  .debt-row select{
    min-height:36px!important;
    padding:6px 9px!important;
    border-radius:10px!important;
    font-size:12px!important;
    line-height:1.2!important;
    font-weight:400!important;
  }
  textarea{min-height:68px!important;}

  /* Account page: profile table becomes compact key-value rows, no horizontal scroll. */
  .account-info-wrap,
  .account-info-wrap.table-wrap,
  .account-info-wrap.compact-table{
    overflow:visible!important;
    overflow-x:visible!important;
    border-radius:14px!important;
    background:#fff!important;
  }
  .account-info-wrap table,
  .account-info-wrap.compact-table table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    table-layout:auto!important;
    background:#fff!important;
  }
  .account-info-wrap tbody,
  .account-info-wrap tr{
    display:block!important;
    width:100%!important;
  }
  .account-info-wrap tr{
    display:grid!important;
    grid-template-columns:minmax(84px,34%) minmax(0,1fr)!important;
    gap:8px!important;
    align-items:start!important;
    padding:9px 10px!important;
    border-bottom:1px solid #eef2f7!important;
  }
  .account-info-wrap tr:last-child{border-bottom:0!important;}
  .account-info-wrap th,
  .account-info-wrap td{
    display:block!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    font-size:12px!important;
    line-height:1.35!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .account-info-wrap th{
    color:#64748b!important;
    font-weight:500!important;
    text-transform:none!important;
    letter-spacing:0!important;
  }
  .account-info-wrap td{
    color:#0f172a!important;
    font-weight:400!important;
    text-align:right!important;
  }
}

@media(max-width:430px){
  .kpi-grid,
  .metric-strip,
  .input-section-stats,
  .edit-detail-summary,
  .summary-grid,
  .stats-grid,
  .mini-grid,
  .dashboard-mini-grid{
    gap:6px!important;
  }
  .kpi,
  .metric-strip .mini-card,
  .input-section-stats > *,
  .edit-detail-summary > *,
  .summary-grid > *,
  .stats-grid > *,
  .mini-grid > *,
  .dashboard-mini-grid > *{
    min-height:64px!important;
    padding:7px 5px!important;
    border-radius:12px!important;
  }
  .inline-filter{gap:7px!important;padding:8px!important;}
  .account-info-wrap tr{grid-template-columns:minmax(76px,36%) minmax(0,1fr)!important;padding:8px 9px!important;}
  .account-info-wrap th,.account-info-wrap td{font-size:11.5px!important;}
}

@media(max-width:760px){
  /* Account login history: card rows, no table scroll on mobile. */
  .account-log-wrap,
  .account-log-wrap.table-wrap,
  .account-log-wrap.responsive-cards{
    overflow:visible!important;
    overflow-x:visible!important;
    border:0!important;
    background:transparent!important;
  }
  .account-log-wrap table,
  .account-log-wrap thead,
  .account-log-wrap tbody,
  .account-log-wrap tr,
  .account-log-wrap th,
  .account-log-wrap td{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  .account-log-wrap thead{display:none!important;}
  .account-log-wrap tbody{display:grid!important;gap:9px!important;}
  .account-log-wrap tr{
    display:grid!important;
    gap:0!important;
    border:1px solid #e5e9f0!important;
    border-radius:14px!important;
    background:#fff!important;
    overflow:hidden!important;
    box-shadow:none!important;
    margin:0!important;
  }
  .account-log-wrap td{
    display:grid!important;
    grid-template-columns:minmax(78px,32%) minmax(0,1fr)!important;
    gap:8px!important;
    align-items:start!important;
    padding:8px 10px!important;
    border:0!important;
    border-bottom:1px solid #eef2f7!important;
    font-size:11.5px!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .account-log-wrap td:last-child{border-bottom:0!important;}
  .account-log-wrap td::before{
    display:block!important;
    content:attr(data-label)!important;
    color:#64748b!important;
    font-size:10px!important;
    line-height:1.25!important;
    font-weight:500!important;
    text-transform:none!important;
    letter-spacing:0!important;
  }
  .account-log-wrap .device-log{font-size:10.5px!important;}
}

@media(max-width:760px){
  /* Dashboard team performance: metrics are side-by-side again, but capped and compact. */
  .team-flow,
  .team-metric-list{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    border:0!important;
    background:transparent!important;
    overflow:visible!important;
  }
  .team-flow>div,
  .team-metric-list>div{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:4px!important;
    min-width:0!important;
    padding:8px 7px!important;
    border:1px solid #eef2f7!important;
    border-radius:12px!important;
    background:#fff!important;
  }
  .team-flow span,
  .team-metric-list span{
    font-size:10px!important;
    line-height:1.15!important;
    font-weight:500!important;
    white-space:normal!important;
  }
  .team-flow span .bi,
  .team-metric-list span .bi{font-size:11px!important;}
  .team-flow b,
  .team-metric-list b{
    font-size:clamp(10px,2.9vw,12px)!important;
    line-height:1.12!important;
    text-align:left!important;
    overflow-wrap:anywhere!important;
  }
}
@media(min-width:431px) and (max-width:760px){
  .team-metric-list{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
}

/* V10.0.12 - Account mobile table hard-wrap + full-width account + minimal mobile forms. */
html,body{max-width:100%!important;overflow-x:hidden!important;}

@media(max-width:760px){
  body.app-body .content{
    overflow-x:hidden!important;
    max-width:100vw!important;
  }

  /* Akun Saya: full screen left-to-right on mobile, without horizontal scroll. */
  .account-page{
    width:calc(100% + 24px)!important;
    max-width:100vw!important;
    margin-left:-12px!important;
    margin-right:-12px!important;
    overflow-x:hidden!important;
  }
  .account-page .grid.two{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
  }
  .account-page .card{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    border-left:0!important;
    border-right:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    padding-left:12px!important;
    padding-right:12px!important;
    overflow:hidden!important;
  }
  .account-info-wrap,
  .account-info-wrap.table-wrap,
  .account-info-wrap.compact-table{
    width:calc(100% + 24px)!important;
    max-width:none!important;
    margin-left:-12px!important;
    margin-right:-12px!important;
    border-left:0!important;
    border-right:0!important;
    border-radius:0!important;
    overflow:visible!important;
    background:#fff!important;
  }
  .account-info-wrap table,
  .account-info-wrap tbody,
  .account-info-wrap tr{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  .account-info-wrap tr{
    grid-template-columns:minmax(86px,34%) minmax(0,1fr)!important;
    padding:9px 12px!important;
  }
  .account-info-wrap th,
  .account-info-wrap td{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
    font-weight:400!important;
  }
  .account-info-wrap th{font-weight:400!important;color:#64748b!important;}
  .account-info-wrap td{text-align:right!important;color:#0f172a!important;}

  /* Riwayat Login: force card layout and break long browser/user-agent strings. */
  .account-log-wrap,
  .account-log-wrap.table-wrap,
  .account-log-wrap.responsive-cards{
    display:block!important;
    width:calc(100% + 24px)!important;
    max-width:none!important;
    margin-left:-12px!important;
    margin-right:-12px!important;
    padding:0 12px 2px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    overflow:visible!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
  }
  .account-log-wrap table,
  .account-log-wrap thead,
  .account-log-wrap tbody,
  .account-log-wrap tr,
  .account-log-wrap th,
  .account-log-wrap td{
    min-width:0!important;
    max-width:100%!important;
    width:100%!important;
    box-sizing:border-box!important;
  }
  .account-log-wrap table{
    display:block!important;
    table-layout:fixed!important;
    overflow:visible!important;
  }
  .account-log-wrap thead{display:none!important;}
  .account-log-wrap tbody{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
    overflow:visible!important;
  }
  .account-log-wrap tr{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:0!important;
    margin:0!important;
    border:1px solid #e5e9f0!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:none!important;
    overflow:hidden!important;
  }
  .account-log-wrap td{
    display:grid!important;
    grid-template-columns:82px minmax(0,1fr)!important;
    align-items:start!important;
    gap:8px!important;
    padding:8px 10px!important;
    border:0!important;
    border-bottom:1px solid #eef2f7!important;
    white-space:normal!important;
    overflow:hidden!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
    font-size:11.5px!important;
    line-height:1.3!important;
  }
  .account-log-wrap td:last-child{border-bottom:0!important;}
  .account-log-wrap td::before{
    content:attr(data-label)!important;
    display:block!important;
    min-width:0!important;
    max-width:100%!important;
    color:#64748b!important;
    font-size:10px!important;
    line-height:1.25!important;
    font-weight:400!important;
    text-transform:none!important;
    letter-spacing:0!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .account-log-wrap td > *,
  .account-log-wrap .badge{
    min-width:0!important;
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    white-space:normal!important;
  }
  .account-log-wrap .device-log{
    overflow-wrap:anywhere!important;
    word-break:break-all!important;
    font-size:10.5px!important;
    line-height:1.35!important;
  }

  /* Minimal mobile forms: same visual language for kas, transfer, quick input, and filters. */
  .form-panel,
  .quick-form{
    gap:9px!important;
    padding:10px!important;
    border-radius:14px!important;
    background:#fff!important;
    border:1px solid #e8edf4!important;
    box-shadow:none!important;
  }
  .form-grid,
  .form-grid.cols-2,
  .form-grid.cols-3,
  .form-grid.cols-4,
  .quick-row.type-specific,
  .role-team .quick-row.type-specific,
  .debt-row,
  .operational-row{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .quick-row.type-specific,
  .role-team .quick-row.type-specific,
  .debt-row,
  .operational-row{
    padding:10px!important;
    border-radius:14px!important;
    border:1px solid #e8edf4!important;
    background:#fff!important;
    align-items:end!important;
    box-shadow:none!important;
  }
  .form-grid .span-2,
  .form-grid .span-3,
  .form-grid .span-4,
  .form-grid .wide,
  .quick-row.type-specific .wide,
  .quick-row.type-specific .full-line,
  .role-team .quick-row.type-specific .wide,
  .role-team .quick-row.type-specific .full-line,
  .debt-row .wide,
  .operational-row .wide,
  label.span-2,
  label.span-3,
  label.span-4,
  label.wide{
    grid-column:1/-1!important;
    max-width:100%!important;
  }
  .form-panel label,
  .quick-row label,
  .debt-row label,
  .operational-row label,
  .inline-filter label{
    min-width:0!important;
    max-width:100%!important;
    gap:4px!important;
    font-size:10.5px!important;
    line-height:1.15!important;
    font-weight:400!important;
    color:#64748b!important;
    text-transform:none!important;
    letter-spacing:0!important;
  }
  .quick-row label span,
  .debt-row label span,
  .operational-row label span,
  .upload-field > span:first-child{
    display:block!important;
    color:#64748b!important;
    font-size:10.5px!important;
    line-height:1.15!important;
    font-weight:400!important;
    text-transform:none!important;
    letter-spacing:0!important;
  }
  .form-panel input,
  .form-panel select,
  .form-panel textarea,
  .quick-row input,
  .quick-row select,
  .quick-row textarea,
  .debt-row input,
  .debt-row select,
  .debt-row textarea,
  .operational-row input,
  .operational-row select,
  .operational-row textarea,
  .inline-filter input,
  .inline-filter select{
    min-width:0!important;
    max-width:100%!important;
    width:100%!important;
    min-height:34px!important;
    height:34px!important;
    padding:6px 8px!important;
    border-radius:10px!important;
    border:1px solid #dbe3ee!important;
    background:#fff!important;
    color:#0f172a!important;
    font-size:12px!important;
    line-height:1.2!important;
    font-weight:400!important;
    box-shadow:none!important;
  }
  .form-panel textarea,
  .quick-row textarea,
  .debt-row textarea,
  .operational-row textarea{height:auto!important;min-height:62px!important;}
  .quick-row input[readonly],
  .form-panel input[readonly]{font-weight:400!important;background:#f8fafc!important;}
  .inline-filter{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    padding:8px!important;
    border-radius:14px!important;
    border:1px solid #e8edf4!important;
    background:#fff!important;
    box-shadow:none!important;
  }
  .inline-filter .button,
  .inline-filter button,
  .form-actions .button,
  .form-actions button,
  .sticky-actions .button,
  .sticky-actions button{
    min-height:34px!important;
    height:34px!important;
    padding:6px 10px!important;
    border-radius:10px!important;
    font-size:12px!important;
    line-height:1.15!important;
  }
  .sticky-actions{
    position:static!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    margin-top:8px!important;
    padding:8px!important;
    border-radius:14px!important;
    background:#fff!important;
    border:1px solid #e8edf4!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
  }
  .quick-type-tabs{gap:7px!important;}
  .quick-type-tabs .button{min-height:34px!important;padding:6px 8px!important;border-radius:10px!important;font-size:11.5px!important;}
  details.input-module>summary{padding:11px 12px!important;}
  .input-module .form-panel{padding:10px!important;}
}

@media(max-width:380px){
  .account-log-wrap td{grid-template-columns:1fr!important;gap:4px!important;}
  .form-grid,
  .form-grid.cols-2,
  .form-grid.cols-3,
  .form-grid.cols-4,
  .quick-row.type-specific,
  .role-team .quick-row.type-specific,
  .debt-row,
  .operational-row,
  .inline-filter,
  .sticky-actions{grid-template-columns:1fr!important;}
}


/* V10.1.0 stok final siap jual */
.inventory-final-card .logic-note,
.inventory-auto-card .logic-note{margin-top:12px}
.final-ready-field input{border-color:#22c55e;background:#f0fdf4;font-weight:800}
.inventory-form .form-grid label small{display:block;color:#64748b;margin-top:2px}


/* V10.2: minimal checkbox pill + stock shrinkage UI */
.pill,.inline-check,.mini-check{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:32px!important;
  padding:7px 10px!important;
  border:1px solid #dbe4f0!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#475569!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1.2!important;
  box-shadow:none!important;
}
.pill input[type="checkbox"],.inline-check input[type="checkbox"],.mini-check input[type="checkbox"],input[type="checkbox"]{
  width:15px!important;
  height:15px!important;
  min-width:15px!important;
  margin:0!important;
  accent-color:#2563eb!important;
}
.stock-split-form{display:grid!important;gap:18px!important;background:#fbfdff!important;}
.stock-form-section{border:1px solid #e5edf7!important;border-radius:20px!important;background:#fff!important;padding:16px!important;display:grid!important;gap:14px!important;}
.stock-section-title{display:flex!important;align-items:flex-start!important;gap:12px!important;}
.stock-section-title>span{width:30px!important;height:30px!important;border-radius:11px!important;background:#eff6ff!important;color:#2563eb!important;display:grid!important;place-items:center!important;font-weight:950!important;flex:0 0 30px!important;}
.stock-section-title strong{display:block!important;font-size:14px!important;color:#0f172a!important;}
.stock-section-title small{display:block!important;color:#64748b!important;font-size:12px!important;line-height:1.4!important;margin-top:2px!important;}
.shrinkage-section{background:linear-gradient(180deg,#fff,#fff7ed)!important;border-color:#fed7aa!important;}
.result-section{background:linear-gradient(180deg,#fff,#f0fdf4)!important;border-color:#bbf7d0!important;}
.readonly-calc{background:#f8fafc!important;border-color:#dbe4f0!important;color:#0f172a!important;font-weight:900!important;}
.final-value{background:#ecfdf5!important;border-color:#86efac!important;color:#047857!important;font-size:16px!important;}
.final-ready-field span,.final-ready-field{color:#047857!important;}
.inventory-form .form-grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
@media(max-width:980px){.inventory-form .form-grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))!important;}}
@media(max-width:640px){.inventory-form .form-grid.cols-4{grid-template-columns:1fr!important}.stock-form-section{padding:13px!important;border-radius:16px!important}.stock-section-title>span{width:26px!important;height:26px!important;flex-basis:26px!important}.pill,.inline-check,.mini-check{width:100%!important}}

/* V10.2.3 - stok lot pembelian & mobile friendly inventory */
.inventory-kpi-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}
.compact-filter{margin:12px 0 16px;}
.lot-context-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:12px 0 16px;}
.lot-context-grid>div{border:1px solid rgba(148,163,184,.25);border-radius:16px;padding:12px;background:rgba(255,255,255,.7);}
.lot-context-grid span{display:block;font-size:.78rem;color:#64748b;margin-bottom:4px;}
.lot-context-grid strong{font-size:.98rem;color:#0f172a;word-break:break-word;}
.inventory-lot-wrap table td,.inventory-history-wrap table td{vertical-align:top;}
.inventory-lot-table small,.inventory-history-wrap small{color:#64748b;line-height:1.35;}
@media (max-width: 760px){
  .inventory-lot-wrap,.inventory-history-wrap{overflow:visible;}
  table.responsive-table thead{display:none;}
  table.responsive-table,table.responsive-table tbody,table.responsive-table tr,table.responsive-table td{display:block;width:100%;}
  table.responsive-table tr{border:1px solid rgba(148,163,184,.28);border-radius:18px;margin:0 0 12px;background:#fff;box-shadow:0 10px 28px rgba(15,23,42,.06);overflow:hidden;}
  table.responsive-table td{border:0!important;border-bottom:1px solid rgba(148,163,184,.16)!important;padding:10px 12px!important;}
  table.responsive-table td:last-child{border-bottom:0!important;}
  table.responsive-table td::before{content:attr(data-label);display:block;font-size:.72rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:#64748b;margin-bottom:4px;}
  .inventory-lot-table .actions,.inventory-history-wrap .actions{display:flex;gap:8px;flex-wrap:wrap;}
  .inventory-form .form-grid.cols-4,.compact-filter .form-grid.cols-4{grid-template-columns:1fr!important;}
  .stock-section-title{align-items:flex-start;}
  .stock-section-title span{flex:0 0 auto;}
}

/* V10.2.6 - Inventory akumulasi gudang, HPP, dan susut pengiriman per truk */
.inventory-hpp-wrap table th,
.inventory-hpp-wrap table td{vertical-align:top;}
.inventory-edit-grid{align-items:start;}
.inventory-adjustment-card .form-grid,
.inventory-form-card .form-grid{gap:14px;}
.inventory-shrinkage-list-card .actions{white-space:nowrap;}
@media (max-width: 820px){
  .inventory-hpp-table td[data-label] strong{font-size:1.02rem;}
  .inventory-edit-grid{grid-template-columns:1fr!important;}
  .inventory-final-card .logic-note{font-size:.92rem;line-height:1.45;}
  .inventory-hpp-wrap .responsive-table td,
  .inventory-shrinkage-wrap .responsive-table td,
  .inventory-history-wrap .responsive-table td{display:grid;grid-template-columns:minmax(118px,42%) 1fr;gap:10px;align-items:start;}
  .inventory-hpp-wrap .responsive-table td::before,
  .inventory-shrinkage-wrap .responsive-table td::before,
  .inventory-history-wrap .responsive-table td::before{content:attr(data-label);font-weight:700;color:var(--muted);}
}

/* V10.2.7 - rincian biaya operasional pengiriman/gudang */
.cost-detail-box {
  border: 1px solid rgba(15, 23, 42, .12);
  border-radius: 16px;
  padding: 14px;
  background: linear-gradient(180deg, rgba(248,250,252,.95), rgba(255,255,255,.95));
  margin: 4px 0;
}
.cost-detail-box legend {
  font-weight: 800;
  padding: 0 8px;
  color: #0f172a;
}
.cost-detail-note {
  margin: 0 0 10px;
  font-size: 12px;
}
.cost-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 10px;
}
.cost-detail-grid label {
  min-width: 0;
}
.cost-detail-grid input {
  width: 100%;
}
@media (max-width: 900px) {
  .cost-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .cost-detail-box { padding: 12px; border-radius: 14px; }
  .cost-detail-grid { grid-template-columns: 1fr; }
}

/* V10.2.13 - rincian biaya volume x harga satuan */
.cost-detail-grid-v2 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.cost-detail-line {
  display: grid;
  grid-template-columns: minmax(180px, 1.4fr) repeat(4, minmax(120px, 1fr));
  gap: 10px;
  align-items: end;
  padding: 10px;
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: 14px;
  background: rgba(255,255,255,.78);
}
.cost-detail-line .cost-detail-label {
  align-self: center;
  display: flex;
  flex-direction: column;
  gap: 3px;
  color: #0f172a;
}
.cost-detail-line .cost-detail-label strong {
  font-size: 13px;
  line-height: 1.25;
}
.cost-detail-line label {
  margin: 0;
}
.cost-detail-line input[readonly] {
  background: #f8fafc;
  font-weight: 800;
}
@media (max-width: 980px) {
  .cost-detail-line {
    grid-template-columns: minmax(180px, 1fr) repeat(2, minmax(120px, 1fr));
  }
}
@media (max-width: 640px) {
  .cost-detail-line {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .cost-detail-line .cost-detail-label {
    border-bottom: 1px solid rgba(15, 23, 42, .08);
    padding-bottom: 6px;
  }
}

/* V10.2.20 - biaya operasional tambahan manual */
.manual-cost-section {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed rgba(15, 23, 42, .18);
}
.manual-cost-head {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cost-detail-line.manual-cost-line {
  grid-template-columns: minmax(200px, 1.4fr) repeat(4, minmax(115px, 1fr)) auto;
  background: rgba(239, 246, 255, .55);
}
.cost-detail-line.manual-cost-line .manual-cost-remove {
  align-self: end;
  min-height: 40px;
}
.add-manual-cost {
  margin-top: 10px;
}
@media (max-width: 980px) {
  .cost-detail-line.manual-cost-line { grid-template-columns: minmax(180px, 1fr) repeat(2, minmax(120px, 1fr)); }
  .cost-detail-line.manual-cost-line .manual-cost-remove { width: fit-content; }
}
@media (max-width: 640px) {
  .cost-detail-line.manual-cost-line { grid-template-columns: 1fr; }
  .cost-detail-line.manual-cost-line .manual-cost-remove { width: 100%; }
}

/* V10.2.25 - ringkasan biaya pengiriman dipisah agar tidak langsung tercampur menjadi HPP */
.cost-breakdown-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, .35);
  border-radius: 14px;
  background: rgba(248, 250, 252, .78);
}
.cost-breakdown-summary > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(15,23,42,.04);
}
.cost-breakdown-summary span { color: #64748b; font-size: .82rem; }
.cost-breakdown-summary strong { font-size: 1rem; color: #0f172a; }

/* V10.2.26 - tabel total pengiriman dan kotak rincian biaya detail input */
.shipment-total-table-wrap {
  width: 100%;
  min-width: 260px;
}
.shipment-total-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, .35);
  border-radius: 12px;
  background: #fff;
  font-size: .86rem;
}
.shipment-total-table th,
.shipment-total-table td {
  padding: 8px 10px;
  border-bottom: 1px solid rgba(226, 232, 240, .9);
  vertical-align: top;
}
.shipment-total-table th {
  background: rgba(241, 245, 249, .95);
  color: #475569;
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  white-space: nowrap;
}
.shipment-total-table tr:last-child td {
  border-bottom: 0;
  background: rgba(239, 246, 255, .75);
}
.shipment-total-table td:first-child {
  font-weight: 700;
  color: #0f172a;
}
.shipment-total-table td:nth-child(2) small {
  color: #64748b;
  line-height: 1.35;
}
.shipment-total-table .money-cell {
  text-align: right;
  white-space: nowrap;
}
.shipment-total-mini .shipment-total-table {
  font-size: .78rem;
}
.shipment-total-mini .shipment-total-table th,
.shipment-total-mini .shipment-total-table td {
  padding: 6px 8px;
}
.shipment-total-note {
  display: block;
  margin-top: 6px;
  line-height: 1.35;
}
.shipment-summary-cell {
  grid-column: 1 / -1;
}
.shipment-cost-detail-box {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid rgba(148, 163, 184, .32);
  border-radius: 16px;
  background: rgba(248, 250, 252, .82);
}
.shipment-cost-detail-box h4 {
  margin: 0 0 10px;
  font-size: .98rem;
  color: #0f172a;
}
.shipment-cost-detail-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid rgba(203, 213, 225, .75);
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}
.shipment-cost-detail-table th,
.shipment-cost-detail-table td {
  padding: 9px 10px;
  border-bottom: 1px solid rgba(226, 232, 240, .9);
  vertical-align: top;
}
.shipment-cost-detail-table th {
  background: rgba(241, 245, 249, .95);
  color: #475569;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.shipment-cost-detail-table tfoot th {
  background: rgba(239, 246, 255, .85);
  color: #0f172a;
  border-bottom: 0;
}
.shipment-cost-detail-table tbody tr:last-child td {
  border-bottom: 0;
}
@media (max-width: 760px) {
  .shipment-total-table,
  .shipment-cost-detail-table {
    font-size: .78rem;
  }
  .shipment-total-table th,
  .shipment-total-table td,
  .shipment-cost-detail-table th,
  .shipment-cost-detail-table td {
    padding: 7px 6px;
  }
  .shipment-total-table .money-cell,
  .shipment-cost-detail-table .money-cell {
    white-space: normal;
  }
}

/* V10.2.27 - professional UI polish + horizontal shipment summary matrix */
:root{
  --ui-soft-border: rgba(148, 163, 184, .30);
  --ui-soft-bg: #f8fafc;
  --ui-card-shadow: 0 16px 42px rgba(15, 23, 42, .07);
}
.card,
.form-panel,
details.input-module,
.input-detail-card,
.shipment-cost-detail-box,
.cost-detail-box{
  border-color: var(--ui-soft-border)!important;
  box-shadow: var(--ui-card-shadow)!important;
}
.card-head h2,
.input-section-title h2,
.input-detail-head h3{
  letter-spacing: -.01em!important;
}
.table-wrap{
  background:#fff!important;
  border-color:var(--ui-soft-border)!important;
  box-shadow:0 10px 28px rgba(15,23,42,.045)!important;
}
.table-wrap thead th{
  background:linear-gradient(180deg,#f8fafc,#f1f5f9)!important;
  color:#334155!important;
  font-weight:900!important;
}
.table-wrap tbody tr:hover td{
  background:#fbfdff!important;
}
.money-cell,
.num-cell,
.total-cell{
  font-variant-numeric: tabular-nums!important;
}
.total-cell{
  min-width:420px!important;
}

/* Summary pengiriman sekarang horizontal ke samping, bukan daftar vertikal. */
.shipment-total-table-wrap{
  width:100%!important;
  min-width:0!important;
  padding:10px!important;
  border:1px solid rgba(148,163,184,.28)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
  box-shadow:0 10px 26px rgba(15,23,42,.055)!important;
}
.shipment-total-scroll{
  width:100%!important;
  max-width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  border-radius:14px!important;
  border:1px solid rgba(203,213,225,.75)!important;
  background:#fff!important;
}
.shipment-total-table.shipment-total-matrix{
  width:100%!important;
  min-width:1080px!important;
  border:0!important;
  border-collapse:separate!important;
  border-spacing:0!important;
  table-layout:fixed!important;
  background:#fff!important;
  font-size:.82rem!important;
}
.shipment-total-table.shipment-total-matrix th,
.shipment-total-table.shipment-total-matrix td{
  border:0!important;
  border-right:1px solid rgba(226,232,240,.95)!important;
  padding:10px 12px!important;
  vertical-align:middle!important;
  text-align:right!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.shipment-total-table.shipment-total-matrix th:last-child,
.shipment-total-table.shipment-total-matrix td:last-child{border-right:0!important;}
.shipment-total-table.shipment-total-matrix th{
  background:linear-gradient(180deg,#f8fafc,#eef2ff)!important;
  color:#334155!important;
  text-transform:none!important;
  letter-spacing:0!important;
  font-size:.76rem!important;
  line-height:1.2!important;
}
.shipment-total-table.shipment-total-matrix th span{
  display:block!important;
  font-weight:900!important;
  color:#0f172a!important;
}
.shipment-total-table.shipment-total-matrix th small{
  display:block!important;
  margin-top:3px!important;
  color:#64748b!important;
  font-weight:700!important;
  font-size:.68rem!important;
}
.shipment-total-table.shipment-total-matrix td{
  background:#fff!important;
  font-size:.86rem!important;
  color:#0f172a!important;
}
.shipment-total-table.shipment-total-matrix td strong{
  display:block!important;
  white-space:nowrap!important;
  font-weight:900!important;
}
.shipment-total-table.shipment-total-matrix .shipment-total-goods,
.shipment-total-table.shipment-total-matrix .shipment-total-ops,
.shipment-total-table.shipment-total-matrix .shipment-total-grand{
  background:#f8fbff!important;
}
.shipment-total-table.shipment-total-matrix td.shipment-total-grand strong{
  color:#1d4ed8!important;
  font-size:.92rem!important;
}
.shipment-total-table.shipment-total-matrix td.shipment-total-pph strong,
.shipment-total-table.shipment-total-matrix td.shipment-total-insurance strong,
.shipment-total-table.shipment-total-matrix td.shipment-total-other strong{
  color:#334155!important;
}
.shipment-total-note{
  display:block!important;
  margin-top:8px!important;
  line-height:1.45!important;
  color:#64748b!important;
  font-size:.76rem!important;
}
.shipment-total-mini{
  max-width:680px!important;
  min-width:420px!important;
  padding:8px!important;
}
.shipment-total-mini .shipment-total-table.shipment-total-matrix{
  min-width:920px!important;
  font-size:.76rem!important;
}
.shipment-total-mini .shipment-total-table.shipment-total-matrix th,
.shipment-total-mini .shipment-total-table.shipment-total-matrix td{
  padding:8px 9px!important;
}
.shipment-total-card,
.shipment-total-modal{
  max-width:100%!important;
  padding:12px!important;
}
.shipment-total-card .shipment-total-table.shipment-total-matrix,
.shipment-total-modal .shipment-total-table.shipment-total-matrix{
  min-width:1100px!important;
}

/* Detail biaya pengiriman dibuat seperti tabel profesional dan konsisten. */
.shipment-cost-detail-box{
  margin-top:14px!important;
  padding:14px!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
}
.shipment-cost-detail-box h4{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0 0 12px!important;
  font-size:1rem!important;
  font-weight:900!important;
}
.shipment-cost-detail-box h4::before{
  content:'↳';
  display:inline-grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:10px;
  background:#eaf1ff;
  color:#2563eb;
  font-weight:900;
}
.shipment-cost-detail-box .compact-table-wrap,
.shipment-cost-detail-box .table-wrap{
  border-radius:14px!important;
  box-shadow:none!important;
  overflow-x:auto!important;
}
.shipment-cost-detail-table{
  min-width:760px!important;
  table-layout:fixed!important;
  border:0!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}
.shipment-cost-detail-table th,
.shipment-cost-detail-table td{
  border-right:1px solid rgba(226,232,240,.95)!important;
  border-bottom:1px solid rgba(226,232,240,.95)!important;
  padding:10px 12px!important;
}
.shipment-cost-detail-table th:last-child,
.shipment-cost-detail-table td:last-child{border-right:0!important;}
.shipment-cost-detail-table thead th{
  background:linear-gradient(180deg,#f8fafc,#f1f5f9)!important;
  color:#334155!important;
  font-weight:900!important;
}
.shipment-cost-detail-table tbody td:first-child{
  font-weight:800!important;
  color:#0f172a!important;
}
.shipment-cost-detail-table tfoot th{
  background:#eff6ff!important;
  color:#0f172a!important;
  font-weight:900!important;
}
.shipment-cost-detail-table tfoot th:last-child{
  color:#1d4ed8!important;
}

/* Form rincian biaya: lebih rapi, sejajar, dan mudah dibaca. */
.cost-detail-box{
  border-radius:20px!important;
  padding:16px!important;
  background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
}
.cost-detail-box legend{
  font-size:.95rem!important;
  font-weight:900!important;
  color:#0f172a!important;
}
.cost-detail-line{
  border-radius:16px!important;
  border-color:rgba(148,163,184,.28)!important;
  background:#fff!important;
  box-shadow:0 5px 14px rgba(15,23,42,.035)!important;
}
.cost-detail-line.manual-cost-line{
  background:linear-gradient(180deg,#f8fbff,#ffffff)!important;
}
.cost-breakdown-summary{
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr))!important;
  background:linear-gradient(180deg,#f8fafc,#fff)!important;
  border-radius:18px!important;
  border-color:rgba(148,163,184,.30)!important;
}
.cost-breakdown-summary > div{
  border:1px solid rgba(226,232,240,.95)!important;
  box-shadow:0 8px 18px rgba(15,23,42,.04)!important;
}

/* Detail input dan modal dibuat lebih seragam supaya tidak terasa tambal sulam. */
.input-detail-grid,
.input-detail-modal-grid{
  gap:12px!important;
}
.input-detail-grid>div,
.input-detail-modal-grid>div{
  background:linear-gradient(180deg,#ffffff,#f8fafc)!important;
  border-color:rgba(148,163,184,.28)!important;
  border-radius:16px!important;
  box-shadow:0 8px 18px rgba(15,23,42,.035)!important;
}
.input-detail-grid>div.shipment-summary-cell,
.input-detail-modal-grid>div.shipment-summary-cell{
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.input-detail-card{
  background:linear-gradient(180deg,#ffffff,#fbfdff)!important;
}
.input-detail-head{
  padding-bottom:12px!important;
  border-bottom:1px solid rgba(226,232,240,.9)!important;
}
.input-detail-summary .pill{
  background:#f8fafc!important;
  border:1px solid rgba(226,232,240,.95)!important;
}

/* Tombol dan kolom aksi lebih stabil di tabel panjang. */
.row-actions-final,
.actions,
.detail-actions,
.form-actions{
  gap:8px!important;
}
.action-btn-final,
.button,
button{
  letter-spacing:.005em!important;
}
.actions-cell-final,
td.actions,
.table-wrap td.actions{
  vertical-align:top!important;
}

@media(max-width:1180px){
  .total-cell{min-width:360px!important;}
  .shipment-total-mini{max-width:100%!important;min-width:0!important;}
}
@media(max-width:760px){
  .shipment-total-table-wrap{padding:8px!important;border-radius:16px!important;}
  .shipment-total-table.shipment-total-matrix{min-width:940px!important;}
  .shipment-total-mini .shipment-total-table.shipment-total-matrix{min-width:860px!important;}
  .shipment-total-table.shipment-total-matrix th,
  .shipment-total-table.shipment-total-matrix td{padding:8px!important;}
  .shipment-cost-detail-table{min-width:720px!important;}
  .shipment-cost-detail-box{padding:12px!important;}
  .total-cell{min-width:0!important;}
}

/* V10.2.27 - profesionalisasi ringkasan pengiriman horizontal */
.shipment-total-table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(203, 213, 225, .72);
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  box-shadow: 0 10px 26px rgba(15, 23, 42, .06);
}
.shipment-total-scroll {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  border-radius: 14px;
  border: 1px solid rgba(226, 232, 240, .95);
  background: #ffffff;
}
.shipment-total-table-horizontal {
  width: 100%;
  min-width: 1120px !important;
  max-width: none !important;
  table-layout: fixed;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-variant-numeric: tabular-nums;
}
.shipment-total-table-horizontal th,
.shipment-total-table-horizontal td {
  border-right: 1px solid rgba(226, 232, 240, .95);
  border-bottom: 0 !important;
  padding: 10px 12px !important;
  text-align: left;
  vertical-align: top;
  overflow-wrap: normal;
  word-break: normal;
}
.shipment-total-table-horizontal th:last-child,
.shipment-total-table-horizontal td:last-child {
  border-right: 0;
}
.shipment-total-table-horizontal thead th {
  background: #f8fafc !important;
  color: #334155 !important;
  letter-spacing: .035em;
  text-transform: uppercase;
  line-height: 1.25;
}
.shipment-total-table-horizontal thead th span {
  display: block;
  font-size: .72rem;
  font-weight: 800;
  white-space: normal;
}
.shipment-total-table-horizontal thead th small {
  display: block;
  margin-top: 4px;
  color: #64748b;
  font-size: .68rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.shipment-total-table-horizontal tbody td {
  background: #ffffff !important;
}
.shipment-total-value strong {
  display: block;
  color: #0f172a;
  font-size: .92rem;
  font-weight: 800 !important;
  line-height: 1.25;
  text-align: right;
  white-space: nowrap;
}
.shipment-total-value.is-primary strong { color: #1d4ed8; }
.shipment-total-value.is-warning strong { color: #b45309; }
.shipment-total-value.is-danger strong { color: #be123c; }
.shipment-total-value.is-success strong { color: #047857; }
.shipment-total-value.is-grand {
  background: #eff6ff !important;
  box-shadow: inset 0 0 0 999px rgba(37, 99, 235, .055);
}
.shipment-total-value.is-grand strong {
  color: #1e3a8a;
  font-size: .98rem;
}
.shipment-total-note {
  display: block;
  margin-top: 8px;
  color: #64748b;
  font-size: .76rem;
  line-height: 1.42;
}
.shipment-total-mini {
  padding: 8px;
  box-shadow: none;
  border-radius: 14px;
}
.shipment-total-mini .shipment-total-scroll {
  max-width: 520px;
}
.shipment-total-mini .shipment-total-table-horizontal {
  min-width: 980px !important;
}
.shipment-total-mini .shipment-total-table-horizontal th,
.shipment-total-mini .shipment-total-table-horizontal td {
  padding: 8px 9px !important;
}
.shipment-total-mini .shipment-total-table-horizontal thead th span {
  font-size: .65rem;
}
.shipment-total-mini .shipment-total-table-horizontal thead th small {
  font-size: .62rem;
}
.shipment-total-mini .shipment-total-value strong {
  font-size: .78rem;
}
.shipment-total-card .shipment-total-scroll,
.shipment-total-modal .shipment-total-scroll {
  max-width: 100%;
}
.shipment-summary-cell {
  min-width: 0;
  width: 100%;
}
.transaction-table-final col.col-total {
  width: 520px !important;
}
.transaction-table-final {
  width: 2100px !important;
  min-width: 2100px !important;
}
.transaction-table-final .total-cell {
  min-width: 420px !important;
  max-width: none !important;
  width: 520px !important;
  padding: 8px !important;
  white-space: normal !important;
  overflow: visible !important;
  text-align: left !important;
}
.transaction-table-final .total-cell > span {
  display: inline-block;
  width: 100%;
  text-align: right;
}
.transaction-table-scroll {
  scrollbar-gutter: stable both-edges;
}
.shipment-cost-detail-box {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid rgba(203, 213, 225, .72);
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  box-shadow: 0 10px 26px rgba(15, 23, 42, .05);
}
.shipment-cost-detail-box h4 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: #0f172a;
  font-size: 1rem;
  font-weight: 800;
}
.shipment-cost-detail-box h4::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: #2563eb;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, .12);
}
.shipment-cost-detail-table {
  min-width: 760px !important;
  max-width: none !important;
  table-layout: fixed;
  border: 1px solid rgba(226, 232, 240, .95) !important;
  border-radius: 14px;
  overflow: hidden;
  font-variant-numeric: tabular-nums;
}
.shipment-cost-detail-table th,
.shipment-cost-detail-table td {
  padding: 10px 12px !important;
  vertical-align: middle;
}
.shipment-cost-detail-table th {
  background: #f8fafc !important;
  color: #334155 !important;
  font-weight: 800;
}
.shipment-cost-detail-table td.money-cell,
.shipment-cost-detail-table td.num-cell,
.shipment-cost-detail-table tfoot th.money-cell {
  text-align: right;
  white-space: nowrap;
}
.shipment-cost-detail-table tfoot th {
  background: #eff6ff !important;
  font-size: .88rem;
  font-weight: 800;
}
.input-detail-card {
  border-color: rgba(203, 213, 225, .78) !important;
  box-shadow: 0 14px 36px rgba(15, 23, 42, .06) !important;
}
.input-detail-grid > .wide.shipment-summary-cell {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.input-detail-grid > div:not(.wide) {
  border-radius: 14px;
}
.table-wrap:has(.shipment-cost-detail-table),
.table-wrap:has(.shipment-total-table-horizontal) {
  border: 0 !important;
  border-radius: 14px !important;
}
@media (max-width: 980px) {
  .transaction-table-final {
    width: 2100px !important;
    min-width: 2100px !important;
  }
  .transaction-table-final col.col-total {
    width: 500px !important;
  }
  .shipment-total-table-wrap {
    padding: 8px;
  }
  .shipment-total-table-horizontal {
    min-width: 1040px !important;
  }
  .shipment-total-mini .shipment-total-scroll {
    max-width: 480px;
  }
}
@media (max-width: 760px) {
  .shipment-total-table-wrap {
    border-radius: 14px;
  }
  .shipment-total-scroll {
    border-radius: 12px;
  }
  .shipment-total-table-horizontal {
    min-width: 960px !important;
  }
  .shipment-total-mini .shipment-total-scroll {
    max-width: 430px;
  }
  .shipment-total-table-horizontal th,
  .shipment-total-table-horizontal td {
    padding: 8px 9px !important;
  }
  .shipment-total-value strong {
    font-size: .8rem;
  }
  .shipment-cost-detail-box {
    padding: 10px;
    border-radius: 16px;
  }
  .shipment-cost-detail-table {
    min-width: 720px !important;
  }
}
@media (max-width: 480px) {
  .shipment-total-mini .shipment-total-scroll,
  .shipment-total-card .shipment-total-scroll,
  .shipment-total-modal .shipment-total-scroll {
    max-width: calc(100vw - 64px);
  }
  .shipment-total-note {
    font-size: .72rem;
  }
}

/* V10.2.28 - inventory akumulasi + per tim, transaction total UI refinement */
.inventory-scope-note{
  display:block;
  margin-top:6px;
  color:#64748b;
  font-size:.86rem;
  line-height:1.45;
}
.inventory-stock-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin:12px 0 10px;
  padding:10px 12px;
  border:1px solid rgba(203,213,225,.72);
  border-radius:16px;
  background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);
}
.inventory-stock-section-head small{
  color:#64748b;
  font-weight:600;
}
.inventory-per-team-card{
  border-color:rgba(37,99,235,.18)!important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)!important;
}
.inventory-stock-accum-table{
  min-width:1220px!important;
  table-layout:fixed;
}
.inventory-stock-accum-table th:first-child,
.inventory-stock-accum-table td:first-child{
  min-width:180px;
}
.inventory-stock-accum-table td strong{
  letter-spacing:-.01em;
}
.inventory-stock-accum-table td small{
  color:#64748b;
  line-height:1.45;
}
.inventory-final-card .card-head .badge.success{
  max-width:100%;
  white-space:normal;
  text-align:right;
  line-height:1.35;
}
.shipment-total-table-grouped .shipment-total-groups th{
  text-align:center!important;
  background:#eef6ff!important;
  color:#1e3a8a!important;
  font-size:.72rem!important;
  font-weight:900!important;
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
  border-bottom:1px solid rgba(191,219,254,.9)!important;
  padding:7px 8px!important;
}
.shipment-total-table-grouped thead tr:nth-child(2) th{
  background:#f8fafc!important;
}
.shipment-total-mini{
  padding:7px!important;
  border-radius:15px!important;
}
.shipment-total-mini .shipment-total-scroll{
  max-width:100%!important;
  border-radius:12px!important;
}
.shipment-total-mini .shipment-total-table-horizontal{
  min-width:850px!important;
}
.shipment-total-mini .shipment-total-table-horizontal th,
.shipment-total-mini .shipment-total-table-horizontal td{
  padding:7px 8px!important;
}
.shipment-total-mini .shipment-total-table-horizontal thead th span{
  font-size:.62rem!important;
  line-height:1.18!important;
}
.shipment-total-mini .shipment-total-table-horizontal thead th small{
  font-size:.58rem!important;
  margin-top:2px!important;
}
.shipment-total-mini .shipment-total-value strong{
  font-size:.72rem!important;
  line-height:1.2!important;
}
.shipment-total-mini .shipment-total-note{
  display:block;
  margin-top:6px;
  font-size:.68rem;
}
.transaction-table-final col.col-total{
  width:600px!important;
}
.transaction-table-final .total-cell{
  width:600px!important;
  min-width:520px!important;
  padding:7px!important;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
}
.transaction-table-final .total-cell .shipment-total-table-wrap{
  box-shadow:none;
  border-color:rgba(203,213,225,.62);
}
.transaction-table-final .total-cell .shipment-total-value.is-grand{
  background:#eff6ff!important;
}
@media (max-width:980px){
  .inventory-stock-accum-table{min-width:1120px!important;}
  .transaction-table-final col.col-total{width:560px!important;}
  .transaction-table-final .total-cell{width:560px!important;min-width:500px!important;}
  .shipment-total-mini .shipment-total-table-horizontal{min-width:820px!important;}
}
@media (max-width:760px){
  .inventory-stock-section-head{align-items:flex-start;}
  .inventory-final-card .card-head .badge.success{text-align:left;}
  .inventory-stock-accum-table{min-width:1000px!important;}
  .shipment-total-mini .shipment-total-table-horizontal{min-width:790px!important;}
}

/* V10.2.30 - inventory master tabs per produk */
.inventory-product-tabs-card{
  position:sticky;
  top:72px;
  z-index:6;
  border-color:rgba(37,99,235,.18)!important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)!important;
}
.inventory-master-tabs{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:10px;
  margin-top:14px;
}
.inventory-master-tab{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:58px;
  padding:12px 14px;
  border:1px solid rgba(148,163,184,.32);
  border-radius:18px;
  background:#fff;
  color:#0f172a;
  text-decoration:none!important;
  box-shadow:0 10px 24px rgba(15,23,42,.05);
  transition:.18s ease;
}
.inventory-master-tab:hover{
  transform:translateY(-1px);
  border-color:rgba(37,99,235,.38);
}
.inventory-master-tab.active{
  background:linear-gradient(135deg,#1d4ed8 0%,#2563eb 100%);
  color:#fff;
  border-color:transparent;
  box-shadow:0 16px 34px rgba(37,99,235,.24);
}
.inventory-master-tab span{
  font-weight:950;
  letter-spacing:-.01em;
}
.inventory-master-tab small{
  color:#64748b;
  font-weight:800;
  white-space:nowrap;
}
.inventory-master-tab.active small{color:rgba(255,255,255,.82);}
.inventory-sub-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.inventory-sub-tabs a{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:8px 11px;
  border:1px solid rgba(203,213,225,.75);
  border-radius:999px;
  background:#fff;
  color:#334155;
  text-decoration:none!important;
  font-size:.82rem;
  font-weight:850;
}
.inventory-sub-tabs a:hover{border-color:#2563eb;color:#1d4ed8;}
.inventory-product-kpi-grid{grid-template-columns:repeat(auto-fit,minmax(165px,1fr));}
.inventory-product-tabs-card,
#inventoryProductHpp,
#inventoryShrinkageForm,
#inventoryAdjustmentForm,
#inventoryShrinkageList,
#inventoryHistoryGrid,
#inventoryAdjustmentHistory{scroll-margin-top:160px;}
@media(max-width:820px){
  .inventory-product-tabs-card{position:static;top:auto;}
  .inventory-master-tabs{grid-template-columns:1fr 1fr;}
  .inventory-master-tab{display:grid;gap:3px;min-height:54px;align-content:center;}
  .inventory-master-tab small{white-space:normal;font-size:.72rem;}
  .inventory-sub-tabs{overflow:auto;flex-wrap:nowrap;padding-bottom:2px;}
  .inventory-sub-tabs a{white-space:nowrap;}
}
@media(max-width:520px){.inventory-master-tabs{grid-template-columns:1fr;}}


/* V10.2.31 - inventory tabs minimal seperti halaman master */
.page-inventory .inventory-tabs-minimal{
  position:relative!important;
  top:auto!important;
  z-index:1!important;
  border:1px solid var(--v1016-border,#e2e8f0)!important;
  background:#fff!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.page-inventory .inventory-tabs-minimal .inventory-tabs-head{
  align-items:center!important;
  gap:12px!important;
  padding-bottom:12px!important;
  border-bottom:1px solid var(--v1016-border-soft,#eef2f7)!important;
}
.page-inventory .inventory-tabs-minimal .inventory-tabs-head h2{
  margin:0!important;
  font-size:1rem!important;
  line-height:1.25!important;
  letter-spacing:-.01em!important;
}
.page-inventory .inventory-tabs-minimal .inventory-tabs-head p{
  max-width:760px!important;
  margin-top:3px!important;
  color:#64748b!important;
  font-size:.82rem!important;
  line-height:1.35!important;
}
.page-inventory .inventory-tabs-minimal .inventory-tabs-head .badge{
  min-height:30px!important;
  padding:7px 10px!important;
  border-radius:999px!important;
  font-size:.74rem!important;
  font-weight:700!important;
  white-space:nowrap!important;
}
.page-inventory .inventory-master-tabs{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
  width:100%!important;
  max-width:100%!important;
  margin:12px 0 0!important;
  padding:7px!important;
  border:1px solid var(--v1016-border,#e2e8f0)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.page-inventory .inventory-master-tab{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:3px!important;
  width:100%!important;
  min-width:0!important;
  min-height:44px!important;
  padding:8px 10px!important;
  border:1px solid transparent!important;
  border-radius:12px!important;
  background:transparent!important;
  color:#475569!important;
  text-align:center!important;
  text-decoration:none!important;
  box-shadow:none!important;
  transform:none!important;
  transition:background .15s ease,border-color .15s ease,color .15s ease!important;
}
.page-inventory .inventory-master-tab:hover{
  background:#f8fafc!important;
  border-color:#e2e8f0!important;
  color:#0f172a!important;
  transform:none!important;
  box-shadow:none!important;
}
.page-inventory .inventory-master-tab.active{
  background:var(--v1016-primary,#1d4ed8)!important;
  border-color:var(--v1016-primary,#1d4ed8)!important;
  color:#fff!important;
  box-shadow:none!important;
}
.page-inventory .inventory-master-tab .inventory-tab-name,
.page-inventory .inventory-master-tab span{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:inherit!important;
  font-size:.84rem!important;
  font-weight:650!important;
  line-height:1.18!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
}
.page-inventory .inventory-master-tab .inventory-tab-meta,
.page-inventory .inventory-master-tab small{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:#64748b!important;
  font-size:.68rem!important;
  font-weight:500!important;
  line-height:1.15!important;
  white-space:nowrap!important;
}
.page-inventory .inventory-master-tab.active .inventory-tab-meta,
.page-inventory .inventory-master-tab.active small{color:rgba(255,255,255,.86)!important;}
.page-inventory .inventory-sub-tabs{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  margin-top:10px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
.page-inventory .inventory-sub-tabs a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:30px!important;
  padding:7px 10px!important;
  border:1px solid var(--v1016-border,#e2e8f0)!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#475569!important;
  font-size:.76rem!important;
  font-weight:600!important;
  line-height:1!important;
  text-decoration:none!important;
  box-shadow:none!important;
}
.page-inventory .inventory-sub-tabs a:hover{
  background:#f8fafc!important;
  border-color:#cbd5e1!important;
  color:#0f172a!important;
}
.page-inventory .inventory-tabs-minimal,
.page-inventory #inventoryProductHpp,
.page-inventory #inventoryShrinkageForm,
.page-inventory #inventoryAdjustmentForm,
.page-inventory #inventoryShrinkageList,
.page-inventory #inventoryHistoryGrid,
.page-inventory #inventoryAdjustmentHistory{scroll-margin-top:96px!important;}
@media(max-width:1100px){
  .page-inventory .inventory-master-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:760px){
  .page-inventory .inventory-tabs-minimal .inventory-tabs-head{align-items:flex-start!important;}
  .page-inventory .inventory-tabs-minimal .inventory-tabs-head .badge{white-space:normal!important;text-align:left!important;}
  .page-inventory .inventory-master-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;padding:6px!important;border-radius:14px!important;}
  .page-inventory .inventory-master-tab{min-height:42px!important;padding:7px 8px!important;border-radius:10px!important;}
  .page-inventory .inventory-master-tab .inventory-tab-name,
  .page-inventory .inventory-master-tab span{font-size:.78rem!important;}
  .page-inventory .inventory-master-tab .inventory-tab-meta,
  .page-inventory .inventory-master-tab small{font-size:.64rem!important;}
  .page-inventory .inventory-sub-tabs{overflow:auto!important;flex-wrap:nowrap!important;padding-bottom:2px!important;}
  .page-inventory .inventory-sub-tabs a{white-space:nowrap!important;}
}
@media(max-width:420px){
  .page-inventory .inventory-master-tabs{grid-template-columns:1fr!important;}
}

/* V10.2.32 - rumus HPP stok lebih jelas */
.page-inventory .inventory-formula-panel{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
  margin-top:12px!important;
}
.page-inventory .inventory-formula-panel>div{
  min-width:0!important;
  padding:10px 12px!important;
  border:1px solid #e2e8f0!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.page-inventory .inventory-formula-panel span{
  display:block!important;
  margin-bottom:4px!important;
  color:#64748b!important;
  font-size:.72rem!important;
  font-weight:650!important;
  line-height:1.25!important;
}
.page-inventory .inventory-formula-panel strong{
  display:block!important;
  color:#0f172a!important;
  font-size:.92rem!important;
  font-weight:800!important;
  line-height:1.2!important;
  word-break:break-word!important;
}
.page-inventory .inventory-formula-panel small{
  display:block!important;
  margin-top:4px!important;
  color:#64748b!important;
  font-size:.68rem!important;
  line-height:1.25!important;
}
@media(max-width:1100px){.page-inventory .inventory-formula-panel{grid-template-columns:repeat(2,minmax(0,1fr))!important;}}
@media(max-width:520px){.page-inventory .inventory-formula-panel{grid-template-columns:1fr!important;}}