/* AccountHub Node parity UI. This file intentionally owns the final visual layer. */
:root {
  --np-font: "IBM Plex Sans Arabic", "Segoe UI", sans-serif;
  --np-radius: 8px;
  --np-radius-sm: 6px;
  --np-sidebar: 252px;
  --np-topbar: 70px;
  --np-blue: #2457e6;
  --np-blue-strong: #1746c5;
  --np-blue-soft: #edf3ff;
  --np-teal: #0787a5;
  --np-green: #15915b;
  --np-amber: #d98b0b;
  --np-red: #d43c50;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --np-bg: #0b1120;
  --np-sidebar-bg: #0f172a;
  --np-topbar-bg: rgba(15, 23, 42, .96);
  --np-surface: #111827;
  --np-card: #131c2e;
  --np-elevated: #182235;
  --np-hover: #1e293b;
  --np-border: #334155;
  --np-border-soft: #243247;
  --np-text: #f8fafc;
  --np-muted: #94a3b8;
  --np-subtle: #64748b;
  --np-input: #111827;
  --np-shadow: 0 12px 28px rgba(2, 6, 23, .24);
}

html[data-theme="light"] {
  color-scheme: light;
  --np-bg: #f4f7fb;
  --np-sidebar-bg: #fbfdff;
  --np-topbar-bg: rgba(255, 255, 255, .96);
  --np-surface: #ffffff;
  --np-card: #ffffff;
  --np-elevated: #f7f9fc;
  --np-hover: #eef3fa;
  --np-border: #d4ddea;
  --np-border-soft: #e6ebf2;
  --np-text: #101828;
  --np-muted: #59677a;
  --np-subtle: #8794a7;
  --np-input: #ffffff;
  --np-shadow: 0 10px 30px rgba(27, 46, 79, .07);
}

html, body { min-height: 100%; }
body.ah-public-body { margin: 0 !important; font-family: var(--np-font) !important; color: var(--np-text) !important; background: var(--np-bg) !important; transition: background-color .18s ease, color .18s ease; }
body.ah-public-body *, body.ah-public-body *::before, body.ah-public-body *::after { box-sizing: border-box; letter-spacing: 0; }
body.ah-public-body .topbar { background: var(--np-topbar-bg) !important; border-bottom: 1px solid var(--np-border-soft) !important; backdrop-filter: blur(16px); }
body.ah-public-body .brand, body.ah-public-body .public-nav a { color: var(--np-text) !important; }
.public-theme-toggle { width: 38px !important; height: 38px !important; padding: 0 !important; display: inline-grid !important; place-items: center !important; border: 1px solid var(--np-border) !important; border-radius: 9px !important; color: var(--np-muted) !important; background: var(--np-elevated) !important; cursor: pointer; }
.public-theme-toggle svg { grid-area: 1 / 1; width: 17px !important; height: 17px !important; fill: none !important; stroke: currentColor !important; }
html[data-theme="light"] body.ah-public-body .landing-hero,
html[data-theme="light"] body.ah-public-body .landing-browser-card,
html[data-theme="light"] body.ah-public-body .landing-extension-card,
html[data-theme="light"] body.ah-public-body .landing-feature-product,
html[data-theme="light"] body.ah-public-body .public-product-card,
html[data-theme="light"] body.ah-public-body .landing-workflow > * {
  color: var(--np-text) !important; background: var(--np-card) !important; border-color: var(--np-border) !important; box-shadow: var(--np-shadow) !important;
}
html[data-theme="light"] body.ah-public-body .landing-hero-copy h1,
html[data-theme="light"] body.ah-public-body .landing-section-head h2,
html[data-theme="light"] body.ah-public-body .public-product-body h2,
html[data-theme="light"] body.ah-public-body .public-product-body h3 { color: var(--np-text) !important; }
html[data-theme="light"] body.ah-public-body .landing-hero-copy p,
html[data-theme="light"] body.ah-public-body .landing-section-head p,
html[data-theme="light"] body.ah-public-body .public-product-body p,
html[data-theme="light"] body.ah-public-body .landing-browser-content,
html[data-theme="light"] body.ah-public-body .landing-workflow p { color: var(--np-muted) !important; }
html[data-theme="light"] body.ah-public-body .landing-metrics > div,
html[data-theme="light"] body.ah-public-body .public-card-includes,
html[data-theme="light"] body.ah-public-body .landing-browser-top { background: var(--np-elevated) !important; border-color: var(--np-border-soft) !important; }
html[data-theme="light"] body.ah-public-body .landing-browser-card *,
html[data-theme="light"] body.ah-public-body .landing-extension-card *,
html[data-theme="light"] body.ah-public-body .landing-feature-product * { color: var(--np-muted) !important; }
html[data-theme="light"] body.ah-public-body .landing-browser-card strong,
html[data-theme="light"] body.ah-public-body .landing-extension-card strong,
html[data-theme="light"] body.ah-public-body .landing-feature-product strong { color: var(--np-text) !important; }
html[data-theme="light"] body.ah-public-body .landing-metrics { background: transparent !important; color: var(--np-text) !important; }
html[data-theme="light"] body.ah-public-body .landing-metrics strong { color: var(--np-teal) !important; }

/* Public experience: one final visual layer, shared by light and dark. */
body.ah-public-body > .topbar {
  min-height: 68px !important; padding: 0 max(24px,calc((100vw - 1180px)/2)) !important;
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  color: var(--np-text) !important; background: var(--np-topbar-bg) !important;
  border-bottom: 1px solid var(--np-border-soft) !important; box-shadow: none !important;
}
body.ah-public-body > .topbar .brand { display: inline-flex !important; align-items: center !important; gap: 10px !important; color: var(--np-text) !important; font-size: 17px !important; }
body.ah-public-body > .topbar .brand::before {
  content: "A" !important; width: 34px !important; height: 34px !important; display: grid !important; place-items: center !important;
  border-radius: 8px !important; color: #fff !important; background: var(--np-blue) !important; box-shadow: none !important;
  font-size: 13px !important; font-weight: 700 !important;
}
body.ah-public-body > .topbar .public-nav { display: flex !important; align-items: center !important; gap: 4px !important; }
.public-nav-toggle { display: none !important; }
body.ah-public-body > .topbar .public-nav > a,
body.ah-public-body > .topbar .public-nav > form > button {
  min-height: 36px !important; padding: 7px 10px !important; color: var(--np-muted) !important; background: transparent !important;
  border: 1px solid transparent !important; border-radius: 7px !important; box-shadow: none !important; font-size: 12px !important;
}
body.ah-public-body > .topbar .public-nav > a:hover,
body.ah-public-body > .topbar .public-nav > form > button:hover { color: var(--np-text) !important; background: var(--np-hover) !important; }
body.ah-public-body > .topbar .public-nav > a.btn,
body.ah-public-body > .topbar .public-nav > a[href*="register"] {
  color: #fff !important; background: var(--np-blue) !important; border-color: var(--np-blue) !important; box-shadow: 0 5px 14px rgba(37,99,235,.16) !important;
}
body.ah-public-body .public-theme-toggle { color: var(--np-muted) !important; background: var(--np-elevated) !important; border-color: var(--np-border) !important; box-shadow: none !important; }
body.ah-public-body > .container { width: min(1180px,calc(100% - 48px)) !important; margin: 42px auto !important; }
body.ah-public-body .landing-hero {
  min-height: 520px !important; padding: 42px 8px 48px !important; display: grid !important;
  grid-template-columns: minmax(0,1.04fr) minmax(360px,.96fr) !important; align-items: center !important; gap: 42px !important;
  color: var(--np-text) !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--np-border-soft) !important;
  border-radius: 0 !important; box-shadow: none !important; overflow: visible !important;
}
body.ah-public-body .landing-hero::before,
body.ah-public-body .landing-hero::after,
body.ah-public-body .landing-hero-copy::before,
body.ah-public-body .landing-hero-copy::after { display: none !important; content: none !important; }
body.ah-public-body .landing-hero-copy { min-width: 0 !important; }
body.ah-public-body .landing-hero-copy .eyebrow,
body.ah-public-body .landing-section-head .eyebrow { color: var(--np-blue) !important; font-size: 11px !important; font-weight: 700 !important; }
body.ah-public-body .landing-hero-copy h1 {
  max-width: 620px !important; margin: 8px 0 16px !important; color: var(--np-text) !important;
  font-size: 52px !important; line-height: 1.16 !important; font-weight: 700 !important;
}
body.ah-public-body .landing-hero-copy > p { max-width: 600px !important; margin: 0 !important; color: var(--np-muted) !important; font-size: 15px !important; line-height: 1.85 !important; }
body.ah-public-body .landing-actions { margin: 24px 0 !important; display: flex !important; gap: 10px !important; flex-wrap: wrap !important; }
body.ah-public-body .landing-metrics { margin-top: 28px !important; display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 8px !important; }
body.ah-public-body .landing-metrics > div { min-height: 84px !important; padding: 14px !important; display: grid !important; align-content: center !important; background: var(--np-elevated) !important; border: 1px solid var(--np-border-soft) !important; border-radius: 7px !important; }
body.ah-public-body .landing-metrics strong { color: var(--np-blue) !important; font-size: 22px !important; line-height: 1.2 !important; }
body.ah-public-body .landing-metrics span { color: var(--np-muted) !important; font-size: 10px !important; }
body.ah-public-body .landing-access-panel { min-width: 0 !important; }
body.ah-public-body .landing-browser-card { padding: 0 !important; overflow: hidden !important; color: var(--np-text) !important; background: var(--np-card) !important; border: 1px solid var(--np-border) !important; border-radius: 8px !important; box-shadow: 0 18px 38px rgba(15,23,42,.10) !important; }
body.ah-public-body .landing-browser-top { min-height: 42px !important; padding: 0 16px !important; display: flex !important; align-items: center !important; gap: 7px !important; background: var(--np-elevated) !important; border-bottom: 1px solid var(--np-border-soft) !important; }
body.ah-public-body .landing-browser-content { padding: 18px !important; display: grid !important; gap: 12px !important; }
body.ah-public-body .landing-extension-card,
body.ah-public-body .landing-feature-product { min-width: 0 !important; padding: 16px !important; background: var(--np-card) !important; border: 1px solid var(--np-border-soft) !important; border-radius: 7px !important; box-shadow: none !important; }
body.ah-public-body .landing-extension-card > span,
body.ah-public-body .landing-feature-media { color: #fff !important; background: var(--np-blue) !important; border-radius: 7px !important; box-shadow: none !important; }
body.ah-public-body .landing-section-head { margin: 44px 0 16px !important; display: flex !important; align-items: end !important; justify-content: space-between !important; gap: 20px !important; }
body.ah-public-body .landing-section-head h2 { margin: 3px 0 !important; color: var(--np-text) !important; font-size: 28px !important; }
body.ah-public-body .landing-section-head p { margin: 0 !important; color: var(--np-muted) !important; }
body.ah-public-body .landing-product-rows,
body.ah-public-body .public-product-grid { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 14px !important; }
body.ah-public-body .public-product-card { min-width: 0 !important; display: flex !important; flex-direction: column !important; overflow: hidden !important; background: var(--np-card) !important; border: 1px solid var(--np-border-soft) !important; border-radius: 8px !important; box-shadow: none !important; transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease !important; }
body.ah-public-body .public-product-card:hover { transform: translateY(-3px) !important; border-color: rgba(37,99,235,.35) !important; box-shadow: var(--np-shadow) !important; }
body.ah-public-body .public-product-media { height: 220px !important; background: var(--np-elevated) !important; border-bottom: 1px solid var(--np-border-soft) !important; }
body.ah-public-body .public-product-media b { color: var(--np-blue) !important; background: var(--np-card) !important; border: 1px solid var(--np-border-soft) !important; box-shadow: none !important; }
body.ah-public-body .public-product-body { min-height: 190px !important; padding: 16px !important; }
body.ah-public-body .public-product-body h3 { color: var(--np-text) !important; font-size: 17px !important; }
body.ah-public-body .public-product-body p { color: var(--np-muted) !important; font-size: 12px !important; }
body.ah-public-body .public-product-bottom { border-color: var(--np-border-soft) !important; }
body.ah-public-body .public-product-bottom strong { color: var(--np-blue) !important; }
body.ah-public-body .landing-workflow { margin: 38px 0 !important; display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 14px !important; }
body.ah-public-body .landing-workflow > article { min-height: 170px !important; padding: 22px !important; color: var(--np-text) !important; background: var(--np-card) !important; border: 1px solid var(--np-border-soft) !important; border-radius: 8px !important; box-shadow: none !important; }
body.ah-public-body .landing-workflow > article > span { color: var(--np-blue) !important; background: var(--np-blue-soft) !important; border-color: rgba(37,99,235,.16) !important; }
body.ah-public-body .landing-workflow h3 { margin: 16px 0 6px !important; color: var(--np-text) !important; }
body.ah-public-body .landing-workflow p { margin: 0 !important; color: var(--np-muted) !important; }
html[data-theme="dark"] body.ah-public-body .landing-workflow > article > span { background: rgba(37,99,235,.14) !important; }
body.ah-admin-body,
body.ah-workspace-body {
  margin: 0 !important;
  font-family: var(--np-font) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  color: var(--np-text) !important;
  background: var(--np-bg) !important;
  transition: background-color .18s ease, color .18s ease;
}
body.ah-admin-body {
  --admin-bg: var(--np-bg); --admin-surface: var(--np-card); --admin-soft: var(--np-elevated);
  --admin-ink: var(--np-text); --admin-text: var(--np-text); --admin-muted: var(--np-muted);
  --admin-line: var(--np-border-soft); --admin-brand: var(--np-blue); --admin-brand-dark: var(--np-blue-strong);
  --admin-blue: var(--np-blue); --admin-green: var(--np-green); --admin-amber: var(--np-amber); --admin-red: var(--np-red);
  --admin-radius: var(--np-radius); --admin-shadow: var(--np-shadow);
}
body.ah-admin-body *, body.ah-workspace-body * { box-sizing: border-box; letter-spacing: 0; }
body.ah-admin-body svg, body.ah-workspace-body svg {
  width: 18px; height: 18px; max-width: 18px; max-height: 18px;
  fill: none !important; stroke: currentColor; stroke-width: 2;
}

/* Shared application shell */
.ah-shell, .customer-shell {
  min-height: 100dvh !important;
  display: block !important;
  background: var(--np-bg) !important;
}
.ah-sidebar, .customer-sidebar {
  position: fixed !important;
  inset-block: 0 !important;
  left: 0 !important; right: auto !important;
  width: var(--np-sidebar) !important;
  height: 100dvh !important;
  z-index: 60 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--np-sidebar-bg) !important;
  border-inline-end: 1px solid var(--np-border-soft) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
[dir="rtl"] .ah-sidebar, [dir="rtl"] .customer-sidebar {
  left: auto !important; right: 0 !important;
  border-inline-end: 0 !important;
  border-inline-start: 1px solid var(--np-border-soft) !important;
}
.ah-main { min-width: 0; width: calc(100% - var(--np-sidebar)) !important; margin-left: var(--np-sidebar) !important; padding: 0 !important; background: var(--np-bg) !important; }
[dir="rtl"] .ah-main { margin-left: 0 !important; margin-right: var(--np-sidebar) !important; }
.ah-brand, .customer-sidebar-brand {
  min-height: var(--np-topbar) !important;
  padding: 14px 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  border-bottom: 1px solid var(--np-border-soft) !important;
  background: transparent !important;
}
.ah-logo-mark, .customer-sidebar-brand > span {
  width: 38px !important; height: 38px !important; min-width: 38px !important;
  display: grid !important; place-items: center !important;
  border-radius: 10px !important; color: #fff !important; font-weight: 800 !important;
  background: var(--np-blue) !important;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .2) !important;
}
.ah-brand strong, .customer-sidebar-brand strong { color: var(--np-text) !important; font-size: 15px !important; }
.ah-brand strong span { color: var(--np-blue) !important; }
.ah-brand small, .customer-sidebar-brand small { color: var(--np-muted) !important; font-size: 11px !important; }
.ah-nav, .customer-side-nav {
  flex: 1 !important; min-height: 0 !important; overflow-y: auto !important;
  padding: 16px 12px 20px !important; scrollbar-width: thin; scrollbar-color: var(--np-border) transparent;
}
.ah-nav section { margin: 0 0 16px !important; padding: 0 !important; background: transparent !important; border: 0 !important; }
.ah-nav section > p {
  margin: 0 10px 8px !important; color: var(--np-subtle) !important;
  font-size: 10px !important; line-height: 18px !important; font-weight: 700 !important; text-transform: none;
}
.ah-nav a, .customer-side-nav a {
  position: relative; min-height: 43px !important; margin: 3px 0 !important; padding: 9px 11px !important;
  display: flex !important; align-items: center !important; gap: 11px !important;
  border: 1px solid transparent !important; border-radius: 9px !important;
  color: var(--np-muted) !important; background: transparent !important; text-decoration: none !important;
  font-size: 13px !important; font-weight: 600 !important; box-shadow: none !important; transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease;
}
.ah-nav a i, .customer-side-nav a i { width: 20px !important; height: 20px !important; display: grid !important; place-items: center !important; background: transparent !important; border: 0 !important; }
.ah-nav a i, .customer-side-nav a i { color: inherit !important; }
.ah-nav a svg, .customer-side-nav a svg { width: 18px !important; height: 18px !important; stroke: currentColor !important; }
.ah-nav a:hover, .customer-side-nav a:hover { color: var(--np-text) !important; background: var(--np-hover) !important; }
.ah-nav a.active, .customer-side-nav a.active {
  color: #fff !important; background: var(--np-blue) !important;
  border-color: var(--np-blue) !important; box-shadow: 0 5px 14px rgba(37,99,235,.18) !important;
}
.ah-user {
  flex: none !important; margin: 10px 12px 14px !important; padding: 11px !important;
  display: grid !important; grid-template-columns: 36px minmax(0,1fr) 30px !important; align-items: center !important; gap: 9px !important;
  border: 1px solid var(--np-border) !important; border-radius: 10px !important; background: var(--np-elevated) !important;
}
.ah-user-avatar { width: 36px !important; height: 36px !important; border-radius: 9px !important; display: grid !important; place-items: center !important; color: #fff !important; background: var(--np-blue) !important; }
.ah-user strong, .ah-user small { display: block; max-width: 132px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ah-user strong { color: var(--np-text) !important; font-size: 12px !important; }
.ah-user small { color: var(--np-muted) !important; font-size: 10px !important; }
.ah-user-logout { width: 30px !important; height: 30px !important; padding: 0 !important; border: 0 !important; border-radius: 7px !important; color: var(--np-muted) !important; background: transparent !important; }

/* Top bar */
.ah-topbar {
  position: sticky !important; inset-block-start: 0 !important; z-index: 45 !important;
  min-height: var(--np-topbar) !important; padding: 0 28px !important;
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 20px !important;
  background: var(--np-topbar-bg) !important; border-bottom: 1px solid var(--np-border-soft) !important;
  border-radius: 0 !important; box-shadow: none !important; backdrop-filter: blur(16px);
}
.ah-topbar-leading { display: flex !important; align-items: center !important; min-width: 0; }
.ah-breadcrumbs { display: flex !important; align-items: center !important; gap: 6px !important; margin: 0 0 2px !important; color: var(--np-subtle) !important; font-size: 10px !important; }
.ah-breadcrumbs svg { width: 12px !important; height: 12px !important; }
.ah-topbar-title > strong { color: var(--np-text) !important; font-size: 15px !important; line-height: 1.3 !important; }
.ah-topbar-title > small { display: none !important; }
.ah-topbar-actions { display: flex !important; align-items: center !important; gap: 8px !important; }
.ah-mobile-toggle { display: none !important; }
.ah-nav-search { width: 220px !important; height: 38px !important; padding: 0 11px !important; display: flex !important; align-items: center !important; gap: 8px !important; border: 1px solid var(--np-border) !important; border-radius: 9px !important; background: var(--np-elevated) !important; }
.ah-nav-search input { width: 100% !important; padding: 0 !important; border: 0 !important; outline: 0 !important; background: transparent !important; color: var(--np-text) !important; font: inherit !important; }
.ah-icon-button, .language-switch, .customer-theme-toggle, .customer-language-switch {
  min-height: 38px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px !important;
  padding: 0 11px !important; border: 1px solid var(--np-border) !important; border-radius: 9px !important;
  color: var(--np-muted) !important; background: var(--np-elevated) !important; text-decoration: none !important; cursor: pointer;
}
.ah-icon-button { width: 38px !important; padding: 0 !important; }
.ah-icon-button svg, .language-switch svg, .customer-theme-toggle svg { width: 17px !important; height: 17px !important; }
html[data-theme="dark"] .theme-icon-moon, html[data-theme="light"] .theme-icon-sun { display: none !important; }
.ah-profile-menu summary { min-height: 42px !important; padding: 4px 6px !important; border: 0 !important; background: transparent !important; color: var(--np-text) !important; }
.ah-profile-avatar { border-radius: 9px !important; background: var(--np-blue) !important; }
.ah-profile-panel { inset-block-start: calc(100% + 10px) !important; inset-block-end: auto !important; z-index: 200 !important; background: var(--np-card) !important; color: var(--np-text) !important; border: 1px solid var(--np-border) !important; box-shadow: var(--np-shadow) !important; }
.ah-profile-menu:not([open]) .ah-profile-panel { display: none !important; }
.ah-profile-menu[open] .ah-profile-panel { display: grid !important; }

/* Page frame and primitives */
.ah-content {
  width: 100% !important; max-width: 1480px !important; margin: 0 auto !important;
  padding: 30px 32px 52px !important; background: transparent !important;
}
.skip-link { position: fixed !important; inset-block-start: -100px !important; z-index: 2000 !important; }
.skip-link:focus { inset-block-start: 10px !important; }
.admin-page-head, .client-page-header {
  min-height: 70px !important; margin: 0 0 20px !important; padding: 2px 0 18px !important;
  display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 18px !important;
  background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--np-border-soft) !important; border-radius: 0 !important; box-shadow: none !important;
}
.client-page-header::before, .client-page-header::after { display: none !important; content: none !important; }
.settings-ready { display: none !important; }
.settings-ready.ready { color: #34d399 !important; background: rgba(16,185,129,.1) !important; border-color: rgba(16,185,129,.22) !important; }
.admin-page-head .eyebrow, .client-page-header .eyebrow { margin: 0 0 3px !important; color: var(--np-blue) !important; font-size: 10px !important; font-weight: 700 !important; text-transform: none; }
.admin-page-head h1, .client-page-header h1 { margin: 0 !important; color: var(--np-text) !important; font-size: 26px !important; line-height: 1.3 !important; font-weight: 700 !important; }
.admin-page-head p:not(.eyebrow), .client-page-header p { max-width: 720px; margin: 5px 0 0 !important; color: var(--np-muted) !important; font-size: 13px !important; }
.panel, .data-table-shell, .client-card, .settings-nav-card, .settings-panel, .settings-overview-grid > article {
  color: var(--np-text) !important; background: var(--np-card) !important;
  border: 1px solid var(--np-border) !important; border-radius: var(--np-radius) !important;
  box-shadow: 0 1px 2px rgba(16,24,40,.02) !important;
}
.analytics-kpis, .admin-kpi-grid { display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 12px !important; margin: 0 0 16px !important; }
.analytics-kpi, .admin-kpi-card { min-height: 118px !important; padding: 16px !important; color: var(--np-text) !important; background: var(--np-card) !important; border: 1px solid var(--np-border-soft) !important; border-radius: var(--np-radius) !important; box-shadow: var(--np-shadow) !important; }
.analytics-kpi span, .admin-kpi-card span { color: var(--np-muted) !important; font-size: 10px !important; font-weight: 600 !important; text-transform: none !important; }
.analytics-kpi strong, .admin-kpi-card strong { margin: 8px 0 2px !important; display: block !important; color: var(--np-text) !important; font-size: 25px !important; font-weight: 700 !important; font-variant-numeric: tabular-nums; }
.analytics-kpi p, .admin-kpi-card p { margin: 0 !important; color: var(--np-muted) !important; font-size: 10px !important; }
.analytics-grid, .dashboard-layout-grid, .admin-workspace-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 12px !important; margin: 0 0 16px !important; }
.analytics-grid > .panel, .dashboard-layout-grid > .panel { padding: 17px !important; }
.analytics-chart, .analytics-status, .analytics-products { color: var(--np-text) !important; background: var(--np-card) !important; border-color: var(--np-border-soft) !important; }
.admin-list-grid, .admin-products-grid, .coupon-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 8px !important; }
.admin-list-grid > .panel.admin-entity-card,
.admin-products-grid > .panel,
.admin-entity-card {
  min-width: 0 !important; padding: 14px !important; color: var(--np-text) !important;
  background: var(--np-card) !important; border: 1px solid var(--np-border-soft) !important;
  border-radius: var(--np-radius) !important; box-shadow: var(--np-shadow) !important;
}
.admin-list-grid > .admin-entity-card { display: grid !important; grid-template-columns: minmax(190px,.8fr) minmax(0,2.4fr) 38px !important; align-items: center !important; gap: 14px !important; }
.admin-card-title { min-width: 0 !important; margin: 0 !important; }
.admin-card-title h2 { margin: 0 !important; color: var(--np-text) !important; font-size: 13px !important; }
.admin-card-title p { margin: 3px 0 0 !important; color: var(--np-muted) !important; font-size: 10px !important; }
.admin-badges { display: flex !important; flex-wrap: wrap !important; gap: 5px !important; margin-top: 7px !important; }
.admin-badges span { padding: 3px 7px !important; border: 1px solid rgba(37,99,235,.16) !important; border-radius: 999px !important; color: var(--np-blue) !important; background: rgba(37,99,235,.07) !important; font-size: 9px !important; }
.admin-entity-meta { min-width: 0 !important; display: grid !important; grid-template-columns: repeat(5,minmax(90px,1fr)) !important; gap: 6px !important; }
.admin-entity-meta > div, .customer-meta-grid > div, .order-meta-grid > div {
  min-height: 45px !important; padding: 7px 9px !important; display: grid !important; align-content: center !important; gap: 2px !important;
  color: var(--np-text) !important; background: var(--np-elevated) !important; border: 1px solid var(--np-border-soft) !important; border-radius: 6px !important;
}
.admin-entity-meta span, .customer-meta-grid span, .order-meta-grid span { color: var(--np-muted) !important; font-size: 8px !important; }
.admin-entity-meta strong, .customer-meta-grid strong, .order-meta-grid strong { color: var(--np-text) !important; font-size: 10px !important; overflow-wrap: anywhere; }
.admin-list-grid > .admin-entity-card > .admin-card-actions { justify-self: end !important; }
.admin-list-grid > .login-assist-card { grid-template-columns: minmax(180px,.72fr) minmax(0,2.2fr) 38px !important; grid-template-rows: auto auto !important; }
.login-assist-card .admin-entity-meta { grid-column: 2 !important; grid-row: 1 !important; grid-template-columns: repeat(4,minmax(86px,1fr)) !important; }
.login-assist-card .login-assist-user-agent { min-width: 0 !important; grid-column: 2 !important; grid-row: 2 !important; padding: 8px 10px !important; display: grid !important; grid-template-columns: 90px minmax(0,1fr) !important; gap: 8px !important; color: var(--np-muted) !important; background: var(--np-elevated) !important; border: 1px solid var(--np-border-soft) !important; border-radius: 6px !important; }
.login-assist-card .login-assist-user-agent span { font-size: 9px !important; }
.login-assist-card .login-assist-user-agent p { min-width: 0 !important; margin: 0 !important; color: var(--np-muted) !important; font-size: 9px !important; line-height: 1.45 !important; overflow-wrap: anywhere !important; }
.login-assist-card > .admin-card-actions { grid-column: 3 !important; grid-row: 1 / span 2 !important; align-self: center !important; }
.data-table-shell { width: 100% !important; overflow: auto !important; scrollbar-width: thin; scrollbar-color: var(--np-border) transparent; }
.data-table, .admin-data-table { width: 100% !important; table-layout: auto !important; border-collapse: collapse !important; background: transparent !important; }
.data-table thead, .admin-data-table thead { display: table-header-group !important; }
.data-table tbody, .admin-data-table tbody { display: table-row-group !important; }
.data-table tr, .admin-data-table tr { display: table-row !important; background: transparent !important; border: 0 !important; }
.data-table th, .admin-data-table th {
  height: 46px !important; padding: 11px 16px !important; color: var(--np-muted) !important; background: color-mix(in srgb,var(--np-card) 68%,var(--np-elevated)) !important;
  border-bottom: 1px solid var(--np-border) !important; font-size: 11px !important; font-weight: 700 !important; text-align: start !important; white-space: nowrap !important;
}
.data-table td, .admin-data-table td {
  min-width: 0 !important; height: 70px !important; padding: 12px 16px !important; color: var(--np-muted) !important;
  background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--np-border-soft) !important;
  font-size: 13px !important; text-align: start !important; vertical-align: middle !important; white-space: normal !important; overflow-wrap: anywhere;
}
.data-table tbody tr { transition: background-color .16s ease; }
.data-table tbody tr:hover td { background: color-mix(in srgb,var(--np-blue) 4%,var(--np-card)) !important; }
.data-table tbody tr:last-child td { border-bottom: 0 !important; }
.products-data-table { min-width: 820px !important; }
.plans-data-table { min-width: 900px !important; }
.accounts-data-table { min-width: 900px !important; }
.products-data-table th:first-child, .products-data-table td:first-child { width: 38% !important; }
.plans-data-table th:first-child, .plans-data-table td:first-child { width: 34% !important; }
.accounts-data-table th:first-child, .accounts-data-table td:first-child { width: 27% !important; }
.accounts-data-table th:nth-child(6), .accounts-data-table td:nth-child(6) { width: 26% !important; min-width: 230px !important; }
.accounts-data-table td:nth-child(6) .data-entity > div { min-width: 0 !important; display: block !important; }
.accounts-data-table td:nth-child(6) .data-primary { grid-column: 1 / -1 !important; }
.accounts-data-table td:nth-child(6) p { margin: 3px 0 0 !important; color: var(--np-muted) !important; font-size: 10px !important; line-height: 1.45 !important; white-space: normal !important; }
.accounts-data-table td:nth-child(6) p + p { display: none !important; }
.accounts-data-table .validator-pill { margin-top: 6px !important; }
.data-entity { min-width: 210px !important; display: flex !important; align-items: center !important; gap: 11px !important; }
.admin-product-media, .admin-account-avatar, .data-avatar {
  width: 42px !important; height: 42px !important; min-width: 42px !important; margin: 0 !important;
  display: grid !important; place-items: center !important; overflow: hidden !important;
  border: 1px solid var(--np-border) !important; border-radius: 8px !important; color: var(--np-blue) !important; background: var(--np-elevated) !important;
}
.admin-product-media img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
.data-primary strong { display: block !important; color: var(--np-text) !important; font-size: 13px !important; line-height: 1.45 !important; }
.data-primary small { display: block !important; max-width: 260px; color: var(--np-muted) !important; font-size: 11px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.status-badge, .admin-micro-badge, .mini-badge {
  min-height: 24px !important; padding: 3px 8px !important; display: inline-flex !important; align-items: center !important; gap: 5px !important;
  border: 1px solid var(--np-border) !important; border-radius: 999px !important; color: var(--np-muted) !important; background: var(--np-elevated) !important;
  font-size: 10px !important; line-height: 1 !important; font-weight: 700 !important; white-space: nowrap !important;
}
.status-active, .status-success { color: var(--np-green) !important; background: rgba(22,163,74,.09) !important; border-color: rgba(22,163,74,.20) !important; }
.status-warning { color: var(--np-amber) !important; background: rgba(245,158,11,.09) !important; border-color: rgba(245,158,11,.20) !important; }
.status-danger, .status-inactive { color: var(--np-red) !important; background: rgba(220,38,38,.09) !important; border-color: rgba(220,38,38,.20) !important; }
.btn, button.btn, a.btn {
  min-height: 38px !important; padding: 8px 14px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px !important;
  border: 1px solid transparent !important; border-radius: 9px !important; color: #fff !important; background: var(--np-blue) !important;
  box-shadow: 0 6px 16px rgba(36,87,230,.16) !important; font-family: var(--np-font) !important; font-size: 12px !important; font-weight: 700 !important; text-decoration: none !important; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
}
.btn:hover { background: var(--np-blue-strong) !important; transform: translateY(-1px); box-shadow: 0 9px 22px rgba(36,87,230,.2) !important; }
.btn:active { transform: translateY(0) scale(.985); }
.btn:focus-visible, .ah-nav a:focus-visible, .customer-side-nav a:focus-visible, .admin-action-trigger:focus-visible { outline: 3px solid rgba(36,87,230,.2) !important; outline-offset: 2px !important; }
.btn.small { min-height: 32px !important; padding: 6px 10px !important; font-size: 11px !important; }
.btn.ghost-btn, .btn.secondary { color: var(--np-text) !important; background: var(--np-elevated) !important; border-color: var(--np-border) !important; box-shadow: none !important; }
.btn.danger { color: #fb7185 !important; background: rgba(244,63,94,.1) !important; border-color: rgba(244,63,94,.22) !important; box-shadow: none !important; }
.data-actions { width: 68px !important; min-width: 68px !important; white-space: nowrap !important; }
.admin-card-actions, .product-quick-actions { display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 6px !important; flex-wrap: nowrap !important; }
[dir="rtl"] .admin-card-actions, [dir="rtl"] .product-quick-actions { justify-content: flex-start !important; }
.admin-action-menu { position: relative !important; display: inline-flex !important; width: 34px !important; height: 34px !important; }
.admin-action-trigger {
  width: 34px !important; height: 34px !important; min-width: 34px !important; padding: 0 !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 3px !important;
  border: 1px solid var(--np-border) !important; border-radius: 8px !important; color: var(--np-muted) !important; background: var(--np-elevated) !important; box-shadow: none !important;
}
.admin-action-trigger span { width: 3px !important; height: 3px !important; border-radius: 50% !important; background: currentColor !important; }
.admin-action-panel,
body.ah-admin-body > .admin-floating-action-panel {
  position: fixed !important; z-index: 700 !important; width: 190px !important; padding: 6px !important;
  gap: 3px !important; border: 1px solid var(--np-border) !important; border-radius: 10px !important;
  background: var(--np-card) !important; box-shadow: var(--np-shadow) !important;
}
.admin-action-panel { display: none !important; }
.admin-action-menu.is-open .admin-action-panel { display: grid !important; }
body.ah-admin-body > .admin-floating-action-panel {
  z-index: 1200 !important; display: grid !important; overflow-x: hidden !important; overflow-y: auto !important;
  color: var(--np-text) !important; isolation: isolate; transform-origin: top center;
}
.admin-action-panel .admin-action-item, .admin-action-panel form.admin-action-item, .admin-action-panel form.admin-action-item button,
.admin-floating-action-panel .admin-action-item, .admin-floating-action-panel form.admin-action-item, .admin-floating-action-panel form.admin-action-item button {
  width: 100% !important; min-height: 34px !important; margin: 0 !important; justify-content: flex-start !important;
  padding: 8px 10px !important; display: flex !important; align-items: center !important; gap: 8px !important;
  color: var(--np-text) !important; background: transparent !important; border: 0 !important; border-radius: 7px !important;
  box-shadow: none !important; font-family: var(--np-font) !important; font-size: 12px !important; text-align: start !important;
}
.admin-action-panel .admin-action-item:hover, .admin-action-panel form.admin-action-item button:hover,
.admin-floating-action-panel .admin-action-item:hover, .admin-floating-action-panel form.admin-action-item button:hover { background: var(--np-hover) !important; }
.admin-action-panel form.admin-action-item button.danger,
.admin-floating-action-panel form.admin-action-item button.danger { color: #fb7185 !important; }

/* Forms and centered dialogs */
input, select, textarea {
  min-height: 42px; width: 100%; padding: 9px 12px !important;
  border: 1px solid var(--np-border) !important; border-radius: 8px !important; outline: none;
  color: var(--np-text) !important; background: var(--np-input) !important; font-family: var(--np-font) !important; font-size: 13px !important;
}
select {
  appearance: none !important; -webkit-appearance: none !important;
  padding-inline-end: 38px !important; color-scheme: light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2359677a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 12px center !important; background-size: 15px 15px !important;
}
[dir="rtl"] select { background-position: left 12px center !important; }
html[data-theme="dark"] select { color-scheme: dark; }
html[data-theme="dark"] select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
}
select[multiple], select[size]:not([size="1"]) { padding-inline-end: 12px !important; background-image: none !important; }
select option, select optgroup { color: var(--np-text) !important; background: var(--np-card) !important; font-family: var(--np-font) !important; }
select:disabled { cursor: not-allowed; opacity: .6; }
[dir="rtl"] input[type="url"], [dir="rtl"] input[type="email"], [dir="rtl"] input[type="password"], [dir="rtl"] code { direction: ltr !important; text-align: left !important; }
textarea { min-height: 96px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--np-blue) !important; box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important; }
.form-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 14px !important; }
.form-grid > textarea, .form-grid > .check, .form-grid > button, .form-grid > label:has(select[multiple]) { grid-column: 1 / -1; }
.check { min-height: 38px; padding: 8px 10px; display: flex !important; align-items: center !important; gap: 8px !important; border: 1px solid var(--np-border-soft); border-radius: 8px; color: var(--np-muted); background: var(--np-elevated); }
.check input { width: 16px !important; min-height: 16px !important; margin: 0 !important; }
.admin-modal {
  position: fixed !important; inset: 0 !important; z-index: 1000 !important; padding: 24px !important;
  display: none !important; align-items: center !important; justify-content: center !important;
  background: rgba(3,7,18,.7) !important; backdrop-filter: blur(7px) !important;
}
.admin-modal.is-open { display: flex !important; }
.admin-modal-panel {
  width: min(840px,calc(100vw - 32px)) !important; max-height: calc(100vh - 40px) !important;
  display: flex !important; flex-direction: column !important; overflow: hidden !important;
  color: var(--np-text) !important; background: var(--np-card) !important; border: 1px solid var(--np-border) !important;
  border-radius: 10px !important; box-shadow: 0 28px 80px rgba(2,6,23,.34) !important;
}
.admin-modal-head { min-height: 94px !important; padding: 18px 20px !important; display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 16px !important; color: var(--np-text) !important; background: var(--np-card) !important; border-bottom: 1px solid var(--np-border-soft) !important; }
.admin-modal-head span { color: var(--np-blue) !important; font-size: 9px !important; font-weight: 700 !important; }
.admin-modal-head h2 { margin: 2px 0 !important; color: var(--np-text) !important; font-size: 18px !important; }
.admin-modal-head p { max-width: 620px !important; margin: 2px 0 0 !important; color: var(--np-muted) !important; font-size: 10px !important; line-height: 1.55 !important; }
.admin-modal-close { width: 34px !important; height: 34px !important; flex: 0 0 34px !important; padding: 0 !important; display: grid !important; place-items: center !important; border: 1px solid var(--np-border) !important; border-radius: 7px !important; color: var(--np-muted) !important; background: var(--np-elevated) !important; font-family: var(--np-font) !important; font-size: 14px !important; cursor: pointer; }
.admin-modal-close:hover { color: var(--np-text) !important; border-color: var(--np-blue) !important; }
.admin-modal-body { min-height: 0 !important; padding: 16px !important; overflow: auto !important; color: var(--np-text) !important; background: var(--np-bg) !important; }
.admin-modal-body .settings-layout { gap: 12px !important; }
.admin-modal-body .settings-nav-card, .admin-modal-body .settings-panel { background: var(--np-card) !important; }
.admin-modal-body label { color: var(--np-text) !important; font-size: 11px !important; }
.admin-modal-dialog {
  position: relative !important; width: min(820px, 100%) !important; max-height: min(820px, calc(100vh - 48px)) !important;
  margin: 0 !important; padding: 22px !important; overflow: auto !important;
  color: var(--np-text) !important; background: var(--np-card) !important; border: 1px solid var(--np-border) !important;
  border-radius: 14px !important; box-shadow: 0 30px 90px rgba(0,0,0,.38) !important;
}
.admin-modal-dialog > summary, .admin-modal-title { margin: -22px -22px 20px !important; padding: 18px 22px !important; border-bottom: 1px solid var(--np-border) !important; color: var(--np-text) !important; font-size: 16px !important; font-weight: 700 !important; }
.admin-create { margin: 0 0 18px !important; padding: 0 !important; }

/* Settings mirrors the Node grouped configuration layout. */
.settings-overview-grid { margin: 0 0 20px !important; display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 14px !important; }
.settings-overview-grid > article { min-width: 0 !important; min-height: 112px !important; padding: 18px !important; display: grid !important; grid-template-columns: 42px minmax(0,1fr) !important; align-items: start !important; gap: 13px !important; overflow: hidden !important; }
.settings-overview-grid > article > i { width: 42px !important; height: 42px !important; display: grid !important; place-items: center !important; border: 1px solid rgba(36,87,230,.16) !important; border-radius: 8px !important; color: var(--np-blue) !important; background: rgba(36,87,230,.07) !important; }
.settings-overview-grid > article > div { min-width: 0 !important; display: grid !important; gap: 3px !important; }
.settings-overview-grid span { color: var(--np-muted) !important; font-size: 10px !important; font-weight: 600 !important; }
.settings-overview-grid h2, .settings-overview-grid strong { margin: 0 !important; color: var(--np-text) !important; font-size: 14px !important; line-height: 1.5 !important; overflow-wrap: anywhere !important; }
.settings-overview-grid p, .settings-overview-grid small { min-width: 0 !important; margin: 0 !important; color: var(--np-muted) !important; font-size: 11px !important; line-height: 1.55 !important; overflow-wrap: anywhere !important; }
.settings-layout { display: grid !important; grid-template-columns: 220px minmax(0,1fr) !important; gap: 16px !important; align-items: start !important; }
.settings-nav-card { position: sticky !important; top: calc(var(--np-topbar) + 18px) !important; padding: 12px !important; }
.settings-nav-card > strong { display: block !important; margin: 2px 8px 10px !important; color: var(--np-text) !important; font-size: 12px !important; }
.settings-nav-card a { min-height: 42px; padding: 9px 10px; display: flex; align-items: center; gap: 9px; border-radius: 8px; color: var(--np-muted); text-decoration: none; font-size: 12px; font-weight: 600; }
.settings-nav-card a span { width: 25px !important; height: 25px !important; display: grid !important; place-items: center !important; border-radius: 6px !important; color: var(--np-blue) !important; background: rgba(36,87,230,.07) !important; font-size: 9px !important; }
.settings-nav-card a:hover { color: var(--np-text); background: var(--np-hover); }
.settings-sections { display: grid !important; gap: 16px !important; }
.settings-panel { padding: 22px !important; }
.panel-title { margin: 0 0 18px !important; padding: 0 0 14px !important; border-bottom: 1px solid var(--np-border-soft) !important; }
.obs-data-panel { overflow: hidden !important; }
.obs-data-panel .panel-title { width: auto !important; max-width: 100% !important; margin: 0 0 18px !important; inset: auto !important; transform: none !important; }
.panel-title h2 { margin: 0 !important; color: var(--np-text) !important; font-size: 16px !important; }
.panel-title p { margin: 4px 0 0 !important; color: var(--np-muted) !important; font-size: 12px !important; }
.settings-actions { position: sticky !important; bottom: 16px !important; padding: 12px !important; display: flex !important; justify-content: flex-end !important; background: color-mix(in srgb, var(--np-card) 92%, transparent) !important; border: 1px solid var(--np-border) !important; border-radius: 10px !important; backdrop-filter: blur(12px); }

/* Customer workspace */
.ah-workspace-body > .topbar, .ah-workspace-body > .footer { display: none !important; }
.customer-shell { padding: 0 !important; gap: 0 !important; }
.customer-nav-backdrop, .ah-sidebar-backdrop { display: none !important; position: fixed !important; inset: 0 !important; z-index: 55 !important; border: 0 !important; background: rgba(3,7,18,.56) !important; }
.customer-main { min-width: 0 !important; width: calc(100% - var(--np-sidebar)) !important; margin-left: var(--np-sidebar) !important; background: var(--np-bg) !important; }
[dir="rtl"] .customer-main { margin-left: 0 !important; margin-right: var(--np-sidebar) !important; }
.customer-topbar {
  position: sticky !important; top: 0 !important; z-index: 45 !important; min-height: var(--np-topbar) !important;
  padding: 0 28px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important;
  background: var(--np-topbar-bg) !important; border-bottom: 1px solid var(--np-border-soft) !important; backdrop-filter: blur(16px);
}
.customer-nav-toggle { display: none !important; }
.customer-search { width: min(320px, 40vw) !important; height: 38px !important; padding: 0 11px !important; display: flex !important; align-items: center !important; gap: 8px !important; border: 1px solid var(--np-border) !important; border-radius: 9px !important; background: var(--np-elevated) !important; }
.customer-search input { min-height: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: transparent !important; }
.customer-topbar-actions { display: flex !important; align-items: center !important; gap: 8px !important; }
.customer-language-switch, .customer-theme-toggle { width: auto !important; margin: 0 !important; }
.customer-theme-toggle { width: 38px !important; padding: 0 !important; }
.customer-topbar-user { height: 40px !important; padding: 4px 8px !important; display: flex !important; align-items: center !important; gap: 8px !important; color: var(--np-text) !important; }
.customer-topbar-user > span { width: 32px !important; height: 32px !important; display: grid !important; place-items: center !important; border-radius: 8px !important; color: #fff !important; background: var(--np-blue) !important; }
.customer-topbar-user strong { max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px !important; }
.customer-sidebar-user { flex: none !important; margin: 10px 12px 14px !important; padding: 10px !important; display: grid !important; grid-template-columns: 34px minmax(0,1fr) 28px !important; align-items: center !important; gap: 8px !important; border: 1px solid var(--np-border) !important; border-radius: 10px !important; background: var(--np-elevated) !important; }
.customer-sidebar-user > span { width: 34px !important; height: 34px !important; display: grid !important; place-items: center !important; border-radius: 8px !important; color: #fff !important; background: var(--np-blue) !important; }
.customer-sidebar-user strong, .customer-sidebar-user small { display: block !important; max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.customer-sidebar-user strong { color: var(--np-text) !important; font-size: 11px !important; }
.customer-sidebar-user small { color: var(--np-muted) !important; font-size: 9px !important; }
.customer-sidebar-user button { width: 28px !important; height: 28px !important; padding: 0 !important; border: 0 !important; color: var(--np-muted) !important; background: transparent !important; }
.customer-content {
  width: 100% !important; max-width: 1480px !important; min-width: 0 !important;
  margin: 0 auto !important; padding: 30px 32px 52px !important; background: transparent !important;
}
.client-overview-page { display: grid !important; gap: 18px !important; }
.client-summary-strip { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 14px !important; }
.client-summary-strip > div, .client-summary-strip > article {
  min-height: 112px !important; padding: 18px !important; color: var(--np-text) !important; background: var(--np-card) !important;
  border: 1px solid var(--np-border) !important; border-radius: var(--np-radius) !important; box-shadow: none !important;
}
.client-summary-strip > div { position: relative !important; display: grid !important; align-content: center !important; gap: 4px !important; overflow: hidden !important; }
.client-summary-strip > div::after { content: ""; position: absolute; inset-block: 0 !important; inset-inline-start: 0 !important; inset-inline-end: auto !important; width: 4px; height: 100%; border-radius: 0; background: var(--np-blue); }
.client-summary-strip strong { color: var(--np-text) !important; font-size: 25px !important; line-height: 1 !important; }
.client-summary-strip span { color: var(--np-muted) !important; font-size: 11px !important; }
.client-extension-banner {
  min-height: 96px !important; padding: 18px 20px !important; display: grid !important;
  grid-template-columns: 48px minmax(0,1fr) auto !important; align-items: center !important; gap: 14px !important;
  color: var(--np-text) !important; background: var(--np-card) !important; border: 1px solid var(--np-border) !important; border-radius: var(--np-radius) !important;
}
.client-extension-icon { width: 48px !important; height: 48px !important; display: grid !important; place-items: center !important; border-radius: 8px !important; color: var(--np-blue) !important; background: rgba(37,99,235,.08) !important; border: 1px solid rgba(37,99,235,.16) !important; }
.client-extension-banner span, .client-extension-banner strong, .client-extension-banner p { display: block !important; margin: 0 !important; }
.client-extension-banner span { color: var(--np-blue) !important; font-size: 10px !important; font-weight: 700 !important; }
.client-extension-banner strong { color: var(--np-text) !important; font-size: 14px !important; }
.client-extension-banner p { color: var(--np-muted) !important; font-size: 11px !important; }
.client-dashboard-grid { display: grid !important; grid-template-columns: minmax(0,1.65fr) minmax(280px,.72fr) !important; gap: 18px !important; align-items: start !important; }
.client-dashboard-main, .client-dashboard-side { display: grid !important; gap: 16px !important; }
.client-card { padding: 20px !important; }
.client-subscription-card, .client-services-panel, .client-side-card { color: var(--np-text) !important; background: var(--np-card) !important; border: 1px solid var(--np-border) !important; border-radius: var(--np-radius) !important; box-shadow: none !important; }
.client-card-head { margin: 0 0 15px !important; padding: 0 0 13px !important; border-bottom: 1px solid var(--np-border-soft) !important; }
.client-card-head h2 { margin: 0 !important; color: var(--np-text) !important; font-size: 15px !important; }
.client-card-head p { margin: 3px 0 0 !important; color: var(--np-muted) !important; font-size: 11px !important; }
.client-service-list, .client-activity-list { display: grid !important; gap: 0 !important; }
.client-service-row { min-height: 72px !important; padding: 12px 0 !important; display: grid !important; grid-template-columns: 44px minmax(0,1fr) auto auto !important; align-items: center !important; gap: 12px !important; border-bottom: 1px solid var(--np-border-soft) !important; }
.client-service-row:last-child { border-bottom: 0 !important; }
.client-service-mark { width: 42px !important; height: 42px !important; display: grid !important; place-items: center !important; border-radius: 8px !important; color: var(--np-blue) !important; background: var(--np-elevated) !important; border: 1px solid var(--np-border) !important; }
.client-current-plan { min-height: 78px !important; padding: 14px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; border: 1px solid var(--np-border-soft) !important; border-radius: 10px !important; background: var(--np-elevated) !important; }
.client-current-plan strong, .client-profile-card strong { color: var(--np-text) !important; }
.client-current-plan p, .client-profile-card p { margin: 4px 0 0 !important; color: var(--np-muted) !important; font-size: 11px !important; }
.client-activity-list > a, .client-activity-list > div { padding: 11px 0 !important; display: grid !important; gap: 2px !important; color: var(--np-text) !important; text-decoration: none !important; border-bottom: 1px solid var(--np-border-soft) !important; }
.client-activity-list > :last-child { border-bottom: 0 !important; }
.client-activity-list strong { font-size: 12px !important; }
.client-activity-list span, .client-activity-list p { margin: 0 !important; color: var(--np-muted) !important; font-size: 10px !important; }

/* Reference dashboard components */
.nx-welcome {
  min-height: 78px; margin: 0 0 16px; padding: 16px 18px;
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  color: var(--np-text); background: var(--np-card); border: 1px solid var(--np-border-soft); border-radius: var(--np-radius); box-shadow: var(--np-shadow);
}
.nx-welcome-copy { display: flex; align-items: center; gap: 12px; min-width: 0; }
.nx-welcome-mark { width: 40px; height: 40px; flex: 0 0 40px; display: grid; place-items: center; border-radius: 8px; color: #fff; background: var(--np-blue); font-weight: 800; }
.nx-welcome-copy small { display: block; color: var(--np-blue); font-size: 10px; font-weight: 700; }
.nx-welcome-copy h1 { margin: 1px 0 0; color: var(--np-text); font-size: 19px; line-height: 1.3; font-weight: 700; }
.nx-welcome-meta { margin-top: 5px; display: flex; align-items: center; gap: 10px; color: var(--np-muted); font-size: 10px; }
.nx-welcome-meta b { display: inline-flex; align-items: center; gap: 5px; color: var(--np-green); }
.nx-welcome-meta b i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.nx-welcome-meta em { padding: 2px 7px; border-radius: 999px; color: var(--np-blue); background: color-mix(in srgb,var(--np-blue) 9%,transparent); font-style: normal; }
.nx-add-product { background: var(--np-blue) !important; }

.nx-kpi-grid { margin: 0 0 16px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.nx-kpi {
  --tone: var(--np-blue); min-height: 126px; padding: 16px; display: block; position: relative; overflow: hidden;
  color: var(--np-text); background: var(--np-card); border: 1px solid var(--np-border-soft); border-radius: var(--np-radius); box-shadow: var(--np-shadow); text-decoration: none;
}
.nx-kpi.green { --tone: var(--np-green); }
.nx-kpi.teal { --tone: var(--np-teal); }
.nx-kpi.amber { --tone: var(--np-amber); }
.nx-kpi-top { margin-bottom: 12px; display: flex; align-items: flex-start; justify-content: space-between; }
.nx-kpi-top i { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid color-mix(in srgb,var(--tone) 20%,transparent); border-radius: 7px; color: var(--tone); background: color-mix(in srgb,var(--tone) 9%,transparent); }
.nx-kpi-top span { padding: 2px 7px; border-radius: 999px; color: var(--np-green); background: color-mix(in srgb,var(--np-green) 9%,transparent); font-size: 9px; font-weight: 700; }
.nx-kpi > strong { display: block; margin-bottom: 3px; color: var(--np-text); font-size: 25px; line-height: 1; font-weight: 700; font-variant-numeric: tabular-nums; }
.nx-kpi h2 { margin: 0; color: var(--np-text); font-size: 12px; font-weight: 600; }
.nx-kpi p { margin: 3px 0 0; color: var(--np-muted); font-size: 10px; }

.nx-overview-grid { margin: 0 0 16px; display: grid; grid-template-columns: minmax(0,1.6fr) minmax(250px,.7fr); gap: 12px; }
.nx-performance-panel, .nx-health-panel { padding: 17px; color: var(--np-text); background: var(--np-card); border: 1px solid var(--np-border-soft); border-radius: var(--np-radius); box-shadow: var(--np-shadow); }
.nx-performance-panel > header, .nx-health-panel > header { margin-bottom: 16px; display: flex; justify-content: space-between; gap: 12px; }
.nx-performance-panel small, .nx-health-panel small { color: var(--np-blue); font-size: 9px; font-weight: 700; }
.nx-performance-panel h2, .nx-health-panel h2 { margin: 2px 0 0; color: var(--np-text); font-size: 14px; }
.nx-performance-panel > header > span { color: var(--np-muted); font-size: 10px; }
.nx-performance-list { display: grid; gap: 13px; }
.nx-performance-list > div > div { margin-bottom: 6px; display: flex; justify-content: space-between; gap: 12px; }
.nx-performance-list strong { color: var(--np-muted); font-size: 11px; font-weight: 500; }
.nx-performance-list b { color: var(--np-text); font-size: 11px; font-variant-numeric: tabular-nums; }
.nx-performance-list span { height: 6px; display: block; overflow: hidden; border-radius: 999px; background: var(--np-elevated); }
.nx-performance-list i { height: 100%; display: block; border-radius: inherit; background: var(--np-blue); }
.nx-health-score { width: 92px; height: 92px; margin: 0 auto 14px; display: grid; place-content: center; text-align: center; border: 7px solid color-mix(in srgb,var(--np-green) 22%,var(--np-elevated)); border-top-color: var(--np-green); border-radius: 50%; }
.nx-health-score strong { color: var(--np-text); font-size: 21px; line-height: 1; }
.nx-health-score span { margin-top: 4px; color: var(--np-green); font-size: 9px; }
.nx-health-panel ul { margin: 0; padding: 0; display: grid; gap: 7px; list-style: none; }
.nx-health-panel li { display: flex; justify-content: space-between; color: var(--np-muted); font-size: 10px; }
.nx-health-panel li::before { content: ""; width: 6px; height: 6px; margin-top: 5px; border-radius: 50%; background: var(--np-green); }
.nx-health-panel li b { margin-inline-start: auto; color: var(--np-text); }

.nx-table-panel { margin: 0 0 16px; overflow: hidden; color: var(--np-text); background: var(--np-card); border: 1px solid var(--np-border-soft); border-radius: var(--np-radius); box-shadow: var(--np-shadow); }
.nx-table-panel > header { min-height: 58px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--np-border-soft); }
.nx-panel-title { display: flex; align-items: center; gap: 10px; }
.nx-panel-title > i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 7px; color: var(--np-blue); background: color-mix(in srgb,var(--np-blue) 9%,transparent); }
.nx-panel-title h2 { margin: 0; color: var(--np-text); font-size: 13px; }
.nx-panel-title p { margin: 2px 0 0; color: var(--np-muted); font-size: 10px; }
.nx-table-panel > header > a { color: var(--np-blue); font-size: 10px; font-weight: 700; text-decoration: none; }
.nx-table-scroll { overflow-x: auto; }
.nx-orders-table { width: 100%; border-collapse: collapse; }
.nx-orders-table th { height: 40px; padding: 8px 16px; color: var(--np-muted); background: var(--np-elevated); border-bottom: 1px solid var(--np-border-soft); font-size: 9px; text-align: start; }
.nx-orders-table td { height: 50px; padding: 9px 16px; color: var(--np-muted); border-bottom: 1px solid var(--np-border-soft); font-size: 11px; }
.nx-orders-table tbody tr:last-child td { border-bottom: 0; }
.nx-orders-table code, .nx-orders-table b { color: var(--np-text); font: inherit; font-weight: 600; }
.nx-customer { display: flex; align-items: center; gap: 8px; }
.nx-customer i { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 6px; color: var(--np-blue); background: color-mix(in srgb,var(--np-blue) 9%,transparent); font-style: normal; }
.nx-orders-table em { padding: 3px 7px; border-radius: 999px; color: var(--np-amber); background: color-mix(in srgb,var(--np-amber) 10%,transparent); font-size: 9px; font-style: normal; }
.nx-orders-table em.paid, .nx-orders-table em.completed { color: var(--np-green); background: color-mix(in srgb,var(--np-green) 10%,transparent); }
.nx-quick-section > header { margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.nx-quick-section > header > i { width: 3px; height: 18px; border-radius: 2px; background: var(--np-blue); }
.nx-quick-section h2 { margin: 0; color: var(--np-text); font-size: 13px; }
.nx-quick-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.nx-quick-grid a { min-height: 70px; padding: 12px; display: flex; align-items: center; gap: 10px; color: var(--np-text); background: var(--np-card); border: 1px solid var(--np-border-soft); border-radius: var(--np-radius); text-decoration: none; }
.nx-quick-grid a:hover { border-color: color-mix(in srgb,var(--np-blue) 35%,var(--np-border)); background: var(--np-hover); }
.nx-quick-grid a > i { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 7px; color: var(--np-blue); background: color-mix(in srgb,var(--np-blue) 9%,transparent); }
.nx-quick-grid span { font-size: 11px; font-weight: 600; }

/* Operational pages use the same reference tokens. */
.obs-workspace {
  --obs-blue: var(--np-blue) !important; --obs-blue-soft: color-mix(in srgb,var(--np-blue) 9%,transparent) !important;
  --obs-green: var(--np-green) !important; --obs-green-soft: color-mix(in srgb,var(--np-green) 9%,transparent) !important;
  --obs-red: var(--np-red) !important; --obs-red-soft: color-mix(in srgb,var(--np-red) 9%,transparent) !important;
  --obs-cyan: var(--np-teal) !important; --obs-ink: var(--np-text) !important; --obs-muted: var(--np-muted) !important;
  --obs-line: var(--np-border-soft) !important; --obs-surface: var(--np-card) !important; --obs-soft: var(--np-elevated) !important;
}
.obs-summary, .obs-data-panel, .obs-filter-panel, .obs-session-row, .obs-log-row, .extension-status-card { color: var(--np-text) !important; background: var(--np-card) !important; border-color: var(--np-border-soft) !important; border-radius: var(--np-radius) !important; box-shadow: var(--np-shadow) !important; }
.obs-summary { margin-bottom: 16px !important; overflow: hidden !important; }
.obs-metric { min-height: 108px !important; padding: 15px !important; }
.obs-metric strong { color: var(--np-text) !important; }
.obs-data-panel > .panel-title { max-width: none !important; margin: 0 !important; padding: 15px 16px !important; background: var(--np-card) !important; border-bottom: 1px solid var(--np-border-soft) !important; }
.obs-table-shell { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }

@media (max-width: 1100px) {
  .nx-kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .nx-overview-grid { grid-template-columns: 1fr; }
  .admin-list-grid > .admin-entity-card { grid-template-columns: minmax(170px,.7fr) minmax(0,2fr) 38px !important; }
  .admin-entity-meta { grid-template-columns: repeat(3,minmax(90px,1fr)) !important; }
}

/* Responsive */
@media (max-width: 1100px) {
  .settings-overview-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .client-dashboard-grid { grid-template-columns: 1fr !important; }
  .ah-nav-search { width: 170px !important; }
  body.ah-public-body .landing-product-rows,
  body.ah-public-body .public-product-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width: 820px) {
  .ah-shell, .customer-shell, [dir="rtl"] .ah-shell, [dir="rtl"] .customer-shell { display: block !important; }
  .ah-sidebar, .customer-sidebar { transform: translateX(calc(-100% - 10px)); box-shadow: var(--np-shadow) !important; transition: transform .2s ease; }
  [dir="rtl"] .ah-sidebar, [dir="rtl"] .customer-sidebar { transform: translateX(calc(100% + 10px)); }
  body.admin-nav-open .ah-sidebar, body.customer-nav-open .customer-sidebar { transform: translateX(0) !important; }
  body.admin-nav-open .ah-sidebar-backdrop, body.customer-nav-open .customer-nav-backdrop { display: block !important; }
  .ah-main, [dir="rtl"] .ah-main, .customer-content, [dir="rtl"] .customer-content { display: block !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
  .customer-main, [dir="rtl"] .customer-main { display: block !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
  .ah-topbar { padding: 0 16px !important; }
  .ah-mobile-toggle { width: 38px !important; height: 38px !important; padding: 0 !important; display: inline-grid !important; place-items: center !important; border: 1px solid var(--np-border) !important; border-radius: 8px !important; color: var(--np-text) !important; background: var(--np-elevated) !important; }
  .ah-topbar { min-height: 64px !important; height: 64px !important; flex-wrap: nowrap !important; overflow: hidden !important; }
  .ah-nav-search, .ah-profile-menu, .language-switch, .ah-topbar-title small, .ah-breadcrumbs { display: none !important; }
  .ah-topbar-title > strong { font-size: 13px !important; white-space: nowrap; }
  .ah-topbar-actions { flex: none !important; }
  .ah-content, .customer-content { padding: 20px 16px 36px !important; }
  .customer-topbar { padding: 0 16px !important; }
  .customer-nav-toggle { width: 38px !important; height: 38px !important; padding: 9px !important; display: grid !important; gap: 4px !important; border: 1px solid var(--np-border) !important; border-radius: 9px !important; background: var(--np-elevated) !important; }
  .customer-nav-toggle span { width: 18px !important; height: 2px !important; background: var(--np-text) !important; }
  .customer-search, .customer-topbar-user strong, .customer-language-switch span { display: none !important; }
  .admin-page-head h1, .client-page-header h1 { font-size: 22px !important; }
  .settings-layout { grid-template-columns: 1fr !important; }
  .settings-nav-card { position: static !important; display: flex !important; overflow-x: auto !important; }
  .admin-list-grid > .admin-entity-card { grid-template-columns: minmax(0,1fr) 38px !important; }
  .admin-list-grid > .admin-entity-card .admin-entity-meta { grid-column: 1 / -1 !important; grid-row: 2 !important; }
  .admin-list-grid > .login-assist-card { grid-template-columns: minmax(0,1fr) 38px !important; grid-template-rows: auto !important; }
  .login-assist-card .admin-entity-meta { grid-column: 1 / -1 !important; grid-row: auto !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .login-assist-card .login-assist-user-agent { grid-column: 1 / -1 !important; grid-row: auto !important; grid-template-columns: 1fr !important; }
  .login-assist-card > .admin-card-actions { grid-column: 2 !important; grid-row: 1 !important; }
  body.ah-public-body > .topbar { min-height: 64px !important; height: 64px !important; padding: 0 16px !important; flex-direction: row !important; flex-wrap: nowrap !important; }
  .public-nav-toggle { width: 38px !important; height: 38px !important; padding: 9px !important; display: grid !important; gap: 4px !important; border: 1px solid var(--np-border) !important; border-radius: 8px !important; color: var(--np-text) !important; background: var(--np-elevated) !important; box-shadow: none !important; }
  .public-nav-toggle span { width: 18px !important; height: 2px !important; background: var(--np-text) !important; }
  body.ah-public-body > .topbar .public-nav { position: fixed !important; inset: 64px 12px auto !important; padding: 10px !important; display: none !important; align-items: stretch !important; flex-direction: column !important; color: var(--np-text) !important; background: var(--np-card) !important; border: 1px solid var(--np-border) !important; border-radius: 8px !important; box-shadow: var(--np-shadow) !important; }
  body.ah-public-body.public-nav-open > .topbar .public-nav { display: flex !important; }
  body.ah-public-body > .topbar .public-nav > a,
  body.ah-public-body > .topbar .public-nav > form > button { width: 100% !important; justify-content: flex-start !important; }
  body.ah-public-body > .container { width: min(100% - 32px,680px) !important; margin: 24px auto !important; }
  body.ah-public-body .landing-hero { min-height: auto !important; padding: 28px !important; grid-template-columns: 1fr !important; gap: 28px !important; }
  body.ah-public-body .landing-hero-copy h1 { font-size: 38px !important; }
  body.ah-public-body .landing-section-head { align-items: start !important; flex-direction: column !important; }
  body.ah-public-body .landing-workflow { grid-template-columns: 1fr !important; }
}
@media (max-width: 640px) {
  .admin-page-head, .client-page-header { display: grid !important; }
  .settings-overview-grid, .client-summary-strip, .form-grid { grid-template-columns: 1fr !important; }
  .data-table-shell { border: 0 !important; background: transparent !important; overflow: visible !important; }
  .products-data-table, .plans-data-table, .accounts-data-table { width: 100% !important; min-width: 0 !important; }
  .data-table thead, .admin-data-table thead { display: none !important; }
  .data-table tbody, .admin-data-table tbody { display: grid !important; gap: 12px !important; }
  .data-table tr, .admin-data-table tr { display: grid !important; grid-template-columns: minmax(0,1fr) !important; padding: 14px !important; border: 1px solid var(--np-border) !important; border-radius: var(--np-radius) !important; background: var(--np-card) !important; }
  .data-table td, .admin-data-table td { width: 100% !important; min-height: 34px !important; height: auto !important; padding: 7px 0 !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; border-bottom: 1px solid var(--np-border-soft) !important; }
  .data-table td::before { content: attr(data-label); color: var(--np-subtle); font-size: 10px; font-weight: 700; }
  .data-table td:first-child { display: block !important; }
  .data-table td:first-child::before { display: none; }
  .data-table td:last-child { border-bottom: 0 !important; }
  .admin-card-actions, .product-quick-actions { width: 100% !important; justify-content: flex-end !important; flex-wrap: wrap !important; }
  .client-service-row { grid-template-columns: 42px minmax(0,1fr) !important; }
  .client-extension-banner { grid-template-columns: 42px minmax(0,1fr) !important; }
  .client-extension-banner .btn { grid-column: 1 / -1 !important; width: 100% !important; }
  .admin-entity-meta { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  body.ah-public-body .landing-hero { padding: 22px !important; }
  body.ah-public-body .landing-hero-copy h1 { font-size: 32px !important; }
  body.ah-public-body .landing-metrics,
  body.ah-public-body .landing-product-rows,
  body.ah-public-body .public-product-grid { grid-template-columns: 1fr !important; }
  body.ah-public-body .public-product-media { height: 210px !important; }
}

/* Unified operational lists and pagination */
html[dir="rtl"], html[dir="rtl"] body { direction: rtl; }
.ah-topbar, .customer-topbar { border-bottom: 1px solid var(--np-border) !important; box-shadow: 0 8px 28px rgba(27,46,79,.05) !important; }
.ah-topbar-title, .customer-topbar-brand { min-width: 0 !important; }
.ah-topbar-title > strong, .customer-topbar-brand strong { color: var(--np-text) !important; font-weight: 700 !important; }
.admin-pagination { min-height: 58px !important; margin: 0 0 14px !important; padding: 9px 12px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; border: 1px solid var(--np-border) !important; border-radius: 9px !important; background: var(--np-card) !important; }
.pagination-summary { display: flex !important; align-items: center !important; gap: 14px !important; color: var(--np-muted) !important; font-size: 12px !important; }
.pagination-size-form, .pagination-size-form label { margin: 0 !important; display: flex !important; align-items: center !important; gap: 7px !important; }
.pagination-size-form select { width: 76px !important; min-height: 34px !important; padding-block: 5px !important; }
.admin-pagination > div:last-child { display: flex !important; align-items: center !important; gap: 5px !important; }
.admin-pagination a { min-width: 34px !important; min-height: 34px !important; padding: 6px 9px !important; display: inline-grid !important; place-items: center !important; border: 1px solid var(--np-border) !important; border-radius: 7px !important; color: var(--np-muted) !important; background: var(--np-elevated) !important; text-decoration: none !important; }
.admin-pagination a:hover, .admin-pagination a.active { color: #fff !important; border-color: var(--np-blue) !important; background: var(--np-blue) !important; }
.session-date-filter { margin-bottom: 14px !important; grid-template-columns: minmax(220px,320px) auto !important; align-items: end !important; }
.session-filter-actions { display: flex !important; align-items: center !important; gap: 8px !important; flex-wrap: wrap !important; }
.plans-data-table td { vertical-align: middle !important; }
.plan-duration-chips, .plan-price-list { display: flex !important; gap: 6px !important; flex-wrap: wrap !important; }
.plan-duration-chips span { padding: 5px 8px !important; border: 1px solid rgba(36,87,230,.18) !important; border-radius: 6px !important; color: var(--np-blue) !important; background: var(--np-blue-soft) !important; font-size: 11px !important; font-weight: 700 !important; }
.plan-price-list > span { min-width: 92px !important; padding: 7px 9px !important; display: grid !important; gap: 2px !important; border: 1px solid var(--np-border-soft) !important; border-radius: 7px !important; background: var(--np-elevated) !important; }
.plan-price-list small { color: var(--np-muted) !important; font-size: 9px !important; }
.plan-price-list strong { color: var(--np-text) !important; font-size: 12px !important; }
.form-readonly-entity { min-height: 54px !important; padding: 9px 12px !important; display: grid !important; gap: 3px !important; border: 1px solid var(--np-border) !important; border-radius: 8px !important; background: var(--np-elevated) !important; }
.form-readonly-entity span { color: var(--np-muted) !important; font-size: 10px !important; }
.form-readonly-entity strong { color: var(--np-text) !important; font-size: 13px !important; }
.automation-settings { overflow: hidden !important; }
.automation-settings .compact-form { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
.automation-settings .check { min-height: 58px !important; padding: 11px 13px !important; justify-content: space-between !important; }
.automation-settings .check input { width: 38px !important; height: 22px !important; min-height: 22px !important; flex: 0 0 38px !important; appearance: none !important; border: 1px solid var(--np-border) !important; border-radius: 999px !important; background: var(--np-border) !important; box-shadow: inset 0 0 0 2px var(--np-card) !important; transition: background-color .18s ease !important; }
.automation-settings .check input::before { content: "" !important; width: 16px !important; height: 16px !important; display: block !important; margin: 2px !important; border-radius: 50% !important; background: #fff !important; box-shadow: 0 1px 4px rgba(0,0,0,.2) !important; transition: transform .18s ease !important; }
.automation-settings .check input:checked { border-color: var(--np-blue) !important; background: var(--np-blue) !important; }
.automation-settings .check input:checked::before { transform: translateX(16px) !important; }
[dir="rtl"] .automation-settings .check input:checked::before { transform: translateX(-16px) !important; }
.automation-log-panel { margin-top: 0 !important; }
.admin-customer-card td, .admin-sub-card td { padding-block: 12px !important; }
.admin-customer-card .data-entity, .admin-sub-card .data-entity { min-width: 220px !important; }
.admin-customer-card .admin-card-actions, .admin-sub-card .admin-card-actions { justify-content: flex-start !important; }
@media (max-width: 760px) {
  .admin-pagination { align-items: stretch !important; flex-direction: column !important; }
  .pagination-summary { justify-content: space-between !important; }
  .admin-pagination > div:last-child { overflow-x: auto !important; }
  .session-date-filter { grid-template-columns: 1fr !important; }
  .automation-settings .compact-form { grid-template-columns: 1fr !important; }
  .plan-price-list > span { flex: 1 1 calc(50% - 6px) !important; }
}

/* Keep every surface scrollable while hiding native scrollbar chrome. */
html, body, body * {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
html::-webkit-scrollbar,
body::-webkit-scrollbar,
body *::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
  background: transparent !important;
}
body::before {
  content: ""; position: fixed; inset: 0 0 auto; z-index: 3000; height: 3px;
  pointer-events: none; opacity: 0; transform: scaleX(0); transform-origin: left center;
  background: var(--np-blue); transition: opacity .15s ease, transform .15s ease;
}
body.ah-page-loading::before { opacity: 1; transform: scaleX(.72); animation: ah-page-progress .9s ease-in-out infinite alternate; }
body.ah-page-loading .ah-content, body.ah-page-loading .customer-content { opacity: .62; pointer-events: none; }
.ah-content, .customer-content { transition: opacity .15s ease; }
@keyframes ah-page-progress { from { transform: scaleX(.18); } to { transform: scaleX(.86); } }
@media (prefers-reduced-motion: reduce) { body.ah-page-loading::before { animation: none; transform: scaleX(.72); } }
