/* =========================================================================
   Microcomp WHMCS Theme — Dark
   Mirrors the design system in micro-comp.com/index.html
   Loaded after all.min.css so these rules win.
   ========================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Syne:wght@400;600;700;800&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;1,9..40,300&display=swap');

:root{
  --mc-bg:#07090E;
  --mc-surface:#0D1018;
  --mc-surface-2:#131720;
  --mc-border:rgba(255,255,255,0.07);
  --mc-border-h:rgba(255,255,255,0.16);
  --mc-accent:#00E87A;
  --mc-accent-h:#00ffaa;
  --mc-accent-dim:rgba(0,232,122,0.12);
  --mc-orange:#FF5F1F;
  --mc-text:#EEF0F8;
  --mc-text-2:#8A8EA8;
  --mc-text-3:#8084A0;
  --mc-danger:#FF5F1F;
  --mc-success:#00E87A;
  --mc-r:6px;
  --mc-rl:12px;
  --ff-display:'Bebas Neue',sans-serif;
  --ff-sans:'Syne',sans-serif;
  --ff-body:'DM Sans',system-ui,sans-serif;
}

/* ---------- Base ---------- */
html,body,
html body{
  background:#07090E !important;
  background-color:#07090E !important;
  color:var(--mc-text) !important;
  font-family:var(--ff-body) !important;
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
body{ min-height:100vh; padding-top:0 !important; }
.primary-bg-color{ background-color:transparent !important; }
a{ color:var(--mc-accent); text-decoration:none; }
a:hover,a:focus{ color:var(--mc-accent-h); text-decoration:none; }
hr{ border-color:var(--mc-border); }
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
  font-family:var(--ff-sans);
  color:var(--mc-text);
  font-weight:700;
  letter-spacing:-.01em;
}
.lead{ color:var(--mc-text-2); font-weight:300; }
small,.small{ color:var(--mc-text-3); }
.text-muted{ color:var(--mc-text-3) !important; }
code,pre{
  background:var(--mc-surface-2);
  border:1px solid var(--mc-border);
  color:var(--mc-text);
  border-radius:var(--mc-r);
}

/* Container width to match main site */
.container{ max-width:1200px; }

/* ---------- Top header bar (#header) ---------- */
section#header,
#header{
  background:var(--mc-bg) !important;
  border-bottom:1px solid var(--mc-border) !important;
  border-radius:0 !important;
  padding:0 !important;
  margin:0 !important;
}
#header .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:72px;
  padding-top:12px;
  padding-bottom:12px;
}
#header .navbar-brand,
section#header .navbar-brand{
  padding:0 !important;
  margin:0 !important;
  height:auto !important;
  min-height:0 !important;
  float:none !important;
  display:inline-flex !important;
  align-items:center;
  font-size:0 !important;
  line-height:1 !important;
}
#header .navbar-brand img,
#header .navbar-brand > img,
section#header .navbar-brand img,
section#header .navbar-brand > img{
  display:block !important;
  height:32px !important;
  width:auto !important;
  max-height:32px !important;
  max-width:200px !important;
  margin:0 !important;
  padding:0 !important;
  filter:brightness(0) invert(1);
}

/* Top right utility nav (locale / notifications / login / logout) */
#header .top-nav{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  gap:24px;
  order:2;
}
#header .top-nav > li{ display:flex; align-items:center; }
#header .top-nav a{
  font-family:var(--ff-sans);
  font-size:13px;
  font-weight:600;
  letter-spacing:.04em;
  color:var(--mc-text-2);
  text-transform:none;
  transition:color .2s;
  padding:6px 0;
}
#header .top-nav a:hover{ color:var(--mc-text); }
#header .top-nav .primary-action a.btn,
#header .top-nav a.btn{
  font-family:var(--ff-sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:10px 20px;
  border-radius:var(--mc-r);
  background:var(--mc-accent);
  color:#050805;
  border:none;
}
#header .top-nav a.btn:hover{
  background:var(--mc-accent-h);
  color:#050805;
}
#header .top-nav .label{ background:var(--mc-accent-dim); color:var(--mc-accent); border-radius:999px; padding:2px 8px; font-size:10px; }

/* Hide caret hangover from Bootstrap */
#header .top-nav .caret{ display:none; }

/* Old hard-coded mobile WP menu — neutralize if still rendered */
#header + .collapse.navbar-collapse,
.navbar-responsive-collapse[style]{
  display:none !important;
}

/* ---------- Main menu (logged in) ---------- */
section#main-menu,
#main-menu{
  background:var(--mc-bg) !important;
  background-color:var(--mc-bg) !important;
  border-bottom:1px solid var(--mc-border) !important;
  margin:0 !important;
  padding:0 !important;
}
#main-menu .navbar,
#main-menu .navbar-default,
.navbar.navbar-main{
  background:transparent !important;
  border:none !important;
  margin:0;
  min-height:56px;
  border-radius:0;
}
.navbar-nav > li > a{
  font-family:var(--ff-sans);
  font-size:13px;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--mc-text-2) !important;
  padding:18px 16px !important;
  background:transparent !important;
  transition:color .2s;
}
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus,
.navbar-nav > li.active > a,
.navbar-nav > li.open > a{
  color:var(--mc-text) !important;
  background:transparent !important;
}
.navbar-nav > li > a i{ color:var(--mc-accent); }
.navbar-nav .badge{
  background:var(--mc-accent-dim);
  color:var(--mc-accent);
  font-family:var(--ff-sans);
  font-weight:700;
  border-radius:999px;
}

.dropdown-menu{
  background:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  border-radius:var(--mc-r) !important;
  box-shadow:0 12px 32px rgba(0,0,0,0.4) !important;
  padding:8px 0;
}
.dropdown-menu > li > a{
  color:var(--mc-text-2) !important;
  font-family:var(--ff-sans);
  font-size:13px;
  font-weight:500;
  padding:10px 18px;
  background:transparent !important;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus{
  color:var(--mc-text) !important;
  background:var(--mc-surface-2) !important;
}
.dropdown-menu .divider{ background:var(--mc-border); }

/* Hamburger */
.navbar-toggle{ border-color:var(--mc-border) !important; background:transparent !important; }
.navbar-toggle .icon-bar{ background:var(--mc-text) !important; }

/* ---------- Main body / page header ---------- */
section#main-body,
#main-body{
  background:var(--mc-bg) !important;
  background-color:var(--mc-bg) !important;
  padding:48px 0 96px !important;
  min-height:60vh;
}
#main-body .page-header{
  border-bottom:1px solid var(--mc-border);
  padding-bottom:24px;
  margin:0 0 32px;
}
#main-body .page-header h1,
#main-body .page-header h2{
  font-family:var(--ff-display);
  font-size:clamp(40px,5vw,64px);
  line-height:.95;
  letter-spacing:.01em;
  margin:0;
  color:var(--mc-text);
  text-transform:uppercase;
}
#main-body .page-header small{
  display:block;
  margin-top:8px;
  font-family:var(--ff-body);
  font-size:15px;
  color:var(--mc-text-2);
  text-transform:none;
  letter-spacing:0;
}

.breadcrumb{
  background:transparent;
  padding:0 0 16px 0;
  margin:0 0 24px;
  border-bottom:1px solid var(--mc-border);
  font-family:var(--ff-sans);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.breadcrumb > li,
.breadcrumb a{ color:var(--mc-text-3); }
.breadcrumb > .active{ color:var(--mc-text); }
.breadcrumb > li + li:before{ color:var(--mc-text-3); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:var(--ff-sans) !important;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:14px 26px;
  border-radius:var(--mc-r) !important;
  border:1px solid transparent !important;
  transition:all .2s ease;
  white-space:nowrap;
  cursor:pointer;
}
.btn-lg{ padding:16px 32px; font-size:14px !important; }
.btn-sm{ padding:10px 18px; font-size:11px !important; }
.btn-xs{ padding:6px 12px; font-size:10px !important; }

.btn-primary,
.btn-primary:focus{
  background:var(--mc-accent) !important;
  color:#050805 !important;
  border-color:var(--mc-accent) !important;
}
.btn-primary:hover,
.btn-primary:active{
  background:var(--mc-accent-h) !important;
  border-color:var(--mc-accent-h) !important;
  color:#050805 !important;
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(0,232,122,0.25);
}

.btn-default,
.btn-secondary,
.btn-default:focus{
  background:transparent !important;
  color:var(--mc-text) !important;
  border-color:var(--mc-border-h) !important;
}
.btn-default:hover,
.btn-secondary:hover{
  border-color:var(--mc-accent) !important;
  color:var(--mc-accent) !important;
  background:transparent !important;
  transform:translateY(-2px);
}

.btn-success{ background:var(--mc-accent) !important; border-color:var(--mc-accent) !important; color:#050805 !important; }
.btn-info{ background:var(--mc-surface-2) !important; border-color:var(--mc-border-h) !important; color:var(--mc-text) !important; }
.btn-warning{ background:var(--mc-orange) !important; border-color:var(--mc-orange) !important; color:#050805 !important; }
.btn-danger{ background:var(--mc-orange) !important; border-color:var(--mc-orange) !important; color:#050805 !important; }
.btn-link{ background:transparent !important; border:none !important; color:var(--mc-accent) !important; padding:0; text-transform:none; letter-spacing:0; }
.btn-link:hover{ color:var(--mc-accent-h) !important; text-decoration:none !important; }

.btn[disabled],.btn.disabled{ opacity:.5; cursor:not-allowed; }
.btn-block{ display:flex; justify-content:center; width:100%; }

/* ---------- Forms ---------- */
label,
.control-label{
  font-family:var(--ff-sans);
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--mc-text-2);
  margin-bottom:8px;
}
.form-control,
input.field,
select.field,
textarea.field,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="search"],
input[type="url"],
textarea,
select{
  background:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  border-radius:var(--mc-r) !important;
  color:var(--mc-text) !important;
  font-family:var(--ff-body) !important;
  font-size:15px !important;
  padding:14px 16px !important;
  height:auto !important;
  box-shadow:none !important;
  transition:border-color .2s, background .2s;
}
.form-control:focus,
input.field:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus{
  border-color:var(--mc-accent) !important;
  background:var(--mc-surface-2) !important;
  box-shadow:0 0 0 3px rgba(0,232,122,0.15) !important;
  outline:none !important;
}
.form-control::placeholder{ color:var(--mc-text-3); }
.input-group-addon{
  background:var(--mc-surface-2) !important;
  border:1px solid var(--mc-border) !important;
  color:var(--mc-text-2) !important;
}
.form-group{ margin-bottom:20px; }
.form-group.prepend-icon{ position:relative; }
.form-group.prepend-icon .field-icon{
  position:absolute;
  left:0; top:0; bottom:0;
  width:48px;
  display:flex; align-items:center; justify-content:center;
  color:var(--mc-text-3);
  z-index:2;
  margin:0;
  pointer-events:none;
}
.form-group.prepend-icon .field-icon i{ color:var(--mc-text-3); }
.form-group.prepend-icon .form-control,
.form-group.prepend-icon input.field,
.form-group.prepend-icon select.field{
  padding-left:52px !important;
}
.form-group .help-block,
.field-help-text{
  color:var(--mc-text-3);
  font-size:12px;
  margin-top:6px;
}

.checkbox label,
.radio label{
  font-family:var(--ff-body);
  font-size:14px;
  font-weight:400;
  text-transform:none;
  letter-spacing:0;
  color:var(--mc-text-2);
}
.checkbox input[type="checkbox"],
.radio input[type="radio"]{ accent-color:var(--mc-accent); }

.has-error .form-control,
input[aria-invalid="true"]{ border-color:var(--mc-orange) !important; }
.has-error .control-label,
.has-error .help-block{ color:var(--mc-orange) !important; }

.sub-heading{
  margin:36px 0 20px;
  padding-bottom:12px;
  border-bottom:1px solid var(--mc-border);
}
.sub-heading span{
  font-family:var(--ff-sans);
  font-size:11px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--mc-accent);
}

/* ---------- Login container (the page in the screenshot) ---------- */
.logincontainer{
  max-width:520px !important;
  width:100%;
  margin:80px auto !important;
  background:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  border-radius:var(--mc-rl) !important;
  padding:48px 40px !important;
  position:relative;
  overflow:hidden;
  box-shadow:0 24px 64px rgba(0,0,0,0.4);
}
.logincontainer::before{
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:2px;
  background:linear-gradient(90deg,var(--mc-accent),transparent);
}
.logincontainer.with-social{ max-width:780px !important; }
.logincontainer h1,
.logincontainer h2,
.logincontainer .page-header h1{
  font-family:var(--ff-display);
  font-size:48px;
  line-height:.95;
  letter-spacing:.01em;
  text-transform:uppercase;
  margin:0 0 12px;
  color:var(--mc-text);
}
.logincontainer .page-header{
  border-bottom:none;
  padding-bottom:0;
  margin-bottom:8px;
}
.logincontainer .page-header small{
  font-family:var(--ff-body);
  font-size:14px;
  color:var(--mc-text-2);
  display:block;
  margin-top:8px;
  text-transform:none;
  letter-spacing:0;
  line-height:1.6;
}
.logincontainer p{ color:var(--mc-text-2); font-size:14px; line-height:1.7; margin-bottom:20px; }
.logincontainer form{ margin-top:24px; }
.logincontainer .checkbox{ margin:8px 0 24px; }
.logincontainer [align="center"]{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:24px;
  justify-content:stretch;
}
.logincontainer .btn{
  flex:1 1 auto;
  min-width:0;
  justify-content:center;
  padding:14px 16px !important;
  font-size:12px !important;
  letter-spacing:.05em;
  white-space:nowrap;
}
.logincontainer .btn-default{ flex:1 1 auto; }
@media(max-width:520px){
  .logincontainer [align="center"]{ flex-direction:column; }
  .logincontainer .btn{ width:100%; }
}

/* ---------- Panels ---------- */
.panel{
  background:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  border-radius:var(--mc-rl) !important;
  box-shadow:none !important;
  margin-bottom:24px;
}
.panel-heading{
  background:var(--mc-surface-2) !important;
  border-bottom:1px solid var(--mc-border) !important;
  border-radius:var(--mc-rl) var(--mc-rl) 0 0 !important;
  padding:18px 24px !important;
  color:var(--mc-text) !important;
}
.panel-title{
  font-family:var(--ff-sans);
  font-size:14px !important;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--mc-text) !important;
}
.panel-body{ padding:24px !important; color:var(--mc-text-2); }
.panel-footer{
  background:var(--mc-surface-2) !important;
  border-top:1px solid var(--mc-border) !important;
  padding:16px 24px !important;
}
.panel-default > .panel-heading,
.panel-primary > .panel-heading,
.panel-info > .panel-heading{
  background:var(--mc-surface-2) !important;
  color:var(--mc-text) !important;
  border-color:var(--mc-border) !important;
}
.panel-success > .panel-heading{ color:var(--mc-accent) !important; }
.panel-danger{ border-color:var(--mc-orange) !important; }
.panel-danger > .panel-heading{ background:rgba(255,95,31,0.08) !important; color:var(--mc-orange) !important; border-bottom-color:var(--mc-orange) !important; }
.panel-warning > .panel-heading{ color:var(--mc-orange) !important; }

/* ---------- Alerts ---------- */
.alert{
  border-radius:var(--mc-r) !important;
  border:1px solid var(--mc-border) !important;
  padding:16px 20px !important;
  font-size:14px;
  background:var(--mc-surface) !important;
  color:var(--mc-text) !important;
}
.alert-success{ background:rgba(0,232,122,0.08) !important; border-color:var(--mc-accent) !important; color:var(--mc-accent) !important; }
.alert-info{ background:var(--mc-surface-2) !important; border-color:var(--mc-border-h) !important; color:var(--mc-text) !important; }
.alert-warning{ background:rgba(255,95,31,0.08) !important; border-color:var(--mc-orange) !important; color:var(--mc-orange) !important; }
.alert-danger{ background:rgba(255,95,31,0.08) !important; border-color:var(--mc-orange) !important; color:var(--mc-orange) !important; }
.alert a{ color:inherit; text-decoration:underline; }

/* ---------- Tables (incl. dataTables, loaded LATE in body) ---------- */
.table,
table.table,
table.dataTable,
.table-responsive > .table,
.dataTables_wrapper .table{
  color:var(--mc-text) !important;
  background:transparent !important;
  background-color:transparent !important;
  border-color:var(--mc-border) !important;
}
.table > thead > tr > th,
table.table > thead > tr > th,
table.dataTable > thead > tr > th,
table.dataTable thead th,
table.dataTable thead td{
  background:var(--mc-surface-2) !important;
  background-color:var(--mc-surface-2) !important;
  border-bottom:1px solid var(--mc-border) !important;
  border-top:none !important;
  font-family:var(--ff-sans) !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--mc-text-3) !important;
  padding:14px 16px !important;
}
.table > tbody > tr,
table.dataTable > tbody > tr,
table.dataTable tbody tr{
  background:transparent !important;
  background-color:transparent !important;
  color:var(--mc-text) !important;
}
.table > tbody > tr > td,
table.dataTable > tbody > tr > td,
table.dataTable tbody td{
  background:transparent !important;
  background-color:transparent !important;
  border-top:1px solid var(--mc-border) !important;
  padding:14px 16px !important;
  vertical-align:middle;
  color:var(--mc-text) !important;
}
.table-striped > tbody > tr:nth-of-type(odd),
table.dataTable.stripe tbody tr.odd,
table.dataTable.display tbody tr.odd{
  background:var(--mc-surface) !important;
  background-color:var(--mc-surface) !important;
}
.table-striped > tbody > tr:nth-of-type(even),
table.dataTable.stripe tbody tr.even,
table.dataTable.display tbody tr.even{
  background:var(--mc-surface-2) !important;
  background-color:var(--mc-surface-2) !important;
}
.table-striped > tbody > tr:nth-of-type(odd) > td,
.table-striped > tbody > tr:nth-of-type(even) > td,
table.dataTable.stripe tbody tr.odd > td,
table.dataTable.stripe tbody tr.even > td{
  background:transparent !important;
  background-color:transparent !important;
}
.table-hover > tbody > tr:hover,
table.dataTable.hover tbody tr:hover,
table.dataTable.display tbody tr:hover{
  background:var(--mc-surface-2) !important;
  background-color:var(--mc-surface-2) !important;
}
.table-bordered{ border:1px solid var(--mc-border) !important; }

/* dataTables wrapper + controls */
.dataTables_wrapper,
div.dataTables_wrapper{
  background:transparent !important;
  background-color:transparent !important;
  color:var(--mc-text-2) !important;
  padding:0 !important;
}
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate{
  color:var(--mc-text-2) !important;
}
.dataTables_wrapper .dataTables_length label,
.dataTables_wrapper .dataTables_filter label{
  color:var(--mc-text-2) !important;
  font-family:var(--ff-sans);
  font-size:12px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input{
  background:var(--mc-surface) !important;
  background-color:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  color:var(--mc-text) !important;
  border-radius:var(--mc-r) !important;
  padding:8px 12px !important;
  margin-left:8px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button{
  background:var(--mc-surface) !important;
  background-color:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  color:var(--mc-text-2) !important;
  border-radius:var(--mc-r) !important;
  padding:6px 12px !important;
  margin:0 2px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
  background:var(--mc-accent) !important;
  background-color:var(--mc-accent) !important;
  border-color:var(--mc-accent) !important;
  color:#050805 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover{
  background:transparent !important;
  background-color:transparent !important;
  color:var(--mc-text-3) !important;
  border-color:var(--mc-border) !important;
}

/* WHMCS-specific table-list — match all.css selectors exactly (lines 9209-9345) */
.dataTables_wrapper table.table-list,
table.table-list,
.table-list{
  background:transparent !important;
  background-color:transparent !important;
  color:var(--mc-text) !important;
  border-color:var(--mc-border) !important;
}
/* Header cells: beats `table.table-list thead th { background-color:#fff }` (all.css:9315) */
table.table-list > thead > tr > th,
table.table-list thead th,
.dataTables_wrapper table.table-list thead th,
.dataTables_wrapper table.table-list thead th.sorting,
.dataTables_wrapper table.table-list thead th.sorting_asc,
.dataTables_wrapper table.table-list thead th.sorting_desc{
  background:#131720 !important;
  background-color:#131720 !important;
  color:#8084A0 !important;
  border-bottom:1px solid rgba(255,255,255,0.07) !important;
  border-top:none !important;
  font-family:'Syne',sans-serif !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:14px 16px !important;
}
/* Body cells: beats `.table-list > tbody > tr > td { background-color:#fff }` (all.css:9341) */
.table-list > tbody > tr > td,
table.table-list > tbody > tr > td,
.table-list tbody tr td{
  background:#0D1018 !important;
  background-color:#0D1018 !important;
  color:#EEF0F8 !important;
  border-top:1px solid rgba(255,255,255,0.07) !important;
  padding:14px 16px !important;
  vertical-align:middle;
}
/* Even rows: beats `.table-list > tbody > tr:nth-child(even) > td { background:#f8fcfd }` (all.css:9344) */
.table-list > tbody > tr:nth-child(even) > td,
table.table-list > tbody > tr:nth-child(even) > td,
.table-list tbody tr:nth-child(even) td,
.table-list > tbody > tr.even > td,
table.table-list > tbody > tr.even > td{
  background:#131720 !important;
  background-color:#131720 !important;
}
/* Odd rows (DataTables adds class="odd"): explicit dark */
.table-list > tbody > tr:nth-child(odd) > td,
table.table-list > tbody > tr:nth-child(odd) > td,
.table-list > tbody > tr.odd > td,
table.table-list > tbody > tr.odd > td{
  background:#0D1018 !important;
  background-color:#0D1018 !important;
}
/* Hover row */
.table-list > tbody > tr:hover > td,
table.table-list > tbody > tr:hover > td{
  background:#1a1f2e !important;
  background-color:#1a1f2e !important;
}
/* Borders that all.css line 9215-9221 sets to green */
.dataTables_wrapper table.table-list thead th,
.dataTables_wrapper table.table-list thead th:nth-child(even){
  border-bottom:1px solid rgba(255,255,255,0.07) !important;
}
/* dataTables_info has dark grey bg from all.css line 9193 — make it match our scheme */
.dataTables_wrapper .dataTables_info,
div.dataTables_wrapper div.dataTables_info{
  background:transparent !important;
  background-color:transparent !important;
  color:#8084A0 !important;
  padding:14px 0 !important;
}
.dataTables_wrapper .dataTables_length,
div.dataTables_wrapper div.dataTables_length{
  background:transparent !important;
  background-color:transparent !important;
  color:#8084A0 !important;
}
.dataTables_wrapper .dataTables_filter label .form-control{
  background:#0D1018 !important;
  background-color:#0D1018 !important;
  border:1px solid rgba(255,255,255,0.07) !important;
  color:#EEF0F8 !important;
}

/* Container that wraps tables on clientarea pages */
.table-responsive,
.client-home-panels .panel,
.client-home-panels{
  background:transparent !important;
  background-color:transparent !important;
  border-color:var(--mc-border) !important;
}

/* ---------- Labels & badges ---------- */
.label,.badge{
  font-family:var(--ff-sans);
  font-weight:700;
  font-size:10px;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:4px 10px;
  border-radius:999px;
}
.label-default,.badge{ background:var(--mc-surface-2); color:var(--mc-text-2); }
.label-success{ background:var(--mc-accent-dim); color:var(--mc-accent); }
.label-info{ background:var(--mc-surface-2); color:var(--mc-text); }
.label-warning{ background:rgba(255,95,31,0.15); color:var(--mc-orange); }
.label-danger{ background:rgba(255,95,31,0.15); color:var(--mc-orange); }

/* ---------- Sidebar ---------- */
.sidebar{ padding-top:8px; }
.sidebar .list-group,
.sidebar .panel{
  background:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  border-radius:var(--mc-rl);
  overflow:hidden;
}
.sidebar .list-group-item,
.list-group-item{
  background:transparent !important;
  border:none !important;
  border-bottom:1px solid var(--mc-border) !important;
  color:var(--mc-text-2) !important;
  padding:14px 18px !important;
  font-family:var(--ff-sans);
  font-size:13px;
  font-weight:600;
}
.list-group-item:last-child{ border-bottom:none !important; }
.list-group-item:hover,
.list-group-item.active,
.list-group-item.active:hover{
  background:var(--mc-surface-2) !important;
  color:var(--mc-text) !important;
}
.list-group-item.active{ box-shadow:inset 3px 0 0 var(--mc-accent); }
.list-group-item i{ color:var(--mc-accent); width:18px; }

/* ---------- Modals ---------- */
.modal-content{
  background:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  border-radius:var(--mc-rl) !important;
  color:var(--mc-text);
}
.modal-header{ border-bottom:1px solid var(--mc-border); padding:20px 24px; }
.modal-title{ font-family:var(--ff-sans); font-weight:700; }
.modal-body{ padding:24px; }
.modal-footer{ border-top:1px solid var(--mc-border); padding:16px 24px; }
.modal-backdrop{ background:#000; }
.modal-backdrop.in{ opacity:.75; }
.close{ color:var(--mc-text) !important; opacity:.7; text-shadow:none; }
.close:hover{ opacity:1; }

/* ---------- Wells, jumbotrons, misc panels ---------- */
.well,.jumbotron{
  background:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  border-radius:var(--mc-rl) !important;
  color:var(--mc-text) !important;
  box-shadow:none !important;
}

/* ---------- Home shortcuts (homepage when logged in) ---------- */
#home-banner{
  background:var(--mc-surface);
  border-bottom:1px solid var(--mc-border);
  padding:64px 0;
}
#home-banner h2{
  font-family:var(--ff-display);
  font-size:clamp(40px,5vw,64px);
  letter-spacing:.01em;
  text-transform:uppercase;
  color:var(--mc-text);
  margin-bottom:24px;
}
.home-shortcuts{
  background:var(--mc-bg);
  padding:48px 0;
  border-bottom:1px solid var(--mc-border);
}
.home-shortcuts ul{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.home-shortcuts li a{
  display:block;
  background:var(--mc-surface);
  border:1px solid var(--mc-border);
  border-radius:var(--mc-rl);
  padding:32px 24px;
  text-align:center;
  color:var(--mc-text);
  transition:all .2s;
}
.home-shortcuts li a:hover{
  border-color:var(--mc-accent);
  transform:translateY(-2px);
  color:var(--mc-text);
}
.home-shortcuts li i{
  font-size:32px;
  color:var(--mc-accent);
  margin-bottom:16px;
  display:block;
}
.home-shortcuts li p{
  font-family:var(--ff-sans);
  font-size:13px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--mc-text);
  margin:0;
}
@media(max-width:768px){ .home-shortcuts ul{ grid-template-columns:repeat(2,1fr); } }

/* ---------- Footer (#footer) ---------- */
section#footer,
#footer{
  background:var(--mc-surface) !important;
  border-top:1px solid var(--mc-border) !important;
  color:var(--mc-text-3) !important;
  padding:32px 0 !important;
  margin:0 !important;
  text-align:center;
}
section#footer p,
#footer p{
  font-family:var(--ff-body) !important;
  font-size:13px;
  color:var(--mc-text-3) !important;
  margin:0;
}
section#footer p a,
#footer p a{ color:var(--mc-text-2) !important; }
section#footer p a:hover,
#footer p a:hover{ color:var(--mc-accent) !important; }
section#footer .back-to-top,
#footer .back-to-top{
  float:none !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:40px; height:40px;
  border-radius:50% !important;
  background:var(--mc-surface-2) !important;
  border:1px solid var(--mc-border) !important;
  color:var(--mc-text-2) !important;
  margin-bottom:16px;
  transition:all .2s;
  padding:0 !important;
  opacity:1 !important;
}
section#footer .back-to-top i,
#footer .back-to-top i{
  background:transparent !important;
  color:inherit !important;
  padding:0 !important;
  opacity:1 !important;
}
section#footer .back-to-top:hover,
#footer .back-to-top:hover{
  border-color:var(--mc-accent) !important;
  color:var(--mc-accent) !important;
  transform:translateY(-2px);
}

/* ---------- Misc WHMCS bits ---------- */
.popover{
  background:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  color:var(--mc-text);
  border-radius:var(--mc-r);
}
.popover-title{ background:var(--mc-surface-2) !important; border-bottom:1px solid var(--mc-border); color:var(--mc-text); }
.popover.bottom > .arrow,
.popover.bottom > .arrow:after{ border-bottom-color:var(--mc-border) !important; }

.tooltip-inner{ background:var(--mc-surface-2); color:var(--mc-text); border:1px solid var(--mc-border); }
.tooltip.in{ opacity:1; }

.progress{
  background:var(--mc-surface-2);
  border-radius:999px;
  height:8px;
  box-shadow:none;
}
.progress-bar{ background:var(--mc-accent); }
.progress-bar-success{ background:var(--mc-accent); }

.pagination > li > a,
.pagination > li > span{
  background:var(--mc-surface) !important;
  border:1px solid var(--mc-border) !important;
  color:var(--mc-text-2) !important;
}
.pagination > .active > a,
.pagination > .active > span{
  background:var(--mc-accent) !important;
  border-color:var(--mc-accent) !important;
  color:#050805 !important;
}

/* Tabs */
.nav-tabs{ border-bottom:1px solid var(--mc-border); }
.nav-tabs > li > a{
  border:none !important;
  background:transparent !important;
  color:var(--mc-text-2) !important;
  font-family:var(--ff-sans);
  font-size:13px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  padding:14px 20px;
  border-radius:0 !important;
  border-bottom:2px solid transparent !important;
}
.nav-tabs > li > a:hover{ color:var(--mc-text) !important; border-bottom-color:var(--mc-border-h) !important; }
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus{
  background:transparent !important;
  color:var(--mc-text) !important;
  border-bottom-color:var(--mc-accent) !important;
}

/* Focus visible for a11y */
a:focus-visible,button:focus-visible,
input:focus-visible,textarea:focus-visible,select:focus-visible,
[tabindex]:focus-visible{
  outline:2px solid var(--mc-accent);
  outline-offset:2px;
}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    transition-duration:.01ms !important;
  }
}

/* ---------- Responsive ---------- */
@media(max-width:768px){
  #header .container{
    flex-wrap:wrap;
    gap:12px;
    min-height:auto;
  }
  #header .top-nav{ gap:16px; flex-wrap:wrap; }
  .logincontainer{ margin:32px 16px; padding:32px 24px; }
  .logincontainer h1,.logincontainer h2,.logincontainer .page-header h1{ font-size:36px; }
  .logincontainer [align="center"]{ flex-direction:column; }
  #main-body{ padding:32px 0 64px; }
  #main-body .page-header h1,
  #main-body .page-header h2{ font-size:36px; }
}

