/* Zedulex OS V18.0 Beta · Light/Dark theme foundation for priority modules. */
:root,
[data-theme="light"] {
  color-scheme: light;
  --ax-app-bg: #f5f6f4;
  --ax-shell-bg: #eef1ec;
  --ax-content-bg: #f8f9f6;
  --ax-surface: #ffffff;
  --ax-surface-soft: #f0f2ee;
  --ax-surface-raised: #fbfbf9;
  --ax-text-primary: #17191d;
  --ax-text-secondary: #3f474d;
  --ax-text-muted: #667078;
  --ax-text-inverse: #ffffff;
  --ax-border: #d3d9d0;
  --ax-border-soft: #e5e9e2;
  --ax-border-strong: #b7c0b3;
  --ax-shadow-sm: 0 8px 24px rgba(20, 24, 28, .07);
  --ax-shadow-md: 0 18px 48px rgba(20, 24, 28, .10);
  --ax-shadow-lg: 0 28px 80px rgba(20, 24, 28, .14);
  --ax-overlay-soft: rgba(23, 25, 29, .32);
  --ax-overlay-medium: rgba(23, 25, 29, .56);
  --ax-gradient-primary: linear-gradient(135deg, #36433f, #496879);
  --ax-gradient-soft: linear-gradient(135deg, var(--ax-content-bg), var(--ax-shell-bg));
  --ax-success: #2f7558;
  --ax-warning: #8a6820;
  --ax-danger: #9a3f3f;
  --ax-info: #496879;
  --ax-neutral: #667078;
  --ax-bg: var(--ax-app-bg);
  --ax-bg-muted: var(--ax-surface-soft);
  --ax-surface-elevated: var(--ax-surface-raised);
  --ax-text: var(--ax-text-primary);
  --ax-text-soft: var(--ax-text-muted);
  --ax-primary: #36433f;
  --ax-primary-soft: #e1e8e3;
  --ax-link-color: #36433f;
}

[data-theme="dark"],
[data-ax-theme="dark"],
[data-ax-theme="night"] {
  color-scheme: dark;
  --ax-app-bg: #08090b;
  --ax-shell-bg: #0e1114;
  --ax-content-bg: #101418;
  --ax-surface: #171b20;
  --ax-surface-soft: #11161a;
  --ax-surface-raised: #20262c;
  --ax-text-primary: #f4f3ee;
  --ax-text-secondary: #d2d6d2;
  --ax-text-muted: #a5ada8;
  --ax-text-inverse: #08090b;
  --ax-border: #333b42;
  --ax-border-soft: #252d33;
  --ax-border-strong: #4a555d;
  --ax-shadow-sm: 0 12px 30px rgba(0, 0, 0, .42);
  --ax-shadow-md: 0 24px 62px rgba(0, 0, 0, .52);
  --ax-shadow-lg: 0 38px 100px rgba(0, 0, 0, .62);
  --ax-overlay-soft: rgba(0, 0, 0, .42);
  --ax-overlay-medium: rgba(0, 0, 0, .66);
  --ax-gradient-primary: linear-gradient(135deg, #c4c8bd, #9bb9c9);
  --ax-gradient-soft: linear-gradient(135deg, var(--ax-content-bg), var(--ax-shell-bg));
  --ax-success: #7ec5a4;
  --ax-warning: #d5b76d;
  --ax-danger: #e29b9b;
  --ax-info: #9bb9c9;
  --ax-neutral: #a5ada8;
  --ax-bg: var(--ax-app-bg);
  --ax-bg-muted: var(--ax-surface-soft);
  --ax-surface-elevated: var(--ax-surface-raised);
  --ax-text: var(--ax-text-primary);
  --ax-text-soft: var(--ax-text-muted);
  --ax-primary: #c4c8bd;
  --ax-primary-soft: #2a302c;
  --ax-link-color: #dfe4dc;
}

:root,
[data-theme="light"],
[data-theme="dark"] {
  --ax-sidebar-bg: var(--ax-surface);
  --ax-sidebar-text: var(--ax-text-secondary);
  --ax-sidebar-muted: var(--ax-text-muted);
  --ax-sidebar-active-bg: var(--ax-primary-soft);
  --ax-sidebar-active-text: var(--ax-text-primary);
  --ax-topbar-bg: var(--ax-surface);
  --ax-topbar-text: var(--ax-text-primary);
  --ax-topbar-muted: var(--ax-text-muted);
  --ax-card-bg: var(--ax-surface);
  --ax-card-border: var(--ax-border-soft);
  --ax-table-bg: var(--ax-surface);
  --ax-table-header-bg: var(--ax-surface-soft);
  --ax-table-header-text: var(--ax-text-secondary);
  --ax-table-row-bg: var(--ax-surface);
  --ax-table-row-hover-bg: var(--ax-surface-soft);
  --ax-table-text: var(--ax-text-primary);
  --ax-table-muted: var(--ax-text-muted);
  --ax-table-border: var(--ax-border-soft);
  --ax-neutral-bg: var(--ax-surface-soft);
  --ax-success-bg: color-mix(in srgb, var(--ax-success) 14%, transparent);
  --ax-warning-bg: color-mix(in srgb, var(--ax-warning) 16%, transparent);
  --ax-danger-bg: color-mix(in srgb, var(--ax-danger) 14%, transparent);
  --ax-info-bg: color-mix(in srgb, var(--ax-info) 14%, transparent);
  --ax-button-bg: var(--ax-surface-raised);
  --ax-button-text: var(--ax-text-primary);
  --ax-button-border: var(--ax-border);
  --ax-button-primary-bg: var(--ax-primary);
  --ax-button-primary-text: var(--ax-text-inverse);
  --ax-button-secondary-bg: var(--ax-primary-soft);
  --ax-button-secondary-text: var(--ax-text-primary);
  --svc-bg: var(--ax-app-bg);
  --svc-bg-muted: var(--ax-surface-soft);
  --svc-surface: var(--ax-surface);
  --svc-surface-raised: var(--ax-surface-raised);
  --svc-surface-soft: var(--ax-surface-soft);
  --svc-border: var(--ax-border);
  --svc-border-strong: var(--ax-border-strong);
  --svc-text: var(--ax-text-primary);
  --svc-text-secondary: var(--ax-text-secondary);
  --svc-text-muted: var(--ax-text-muted);
  --svc-accent: var(--ax-primary);
  --svc-accent-strong: var(--ax-link-color);
  --svc-accent-soft: var(--ax-primary-soft);
  --svc-success: var(--ax-success);
  --svc-warning: var(--ax-warning);
  --svc-danger: var(--ax-danger);
  --svc-info: var(--ax-info);
  --svc-neutral: var(--ax-neutral);
  --svc-neutral-soft: var(--ax-neutral-bg);
  --rest-bg: var(--ax-app-bg);
  --rest-surface: var(--ax-surface);
  --rest-surface-soft: var(--ax-surface-soft);
  --rest-border: var(--ax-border);
  --rest-text: var(--ax-text-primary);
  --rest-text-muted: var(--ax-text-muted);
  --rest-accent: var(--ax-primary);
  --rest-success: var(--ax-success);
  --rest-warning: var(--ax-warning);
  --rest-danger: var(--ax-danger);
  --rest-shadow-sm: var(--ax-shadow-sm);
}

.ax-theme-toggle{display:inline-flex;align-items:center;gap:.4rem;min-height:36px;border:1px solid var(--ax-border);border-radius:999px;background:var(--ax-surface);color:var(--ax-text-primary);padding:.38rem .68rem;font-weight:850;cursor:pointer}.ax-theme-toggle:hover{background:var(--ax-surface-soft)}.ax-theme-toggle__icon{font-size:1rem}.ax-theme-toggle__label{font-size:.78rem}


/* V18.4 Beta safe-unload bridge: minimal legacy-independent shell/component fallbacks.
 * Keep this block token-only so axolux-theme.css can become optional after module validation. */
:root {
  --ax-radius-sm: 10px;
  --ax-radius-md: 14px;
  --ax-radius-lg: 20px;
  --ax-radius-xl: 28px;
  --ax-shell-sidebar-rail: linear-gradient(180deg, color-mix(in srgb, var(--ax-primary) 20%, transparent) 0%, color-mix(in srgb, var(--ax-primary) 6%, transparent) 100%);
  --ax-shell-backdrop: color-mix(in srgb, var(--ax-app-bg) 62%, transparent);
  --ax-content-surface: linear-gradient(180deg, color-mix(in srgb, var(--ax-surface) 74%, transparent), color-mix(in srgb, var(--ax-content-bg) 92%, transparent));
  --ax-page-header-bg: linear-gradient(180deg, color-mix(in srgb, var(--ax-surface) 52%, transparent), color-mix(in srgb, var(--ax-content-bg) 94%, transparent));
  --ax-accent: var(--ax-primary);
  --ax-accent-hover: var(--ax-link-color);
  --ax-accent-soft: var(--ax-primary-soft);
  --ax-accent-border: color-mix(in srgb, var(--ax-primary) 42%, var(--ax-border));
  --ax-accent-focus: color-mix(in srgb, var(--ax-primary) 30%, transparent);
  --ax-alert-bg: var(--ax-surface);
  --ax-alert-border: var(--ax-border);
  --ax-empty-state-bg: var(--ax-surface);
  --ax-empty-state-border: var(--ax-border-soft);
  --ax-form-bg: var(--ax-surface);
  --ax-form-border: var(--ax-border);
  --ax-form-focus: var(--ax-accent-focus);
}

/* Zedulex OS V17.1 Beta · Global Axolux design system and shell
 *
 * Official global CSS source of truth. Owns ax-* tokens, base shell, sidebar,
 * topbar, cards, buttons, forms, tables, badges, breadcrumbs, empty states and
 * minimal svc-* compatibility aliases. axolux-theme.css must load before this
 * file and only provide legacy presets/aliases.
 */
:root,
[data-theme="light"] {
  --ax-bg:#f5f6f4;--ax-bg-muted:#eceeeb;--ax-surface:#ffffff;--ax-surface-elevated:#fbfbf9;--ax-border:#d9ddd6;--ax-border-soft:#e8ebe6;--ax-text:#17191d;--ax-text-muted:#555d63;--ax-text-soft:#7b8389;--ax-primary:#3f4d49;--ax-primary-soft:#e7ece8;--ax-success:#2f7558;--ax-warning:#8a6820;--ax-danger:#9a3f3f;--ax-info:#496879;--ax-radius-sm:10px;--ax-radius-md:14px;--ax-radius-lg:20px;--ax-radius-xl:28px;--ax-shadow-sm:0 8px 24px rgba(20,24,28,.07);--ax-shadow-md:0 18px 48px rgba(20,24,28,.10);--ax-shadow-lg:0 28px 80px rgba(20,24,28,.14);--ax-sidebar-width:280px;--ax-topbar-height:72px;color-scheme:light;
  --svc-bg:var(--ax-bg);--svc-bg-muted:var(--ax-bg-muted);--svc-surface:var(--ax-surface);--svc-surface-raised:var(--ax-surface-elevated);--svc-surface-soft:var(--ax-bg-muted);--svc-border:var(--ax-border);--svc-border-strong:var(--ax-border-strong);--svc-text:var(--ax-text);--svc-text-secondary:var(--ax-text-muted);--svc-text-muted:var(--ax-text-soft);--svc-accent:var(--ax-primary);--svc-accent-strong:var(--ax-link-color);--svc-accent-soft:var(--ax-primary-soft);--svc-success:var(--ax-success);--svc-warning:var(--ax-warning);--svc-danger:var(--ax-danger);--svc-info:var(--ax-info);--svc-neutral:var(--ax-text-muted);--svc-neutral-soft:var(--ax-bg-muted);--svc-radius-sm:var(--ax-radius-md);--svc-radius-md:var(--ax-radius-lg);--svc-radius-lg:var(--ax-radius-xl);--svc-shadow-sm:var(--ax-shadow-sm);--svc-shadow-md:var(--ax-shadow-md);--svc-container:1240px;--svc-button-height:42px;
}
[data-theme="dark"],
[data-ax-theme="dark"],
[data-ax-theme="night"] {
  --ax-bg:#0b0d0f;--ax-bg-muted:#111417;--ax-surface:#171a1e;--ax-surface-elevated:#1e2227;--ax-border:#30363b;--ax-border-soft:#242a2f;--ax-text:#f3f4ef;--ax-text-muted:#c4cac6;--ax-text-soft:#949d9b;--ax-primary:#a8b8b0;--ax-primary-soft:#26302c;--ax-success:#7ec5a4;--ax-warning:#d5b76d;--ax-danger:#e29b9b;--ax-info:#9bb9c9;--ax-shadow-sm:0 10px 26px rgba(0,0,0,.32);--ax-shadow-md:0 20px 56px rgba(0,0,0,.42);--ax-shadow-lg:0 34px 90px rgba(0,0,0,.52);color-scheme:dark;
  --svc-bg:var(--ax-bg);--svc-bg-muted:var(--ax-bg-muted);--svc-surface:var(--ax-surface);--svc-surface-raised:var(--ax-surface-elevated);--svc-surface-soft:var(--ax-bg-muted);--svc-border:var(--ax-border);--svc-border-strong:var(--ax-border-strong);--svc-text:var(--ax-text);--svc-text-secondary:var(--ax-text-muted);--svc-text-muted:var(--ax-text-soft);--svc-accent:var(--ax-primary);--svc-accent-strong:var(--ax-link-color);--svc-accent-soft:var(--ax-primary-soft);--svc-success:var(--ax-success);--svc-warning:var(--ax-warning);--svc-danger:var(--ax-danger);--svc-info:var(--ax-info);--svc-neutral:var(--ax-text-muted);--svc-neutral-soft:var(--ax-bg-muted);
}

/* V17.1 Beta · semantic global token ledger aliases; global components below consume ax-* tokens only. */
:root {
  --ax-text-primary: var(--ax-text);
  --ax-text-secondary: color-mix(in srgb, var(--ax-text) 76%, var(--ax-bg));
  --ax-text-muted: color-mix(in srgb, var(--ax-text) 58%, var(--ax-bg));
  --ax-text-soft: color-mix(in srgb, var(--ax-text) 44%, var(--ax-bg));
  --ax-text-inverse: var(--ax-surface);
  --ax-heading-color: var(--ax-text-primary);
  --ax-label-color: var(--ax-text-secondary);
  --ax-placeholder-color: var(--ax-text-muted);
  --ax-link-color: var(--ax-primary);
  --ax-app-bg: var(--ax-bg);
  --ax-shell-bg: var(--ax-bg);
  --ax-content-bg: var(--ax-bg);
  --ax-sidebar-bg: var(--ax-surface);
  --ax-sidebar-text: var(--ax-text-muted);
  --ax-sidebar-muted: var(--ax-text-soft);
  --ax-sidebar-active-bg: var(--ax-primary-soft);
  --ax-sidebar-active-text: var(--ax-text);
  --ax-topbar-bg: var(--ax-bg);
  --ax-topbar-text: var(--ax-text);
  --ax-topbar-muted: var(--ax-text-muted);
  --ax-surface-soft: var(--ax-bg-muted);
  --ax-surface-raised: var(--ax-surface-elevated);
  --ax-card-bg: var(--ax-surface);
  --ax-card-border: var(--ax-border-soft);
  --ax-border-strong: var(--ax-border);
  --ax-table-bg: var(--ax-surface);
  --ax-table-header-bg: var(--ax-bg-muted);
  --ax-table-header-text: var(--ax-text-muted);
  --ax-table-row-bg: var(--ax-surface);
  --ax-table-row-hover-bg: var(--ax-bg-muted);
  --ax-table-text: var(--ax-text);
  --ax-table-muted: var(--ax-text-soft);
  --ax-table-border: var(--ax-border-soft);
  --ax-neutral: var(--ax-text-muted);
  --ax-success-bg: color-mix(in srgb, var(--ax-success) 14%, transparent);
  --ax-warning-bg: color-mix(in srgb, var(--ax-warning) 16%, transparent);
  --ax-danger-bg: color-mix(in srgb, var(--ax-danger) 14%, transparent);
  --ax-info-bg: color-mix(in srgb, var(--ax-info) 14%, transparent);
  --ax-neutral-bg: var(--ax-bg-muted);
  --ax-button-bg: var(--ax-surface-raised);
  --ax-button-text: var(--ax-text-primary);
  --ax-button-border: var(--ax-border);
  --ax-button-primary-bg: var(--ax-primary);
  --ax-button-primary-text: var(--ax-text-inverse);
  --ax-button-secondary-bg: var(--ax-primary-soft);
  --ax-button-secondary-text: var(--ax-text-primary);
  --ax-overlay-soft: color-mix(in srgb, var(--ax-neutral) 38%, transparent);
  --ax-overlay-medium: color-mix(in srgb, var(--ax-neutral) 58%, transparent);
  --ax-gradient-primary: linear-gradient(135deg, var(--ax-primary), var(--ax-link-color));
  --ax-gradient-soft: linear-gradient(135deg, var(--ax-surface), var(--ax-surface-elevated));
  --ax-login-bg-fallback: radial-gradient(circle at 10% 15%, color-mix(in srgb, var(--ax-primary) 24%, transparent), transparent 35%), radial-gradient(circle at 85% 10%, color-mix(in srgb, var(--ax-info) 20%, transparent), transparent 40%), linear-gradient(152deg, var(--ax-app-bg) 0%, var(--ax-shell-bg) 60%, var(--ax-content-bg) 100%);
  --ax-login-overlay-default: linear-gradient(120deg, color-mix(in srgb, var(--ax-app-bg) 72%, transparent), color-mix(in srgb, var(--ax-app-bg) 42%, transparent));
  --ax-surface-translucent: color-mix(in srgb, var(--ax-surface) 92%, transparent);
  --ax-border-translucent: color-mix(in srgb, var(--ax-border) 62%, transparent);
}

*{box-sizing:border-box} html{background:var(--ax-bg)} body{margin:0;background:var(--ax-app-bg);color:var(--ax-text-primary);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif} a{color:inherit} :focus-visible{outline:3px solid color-mix(in srgb,var(--ax-primary) 70%,transparent);outline-offset:3px}.ax-app{min-height:100dvh;background:var(--ax-gradient-soft);color:var(--ax-text)}
.ax-shell{display:grid!important;grid-template-columns:var(--ax-sidebar-width) minmax(0,1fr);min-height:100dvh;background:transparent!important;gap:0}.ax-sidebar{position:sticky;top:0;height:100dvh;display:flex!important;flex-direction:column;gap:1rem;padding:1rem;border-right:1px solid var(--ax-border-soft)!important;background:var(--ax-surface-translucent)!important;box-shadow:none!important;backdrop-filter:blur(18px);overflow:hidden}.ax-sidebar-header,.ax-brand-block{display:flex;align-items:center;gap:.78rem;min-height:56px;padding:.55rem;border-radius:var(--ax-radius-lg);text-decoration:none;color:var(--ax-text)!important}.ax-brand-fallback,.ax-brand-logo{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:var(--ax-primary);color:var(--ax-surface);font-weight:850;object-fit:cover}.ax-brand-meta{display:grid;min-width:0}.ax-brand-meta strong{font-size:1rem;line-height:1.1}.ax-brand-meta small{color:var(--ax-text-soft);font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ax-sidebar-nav,.ax-nav{display:grid;gap:.28rem;align-content:start;overflow:auto;padding:.15rem .15rem .4rem;scrollbar-width:thin}.ax-sidebar-item,.ax-nav-item{display:flex!important;align-items:center;gap:.72rem;min-height:42px;padding:.62rem .75rem;border:1px solid transparent!important;border-radius:var(--ax-radius-md)!important;background:transparent!important;color:var(--ax-text-muted)!important;text-decoration:none!important;font-weight:700;line-height:1.2;transition:background .16s ease,border-color .16s ease,color .16s ease}.ax-sidebar-item:hover,.ax-nav-item:hover{background:var(--ax-bg-muted)!important;color:var(--ax-text)!important}.ax-sidebar-item.active,.ax-nav-item.active,.ax-nav-item[aria-current="page"]{background:var(--ax-primary-soft)!important;border-color:color-mix(in srgb,var(--ax-primary) 22%,transparent)!important;color:var(--ax-text)!important}.ax-icon{width:1.35rem;text-align:center;opacity:.9}.ax-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ax-sidebar-footer,.ax-nav-footer{margin-top:auto;padding-top:.75rem;border-top:1px solid var(--ax-border-soft)}.ax-nav-form{margin:0}.ax-main{min-width:0;display:flex;flex-direction:column;min-height:100dvh;background:transparent!important}.ax-topbar,.ax-header{position:sticky;top:0;z-index:20;min-height:var(--ax-topbar-height);display:flex;align-items:center;gap:1rem;padding:.85rem 1.3rem;border-bottom:1px solid var(--ax-border-soft)!important;background:color-mix(in srgb,var(--ax-topbar-bg) 84%,transparent)!important;box-shadow:none!important;backdrop-filter:blur(18px)}.ax-header-left{display:flex;align-items:center;gap:.6rem}.ax-mobile-menu-toggle{width:42px;height:42px;border:1px solid var(--ax-border);border-radius:var(--ax-radius-md);background:var(--ax-surface);color:var(--ax-text);font-size:1.05rem}.ax-topnav{display:flex;align-items:center;gap:.4rem;overflow:auto;scrollbar-width:thin}.ax-tab{border-radius:999px!important;border:1px solid var(--ax-border-soft)!important;background:var(--ax-surface)!important;color:var(--ax-text-muted)!important;text-decoration:none!important;padding:.56rem .86rem!important;font-weight:750;white-space:nowrap}.ax-tab:hover,.ax-tab.active{background:var(--ax-primary-soft)!important;color:var(--ax-text)!important;border-color:color-mix(in srgb,var(--ax-primary) 24%,transparent)!important}.ax-header-actions{margin-left:auto;display:flex;align-items:center;gap:.75rem;min-width:0}.ax-topbar-search{min-width:min(360px,32vw);position:relative}.ax-topbar-search input,.ax-input,.ax-select,.ax-form input,.ax-form select,.ax-form textarea,.svc-input,.svc-form input,.svc-form select,.svc-form textarea{width:100%;min-height:42px;border:1px solid var(--ax-border)!important;border-radius:999px;background:var(--ax-surface)!important;color:var(--ax-text)!important;padding:.62rem .9rem}.ax-build-chip,.ax-user-menu{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--ax-border-soft);border-radius:999px;background:var(--ax-surface);color:var(--ax-text-muted);padding:.48rem .72rem;font-weight:800;font-size:.78rem}.ax-content,.ax-page{flex:1;min-width:0;padding:1.25rem clamp(1rem,2.2vw,2rem)!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}.ax-content-body{max-width:1440px;margin:0 auto;width:100%;display:grid;gap:1rem}.ax-page-header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1rem}.ax-page-title{margin:0;color:var(--ax-text);font-size:clamp(1.6rem,2.7vw,2.45rem);letter-spacing:-.035em}.ax-page-subtitle{margin:.25rem 0 0;color:var(--ax-text-muted)}.ax-toolbar{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}.ax-card,.ax-stat-card,.ax-section,.ax-panel,.svc-card,.svc-section,.svc-stat-card{border:1px solid var(--ax-border-soft)!important;border-radius:var(--ax-radius-xl)!important;background:var(--ax-surface)!important;color:var(--ax-text)!important;box-shadow:var(--ax-shadow-sm)!important}.ax-card,.ax-section,.ax-panel,.svc-card,.svc-section{padding:1rem}.ax-stat-card{padding:1rem;display:grid;gap:.35rem}.ax-grid,.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.ax-btn,.svc-btn,.svc-btn-secondary,.svc-btn-primary,.svc-btn-danger,button.ax-btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:42px;padding:.62rem 1rem;border-radius:var(--ax-radius-md)!important;border:1px solid var(--ax-border)!important;background:var(--ax-button-bg)!important;color:var(--ax-button-text)!important;text-decoration:none!important;font-weight:800}.ax-btn-primary,.svc-btn-primary{background:var(--ax-button-primary-bg)!important;border-color:var(--ax-button-primary-bg)!important;color:var(--ax-button-primary-text)!important}.ax-btn-secondary{background:var(--ax-button-secondary-bg)!important;color:var(--ax-button-secondary-text)!important}.ax-btn-ghost{background:transparent!important}.ax-btn-danger,.svc-btn-danger{background:var(--ax-danger)!important;border-color:var(--ax-danger)!important;color:var(--ax-text-inverse)!important}.ax-table,.svc-table,table.ax-table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden}.ax-table th,.ax-table td,.svc-table th,.svc-table td{border-bottom:1px solid var(--ax-border-soft)!important;padding:.82rem .9rem!important;text-align:left;vertical-align:top}.ax-table th,.svc-table th{background:var(--ax-bg-muted)!important;color:var(--ax-text-muted)!important;font-size:.78rem;text-transform:uppercase;letter-spacing:.045em}.ax-form,.svc-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1rem;align-items:end}.ax-field,.svc-field{display:grid;gap:.4rem;color:var(--ax-text-muted);font-weight:750}.ax-badge,.svc-badge,.svc-badge-status{display:inline-flex;align-items:center;gap:.35rem;border:1px solid var(--ax-border-soft);border-radius:999px;background:var(--ax-bg-muted);color:var(--ax-text);padding:.32rem .62rem;font-size:.78rem;font-weight:850}.ax-empty-state,.svc-empty-state{border:1px dashed var(--ax-border);border-radius:var(--ax-radius-xl);background:var(--ax-surface-elevated);color:var(--ax-text-muted);padding:1.4rem;text-align:center}
.ax-breadcrumbs,.ax-shell-breadcrumbs{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;color:var(--ax-text-muted);font-size:.82rem;font-weight:750}.ax-breadcrumbs a,.ax-shell-breadcrumbs a{color:var(--ax-link-color);text-decoration:none}.ax-breadcrumbs a:hover,.ax-shell-breadcrumbs a:hover{color:var(--ax-text);text-decoration:underline}
.ax-tabs,.svc-tabs{display:flex;gap:.5rem;overflow:auto}.ax-modal,.ax-drawer{background:var(--ax-surface);color:var(--ax-text);border:1px solid var(--ax-border);border-radius:var(--ax-radius-xl);box-shadow:var(--ax-shadow-lg)}
.svc-page,.services-dashboard,.services-orders-page,.services-calendar-page,.services-reports-page,.services-portal-page,.services-demo-page,.services-templates-page,.services-recurrences-page,.services-notifications-page{max-width:var(--svc-container);margin:0 auto;color:var(--ax-text)}.svc-page-header,.services-dashboard-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin:0 0 1rem;padding:1rem;border:1px solid var(--ax-border-soft);border-radius:var(--ax-radius-xl);background:var(--ax-gradient-soft);box-shadow:var(--ax-shadow-sm)}.svc-page-header h1,.services-dashboard-head h1{margin:0;color:var(--ax-text);font-size:clamp(1.55rem,2.3vw,2.35rem);letter-spacing:-.03em}.svc-muted,.svc-page-header p,.services-dashboard-head p{color:var(--ax-text-muted)}.svc-toolbar,.ax-quick-links,.services-ticket-filter-actions{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}.services-kpi-grid,.services-urgent-grid,.services-two-col,.services-ticket-context-grid,.services-lite-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}.services-lite-portal,.svc-mobile-shell{min-height:100dvh;background:var(--ax-bg);color:var(--ax-text)}.ax-table-wrap,.services-dashboard-table-wrap{overflow:auto}.services-lite-portal__bottom-nav{border-top:1px solid var(--ax-border);background:color-mix(in srgb,var(--ax-surface) 92%,transparent);backdrop-filter:blur(14px)}
@media (max-width:1023px){.ax-shell{grid-template-columns:1fr}.ax-sidebar{position:fixed;inset:0 auto 0 0;z-index:60;width:min(var(--ax-sidebar-width),86vw);transform:translateX(-104%);transition:transform .2s ease;box-shadow:var(--ax-shadow-lg)!important}.ax-shell.is-sidebar-open .ax-sidebar,body.sidebar-open .ax-sidebar{transform:translateX(0)}.ax-sidebar-backdrop{position:fixed;inset:0;z-index:50;background:var(--ax-overlay-soft);border:0;display:none}.ax-shell.is-sidebar-open .ax-sidebar-backdrop,body.sidebar-open .ax-sidebar-backdrop{display:block}.ax-topbar{padding:.75rem 1rem}.ax-topbar-search{min-width:0;flex:1}.ax-topnav{max-width:42vw}}@media (max-width:720px){.ax-topbar{gap:.55rem;flex-wrap:wrap}.ax-header-actions{order:3;width:100%;margin-left:0}.ax-topbar-search{min-width:100%}.ax-topnav{max-width:calc(100vw - 5.5rem)}.ax-content{padding:1rem!important}.svc-page-header,.services-dashboard-head,.ax-page-header{display:grid}.ax-grid,.services-kpi-grid,.services-urgent-grid,.services-two-col{grid-template-columns:1fr}.ax-table,.svc-table{min-width:680px}}

/* Zedulex OS V16.5 Beta · Contrast, full-width layout and true charcoal dark mode refinement */
:root,
[data-theme="light"] {
  --ax-bg:#f3f4f1;--ax-bg-muted:#e7e9e4;--ax-surface:#ffffff;--ax-surface-elevated:#fafaf8;
  --ax-border:#cfd4cc;--ax-border-soft:#dfe3dc;--ax-text:#111417;--ax-text-muted:#3f474d;--ax-text-soft:#606a70;
  --ax-primary:#36433f;--ax-primary-soft:#e1e8e3;--ax-success:#23684d;--ax-warning:#795915;--ax-danger:#8f3232;--ax-info:#405f6e;
  --ax-shadow-sm:0 10px 26px rgba(18,22,24,.10);--ax-shadow-md:0 20px 54px rgba(18,22,24,.14);--ax-shadow-lg:0 32px 88px rgba(18,22,24,.18);
  --svc-container:min(100%, 1680px);--svc-border-strong:#b8c0b5;--svc-text-secondary:var(--ax-text-muted);--svc-text-muted:var(--ax-text-soft);
}
[data-theme="dark"],
[data-ax-theme="dark"],
[data-ax-theme="night"] {
  --ax-bg:#070707;--ax-bg-muted:#0f0f10;--ax-surface:#171717;--ax-surface-elevated:#1f1f1f;
  --ax-border:#363636;--ax-border-soft:#292929;--ax-text:#f4f3ee;--ax-text-muted:#d2d0c9;--ax-text-soft:#aaa7a0;
  --ax-primary:#c4c8bd;--ax-primary-soft:#2a2d28;--ax-success:#86c6a4;--ax-warning:#d2b45e;--ax-danger:#df8d8d;--ax-info:#b8bdb5;
  --ax-shadow-sm:0 12px 30px rgba(0,0,0,.46);--ax-shadow-md:0 24px 62px rgba(0,0,0,.56);--ax-shadow-lg:0 38px 100px rgba(0,0,0,.66);
  --svc-bg:var(--ax-bg);--svc-bg-muted:var(--ax-bg-muted);--svc-surface:var(--ax-surface);--svc-surface-raised:var(--ax-surface-elevated);--svc-surface-soft:#121212;
  --svc-border:var(--ax-border);--svc-border-strong:#4a4a4a;--svc-text:var(--ax-text);--svc-text-secondary:var(--ax-text-muted);--svc-text-muted:var(--ax-text-soft);
  --svc-accent:var(--ax-primary);--svc-accent-strong:#e0e2da;--svc-accent-soft:var(--ax-primary-soft);--svc-info:#b8bdb5;--svc-info-soft:#242520;--svc-neutral-soft:#242424;
}
.ax-app{background:var(--ax-gradient-soft)!important}.ax-shell{grid-template-columns:260px minmax(0,1fr)}
.ax-sidebar{background:color-mix(in srgb,var(--ax-surface-elevated) 96%,var(--ax-bg))!important;border-right-color:var(--ax-border)!important;padding:.85rem!important}.ax-sidebar-item,.ax-nav-item{color:var(--ax-text-muted)!important}.ax-sidebar-item:hover,.ax-nav-item:hover{background:var(--ax-bg-muted)!important;border-color:var(--ax-border-soft)!important;color:var(--ax-text)!important}.ax-sidebar-item.active,.ax-nav-item.active,.ax-nav-item[aria-current="page"]{background:var(--ax-primary-soft)!important;border-color:color-mix(in srgb,var(--ax-primary) 38%,var(--ax-border))!important;color:var(--ax-text)!important}.ax-sidebar-footer{border-top-color:var(--ax-border)!important}.ax-icon svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ax-topbar,.ax-header{width:100%;padding:.65rem clamp(1rem,1.8vw,1.6rem)!important;background:color-mix(in srgb,var(--ax-surface) 90%,transparent)!important;border-bottom-color:var(--ax-border)!important}.ax-topnav{flex:1;max-width:none}.ax-header-actions{flex:0 1 auto}.ax-topbar-search{min-width:clamp(260px,28vw,520px)}
.ax-content,.ax-page{padding:1rem clamp(1rem,1.65vw,1.8rem)!important}.ax-content-body{max-width:none!important;margin:0!important;gap:1.05rem}.svc-page,.services-dashboard,.services-orders-page,.services-calendar-page,.services-reports-page,.services-portal-page,.services-demo-page,.services-templates-page,.services-recurrences-page,.services-notifications-page{max-width:min(100%,1680px)!important;width:100%!important;margin:0!important}
.ax-page-subtitle,.ax-muted,.svc-muted,small,.ax-breadcrumbs,.ax-shell-breadcrumbs,.svc-page-header p,.services-dashboard-head p{color:var(--ax-text-muted)!important}.ax-field,.svc-field,.ax-form label,.svc-form label,.services-dashboard label{color:var(--ax-text-muted)!important;font-weight:800!important}.ax-page-title,h1,h2,h3{color:var(--ax-text)!important}.ax-card,.ax-stat-card,.ax-section,.ax-panel,.svc-card,.svc-section,.svc-stat-card,.services-kpi-card,.services-ticket-card,.services-lite-kpi-card,.services-lite-card,.services-cal-day,.services-cal-event{border-color:var(--ax-border)!important;background:var(--ax-surface)!important;box-shadow:var(--ax-shadow-sm)!important}.svc-page-header,.services-dashboard-head{border-color:var(--ax-border)!important;background:var(--ax-gradient-soft)!important;box-shadow:var(--ax-shadow-sm)!important}
.ax-tab,.svc-tabs a,.services-mobile-tabs a{min-height:38px;border:1px solid var(--ax-border)!important;background:var(--ax-surface-elevated)!important;color:var(--ax-text-muted)!important;padding:.5rem .82rem!important;border-radius:999px!important;font-weight:850!important}.ax-tab:hover,.svc-tabs a:hover,.services-mobile-tabs a:hover{color:var(--ax-text)!important;border-color:color-mix(in srgb,var(--ax-primary) 35%,var(--ax-border))!important;background:var(--ax-primary-soft)!important}.ax-tab.active,.svc-tabs a.active,.services-mobile-tabs a.active{background:var(--ax-button-primary-bg)!important;border-color:var(--ax-button-primary-bg)!important;color:var(--ax-button-primary-text)!important}.ax-badge,.svc-badge,.svc-badge-status,.ax-build-chip,.ax-user-menu{border-color:var(--ax-border)!important;background:var(--ax-bg-muted)!important;color:var(--ax-text)!important}
.ax-topbar-search input,.ax-input,.ax-select,.ax-form input,.ax-form select,.ax-form textarea,.svc-input,.svc-form input,.svc-form select,.svc-form textarea,.services-dashboard :is(input,select,textarea),.services-lite-portal :is(input,select,textarea){border-color:var(--ax-border)!important;background:var(--ax-surface)!important;color:var(--ax-text)!important;box-shadow:inset 0 1px 0 var(--ax-border-translucent)}::placeholder{color:var(--ax-text-soft)!important;opacity:1}.ax-topbar-search input:focus,.ax-input:focus,.ax-form input:focus,.ax-form select:focus,.ax-form textarea:focus{border-color:color-mix(in srgb,var(--ax-primary) 55%,var(--ax-border))!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--ax-primary) 14%,transparent)!important;outline:0}
.ax-table,.svc-table,.ax-main table{border:1px solid var(--ax-border)!important;border-radius:var(--ax-radius-lg);background:var(--ax-surface)!important;box-shadow:var(--ax-shadow-sm);overflow:hidden}.ax-table th,.svc-table th,.ax-main table th{background:var(--ax-bg-muted)!important;color:var(--ax-text)!important;border-bottom:1px solid var(--ax-border)!important;font-weight:900!important}.ax-table td,.svc-table td,.ax-main table td{color:var(--ax-text-muted)!important;border-bottom:1px solid var(--ax-border-soft)!important}.ax-table tbody tr:nth-child(even),.svc-table tbody tr:nth-child(even),.ax-main table tbody tr:nth-child(even){background:color-mix(in srgb,var(--ax-bg-muted) 45%,transparent)}.ax-table tbody tr:hover,.svc-table tbody tr:hover,.ax-main table tbody tr:hover{background:var(--ax-primary-soft)!important}.ax-empty-state,.svc-empty-state,.services-mobile-empty{border-color:var(--ax-border)!important;background:var(--ax-surface-elevated)!important;color:var(--ax-text-muted)!important}.ax-btn,.svc-btn,.svc-btn-secondary,.svc-btn-primary,.svc-btn-danger,button{border-color:var(--ax-border)!important;color:var(--ax-text)!important}.ax-btn-primary,.svc-btn-primary,.ax-main button[type="submit"]{background:var(--ax-button-primary-bg)!important;border-color:var(--ax-button-primary-bg)!important;color:var(--ax-button-primary-text)!important}
[data-theme="dark"] .ax-sidebar,[data-ax-theme="dark"] .ax-sidebar,[data-ax-theme="night"] .ax-sidebar{background:var(--ax-shell-bg)!important}[data-theme="dark"] .ax-topbar,[data-ax-theme="dark"] .ax-topbar,[data-ax-theme="night"] .ax-topbar{background:var(--ax-topbar-bg)!important}[data-theme="dark"] .ax-card,[data-theme="dark"] .ax-panel,[data-theme="dark"] .svc-card,[data-theme="dark"] .svc-section{background:var(--ax-card-bg)!important}
@media (min-width:1440px){.services-kpi-grid,.ax-grid,.svc-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.services-two-col{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1023px){.ax-shell{grid-template-columns:1fr}.ax-topnav{flex:0 1 auto;max-width:48vw}.ax-topbar-search{min-width:0}}

/* V17.7 Beta — priority module UI hardcode cleanup helpers.
   Scoped to Dashboard, Administración and Super Admin surfaces; no shell/sidebar/topbar behavior changes. */
.ax-dashboard-home,
.container {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: clamp(1rem, 4vw, 3rem);
  background: var(--ax-app-bg);
  color: var(--ax-text-primary);
}
.container > .card {
  width: min(100%, 720px);
  border: 1px solid var(--ax-border);
  border-radius: var(--ax-radius-xl);
  background: var(--ax-surface);
  color: var(--ax-text-primary);
  box-shadow: var(--ax-shadow-md);
  padding: clamp(1.25rem, 4vw, 2rem);
}
.container > .card h1 { margin-top: 0; color: var(--ax-text-primary); }
.container > .card .subtitle,
.container > .card p { color: var(--ax-text-muted); }
.container > .card button,
.container > .card .danger {
  min-height: 42px;
  border: 1px solid var(--ax-border);
  border-radius: var(--ax-radius-md);
  background: var(--ax-button-bg);
  color: var(--ax-button-text);
  padding: .62rem 1rem;
  font-weight: 800;
}
.container > .card .danger { background: var(--ax-danger); border-color: var(--ax-danger); color: var(--ax-text-inverse); }
.ax-super-updates-summary { margin: 1rem 0; }
.ax-super-updates-technical { margin-top: 1rem; }
.ax-super-updates-grid { margin-top: 1rem; }
.ax-super-updates-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: .75rem; align-items: stretch; }
.ax-super-updates-action { width: 100%; min-height: 44px; }
.ax-admin-confirm-form { margin-top: .75rem; }
.ax-admin-checkbox-row { display: flex; gap: .5rem; align-items: center; }

/* =========================================================
 * V17.9 Beta · Final priority UI hardcode sweep before V18.0
 * Scoped to active priority modules. Keeps shell/sidebar behavior stable and
 * relies on ax-* / svc-* / rest-* tokens instead of component hardcodes.
 * ======================================================= */
:root {
  --rest-bg: var(--ax-app-bg);
  --rest-surface: var(--ax-surface);
  --rest-surface-soft: var(--ax-surface-soft);
  --rest-border: var(--ax-border);
  --rest-text: var(--ax-text-primary);
  --rest-text-muted: var(--ax-text-muted);
  --rest-accent: var(--ax-accent, var(--ax-primary));
  --rest-success: var(--ax-success);
  --rest-warning: var(--ax-warning);
  --rest-danger: var(--ax-danger);
  --rest-shadow-sm: var(--ax-shadow-sm);
}

.ax-shell .ax-main,
.ax-shell .ax-content,
.ax-shell .ax-content-body {
  min-width: 0;
}

.ax-breadcrumbs,
.ax-shell-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
  margin: 0 0 1rem;
  color: var(--ax-text-muted);
  overflow-wrap: anywhere;
}

.ax-breadcrumbs a {
  color: var(--ax-link-color, var(--ax-primary));
  text-decoration: none;
}

.ax-breadcrumbs span[aria-current='page'] {
  color: var(--ax-text-primary);
  font-weight: 800;
}

.ax-super-updates-summary,
.ax-super-updates-technical,
.ax-super-updates-grid,
.ax-admin-confirm-form,
.ax-dashboard-home .card,
.container > .card {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.ax-super-updates-actions > form,
.ax-super-updates-actions > .ax-btn,
.ax-super-updates-actions > button {
  min-width: 0;
}

.ax-super-updates-actions button,
.ax-super-updates-action {
  white-space: normal;
}

.ax-table-wrap,
.services-dashboard-table-wrap,
[data-module='restaurants'] .table-wrap {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.ax-empty-state,
.svc-empty-state,
.services-mobile-empty {
  line-height: 1.55;
}

@media (max-width: 1023px) {
  .ax-sidebar-backdrop {
    pointer-events: none;
  }

  .ax-shell.is-sidebar-open .ax-sidebar-backdrop,
  body.sidebar-open .ax-sidebar-backdrop {
    pointer-events: auto;
  }

  .ax-shell.is-sidebar-open .ax-main,
  body.sidebar-open .ax-main {
    visibility: visible;
  }
}

@media (max-width: 720px) {
  .ax-header,
  .ax-topbar {
    max-width: 100vw;
  }

  .ax-header-actions,
  .ax-topnav,
  .ax-topnav-services {
    min-width: 0;
  }

  .ax-build-chip,
  .ax-user-menu {
    max-width: 100%;
  }

  .ax-super-updates-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .ax-card,
  .ax-section,
  .ax-panel,
  .svc-card,
  .svc-section {
    overflow-wrap: anywhere;
  }
}


/* =========================================================
 * V17.9 Beta · Final priority UI hardcode sweep before V18.0
 * Adds only token-backed visual guardrails for priority modules. Dark mode is
 * not activated here; these aliases prepare the V18.0 token surface.
 * Remaining !important usages in this file are intentional cascade guards
 * against legacy module CSS and do not change business behavior.
 * ======================================================= */
:root {
  --ax-v18-token-prep-status: ready;
  --ax-priority-empty-bg: var(--ax-surface-raised);
  --ax-priority-status-success-bg: var(--ax-success-bg);
  --ax-priority-status-warning-bg: var(--ax-warning-bg);
  --ax-priority-status-danger-bg: var(--ax-danger-bg);
  --ax-priority-status-info-bg: var(--ax-info-bg);
}

.ax-dashboard-home .card,
.ax-dashboard-home .ax-card,
.ax-dashboard-home .ax-stat-card,
.ax-main [data-module='dashboard'] :is(.card, .kpi, .panel, .table-wrap),
.ax-main [data-module='admin'] :is(.card, .panel, .table-wrap, form),
.ax-main [data-module='super'] :is(.card, .panel, .table-wrap, form),
.ax-main [data-module='restaurants'] :is(.card, .panel, .table-wrap, form),
.rest-card,
.rest-panel,
.rest-table-wrap {
  background: var(--ax-surface) !important;
  border-color: var(--ax-border) !important;
  color: var(--ax-text-primary) !important;
  box-shadow: var(--ax-shadow-sm) !important;
}

.ax-main [data-module='dashboard'] :is(.empty, .empty-state),
.ax-main [data-module='admin'] :is(.empty, .empty-state),
.ax-main [data-module='super'] :is(.empty, .empty-state),
.ax-main [data-module='restaurants'] :is(.empty, .empty-state),
.rest-empty-state {
  background: var(--ax-priority-empty-bg) !important;
  border-color: var(--ax-border-soft) !important;
  color: var(--ax-text-muted) !important;
}

.ax-main [data-module='dashboard'] :is(table, .table),
.ax-main [data-module='admin'] :is(table, .table),
.ax-main [data-module='super'] :is(table, .table),
.ax-main [data-module='restaurants'] :is(table, .table),
.rest-table {
  background: var(--ax-table-bg) !important;
  color: var(--ax-table-text) !important;
  border-color: var(--ax-table-border) !important;
}

.ax-main [data-module='dashboard'] :is(th, .table-header),
.ax-main [data-module='admin'] :is(th, .table-header),
.ax-main [data-module='super'] :is(th, .table-header),
.ax-main [data-module='restaurants'] :is(th, .table-header),
.rest-table th {
  background: var(--ax-table-header-bg) !important;
  color: var(--ax-table-header-text) !important;
  border-color: var(--ax-table-border) !important;
}

.ax-main [data-module='dashboard'] :is(input, select, textarea),
.ax-main [data-module='admin'] :is(input, select, textarea),
.ax-main [data-module='super'] :is(input, select, textarea),
.ax-main [data-module='restaurants'] :is(input, select, textarea),
.rest-form :is(input, select, textarea) {
  background: var(--ax-surface) !important;
  border-color: var(--ax-border) !important;
  color: var(--ax-text-primary) !important;
}

.ax-main [data-module='dashboard'] :is(.btn, button),
.ax-main [data-module='admin'] :is(.btn, button),
.ax-main [data-module='super'] :is(.btn, button),
.ax-main [data-module='restaurants'] :is(.btn, button),
.rest-btn {
  background: var(--ax-button-bg) !important;
  border-color: var(--ax-button-border) !important;
  color: var(--ax-button-text) !important;
}

.ax-super-updates-summary,
.ax-super-updates-technical,
.ax-super-updates-grid {
  background: var(--ax-surface) !important;
  color: var(--ax-text-primary) !important;
  border-color: var(--ax-border) !important;
}

/* =========================================================
 * V18.1 Beta · Carbon demo-ready priority module hardening.
 * Token-only pass for Dashboard, Services shell, Administration and Super Admin.
 * ======================================================= */
:root,
[data-theme="light"] {
  --ax-app-bg: #f4f4f4;
  --ax-shell-bg: #ffffff;
  --ax-content-bg: #f7f7f7;
  --ax-surface: #ffffff;
  --ax-surface-soft: #f4f4f4;
  --ax-surface-raised: #ffffff;
  --ax-text-primary: #161616;
  --ax-text-secondary: #393939;
  --ax-text-muted: #6f6f6f;
  --ax-border: #e0e0e0;
  --ax-border-soft: #e8e8e8;
  --ax-border-strong: #c6c6c6;
  --ax-accent: #0f62fe;
  --ax-success: #24a148;
  --ax-warning: #f1c21b;
  --ax-danger: #da1e28;
  --ax-info: #0043ce;
  --ax-shadow-sm: 0 2px 8px rgba(22,22,22,.08);
  --ax-shadow-md: 0 8px 24px rgba(22,22,22,.10);
  --ax-shadow-lg: 0 16px 48px rgba(22,22,22,.14);
  --ax-bg: var(--ax-app-bg);
  --ax-bg-muted: var(--ax-surface-soft);
  --ax-text: var(--ax-text-primary);
  --ax-text-soft: var(--ax-text-muted);
  --ax-primary: var(--ax-accent);
  --ax-primary-soft: #edf5ff;
  --ax-link-color: var(--ax-accent);
  --ax-text-inverse: #ffffff;
  --ax-surface-elevated: var(--ax-surface-raised);
}

[data-theme="dark"],
[data-ax-theme="dark"],
[data-ax-theme="night"] {
  --ax-app-bg: #161616;
  --ax-shell-bg: #262626;
  --ax-content-bg: #1f1f1f;
  --ax-surface: #262626;
  --ax-surface-soft: #393939;
  --ax-surface-raised: #333333;
  --ax-text-primary: #f4f4f4;
  --ax-text-secondary: #c6c6c6;
  --ax-text-muted: #a8a8a8;
  --ax-border: #525252;
  --ax-border-soft: #393939;
  --ax-border-strong: #6f6f6f;
  --ax-accent: #78a9ff;
  --ax-success: #42be65;
  --ax-warning: #f1c21b;
  --ax-danger: #ff8389;
  --ax-info: #82cfff;
  --ax-shadow-sm: 0 2px 10px rgba(0,0,0,.35);
  --ax-shadow-md: 0 10px 28px rgba(0,0,0,.44);
  --ax-shadow-lg: 0 18px 56px rgba(0,0,0,.52);
  --ax-bg: var(--ax-app-bg);
  --ax-bg-muted: var(--ax-surface-soft);
  --ax-text: var(--ax-text-primary);
  --ax-text-soft: var(--ax-text-muted);
  --ax-primary: var(--ax-accent);
  --ax-primary-soft: rgba(120,169,255,.16);
  --ax-link-color: var(--ax-accent);
  --ax-text-inverse: #161616;
  --ax-surface-elevated: var(--ax-surface-raised);
}

:root,
[data-theme="light"],
[data-theme="dark"] {
  --ax-sidebar-bg: var(--ax-shell-bg);
  --ax-topbar-bg: var(--ax-shell-bg);
  --ax-card-bg: var(--ax-surface);
  --ax-card-border: var(--ax-border);
  --ax-button-bg: var(--ax-surface-raised);
  --ax-button-text: var(--ax-text-primary);
  --ax-button-border: var(--ax-border-strong);
  --ax-button-primary-bg: var(--ax-accent);
  --ax-button-primary-text: #ffffff;
  --ax-button-secondary-bg: var(--ax-primary-soft);
  --ax-button-secondary-text: var(--ax-text-primary);
  --ax-table-bg: var(--ax-surface);
  --ax-table-header-bg: var(--ax-surface-soft);
  --ax-table-header-text: var(--ax-text-secondary);
  --ax-table-row-bg: var(--ax-surface);
  --ax-table-row-hover-bg: color-mix(in srgb, var(--ax-accent) 10%, var(--ax-surface));
  --ax-table-text: var(--ax-text-primary);
  --ax-table-muted: var(--ax-text-muted);
  --ax-table-border: var(--ax-border);
  --ax-success-bg: color-mix(in srgb, var(--ax-success) 14%, transparent);
  --ax-warning-bg: color-mix(in srgb, var(--ax-warning) 20%, transparent);
  --ax-danger-bg: color-mix(in srgb, var(--ax-danger) 14%, transparent);
  --ax-info-bg: color-mix(in srgb, var(--ax-info) 14%, transparent);
}

.ax-shell { background: var(--ax-app-bg) !important; }
.ax-sidebar,
.ax-topbar,
.ax-header { background: color-mix(in srgb, var(--ax-shell-bg) 92%, transparent) !important; }
.ax-content { background: var(--ax-content-bg) !important; }
.ax-card,
.ax-panel,
.ax-section,
.ax-stat-card,
.ax-dashboard-home .card,
.ax-main [data-module='dashboard'] :is(.card,.kpi,.panel,.table-wrap),
.ax-main [data-module='admin'] :is(.card,.panel,.table-wrap,form),
.ax-main [data-module='super'] :is(.card,.panel,.table-wrap,form),
.ax-super-updates-summary,
.ax-super-updates-technical,
.ax-super-updates-grid {
  background: var(--ax-surface) !important;
  border: 1px solid var(--ax-border) !important;
  color: var(--ax-text-primary) !important;
  box-shadow: var(--ax-shadow-sm) !important;
}
.ax-card:hover,
.ax-panel:hover,
.ax-dashboard-home .card:hover { box-shadow: var(--ax-shadow-md) !important; }
.ax-main :is(.ax-page-subtitle,.ax-muted,small,help,p.help),
.ax-dashboard-home :is(.muted,.text-muted),
.ax-main [data-module='admin'] :is(.muted,.text-muted),
.ax-main [data-module='super'] :is(.muted,.text-muted) { color: var(--ax-text-muted) !important; }
.ax-main :is(input,select,textarea),
.ax-main [data-module='admin'] :is(input,select,textarea),
.ax-main [data-module='super'] :is(input,select,textarea) {
  background: var(--ax-surface-raised) !important;
  border-color: var(--ax-border-strong) !important;
  color: var(--ax-text-primary) !important;
}
.ax-main :is(.ax-btn-primary,button[type='submit'],.btn-primary) {
  background: var(--ax-button-primary-bg) !important;
  border-color: var(--ax-button-primary-bg) !important;
  color: var(--ax-button-primary-text) !important;
}
.ax-main :is(table,.ax-table) { background: var(--ax-table-bg) !important; border-color: var(--ax-table-border) !important; }
.ax-main :is(th,.ax-table th) { background: var(--ax-table-header-bg) !important; color: var(--ax-table-header-text) !important; }
.ax-main :is(td,.ax-table td) { color: var(--ax-table-muted) !important; border-bottom-color: var(--ax-table-border) !important; }
.ax-empty-state,
.svc-empty-state,
.empty-state,
.svc-empty {
  background: var(--ax-surface-raised) !important;
  border: 1px dashed var(--ax-border-strong) !important;
  color: var(--ax-text-muted) !important;
}
@media (max-width: 1024px) {
  .ax-shell { grid-template-columns: minmax(0, 1fr) !important; }
  .ax-sidebar { background: var(--ax-shell-bg) !important; }
  .ax-sidebar-backdrop { background: rgba(22,22,22,.48) !important; }
  .ax-shell:not(.is-sidebar-open) .ax-sidebar { transform: translateX(-105%); }
  .ax-shell.is-sidebar-open .ax-sidebar,
  body.sidebar-open .ax-sidebar { transform: translateX(0); }
  .ax-main { min-width: 0; width: 100%; visibility: visible !important; }
}

/* V18.5 Beta · Shell and Super Admin visual unification.
 * Scoped token-only overrides that keep legacy axolux-theme.css loaded while
 * making the authenticated shell, Super Admin tabs and /super/updates cohesive.
 */
:root {
  --ax-sidebar-width: 292px;
  --ax-topbar-height: 76px;
}

.ax-app,
.ax-shell,
.ax-main,
.ax-content {
  background: var(--ax-app-bg) !important;
}

.ax-shell {
  grid-template-columns: var(--ax-sidebar-width) minmax(0, 1fr) !important;
}

.ax-sidebar {
  width: var(--ax-sidebar-width) !important;
  padding: 1rem !important;
  gap: .85rem !important;
  background: var(--ax-sidebar-bg) !important;
  border-right: 1px solid var(--ax-border) !important;
  box-shadow: var(--ax-shadow-sm) !important;
  overflow: hidden !important;
}

.ax-sidebar-header,
.ax-brand-block {
  min-height: 64px !important;
  padding: .7rem !important;
  gap: .82rem !important;
  border: 1px solid var(--ax-border-soft) !important;
  background: var(--ax-surface-raised) !important;
}

.ax-brand-logo,
.ax-brand-fallback {
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  border-radius: var(--ax-radius-md) !important;
}

.ax-brand-meta strong,
.ax-label {
  color: var(--ax-text-primary) !important;
}

.ax-brand-meta small {
  color: var(--ax-text-muted) !important;
}

.ax-sidebar-nav,
.ax-nav {
  gap: .34rem !important;
  padding: .1rem .12rem .45rem !important;
}

.ax-sidebar-item,
.ax-nav-item {
  min-height: 46px !important;
  width: 100% !important;
  padding: .68rem .82rem !important;
  gap: .76rem !important;
  color: var(--ax-sidebar-text) !important;
  border-color: transparent !important;
}

.ax-sidebar-item .ax-icon,
.ax-nav-item .ax-icon {
  display: inline-grid !important;
  place-items: center !important;
  width: 1.45rem !important;
  min-width: 1.45rem !important;
  color: var(--ax-text-secondary) !important;
  opacity: 1 !important;
}

.ax-sidebar-item .ax-icon svg,
.ax-nav-item .ax-icon svg {
  width: 1.25rem !important;
  height: 1.25rem !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.ax-sidebar-item:hover,
.ax-nav-item:hover {
  background: var(--ax-surface-soft) !important;
  color: var(--ax-text-primary) !important;
  border-color: var(--ax-border-soft) !important;
}

.ax-sidebar-item.active,
.ax-sidebar-item.is-active,
.ax-nav-item.active,
.ax-nav-item.is-active,
.ax-nav-item[aria-current="page"] {
  background: var(--ax-primary-soft) !important;
  color: var(--ax-sidebar-active-text) !important;
  border-color: var(--ax-border-strong) !important;
}

.ax-sidebar-item.active .ax-icon,
.ax-sidebar-item.is-active .ax-icon,
.ax-nav-item.active .ax-icon,
.ax-nav-item.is-active .ax-icon {
  color: var(--ax-primary) !important;
}

.ax-sidebar-footer,
.ax-nav-footer {
  padding-top: .85rem !important;
  border-top: 1px solid var(--ax-border) !important;
}

.ax-nav-logout {
  min-height: 48px !important;
  background: var(--ax-surface-raised) !important;
  border-color: var(--ax-border) !important;
}

.ax-topbar,
.ax-header {
  min-height: var(--ax-topbar-height) !important;
  padding: .9rem clamp(1rem, 2vw, 1.6rem) !important;
  gap: .9rem !important;
  background: var(--ax-topbar-bg) !important;
  border-bottom: 1px solid var(--ax-border) !important;
  box-shadow: var(--ax-shadow-sm) !important;
}

.ax-topnav {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  gap: .42rem !important;
  padding-block: .15rem !important;
  scrollbar-width: none !important;
}

.ax-topnav::-webkit-scrollbar {
  display: none !important;
}

.ax-tab,
.ax-topnav-dropbtn {
  min-height: 40px !important;
  border-radius: var(--ax-radius-md) !important;
  background: var(--ax-surface-raised) !important;
  border-color: var(--ax-border) !important;
  color: var(--ax-text-secondary) !important;
}

.ax-tab:hover,
.ax-tab.active,
.ax-tab.is-active,
.ax-topnav-dropbtn.active,
.ax-topnav-dropbtn.is-active {
  background: var(--ax-primary-soft) !important;
  color: var(--ax-text-primary) !important;
  border-color: var(--ax-border-strong) !important;
}

.ax-header-actions {
  flex: 0 1 auto !important;
  gap: .55rem !important;
}

.ax-topbar-search {
  flex: 1 1 280px !important;
  min-width: 220px !important;
  max-width: 420px !important;
}

.ax-topbar-search input {
  border-radius: var(--ax-radius-md) !important;
  background: var(--ax-surface-raised) !important;
}

.ax-theme-toggle,
.ax-build-chip,
.ax-user-menu {
  min-height: 38px !important;
  border-color: var(--ax-border) !important;
  background: var(--ax-surface-raised) !important;
  color: var(--ax-text-secondary) !important;
  white-space: nowrap !important;
}

.ax-content {
  padding: clamp(1rem, 2vw, 2rem) !important;
  background: var(--ax-content-bg) !important;
}

.ax-content-body {
  max-width: 1480px !important;
  gap: 1.15rem !important;
}

.ax-shell-breadcrumbs {
  max-width: 1480px !important;
  margin: 0 auto 1rem !important;
  padding: .75rem .95rem !important;
  border: 1px solid var(--ax-border) !important;
  border-radius: var(--ax-radius-md) !important;
  background: var(--ax-surface) !important;
  color: var(--ax-text-muted) !important;
}

.ax-shell-breadcrumbs a {
  color: var(--ax-text-secondary) !important;
  text-decoration: none !important;
}

.ax-shell-breadcrumbs span[aria-current="page"] {
  color: var(--ax-text-primary) !important;
  font-weight: 800 !important;
}

.ax-table-wrap {
  width: 100% !important;
  overflow: auto !important;
  border: 1px solid var(--ax-table-border) !important;
  border-radius: var(--ax-radius-lg) !important;
  background: var(--ax-table-bg) !important;
}

.ax-table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.ax-table th,
.ax-table td {
  padding: .85rem .95rem !important;
  text-align: left !important;
  vertical-align: top !important;
  border-bottom: 1px solid var(--ax-table-border) !important;
}

.ax-table th {
  background: var(--ax-table-header-bg) !important;
  color: var(--ax-table-header-text) !important;
  font-size: .78rem !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

.ax-table tr:last-child td {
  border-bottom: 0 !important;
}

.ax-super-updates-page {
  display: grid !important;
  gap: 1.1rem !important;
  padding: clamp(1rem, 2vw, 1.5rem) !important;
  background: var(--ax-surface) !important;
  border-color: var(--ax-border) !important;
}

.ax-super-updates-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  padding-bottom: 1rem !important;
  border-bottom: 1px solid var(--ax-border) !important;
}

.ax-super-updates-header h1 {
  margin: .1rem 0 .35rem !important;
  color: var(--ax-text-primary) !important;
  font-size: clamp(1.8rem, 3vw, 2.55rem) !important;
  letter-spacing: -.04em !important;
}

.ax-super-updates-header p {
  margin: 0 !important;
  max-width: 820px !important;
  color: var(--ax-text-secondary) !important;
}

.ax-eyebrow {
  margin: 0 !important;
  color: var(--ax-text-muted) !important;
  font-size: .78rem !important;
  font-weight: 850 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.ax-super-updates-summary {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: .75rem !important;
  padding: 1rem !important;
  background: var(--ax-surface-raised) !important;
}

.ax-super-updates-summary div,
.ax-super-updates-metric {
  min-width: 0 !important;
}

.ax-super-updates-summary small,
.ax-super-updates-metric small {
  display: block !important;
  margin-bottom: .28rem !important;
  color: var(--ax-text-muted) !important;
  font-weight: 800 !important;
}

.ax-super-updates-summary strong,
.ax-super-updates-metric strong {
  display: block !important;
  color: var(--ax-text-primary) !important;
  overflow-wrap: anywhere !important;
}

.ax-super-updates-grid {
  gap: .85rem !important;
}

.ax-super-updates-metric {
  border-radius: var(--ax-radius-lg) !important;
  box-shadow: none !important;
}

.ax-super-updates-technical {
  background: var(--ax-surface-raised) !important;
}

.ax-super-updates-technical summary {
  cursor: pointer !important;
  color: var(--ax-text-primary) !important;
}

.ax-super-updates-actions {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  gap: .75rem !important;
}

.ax-super-updates-actions .ax-inline-form,
.ax-super-updates-actions .ax-btn {
  width: 100% !important;
}

.ax-super-updates-action {
  min-height: 46px !important;
  border-radius: var(--ax-radius-md) !important;
  background: var(--ax-button-bg) !important;
  border-color: var(--ax-button-border) !important;
  color: var(--ax-button-text) !important;
}

.ax-super-updates-action:hover {
  background: var(--ax-primary-soft) !important;
  color: var(--ax-text-primary) !important;
}

.ax-super-updates-logs .ax-table td:last-child {
  min-width: 260px !important;
  overflow-wrap: anywhere !important;
}

/* V18.7 Beta · Desktop shell breakpoint and sidebar restoration.
 * The mobile drawer must not activate above 1023px; desktop keeps a fixed
 * two-column shell so Super Admin and /super/updates do not inherit mobile flow.
 */
@media (min-width: 1024px) {
  .ax-shell {
    grid-template-columns: var(--ax-sidebar-width) minmax(0, 1fr) !important;
  }

  .ax-sidebar {
    position: sticky !important;
    inset: auto !important;
    top: 0 !important;
    z-index: auto !important;
    width: var(--ax-sidebar-width) !important;
    height: 100dvh !important;
    transform: none !important;
    transition: none !important;
  }

  .ax-sidebar .ax-label {
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .ax-sidebar .ax-brand-meta {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .ax-sidebar-footer,
  .ax-nav-footer {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .ax-sidebar-item,
  .ax-nav-item,
  .ax-nav-logout {
    display: flex !important;
    justify-content: flex-start !important;
  }

  .ax-mobile-menu-toggle {
    display: none !important;
  }

  .ax-sidebar-backdrop {
    display: none !important;
  }

  .ax-topbar,
  .ax-header {
    flex-wrap: nowrap !important;
  }

  .ax-topnav {
    order: initial !important;
    flex: 1 1 auto !important;
    flex-basis: auto !important;
    max-width: none !important;
  }

  .ax-header-actions {
    order: initial !important;
    width: auto !important;
    margin-left: auto !important;
    flex-wrap: nowrap !important;
  }

  .ax-content,
  .ax-page {
    min-width: 0 !important;
  }
}

@media (max-width: 1023px) {
  .ax-shell {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .ax-sidebar {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    z-index: 60 !important;
    transform: translateX(-105%) !important;
    transition: transform .2s ease !important;
  }

  body.ax-sidebar-open .ax-sidebar,
  .ax-sidebar[data-mobile-open="true"] {
    transform: translateX(0) !important;
  }

  .ax-sidebar-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 50 !important;
    display: none !important;
    background: var(--ax-overlay-soft) !important;
    border: 0 !important;
  }

  body.ax-sidebar-open .ax-sidebar-backdrop {
    display: block !important;
  }

  .ax-mobile-menu-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .ax-topbar,
  .ax-header {
    flex-wrap: wrap !important;
  }

  .ax-topnav {
    order: 3 !important;
    flex-basis: 100% !important;
  }

  .ax-header-actions {
    margin-left: auto !important;
  }
}

@media (max-width: 860px) {
  .ax-header-actions,
  .ax-topbar-search {
    flex-basis: 100% !important;
    max-width: none !important;
  }

  .ax-header-actions {
    flex-wrap: wrap !important;
  }

  .ax-super-updates-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .ax-super-updates-header {
    flex-direction: column !important;
  }
}

@media (max-width: 560px) {
  :root {
    --ax-sidebar-width: min(88vw, 292px);
  }

  .ax-content {
    padding: .85rem !important;
  }

  .ax-super-updates-summary,
  .ax-super-updates-actions {
    grid-template-columns: 1fr !important;
  }

  .ax-build-chip,
  .ax-user-menu {
    max-width: 100% !important;
  }
}

/* V18.8 Beta · Addon Space
 * Addon Space is the shell-owned area where an addon or module renders its
 * internal content. Addons may style descendants inside this area, but must not
 * control body, sidebar, topbar, header, main shell, or global layout geometry.
 */
.ax-addon-space,
.ax-module-space,
.ax-content-canvas {
  width: 100%;
  max-width: var(--ax-content-max-width, 1440px);
  min-height: calc(100vh - var(--ax-topbar-height, 72px) - (var(--ax-space-6, 1.5rem) * 2));
  margin-inline: auto;
  padding: clamp(1rem, 2vw, 1.5rem);
  overflow: clip;
  color: var(--ax-text-primary);
  background: var(--ax-content-surface, transparent);
  border: 1px solid color-mix(in srgb, var(--ax-border) 72%, transparent);
  border-radius: var(--ax-radius-xl, 24px);
  box-shadow: var(--ax-shadow-soft);
}

.ax-addon-space > *,
.ax-module-space > *,
.ax-content-canvas > * {
  max-width: 100%;
}

@media (max-width: 720px) {
  .ax-addon-space,
  .ax-module-space,
  .ax-content-canvas {
    min-height: calc(100vh - var(--ax-topbar-height, 64px) - 1rem);
    padding: .85rem;
    border-radius: var(--ax-radius-lg, 18px);
    overflow-x: auto;
  }
}

/* V19.4 Beta — empty OS dashboard canvas. */
.ax-dashboard-canvas {
  min-height: clamp(18rem, 54vh, 42rem);
  display: grid;
  align-items: start;
  padding: clamp(1rem, 2vw, 1.5rem);
}

.ax-dashboard-empty {
  color: var(--ax-text-muted);
}

.ax-dashboard-empty h1 {
  margin: 0 0 .35rem;
  color: var(--ax-text);
  font-size: clamp(1.35rem, 2vw, 1.85rem);
}

.ax-dashboard-empty p {
  margin: 0;
  font-size: .92rem;
}

/* V19.5 Beta · Reusable topbar dropdown menu for grouped module navigation. */
.ax-tab-dropdown {
  position: relative !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
}

.ax-topnav-dropbtn {
  display: inline-flex !important;
  align-items: center !important;
  gap: .45rem !important;
  cursor: pointer !important;
}

.ax-topnav-dropbtn__chevron {
  width: .45rem !important;
  height: .45rem !important;
  border-right: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;
  transform: rotate(45deg) translateY(-1px) !important;
  opacity: .72 !important;
}

.ax-tab-dropdown.open .ax-topnav-dropbtn__chevron,
.ax-tab-dropdown[data-dropdown-open="true"] .ax-topnav-dropbtn__chevron {
  transform: rotate(225deg) translate(-1px, -1px) !important;
}

.ax-dropdown-menu {
  display: none !important;
  min-width: 220px !important;
  padding: .45rem !important;
  border: 1px solid var(--ax-border) !important;
  border-radius: var(--ax-radius-lg) !important;
  background: var(--ax-surface, #fff) !important;
  box-shadow: var(--ax-shadow-lg) !important;
}

.ax-dropdown-menu.is-open,
.ax-dropdown-menu[data-dropdown-open="true"] {
  display: grid !important;
  gap: .25rem !important;
}

.ax-tab-menu-item {
  display: flex !important;
  align-items: center !important;
  min-height: 38px !important;
  padding: .55rem .7rem !important;
  border-radius: var(--ax-radius-md) !important;
  color: var(--ax-text-secondary) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.ax-tab-menu-item:hover,
.ax-tab-menu-item.active,
.ax-tab-menu-item.is-active {
  background: var(--ax-primary-soft) !important;
  color: var(--ax-text-primary) !important;
}

@media (max-width: 720px) {
  .ax-dropdown-menu {
    max-width: calc(100vw - 2rem) !important;
  }
}

/* V22.3 Beta — fixed-width top navigation buttons. */
.ax-topbar .ax-topnav,
.ax-header .ax-topnav,
.ax-topbar .ax-topnav-services,
.ax-header .ax-topnav-services {
  display: flex !important;
  align-items: center !important;
  gap: .42rem !important;
  flex: 0 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

.ax-topbar .ax-topnav > .ax-tab,
.ax-header .ax-topnav > .ax-tab,
.ax-topbar .ax-topnav > .ax-tab-dropdown,
.ax-header .ax-topnav > .ax-tab-dropdown,
.ax-topbar .ax-topnav-dropbtn,
.ax-header .ax-topnav-dropbtn {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: auto !important;
  max-width: max-content !important;
  white-space: nowrap !important;
}

.ax-topbar .ax-tab.active,
.ax-header .ax-tab.active,
.ax-topbar .ax-tab.is-active,
.ax-header .ax-tab.is-active,
.ax-topbar .ax-topnav-dropbtn.active,
.ax-header .ax-topnav-dropbtn.active,
.ax-topbar .ax-topnav-dropbtn.is-active,
.ax-header .ax-topnav-dropbtn.is-active {
  flex: 0 0 auto !important;
  width: auto !important;
}

.ax-topbar .ax-header-actions,
.ax-header .ax-header-actions {
  margin-left: auto !important;
}

@media (min-width: 1024px) {
  .ax-topbar .ax-topnav,
  .ax-header .ax-topnav,
  .ax-topbar .ax-topnav-services,
  .ax-header .ax-topnav-services {
    flex: 0 1 auto !important;
    flex-basis: auto !important;
  }
}

/* =========================================================
 * Zedulex OS V24.7 Beta — Modern visual refresh foundation
 * Global-first charcoal/graphite token refresh. Module CSS remains layered
 * after this file; Services and Services Lite keep their dedicated systems.
 * ======================================================= */
:root,
[data-theme="light"] {
  color-scheme: light;
  --ax-app-bg: #eef0ed;
  --ax-shell-bg: #e4e7e3;
  --ax-content-bg: #f6f7f4;
  --ax-bg: var(--ax-app-bg);
  --ax-bg-muted: #e6e8e4;
  --ax-surface: #ffffff;
  --ax-surface-raised: #fbfbfa;
  --ax-surface-elevated: var(--ax-surface-raised);
  --ax-surface-soft: #f0f1ee;
  --ax-surface-translucent: color-mix(in srgb, var(--ax-surface) 88%, transparent);
  --ax-border: #cfd4cd;
  --ax-border-soft: #dde1db;
  --ax-border-strong: #aeb7af;
  --ax-border-translucent: color-mix(in srgb, var(--ax-border) 66%, transparent);
  --ax-text: #121416;
  --ax-text-primary: #121416;
  --ax-text-secondary: #3b4248;
  --ax-text-muted: #667078;
  --ax-text-soft: #7f898f;
  --ax-text-inverse: #ffffff;
  --ax-primary: #222a2d;
  --ax-accent: #222a2d;
  --ax-link-color: #2f3a3e;
  --ax-accent-hover: #0f1416;
  --ax-primary-soft: #e1e5e1;
  --ax-accent-soft: #e1e5e1;
  --ax-accent-border: #aeb7af;
  --ax-accent-focus: rgba(34, 42, 45, .18);
  --ax-success: #287253;
  --ax-warning: #8a6418;
  --ax-danger: #963c3c;
  --ax-info: #435f6a;
  --ax-neutral: #667078;
  --ax-neutral-bg: #e8ebe7;
  --ax-success-bg: color-mix(in srgb, var(--ax-success) 13%, white);
  --ax-warning-bg: color-mix(in srgb, var(--ax-warning) 15%, white);
  --ax-danger-bg: color-mix(in srgb, var(--ax-danger) 12%, white);
  --ax-info-bg: color-mix(in srgb, var(--ax-info) 13%, white);
  --ax-radius-xs: 8px;
  --ax-radius-sm: 12px;
  --ax-radius-md: 16px;
  --ax-radius-lg: 22px;
  --ax-radius-xl: 30px;
  --ax-space-1: .35rem;
  --ax-space-2: .6rem;
  --ax-space-3: 1rem;
  --ax-space-4: 1.35rem;
  --ax-space-5: 1.8rem;
  --ax-shadow-sm: 0 10px 28px rgba(15, 18, 20, .08);
  --ax-shadow-md: 0 20px 56px rgba(15, 18, 20, .12);
  --ax-shadow-lg: 0 36px 96px rgba(15, 18, 20, .16);
  --ax-gradient-soft: radial-gradient(circle at top left, rgba(34,42,45,.08), transparent 30%), linear-gradient(135deg, var(--ax-content-bg), var(--ax-shell-bg));
  --ax-gradient-primary: linear-gradient(135deg, #101416, #30383b);
  --ax-sidebar-bg: color-mix(in srgb, var(--ax-surface) 94%, var(--ax-shell-bg));
  --ax-sidebar-text: var(--ax-text-secondary);
  --ax-sidebar-muted: var(--ax-text-muted);
  --ax-sidebar-active-bg: #dfe4df;
  --ax-sidebar-active-text: var(--ax-text-primary);
  --ax-topbar-bg: color-mix(in srgb, var(--ax-surface) 92%, var(--ax-content-bg));
  --ax-topbar-text: var(--ax-text-primary);
  --ax-topbar-muted: var(--ax-text-muted);
  --ax-card-bg: var(--ax-surface);
  --ax-card-border: var(--ax-border-soft);
  --ax-table-bg: var(--ax-surface);
  --ax-table-header-bg: #eef0ed;
  --ax-table-header-text: var(--ax-text-secondary);
  --ax-table-row-bg: var(--ax-surface);
  --ax-table-row-hover-bg: #f1f3f0;
  --ax-table-text: var(--ax-text-primary);
  --ax-table-muted: var(--ax-text-muted);
  --ax-table-border: var(--ax-border-soft);
  --ax-button-bg: var(--ax-surface-raised);
  --ax-button-text: var(--ax-text-primary);
  --ax-button-border: var(--ax-border);
  --ax-button-primary-bg: var(--ax-primary);
  --ax-button-primary-text: #ffffff;
  --ax-button-secondary-bg: var(--ax-primary-soft);
  --ax-button-secondary-text: var(--ax-text-primary);
}

[data-theme="dark"],
[data-ax-theme="dark"],
[data-ax-theme="night"] {
  color-scheme: dark;
  --ax-app-bg: #060707;
  --ax-shell-bg: #0b0c0d;
  --ax-content-bg: #101112;
  --ax-bg: var(--ax-app-bg);
  --ax-bg-muted: #151718;
  --ax-surface: #181a1b;
  --ax-surface-raised: #202324;
  --ax-surface-elevated: var(--ax-surface-raised);
  --ax-surface-soft: #111314;
  --ax-surface-translucent: color-mix(in srgb, var(--ax-surface) 86%, transparent);
  --ax-border: #343839;
  --ax-border-soft: #262a2b;
  --ax-border-strong: #4a5051;
  --ax-border-translucent: color-mix(in srgb, var(--ax-border) 62%, transparent);
  --ax-text: #f4f3ee;
  --ax-text-primary: #f4f3ee;
  --ax-text-secondary: #d1d3ce;
  --ax-text-muted: #a7aca8;
  --ax-text-soft: #858b88;
  --ax-text-inverse: #070808;
  --ax-primary: #d2d5ce;
  --ax-accent: #d2d5ce;
  --ax-link-color: #e4e6df;
  --ax-accent-hover: #ffffff;
  --ax-primary-soft: #282c29;
  --ax-accent-soft: #282c29;
  --ax-accent-border: #565e58;
  --ax-accent-focus: rgba(210, 213, 206, .22);
  --ax-success: #82c7a5;
  --ax-warning: #d6b767;
  --ax-danger: #e49a9a;
  --ax-info: #b7c2bd;
  --ax-neutral: #a7aca8;
  --ax-neutral-bg: #202324;
  --ax-success-bg: color-mix(in srgb, var(--ax-success) 15%, transparent);
  --ax-warning-bg: color-mix(in srgb, var(--ax-warning) 18%, transparent);
  --ax-danger-bg: color-mix(in srgb, var(--ax-danger) 15%, transparent);
  --ax-info-bg: color-mix(in srgb, var(--ax-info) 14%, transparent);
  --ax-shadow-sm: 0 14px 34px rgba(0, 0, 0, .44);
  --ax-shadow-md: 0 26px 68px rgba(0, 0, 0, .54);
  --ax-shadow-lg: 0 42px 110px rgba(0, 0, 0, .66);
  --ax-gradient-soft: radial-gradient(circle at top left, rgba(255,255,255,.055), transparent 28%), linear-gradient(135deg, var(--ax-content-bg), var(--ax-shell-bg));
  --ax-gradient-primary: linear-gradient(135deg, #eef0ea, #aeb5ad);
  --ax-sidebar-bg: #0d0f10;
  --ax-sidebar-text: var(--ax-text-secondary);
  --ax-sidebar-muted: var(--ax-text-soft);
  --ax-sidebar-active-bg: #252925;
  --ax-sidebar-active-text: var(--ax-text-primary);
  --ax-topbar-bg: #141617;
  --ax-topbar-text: var(--ax-text-primary);
  --ax-topbar-muted: var(--ax-text-muted);
  --ax-card-bg: #181a1b;
  --ax-card-border: var(--ax-border-soft);
  --ax-table-bg: var(--ax-surface);
  --ax-table-header-bg: #1e2122;
  --ax-table-header-text: var(--ax-text-secondary);
  --ax-table-row-bg: var(--ax-surface);
  --ax-table-row-hover-bg: #222627;
  --ax-table-text: var(--ax-text-primary);
  --ax-table-muted: var(--ax-text-muted);
  --ax-table-border: var(--ax-border-soft);
  --ax-button-bg: var(--ax-surface-raised);
  --ax-button-text: var(--ax-text-primary);
  --ax-button-border: var(--ax-border);
  --ax-button-primary-bg: var(--ax-primary);
  --ax-button-primary-text: #070808;
  --ax-button-secondary-bg: var(--ax-primary-soft);
  --ax-button-secondary-text: var(--ax-text-primary);
}

:root,
[data-theme="light"],
[data-theme="dark"],
[data-ax-theme="dark"],
[data-ax-theme="night"] {
  --ax-shell-sidebar-rail: linear-gradient(180deg, color-mix(in srgb, var(--ax-primary) 12%, transparent), transparent 64%);
  --ax-shell-backdrop: color-mix(in srgb, var(--ax-app-bg) 72%, transparent);
  --ax-content-surface: linear-gradient(180deg, color-mix(in srgb, var(--ax-surface) 78%, transparent), color-mix(in srgb, var(--ax-content-bg) 96%, transparent));
  --ax-page-header-bg: linear-gradient(180deg, color-mix(in srgb, var(--ax-surface) 76%, transparent), color-mix(in srgb, var(--ax-surface-soft) 82%, transparent));
  --ax-alert-bg: var(--ax-surface);
  --ax-alert-border: var(--ax-border);
  --ax-empty-state-bg: var(--ax-surface-raised);
  --ax-empty-state-border: var(--ax-border);
  --ax-form-bg: var(--ax-surface);
  --ax-form-border: var(--ax-border);
  --ax-form-focus: var(--ax-accent-focus);
  --svc-bg: var(--ax-app-bg);
  --svc-bg-muted: var(--ax-surface-soft);
  --svc-surface: var(--ax-card-bg);
  --svc-surface-raised: var(--ax-surface-raised);
  --svc-surface-soft: var(--ax-surface-soft);
  --svc-border: var(--ax-border);
  --svc-border-strong: var(--ax-border-strong);
  --svc-text: var(--ax-text-primary);
  --svc-text-secondary: var(--ax-text-secondary);
  --svc-text-muted: var(--ax-text-muted);
  --svc-accent: var(--ax-accent);
  --svc-accent-strong: var(--ax-link-color);
  --svc-accent-soft: var(--ax-accent-soft);
  --svc-success: var(--ax-success);
  --svc-warning: var(--ax-warning);
  --svc-danger: var(--ax-danger);
  --svc-info: var(--ax-info);
  --svc-neutral: var(--ax-neutral);
  --svc-neutral-soft: var(--ax-neutral-bg);
}

.ax-theme-toggle,
.ax-build-chip,
.ax-user-menu { box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 38%, transparent); }
.ax-sidebar { background-image: var(--ax-shell-sidebar-rail); }
.ax-sidebar-header:hover { background: var(--ax-surface-soft); }
.ax-sidebar-item.active,
.ax-nav-item.active,
.ax-nav-item[aria-current="page"] { box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 18%, transparent), 0 10px 22px color-mix(in srgb, var(--ax-primary) 12%, transparent); }
.ax-topbar-search input { border-radius: var(--ax-radius-lg); background: var(--ax-surface-raised); }
.ax-page-header,
.svc-page-header,
.services-dashboard-head { padding: var(--ax-space-4); border: 1px solid var(--ax-border); border-radius: var(--ax-radius-xl); background: var(--ax-page-header-bg); box-shadow: var(--ax-shadow-sm); }
.ax-panel,
.ax-glass,
.ax-card,
.ax-section,
.ax-stat-card { background: var(--ax-card-bg); border-color: var(--ax-card-border); }
.ax-card:hover,
.ax-panel:hover { border-color: color-mix(in srgb, var(--ax-primary) 22%, var(--ax-border)); }
.ax-btn,
.ax-btn-primary,
.ax-btn-secondary,
.ax-tab,
.ax-theme-toggle { transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease; }
.ax-btn:hover,
.ax-btn-primary:hover,
.ax-btn-secondary:hover,
.ax-theme-toggle:hover { transform: translateY(-1px); box-shadow: var(--ax-shadow-sm); }
.ax-table tbody tr:hover { background: var(--ax-table-row-hover-bg); }
.ax-form input,
.ax-form select,
.ax-form textarea,
.ax-input,
.ax-select,
textarea.ax-input { border-radius: var(--ax-radius-md); background: var(--ax-form-bg); }
.ax-alert { border: 1px solid var(--ax-alert-border); border-radius: var(--ax-radius-lg); background: var(--ax-alert-bg); color: var(--ax-text-primary); padding: var(--ax-space-3); box-shadow: var(--ax-shadow-sm); }
.ax-alert--success { border-color: color-mix(in srgb, var(--ax-success) 34%, var(--ax-border)); background: var(--ax-success-bg); }
.ax-alert--warning { border-color: color-mix(in srgb, var(--ax-warning) 34%, var(--ax-border)); background: var(--ax-warning-bg); }
.ax-alert--danger { border-color: color-mix(in srgb, var(--ax-danger) 34%, var(--ax-border)); background: var(--ax-danger-bg); }
.ax-alert--info { border-color: color-mix(in srgb, var(--ax-info) 34%, var(--ax-border)); background: var(--ax-info-bg); }
.ax-pagination { display: flex; flex-wrap: wrap; gap: var(--ax-space-2); align-items: center; }
.ax-pagination a,
.ax-pagination span { border: 1px solid var(--ax-border); border-radius: 999px; background: var(--ax-surface); color: var(--ax-text-secondary); padding: .45rem .7rem; text-decoration: none; font-weight: 800; }
.ax-pagination .active,
.ax-pagination [aria-current="page"] { background: var(--ax-button-primary-bg); color: var(--ax-button-primary-text); border-color: var(--ax-button-primary-bg); }

/* Static empty-module shell layout extracted from shell_renderer.php in V25.8. */
.ax-empty-modules{margin:10vh auto;max-width:680px}
