/* ==========================================================================
   SMM Provider Hub — "Nexus" UI v5
   One design system for the client area and the admin area.
   Loaded LAST, after Tabler core. Every rule is scoped under body.nx so
   the old layouts (horizontal / vertical) keep working untouched.
   Light/dark is driven by html[data-sph-theme] (set by sph-theme-system.js).
   ========================================================================== */

:root{
  --nx-font:"Onest",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  /* Light (default) */
  --nx-bg:#F3F5FA;
  --nx-surface:#FFFFFF;
  --nx-surface-2:#F7F8FC;
  --nx-surface-3:#EEF1F8;
  --nx-line:#E2E6EF;
  --nx-line-strong:#CCD2DF;
  --nx-text:#141A2E;
  --nx-muted:#5B6478;
  --nx-faint:#8A93A6;

  --nx-primary:#2B59FF;
  --nx-primary-hover:#1E47E0;
  --nx-primary-soft:rgba(43,89,255,.09);
  --nx-primary-ink:#FFFFFF;
  --nx-saffron:#F28C28;
  --nx-saffron-soft:rgba(242,140,40,.12);

  --nx-success:#0F9D63;  --nx-success-soft:rgba(15,157,99,.10);
  --nx-warning:#C27A00;  --nx-warning-soft:rgba(217,138,0,.12);
  --nx-danger:#D93645;   --nx-danger-soft:rgba(217,54,69,.10);
  --nx-info:#1F7FCC;     --nx-info-soft:rgba(31,127,204,.10);

  /* Sidebar is ink in both modes: it is the fixed reference point */
  --nx-side-bg:#131A33;
  --nx-side-bg-2:#1B2342;
  --nx-side-line:rgba(255,255,255,.07);
  --nx-side-text:#A7B0CA;
  --nx-side-text-strong:#FFFFFF;
  --nx-side-heading:#5F6A8C;

  --nx-shadow-sm:0 1px 2px rgba(20,26,46,.05);
  --nx-shadow-md:0 8px 24px -12px rgba(20,26,46,.18);
  --nx-shadow-pop:0 18px 48px -16px rgba(20,26,46,.28);

  --nx-r-card:10px;
  --nx-r-ctl:7px;

  --nx-side-w:252px;
  --nx-side-w-folded:72px;
  --nx-top-h:64px;
}

html[data-sph-theme="dark"]{
  --nx-bg:#0D1120;
  --nx-surface:#141A2C;
  --nx-surface-2:#182036;
  --nx-surface-3:#1E2740;
  --nx-line:#252F4A;
  --nx-line-strong:#33405F;
  --nx-text:#E8ECF6;
  --nx-muted:#9AA3BA;
  --nx-faint:#6C7591;

  --nx-primary:#5B7FFF;
  --nx-primary-hover:#7394FF;
  --nx-primary-soft:rgba(91,127,255,.14);
  --nx-saffron:#FF9F43;
  --nx-saffron-soft:rgba(255,159,67,.14);

  --nx-success:#34C88A;  --nx-success-soft:rgba(52,200,138,.13);
  --nx-warning:#F2B23A;  --nx-warning-soft:rgba(242,178,58,.13);
  --nx-danger:#FF6B78;   --nx-danger-soft:rgba(255,107,120,.13);
  --nx-info:#5DB2F5;     --nx-info-soft:rgba(93,178,245,.13);

  --nx-side-bg:#0A0E1C;
  --nx-side-bg-2:#121933;

  --nx-shadow-sm:0 1px 2px rgba(0,0,0,.3);
  --nx-shadow-md:0 10px 28px -14px rgba(0,0,0,.6);
  --nx-shadow-pop:0 20px 50px -18px rgba(0,0,0,.75);
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */
html{color-scheme:light}
html[data-sph-theme="dark"]{color-scheme:dark}

body.nx{
  font-family:var(--nx-font);
  font-size:14px;
  line-height:1.5;
  color:var(--nx-text);
  background:var(--nx-bg);
  font-feature-settings:"tnum" 1,"cv11" 1;
  -webkit-font-smoothing:antialiased;
}
body.nx h1,body.nx h2,body.nx h3,body.nx h4,body.nx h5,body.nx h6,
body.nx .h1,body.nx .h2,body.nx .h3,body.nx .h4,body.nx .h5,body.nx .h6{
  font-family:var(--nx-font);
  color:var(--nx-text);
  font-weight:650;
  letter-spacing:-.01em;
}
body.nx h1,body.nx .h1{font-size:26px}
body.nx h2,body.nx .h2{font-size:22px}
body.nx h3,body.nx .h3{font-size:18px}
body.nx h4,body.nx .h4{font-size:16px}
body.nx h5,body.nx .h5{font-size:15px}
body.nx p{color:inherit}
body.nx a{color:var(--nx-primary)}
body.nx a:hover{color:var(--nx-primary-hover)}
body.nx .text-muted,body.nx .text-secondary,body.nx small.text-muted{color:var(--nx-muted)!important}
body.nx .text-dark,body.nx .text-body,body.nx .text-default{color:var(--nx-text)!important}
body.nx .text-primary{color:var(--nx-primary)!important}
body.nx .text-success,body.nx .text-green{color:var(--nx-success)!important}
body.nx .text-warning,body.nx .text-orange,body.nx .text-yellow{color:var(--nx-warning)!important}
body.nx .text-danger,body.nx .text-red{color:var(--nx-danger)!important}
body.nx .text-info,body.nx .text-blue,body.nx .text-azure{color:var(--nx-info)!important}
body.nx hr{border-color:var(--nx-line)}
body.nx ::selection{background:var(--nx-primary);color:#fff}
body.nx :focus-visible{outline:2px solid var(--nx-primary);outline-offset:2px}
body.nx code{background:var(--nx-surface-3);color:var(--nx-text);border-radius:5px;padding:.15em .4em}
body.nx pre{background:var(--nx-surface-2);border:1px solid var(--nx-line);border-radius:var(--nx-r-ctl);color:var(--nx-text)}

body.nx .bg-white,body.nx .bg-light{background:var(--nx-surface)!important}
body.nx .border,body.nx .border-top,body.nx .border-bottom,body.nx .border-left,body.nx .border-right{border-color:var(--nx-line)!important}

@media (prefers-reduced-motion:reduce){
  body.nx *,body.nx *::before,body.nx *::after{transition:none!important;animation:none!important}
}

/* --------------------------------------------------------------------------
   Shell: sidebar
   -------------------------------------------------------------------------- */
body.nx #aside.navbar-side{
  width:var(--nx-side-w);
  background:var(--nx-side-bg);
  border-right:1px solid var(--nx-side-line);
  box-shadow:none;
  padding:0;
  z-index:1031;
}
body.nx #aside .nx-brand{
  height:var(--nx-top-h);
  display:flex;align-items:center;gap:10px;
  padding:0 18px;
  border-bottom:1px solid var(--nx-side-line);
  flex-shrink:0;
}
body.nx #aside .nx-brand a{display:flex;align-items:center;min-width:0;filter:none!important}
body.nx #aside .nx-brand img{max-height:40px;max-width:170px;object-fit:contain;filter:none!important}
body.nx #aside .nx-brand .nx-brand-mark{display:none;max-height:36px;max-width:36px}
body.nx #aside .sph-sidebar-close{
  margin-left:auto;display:none;
  width:34px;height:34px;border-radius:8px;border:1px solid var(--nx-side-line);
  background:transparent;color:var(--nx-side-text);
}
@media (max-width:991.98px){ body.nx #aside .sph-sidebar-close{display:inline-flex;align-items:center;justify-content:center} }

body.nx #aside .nx-side-scroll{flex:1 1 auto;overflow-y:auto;padding:10px 0 16px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.12) transparent}
body.nx #aside .navbar-nav{padding:0;margin:0;width:100%}
body.nx #aside .navbar-heading{
  color:var(--nx-side-heading);
  font-size:11.5px;font-weight:600;letter-spacing:.02em;
  text-transform:none;
  padding:18px 22px 6px;margin:0;
}
body.nx #aside .navbar-heading.first:first-child{padding-top:8px}
body.nx #aside .nav-item{margin:0}
body.nx #aside .nav-link{
  position:relative;
  display:flex;align-items:center;gap:12px;
  margin:1px 10px;padding:9px 12px;
  min-height:40px;
  border-radius:8px;
  color:var(--nx-side-text);
  font-size:14px;font-weight:500;
  border:0;background:transparent;
  transition:background-color .15s ease,color .15s ease;
}
body.nx #aside .nav-link .nav-icon{
  width:20px;min-width:20px;display:inline-flex;justify-content:center;
  color:inherit;opacity:.85;font-size:16px;margin:0;
}
body.nx #aside .nav-link .nav-icon i{font-size:16px;line-height:1}
body.nx #aside .nav-link .nav-text{display:flex;align-items:center;flex:1;min-width:0;gap:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.nx #aside .nav-link:hover{background:var(--nx-side-bg-2);color:var(--nx-side-text-strong)}
body.nx #aside .nav-link.active,
body.nx #aside .nav-item.active>.nav-link{
  background:var(--nx-side-bg-2);
  color:var(--nx-side-text-strong);
  box-shadow:none;border:0;
}
body.nx #aside .nav-link.active::before,
body.nx #aside .nav-item.active>.nav-link::before{
  content:"";position:absolute;left:-10px;top:8px;bottom:8px;width:3px;
  border-radius:0 3px 3px 0;background:var(--nx-saffron);
}
body.nx #aside .nav-link.active .nav-icon{color:var(--nx-saffron);opacity:1}
body.nx #aside .nav-link .badge{
  margin-left:auto;background:var(--nx-saffron);color:#1A1205;border:0;
  font-size:11px;font-weight:700;padding:2px 7px;border-radius:999px;
}
body.nx #aside .nav-link .badge:empty,
body.nx #aside .nav-link .badge.nx-zero{display:none}
body.nx #aside .nav-link[data-toggle="collapse"]::after{border-color:var(--nx-side-heading)}
body.nx #aside .nav .nav-link{padding-left:44px;font-size:13.5px}

body.nx #aside .nx-side-foot{border-top:1px solid var(--nx-side-line);padding:10px 0}
body.nx #aside .nx-side-balance{
  margin:4px 12px 12px;padding:12px 14px;border-radius:9px;
  background:var(--nx-side-bg-2);color:var(--nx-side-text);
  display:flex;flex-direction:column;gap:2px;
}
body.nx #aside .nx-side-balance span{font-size:12px}
body.nx #aside .nx-side-balance strong{font-size:18px;color:#fff;font-weight:650}
body.nx #aside .nx-side-balance a{margin-top:8px;font-size:13px;font-weight:600;color:var(--nx-saffron)}

/* folded (desktop) */
@media (min-width:992px){
  body.nx #aside.navbar-folded{width:var(--nx-side-w-folded)}
  body.nx #aside.navbar-folded ~ .layout-main{margin-left:var(--nx-side-w-folded)!important}
  body.nx #aside.navbar-folded .nav-text,
  body.nx #aside.navbar-folded .navbar-heading,
  body.nx #aside.navbar-folded .nx-side-balance,
  body.nx #aside.navbar-folded .nx-brand-full{display:none!important}
  body.nx #aside.navbar-folded .nx-brand{justify-content:center;padding:0}
  body.nx #aside.navbar-folded .nx-brand .nx-brand-mark{display:block}
  body.nx #aside.navbar-folded .nav-link{justify-content:center;padding:10px 0}
  body.nx #aside.navbar-folded .nav .nav-link{padding-left:0}
  body.nx #aside:not(.navbar-folded) ~ .layout-main{margin-left:var(--nx-side-w)!important}
}
/* mobile drawer */
@media (max-width:991.98px){
  body.nx #aside.navbar-side{transform:translateX(-100%);transition:transform .22s ease;width:280px;position:fixed;top:0;bottom:0;left:0}
  body.nx #aside.navbar-side.active{transform:translateX(0);box-shadow:var(--nx-shadow-pop)}
  body.nx .layout-main{margin-left:0!important}
}
body.nx .sph-sidebar-overlay{
  position:fixed;inset:0;z-index:1030;border:0;padding:0;
  background:rgba(8,11,22,.5);opacity:0;pointer-events:none;transition:opacity .2s ease;
}
body.nx .sph-sidebar-overlay.is-visible{opacity:1;pointer-events:auto}

/* --------------------------------------------------------------------------
   Shell: top bar
   -------------------------------------------------------------------------- */
body.nx .nx-topbar{
  position:sticky;top:0;z-index:1020;
  height:var(--nx-top-h);
  display:flex;align-items:center;gap:12px;
  padding:0 24px;
  background:color-mix(in srgb,var(--nx-bg) 88%,transparent);
  backdrop-filter:saturate(140%) blur(10px);
  -webkit-backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--nx-line);
}
body.nx .nx-topbar .nx-icon-btn,
body.nx .nx-topbar .sph-theme-toggle{
  width:38px;height:38px;min-height:38px;
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:8px;border:1px solid var(--nx-line);
  background:var(--nx-surface);color:var(--nx-muted);
  padding:0;cursor:pointer;position:relative;
  transition:color .15s ease,border-color .15s ease;
}
body.nx .nx-topbar .nx-icon-btn:hover,
body.nx .nx-topbar .sph-theme-toggle:hover{color:var(--nx-text);border-color:var(--nx-line-strong)}
body.nx .nx-topbar .nx-icon-btn i{font-size:17px;line-height:1}
body.nx .sph-theme-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html[data-sph-theme="dark"] body.nx .sph-theme-toggle .sph-theme-moon,
html:not([data-sph-theme="dark"]) body.nx .sph-theme-toggle .sph-theme-sun{display:none}
body.nx .nx-topbar .nx-unread{position:absolute;top:7px;right:8px;width:7px;height:7px;border-radius:50%;background:var(--nx-saffron);box-shadow:0 0 0 2px var(--nx-surface)}
body.nx .nx-topbar .nx-page-title{font-size:16px;font-weight:650;color:var(--nx-text);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.nx .nx-topbar .nx-spacer{flex:1}
body.nx .nx-topbar .nx-tools{display:flex;align-items:center;gap:8px}
body.nx .nx-topbar .dropdown-toggle::after{display:none}

body.nx .nx-balance{
  display:inline-flex;align-items:stretch;height:38px;
  border:1px solid var(--nx-line);border-radius:8px;overflow:hidden;background:var(--nx-surface);
}
body.nx .nx-balance .nx-balance-value{
  display:flex;flex-direction:column;justify-content:center;padding:0 12px;line-height:1.1;
}
body.nx .nx-balance .nx-balance-value small{font-size:11px;color:var(--nx-faint)}
body.nx .nx-balance .nx-balance-value strong{font-size:14px;font-weight:650;color:var(--nx-text)}
body.nx .nx-balance .nx-balance-add{
  display:flex;align-items:center;gap:6px;padding:0 12px;
  background:var(--nx-saffron);color:#1A1205;font-weight:650;font-size:13px;text-decoration:none;
}
body.nx .nx-balance .nx-balance-add:hover{filter:brightness(1.05);color:#1A1205}

body.nx .nx-user{display:flex;align-items:center;gap:10px;padding:3px 4px 3px 3px;border-radius:9px;border:1px solid transparent;color:var(--nx-text);text-decoration:none}
body.nx .nx-user:hover{border-color:var(--nx-line);color:var(--nx-text)}
body.nx .nx-avatar{
  width:34px;height:34px;border-radius:8px;flex-shrink:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--nx-primary-soft);color:var(--nx-primary);font-weight:700;font-size:14px;
}
body.nx .nx-user .nx-user-name{font-size:13.5px;font-weight:600;line-height:1.15}
body.nx .nx-user .nx-user-role{font-size:12px;color:var(--nx-faint);line-height:1.15}
body.nx .nx-lang .flag-icon{width:20px;height:15px;border-radius:2px}

@media (max-width:991.98px){
  body.nx .nx-topbar{padding:0 14px;gap:8px}
  body.nx .nx-topbar .nx-page-title{font-size:15px}
  body.nx .nx-user .nx-user-meta,body.nx .nx-hide-sm{display:none!important}
}
@media (max-width:575.98px){
  body.nx .nx-balance .nx-balance-value small{display:none}
  body.nx .nx-balance .nx-balance-add span{display:none}
  body.nx .nx-hide-xs{display:none!important}
}

/* Main area */
body.nx .layout-main{min-height:100vh;background:transparent;transition:margin-left .2s ease}
body.nx .app-content{padding:24px 24px 48px;background:transparent}
body.nx .app-content>.container-xl,body.nx .app-content .container-xl{max-width:1320px;padding-left:0;padding-right:0}
@media (max-width:767.98px){ body.nx .app-content{padding:16px 12px 40px} }

body.nx .page-header,body.nx .page-title-box{margin:0 0 18px;padding:0;border:0;min-height:0;display:flex;align-items:center;flex-wrap:wrap;gap:10px}
body.nx .page-title{font-size:22px;font-weight:650;color:var(--nx-text);margin:0}
body.nx .page-subtitle,body.nx .page-pretitle{color:var(--nx-muted);text-transform:none;letter-spacing:0;font-size:13px}

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */
body.nx .card{
  background:var(--nx-surface);
  border:1px solid var(--nx-line);
  border-radius:var(--nx-r-card);
  box-shadow:var(--nx-shadow-sm);
  color:var(--nx-text);
  margin-bottom:20px;
}
body.nx .card-header{
  background:transparent;border-bottom:1px solid var(--nx-line);
  padding:14px 18px;min-height:54px;color:var(--nx-text);
}
body.nx .card-title,body.nx .card-header h3,body.nx .card-header h4{font-size:15px;font-weight:650;color:var(--nx-text);margin:0}
body.nx .card-body{padding:18px}
body.nx .card-footer{background:var(--nx-surface-2);border-top:1px solid var(--nx-line);padding:12px 18px;color:var(--nx-muted)}
body.nx .card-options a,body.nx .card-options .btn-link{color:var(--nx-muted)}
body.nx .card .card{box-shadow:none}
body.nx .card-status{display:none}
body.nx .list-group-item{background:var(--nx-surface);border-color:var(--nx-line);color:var(--nx-text)}
body.nx .list-group-item.active{background:var(--nx-primary-soft);border-color:var(--nx-line);color:var(--nx-primary)}
body.nx .list-group-item-action:hover{background:var(--nx-surface-2);color:var(--nx-text)}

/* Stat tiles (statistics pages) */
body.nx .card .stamp,body.nx .stamp{border-radius:8px}
body.nx .card .h1,body.nx .card .display-4,body.nx .card .h2{font-weight:650}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
body.nx .btn{
  font-family:var(--nx-font);
  font-weight:600;font-size:13.5px;
  border-radius:var(--nx-r-ctl);
  padding:8px 14px;min-height:38px;
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  box-shadow:none;transform:none;
  transition:background-color .15s ease,border-color .15s ease,color .15s ease;
}
body.nx .btn-sm{min-height:30px;padding:4px 10px;font-size:12.5px;border-radius:6px}
body.nx .btn-lg{min-height:46px;padding:10px 20px;font-size:15px}
body.nx .btn-block{display:flex;width:100%}
body.nx .btn-primary,body.nx .btn-indigo,body.nx .btn-blue,body.nx .btn-azure,body.nx .btn-info,body.nx .btn-submit:not(.btn-danger){
  background:var(--nx-primary);border:1px solid var(--nx-primary);color:var(--nx-primary-ink);box-shadow:none;
}
body.nx .btn-primary:hover,body.nx .btn-indigo:hover,body.nx .btn-blue:hover,body.nx .btn-azure:hover,body.nx .btn-info:hover,body.nx .btn-submit:not(.btn-danger):hover,
body.nx .btn-primary:focus,body.nx .btn-primary:active{background:var(--nx-primary-hover)!important;border-color:var(--nx-primary-hover)!important;color:#fff!important;box-shadow:none}
body.nx .btn-secondary,body.nx .btn-default,body.nx .btn-light,body.nx .btn-white,body.nx .btn-outline-secondary,body.nx .btn-outline-light{
  background:var(--nx-surface);border:1px solid var(--nx-line-strong);color:var(--nx-text);
}
body.nx .btn-secondary:hover,body.nx .btn-default:hover,body.nx .btn-light:hover,body.nx .btn-white:hover,body.nx .btn-outline-secondary:hover,body.nx .btn-outline-light:hover{
  background:var(--nx-surface-2);border-color:var(--nx-faint);color:var(--nx-text);
}
body.nx .btn-outline-primary{background:transparent;border:1px solid var(--nx-primary);color:var(--nx-primary)}
body.nx .btn-outline-primary:hover{background:var(--nx-primary-soft);color:var(--nx-primary)}
body.nx .btn-success,body.nx .btn-green{background:var(--nx-success);border:1px solid var(--nx-success);color:#fff}
body.nx .btn-success:hover,body.nx .btn-green:hover{filter:brightness(1.06);color:#fff}
body.nx .btn-warning,body.nx .btn-orange,body.nx .btn-yellow{background:var(--nx-saffron);border:1px solid var(--nx-saffron);color:#1A1205}
body.nx .btn-warning:hover,body.nx .btn-orange:hover,body.nx .btn-yellow:hover{filter:brightness(1.05);color:#1A1205}
body.nx .btn-danger,body.nx .btn-red{background:var(--nx-danger);border:1px solid var(--nx-danger);color:#fff}
body.nx .btn-danger:hover,body.nx .btn-red:hover{filter:brightness(1.06);color:#fff}
body.nx .btn-outline-success{border-color:var(--nx-success);color:var(--nx-success);background:transparent}
body.nx .btn-outline-danger{border-color:var(--nx-danger);color:var(--nx-danger);background:transparent}
body.nx .btn-outline-warning{border-color:var(--nx-warning);color:var(--nx-warning);background:transparent}
body.nx .btn-outline-info{border-color:var(--nx-info);color:var(--nx-info);background:transparent}
body.nx .btn-link{color:var(--nx-primary);background:transparent;border-color:transparent}
body.nx .btn:disabled,body.nx .btn.disabled{opacity:.55}
body.nx .btn-icon{width:34px;min-width:34px;padding:0}
body.nx .btn-pill{border-radius:999px}
body.nx .btn-group>.btn{border-radius:0}
body.nx .btn-group>.btn:first-child{border-radius:var(--nx-r-ctl) 0 0 var(--nx-r-ctl)}
body.nx .btn-group>.btn:last-child{border-radius:0 var(--nx-r-ctl) var(--nx-r-ctl) 0}

/* --------------------------------------------------------------------------
   Forms
   -------------------------------------------------------------------------- */
body.nx label,body.nx .form-label,body.nx .col-form-label{color:var(--nx-text);font-weight:600;font-size:13px;margin-bottom:6px}
body.nx .form-control,body.nx .custom-select,body.nx select.form-control,body.nx textarea.form-control,
body.nx .selectize-control.single .selectize-input,body.nx .selectize-input{
  background:var(--nx-surface);
  border:1px solid var(--nx-line-strong);
  border-radius:var(--nx-r-ctl);
  color:var(--nx-text);
  font-family:var(--nx-font);font-size:14px;
  min-height:40px;
  box-shadow:none;
  transition:border-color .15s ease,box-shadow .15s ease;
}
body.nx .form-control-sm{min-height:32px;font-size:13px}
body.nx textarea.form-control{min-height:96px;line-height:1.5}
body.nx .form-control:focus,body.nx .custom-select:focus,
body.nx .selectize-input.focus,body.nx .selectize-input.input-active{
  border-color:var(--nx-primary);box-shadow:0 0 0 3px var(--nx-primary-soft);background:var(--nx-surface);color:var(--nx-text);
}
body.nx .form-control::placeholder{color:var(--nx-faint)}
body.nx .form-control:disabled,body.nx .form-control[readonly]{background:var(--nx-surface-2);color:var(--nx-muted)}
body.nx .input-group-text,body.nx .input-group-prepend .input-group-text,body.nx .input-group-append .input-group-text{
  background:var(--nx-surface-2);border:1px solid var(--nx-line-strong);color:var(--nx-muted);border-radius:var(--nx-r-ctl);
}
body.nx .form-text,body.nx .help-block,body.nx small.form-text{color:var(--nx-muted)}
body.nx .invalid-feedback{color:var(--nx-danger)}
body.nx .is-invalid{border-color:var(--nx-danger)!important}
body.nx .custom-control-label{font-weight:500}
body.nx .custom-control-label::before{background:var(--nx-surface);border:1px solid var(--nx-line-strong)}
body.nx .custom-control-input:checked~.custom-control-label::before{background:var(--nx-primary);border-color:var(--nx-primary)}
body.nx .custom-switch-indicator{background:var(--nx-surface-3);border-color:var(--nx-line-strong)}
body.nx .custom-switch-input:checked~.custom-switch-indicator{background:var(--nx-primary)}
body.nx .selectize-dropdown{
  background:var(--nx-surface);border:1px solid var(--nx-line-strong);color:var(--nx-text);
  border-radius:var(--nx-r-ctl);box-shadow:var(--nx-shadow-pop);margin-top:4px;
}
body.nx .selectize-dropdown .option,body.nx .selectize-dropdown .optgroup-header{color:var(--nx-text);background:transparent}
body.nx .selectize-dropdown .optgroup-header{color:var(--nx-faint);font-weight:600;font-size:12px}
body.nx .selectize-dropdown .active{background:var(--nx-primary-soft);color:var(--nx-text)}
body.nx .selectize-input>input{color:var(--nx-text)}
body.nx .selectize-control.multi .selectize-input>div{background:var(--nx-primary-soft);color:var(--nx-primary);border-radius:5px}

/* --------------------------------------------------------------------------
   Tables
   -------------------------------------------------------------------------- */
body.nx .table-responsive{border:0;border-radius:0;background:transparent}
body.nx .card>.table-responsive,body.nx .card .table-responsive:last-child{border-radius:0 0 var(--nx-r-card) var(--nx-r-card)}
body.nx .table{color:var(--nx-text);background:transparent;margin-bottom:0}
body.nx .table thead th,body.nx .table th{
  background:var(--nx-surface-2);
  color:var(--nx-muted);
  font-size:12px;font-weight:600;text-transform:none;letter-spacing:0;
  border-top:0;border-bottom:1px solid var(--nx-line);
  padding:10px 14px;white-space:nowrap;
}
body.nx .table td{border-top:1px solid var(--nx-line);padding:12px 14px;vertical-align:middle;color:var(--nx-text)}
body.nx .table tbody tr:first-child td{border-top:0}
body.nx .table-hover tbody tr:hover,body.nx .table tbody tr:hover{background:var(--nx-surface-2)}
body.nx .table-striped tbody tr:nth-of-type(odd){background:transparent}
body.nx .table-vcenter td,body.nx .table-vcenter th{vertical-align:middle}
body.nx .table .text-muted{color:var(--nx-faint)!important}
body.nx .table a{font-weight:500}

/* --------------------------------------------------------------------------
   Badges, alerts, status
   -------------------------------------------------------------------------- */
body.nx .badge{
  font-family:var(--nx-font);font-weight:600;font-size:12px;
  border-radius:6px;padding:3px 8px;border:0;letter-spacing:0;text-transform:none;
}
body.nx .badge-primary,body.nx .badge-indigo,body.nx .badge-blue,body.nx .bg-indigo,body.nx .badge-azure{background:var(--nx-primary-soft)!important;color:var(--nx-primary)!important}
body.nx .badge-info,body.nx .badge-cyan{background:var(--nx-info-soft)!important;color:var(--nx-info)!important}
body.nx .badge-success,body.nx .badge-green,body.nx .badge-teal{background:var(--nx-success-soft)!important;color:var(--nx-success)!important}
body.nx .badge-warning,body.nx .badge-orange,body.nx .badge-yellow{background:var(--nx-warning-soft)!important;color:var(--nx-warning)!important}
body.nx .badge-danger,body.nx .badge-red,body.nx .badge-pink{background:var(--nx-danger-soft)!important;color:var(--nx-danger)!important}
body.nx .badge-secondary,body.nx .badge-default,body.nx .badge-light,body.nx .badge-gray,body.nx .badge-dark{background:var(--nx-surface-3)!important;color:var(--nx-muted)!important}
body.nx .badge-purple{background:rgba(124,92,255,.12)!important;color:#7C5CFF!important}

body.nx .alert{border-radius:var(--nx-r-card);border:1px solid var(--nx-line);background:var(--nx-surface-2);color:var(--nx-text);padding:12px 16px}
body.nx .alert-primary,body.nx .alert-info{background:var(--nx-info-soft);border-color:transparent;color:var(--nx-text)}
body.nx .alert-success{background:var(--nx-success-soft);border-color:transparent;color:var(--nx-text)}
body.nx .alert-warning{background:var(--nx-warning-soft);border-color:transparent;color:var(--nx-text)}
body.nx .alert-danger{background:var(--nx-danger-soft);border-color:transparent;color:var(--nx-text)}
body.nx .alert-icon>i{color:inherit}

/* --------------------------------------------------------------------------
   Nav tabs / pills / pagination / dropdowns / modals
   -------------------------------------------------------------------------- */
body.nx .nav-tabs{border-bottom:1px solid var(--nx-line);margin:0;gap:4px}
body.nx .nav-tabs .nav-link{
  border:0;border-bottom:2px solid transparent;border-radius:0;
  color:var(--nx-muted);font-weight:600;padding:10px 12px;background:transparent;margin-bottom:-1px;
}
body.nx .nav-tabs .nav-link:hover{color:var(--nx-text);border-bottom-color:var(--nx-line-strong)}
body.nx .nav-tabs .nav-link.active,body.nx .nav-tabs .nav-item.show .nav-link{color:var(--nx-primary);border-bottom-color:var(--nx-primary);background:transparent}
body.nx .nav-pills .nav-link{border-radius:var(--nx-r-ctl);color:var(--nx-muted);font-weight:600}
body.nx .nav-pills .nav-link.active{background:var(--nx-primary);color:#fff}

body.nx .pagination{gap:4px}
body.nx .page-link{
  border:1px solid var(--nx-line);background:var(--nx-surface);color:var(--nx-text);
  border-radius:6px!important;min-width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;font-weight:500;
}
body.nx .page-link:hover{background:var(--nx-surface-2);color:var(--nx-text);border-color:var(--nx-line-strong)}
body.nx .page-item.active .page-link{background:var(--nx-primary);border-color:var(--nx-primary);color:#fff}
body.nx .page-item.disabled .page-link{background:var(--nx-surface);color:var(--nx-faint)}

body.nx .dropdown-menu{
  background:var(--nx-surface);border:1px solid var(--nx-line);border-radius:9px;
  box-shadow:var(--nx-shadow-pop);padding:6px;color:var(--nx-text);min-width:200px;
}
body.nx .dropdown-menu-arrow::before,body.nx .dropdown-menu-arrow::after{display:none}
body.nx .dropdown-item{border-radius:6px;padding:8px 10px;color:var(--nx-text);font-size:13.5px;display:flex;align-items:center;gap:8px}
body.nx .dropdown-item:hover,body.nx .dropdown-item:focus{background:var(--nx-surface-2);color:var(--nx-text)}
body.nx .dropdown-item.active,body.nx .dropdown-item:active{background:var(--nx-primary-soft);color:var(--nx-primary)}
body.nx .dropdown-item .dropdown-icon{color:var(--nx-faint);margin:0;width:18px}
body.nx .dropdown-divider{border-color:var(--nx-line);margin:6px 0}
body.nx .dropdown-header{color:var(--nx-faint);font-size:12px;text-transform:none;letter-spacing:0}

body.nx .modal-backdrop.show{opacity:.55;background:#080B16}
body.nx .modal-content{
  background:var(--nx-surface);border:1px solid var(--nx-line);border-radius:12px;color:var(--nx-text);box-shadow:var(--nx-shadow-pop);
}
body.nx .modal-header{border-bottom:1px solid var(--nx-line);padding:16px 20px;background:transparent}
body.nx .modal-header.bg-pantone,body.nx .modal-header[class*="bg-"]{background:transparent!important}
body.nx .modal-title{font-size:16px;font-weight:650;color:var(--nx-text)!important}
body.nx .modal-header .close,body.nx .modal .close{color:var(--nx-muted);opacity:1;text-shadow:none}
body.nx .modal-body{padding:20px}
body.nx .modal-footer{border-top:1px solid var(--nx-line);padding:14px 20px;background:var(--nx-surface-2);border-radius:0 0 12px 12px}

body.nx .tooltip-inner{background:#141A2E;color:#fff;font-size:12px;border-radius:6px;padding:5px 8px}
body.nx .popover{background:var(--nx-surface);border-color:var(--nx-line);border-radius:9px}
body.nx .popover-body{color:var(--nx-text)}
body.nx .progress{background:var(--nx-surface-3);border-radius:999px;height:8px}
body.nx .progress-bar{background:var(--nx-primary)}

/* jQuery toast */
body.nx .jq-toast-wrap .jq-toast-single{border-radius:9px;font-family:var(--nx-font);font-size:13.5px;box-shadow:var(--nx-shadow-pop)}

/* Empty state */
body.nx .empty,body.nx .sph-order-empty,body.nx .nx-empty{
  text-align:center;padding:48px 16px;color:var(--nx-muted);
}
body.nx .empty img{max-width:180px;opacity:.9}

/* Search box blocks */
body.nx .search-box .form-control{min-height:38px}
body.nx .search-box .btn{min-height:38px}

/* Page overlay loader */
body.nx .page-overlay,body.nx #page-overlay{background:color-mix(in srgb,var(--nx-bg) 70%,transparent)}

/* Footer */
body.nx .footer{background:transparent;border-top:1px solid var(--nx-line);color:var(--nx-muted);padding:18px 0;font-size:13px}

/* Scrollbars (webkit) */
body.nx ::-webkit-scrollbar{width:10px;height:10px}
body.nx ::-webkit-scrollbar-thumb{background:var(--nx-line-strong);border-radius:10px;border:2px solid var(--nx-bg)}
body.nx ::-webkit-scrollbar-track{background:transparent}

/* --------------------------------------------------------------------------
   Client-area components added by Nexus
   -------------------------------------------------------------------------- */
body.nx .nx-welcome{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;
}
body.nx .nx-welcome h1{font-size:22px;margin:0}
body.nx .nx-welcome p{margin:2px 0 0;color:var(--nx-muted)}
body.nx .nx-quick{display:flex;gap:8px;flex-wrap:wrap}

/* Legacy sph-* blocks used inside module views: map onto Nexus tokens */
body.nx .sph-order-hero,body.nx .sph-order-panel,body.nx .sph-dashboard-section,body.nx .sph-provider-section{
  background:var(--nx-surface)!important;border:1px solid var(--nx-line)!important;border-radius:var(--nx-r-card)!important;
  box-shadow:var(--nx-shadow-sm)!important;color:var(--nx-text)!important;
}
body.nx .sph-section-kicker{color:var(--nx-primary)!important;text-transform:none!important;letter-spacing:0!important}
body.nx .sph-section-heading,body.nx .sph-provider-section-title{color:var(--nx-text)!important}
body.nx .sph-section-note,body.nx .sph-order-mobile-label{color:var(--nx-muted)!important}

/* --------------------------------------------------------------------------
   Shell corrections over Tabler core
   -------------------------------------------------------------------------- */
body.nx .app-content{margin-top:0!important}
body.nx.vertical-menu .layout-main{padding-top:0!important}

/* Dashboard (statistics) */
body.nx .sph-dashboard-shell{padding:0!important;max-width:none}
body.nx .sph-dashboard-intro{margin:0 0 18px}
body.nx .sph-dashboard-eyebrow{display:none}
body.nx .sph-dashboard-title{font-size:22px!important;font-weight:650}
body.nx .sph-kpi-card::before,body.nx .sph-kpi-card::after,
body.nx .sph-status-card::before,body.nx .sph-bestsellers-card::before{display:none!important}
body.nx .sph-kpi-icon{background:var(--nx-primary-soft)!important;color:var(--nx-primary)!important;box-shadow:none!important;border-radius:9px!important}
body.nx .sph-kpi-card:first-child .sph-kpi-icon{background:var(--nx-saffron-soft)!important;color:var(--nx-saffron)!important}
body.nx .sph-kpi-value{font-weight:650;letter-spacing:-.01em}
body.nx .sph-kpi-label{font-size:12.5px}
body.nx .sph-section-kicker{display:none}
body.nx .sph-section-heading h2{font-size:15px!important;font-weight:650}

/* --------------------------------------------------------------------------
   New order
   -------------------------------------------------------------------------- */
body.nx .nx-order-page{margin-top:0}
body.nx .nav-tabs>li>a{
  display:inline-flex;align-items:center;gap:6px;
  padding:10px 12px;margin-bottom:-1px;color:var(--nx-muted);font-weight:600;
  border-bottom:2px solid transparent;text-decoration:none;
}
body.nx .nav-tabs>li>a:hover{color:var(--nx-text)}
body.nx .nav-tabs>li>a.active{color:var(--nx-primary);border-bottom-color:var(--nx-primary)}
body.nx .nx-order-card>.card-header{padding-top:0;padding-bottom:0;min-height:50px;align-items:flex-end!important}
body.nx .content-header-title h4{font-size:15px;font-weight:650;margin-bottom:14px}
body.nx .content-header-title h4 i{color:var(--nx-primary);margin-right:4px}

body.nx .social-cat{padding:14px 18px}
body.nx .social-btn{display:flex;flex-wrap:wrap;gap:8px}
body.nx .social-btn .brand-category{
  min-height:34px;padding:6px 12px;border-radius:999px;margin:0!important;
  background:var(--nx-surface);border:1px solid var(--nx-line-strong);color:var(--nx-text);font-weight:500;font-size:13px;
}
body.nx .social-btn .brand-category:hover{border-color:var(--nx-primary);color:var(--nx-primary)}
body.nx .social-btn .brand-category.active,body.nx .social-btn .brand-category.btn-primary{background:var(--nx-primary);border-color:var(--nx-primary);color:#fff}
body.nx .social-btn .brand-category i{font-size:14px}

body.nx .order_resume{
  max-width:none;background:var(--nx-surface-2)!important;border:1px solid var(--nx-line)!important;
  border-radius:var(--nx-r-card);padding:22px;color:var(--nx-text);
}
body.nx .order_resume .service-title{margin-left:0}
body.nx .order_resume .service-name{font-weight:600;font-size:15px!important;line-height:1.4;color:var(--nx-text)}
body.nx .order_resume .service-id-title{font-size:12px!important}
body.nx .order_resume h5{font-size:12.5px;font-weight:500;color:var(--nx-muted)!important}
body.nx .order_resume .service-price{font-weight:650}
body.nx .order_resume .text-info{color:var(--nx-text)!important;font-weight:600}
body.nx .order_resume img.rounded-circle{width:34px;height:34px;padding:7px;border-radius:8px!important;background:var(--nx-surface);border:1px solid var(--nx-line)}
body.nx .order_resume .service-details{border:1px solid var(--nx-line)!important;background:var(--nx-surface);border-radius:8px;padding:14px;color:var(--nx-text);font-size:13.5px}
body.nx .order_resume .service-media-logo{border-radius:9px}

body.nx #result_total_charge .total_charge{
  display:flex;justify-content:space-between;width:100%;cursor:default;
  background:var(--nx-saffron-soft)!important;border:1px solid transparent!important;color:var(--nx-text)!important;
  min-height:46px;font-size:14px;font-weight:600;
}
body.nx #result_total_charge .charge_number{font-weight:700}
@media (min-width:768px){ body.nx #order_resume{position:sticky;top:calc(var(--nx-top-h) + 16px);align-self:flex-start} }

/* Core uses !important on these; match it so the tokens win */
body.nx .btn-primary,body.nx .dataTables_wrapper .dataTables_paginate .paginate_button.current{background-color:var(--nx-primary)!important;border-color:var(--nx-primary)!important;color:#fff!important}
body.nx .btn-primary:hover{background-color:var(--nx-primary-hover)!important;border-color:var(--nx-primary-hover)!important}
body.nx .btn-success{background-color:var(--nx-success)!important;border-color:var(--nx-success)!important;color:#fff!important}
body.nx .bg-primary{background-color:var(--nx-primary)!important}
body.nx .bg-success{background-color:var(--nx-success)!important}
body.nx .bg-warning{background-color:var(--nx-saffron)!important}
body.nx .bg-danger{background-color:var(--nx-danger)!important}
body.nx .bg-info{background-color:var(--nx-info)!important}
body.nx .bg-indigo-lt,body.nx .bg-blue-lt,body.nx .bg-azure-lt,body.nx .bg-purple-lt{background:var(--nx-primary-soft)!important;color:var(--nx-primary)!important}
body.nx .bg-green-lt,body.nx .bg-teal-lt,body.nx .bg-lime-lt{background:var(--nx-success-soft)!important;color:var(--nx-success)!important}
body.nx .bg-orange-lt,body.nx .bg-yellow-lt{background:var(--nx-warning-soft)!important;color:var(--nx-warning)!important}
body.nx .bg-red-lt,body.nx .bg-pink-lt{background:var(--nx-danger-soft)!important;color:var(--nx-danger)!important}
body.nx .bg-cyan-lt{background:var(--nx-info-soft)!important;color:var(--nx-info)!important}
body.nx .bg-gray-lt,body.nx .bg-gray-dark-lt,body.nx .bg-dark-lt{background:var(--nx-surface-3)!important;color:var(--nx-muted)!important}
body.nx .text-indigo{color:var(--nx-primary)!important}
body.nx .text-uppercase{text-transform:none!important}
body.nx .navbar.navbar-side.active{margin-top:0!important}
body.nx .navbar-folded .nav-link.active .nav-icon{background:transparent!important}
body.nx .tabs-list .nav-tabs>li>a,body.nx .tabs-list .nav-tabs>li>a.active{background:transparent!important;box-shadow:none!important;border-radius:0!important}
body.nx .tabs-list .nav-tabs>li>a.active{color:var(--nx-primary)!important;border-bottom:2px solid var(--nx-primary)!important}
body.nx .order-success,body.nx .alert.order-success{background:var(--nx-success-soft)!important;color:var(--nx-text)!important;border:1px solid transparent!important;box-shadow:none!important}
body.nx .order-success h4,body.nx .order-success .alert-heading{color:var(--nx-success)!important;font-size:15px}
body.nx .alert{color:var(--nx-text)!important;border-radius:var(--nx-r-card)!important;box-shadow:none!important}
body.nx .alert-primary,body.nx .alert-info{background:var(--nx-info-soft)!important;border:1px solid transparent!important}
body.nx .alert-success{background:var(--nx-success-soft)!important;border:1px solid transparent!important}
body.nx .alert-warning{background:var(--nx-warning-soft)!important;border:1px solid transparent!important}
body.nx .alert-danger{background:var(--nx-danger-soft)!important;border:1px solid transparent!important}
body.nx .page-title .border-line{display:none}

/* Admin top-bar chips */
body.nx .nx-chip{
  display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 11px;border-radius:999px;
  border:1px solid var(--nx-line);background:var(--nx-surface);color:var(--nx-text);font-size:13px;font-weight:600;text-decoration:none;
}
body.nx .nx-chip:hover{border-color:var(--nx-line-strong);color:var(--nx-text)}
body.nx .nx-chip-danger{background:var(--nx-danger-soft);border-color:transparent;color:var(--nx-danger)}
body.nx .nx-chip-dot{width:7px;height:7px;border-radius:50%}
body.nx .nx-dot-warning{background:var(--nx-saffron)}
body.nx .nx-dot-danger{background:var(--nx-danger)}

/* Admin dashboard (spha-*) */
body.nx .spha-admin-dashboard{padding:0!important;max-width:none!important}
body.nx [class*="spha-"][class*="-icon"]{background:var(--nx-primary-soft)!important;color:var(--nx-primary)!important;box-shadow:none!important}
body.nx [class*="spha-"][class*="kicker"],body.nx [class*="spha-"][class*="eyebrow"],body.nx .spha-section-label{display:none!important}
body.nx [class*="spha-"]::before{background:transparent!important}

/* --------------------------------------------------------------------------
   Phase 2: stat tiles, affiliates, child panels
   -------------------------------------------------------------------------- */
body.nx .nx-stat .card-body{padding:16px}
body.nx .nx-stat-icon{width:34px;height:34px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:var(--nx-primary-soft);color:var(--nx-primary);margin-bottom:10px}
body.nx .nx-stat-value{font-size:20px;font-weight:650;line-height:1.2;color:var(--nx-text);word-break:break-word}
body.nx .nx-stat-label{font-size:12.5px;color:var(--nx-muted);margin-top:2px}
body.nx .nx-big-number{font-size:30px;font-weight:650;letter-spacing:-.01em;color:var(--nx-text);margin-bottom:6px}
body.nx .nx-prose{color:var(--nx-text);line-height:1.65;max-width:75ch}
body.nx .nx-prose h1,body.nx .nx-prose h2,body.nx .nx-prose h3{font-size:16px;margin-top:0}
body.nx .nx-steps{counter-reset:nxstep;list-style:none;padding:0;margin:0}
body.nx .nx-steps li{position:relative;padding:0 0 14px 38px;color:var(--nx-text)}
body.nx .nx-steps li::before{counter-increment:nxstep;content:counter(nxstep);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:var(--nx-primary-soft);color:var(--nx-primary);font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center}
body.nx .nx-kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:13.5px}
body.nx .nx-kv dt{color:var(--nx-muted);font-weight:500}
body.nx .nx-kv dd{margin:0;color:var(--nx-text);font-weight:600;word-break:break-all}
body.nx .nx-tabs-bar{display:flex;gap:4px;border-bottom:1px solid var(--nx-line);margin-bottom:18px;flex-wrap:wrap}
body.nx .nx-tabs-bar a{padding:10px 12px;margin-bottom:-1px;color:var(--nx-muted);font-weight:600;border-bottom:2px solid transparent;text-decoration:none}
body.nx .nx-tabs-bar a:hover{color:var(--nx-text)}
body.nx .nx-tabs-bar a.active{color:var(--nx-primary);border-bottom-color:var(--nx-primary)}
body.nx .nx-tabs-bar .badge{margin-left:6px}

/* --------------------------------------------------------------------------
   v5.1 mobile fixes
   -------------------------------------------------------------------------- */
/* hidden switch inputs were positioned against the card and pushed pages wider than the phone */
body.nx .custom-switch,body.nx .custom-control{position:relative}
body.nx .table-responsive{position:relative}
body.nx{overflow-x:clip} /* clip (not hidden) keeps the sticky top bar working */
/* top bar: on narrow phones the page name shrank to one letter, the sidebar already shows it */
@media (max-width:419.98px){
  body.nx .nx-topbar .nx-page-title{display:none}
  body.nx .nx-topbar .nx-spacer{flex:1}
}
/* services header text spacing */
body.nx .sph-services-subtitle{line-height:1.5!important;margin-top:6px!important}
body.nx .sph-services-eyebrow{display:none}
@media (max-width:575.98px){
  body.nx .card-header{flex-wrap:wrap;gap:8px}
  body.nx .modal-dialog{margin:10px}
  body.nx .btn-group{flex-wrap:wrap}
  body.nx .page-title{font-size:20px}
}
/* comfortable tap targets on touch screens */
@media (pointer:coarse){
  body.nx .btn-sm{min-height:36px}
  body.nx .page-link{min-width:40px;height:40px}
}
/* fast admin Services: compact, fully tappable category headers */
body.nx .nx-lazy-card .card-header{flex-wrap:nowrap!important;cursor:pointer;min-height:52px}
body.nx .nx-lazy-card .card-title{font-size:14px;line-height:1.35}
body.nx .nx-lazy-card .card-options{margin-left:auto;flex-shrink:0}
body.nx .nx-lazy-card:hover .card-header{background:var(--nx-surface-2)}
body.nx .nx-lazy-card{margin-bottom:10px}

/* --------------------------------------------------------------------------
   v5.2 admin dashboard
   -------------------------------------------------------------------------- */
:root{--nx-series-a:#2B59FF;--nx-series-b:#E07A12;--nx-st-good:#0F9D63;--nx-st-info:#1F7FCC;--nx-st-warn:#C27A00;--nx-st-bad:#D93645;--nx-st-muted:#8A93A6}
html[data-sph-theme="dark"]{--nx-series-a:#6B8CFF;--nx-series-b:#FFA552;--nx-st-good:#34C88A;--nx-st-info:#5DB2F5;--nx-st-warn:#F2B23A;--nx-st-bad:#FF6B78;--nx-st-muted:#7C86A2}
body.nx .nx-dash-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:16px}
body.nx .nx-dash-head h1{font-size:22px;margin:0}
body.nx .nx-dash-head p{margin:2px 0 0;color:var(--nx-muted)}
body.nx .nx-range{display:flex;flex-wrap:wrap;gap:4px;padding:4px;border:1px solid var(--nx-line);border-radius:9px;background:var(--nx-surface)}
body.nx .nx-range a{padding:6px 12px;border-radius:6px;color:var(--nx-muted);font-weight:600;font-size:13px;text-decoration:none}
body.nx .nx-range a:hover{color:var(--nx-text);background:var(--nx-surface-2)}
body.nx .nx-range a.is-active{background:var(--nx-primary);color:#fff}
body.nx .nx-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:14px}
@media (max-width:1199.98px){body.nx .nx-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:479.98px){body.nx .nx-kpis{grid-template-columns:1fr}}
body.nx .nx-kpi{display:flex;flex-direction:column;gap:4px;padding:16px 18px;background:var(--nx-surface);border:1px solid var(--nx-line);border-radius:var(--nx-r-card);color:var(--nx-text);text-decoration:none;box-shadow:var(--nx-shadow-sm)}
body.nx .nx-kpi:hover{border-color:var(--nx-line-strong);color:var(--nx-text)}
body.nx .nx-kpi-label{font-size:13px;color:var(--nx-muted);font-weight:500}
body.nx .nx-kpi-value{font-size:26px;font-weight:650;letter-spacing:-.01em;line-height:1.15}
body.nx .nx-kpi-foot{font-size:12.5px;color:var(--nx-muted)}
body.nx .nx-delta{font-weight:700;padding:1px 6px;border-radius:5px;margin-right:4px}
body.nx .nx-delta-up{color:var(--nx-success);background:var(--nx-success-soft)}
body.nx .nx-delta-down{color:var(--nx-danger);background:var(--nx-danger-soft)}
body.nx .nx-delta-flat{color:var(--nx-muted);background:var(--nx-surface-3)}
body.nx .nx-attention{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px;margin-bottom:20px}
@media (max-width:1399.98px){body.nx .nx-attention{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:575.98px){body.nx .nx-attention{grid-template-columns:repeat(2,minmax(0,1fr))}}
body.nx .nx-att{display:flex;flex-direction:column;padding:10px 12px;border-radius:9px;border:1px solid var(--nx-line);background:var(--nx-surface);text-decoration:none;color:var(--nx-text);border-left-width:3px}
body.nx .nx-att strong{font-size:20px;font-weight:650;line-height:1.2}
body.nx .nx-att span{font-size:12.5px;color:var(--nx-muted)}
body.nx .nx-att-warn{border-left-color:var(--nx-st-warn)}
body.nx .nx-att-bad{border-left-color:var(--nx-st-bad)}
body.nx .nx-att-bad strong{color:var(--nx-st-bad)}
body.nx .nx-att-info{border-left-color:var(--nx-st-info)}
body.nx .nx-att-zero{opacity:.75}
body.nx .nx-att-zero strong{color:var(--nx-muted)}
body.nx .nx-legend{display:flex;align-items:center;gap:14px;font-size:13px;color:var(--nx-text)}
body.nx .nx-legend span{display:inline-flex;align-items:center;gap:6px}
body.nx .nx-sw{display:inline-block;width:10px;height:10px;border-radius:3px}
body.nx .nx-sw-a{background:var(--nx-series-a)}
body.nx .nx-sw-b{background:var(--nx-series-b)}
body.nx .nx-chart-wrap{position:relative}
body.nx .nx-chart{width:100%;height:auto;display:block;overflow:visible}
body.nx .nx-chart .nx-grid{stroke:var(--nx-line);stroke-width:1}
body.nx .nx-chart .nx-baseline{stroke:var(--nx-line-strong);stroke-width:1}
body.nx .nx-chart .nx-axis{fill:var(--nx-muted);font-size:11px;font-family:var(--nx-font)}
body.nx .nx-chart .nx-bar-a{fill:var(--nx-series-a)}
body.nx .nx-chart .nx-bar-b{fill:var(--nx-series-b)}
body.nx .nx-chart .nx-hit{fill:transparent}
body.nx .nx-chart .nx-day{transition:opacity .12s ease}
body.nx .nx-chart .nx-day.is-dim{opacity:.45}
body.nx .nx-chart .nx-day:hover .nx-hit{fill:var(--nx-surface-2)}
body.nx .nx-tip{position:absolute;top:6px;z-index:5;display:flex;flex-direction:column;gap:3px;min-width:170px;padding:9px 11px;border-radius:8px;background:var(--nx-surface);border:1px solid var(--nx-line-strong);box-shadow:var(--nx-shadow-pop);font-size:12.5px;color:var(--nx-text);pointer-events:none}
body.nx .nx-tip span{display:flex;align-items:center;gap:6px}
body.nx .nx-stack{display:flex;gap:2px;height:12px;border-radius:6px;overflow:hidden;margin-bottom:14px}
body.nx .nx-stack-seg{display:block;height:100%}
body.nx .nx-status-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
body.nx .nx-status-list li{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--nx-text)}
body.nx .nx-status-list b{margin-left:auto;font-weight:650}
body.nx .nx-status-list em{font-style:normal;color:var(--nx-muted);width:40px;text-align:right}
body.nx .nx-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
body.nx .nx-st-good{background:var(--nx-st-good)} body.nx .nx-st-info{background:var(--nx-st-info)}
body.nx .nx-st-warn{background:var(--nx-st-warn)} body.nx .nx-st-bad{background:var(--nx-st-bad)} body.nx .nx-st-muted{background:var(--nx-st-muted)}
body.nx .nx-pill{display:inline-block;padding:2px 8px;border-radius:6px;font-size:12px;font-weight:600;color:var(--nx-text)!important}
body.nx .nx-pill.nx-st-good{background:var(--nx-success-soft)!important;color:var(--nx-success)!important}
body.nx .nx-pill.nx-st-info{background:var(--nx-info-soft)!important;color:var(--nx-info)!important}
body.nx .nx-pill.nx-st-warn{background:var(--nx-warning-soft)!important;color:var(--nx-warning)!important}
body.nx .nx-pill.nx-st-bad{background:var(--nx-danger-soft)!important;color:var(--nx-danger)!important}
body.nx .nx-pill.nx-st-muted{background:var(--nx-surface-3)!important;color:var(--nx-muted)!important}
body.nx .nx-dash .card-header a{font-size:13px;font-weight:600}

/* --------------------------------------------------------------------------
   v5.2 top navigation (PerfectPanel-style) — admin and client
   -------------------------------------------------------------------------- */
.nx-sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.nx.nx-topnav-mode .layout-main{margin-left:0!important}
body.nx .nx-top-brand{display:flex;align-items:center;margin-right:6px}
body.nx .nx-top-brand img{max-height:36px;max-width:160px;object-fit:contain}
body.nx .nx-topnav-toggle{display:none}
body.nx .nx-topnav{
  position:sticky;top:var(--nx-top-h);z-index:1019;
  background:var(--nx-side-bg);border-bottom:1px solid var(--nx-side-line);
  padding:0 16px;
}
body.nx .nx-topnav-list{display:flex;flex-wrap:wrap;align-items:stretch;gap:2px;list-style:none;margin:0;padding:0;max-width:1600px}
body.nx .nx-topnav-list>li{position:relative}
body.nx .nx-topnav-link{
  display:flex;align-items:center;gap:8px;height:46px;padding:0 13px;
  background:transparent;border:0;border-bottom:3px solid transparent;
  color:var(--nx-side-text);font-family:var(--nx-font);font-size:14px;font-weight:600;text-decoration:none;cursor:pointer;
}
body.nx .nx-topnav-link i{font-size:15px}
body.nx .nx-topnav-link:hover,body.nx .nx-topnav-dd.is-open>.nx-topnav-link{color:#fff;background:var(--nx-side-bg-2)}
body.nx .nx-topnav-link.is-active{color:#fff;border-bottom-color:var(--nx-saffron)}
body.nx .nx-topnav-link.is-active>i:first-child{color:var(--nx-saffron)}
body.nx .nx-topnav-caret{font-size:12px!important;opacity:.7;margin-left:-2px}
body.nx .nx-topnav-badge{background:var(--nx-saffron);color:#1A1205;border-radius:999px;font-size:11px;font-weight:700;padding:1px 6px}
body.nx .nx-topnav-menu{
  display:none;position:absolute;left:0;top:100%;min-width:230px;padding:6px;z-index:1030;
  background:var(--nx-surface);border:1px solid var(--nx-line);border-radius:0 0 10px 10px;box-shadow:var(--nx-shadow-pop);
}
body.nx .nx-topnav-dd.is-open>.nx-topnav-menu{display:block}
body.nx .nx-topnav-menu a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:7px;color:var(--nx-text);font-size:14px;text-decoration:none;font-weight:500}
body.nx .nx-topnav-menu a i{width:18px;text-align:center;color:var(--nx-faint)}
body.nx .nx-topnav-menu a:hover{background:var(--nx-surface-2);color:var(--nx-text)}
body.nx .nx-topnav-menu a.is-active{background:var(--nx-primary-soft);color:var(--nx-primary)}
body.nx .nx-topnav-menu a.is-active i{color:var(--nx-primary)}
@media (min-width:992px){
  body.nx .nx-topnav-dd:hover>.nx-topnav-menu{display:block}
}
@media (max-width:991.98px){
  body.nx .nx-topnav-toggle{display:inline-flex}
  body.nx .nx-topnav{display:none;position:sticky;max-height:calc(100vh - var(--nx-top-h));overflow:auto;padding:6px 10px 12px}
  body.nx.nx-topnav-open .nx-topnav{display:block}
  body.nx .nx-topnav-list{flex-direction:column}
  body.nx .nx-topnav-link{width:100%;height:44px;border-bottom:0;border-left:3px solid transparent;border-radius:6px}
  body.nx .nx-topnav-link.is-active{border-left-color:var(--nx-saffron)}
  body.nx .nx-topnav-caret{margin-left:auto!important}
  body.nx .nx-topnav-menu{position:static;box-shadow:none;border:0;border-radius:8px;margin:2px 0 6px;background:var(--nx-side-bg-2)}
  body.nx .nx-topnav-menu a{color:var(--nx-side-text)}
  body.nx .nx-topnav-menu a:hover{background:rgba(255,255,255,.06);color:#fff}
  body.nx .nx-topnav-menu a.is-active{background:rgba(255,255,255,.1);color:#fff}
  body.nx .nx-top-brand img{max-height:30px;max-width:120px}
}
body.nx.nx-topnav-mode .app-content>.container-fluid,body.nx.nx-topnav-mode .app-content>.container-xl{max-width:1600px;margin:0 auto}
body.nx .nx-topnav-mobile-only{display:none}
@media (max-width:991.98px){ body.nx .nx-topnav-mobile-only{display:block} }

/* --------------------------------------------------------------------------
   v5.2 contrast fixes (WCAG AA: 4.5:1 text, 3:1 large text) — measured, not guessed
   -------------------------------------------------------------------------- */
:root{
  --nx-faint:#646D82;            /* was #8A93A6 (3.1:1 on white) */
  --nx-success:#0A7A4D;          /* was #0F9D63 (3.5:1) */
  --nx-warning:#9A6100;          /* was #C27A00 (3.5:1) */
  --nx-info:#1767A8;             /* was #1F7FCC (3.7:1 on its tint) */
  --nx-danger:#C42B3A;           /* was #D93645 (3.9:1 on its tint) */
  --nx-btn:#2B59FF; --nx-btn-hover:#1E47E0;
}
html[data-sph-theme="dark"]{
  --nx-faint:#8891AB;            /* was #6C7591 (3.8:1) */
  --nx-side-heading:#7E89AC;     /* was #5F6A8C (3.2:1) */
  --nx-btn:#3359F0; --nx-btn-hover:#2A4FE3;   /* white text 5.5:1 (was 3.5:1 on #5B7FFF) */
}
body.nx .btn-primary,body.nx .btn-indigo,body.nx .btn-blue,body.nx .btn-azure,body.nx .btn-info,body.nx .btn-submit:not(.btn-danger),
body.nx .dataTables_wrapper .dataTables_paginate .paginate_button.current,body.nx .page-item.active .page-link,body.nx .nav-pills .nav-link.active,
body.nx .nx-range a.is-active,body.nx .custom-control-input:checked~.custom-control-label::before{background-color:var(--nx-btn)!important;border-color:var(--nx-btn)!important;color:#fff!important}
body.nx .btn-primary:hover,body.nx .btn-submit:not(.btn-danger):hover{background-color:var(--nx-btn-hover)!important;border-color:var(--nx-btn-hover)!important}
body.nx .btn-success{background-color:#0B8051!important;border-color:#0B8051!important}
body.nx .btn-danger{background-color:#C42B3A!important;border-color:#C42B3A!important}
/* contrast round 2 (from the automatic audit) */
:root{--nx-primary:#2550F0;--nx-warning:#8F5A00}
html[data-sph-theme="dark"]{--nx-primary:#7B97FF;--nx-primary-hover:#93AAFF}
body.nx .data-empty .title,body.nx .empty .title,body.nx .nx-empty{color:var(--nx-muted)!important}
/* Admin-written rich content (manual payment instructions, notes) often uses light inline
   backgrounds without a text colour; keep that text dark so it stays readable in dark mode. */
html[data-sph-theme="dark"] body.nx .nx-rich [style*="background"],
html[data-sph-theme="dark"] body.nx .nx-rich [style*="background"] *{color:#1A1F2E!important}
body.nx .btn:disabled,body.nx .btn.disabled{opacity:.72}
/* contrast round 3: Tabler colour badges / bg-* helpers with white text */
body.nx .badge.bg-azure,body.nx .badge.bg-blue,body.nx .badge.bg-cyan,body.nx .badge.bg-info,body.nx .badge-azure,body.nx .badge-cyan,
body.nx .bg-azure.badge-pill,body.nx .badge-pill.badge-info{background:var(--nx-info-soft)!important;color:var(--nx-info)!important}
body.nx .badge.bg-secondary,body.nx .badge.bg-gray,body.nx .badge.bg-dark,body.nx .badge.bg-gray-dark{background:var(--nx-surface-3)!important;color:var(--nx-text)!important}
body.nx .badge.bg-success,body.nx .badge.bg-green,body.nx .badge.bg-teal{background:var(--nx-success-soft)!important;color:var(--nx-success)!important}
body.nx .badge.bg-warning,body.nx .badge.bg-orange,body.nx .badge.bg-yellow{background:var(--nx-warning-soft)!important;color:var(--nx-warning)!important}
body.nx .badge.bg-danger,body.nx .badge.bg-red,body.nx .badge.bg-pink{background:var(--nx-danger-soft)!important;color:var(--nx-danger)!important}
body.nx .badge.bg-primary,body.nx .badge.bg-indigo,body.nx .badge.bg-purple{background:var(--nx-primary-soft)!important;color:var(--nx-primary)!important}
body.nx .nx-att-zero{opacity:1}
body.nx .nx-att-zero strong{color:var(--nx-muted)}
body.nx .custom-switch-description{color:var(--nx-muted)!important}
body.nx .custom-switch-input:checked~.custom-switch-description{color:var(--nx-text)!important}
body.nx .custom-control-label,body.nx .form-label{color:var(--nx-text)}
body.nx .bootstrap-tagsinput{background:var(--nx-surface)!important;border:1px solid var(--nx-line-strong)!important;border-radius:var(--nx-r-ctl);color:var(--nx-text)!important;box-shadow:none!important}
body.nx .bootstrap-tagsinput input{color:var(--nx-text)!important;background:transparent!important}
body.nx .bootstrap-tagsinput .tag,body.nx .bootstrap-tagsinput .badge{background:var(--nx-info-soft)!important;color:var(--nx-info)!important}
body.nx .ai-btn.primary{background:var(--nx-btn)!important;border-color:var(--nx-btn)!important;color:#fff!important}
