/* NEXAR Ultimate Experience 5.0 · Stage 03
   Unified readable Arabic typography and semantic text roles.
   Keeps each module's v2.3 color identity and all existing workflows. */
:root{
 --nx5-type-xs:12px;--nx5-type-sm:13px;--nx5-type-base:14px;
 --nx5-type-md:15px;--nx5-type-lg:17px;--nx5-type-xl:21px;
 --nx5-type-heading:clamp(23px,2.15vw,32px);
 --nx5-type-display:clamp(29px,2.7vw,42px);
 --nx5-reading-height:1.85;
 --nx5-tone-primary:var(--nx5-primary-ink);
 --nx5-tone-secondary:var(--nx5-secondary-ink);
 --nx5-tone-support:var(--nx5-support-ink);
 --nx5-tone-action:var(--nx5-interactive-ink);
 --nx5-tone-critical:var(--nx5-danger-ink);
 --nx5-tone-warning:var(--nx5-warning-ink);
 --nx5-tone-positive:var(--nx5-number-positive);
 --nx5-tone-negative:var(--nx5-number-negative);
}
/* Semantic text utility classes are available to all application modules. */
.nx5-text-primary{color:var(--nx5-tone-primary)}
.nx5-text-secondary{color:var(--nx5-tone-secondary)}
.nx5-text-support{color:var(--nx5-tone-support)}
.nx5-text-action{color:var(--nx5-tone-action)}
.nx5-text-critical{color:var(--nx5-tone-critical)}
.nx5-text-warning{color:var(--nx5-tone-warning)}
.nx5-text-positive{color:var(--nx5-tone-positive)}
.nx5-text-negative{color:var(--nx5-tone-negative)}
.nx5-text-strong{font-weight:900}
.nx5-figure{font-variant-numeric:tabular-nums;unicode-bidi:isolate}
.nx5-bidi-isolate{unicode-bidi:isolate}
.nx5-identifier{direction:ltr;unicode-bidi:isolate;font-variant-numeric:tabular-nums}
.nx5-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Workspace headline: consistent emphasis in HR, Projects, Finance, Procurement, Fleet, Settings and Platform. */
.nx4-workspace .workspace-title .eyebrow{font-size:var(--nx5-type-xs);font-weight:900;line-height:1.65}
.nx4-workspace .workspace-title h1{font-size:var(--nx5-type-heading);font-weight:900;line-height:1.4;letter-spacing:-.012em}
.nx4-workspace .workspace-title p{font-size:var(--nx5-type-base);line-height:var(--nx5-reading-height);color:var(--nx5-tone-secondary);max-width:72ch}
.nx4-workspace .workspace-live{font-size:var(--nx5-type-xs);line-height:1.65}
.nx4-workspace .workspace-actions .button,.nx4-workspace .workspace-actions .icon-btn{font-size:var(--nx5-type-sm);font-weight:800;min-height:40px}
.nx4-workspace .topbar-title strong{font-size:var(--nx5-type-md);line-height:1.6}
.nx4-workspace .topbar-title small{font-size:var(--nx5-type-xs);color:var(--nx5-tone-support)}
.nx4-workspace .topbar .user-info strong{font-size:13px!important}
.nx4-workspace .topbar .user-info small{font-size:11px;line-height:1.65}
.nx4-workspace .topbar .company-pill{font-size:var(--nx5-type-sm)}
.nx4-workspace .sidebar-link{font-size:var(--nx5-type-sm);line-height:1.5;min-height:43px}
.nx4-workspace .sidebar-caption{font-size:var(--nx5-type-xs);line-height:1.5}
.nx4-workspace .panel-heading h3,.nx4-workspace .panel h3{font-size:var(--nx5-type-lg);line-height:1.55;font-weight:900}
.nx4-workspace .panel-heading p,.nx4-workspace .panel p{font-size:var(--nx5-type-sm);line-height:var(--nx5-reading-height);color:var(--nx5-tone-secondary)}
.nx4-workspace .recent-copy strong,.nx4-workspace .shortcut-row strong{font-size:var(--nx5-type-base);line-height:1.65}
.nx4-workspace .recent-copy small,.nx4-workspace .shortcut-row small{font-size:var(--nx5-type-xs);line-height:1.7;color:var(--nx5-tone-support)}
/* KPI vocabulary: hierarchy stays consistent regardless of the underlying module. */
.nx4-workspace .metric .metric-label,.nx4-workspace .metric small{font-size:var(--nx5-type-xs);line-height:1.75;color:var(--nx5-tone-secondary)}
.nx4-workspace .metric strong,.nx4-workspace .metric .metric-number{font-size:var(--nx5-type-display);line-height:1.3;font-weight:900;font-variant-numeric:tabular-nums}
.nx4-workspace .metric strong{overflow-wrap:anywhere}
/* Data density and copy. Long names wrap safely instead of clipping headings. */
.nx4-workspace .nx4-records th{font-size:var(--nx5-type-xs);font-weight:900;line-height:1.6}
.nx4-workspace .nx4-records td{font-size:var(--nx5-type-sm);line-height:1.85}
.nx4-workspace .nx4-records .record-card-headline strong{font-size:var(--nx5-type-base);line-height:1.6}
.nx4-workspace .nx4-records .record-card-headline small{font-size:var(--nx5-type-xs);line-height:1.6}
.nx4-workspace .nx4-records .record-card-fields dt{font-size:var(--nx5-type-xs);line-height:1.6;color:var(--nx5-tone-secondary)}
.nx4-workspace .nx4-records .record-card-fields dd{font-size:var(--nx5-type-sm);line-height:1.75;color:var(--nx5-tone-primary)}
.nx4-workspace .nx4-records .records-search .input{font-size:var(--nx5-type-base)}
.nx4-workspace .nx4-records .records-pagination{font-size:var(--nx5-type-xs);line-height:1.7}
/* Shared forms and dialogs. Override only legibility/focus/spacing, not layout or submit behavior. */
.nx4-workspace .dialog h2,.nx4-workspace .dialog-head h2{font-size:clamp(18px,1.6vw,22px);font-weight:900;line-height:1.5;color:var(--nx5-tone-primary)}
.nx4-workspace .dialog .form-label{font-size:var(--nx5-type-base);line-height:1.65;font-weight:800}
.nx4-workspace .dialog .form-help,.nx4-workspace .dialog .nx4-optional{font-size:var(--nx5-type-xs);line-height:1.75;color:var(--nx5-tone-secondary)}
.nx4-workspace .dialog .input,.nx4-workspace .dialog textarea,.nx4-workspace .dialog select{font-size:var(--nx5-type-base);line-height:1.65}
.nx4-workspace .dialog .button{font-size:var(--nx5-type-base);font-weight:800;min-height:42px}
.nx4-workspace .dialog input:focus-visible,.nx4-workspace .dialog select:focus-visible,.nx4-workspace .dialog textarea:focus-visible{outline:2px solid color-mix(in srgb,var(--app-accent) 75%,white);outline-offset:1px}
/* The main launcher must remain a functional app selector, not a decorative cover. */
.nx4-hub .section-heading h2{font-size:clamp(21px,2vw,27px);line-height:1.5;font-weight:900}
.nx4-hub .section-heading p{font-size:var(--nx5-type-base);line-height:var(--nx5-reading-height)}
.nx4-hub .app-card-copy strong{font-size:clamp(14px,1.25vw,17px);line-height:1.6}
.nx4-hub .app-card .app-card-description{font-size:var(--nx5-type-xs);line-height:1.75}
.nx4-hub .app-card .app-card-indicator,.nx4-hub .app-card .app-card-link{font-size:var(--nx5-type-xs);line-height:1.6}
/* Initial company selection and setup retain original forms/navigation. */
.company-grid .company-tile strong{font-size:var(--nx5-type-lg);line-height:1.6}
.company-grid .company-tile small{font-size:var(--nx5-type-sm);line-height:1.8}
.setup-card h1{font-size:var(--nx5-type-heading);line-height:1.4}
.setup-card>p{font-size:var(--nx5-type-base);line-height:1.85}
.setup-card .form-label{font-size:var(--nx5-type-base)}
.setup-card .input{font-size:var(--nx5-type-base);min-height:48px}
/* Screen-specific panels use distinct meaning and consistent readable type. */
.nx4-platform-console .nx4-platform-hero h1,.nx4-settings-console .nx4-settings-hero h1{font-size:clamp(21px,2.4vw,30px);line-height:1.45}
.nx4-platform-console .nx4-platform-hero p,.nx4-settings-console .nx4-settings-hero p{font-size:var(--nx5-type-base);line-height:1.8}
.nx4-platform-console .nx4-platform-state{font-size:var(--nx5-type-xs)}
.nx4-hr-operations .nx4-hr-op-record h4{font-size:var(--nx5-type-base);line-height:1.65}
.nx4-hr-operations .nx4-hr-op-record p,.nx4-hr-operations .nx4-hr-op-description{font-size:var(--nx5-type-xs);line-height:1.8}
.nx4-hr-exchange .nx4-hr-exchange-hero h2{font-size:clamp(20px,2vw,27px);line-height:1.5}
.nx4-hr-exchange .nx4-hr-exchange-panel>p{font-size:var(--nx5-type-sm)}
/* Keyboard & touch minimums; do not increase desktop row controls in dense mode unexpectedly. */
.nx4-hub a:focus-visible,.nx4-hub button:focus-visible,
.nx4-workspace button:focus-visible,.nx4-workspace a:focus-visible,
.company-tile:focus-visible,.setup-card button:focus-visible{outline:2px solid color-mix(in srgb,var(--app-accent,#397FC9) 70%,white);outline-offset:3px}
/* Dense tables may scroll but text remains legible on a 320px viewport. */
@media(max-width:700px){
 .nx4-workspace .workspace-title h1{font-size:clamp(22px,5.5vw,27px)}
 .nx4-workspace .workspace-title p{font-size:13px}
 .nx4-workspace .sidebar-link{min-height:44px}
 .nx4-hub .app-card-copy strong{font-size:14px}
 .nx4-hub .app-card .app-card-description{font-size:12px}
 .nx4-workspace .nx4-records .records-search .input,
 .nx4-workspace .dialog .input,
 .nx4-workspace .dialog textarea,
 .nx4-workspace .dialog select,
 .setup-card .input{font-size:16px;min-height:46px}
}
@media(max-width:359px){
 .nx4-workspace .workspace-title h1{font-size:21px}
 .nx4-hub .section-heading h2{font-size:20px}
 .nx4-workspace .workspace-actions .button{font-size:12px}
 .nx4-workspace .metric strong{font-size:28px}
}
@media(prefers-reduced-motion:reduce){
 .nx4-workspace .metric strong{animation:none}
}