/* ============================================================
   MASAR UI — unified visual language v1
   Refined industrial operations: quiet, dense, accessible.
   This file is intentionally loaded last to retire legacy layers.
   ============================================================ */

html{
  background:var(--u-bg);
  color:var(--u-txt);
  scrollbar-color:var(--u-border-strong) var(--u-bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
body{
  background:var(--u-bg)!important;
  color:var(--u-txt)!important;
  font-family:var(--u-font-ui)!important;
  text-rendering:optimizeLegibility;
}
body,
button,
input,
select,
textarea{font-family:var(--u-font-ui)!important}
button,
a,
input,
select,
textarea,
[tabindex]:not([tabindex="-1"]){
  transition:color var(--u-dur) var(--u-ease),background-color var(--u-dur) var(--u-ease),border-color var(--u-dur) var(--u-ease),box-shadow var(--u-dur) var(--u-ease);
}
:focus-visible{outline:0!important;box-shadow:var(--u-ring)!important}
::selection{background:var(--u-accent-fill);color:#102033}
::placeholder{color:var(--u-placeholder)!important;opacity:1}
hr{border-color:var(--u-border)}
.skip-link{
  position:fixed!important;
  inset-block-start:0!important;
  inset-inline:16px auto!important;
  z-index:1200!important;
  transform:translateY(calc(-100% - 12px));
  padding:10px 16px!important;
  color:#fff!important;
  background:var(--u-brand-fill)!important;
  border-radius:0 0 10px 10px!important;
  text-decoration:none!important;
  font-weight:800!important;
}
.skip-link:focus{transform:translateY(0)}

/* Theme control */
.theme-toggle{
  min-width:44px;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:1px solid var(--u-border-strong);
  border-radius:var(--u-r-control);
  background:var(--u-surface);
  color:var(--u-txt);
  cursor:pointer;
  padding:0 12px;
  font-weight:700;
}
.theme-toggle:hover{background:var(--u-surface-2);border-color:var(--u-accent-fill)}
.theme-toggle svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.8}
.theme-toggle .theme-label{white-space:nowrap}
.theme-toggle--header{padding:0;width:44px}
.theme-toggle--mobile{width:100%;justify-content:flex-start}
.theme-toggle--mobile .theme-toggle-label{display:inline!important;white-space:nowrap}
.theme-toggle .theme-icon-sun{display:none}
[data-theme="dark"] .theme-toggle .theme-icon-sun{display:block}
[data-theme="dark"] .theme-toggle .theme-icon-moon{display:none}

/* Public website */
header#header{
  background:color-mix(in srgb,var(--u-surface) 94%,transparent)!important;
  border-bottom:1px solid var(--u-border)!important;
  box-shadow:0 1px 0 rgba(15,28,46,.02)!important;
  backdrop-filter:blur(14px);
}
.header-inner{max-width:1440px!important}
.logo-text strong,
nav#main-nav a,
.mobile-nav a{color:var(--u-txt)!important}
.logo-text span{color:var(--u-txt-2)!important}
[data-theme="dark"] header#header .logo-icon-img{filter:brightness(0) invert(1)}
nav#main-nav a::after{background:var(--u-accent-fill)!important}
nav#main-nav a:hover,
nav#main-nav a.active,
nav#main-nav a[aria-current="page"]{color:var(--u-navy-2)!important}
.menu-btn{border-color:var(--u-border)!important;background:var(--u-surface)!important}
.menu-btn span{background:var(--u-txt)!important}
.mobile-nav{
  background:var(--u-surface)!important;
  border-color:var(--u-border)!important;
  box-shadow:var(--u-shadow-lift)!important;
}
.mobile-nav-divider{background:var(--u-border)!important}
.btn{
  border-radius:var(--u-r-control)!important;
  min-height:44px;
  box-shadow:none!important;
  font-weight:700!important;
}
.btn-primary,
.btn-dark{
  color:#fff!important;
  background:#173E67!important;
  border-color:#173E67!important;
}
.btn-primary:hover,
.btn-dark:hover{background:#102A43!important;border-color:#102A43!important}
.btn-outline{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border-color:var(--u-border-strong)!important;
}
.btn-outline:hover{background:var(--u-surface-2)!important;border-color:var(--u-accent-fill)!important}
.btn-wa{background:#176B47!important;color:#fff!important;border-color:#176B47!important}
section:not(#hero),
.section-light,
.section-alt{color:var(--u-txt)}
.section-light{background:var(--u-surface)!important}
.section-alt{background:var(--u-bg)!important}
.section-title,
.section-heading,
.sec-title,
.about-title,
.service-title,
.contact-title{color:var(--u-txt)!important}
.section-sub,
.section-desc,
.service-desc,
.contact-sub{color:var(--u-txt-2)!important}
.card,
.service-card,
.srv-card,
.value-card,
.fleet-card,
.sector-card,
.sector-full-card,
.partner-item,
.why-item,
.ops-feat,
.contact-card,
.stat-box,
.about-card{
  background:var(--u-surface)!important;
  color:var(--u-txt)!important;
  border:1px solid var(--u-border)!important;
  box-shadow:var(--u-shadow)!important;
}
.card:hover,
.service-card:hover,
.srv-card:hover,
.value-card:hover,
.fleet-card:hover,
.sector-card:hover{box-shadow:var(--u-shadow-lift)!important;border-color:var(--u-border-strong)!important}
.srv-card h3,
.sector-card .sc-name,
.sector-full-card h3,
.ops-feat,
.why-item p{color:var(--u-txt)!important}
.srv-card p,
.sector-full-card p{color:var(--u-txt-2)!important}
.srv-icon,
.sector-card .sc-icon,
.sector-full-card .sc-icon{
  color:var(--u-navy-2)!important;
  background:var(--u-surface-2)!important;
  border:1px solid var(--u-border)!important;
}
.srv-icon svg,
.sector-card .sc-icon svg,
.sector-full-card .sc-icon svg{color:currentColor!important}
.srv-link,
.eyebrow,
.sec-label{color:var(--u-accent)!important}
.why-num{color:var(--u-accent)!important;opacity:.88!important}
.partner-item{min-height:92px}
footer{background:#0A1C30!important}
[data-theme="dark"] main .sec-title span,
[data-theme="dark"] main .section-header h2 span,
[data-theme="dark"] main h2>span{color:var(--u-accent)!important}
#why .sec-title,
#why .sec-title span,
section.dark .section-header h2,
section.dark .section-header h2 span{color:#F4F7FB!important}
.check-icon{
  flex:0 0 22px;
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--u-ok-bg);
  color:var(--u-ok);
}
.check-icon svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2}

/* Operations app shell */
#opsMain{
  color:var(--u-txt)!important;
  background:var(--u-bg)!important;
}
#opsMain>.container{
  max-width:var(--u-content)!important;
  padding:24px!important;
}
.lbar{background:var(--u-bg)!important}
.sidebar{
  background:#10253F!important;
  background-image:none!important;
  border-left:1px solid rgba(255,255,255,.1)!important;
  box-shadow:none!important;
}
.sidebar::before,
.sidebar::after{display:none!important}
.sidebar .sb-logo{border-color:rgba(255,255,255,.12)!important}
.sidebar .sb-name{color:#F5F8FC!important}
.sidebar .sb-sub,
.sidebar .sb-section-label,
.sidebar .sb-date{color:#9FB0C4!important}
.sidebar .nav-item,
.sidebar .sb-sub-item,
.sidebar .sb-sub-sub-item{
  color:#C5D1DF!important;
  border-radius:10px!important;
  background:transparent!important;
}
.sidebar .nav-item:hover,
.sidebar .sb-sub-item:hover,
.sidebar .sb-sub-sub-item:hover{background:rgba(255,255,255,.07)!important;color:#fff!important}
.sidebar .nav-item.active,
.sidebar .nav-item.act,
.sidebar .sb-sub-item.act,
.sidebar .sb-sub-sub-item.act{
  color:#FFE5A9!important;
  background:rgba(209,164,79,.14)!important;
  box-shadow:inset -3px 0 0 #D1A44F!important;
}
.sidebar .sb-sub-nav,
.sidebar .sb-sub-sub-nav{border-color:rgba(255,255,255,.1)!important}
.sidebar .sb-toggle,
.sidebar .sb-logout,
.sidebar .sb-theme-toggle{
  color:#E9EFF6!important;
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(255,255,255,.14)!important;
}
.sidebar .sb-logout:hover,
.sidebar .sb-theme-toggle:hover{background:rgba(255,255,255,.1)!important}
.sb-theme-toggle{width:100%;justify-content:flex-start;margin-bottom:8px}
.ops-mobile-theme-toggle{width:100%;justify-content:flex-start;margin-bottom:12px}
.sidebar.collapsed .sb-theme-toggle{width:44px;padding:0;justify-content:center}
.sidebar.collapsed .sb-theme-toggle .theme-label,
.sidebar.collapsed .sb-theme-toggle .theme-toggle-label{display:none!important}

/* Quiet navigation labels: keep the grouping text, remove the old divider
   rules, and point every desktop flyout indicator to the right as requested. */
@media (min-width:769px){
  html body #sidebar.sidebar-flyout-nav>.sb-section-label,
  html body #sidebar.sidebar-flyout-nav .sb-nav>.sb-section-label{
    min-height:0!important;
    margin:14px 16px 3px!important;
    padding:0!important;
    color:#5B697A!important;
    border:0!important;
    background:transparent!important;
  }
  html body #sidebar.sidebar-flyout-nav>.sb-section-label::after,
  html body #sidebar.sidebar-flyout-nav .sb-nav>.sb-section-label::after{
    content:none!important;
    display:none!important;
    background:none!important;
  }
  html body #sidebar.sidebar-flyout-nav .nav-item .sb-chevron,
  html body #sidebar.sidebar-flyout-nav .nav-item.open .sb-chevron{
    transform:none!important;
  }
}

/* Unified module shell */
.ui-module{display:grid;gap:16px}
.ui-module-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  min-height:104px;
  padding:22px 24px;
  color:var(--u-txt);
  background:var(--u-surface);
  border:1px solid var(--u-border);
  border-radius:var(--u-r-card);
  box-shadow:var(--u-shadow);
  position:relative;
  overflow:hidden;
}
/* The legacy stylesheet used page-specific, important gradients.  These
   selectors deliberately retire them so every rebuilt module has one shell. */
#opsMain .ui-module>.ui-module-head,
#opsMain .ui-module>.sec>.ui-module-head{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  background-image:none!important;
  border:1px solid var(--u-border)!important;
  border-radius:var(--u-r-card)!important;
  box-shadow:var(--u-shadow)!important;
}
#opsMain .ui-module-head .ui-module-title,
#opsMain .ui-module-head h1,
#opsMain .ui-module-head h2{color:var(--u-txt)!important}
#opsMain .ui-module-head .ph-sub,
#opsMain .ui-module-head .sec-sub{color:var(--u-txt-2)!important}
#opsMain .ui-module-head .ui-module-icon{color:var(--u-navy-2)!important}
.ui-module-head::before{
  content:"";
  position:absolute;
  inset-block:18px;
  inset-inline-start:0;
  width:4px;
  border-radius:0 4px 4px 0;
  background:var(--u-accent-fill);
}
.ui-module-title{display:flex;align-items:flex-start;gap:14px}
.ui-module-title{color:var(--u-txt)!important;font-size:clamp(23px,2vw,31px)!important;font-weight:800;line-height:1.25}
.ui-module-icon{
  flex:0 0 46px;
  width:46px;height:46px;
  display:grid;place-items:center;
  color:var(--u-navy-2);
  background:var(--u-surface-2);
  border:1px solid var(--u-border);
  border-radius:12px;
}
.ui-module-icon .ic{width:22px;height:22px}
.ui-module-eyebrow{color:var(--u-accent);font-size:12px;font-weight:800;letter-spacing:.03em;margin-bottom:2px}
.ui-module-head h1,
.ui-module-head h2{margin:0;color:var(--u-txt)!important;font-size:clamp(23px,2vw,31px);line-height:1.25}
.ui-module-head p{margin:6px 0 0;color:var(--u-txt-2)!important;font-size:14px}
.ui-module-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ui-module-tabs,
.ui-subtabs{
  display:flex;
  align-items:center;
  gap:4px;
  padding:5px;
  background:var(--u-surface);
  border:1px solid var(--u-border);
  border-radius:12px;
  overflow-x:auto;
  scrollbar-width:thin;
}
.ui-module-tabs .tabx,
.ui-subtabs .tabx,
.ui-module-tabs button,
.ui-subtabs button{
  flex:0 0 auto;
  min-height:40px;
  padding:8px 14px!important;
  border:0!important;
  border-radius:8px!important;
  color:var(--u-txt-2)!important;
  background:transparent!important;
  box-shadow:none!important;
}
.ui-module-tabs .tabx:hover,
.ui-subtabs .tabx:hover,
.ui-module-tabs button:hover,
.ui-subtabs button:hover{color:var(--u-txt)!important;background:var(--u-surface-2)!important}
.ui-module-tabs .tabx.act,
.ui-subtabs .tabx.act,
.ui-module-tabs button.act,
.ui-subtabs button.act{color:#fff!important;background:#173E67!important}
.ui-workspace{
  background:var(--u-surface);
  border:1px solid var(--u-border);
  border-radius:var(--u-r-card);
  box-shadow:var(--u-shadow);
  overflow:hidden;
}
.ui-workspace>.sec,
.ui-workspace>.panel{border:0!important;border-radius:0!important;box-shadow:none!important;margin:0!important}
.ui-workspace-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px 20px;border-bottom:1px solid var(--u-border);
}
.ui-workspace-head h2,.ui-workspace-head h3{margin:0;color:var(--u-txt)!important}
.ui-workspace-head p{margin:4px 0 0;color:var(--u-txt-2)!important}

/* Retire legacy visual layers */
#opsMain .sec,
#opsMain .panel,
#opsMain .dash-card,
#opsMain .chart-box,
#opsMain .filter-card,
#opsMain .attention-panel{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border-color:var(--u-border)!important;
  box-shadow:var(--u-shadow)!important;
  background-image:none!important;
}
#opsMain .sec-hdr{
  color:var(--u-txt)!important;
  background:transparent!important;
  border-color:var(--u-border)!important;
}
#opsMain .sec-hdr h1,
#opsMain .sec-hdr h2,
#opsMain .sec-hdr h3,
#opsMain .dash-title,
#opsMain .chart-title,
#opsMain .dz-ttl{color:var(--u-txt)!important}
#opsMain .dash-sub,
#opsMain .dz-sub,
#opsMain .hint,
#opsMain .muted,
#opsMain small{color:var(--u-txt-2)!important}
#opsMain .filters{
  background:var(--u-surface-2)!important;
  border-color:var(--u-border)!important;
  box-shadow:none!important;
}
#opsMain .fi,
#opsMain input:not([type="checkbox"]):not([type="radio"]),
#opsMain select,
#opsMain textarea{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border-color:var(--u-border-strong)!important;
  box-shadow:none!important;
}
#opsMain .fi:hover,
#opsMain input:hover,
#opsMain select:hover,
#opsMain textarea:hover{border-color:var(--u-accent-fill)!important}
#opsMain .btn{
  border-radius:var(--u-r-control)!important;
  min-height:42px;
}
#opsMain .btn-gold{
  color:#102033!important;
  background:var(--u-accent-fill)!important;
  background-image:none!important;
  border-color:var(--u-accent-fill)!important;
}
#opsMain .btn-gold:hover{background:#E0B75F!important;border-color:#E0B75F!important;filter:none!important}
#opsMain .btn-light,
#opsMain .btn-ghost{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border-color:var(--u-border-strong)!important;
}
#opsMain .kpi,
#opsMain .exec-card,
#opsMain .stat-card{
  min-height:112px!important;
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  background-image:none!important;
  border:1px solid var(--u-border)!important;
  border-top:1px solid var(--u-border)!important;
  border-inline-start:4px solid var(--u-border-strong)!important;
  border-radius:var(--u-r-card)!important;
  box-shadow:var(--u-shadow)!important;
}
#opsMain .kpi.grn,
#opsMain .exec-card.grn{border-inline-start-color:var(--u-ok)!important}
#opsMain .kpi.red,
#opsMain .exec-card.red{border-inline-start-color:var(--u-danger)!important}
#opsMain .kpi.gold,
#opsMain .exec-card.gold{border-inline-start-color:var(--u-warn)!important}
#opsMain .kpi.blue,
#opsMain .exec-card.blue{border-inline-start-color:var(--u-info)!important}
#opsMain .kpi::before,
#opsMain .exec-card::before{display:none!important}
#opsMain .kpi .num,
#opsMain .exec-val,
#opsMain .stat-value{color:var(--u-txt)!important}
#opsMain .twrap{
  background:var(--u-surface)!important;
  border-color:var(--u-border)!important;
  box-shadow:none!important;
}
#opsMain table{color:var(--u-txt)!important;background:var(--u-surface)!important}
#opsMain thead th{
  color:#F7FAFC!important;
  background:#173E67!important;
  border-color:#244D79!important;
}
#opsMain tbody td{color:var(--u-txt)!important;border-color:var(--u-border)!important;background:var(--u-surface)!important}
#opsMain tbody tr:nth-child(even) td{background:var(--u-surface-2)!important}
#opsMain tbody tr:hover td{background:var(--u-accent-bg)!important}
#opsMain .badge{
  box-shadow:none!important;
  border:1px solid currentColor!important;
}
#opsMain .empty{
  color:var(--u-txt-2)!important;
  background:var(--u-surface-2)!important;
  border-color:var(--u-border)!important;
}
#opsMain .lbtn{
  min-width:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;
  color:var(--u-navy-2)!important;background:var(--u-surface)!important;
  border:1px solid var(--u-border)!important;border-radius:9px!important;
}
#opsMain .lbtn:hover{color:var(--u-txt)!important;background:var(--u-surface-2)!important;border-color:var(--u-accent-fill)!important}
.toast{
  color:#fff!important;background:var(--u-brand-fill)!important;
  border:1px solid color-mix(in srgb,#fff 18%,transparent)!important;
  box-shadow:var(--u-shadow-modal)!important;
}
.toast.ok{background:#1E6B4B!important}.toast.err{background:#A8323A!important}.toast.warn{background:#98600B!important}

/* Vehicle, HR and finance overview density */
#page-vehicles .ui-kpi-strip,
#page-hr .ui-kpi-strip,
#page-finance .ui-kpi-strip,
#page-reports .ui-kpi-strip,
.ui-kpi-strip{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
#page-vehicles .krow,
#page-hr .krow,
#page-finance .krow{gap:12px!important}
#page-vehicles .vh-tabs,
#page-hr>.tabs,
#page-finance>.tabs{position:sticky;top:8px;z-index:20}

/* Reports center */
.reports-center{display:grid;gap:16px}
.reports-health{
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:12px 16px;
  background:var(--u-surface);
  border:1px solid var(--u-border);
  border-radius:12px;
}
.reports-health-status{display:flex;align-items:center;gap:8px;color:var(--u-txt-2)}
.reports-health-status::before{
  content:"";width:9px;height:9px;border-radius:50%;background:var(--u-ok);box-shadow:0 0 0 4px var(--u-ok-bg);
}
.reports-health-status.is-partial::before{background:var(--u-warn);box-shadow:0 0 0 4px var(--u-warn-bg)}
.reports-health-status.is-error::before{background:var(--u-danger);box-shadow:0 0 0 4px var(--u-danger-bg)}
.report-catalog,
.report-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.report-card{
  display:grid;grid-template-columns:42px minmax(0,1fr);align-items:start;gap:14px;
  min-height:132px;padding:18px;
  text-align:start;color:var(--u-txt);
  background:var(--u-surface);
  border:1px solid var(--u-border);
  border-radius:var(--u-r-card);
}
.report-card:hover{border-color:var(--u-accent-fill);box-shadow:var(--u-shadow-lift);transform:translateY(-1px)}
.report-card-icon{
  width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;
  color:var(--u-navy-2);background:var(--u-surface-2);border:1px solid var(--u-border);border-radius:11px;
}
.report-card h3{margin:0 0 5px;font-size:16px;color:var(--u-txt)}
.report-card p{margin:0;color:var(--u-txt-2);font-size:13px;line-height:1.7}
.report-card-meta{display:block;margin-top:9px;color:var(--u-accent);font-size:12px;font-weight:800}
.report-card>.btn{grid-column:1/-1;width:100%;margin-top:2px}
.report-workspace{display:none}
.report-workspace.active{display:block}
.report-definition,
.report-definition-note{
  padding:10px 14px;border-inline-start:3px solid var(--u-info);
  color:var(--u-txt-2);background:var(--u-info-bg);border-radius:8px;font-size:13px;
}
.report-definition-note{display:flex;align-items:flex-start;gap:10px;margin:16px}
.report-definition-note strong,.report-definition-note span{display:block}
.report-definition-note strong{color:var(--u-txt);margin-bottom:3px}
.report-card-grid{padding:0 16px 16px}
.report-load-state{
  display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
  min-height:118px;padding:20px;color:var(--u-danger);
  background:var(--u-danger-bg);border:1px solid color-mix(in srgb,var(--u-danger) 35%,var(--u-border));border-radius:12px;
}
.report-load-state>div{flex:1;min-width:220px;text-align:start}
.report-load-state strong,.report-load-state span{display:block}
.report-load-state strong{color:var(--u-danger);margin-bottom:4px}
.report-load-state span{color:var(--u-txt-2);font-size:13px}

/* Income statement: semantic rows shared by light and dark themes. */
#opsMain .income-section td{
  padding:12px 18px!important;
  color:var(--u-txt)!important;
  background:var(--u-surface-2)!important;
  border-inline-start:4px solid var(--u-info)!important;
}
#opsMain .income-section.is-revenue td{color:var(--u-ok)!important;border-inline-start-color:var(--u-ok)!important;background:var(--u-ok-bg)!important}
#opsMain .income-section.is-cost td{color:var(--u-danger)!important;border-inline-start-color:var(--u-danger)!important;background:var(--u-danger-bg)!important}
#opsMain .income-section.is-opex td{color:var(--u-info)!important;border-inline-start-color:var(--u-info)!important;background:var(--u-info-bg)!important}
.income-section-title{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:900}
#opsMain .income-line td{padding:10px 18px!important}
#opsMain .income-line.is-indent td:first-child{padding-inline-start:30px!important}
.income-line.is-indent .income-row-label{display:inline-flex;align-items:center;gap:9px}
.income-line.is-indent .income-row-label::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--u-border-strong);flex:0 0 5px}
.income-amount{text-align:left!important;direction:rtl;white-space:nowrap;font-weight:800!important;font-family:var(--u-font-num)!important}
#opsMain .income-line.is-negative .income-amount{color:var(--u-danger)!important}
#opsMain .income-subtotal td{padding:12px 18px!important;font-weight:900!important;background:var(--u-surface-2)!important;border-top:1px solid var(--u-border-strong)!important;border-bottom:2px solid var(--u-border-strong)!important}
#opsMain .income-subtotal.is-revenue td{color:var(--u-ok)!important}
#opsMain .income-subtotal.is-cost td,
#opsMain .income-subtotal.is-negative td{color:var(--u-danger)!important}
#opsMain .income-result td{padding:15px 18px!important;font-size:15px!important;font-weight:900!important;border-top:3px solid currentColor!important}
#opsMain .income-result.is-positive td{color:var(--u-ok)!important;background:var(--u-ok-bg)!important}
#opsMain .income-result.is-negative td{color:var(--u-danger)!important;background:var(--u-danger-bg)!important}
.income-result-label{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.income-result-label span{padding:3px 9px;border:1px solid currentColor;border-radius:var(--u-r-pill);font-size:11px;font-weight:800}

/* Modals and overlays */
.mo{background:var(--u-overlay)!important;backdrop-filter:blur(5px)}
.modal,.modal-content,.dialog,.login-card{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border-color:var(--u-border)!important;
  box-shadow:var(--u-shadow-modal)!important;
}
.modal-head,.modal-footer{border-color:var(--u-border)!important;background:var(--u-surface)!important}

/* Login: compact split shell with one stable identity in both themes. */
.login-overlay{
  /* Keep display non-important: authentication hides this node inline. */
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:auto;
  padding:clamp(16px,3vw,36px)!important;
  color:var(--u-txt)!important;
  background:
    radial-gradient(circle at 14% 14%,color-mix(in srgb,var(--u-accent-fill) 13%,transparent),transparent 30%),
    linear-gradient(145deg,var(--u-bg),color-mix(in srgb,var(--u-surface-2) 72%,var(--u-bg)))!important;
}
.login-shell{
  display:grid;
  isolation:isolate;
  width:min(900px,100%)!important;
  min-height:0!important;
  margin:auto!important;
  grid-template-columns:minmax(0,1fr) minmax(340px,380px)!important;
  overflow:hidden;
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border:1px solid var(--u-border-strong)!important;
  border-radius:24px!important;
  box-shadow:var(--u-shadow-modal)!important;
}
.login-brand-panel{
  min-height:520px!important;
  padding:34px!important;
  color:var(--u-on-navy)!important;
  background:
    radial-gradient(circle at 8% 0%,rgba(240,199,108,.16),transparent 32%),
    radial-gradient(circle at 100% 100%,rgba(72,118,162,.22),transparent 36%),
    linear-gradient(150deg,#15324F 0%,#10253F 52%,#0B1A2D 100%)!important;
}
.login-brand-panel::before{
  inset:20px auto auto 24px!important;
  width:180px!important;
  height:180px!important;
  border-color:rgba(255,255,255,.13)!important;
}
.login-brand-panel::after{
  width:250px!important;
  height:250px!important;
  background:rgba(216,168,71,.13)!important;
}
.login-logo-mark{
  width:66px!important;
  height:66px!important;
  margin-bottom:16px!important;
  filter:brightness(0) invert(1) drop-shadow(0 8px 18px rgba(0,0,0,.24))!important;
}
.login-eyebrow{
  min-height:26px!important;
  margin-bottom:14px!important;
  padding:3px 10px!important;
  color:var(--u-on-navy-muted)!important;
  border-color:rgba(255,255,255,.2)!important;
  background:rgba(255,255,255,.075)!important;
}
.login-brand-title{
  max-width:430px!important;
  color:var(--u-on-navy)!important;
  font-size:clamp(27px,2.5vw,31px)!important;
  line-height:1.32!important;
  text-wrap:balance;
}
.login-brand-sub{
  max-width:420px!important;
  margin-top:10px!important;
  color:var(--u-on-navy-muted)!important;
  font-size:13.5px!important;
  line-height:1.75!important;
  text-wrap:pretty;
}
.login-feature-grid{gap:8px!important;margin-top:28px!important}
.login-feature{
  min-height:74px!important;
  padding:12px!important;
  color:#E6EDF5!important;
  border-color:rgba(255,255,255,.15)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.07)!important;
}
.login-feature .ic{margin-bottom:8px!important;color:#F0C76C!important}
.login-feature span{font-size:11.5px!important}
.login-brand-bottom{
  margin-top:26px!important;
  color:var(--u-on-navy-muted)!important;
  font-size:10.5px!important;
}
.login-card-panel{
  min-width:0;
  padding:30px!important;
  color:var(--u-txt)!important;
  background:var(--u-surface-2)!important;
}
.login-card{
  position:relative;
  width:100%!important;
  max-width:340px!important;
  box-sizing:border-box;
  padding:27px 26px 24px;
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border:1px solid var(--u-border)!important;
  border-radius:18px!important;
  box-shadow:var(--u-shadow-card)!important;
}
.login-card::before{
  width:58px!important;
  height:58px!important;
  margin:0 auto 17px!important;
  border:1px solid rgba(255,255,255,.13);
  border-radius:15px!important;
  background-color:#102A43!important;
  box-shadow:0 12px 26px rgba(4,13,25,.24)!important;
}
.login-card-title{margin-bottom:20px!important}
.login-card-title h2{
  margin-bottom:5px!important;
  color:var(--u-txt)!important;
  font-size:24px!important;
  line-height:1.35;
  text-wrap:balance;
}
.login-card-title p{
  color:var(--u-txt-2)!important;
  font-size:13px!important;
  line-height:1.7!important;
  text-wrap:pretty;
}
.login-field{margin-bottom:13px!important}
.login-field label{
  margin-bottom:7px!important;
  color:var(--u-txt-2)!important;
  font-size:12.5px!important;
  font-weight:800!important;
}
.login-field input{
  min-height:48px!important;
  padding:11px 13px!important;
  color:var(--u-txt)!important;
  caret-color:var(--u-accent)!important;
  background:var(--u-surface)!important;
  border:1px solid var(--u-border-strong)!important;
  border-radius:11px!important;
  box-shadow:inset 0 1px 2px rgba(2,8,23,.04)!important;
}
.login-field input:hover{border-color:color-mix(in srgb,var(--u-info) 68%,var(--u-border-strong))!important}
.login-field input:focus,
.login-field input:focus-visible{
  border-color:var(--u-info)!important;
  box-shadow:var(--u-ring)!important;
}
.login-field input:-webkit-autofill,
.login-field input:-webkit-autofill:hover,
.login-field input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--u-txt)!important;
  box-shadow:0 0 0 1000px var(--u-surface) inset,var(--u-ring)!important;
  transition:background-color 9999s ease-out 0s;
}
.login-error{
  margin-bottom:13px!important;
  padding:10px 12px!important;
  color:var(--u-danger)!important;
  background:var(--u-danger-bg)!important;
  border:1px solid color-mix(in srgb,var(--u-danger) 48%,var(--u-border))!important;
  border-radius:10px!important;
  font-size:12.5px!important;
}
.login-submit{
  min-height:48px!important;
  margin-top:7px!important;
  color:#fff!important;
  background:linear-gradient(135deg,var(--u-brand-fill),var(--u-brand-hover))!important;
  border:1px solid color-mix(in srgb,var(--u-brand-hover) 78%,#fff)!important;
  border-radius:11px!important;
  box-shadow:0 10px 22px rgba(7,22,38,.2)!important;
  transition-property:transform,background-color,border-color,box-shadow,opacity!important;
  transition-duration:var(--u-dur)!important;
  transition-timing-function:var(--u-ease)!important;
}
.login-submit:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 13px 26px rgba(7,22,38,.26)!important}
.login-submit:active:not(:disabled){transform:translateY(1px) scale(.985)!important}
.login-submit:focus-visible{box-shadow:var(--u-ring),0 12px 26px rgba(7,22,38,.24)!important}
.login-submit:disabled{color:rgba(255,255,255,.8)!important;opacity:.72!important}
.login-footnote{margin-top:16px!important;color:var(--u-txt-2)!important;font-size:11px!important}

@media (max-height:700px) and (min-width:921px){
  .login-shell{width:min(860px,100%)!important}
  .login-brand-panel{min-height:460px!important;padding:28px!important}
  .login-logo-mark{width:56px!important;height:56px!important;margin-bottom:12px!important}
  .login-feature-grid{margin-top:18px!important}
  .login-brand-bottom{margin-top:18px!important}
  .login-card-panel{padding:24px!important}
}
@media (max-width:920px){
  .login-overlay{min-height:100dvh;padding:16px!important}
  .login-shell{
    width:min(420px,100%)!important;
    grid-template-columns:1fr!important;
    background:transparent!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  .login-brand-panel{display:none!important}
  .login-card-panel{padding:0!important;background:transparent!important}
  .login-card{max-width:none!important;padding:30px 26px 25px!important;border-radius:20px!important}
  .login-card::before{display:block!important}
  .login-card-title{text-align:center}
  .login-card-title p{max-width:280px;margin-inline:auto!important}
  .login-field input,.login-submit{min-height:50px!important;font-size:16px!important}
}
@media (max-width:480px){
  .login-overlay{padding:10px!important}
  .login-card{padding:25px 20px 21px!important;border-radius:18px!important}
  .login-card::before{width:52px!important;height:52px!important;margin-bottom:14px!important}
  .login-card-title{margin-bottom:17px!important}
  .login-card-title h2{font-size:22px!important}
  .login-footnote{margin-top:14px!important}
}

/* Dark theme: replace legacy hard-coded surfaces */
[data-theme="dark"] #opsMain .btn-dark,
[data-theme="dark"] #opsMain .btn-primary{background:#28557E!important;border-color:#3B6995!important;color:#fff!important}
[data-theme="dark"] #opsMain thead th{background:#1C3557!important;border-color:#36506E!important}
[data-theme="dark"] #opsMain .badge.b-blue,
[data-theme="dark"] #opsMain .badge.b-gray{background:var(--u-info-bg)!important;color:var(--u-info)!important}
[data-theme="dark"] #opsMain .badge.b-green{background:var(--u-ok-bg)!important;color:var(--u-ok)!important}
[data-theme="dark"] #opsMain .badge.b-red{background:var(--u-danger-bg)!important;color:var(--u-danger)!important}
[data-theme="dark"] #opsMain .badge.b-gold{background:var(--u-warn-bg)!important;color:var(--u-warn)!important}
[data-theme="dark"] .date-picker,
[data-theme="dark"] .date-range-picker,
[data-theme="dark"] .drp-popover{background:var(--u-surface)!important;color:var(--u-txt)!important;border-color:var(--u-border)!important}

/* Theme contrast guardrails for legacy operation widgets. */
#opsMain :is(
  .kpi .val,
  .exec-val,
  .stat-card .st-val,
  .psal-val,
  .ra-meta,
  .top-row .tr-val,
  .invoice-total-grid output,
  .income-amount,
  .oh-num,
  .ops-alert-count,
  .viol-attention-count,
  .fuel-kpi-meta-value,
  .table-date
){
  color:var(--u-number)!important;
  font-family:var(--u-font-num)!important;
  font-variant-numeric:tabular-nums;
}
#opsMain .kpi.grn .val,
#opsMain .top-row .tr-val.pos,
#opsMain .exec-sub.pos{color:var(--u-ok)!important}
#opsMain .kpi.red .val,
#opsMain .top-row .tr-val.neg,
#opsMain .exec-sub.neg{color:var(--u-danger)!important}
#opsMain .kpi.gold .val{color:var(--u-warn)!important}
#opsMain .kpi.blue .val{color:var(--u-info)!important}
#opsMain tbody td strong{color:inherit!important}
#opsMain :is(.f label,.fg label,.filter-label,.field-label){color:var(--u-txt-2)!important}
#opsMain :is(
  .kpi .lbl,
  .kpi .sub,
  .exec-lbl,
  .exec-sub,
  .stat-card .st-lbl,
  .ra-t2,
  .ra-empty,
  .top-row .tr-lbl,
  .metric-zone .mz-sub,
  .dash-zone .dz-sub,
  .fuel-kpi-meta-unit
){color:var(--u-txt-2)!important}
#opsMain :is(
  .metric-zone .mz-ttl,
  .dash-zone .dz-ttl,
  .dash-panel-hdr h3,
  .page-head .ph-title
){color:var(--u-txt)!important}
#opsMain :is(.metric-zone .mz-bar,.dash-zone .dz-bar){background:var(--u-accent-fill)!important}
#opsMain :is(.exec-ic,.stat-card .st-ic,.ra-dot,.qa-btn .qa-ic,.kpi .lbl-ic){
  color:var(--u-info)!important;
  background:var(--u-info-bg)!important;
  border-color:color-mix(in srgb,var(--u-info) 34%,var(--u-border))!important;
}
#opsMain :is(.exec-card.grn .exec-ic,.ra-dot.grn,.kpi.grn .lbl-ic){color:var(--u-ok)!important;background:var(--u-ok-bg)!important;border-color:color-mix(in srgb,var(--u-ok) 34%,var(--u-border))!important}
#opsMain :is(.exec-card.red .exec-ic,.ra-dot.red,.kpi.red .lbl-ic){color:var(--u-danger)!important;background:var(--u-danger-bg)!important;border-color:color-mix(in srgb,var(--u-danger) 34%,var(--u-border))!important}
#opsMain :is(.exec-card.gold .exec-ic,.ra-dot.gold,.kpi.gold .lbl-ic){color:var(--u-warn)!important;background:var(--u-warn-bg)!important;border-color:color-mix(in srgb,var(--u-warn) 34%,var(--u-border))!important}
#opsMain .dash-panel{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border-color:var(--u-border)!important;
  box-shadow:var(--u-shadow)!important;
}
#opsMain .dash-panel-hdr{
  color:var(--u-txt)!important;
  background:var(--u-surface-2)!important;
  border-color:var(--u-border)!important;
  border-inline-start-color:var(--u-accent-fill)!important;
}
#opsMain .dash-panel-hdr :is(.ic,.cnt){color:var(--u-info)!important}
#opsMain .dash-panel-hdr .cnt{background:var(--u-info-bg)!important}
#opsMain .qa-btn{
  color:var(--u-txt)!important;
  background:var(--u-surface-2)!important;
  border-color:var(--u-border)!important;
}
#opsMain .qa-btn:hover{
  color:#fff!important;
  background:var(--u-brand-fill)!important;
  border-color:var(--u-brand-hover)!important;
}
#opsMain :is(input,select,textarea)[readonly],
#opsMain :is(input,select,textarea):disabled{
  color:var(--u-txt-2)!important;
  background:var(--u-disabled-bg)!important;
  border-color:var(--u-border)!important;
  opacity:1!important;
}
#opsMain :is(input,select,textarea)::placeholder{color:var(--u-placeholder)!important;opacity:1!important}
#opsMain option{color:var(--u-txt)!important;background:var(--u-surface)!important}

/* The attention center used light-only literals. Keep it a neutral navy
   hierarchy instead of allowing white slabs or dark ink into dark mode. */
#opsMain .viol-attention,
#opsMain .viol-attention-section,
#opsMain .viol-attention:not([open]){
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border-color:var(--u-border)!important;
  box-shadow:var(--u-shadow)!important;
}
#opsMain .viol-attention-summary,
#opsMain .viol-attention-section-head,
#opsMain .attention-single .viol-attention-summary,
#opsMain .viol-attention:not([open]) .viol-attention-summary{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  border-color:var(--u-border)!important;
  border-inline-start-color:var(--u-brand-fill)!important;
}
#opsMain .viol-attention-summary:hover{background:var(--u-surface-2)!important}
#opsMain .viol-attention-body,
#opsMain .attention-single-body{background:var(--u-surface-2)!important;border-color:var(--u-border)!important}
#opsMain :is(.viol-attention-heading,.viol-attention-section-title),
#opsMain .viol-attention:not([open]) .viol-attention-heading{color:var(--u-txt)!important}
#opsMain .viol-attention-total,
#opsMain .viol-attention:not([open]) :is(.viol-attention-total,.viol-attention-count){
  color:#fff!important;
  background:var(--u-brand-fill)!important;
  border-color:var(--u-brand-hover)!important;
}
#opsMain .viol-attention-count{
  color:var(--u-info)!important;
  background:var(--u-info-bg)!important;
  border-color:color-mix(in srgb,var(--u-info) 35%,var(--u-border))!important;
}
#opsMain .viol-attention-count.is-risk{color:var(--u-danger)!important;background:var(--u-danger-bg)!important;border-color:color-mix(in srgb,var(--u-danger) 42%,var(--u-border))!important}
#opsMain .viol-attention-count.is-alert{color:var(--u-warn)!important;background:var(--u-warn-bg)!important;border-color:color-mix(in srgb,var(--u-warn) 42%,var(--u-border))!important}
#opsMain .viol-attention-chevron,
#opsMain .viol-attention:not([open]) .viol-attention-chevron{color:var(--u-txt-2)!important}
#opsMain .viol-attention-alerts .ops-alert-chip{
  color:var(--u-info)!important;
  background:var(--u-info-bg)!important;
  border-color:color-mix(in srgb,var(--u-info) 34%,var(--u-border))!important;
}
#opsMain .viol-attention-alerts .ops-alert-chip.danger{color:var(--u-danger)!important;background:var(--u-danger-bg)!important;border-color:color-mix(in srgb,var(--u-danger) 34%,var(--u-border))!important}
#opsMain .viol-attention-alerts .ops-alert-chip.warn{color:var(--u-warn)!important;background:var(--u-warn-bg)!important;border-color:color-mix(in srgb,var(--u-warn) 34%,var(--u-border))!important}
#opsMain .viol-attention-alerts .ops-alert-state{background:color-mix(in srgb,var(--u-surface) 68%,transparent)!important}

/* Desktop navigation is a true theme surface.  These selectors intentionally
   match the legacy flyout rules' specificity so light-only colors cannot leak
   into the dark experience. */
@media (min-width:769px){
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav{
    color:#E7EEF7!important;
    border-left-color:#26374D!important;
    background:
      radial-gradient(circle at 78% -6%,rgba(209,164,79,.11),transparent 28%),
      linear-gradient(180deg,#121E31 0%,#0C1625 100%)!important;
    box-shadow:-12px 0 36px rgba(2,6,23,.38)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav::after{
    background:linear-gradient(90deg,rgba(255,255,255,.025),transparent 30%)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-logo{
    border-bottom-color:#26374D!important;
    background:rgba(18,30,49,.82)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-logo img{
    border-color:#33465F!important;
    background:#F8FAFC!important;
    box-shadow:0 8px 20px rgba(2,6,23,.26)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-name{color:#F5F8FC!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-sub,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-date,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav>.sb-section-label,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav>.sb-section-label{color:#9EADC0!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-toggle{
    color:#DDE7F2!important;
    border-color:#33465F!important;
    background:#17263B!important;
    box-shadow:0 5px 14px rgba(2,6,23,.22)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-toggle:hover{
    color:#FFF!important;
    border-color:#516681!important;
    background:#20334D!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sidebar-resizer::after{background:rgba(209,164,79,.46)!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sidebar-resizer:hover::after,
  html[data-theme="dark"] body.sidebar-resizing #sidebar.sidebar-flyout-nav .sidebar-resizer::after{background:#D1A44F!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav{scrollbar-color:#455871 transparent}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav::-webkit-scrollbar-thumb{background:#455871!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item{color:#C5D1DF!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item:hover{
    color:#FFF!important;
    background:#1A2A40!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item.active,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item.open{
    color:#FFE5A9!important;
    background:rgba(209,164,79,.14)!important;
    box-shadow:inset 0 0 0 1px rgba(209,164,79,.16),0 7px 16px rgba(2,6,23,.16)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item.active::before,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item.open::before{background:#D1A44F!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item .ic:not(.sb-chevron),
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item svg:not(.sb-chevron){
    color:#C9D5E3!important;
    border-color:#2C4058!important;
    background:#15243A!important;
    box-shadow:0 4px 12px rgba(2,6,23,.18)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item.active .ic:not(.sb-chevron),
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item.active svg:not(.sb-chevron),
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item.open .ic:not(.sb-chevron),
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .nav-item.open svg:not(.sb-chevron){
    color:#FFE5A9!important;
    border-color:rgba(209,164,79,.32)!important;
    background:rgba(209,164,79,.1)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-chevron{color:#91A2B7!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-footer{
    border-top-color:#26374D!important;
    background:rgba(7,15,27,.36)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-theme-toggle,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-logout{
    color:#DDE7F2!important;
    border-color:#30445D!important;
    background:#15243A!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-theme-toggle:hover,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-logout:hover{
    color:#FFF!important;
    border-color:#465C77!important;
    background:#1D3049!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-theme-toggle .theme-toggle-label{color:inherit!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav>.sb-sub-nav{
    color:#D9E3EF!important;
    border-color:#33475F!important;
    border-right-color:#D1A44F!important;
    background:rgba(17,29,47,.985)!important;
    box-shadow:0 22px 55px rgba(2,6,23,.44),0 4px 14px rgba(2,6,23,.24)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav>.sb-sub-nav::before{
    color:#F4F7FB!important;
    border-bottom-color:#2C4058!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav>.sb-sub-nav .sb-sub-item,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-sub-sub-item{color:#B8C6D7!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav>.sb-sub-nav .sb-sub-item::before{background:#60738B!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav>.sb-sub-nav .sb-sub-item:hover,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-sub-sub-item:hover{
    color:#FFF!important;
    background:#1B2C43!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav>.sb-sub-nav .sb-sub-item.act,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-sub-sub-item.act{
    color:#FFE5A9!important;
    background:rgba(209,164,79,.13)!important;
    box-shadow:inset 0 0 0 1px rgba(209,164,79,.14)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-nav>.sb-sub-nav .sb-sub-item.act::before{background:#D1A44F!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav .sb-sub-sub-nav{border-right-color:#33475F!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav.collapsed{
    background:linear-gradient(180deg,#121E31 0%,#0C1625 100%)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav.collapsed .sb-toggle{
    color:#C7D3E1!important;
    border-color:transparent!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav.collapsed .sb-toggle:hover,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav.collapsed .nav-item:hover{
    color:#FFF!important;
    border-color:#33475F!important;
    background:#1A2A40!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav.collapsed .nav-item{color:#BFCBDA!important}
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav.collapsed .nav-item.active,
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav.collapsed .nav-item.open{
    color:#FFE5A9!important;
    background:rgba(209,164,79,.16)!important;
  }
  html[data-theme="dark"] body #sidebar.sidebar-flyout-nav.collapsed .sb-logout{
    color:#BFCBDA!important;
    border-color:transparent!important;
    background:transparent!important;
  }
  html body #sidebar.sidebar-flyout-nav.collapsed .sb-theme-toggle{
    width:48px!important;
    height:48px!important;
    margin-inline:auto!important;
    padding:0!important;
    justify-content:center!important;
  }
  html body #sidebar.sidebar-flyout-nav.collapsed .sb-theme-toggle .theme-toggle-label{display:none!important}
}

/* Responsive */
@media (max-width:1100px){
  .report-catalog,.report-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ui-kpi-strip,
  #page-vehicles .ui-kpi-strip,
  #page-hr .ui-kpi-strip,
  #page-finance .ui-kpi-strip,
  #page-reports .ui-kpi-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:768px){
  #opsMain>.container{padding:12px 10px 92px!important}
  .ui-module{gap:12px}
  .ui-module-head{min-height:0;padding:17px 16px;align-items:flex-start;flex-direction:column}
  .ui-module-head::before{inset-block:16px}
  .ui-module-title{gap:10px}
  .ui-module-icon{width:40px;height:40px;flex-basis:40px}
  .ui-module-head h1,.ui-module-head h2{font-size:22px}
  .ui-module-actions{width:100%}
  .ui-module-actions>.btn{flex:1}
  .ui-module-tabs,.ui-subtabs{margin-inline:-2px}
  .report-catalog,.report-card-grid{grid-template-columns:1fr}
  .report-card{min-height:110px}
  .theme-toggle .theme-label{display:none}
  .theme-toggle--mobile .theme-toggle-label{display:inline!important}
  #page-vehicles .vh-tabs,
  #page-hr>.tabs,
  #page-finance>.tabs{top:6px}
  html body .ops-mobile-nav{
    color:var(--u-txt)!important;
    background:color-mix(in srgb,var(--u-surface) 94%,transparent)!important;
    border-color:var(--u-border-strong)!important;
    box-shadow:var(--u-shadow-lift)!important;
  }
  html body .ops-mobile-nav>button{color:var(--u-txt-2)!important}
  html body .ops-mobile-nav>button.act{color:#fff!important;background:var(--u-brand-fill)!important}
  html body .ops-mobile-drawer{
    color:var(--u-txt)!important;
    background:var(--u-surface)!important;
    border-color:var(--u-border-strong)!important;
    box-shadow:var(--u-shadow-modal)!important;
  }
  html body .ops-mobile-drawer-head{background:var(--u-surface)!important;border-color:var(--u-border)!important}
  html body .ops-mobile-drawer-head strong{color:var(--u-txt)!important}
  html body .ops-mobile-drawer-head span,
  html body .ops-mobile-drawer-label{color:var(--u-txt-2)!important}
  html body .ops-mobile-drawer-close{
    color:var(--u-txt)!important;background:var(--u-surface-2)!important;border-color:var(--u-border)!important;
  }
  html body .ops-mobile-drawer-grid button{
    color:var(--u-txt)!important;background:var(--u-surface-2)!important;border-color:var(--u-border)!important;
  }
  html body .ops-mobile-drawer-grid button:active{background:var(--u-accent-bg)!important}
}
@media (max-width:480px){
  .ui-kpi-strip,
  #page-vehicles .ui-kpi-strip,
  #page-hr .ui-kpi-strip,
  #page-finance .ui-kpi-strip,
  #page-reports .ui-kpi-strip{grid-template-columns:1fr 1fr}
  .ui-module-actions{display:grid;grid-template-columns:1fr 1fr}
}

/* Final correction pass: retire the remaining hard-coded light surfaces and
   keep restored HR/navigation/login layers readable in both themes. */
html body #sidebar.sidebar-flyout-nav > .sb-section-label,
html body #sidebar.sidebar-flyout-nav .sb-nav > .sb-section-label{
  border:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
}
html body #sidebar.sidebar-flyout-nav > .sb-section-label::after,
html body #sidebar.sidebar-flyout-nav .sb-nav > .sb-section-label::after{
  content:none!important;
  display:none!important;
}

#opsMain #page-hr .hr-employee-view-tabs{
  color:var(--u-txt)!important;
  background:var(--u-surface-2)!important;
  border:1px solid var(--u-border)!important;
  box-shadow:none!important;
}
#opsMain #page-hr .hr-employee-view-tabs .tabx{
  color:var(--u-txt-2)!important;
  background:transparent!important;
  border-color:transparent!important;
}
#opsMain #page-hr .hr-employee-view-tabs .tabx:hover{
  color:var(--u-txt)!important;
  background:var(--u-surface-3)!important;
}
#opsMain #page-hr .hr-employee-view-tabs .tabx.act{
  color:#fff!important;
  background:var(--u-brand-fill)!important;
  border-color:var(--u-brand-fill)!important;
  box-shadow:var(--u-active-shadow)!important;
}

html[data-theme="dark"] body #opsMain #page-fuel .kpi-section{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  background-image:none!important;
  border-color:var(--u-border)!important;
  box-shadow:var(--u-shadow)!important;
}
html[data-theme="dark"] body #opsMain #page-fuel .kpi-section-header,
html[data-theme="dark"] body #opsMain #page-fuel .kpi-section-header:hover{
  color:var(--u-txt)!important;
  background:var(--u-surface-2)!important;
  background-image:none!important;
  border-bottom-color:var(--u-border)!important;
}
html[data-theme="dark"] body #opsMain #page-fuel .kpi-section-body{
  color:var(--u-txt)!important;
  background:var(--u-surface)!important;
  background-image:none!important;
}
html[data-theme="dark"] body #opsMain #page-fuel :is(
  .kpi-section-title,
  .kpi-section-title .ic,
  .metric-zone .mz-ttl
){color:var(--u-txt)!important}
html[data-theme="dark"] body #opsMain #page-fuel :is(
  .kpi-section-sub,
  .kpi-section-toggle,
  .kpi-section-toggle .ksec-chev,
  .metric-zone .mz-sub
){color:var(--u-txt-2)!important}
html[data-theme="dark"] body #opsMain #page-fuel .metric-zone .mz-line{
  background:var(--u-border-strong)!important;
}

.login-brand-panel{isolation:isolate}
.login-brand-panel::before,
.login-brand-panel::after{
  z-index:0!important;
  pointer-events:none!important;
}
.login-brand-panel > .login-brand-top,
.login-brand-panel > .login-brand-bottom,
.login-brand-panel .login-feature-grid{
  position:relative!important;
  z-index:2!important;
  opacity:1!important;
  visibility:visible!important;
}

#page-reports .rpt2-pane,
#page-reports #ownerRptContent,
#page-reports .rpt2-owner-report,
#page-reports .rpt2-panel{
  min-width:0;
  max-width:100%;
}
#page-reports .rpt2-btn.is-accent{
  color:var(--u-accent-ink)!important;
}

/* Print identity: always neutral light, independent of screen theme */
@media print{
  :root,:root[data-theme="dark"]{
    color-scheme:light!important;
    --u-bg:#fff;
    --u-surface:#fff;
    --u-surface-2:#F6F8FA;
    --u-border:#D8DEE6;
    --u-txt:#101828;
    --u-txt-2:#475467;
    --u-navy:#102A43;
    --u-navy-2:#173E67;
  }
  html,body{background:#fff!important;color:#101828!important}
  header#header,.sidebar,.lbar,.ops-mobile-nav,.theme-toggle,.no-print{display:none!important}
  #opsMain,main{margin:0!important;padding:0!important;background:#fff!important}
  .container{width:100%!important;max-width:none!important;padding:0!important}
  .ui-module-head,.ui-workspace,.sec,.panel,.chart-box,.kpi,.exec-card{
    background:#fff!important;color:#101828!important;box-shadow:none!important;border-color:#D8DEE6!important;
  }
  .ui-module-tabs,.ui-subtabs,.filters,.ui-module-actions{display:none!important}
  table{width:100%!important;border-collapse:collapse!important;font-size:9pt!important}
  thead{display:table-header-group!important}
  tfoot{display:table-footer-group!important}
  tr,img,.kpi,.exec-card,.report-card{break-inside:avoid!important;page-break-inside:avoid!important}
  thead th{background:#102A43!important;color:#fff!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  tbody td{background:#fff!important;color:#101828!important;border:1px solid #D8DEE6!important}
  a{color:#101828!important;text-decoration:none!important}
  @page{size:A4;margin:14mm 11mm 16mm}
}