/* MFAH interface system. Screen-only so printable business documents keep their layout. */
@font-face{font-family:Inter;src:url('fonts/InterVariable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@media screen{
.ui-breadcrumb{display:flex;flex-wrap:wrap;gap:9px;align-items:center;font-size:12px;color:var(--ui-muted);margin-bottom:16px}.ui-breadcrumb a{color:var(--ui-muted);text-decoration:none}.ui-breadcrumb a:hover{color:var(--ui-brand);text-decoration:underline}
:root{--ui-brand:#086b4d;--ui-brand-hover:#05533b;--ui-ink:#20382f;--ui-muted:#64756d;--ui-border:#dee7e1;--ui-surface:#fff;--ui-page:#f5f7f6;--ui-soft:#edf5f0;--ui-shadow:0 3px 14px #163d2510;--bs-body-font-family:Inter,system-ui,sans-serif;--bs-primary:#086b4d;--bs-primary-rgb:8,107,77}
body.app-shell,body.mobile-body,body.auth-shell{font-family:Inter,system-ui,sans-serif!important;font-size:14px;line-height:1.6;color:var(--ui-ink)!important;background:var(--ui-page)!important;font-optical-sizing:auto;-webkit-font-smoothing:antialiased;color-scheme:light}
:is(.app-shell,.mobile-body,.auth-shell) :is(button,input,select,textarea){font-family:inherit}
:is(.app-shell,.mobile-body) :is(h1,h2,h3,h4,h5,h6){line-height:1.3;font-weight:600!important}
body.app-shell .app-content{padding:28px 32px!important}
body.app-shell :is(.hero,.page-heading,.ux2-heading,.settings-hero,.cashier-hero,.weekly-off-hero,.report-hero,.finance-hero){background:transparent!important;color:var(--ui-ink)!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;margin-bottom:24px!important;gap:16px}
body.app-shell :is(.settings-hero,.cashier-hero,.weekly-off-hero,.report-hero,.finance-hero)::before,body.app-shell :is(.settings-hero,.cashier-hero,.weekly-off-hero,.report-hero,.finance-hero)::after{display:none!important}
body.app-shell :is(.hero,.page-heading,.ux2-heading,.settings-hero,.cashier-hero,.weekly-off-hero,.report-hero,.finance-hero) :is(h1,h2,h3){font-size:26px!important;letter-spacing:-.6px!important;color:var(--ui-ink)!important;margin-bottom:8px!important}
body.app-shell :is(.hero,.page-heading,.ux2-heading,.settings-hero,.cashier-hero,.weekly-off-hero,.report-hero,.finance-hero) :is(p,.text-white-50,.opacity-75){color:var(--ui-muted)!important;opacity:1!important;font-size:13px}
body.app-shell :is(.card,.cardx,.table-card,.profile-card,.finance-panel,.finance-stat,.settings-group,.cashier-card,.off-card,.manual-tool,.kasbon-content-card,.kasbon-filter-card,.kasbon-summary-card,.report-filter,.enterprise-card,.ux-panel,.ux2-panel,.metric-card,.midnight-panel,.summary-card){border:1px solid var(--ui-border)!important;border-radius:12px!important;background:var(--ui-surface)!important;box-shadow:var(--ui-shadow)!important;color:var(--ui-ink)}
body.app-shell :is(.card-header,.finance-panel-head,.midnight-panel-header,.ux-panel-head){background:transparent!important;border-bottom:1px solid var(--ui-border)!important;padding:18px 20px!important}
body.app-shell :is(.settings-group-icon,.ux-panel-icon){background:var(--ui-soft)!important;color:var(--ui-brand)!important;border-radius:10px!important;box-shadow:none!important}
body.app-shell :is(.settings-item,.settings-items a){border-radius:8px!important;transition:background .15s}
body.app-shell :is(.settings-item,.settings-items a):hover{background:var(--ui-soft)!important}
:is(body.app-shell,body.mobile-body) .btn{min-height:40px;border-radius:8px!important;padding:9px 14px;font-size:13px!important;line-height:1.4;font-weight:500!important;letter-spacing:0!important;box-shadow:none!important;transition:background .15s,border-color .15s;touch-action:manipulation}
:is(body.app-shell,body.mobile-body) :is(.btn-primary,.btn-success,.btn-yudha){background:var(--ui-brand)!important;border:1px solid var(--ui-brand)!important;color:#fff!important}
:is(body.app-shell,body.mobile-body) :is(.btn-primary,.btn-success,.btn-yudha):hover{background:var(--ui-brand-hover)!important;border-color:var(--ui-brand-hover)!important}
:is(body.app-shell,body.mobile-body) :is(.btn-outline-primary,.btn-outline-success){background:#fff!important;color:var(--ui-brand)!important;border:1px solid #b6d0c1!important}
:is(body.app-shell,body.mobile-body) :is(.btn-outline-primary,.btn-outline-success):hover{background:var(--ui-soft)!important}
:is(body.app-shell,body.mobile-body) :is(.btn-secondary,.btn-outline-secondary,.btn-light){background:#fff!important;color:#485d52!important;border:1px solid var(--ui-border)!important}
:is(body.app-shell,body.mobile-body) :is(.btn-secondary,.btn-outline-secondary,.btn-light):hover{background:#f1f5f2!important}
:is(body.app-shell,body.mobile-body) .btn-danger{background:#b93838!important;border-color:#b93838!important;color:#fff!important}
:is(body.app-shell,body.mobile-body) .btn-outline-danger{background:#fff!important;border-color:#edcaca!important;color:#a52d2d!important}
:is(body.app-shell,body.mobile-body) .btn-outline-danger:hover{background:#fff2f2!important}
:is(body.app-shell,body.mobile-body) :is(.btn:disabled,.btn.disabled){opacity:.48!important;cursor:not-allowed;transform:none!important}
:is(body.app-shell,body.mobile-body) .btn .bi{font-size:16px;vertical-align:-.1em}
body.app-shell .table .btn{min-height:34px!important;padding:6px 10px!important}
:is(body.app-shell,body.mobile-body,body.auth-shell) :is(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid #348967!important;outline-offset:3px}
:is(body.app-shell,body.mobile-body) :is(.form-control,.form-select){font-size:14px!important;min-height:42px;border-radius:8px!important;border:1px solid #cddbd2!important;padding:9px 12px;color:var(--ui-ink)!important;background-color:#fff!important}
:is(body.app-shell,body.mobile-body) .form-select{padding-right:34px}
:is(body.app-shell,body.mobile-body) :is(.form-control,.form-select):focus{border-color:var(--ui-brand)!important;box-shadow:0 0 0 3px #086b4d16!important}
:is(body.app-shell,body.mobile-body) :is(.form-control,.form-select):disabled{background-color:#f0f3f1!important;color:#68776e!important}
:is(body.app-shell,body.mobile-body) .form-control[readonly]{background-color:#f7f9f7!important}
:is(body.app-shell,body.mobile-body) :is(.form-label,.field label){font-size:13px!important;font-weight:500!important;color:var(--ui-ink)!important;margin-bottom:7px}
:is(body.app-shell,body.mobile-body) :is(.form-text,.invalid-feedback){font-size:12px;line-height:1.5;margin-top:6px}
:is(body.app-shell,body.mobile-body) :is(.form-control,.form-select).is-invalid{border-color:#c13d3d!important}
:is(body.app-shell,body.mobile-body) .form-check-input:checked{background-color:var(--ui-brand)!important;border-color:var(--ui-brand)!important}
.ui-required{color:#a52d2d;margin-left:4px}
body.app-shell .table{font-size:13px!important;--bs-table-hover-bg:#f2f7f3;--bs-table-striped-bg:#fafcfb}
body.app-shell .table th{font-size:12px!important;font-weight:600!important;color:#52675b!important;padding:13px 16px!important;background:#f7f9f7!important;border-bottom:1px solid var(--ui-border)!important;line-height:1.5}
body.app-shell .table td{padding:14px 16px!important;border-color:#eaf0ec!important;line-height:1.55}
body.app-shell .table :is(td,th).text-end{font-variant-numeric:tabular-nums}
body.app-shell :is(.table-responsive,.manual-wrap){border-radius:10px;overscroll-behavior-x:contain;scrollbar-width:thin}
body.app-shell .manual-grid th{background:#f0f6f2!important;color:#385947!important;font-weight:600}
body.app-shell .manual-grid{font-family:Inter,system-ui,sans-serif;font-size:12px}
:is(body.app-shell,body.mobile-body) :is(.badge,.status-chip,.finance-status){font-size:11px;font-weight:500!important;border-radius:6px!important;padding:5px 8px;line-height:1.4}
:is(body.app-shell,body.mobile-body) :is(.badge.bg-success,.badge.text-bg-success){background:#e8f5ed!important;color:#216740!important}
:is(body.app-shell,body.mobile-body) :is(.badge.bg-danger,.badge.text-bg-danger){background:#fcecec!important;color:#a62f2f!important}
:is(body.app-shell,body.mobile-body) :is(.badge.bg-warning,.badge.text-bg-warning){background:#fff3d8!important;color:#855800!important}
:is(body.app-shell,body.mobile-body) :is(.badge.bg-primary,.badge.text-bg-primary,.badge.bg-info,.badge.text-bg-info){background:#eaf1f8!important;color:#315a7d!important}
:is(body.app-shell,body.mobile-body) :is(.badge.bg-secondary,.badge.text-bg-secondary){background:#edf1ee!important;color:#59695e!important}
:is(body.app-shell,body.mobile-body) .alert{font-size:13px;border-radius:10px!important;padding:13px 16px;box-shadow:none!important;line-height:1.6}
:is(body.app-shell,body.mobile-body) :is(.modal-content,.offcanvas){border:1px solid var(--ui-border);border-radius:14px;box-shadow:0 16px 60px #142d2420}
:is(body.app-shell,body.mobile-body) .modal-header{padding:20px 24px;border-bottom:1px solid var(--ui-border);background:#fff!important;color:var(--ui-ink)!important}
:is(body.app-shell,body.mobile-body) .modal-title{font-size:18px!important;color:var(--ui-ink)!important}
:is(body.app-shell,body.mobile-body) .modal-body{padding:24px}
:is(body.app-shell,body.mobile-body) .modal-footer{padding:16px 24px;background:#fafcfb;border-top:1px solid var(--ui-border);gap:8px}
:is(body.app-shell,body.mobile-body) :is(.dropdown-menu,.swal2-popup){border:1px solid var(--ui-border)!important;border-radius:12px!important;box-shadow:0 12px 36px #163d251a!important;font-family:Inter,system-ui,sans-serif}
:is(body.app-shell,body.mobile-body) .dropdown-item{font-size:13px;padding:10px 14px;border-radius:6px}
:is(body.app-shell,body.mobile-body) .dropdown-item:hover{background:var(--ui-soft);color:var(--ui-brand)}
:is(body.app-shell,body.mobile-body) .swal2-title{font-size:22px!important}.swal2-html-container{font-size:14px!important;line-height:1.6!important}.swal2-confirm{background:var(--ui-brand)!important}.swal2-styled{border-radius:8px!important;font-size:14px!important}
body.app-shell :is(.nav-tabs,.profile-tabs){gap:4px;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:thin}
body.app-shell :is(.nav-tabs,.profile-tabs) .nav-link{white-space:nowrap;min-height:44px;font-size:13px!important;border-radius:0!important}
body.app-shell .nav-tabs .nav-link.active{color:var(--ui-brand)!important;background:transparent!important;border-color:transparent transparent var(--ui-brand)!important}
body.app-shell :is(.profile-hero,.hero-meta>div){box-shadow:none!important}
body.app-shell .profile-hero h2{font-size:25px!important;color:var(--ui-ink)!important}
body.app-shell :is(.metric-value,.finance-stat-value,.midnight-kpi-value){font-variant-numeric:tabular-nums;font-size:26px!important;letter-spacing:-.6px!important;font-weight:600!important}
.ui-empty-cell{padding:36px 20px!important;color:var(--ui-muted)!important;text-align:center!important}
.ui-empty-cell::before{content:'\F233';font-family:bootstrap-icons!important;display:block;font-size:24px;color:#8ca496;margin-bottom:10px}
.ui-filter-count{background:var(--ui-soft);color:var(--ui-brand);border-radius:5px;padding:3px 7px;font-size:11px;margin-left:6px;white-space:nowrap}
[aria-busy="true"]{cursor:progress}
body.mobile-body :is(.mobile-card,.profile-card,.hero-card,.ux-panel,.kasbon-card,.slip-card){border-radius:12px!important;border:1px solid var(--ui-border)!important;background:#fff!important;box-shadow:var(--ui-shadow)!important;color:var(--ui-ink)!important}
body.mobile-body :is(.hero-card h1,.hero-card h2,.hero-card h3,.page-header h1){color:var(--ui-ink)!important;font-size:22px!important}
body.mobile-body :is(.hero-card p,.hero-card small){color:var(--ui-muted)!important}
body.mobile-body :is(.history-row,.pay-row,.timeline-row,.info-row){padding-top:14px;padding-bottom:14px;border-color:var(--ui-border)!important}
body.mobile-body .btn{min-height:44px!important}
body.mobile-body :is(.form-control,.form-select){min-height:46px;font-size:16px!important}
body.mobile-body .mobile-bottom-nav a{min-height:48px!important;font-size:11px!important}
body.auth-shell{--accent:var(--ui-brand);--accent-hover:var(--ui-brand-hover);--link:var(--ui-brand);--ink:var(--ui-ink);--muted:var(--ui-muted);--line:var(--ui-border)}
body.auth-shell :is(.login-shell,.challenge,.challenge-shell,.security-shell,.recovery-shell){border:1px solid var(--ui-border)!important;border-radius:16px!important;box-shadow:0 12px 40px #163d2510!important;background:#fff!important}
body.auth-shell :is(.form-title,h1,h2){font-weight:600!important;letter-spacing:-.5px;font-size:24px}
body.auth-shell :is(.btn-login,.btn-main,.btn-verify,.btn-primary){background:var(--ui-brand)!important;border-color:var(--ui-brand)!important;box-shadow:none!important;font-weight:600!important;border-radius:8px!important;min-height:48px}
body.auth-shell :is(.form-label,.field label){font-size:13px!important;font-weight:500!important}
body.auth-shell :is(.input-row,.btn-back){border-radius:8px!important}
body.auth-shell .recovery-brand{background:var(--ui-brand)!important}
body.auth-shell .recovery-brand h1{color:#fff!important}
@media(max-width:991px){body.app-shell .app-content{padding:22px!important}}
@media(max-width:575px){body.app-shell .app-content{padding:16px!important}body.app-shell :is(.hero,.page-heading,.ux2-heading,.settings-hero,.cashier-hero,.weekly-off-hero,.report-hero,.finance-hero) :is(h1,h2,h3){font-size:23px!important}body.app-shell .btn{min-height:44px!important}body.app-shell :is(.form-control,.form-select){font-size:16px!important}body.app-shell .table .btn{min-height:40px!important}body.app-shell :is(.modal-body,.modal-header,.modal-footer){padding:16px}body.mobile-body .mobile-shell{padding-left:16px!important;padding-right:16px!important}.ui-filter-count{display:inline-block}body.auth-shell .recovery-panel{padding:28px 22px}}
@media(prefers-reduced-motion:reduce){:is(body.app-shell,body.mobile-body,body.auth-shell) *{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
}

@media screen{body.auth-shell .identity img{box-shadow:none!important;padding:0!important}body.auth-shell .code-field{border-radius:8px;font-weight:500}}
@media screen{
body.app-shell :is(.weekly-off-kicker,.off-summary-label,.report-kicker){color:var(--ui-muted)!important;font-size:11px!important;font-weight:500!important;text-transform:none!important}
body.app-shell :is(.off-summary-chip,.summary-chip){background:#fff!important;border:1px solid var(--ui-border)!important;border-radius:8px!important;color:var(--ui-ink)!important;backdrop-filter:none!important}
body.app-shell :is(.off-toolbar,.off-column){background:#fff!important;border:1px solid var(--ui-border)!important;border-radius:12px!important;box-shadow:var(--ui-shadow)!important}
body.app-shell .off-column:hover{transform:none!important}
body.app-shell .off-column-head{border-top:2px solid #d2e4d8!important;background:#f5f9f6;margin-bottom:8px}
body.app-shell .off-day-icon{background:var(--ui-soft)!important;color:var(--ui-brand)!important;box-shadow:none!important}
body.app-shell :is(.off-name,.cashier-name){font-size:13px!important;font-weight:500!important}
body.app-shell :is(.off-meta,.cashier-nik){font-size:11px!important;color:var(--ui-muted)!important}
body.app-shell :is(.weekly-off-page,.cashier-page){padding:0!important}
body.app-shell .kasbon-page-title{font-size:26px!important;font-weight:600!important}
body.app-shell .kasbon-search-wrap .form-control{padding-left:38px!important}
body.app-shell .kasbon-summary-card::after{display:none!important}
body.app-shell .kasbon-table :is(td,td b,td strong){font-size:13px!important;font-weight:500}
body.app-shell .kasbon-table :is(small,.small){font-size:11px!important}
body.app-shell .slip-modern .slip-card{border:1px solid var(--ui-border)!important;border-radius:12px!important;box-shadow:var(--ui-shadow)!important}
body.app-shell .slip-modern .slip-header{background:var(--ui-brand)!important;padding:24px!important}
body.app-shell .slip-modern :is(.info-card,.panel,.grand-total){border-radius:10px!important;border-color:var(--ui-border)!important;background:#fff!important;box-shadow:none!important}
body.app-shell .slip-modern .grand-total{background:var(--ui-soft)!important}
body.app-shell .slip-modern .grand-total .amount{color:var(--ui-brand)!important;font-weight:600!important;font-size:28px!important}
body.app-shell .slip-modern .info-label{font-size:12px!important;text-transform:none!important;font-weight:500!important;margin-bottom:4px}
body.app-shell .slip-modern .logo-box{border-radius:10px!important;box-shadow:none!important}
body.app-shell .slip-modern .line-row{border-bottom-style:solid}
body.app-shell .slip-modern .line-row b{font-weight:500;font-variant-numeric:tabular-nums}
body.app-shell :is(.profile-card-title,.panel h5){font-size:17px!important}
body.app-shell :is(.security-hero,.settings-hero) :is(.opacity-75,.small){color:var(--ui-muted)!important;opacity:1!important}
body.app-shell .ux2-saved-views :is(button,select){font-size:12px!important;min-height:34px!important}
}