/* BIMAS ERP — unified branded presentation layer. Loaded after module CSS. */
:root {
  --bimas-navy-950:#03142f;--bimas-navy-900:#06204a;--bimas-navy-800:#0a326e;
  --bimas-blue-700:#064bc3;--bimas-blue-600:#0862e8;--bimas-blue-500:#1680f5;
  --bimas-blue-100:#dcecff;--bimas-blue-50:#f1f7ff;
  --bimas-gold-600:#d88b08;--bimas-gold-500:#f4aa17;--bimas-gold-100:#fff0c2;
  --bimas-ink:#0a1830;--bimas-copy:#42526a;--bimas-muted:#6f7f95;
  --bimas-line:#d7e3f1;--bimas-canvas:#f4f7fb;--bimas-surface:#fff;
  --bimas-success:#0b8a55;--bimas-warning:#d98205;--bimas-danger:#df2638;
  --bimas-info:#0862e8;--bimas-purple:#7847de;
  --bimas-radius-sm:8px;--bimas-radius-md:12px;--bimas-radius-lg:16px;
  --bimas-shadow-card:0 8px 24px rgba(7,34,75,.07);
  --bimas-shadow-raised:0 16px 38px rgba(7,34,75,.13);
  --brand-blue:var(--bimas-blue-600);--brand-blue-mid:var(--bimas-blue-700);
  --brand-blue-deep:var(--bimas-navy-950);--brand-blue-light:var(--bimas-blue-500);
  --brand-blue-faint:var(--bimas-blue-50);--brand-yellow:var(--bimas-gold-500);
  --brand-yellow-mid:var(--bimas-gold-600);--bg:var(--bimas-canvas);
  --surface-0:var(--bimas-surface);--text-primary:var(--bimas-ink);
  --text-secondary:var(--bimas-copy);--text-tertiary:var(--bimas-muted);--border:var(--bimas-line);
}

html[data-auth-ready="app"] body{
  background:radial-gradient(circle at 88% 5%,rgba(22,128,245,.055),transparent 25rem),var(--bimas-canvas)!important;
  color:var(--bimas-ink);
}
html[data-auth-ready="app"] #app-content{min-width:0;color:var(--bimas-ink)}
html[data-auth-ready="app"] #app-content>:is(.page-container,.module-shell,[class$="-shell"],[class$="-page"],[class$="-workspace"]){
  width:min(100%,1680px)!important;max-width:1680px!important;margin-inline:auto!important;
}

/* Page hierarchy */
html[data-auth-ready="app"] #app-content :is(h1,.page-title,.module-title){
  color:var(--bimas-navy-950)!important;font-family:var(--font-display,"Plus Jakarta Sans",Inter,sans-serif)!important;
  font-weight:850!important;letter-spacing:-.035em!important;
}
html[data-auth-ready="app"] #app-content :is(h2,h3,.section-title,.card-title,.panel-title){
  color:var(--bimas-navy-900)!important;font-family:var(--font-display,"Plus Jakarta Sans",Inter,sans-serif)!important;
  font-weight:800!important;letter-spacing:-.018em!important;
}
html[data-auth-ready="app"] #app-content :is(.page-subtitle,.module-subtitle,.header-subtitle){color:var(--bimas-copy)!important;line-height:1.5!important}

/* Professional surfaces */
html[data-auth-ready="app"] #app-content :where(.card,.panel,.widget,[class$="-panel"],[class$="-widget"],[class$="-section"]){
  border-color:var(--bimas-line)!important;border-radius:var(--bimas-radius-md)!important;
  background-color:rgba(255,255,255,.98)!important;box-shadow:var(--bimas-shadow-card)!important;
}
html[data-auth-ready="app"] #app-content :where(.section-header,.card-header,.panel-header,[class$="-section-header"],[class$="-panel-header"]){
  border-color:var(--bimas-line)!important;background:linear-gradient(180deg,#fff 0%,var(--bimas-blue-50) 100%)!important;
}

/* Unified KPI/stat system. app.js adds .bimas-kpi to legacy cards. */
html[data-auth-ready="app"] body[data-route] #app-content#app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"],.dashboard-kpis,.stats-grid,.metric-grid){
  display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr))!important;
  align-items:stretch!important;gap:.85rem!important;width:100%!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi{
  --erp-kpi-tone:var(--bimas-kpi-accent,var(--tone,var(--bimas-blue-600)));
  position:relative!important;isolation:isolate!important;min-width:0!important;min-height:104px!important;
  display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:.78rem!important;
  padding:.88rem .92rem!important;border:1px solid var(--bimas-line)!important;border-top:3px solid var(--erp-kpi-tone)!important;
  border-radius:var(--bimas-radius-md)!important;background:linear-gradient(145deg,#fff 0%,#fbfdff 70%,var(--bimas-blue-50) 100%)!important;
  color:var(--bimas-ink)!important;box-shadow:var(--bimas-shadow-card)!important;overflow:hidden!important;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi:hover{
  border-color:color-mix(in srgb,var(--erp-kpi-tone) 35%,var(--bimas-line))!important;
  box-shadow:var(--bimas-shadow-raised)!important;transform:translateY(-2px)!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi::before{
  content:""!important;position:absolute!important;inset:0 auto 0 0!important;width:3px!important;display:block!important;
  background:var(--erp-kpi-tone)!important;opacity:.92!important;z-index:-1!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi::after{
  content:""!important;position:absolute!important;width:7rem!important;height:7rem!important;top:-4.2rem!important;right:-3.4rem!important;
  display:block!important;border-radius:50%!important;background:var(--erp-kpi-tone)!important;opacity:.075!important;pointer-events:none!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi .bimas-kpi-icon{
  position:relative!important;inset:auto!important;flex:0 0 2.7rem!important;width:2.7rem!important;height:2.7rem!important;min-width:2.7rem!important;
  display:grid!important;place-items:center!important;margin:0!important;padding:0!important;
  border:1px solid color-mix(in srgb,var(--erp-kpi-tone) 30%,transparent)!important;border-radius:10px!important;
  background:linear-gradient(145deg,var(--erp-kpi-tone),color-mix(in srgb,var(--erp-kpi-tone) 72%,var(--bimas-navy-950)))!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;box-shadow:0 9px 18px color-mix(in srgb,var(--erp-kpi-tone) 22%,transparent)!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi .bimas-kpi-icon .material-symbols-outlined{
  color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:1.28rem!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi .bimas-kpi-body{
  min-width:0!important;flex:1 1 auto!important;display:flex!important;flex-direction:column!important;
  align-items:flex-start!important;justify-content:center!important;gap:.13rem!important;text-align:left!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi :is(.bimas-kpi-label,[class*="kpi-label"],[class*="metric-label"]){
  max-width:100%!important;margin:0!important;color:var(--bimas-copy)!important;font-size:.66rem!important;font-weight:850!important;
  line-height:1.2!important;letter-spacing:.035em!important;text-transform:uppercase!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi :is(.bimas-kpi-value,[class*="kpi-value"],[class*="metric-value"]){
  max-width:100%!important;margin:0!important;color:var(--bimas-navy-950)!important;
  font-family:var(--font-display,"Plus Jakarta Sans",Inter,sans-serif)!important;font-size:clamp(1.05rem,1.5vw,1.35rem)!important;
  font-weight:900!important;line-height:1.12!important;letter-spacing:-.025em!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi :is(.bimas-kpi-sub,[class*="kpi-sub"],[class*="metric-sub"]){
  max-width:100%!important;margin:0!important;color:var(--bimas-muted)!important;font-size:.63rem!important;font-weight:650!important;
  line-height:1.25!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}

/* Branded buttons */
html[data-auth-ready="app"] :is(#app-content,#app-topbar) :is(.btn-primary,button.btn-primary,a.btn-primary){
  border-color:var(--bimas-blue-600)!important;background:linear-gradient(135deg,var(--bimas-blue-600),var(--bimas-blue-700))!important;
  color:#fff!important;box-shadow:0 7px 16px rgba(8,98,232,.20)!important;
}
html[data-auth-ready="app"] :is(#app-content,#app-topbar) :is(.btn-primary,button.btn-primary,a.btn-primary):hover{
  background:linear-gradient(135deg,var(--bimas-blue-500),var(--bimas-blue-700))!important;
  box-shadow:0 10px 22px rgba(8,98,232,.28)!important;transform:translateY(-1px);
}
html[data-auth-ready="app"] #app-content :is(.btn-secondary,.btn-outline){border-color:#b8cce4!important;background:#fff!important;color:var(--bimas-blue-700)!important}
html[data-auth-ready="app"] #app-content :is(.btn-danger,.btn-error){border-color:var(--bimas-danger)!important;background:linear-gradient(135deg,#ef3d4f,#c81f32)!important;color:#fff!important}
html[data-auth-ready="app"] #app-content :is(.btn,button,a[role="button"]):focus-visible,
html[data-auth-ready="app"] #app-content :is(input,select,textarea):focus-visible{outline:3px solid rgba(22,128,245,.24)!important;outline-offset:2px!important}

/* Forms and filters */
html[data-auth-ready="app"] #app-content :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea,.form-input,.form-control,.form-select){
  border-color:#c9d8e9!important;border-radius:var(--bimas-radius-sm)!important;background-color:#fff!important;
  color:var(--bimas-ink)!important;box-shadow:inset 0 1px 2px rgba(7,34,75,.025)!important;
}
html[data-auth-ready="app"] #app-content :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,.form-input,.form-control,.form-select){min-height:2.55rem!important}
html[data-auth-ready="app"] #app-content :is(input,select,textarea):focus{border-color:var(--bimas-blue-500)!important;box-shadow:0 0 0 3px rgba(22,128,245,.12)!important}
html[data-auth-ready="app"] #app-content :is(label,.form-label,.field-label){color:var(--bimas-navy-900);font-weight:750}

/* Data tables */
html[data-auth-ready="app"] #app-content :is(.table-wrap,.table-container,.table-responsive,.data-table-wrap){
  border:1px solid var(--bimas-line)!important;border-radius:var(--bimas-radius-md)!important;background:#fff!important;box-shadow:var(--bimas-shadow-card)!important;
}
html[data-auth-ready="app"] #app-content table{width:100%;border-collapse:separate;border-spacing:0;color:var(--bimas-ink);background:#fff}
html[data-auth-ready="app"] #app-content table thead th{
  border-color:var(--bimas-line)!important;background:linear-gradient(180deg,#f8fbff 0%,#eaf3ff 100%)!important;
  color:var(--bimas-navy-800)!important;font-size:.69rem!important;font-weight:850!important;line-height:1.25!important;
  letter-spacing:.018em!important;text-transform:none!important;vertical-align:middle!important;
}
html[data-auth-ready="app"] #app-content table tbody td{border-color:#e3ebf5!important;color:#163052!important;vertical-align:middle!important}
html[data-auth-ready="app"] #app-content table tbody tr:nth-child(even) td{background-color:#fbfdff}
html[data-auth-ready="app"] #app-content table tbody tr:hover td{background-color:#f0f7ff!important}

/* Tabs, badges and dashboard surfaces */
html[data-auth-ready="app"] #app-content :is(.tabs,.tabbar,[class$="-tabs"],[class*="-tabs "],[role="tablist"]){border-color:var(--bimas-line)!important}
html[data-auth-ready="app"] #app-content :is(.tabs,.tabbar,[class$="-tabs"],[class*="-tabs "],[role="tablist"])>:is(button,a,[role="tab"]):is(.active,[aria-selected="true"]){
  border-color:var(--bimas-blue-600)!important;background:var(--bimas-blue-50)!important;color:var(--bimas-blue-700)!important;
}
html[data-auth-ready="app"] #app-content :is(.badge,.status-badge,.status-pill,[class$="-badge"],[class$="-pill"]){border-radius:999px!important;font-weight:750!important;line-height:1.15!important}
html[data-auth-ready="app"] #app-content :is(.chart-card,.chart-panel,[class$="-chart-card"],[class$="-chart-panel"]){
  min-width:0!important;border:1px solid var(--bimas-line)!important;border-radius:var(--bimas-radius-md)!important;
  background:#fff!important;box-shadow:var(--bimas-shadow-card)!important;overflow:hidden!important;
}
html[data-auth-ready="app"] #app-content .empty-state{border:1px dashed #b9cce3!important;border-radius:var(--bimas-radius-md)!important;background:linear-gradient(145deg,#fff,var(--bimas-blue-50))!important}

/* Financial reporting is also rendered by a standalone QA preview, so it
   receives the same KPI language without depending on app.js normalization. */
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpis{
  display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr))!important;gap:.85rem!important;
}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi{
  --fr-tone:var(--bimas-blue-600);min-width:0!important;min-height:104px!important;display:flex!important;align-items:center!important;
  gap:.72rem!important;padding:.82rem!important;border:1px solid var(--bimas-line)!important;border-top:3px solid var(--fr-tone)!important;
  border-radius:var(--bimas-radius-md)!important;background:linear-gradient(145deg,#fff,#f8fbff)!important;
  box-shadow:var(--bimas-shadow-card)!important;color:var(--bimas-ink)!important;text-align:left!important;overflow:hidden!important;
}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi--green{--fr-tone:var(--bimas-success)}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi--amber{--fr-tone:var(--bimas-warning)}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi--purple{--fr-tone:var(--bimas-purple)}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi--red{--fr-tone:var(--bimas-danger)}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi-icon{
  flex:0 0 2.55rem!important;width:2.55rem!important;height:2.55rem!important;display:grid!important;place-items:center!important;
  border-radius:10px!important;background:var(--fr-tone)!important;color:#fff!important;font-size:1.18rem!important;
  box-shadow:0 8px 16px color-mix(in srgb,var(--fr-tone) 22%,transparent)!important;
}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi>span:last-child{
  min-width:0!important;display:flex!important;flex-direction:column!important;gap:.1rem!important;
}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi strong{
  max-width:100%!important;color:var(--bimas-navy-950)!important;font-size:clamp(.98rem,1.5vw,1.25rem)!important;
  font-weight:900!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi b{color:var(--bimas-copy)!important;font-size:.68rem!important;font-weight:850!important}
html[data-auth-ready="app"] body[data-route="financial-reports"] #app-content .fr-kpi small{color:var(--bimas-muted)!important;font-size:.61rem!important;font-weight:650!important}

/* Responsive behavior shared by every module. */
@media(max-width:1280px){
  html[data-auth-ready="app"] body[data-route] #app-content#app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"]){grid-template-columns:repeat(auto-fit,minmax(min(100%,11.5rem),1fr))!important}
}
@media(max-width:1024px){
  html[data-auth-ready="app"] #app-content{padding-inline:clamp(.65rem,2.2vw,1.15rem)!important}
  html[data-auth-ready="app"] #app-content :is(.page-header,.module-header,[class$="-hero"],[class$="-header"]),
  html[data-auth-ready="app"] #app-content :is(.page-actions,.header-actions,[class$="-actions"],[class$="-toolbar"]){flex-wrap:wrap!important}
  html[data-auth-ready="app"] #app-content :is(.table-wrap,.table-container,.table-responsive,.data-table-wrap),
  html[data-auth-ready="app"] #app-content :is(.card,.panel,[class$="-panel"]):has(>table){max-width:100%!important;overflow-x:auto!important;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
}
@media(min-width:521px) and (max-width:820px){
  html[data-auth-ready="app"] body[data-route] #app-content#app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"]){grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:640px){
  html[data-auth-ready="app"] #app-content{padding-inline:.65rem!important}
  html[data-auth-ready="app"] #app-content :is(h1,.page-title,.module-title){font-size:clamp(1.35rem,7vw,1.8rem)!important;line-height:1.12!important}
  html[data-auth-ready="app"] #app-content :is(.form-grid,[class$="-form-grid"],[class$="-filters"],[class$="-filter-grid"],[class$="-details-grid"],[class$="-summary-grid"]){grid-template-columns:minmax(0,1fr)!important}
  html[data-auth-ready="app"] #app-content :is(.page-actions,.header-actions,[class$="-header-actions"]){width:100%!important}
  html[data-auth-ready="app"] #app-content :is(.page-actions,.header-actions,[class$="-header-actions"])>:is(.btn,button,a.btn){flex:1 1 9rem!important;justify-content:center!important}
  html[data-auth-ready="app"] #app-content table{font-size:.78rem}
}
@media(max-width:520px){
  html[data-auth-ready="app"] body[data-route] #app-content#app-content :is(.bimas-kpi-grid,.bimas-auto-kpi-strip,[class*="-kpi-grid"],[class*="-metric-grid"],[class*="-stats-grid"]){grid-template-columns:minmax(0,1fr)!important}
  html[data-auth-ready="app"] body[data-route] #app-content#app-content .bimas-kpi{min-height:92px!important;padding:.75rem .8rem!important}
  html[data-auth-ready="app"] #app-content :is(.modal,.modal-dialog,.modal-content,[class$="-modal"]){max-width:calc(100vw - 1rem)!important;max-height:calc(100dvh - 1rem)!important}
}
@media(prefers-reduced-motion:reduce){
  html[data-auth-ready="app"] *,html[data-auth-ready="app"] *::before,html[data-auth-ready="app"] *::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
@media print{
  html[data-auth-ready="app"] body,html[data-auth-ready="app"] #app-content{background:#fff!important}
  html[data-auth-ready="app"] #app-content :is(.card,.panel,.bimas-kpi){box-shadow:none!important}
}
