/* NEXAR Ultimate Experience 5.0 · Stage 04 — meaning-driven SVG iconography.
   Same vector stroke system, stable accessible color meanings, distinct tinted focal layers.
   Decorative SVGs remain aria-hidden; parent buttons keep their accessible labels. */
:root{
 --nx5-icon-azure:#008FCB;
 --nx5-icon-indigo:#7440EC;
 --nx5-icon-royal:#2254E5;
 --nx5-icon-rose:#D83D68;
 --nx5-icon-orange:#CE681D;
 --nx5-icon-magenta:#A839B1;
 --nx5-icon-slate:#49678F;
 --nx5-icon-danger:#BB4162;
 --nx5-icon-warning:#A86928;
 --nx5-icon-success:#167D97;
 --nx5-icon-info:#2176B7;
 --nx5-icon-document:#3479A2;
 --nx5-icon-navigation:#637B9A;
}
:root[data-theme="dark"]{
 --nx5-icon-azure:#76D5FC;
 --nx5-icon-indigo:#BEA3FF;
 --nx5-icon-royal:#9AB7FF;
 --nx5-icon-rose:#FF91AC;
 --nx5-icon-orange:#FFB479;
 --nx5-icon-magenta:#EBA9EF;
 --nx5-icon-slate:#BFCEED;
 --nx5-icon-danger:#FF9FB8;
 --nx5-icon-warning:#F4C07F;
 --nx5-icon-success:#8CCEEA;
 --nx5-icon-info:#9AD7F8;
 --nx5-icon-document:#9AD1F6;
 --nx5-icon-navigation:#B9C8E1;
}
.nx5-vivid-icon{--nx5-icon-primary:var(--nx5-icon-navigation);--nx5-icon-accent:color-mix(in srgb,var(--nx5-icon-primary) 40%,white);color:var(--nx5-icon-primary);fill:none;flex:none;overflow:visible}
.nx5-vivid-icon .nx-vivid-halo{opacity:.035;pointer-events:none}
.nx5-vivid-icon .nx5-icon-accent{pointer-events:none;stroke-linecap:round;stroke-linejoin:round}
.nx5-icon-role--hr{--nx5-icon-primary:var(--nx5-icon-azure);--nx5-icon-accent:#56CDEC}
.nx5-icon-role--projects{--nx5-icon-primary:var(--nx5-icon-indigo);--nx5-icon-accent:#B7A6FF}
.nx5-icon-role--finance{--nx5-icon-primary:var(--nx5-icon-royal);--nx5-icon-accent:#72B4FF}
.nx5-icon-role--procurement{--nx5-icon-primary:var(--nx5-icon-rose);--nx5-icon-accent:#F58EA9}
.nx5-icon-role--fleet{--nx5-icon-primary:var(--nx5-icon-orange);--nx5-icon-accent:#F7B36D}
.nx5-icon-role--settings{--nx5-icon-primary:var(--nx5-icon-magenta);--nx5-icon-accent:#DC8BE8}
.nx5-icon-role--platform{--nx5-icon-primary:var(--nx5-icon-slate);--nx5-icon-accent:#96B6E2}
.nx5-icon-role--documents{--nx5-icon-primary:var(--nx5-icon-document);--nx5-icon-accent:#7DCEEF}
.nx5-icon-role--navigation{--nx5-icon-primary:var(--nx5-icon-navigation);--nx5-icon-accent:#90AECD}
.nx5-icon-role--danger{--nx5-icon-primary:var(--nx5-icon-danger);--nx5-icon-accent:#E3839C}
.nx5-icon-role--warning{--nx5-icon-primary:var(--nx5-icon-warning);--nx5-icon-accent:#E8BC82}
.nx5-icon-role--positive{--nx5-icon-primary:var(--nx5-icon-success);--nx5-icon-accent:#67C4DE}
.nx5-icon-role--info{--nx5-icon-primary:var(--nx5-icon-info);--nx5-icon-accent:#83CEEB}
.nx5-vivid-icon:is(.nx5-icon-role--hr,.nx5-icon-role--projects,.nx5-icon-role--finance,.nx5-icon-role--procurement,.nx5-icon-role--fleet,.nx5-icon-role--settings,.nx5-icon-role--platform) .nx-vivid-halo{opacity:.075}
/* Adopt the meaningful icon color without tinting the adjacent text. */
.nx4-workspace .sidebar-link .nx5-vivid-icon,
.nx4-workspace .topbar .nx5-vivid-icon,
.nx4-workspace .workspace-title-icon .nx5-vivid-icon,
.nx4-workspace .shortcut-icon .nx5-vivid-icon,
.nx4-workspace .metric-symbol .nx5-vivid-icon,
.nx4-hub .app-card .nx5-vivid-icon,
.nx4-hub .topbar .nx5-vivid-icon,
.nx4-workspace .record-card-icon .nx5-vivid-icon{color:var(--nx5-icon-primary)}
/* Some existing containers have a dark slate background; use brighter role colors. */
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--hr{--nx5-icon-primary:#78D9FF}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--projects{--nx5-icon-primary:#BC9DFD}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--finance{--nx5-icon-primary:#92B5FF}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--procurement{--nx5-icon-primary:#FF9AB6}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--fleet{--nx5-icon-primary:#FFB27A}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--settings{--nx5-icon-primary:#E3A4E9}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--platform{--nx5-icon-primary:#C6D3F2}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--navigation{--nx5-icon-primary:#BDD3EB}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--documents{--nx5-icon-primary:#8CD4FF}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--positive{--nx5-icon-primary:#8ED6EB}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--info{--nx5-icon-primary:#8AC9EE}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--danger{--nx5-icon-primary:#FF9AB4}
.nx4-workspace .sidebar .nx5-vivid-icon.nx5-icon-role--warning{--nx5-icon-primary:#F3CB87}
/* Distinct icon tiles per product accent. Highlight only icons, never fake data. */
.nx4-hub .app-card .app-icon,.nx4-workspace .workspace-title-icon{
 position:relative;isolation:isolate;
 background:color-mix(in srgb,var(--app-accent) 11%,var(--nx4-panel));
 border-color:color-mix(in srgb,var(--app-accent) 24%,var(--nx4-line-light));
}
.nx4-hub .app-card .app-icon::after,.nx4-workspace .workspace-title-icon::after{
 content:"";position:absolute;inset:auto 7px 5px auto;width:8px;height:3px;border-radius:12px;background:var(--app-accent);opacity:.52;z-index:-1;pointer-events:none}
.nx4-hub .app-card .app-icon .nx5-vivid-icon{width:clamp(23px,2vw,28px);height:clamp(23px,2vw,28px)}
.nx4-workspace .workspace-title-icon .nx5-vivid-icon{width:25px;height:25px}
.nx4-workspace .record-card-icon .nx5-vivid-icon{width:21px;height:21px}
.nx4-workspace .sidebar-link .nx5-vivid-icon{width:19px;height:19px}
.nx4-workspace .sidebar-link:hover .nx5-vivid-icon,
.nx4-workspace .sidebar-link.active .nx5-vivid-icon{filter:drop-shadow(0 0 3px color-mix(in srgb,var(--nx5-icon-primary) 38%,transparent))}
.nx5-vivid-icon{transition:color 150ms ease,filter 150ms ease}
@media(prefers-reduced-motion:reduce){.nx5-vivid-icon{transition:none!important}}
@media(max-width:620px){
 .nx4-hub .app-card .app-icon .nx5-vivid-icon{width:24px;height:24px}
 .nx4-workspace .sidebar-link .nx5-vivid-icon{width:20px;height:20px}
}
