/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */

/* Custom CSS for AbollyHost Theme
 *
 * This file allows you to customize the theme colors and styles for the entire AbollyHost template.
 *
 * To customize colors:
 * - Replace the var() references with your own hex colors or other CSS values.
 * - For example, instead of --primary: #4b5563; use --primary: #your-color;
 * - You can also override any CSS properties here.
 */

:root {
    --white: #fff;

    /* Neutral shades */
    --neutral-50: #fbf9fa;
    --neutral-100: #f4f5f7;
    --neutral-200: #e4e4e7;
    --neutral-300: #d0d5dd;
    --neutral-400: #9ca3af;
    --neutral-500: #6b7280;
    --neutral-600: #4b5563;
    --neutral-700: #374151;
    --neutral-800: #1f2937;
    --neutral-900: #111827;
    --neutral-950: #030712;

    /* Neutral shades */
    /* define own pallet with brand colors */
    --primary-50: var(--neutral-50);
    --primary-100: var(--neutral-100);
    --primary-200: var(--neutral-200);
    --primary-300: var(--neutral-300);
    --primary-400: var(--neutral-400);
    --primary-500: var(--neutral-500);
    --primary-600: var(--neutral-600);
    --primary-700: var(--neutral-700);
    --primary-800: var(--neutral-800);
    --primary-900: var(--neutral-900);
    --primary-950: var(--neutral-900);

    /* Primary colors */
    /* Use shades from comments if `primary` colors use other colors, then neutral */
    --primary: var(--neutral-900);          /* var(--primary-600) */
    --primary-lifted: var(--neutral-800);   /* var(--primary-700) */
    --primary-accented: var(--neutral-700); /* var(--primary-800) */

    /* Secondary colors */
    --secondary: var(--neutral-500);
    --secondary-lifted: var(--neutral-600);
    --secondary-accented: var(--neutral-700);

    /* Success colors */
    --success: #00a63e;
    --success-lifted: #008236;
    --success-accented: #016630;

    /* Info colors */
    --info: #155dfc;
    --info-lifted: #1447e6;
    --info-accented: #193cb8;

    /* Notice colors */
    --notice: #7f22fe;
    --notice-lifted: #7008e7;
    --notice-accented: #5d0ec0;

    /* Warning colors */
    --warning: #f54a00;
    --warning-lifted: #ca3500;
    --warning-accented: #9f2d00;

    /* Error colors */
    --error: #e7000b;
    --error-lifted: #c10007;
    --error-accented: #9f0712;

    /* Grayscale colors */
    --grayscale: var(--neutral-900);
    --grayscale-lifted: var(--neutral-800);
    --grayscale-accented: var(--neutral-700);

    /* Neutral colors */
    --neutral: var(--neutral-500);
    --neutral-lifted: var(--neutral-600);
    --neutral-accented: var(--neutral-700);

    /* Text neutral colors */
    --text-inverted: var(--white);
    --text-muted: var(--neutral-400);
    --text-lifted: var(--neutral-500);
    --text-accented: var(--neutral-600);
    --text: var(--neutral-900);

    /* Border neutral colors */
    --border-muted: var(--neutral-200);
    --border: var(--neutral-300);
    --border-lifted: var(--neutral-400);
    --border-accented: var(--neutral-600);

    /* Background neutral colors */
    --bg: var(--white);
    --bg-muted: var(--neutral-50);
    --bg-lifted: var(--neutral-100);
    --bg-accented: var(--neutral-200);
    --bg-inverted: var(--neutral-900);

    /* Additional colors */
    --yellow-200: #fff085;
    --yellow-300: #ffdf20;
    --teal-300: #46edd5;
    --teal-400: #00d5be;
    --emerald-300: #5ee9b5;
    --pink-400: #fb64b6;

    /* Additional custom properties */
    /* Font sizes */
    --text-xs: 0.625rem;
    --text-sm: 0.75rem;
    --text-md: 0.875rem;
    --text-lg: 1rem;

    /* Spacing */
    --outline-sm: 1px;
    --outline-md: 2px;
    --outline-lg: 3px;

    /* Rounding */
    --rounding-sm: 0.25rem;
    --rounding-md: 0.5rem;
    --rounding-lg: 0.75rem;

    /* Other */
    --letter-spacing: 0em;
    --disabled-opacity: 25%;
}

/* ============================================================
   >>> AbollyHost redesign appended below (loads last) <<<
   ============================================================ */
/* ============================================================
   AbollyHost — premium client area redesign
   Loaded last; overrides all.min.css + theme.min.css
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;600;700;800&family=Sora:wght@700;800&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --blue:#0774FF;--blue-d:#0540A8;--ink:#1B2233;--secondary:#2D3C58;--lime:#ADF802;
  --body:#4C5671;--muted:#8aa0d0;--pale:#F6F9FF;--tint:#EAF2FF;--border:#E9EDFF;
  --border-2:#E3E9F7;--canvas:#EDF1F9;--shadow:0 18px 44px -26px rgba(20,35,80,.40);
  --radius:18px;--rail-w:274px;
}
*{box-sizing:border-box}
html{background:var(--canvas)}
body.nx-body{font-family:'Inter',system-ui,-apple-system,sans-serif!important;color:var(--ink);
  background:var(--canvas)!important;background-image:radial-gradient(1100px 540px at 100% -8%,rgba(7,116,255,.08),transparent 60%)!important;
  -webkit-font-smoothing:antialiased;margin:0}
.nx-body h1,.nx-body h2,.nx-body h3,.nx-body h4,.nx-body h5,.nx-body .h1,.nx-body .h2,.nx-body .h3{font-family:'Plus Jakarta Sans',sans-serif;letter-spacing:-.3px}
.nx-ico{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:middle;flex:none}

/* ---------- SHELL: content left, rail right ---------- */
.nx-shell{min-height:100vh;background:var(--canvas)}
.nx-main{min-width:0;padding:26px 30px 50px;margin-right:var(--rail-w);min-height:100vh}
.nx-main .container{max-width:1160px;width:100%;margin:0 auto}

.nx-rail{width:var(--rail-w);position:fixed;top:0;right:0;height:100vh;background:#fff;color:var(--body);
  display:flex;flex-direction:column;border-left:1px solid var(--border);overflow-y:auto;
  background-image:radial-gradient(rgba(7,116,255,.045) 1px,transparent 1px);background-size:15px 15px;z-index:60}
.nx-rail-brand{display:flex;align-items:center;gap:10px;padding:24px 22px 14px;font-family:'Sora',sans-serif;font-weight:800;font-size:22px;letter-spacing:-.5px;color:var(--ink);text-decoration:none}
.nx-rail-brand:hover{color:var(--ink)}
.nx-rail-logo{max-width:170px;max-height:42px;height:auto}
.nx-mk{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--blue),var(--blue-d));display:flex;align-items:center;justify-content:center}
.nx-mk .nx-ico{width:17px;height:17px;stroke:var(--lime)}
.nx-rail-nav{flex:1;overflow-y:auto;padding:6px 14px 14px}
.nx-railsec{font-size:10px;font-weight:700;letter-spacing:1.7px;text-transform:uppercase;color:var(--muted);padding:18px 10px 8px}
.nx-railitem{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:12px;color:var(--body);font-weight:600;font-size:14px;margin:3px 0;position:relative;transition:.16s;text-decoration:none}
.nx-railitem .nx-tile{width:32px;height:32px;border-radius:10px;background:var(--tint);display:flex;align-items:center;justify-content:center;color:var(--blue);flex:0 0 32px}
.nx-railitem .nx-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx-railitem .nx-num{background:var(--tint);color:var(--blue);font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px}
.nx-railitem:hover{color:var(--ink);background:var(--pale);text-decoration:none}
.nx-railitem:hover .nx-tile{background:#DCE9FF}
.nx-railitem.active{color:var(--ink);background:var(--tint)}
.nx-railitem.active .nx-tile{background:var(--blue);color:#fff}
.nx-railitem.active::after{content:"";position:absolute;right:-14px;top:9px;bottom:9px;width:3px;border-radius:3px 0 0 3px;background:var(--lime);box-shadow:-3px 0 16px rgba(173,248,2,.5)}
.nx-rail-foot{padding:14px;border-top:1px solid var(--border)}
.nx-acct{display:flex;align-items:center;gap:8px;padding:8px;border-radius:13px;background:var(--pale);border:1px solid var(--border)}
.nx-acct-link{display:flex;align-items:center;gap:11px;flex:1;min-width:0;text-decoration:none}
.nx-acct-av{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--blue),var(--blue-d));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-family:'Plus Jakarta Sans';flex:none}
.nx-acct-meta{min-width:0}
.nx-acct-nm{display:block;font-size:13px;font-weight:700;color:var(--ink);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx-acct-sub{display:block;font-size:11px;color:var(--muted)}
.nx-acct-out{color:var(--muted);padding:8px;border-radius:9px}
.nx-acct-out:hover{background:#fff;color:var(--blue)}

/* rail toggle (mobile) */
.nx-rail-toggle{position:fixed;top:16px;right:16px;z-index:70;width:46px;height:46px;border-radius:13px;background:#fff;border:1px solid var(--border-2);color:var(--secondary);box-shadow:var(--shadow);display:none;align-items:center;justify-content:center}
.nx-rail-backdrop{display:none}
@media(max-width:1199px){
  .nx-main{margin-right:0;padding:64px 18px 90px}
  .nx-rail{transform:translateX(100%);transition:transform .25s ease;box-shadow:-20px 0 50px -20px rgba(20,35,80,.4)}
  .nx-rail.open{transform:translateX(0)}
  .nx-rail-toggle{display:flex}
  .nx-rail-backdrop.show{display:block;position:fixed;inset:0;background:rgba(20,30,55,.4);z-index:55}
}

/* ---------- TOP UTILITY BAR ---------- */
.nx-top{display:flex;align-items:center;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.nx-util{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.nx-order{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(135deg,#0A6CFF,#0540A8);color:#fff;font-weight:700;font-size:13.5px;padding:11px 18px;border-radius:12px;box-shadow:0 10px 22px -10px rgba(7,116,255,.6);text-decoration:none;position:relative}
.nx-order:hover{color:#fff;filter:brightness(1.05)}.nx-order .nx-ico{width:16px;height:16px;stroke-width:2.4}
.nx-ubtn{width:44px;height:44px;border-radius:12px;background:#fff;border:1px solid var(--border-2);color:var(--secondary);position:relative;cursor:pointer;display:flex;align-items:center;justify-content:center}
.nx-nbadge{position:absolute;top:-5px;right:-5px;background:#FF4D4F;color:#fff;font-size:10px;font-weight:800;min-width:18px;height:18px;border-radius:999px;display:flex;align-items:center;justify-content:center;border:2px solid var(--canvas);padding:0 4px}
.nx-nbadge--lime{position:static;border:0;background:var(--lime);color:var(--ink);margin-left:6px}
.nx-pill{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--border-2);border-radius:12px;padding:10px 14px;font-size:13.5px;font-weight:600;color:var(--secondary);cursor:pointer;text-decoration:none}
.nx-pill:hover{color:var(--ink);border-color:var(--border-strong,#D4DCFF)}
.nx-pill .nx-ico{width:17px;height:17px;color:var(--muted)}
.nx-chev{width:13px!important;height:13px!important}
.nx-balance{background:linear-gradient(180deg,#F6FBFF,#EAF2FF);border-color:#D4E4FF;color:var(--ink)}
.nx-balance .nx-ico{color:var(--blue)}.nx-balance b{font-family:'Plus Jakarta Sans';color:var(--ink)}
.nx-avp .nx-avp-link{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--border-2);border-radius:12px;padding:6px 10px 6px 6px;text-decoration:none}
.nx-av{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--blue),var(--blue-d));color:#fff;font-weight:800;font-family:'Plus Jakarta Sans';display:flex;align-items:center;justify-content:center;font-size:13px}
.nx-search{display:flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--border-2);border-radius:12px;padding:0 14px;min-width:220px;margin-left:auto;height:44px}
.nx-search .nx-ico{width:17px;height:17px;color:var(--muted)}
.nx-search input{border:0;outline:0;font-family:inherit;font-size:13.5px;width:100%;color:var(--ink);background:transparent;height:42px}
.nx-top--guest .nx-brand-inline{font-family:'Sora';font-weight:800;font-size:22px;color:var(--ink);text-decoration:none}
.nx-logo-img{max-height:40px}

/* ---------- BREADCRUMB ---------- */
.master-breadcrumb{margin-bottom:8px}
.master-breadcrumb .breadcrumb{background:transparent;padding:0;margin:0;font-size:13px}
.master-breadcrumb .breadcrumb-item a{color:var(--muted);text-decoration:none}
.master-breadcrumb .breadcrumb-item.active{color:var(--secondary)}

/* ---------- FEATURE STRIP ---------- */
.nx-featband{margin-top:26px;background:#fff;border:1px solid var(--border);border-radius:20px;padding:24px 8px;box-shadow:var(--shadow);
  background-image:radial-gradient(rgba(7,116,255,.04) 1px,transparent 1px);background-size:16px 16px;display:grid;grid-template-columns:repeat(7,1fr)}
.nx-feat{text-align:center;padding:6px 14px;position:relative;display:flex;flex-direction:column;align-items:center}
.nx-feat + .nx-feat::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:1px;background:var(--border)}
.nx-fic{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.nx-fic .nx-ico{width:21px;height:21px;stroke-width:1.9}
.nx-ft{font-family:'Plus Jakarta Sans';font-size:13.5px;font-weight:700;color:var(--ink)}
.nx-fs{font-size:11.5px;color:var(--body);margin-top:2px}
.nx-fc-blue{background:var(--tint);color:var(--blue)}.nx-fc-lime{background:#F1FFD6;color:#5B8A00}
.nx-fc-cyan{background:rgba(13,179,128,.12);color:#0FB380}.nx-fc-amber{background:#FFF4E0;color:#C77B00}
.nx-fc-green{background:rgba(26,158,91,.12);color:#1A9E5B}
@media(max-width:1040px){.nx-featband{grid-template-columns:repeat(3,1fr);gap:14px 0}.nx-feat:nth-child(3n+1)::before{display:none}}
@media(max-width:560px){.nx-featband{grid-template-columns:repeat(2,1fr)}.nx-feat::before{display:none!important}}

/* ---------- FOOTER ---------- */
.nx-footer{margin-top:22px;padding:18px 0 8px;color:var(--muted);font-size:13px}
.nx-footer .nav-link{color:var(--muted);padding:.2rem .8rem}
.nx-footer .nav-link:hover{color:var(--blue)}
.nx-footer .copyright{margin-top:8px;color:var(--muted)}

/* ============================================================
   GLOBAL PRIMITIVES — premium across all pages
   ============================================================ */
.nx-main .card,.nx-main .panel{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.nx-main .card-header,.nx-main .panel-heading{background:#fff;border-bottom:1px solid var(--border);font-family:'Plus Jakarta Sans';font-weight:700;border-radius:var(--radius) var(--radius) 0 0!important;padding:16px 20px}
.nx-main .card-body{padding:18px 20px}
.nx-main .card-footer{background:var(--pale);border-top:1px solid var(--border)}

.nx-main .btn{border-radius:11px;font-weight:700;font-family:'Inter';padding:.6rem 1.2rem;border:1px solid transparent;transition:.15s}
.nx-main .btn-primary{background:var(--blue);border-color:var(--blue);color:#fff}
.nx-main .btn-primary:hover{background:var(--blue-d);border-color:var(--blue-d)}
.nx-main .btn-success{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.nx-main .btn-success:hover{filter:brightness(.96);color:var(--ink)}
.nx-main .btn-default,.nx-main .btn-secondary,.nx-main .btn-outline-secondary{background:#fff;border-color:var(--border-2);color:var(--secondary)}
.nx-main .btn-default:hover,.nx-main .btn-secondary:hover{border-color:var(--blue);color:var(--blue)}

.nx-main .table{background:#fff}
.nx-main .table thead th{border-bottom:1px solid var(--border);color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.5px;font-weight:700}
.nx-main .table td,.nx-main .table th{border-top:1px solid var(--border);vertical-align:middle}
.nx-main .form-control,.nx-main .custom-select{border:1px solid var(--border-2);border-radius:11px;color:var(--ink);min-height:44px}
.nx-main .form-control:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(7,116,255,.12)}
.nx-main .badge{border-radius:999px;font-weight:700;padding:.35em .7em}
.nx-main .badge-success{background:#E6F8EE;color:#1a9e5b}
.nx-main .badge-warning{background:#FFF1E6;color:#C77B00}
.nx-main .badge-danger{background:#FDE8E8;color:#D7263D}

/* alerts */
.nx-main .alert{border-radius:14px;border:1px solid var(--border)}
.nx-main .alert-success{background:#EAF9F0;border-color:#bfead0;color:#157a45}
.nx-main .alert-info{background:var(--tint);border-color:#cfe0ff;color:var(--blue-d)}
.nx-main .alert-warning{background:#FFF7EC;border-color:#ffe2bd;color:#9a5b00}
.nx-main .alert-danger{background:#FDECEC;border-color:#f6c9c9;color:#b51d2c}

/* contextual sidebar (primary/secondary) as premium cards */
.nx-main .card-sidebar{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.nx-main .card-sidebar .card-header{background:var(--pale);border-bottom:1px solid var(--border)}
.nx-main .card-sidebar .card-title{font-family:'Plus Jakarta Sans';font-size:14px;font-weight:700;color:var(--ink)}
.nx-main .list-group-item{border:0;border-bottom:1px solid var(--border);padding:.7rem 1rem;color:var(--body);font-weight:600;font-size:13.5px}
.nx-main .list-group-item:last-child{border-bottom:0}
.nx-main .list-group-item-action:hover{background:var(--pale);color:var(--ink)}
.nx-main .list-group-item.active{background:var(--tint);color:var(--blue);border-left:3px solid var(--blue)}
.nx-main .sidebar-menu-item-icon{color:var(--blue)}

/* ============================================================
   DASHBOARD (clientareahome) — KPI cards, promo banner, panels
   ============================================================ */
.nx-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}
.nx-kpi{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 20px;text-decoration:none;transition:.16s}
.nx-kpi:hover{transform:translateY(-2px);border-color:#D4DCFF}
.nx-kpi-ic{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex:none}
.nx-kpi-ic .nx-ico{width:24px;height:24px}
.nx-kpi-num{font-family:'Plus Jakarta Sans';font-weight:800;font-size:30px;line-height:1;color:var(--ink);letter-spacing:-1px}
.nx-kpi-lbl{display:block;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-top:5px}
.nx-fc-red{background:#FFE9EA;color:#E5484D}
@media(max-width:980px){.nx-kpis{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.nx-kpis{grid-template-columns:1fr}}

/* full-width promo banner */
.promo-wide{position:relative;overflow:hidden;background:linear-gradient(135deg,#0A6CFF,#0540A8);border-radius:20px;padding:26px 30px;margin-bottom:22px;display:flex;align-items:center;gap:24px;box-shadow:var(--shadow)}
.promo-wide::after{content:"";position:absolute;right:-30px;top:-60px;width:240px;height:240px;border-radius:50%;background:rgba(173,248,2,.16)}
.promo-wide .pw-text{position:relative;z-index:1;flex:1}
.promo-wide .pw-tag{display:inline-block;background:var(--lime);color:var(--ink);font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;padding:5px 12px;border-radius:999px}
.promo-wide h2{font-family:'Plus Jakarta Sans';font-size:26px;font-weight:800;margin:12px 0 6px;color:#fff;letter-spacing:-.4px}
.promo-wide p{color:#cfe0ff;font-size:14px;line-height:1.5;max-width:560px;margin:0}
.promo-wide .pw-btn{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;background:var(--lime);color:var(--ink);font-weight:800;font-size:14px;padding:12px 22px;border-radius:12px;white-space:nowrap;text-decoration:none}
.promo-wide .pw-btn:hover{filter:brightness(.96);color:var(--ink)}
.promo-wide .pw-btn .nx-ico{width:17px;height:17px;stroke-width:2.4}
@media(max-width:720px){.promo-wide{flex-direction:column;align-items:flex-start}}

/* panels */
.nx-panels{margin-bottom:22px}
.nx-panel-full{margin-bottom:18px}
.nx-panel-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
@media(max-width:900px){.nx-panel-grid{grid-template-columns:1fr}}
.nx-panel{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.nx-panel-h{display:flex;align-items:center;gap:11px;padding:16px 20px;border-bottom:1px solid var(--border)}
.nx-panel-ic{width:34px;height:34px;border-radius:10px;background:var(--tint);color:var(--blue);display:flex;align-items:center;justify-content:center;flex:none}
.nx-panel-ic .nx-ico{width:18px;height:18px}
.nx-panel-t{font-family:'Plus Jakarta Sans';font-size:16px;font-weight:700;color:var(--ink);margin:0;flex:1}
.nx-panel-act{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;color:var(--blue);text-decoration:none;white-space:nowrap}
.nx-panel-act:hover{color:var(--blue-d)}.nx-panel-act .nx-ico{width:14px;height:14px;stroke-width:2.4}
.nx-panel-b{padding:14px 20px}
.nx-panel-f{padding:12px 20px;border-top:1px solid var(--border);background:var(--pale)}
.nx-chip{background:var(--tint);color:var(--blue);font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;vertical-align:middle}
.nx-panel-list{display:flex;flex-direction:column}
.nx-panel-row{display:flex;align-items:center;gap:8px;padding:11px 20px;border-bottom:1px solid var(--border);color:var(--body);font-weight:600;font-size:13.5px;text-decoration:none}
.nx-panel-row:last-child{border-bottom:0}
.nx-panel-row:hover{background:var(--pale);color:var(--ink)}
.nx-panel-row i{color:var(--blue)}

/* WHMCS active-service rows rendered inside panel body */
/* Active-services rows: panel children -> .nx-panel-row > .div-service-item (NOT .nx-panel-b) */
.nx-panel-list .nx-panel-row > .div-service-item{flex:1 1 auto;min-width:0;width:100%}
.nx-main .div-service-item{display:flex;align-items:center;gap:14px;width:100%;cursor:pointer;border:0;margin:0;padding:0}
.nx-main .div-service-status{flex:0 0 90px;width:90px!important;text-align:left;margin:0;position:relative}
.nx-main .div-service-status .label{border-radius:999px!important;font-weight:700!important;font-size:11px!important;padding:.4em .85em!important;display:inline-block;width:auto!important;color:inherit;line-height:1.5;white-space:nowrap}
.nx-main .div-service-status .label-placeholder{position:absolute!important;visibility:hidden!important}
.nx-main .div-service-status .label-success{background:#E6F8EE;color:#1a9e5b}
.nx-main .div-service-status .label-warning{background:#FFF4E0;color:#C77B00}
.nx-main .div-service-status .label-danger{background:#FDE8E8;color:#D7263D}
.nx-main .div-service-status .label-info{background:var(--tint);color:var(--blue)}
.nx-main .div-service-status .label-default{background:var(--tint);color:var(--secondary)}
.nx-main .div-service-name{flex:1;min-width:0;margin:0 10px;display:flex;flex-direction:column}
.nx-main .div-service-name .font-weight-bold{color:var(--ink);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nx-main .div-service-name .text-domain{color:var(--muted);font-size:13px}
.nx-main .nx-panel-row:hover .div-service-name .font-weight-bold{color:var(--blue)}
.nx-main .div-service-buttons{margin-left:auto;display:flex;align-items:center;gap:8px;flex:0 0 auto}
.nx-main .div-service-buttons .btn{white-space:nowrap}
.nx-main .div-service-buttons .btn-group{display:inline-flex}
/* keep the row tidy: the .nx-panel-row supplies padding/hover; the item just lays out */
.nx-panel-list .nx-panel-row{padding:14px 20px}

/* product recommendations (kept, de-emphasised at bottom) */
.nx-reco{margin-bottom:10px}
.nx-reco-item{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:6px 18px;margin-bottom:14px}

/* mobile polish: active-service rows wrap cleanly on narrow screens */
@media(max-width:620px){
  .nx-panel-b .div-service-item{flex-wrap:wrap;align-items:flex-start}
  .nx-panel-b .div-service-name{flex-basis:100%;order:2;margin:4px 0}
  .nx-panel-b .div-service-status{order:1}
  .nx-panel-b .div-service-buttons{order:3;width:100%;flex-wrap:wrap}
}

/* ============================================================
   FRAMEWORK OVERRIDES — neutralise theme.min.css bleed-through
   ============================================================ */
body.nx-body{border-top:0!important}
#main-body{background:transparent!important;padding:0!important;min-height:0!important}
/* WHMCS loading veil: keep it hidden until WHMCS shows it (id beats .w-hidden otherwise) */
#fullpage-overlay.w-hidden{display:none!important}
/* footer: framework paints it dark — make it light & cohesive */
#footer.nx-footer,.nx-footer.footer{background:transparent!important;background-color:transparent!important;border:0!important;padding:20px 0 10px!important;margin-top:22px}
.nx-footer .copyright{color:var(--muted)!important}
.nx-footer .nav-link{color:var(--secondary)!important}
.nx-footer .nav-link:hover{color:var(--blue)!important}
.nx-footer .nx-foot-social a{color:var(--muted)!important}
.nx-footer .nx-foot-social a:hover{color:var(--blue)!important}
/* rail brand logo: use the WHMCS-configured logo, sized cleanly */
.nx-rail-brand{padding:22px 22px 14px}
.nx-rail-logo{max-width:190px;max-height:50px;width:auto;height:auto;object-fit:contain;display:block}