/* UX01: shared internal layouts; current identity and print documents remain intact. */
:focus-visible{outline:3px solid #1D4ED8;outline-offset:3px}
#uxLeaveDialog{border:0;border-radius:14px;padding:0;width:min(480px,94vw);max-height:90dvh;overflow:auto;color:#0D1B2A;background:#fff}
#uxLeaveDialog::backdrop{background:#0d1b2a88}#uxLeaveDialog .card{padding:20px;margin:0}#uxLeaveDialog h2{font-size:18px;margin:0 0 12px}#uxLeaveDialog .row{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
#uxLeaveDialog .btn{width:auto;min-height:44px}
#app section{min-width:0}#app section>.card,#app section>.grid2,#app section>.grid3{margin-block-end:18px}
#app section .card h3{line-height:1.6;margin-block-end:12px!important}
#app .grid2,#app .grid3{gap:18px}#app form{align-items:start}#app label{min-width:0;overflow-wrap:anywhere}
#app input,#app select,#app textarea{min-width:0;max-width:100%}#app .row{min-width:0}
#app .card>.row{gap:12px;align-items:center;margin-block-end:10px}
#app .tbox{max-width:100%;overflow:auto;overscroll-behavior-inline:contain;scrollbar-gutter:stable;border:1px solid var(--line);border-radius:8px;margin-block:10px}
#app .tbox:focus-visible{outline-offset:-3px}#app .tbox table{min-width:620px}
#app #ordersList .tbox table{min-width:100%}
#app td:not(.en),#app th{overflow-wrap:anywhere}#app td .row{display:flex}
#app .subnav{margin:2px 20px 8px 0;padding-inline-start:10px;border-inline-start:2px solid var(--line)}
#app .subnav a{font-size:13px;min-height:36px;padding:6px;line-height:1.5}#app .subnav a::before{display:none}
#app .subnav a[aria-current=location]{background:var(--side-on);font-weight:800}
#app.nav-collapsed .subnav{display:none}
.ux-context{font-size:13px;color:var(--muted,#64748B);margin-block:0 14px}
.ux-mobile-nav{display:flex;flex-wrap:wrap;gap:8px;padding:10px 14px;max-width:640px;margin:auto}
.ux-mobile-nav a{color:#0D1B2A;text-decoration:none;background:#fff;border:1px solid #D9DEE5;border-radius:8px;padding:8px 12px;min-height:44px;font-weight:700}
.ux-mobile-nav a[aria-current=page]{border-color:#A8812F;background:#FBF6EC}
.top{gap:10px;flex-wrap:wrap}.top>div{min-width:0;overflow-wrap:anywhere}
.wrap{min-width:0}.task>div{min-width:0;overflow-wrap:anywhere}
.ux-return{text-decoration:none;color:inherit;display:inline-flex;align-items:center;min-height:44px}
.toolbar{flex-wrap:wrap;padding-inline:12px}.page{min-width:0;overflow-wrap:anywhere}
.page .tbox{overflow:auto;max-width:100%}
@media(max-width:767.98px){#app.nav-collapsed .subnav{display:block}#app .card{padding:16px}.page{padding:18px 14px!important;margin:12px 8px!important}.page .head{flex-wrap:wrap;gap:14px}.page .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.page .foot{flex-wrap:wrap;gap:10px}#app .subnav a{font-size:13px!important;justify-content:start!important;padding:6px!important}.top .btn{min-height:44px}}
@media print{.ux-return,.ux-mobile-nav{display:none!important}.page .tbox{overflow:visible}}

.ngroup h2 button{border:0;background:none;padding:5px 0;color:inherit;font:inherit;cursor:pointer;text-align:start;width:100%;display:flex;justify-content:space-between;gap:8px}.ngroup h2 button::after{content:'−'}.ngroup h2 button[aria-expanded=false]::after{content:'+'}#app .apps[hidden]{display:none}#app.nav-collapsed .apps[hidden]{display:block}.nav-close{display:none}@media(max-width:767.98px){.nav-close{display:block}.ngroup h2{width:auto}#app.nav-collapsed .apps[hidden]{display:none}}
#app .kpis{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))!important}#app .kpi{min-width:0;overflow-wrap:anywhere}
.ux-context a{color:var(--teal,#1F7A6B);font-weight:700;min-height:36px;display:inline-flex;align-items:center;text-decoration:none}.ux-context a:hover{text-decoration:underline}
#app .ngroup:not(:has(.apps>a:not(.hidden))){display:none}
#app .tbox:has(tbody>tr:only-child>td[colspan])>table{min-width:100%;table-layout:fixed}#app .tbox:has(tbody>tr:only-child>td[colspan])>table>thead{display:none}
/* V3-44: a document return that could not be remembered (blocked/full site storage) is said, not hidden */
.ux-return-lost{font-size:13px;color:#7C2D12;background:#FFF7ED;border:1px solid #FED7AA;border-radius:8px;padding:6px 10px}
/* V3-48 (MYR-UX-006): one card heading pattern — the title, then its filters/actions on the same row; on a phone they wrap
   under it at full width. Sizes and weights are those the cards already used (16px h3, 17px h2, 18px dialogs, 800). */
#app .card-title{font-size:16px;font-weight:800;line-height:1.6;margin:0 0 10px}#app h2.card-title{font-size:17px}
#app h2.card-title.lg{font-size:18px}#app .card-title.sm{font-size:15px;margin:0}#app .entity-title{font-size:22px;font-weight:800;line-height:1.5}
#app .card-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-block-end:12px}
#app .card-head>.card-title{margin:0!important}#app .card-head>.toolbar{margin:0;padding:0;flex:0 1 auto}
#app .card-head .toolbar>label{flex:0 1 180px}#app .toolbar>button{min-height:40px}
#app .card>.toolbar[role=group]{padding-inline:0}
@media(max-width:767.98px){#app .card-head{align-items:stretch}#app .card-head>.toolbar{flex:1 1 100%}#app .card-head .toolbar>label{flex:1 1 140px}}
/* a dangerous row action (.btn.danger, the portal's existing look) keeps a little distance from its neighbours */
#app td .row>.btn.danger,#app .row>.btn.danger{margin-inline-start:6px}
/* V3-57: a save/upload in progress (aria-busy) shows the progress cursor */
[aria-busy=true]{cursor:progress}