/* =========================================================
   HORIZONNODE WHMCS MAIN THEME
   Full-screen background + centered RocketNode-style layout
   ========================================================= */

:root{
  --hn-bg:#05061f;
  --hn-panel:#11132c;
  --hn-panel-2:#171932;
  --hn-line:rgba(62,193,243,.16);
  --hn-blue:#3EC1F3;
  --hn-blue-2:#008FFE;
  --hn-text:#ffffff;
  --hn-muted:#9faecc;
  --hn-input:#0b0d24;
  --hn-content:1420px;
}

/* PAGE */
html,
body,
body.primary-bg-color{
  width:100%;
  min-height:100%;
  margin:0;
  background:var(--hn-bg)!important;
  color:var(--hn-text)!important;
}

body{
  overflow-x:hidden;
}

a{
  color:var(--hn-blue);
  transition:color .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}

a:hover{
  color:#7dd8ff;
  text-decoration:none;
}

/* =========================================================
   GLOBAL WIDTH
   Backgrounds remain full width.
   Actual content remains centered.
   ========================================================= */

.container,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl{
  width:calc(100% - 64px)!important;
  max-width:var(--hn-content)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
}

#main-body,
section#main-body,
.main-content{
  width:100%!important;
  max-width:none!important;
  background:transparent!important;
}

#main-body > .container,
section#main-body > .container{
  width:calc(100% - 64px)!important;
  max-width:var(--hn-content)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* =========================================================
   HEADER
   ========================================================= */

#header.hn-simple-header,
header.header,
.header,
section#header{
  width:100%!important;
  background:var(--hn-bg)!important;
  border:0!important;
  border-bottom:1px solid rgba(62,193,243,.10)!important;
  box-shadow:none!important;
}

.hn-simple-brandbar{
  width:100%!important;
  background:var(--hn-bg)!important;
  border-bottom:1px solid rgba(62,193,243,.08)!important;
}

.hn-simple-brandbar .container,
.hn-simple-navband .container{
  width:calc(100% - 64px)!important;
  max-width:var(--hn-content)!important;
  margin:0 auto!important;
}

.hn-simple-brandrow{
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.hn-simple-logo{
  display:inline-flex;
  align-items:center;
}

.hn-simple-logo img{
  display:block;
  width:auto!important;
  height:38px!important;
  max-width:250px!important;
  object-fit:contain;
}

.hn-simple-account{
  display:flex;
  gap:18px;
  align-items:center;
}

.hn-simple-account a{
  color:#d9deec!important;
  text-decoration:none;
  font-size:13px;
  font-weight:600;
}

.hn-simple-account a:hover{
  color:var(--hn-blue)!important;
}

.hn-simple-navband,
.navbar,
.navbar-default,
.navbar-main,
#main-menu,
section#main-menu{
  width:100%!important;
  background:var(--hn-bg)!important;
  border-color:rgba(62,193,243,.10)!important;
}

.hn-simple-nav-collapse{
  display:block!important;
}

.hn-simple-nav{
  list-style:none;
  padding:0;
  margin:0;
  min-height:48px;
  display:flex;
  align-items:center;
  gap:30px;
}

.hn-simple-nav>li{
  position:relative;
}

.hn-simple-nav>li>a,
.navbar-main .navbar-nav>li>a,
.navbar a,
#main-menu a{
  display:flex;
  min-height:48px;
  align-items:center;
  color:#fff!important;
  font-size:15px;
  font-weight:600;
  text-decoration:none;
}

.hn-simple-nav>li>a:hover,
.navbar-main .navbar-nav>li>a:hover,
.navbar a:hover,
#main-menu a:hover{
  color:var(--hn-blue)!important;
}

.hn-store-dropdown>a i{
  margin-left:7px;
  font-size:11px;
}

.hn-store-menu,
.dropdown-menu{
  background:var(--hn-panel)!important;
  border:1px solid rgba(62,193,243,.15)!important;
  box-shadow:0 20px 45px rgba(0,0,0,.35)!important;
}

.hn-store-menu{
  display:none;
  position:absolute;
  top:100%;
  left:-14px;
  z-index:1050;
  min-width:220px;
  padding:10px;
  border-radius:9px;
}

.hn-store-dropdown:hover .hn-store-menu{
  display:block;
}

.hn-store-menu a,
.dropdown-menu a{
  display:block;
  padding:10px 12px;
  border-radius:7px;
  color:#cbd4e9!important;
  text-decoration:none;
  font-size:13px;
}

.hn-store-menu a:hover,
.dropdown-menu a:hover{
  background:rgba(62,193,243,.08)!important;
  color:var(--hn-blue)!important;
}

.hn-simple-menu-button{
  display:none;
}

/* =========================================================
   BREADCRUMB / PAGE BAR
   ========================================================= */

.master-breadcrumb{
  width:100%!important;
  background:#080a21!important;
  border-top:1px solid rgba(62,193,243,.08)!important;
  border-bottom:1px solid rgba(62,193,243,.08)!important;
  box-shadow:none!important;
}

.master-breadcrumb .container{
  width:calc(100% - 64px)!important;
  max-width:var(--hn-content)!important;
  margin:0 auto!important;
}

.breadcrumb{
  background:#0b0d24!important;
  border:1px solid rgba(62,193,243,.14)!important;
  color:var(--hn-muted)!important;
  box-shadow:none!important;
}

.breadcrumb a,
.breadcrumb-item,
.breadcrumb-item.active{
  color:var(--hn-muted)!important;
}

.breadcrumb a:hover{
  color:var(--hn-blue)!important;
}

/* =========================================================
   CARDS / CONTENT
   ========================================================= */

.card,
.panel,
.panel-default,
.list-group-item,
.domain-pricing .tld-pricing-header,
.domain-pricing .tld-pricing-footer,
.announcement-single,
.announcement-content,
.announcement .announcement-content,
.announcement .card-body,
.announcement article,
.card-body blockquote,
blockquote{
  background:var(--hn-panel)!important;
  border-color:rgba(62,193,243,.14)!important;
  color:#fff!important;
}

.card-header,
.card-footer,
.panel-heading,
.panel-footer{
  background:var(--hn-panel-2)!important;
  border-color:rgba(255,255,255,.07)!important;
  color:#fff!important;
}

.announcement-content p,
.announcement-content div,
.announcement-content span,
blockquote p{
  color:#c7d2e9!important;
}

.bg-white,
.bg-light,
.card.bg-white,
.panel-body{
  background-color:var(--hn-panel)!important;
  color:#e8edf8!important;
}

.text-muted,
.form-text,
.small{
  color:var(--hn-muted)!important;
}

/* =========================================================
   FORMS
   ========================================================= */

input,
select,
textarea,
.form-control,
.custom-select,
.input-group-text{
  background:var(--hn-input)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.12)!important;
}

.form-control:focus,
.custom-select:focus,
input:focus,
select:focus,
textarea:focus{
  border-color:var(--hn-blue)!important;
  box-shadow:0 0 0 .18rem rgba(62,193,243,.13)!important;
  outline:none!important;
}

input::placeholder,
textarea::placeholder,
.form-control::placeholder{
  color:#7785a5!important;
}

.input-group-text{
  background:#141731!important;
  color:#aab7d2!important;
}

/* =========================================================
   BUTTONS
   ========================================================= */

.btn-primary{
  background:linear-gradient(135deg,var(--hn-blue),var(--hn-blue-2))!important;
  border-color:#159ee8!important;
  color:#04111b!important;
  font-weight:700;
}

.btn-primary:hover{
  filter:brightness(1.06);
  transform:translateY(-1px);
}

.btn-default,
.btn-secondary{
  background:#171a34!important;
  border-color:rgba(62,193,243,.18)!important;
  color:#fff!important;
}

.btn-default:hover,
.btn-secondary:hover{
  background:#202544!important;
  color:var(--hn-blue)!important;
}

/* =========================================================
   TABLES
   ========================================================= */

table,
.table,
.table>tbody>tr>td,
.table>tbody>tr>th,
.table>thead>tr>th{
  background:var(--hn-panel)!important;
  color:#dce5f5!important;
  border-color:rgba(255,255,255,.07)!important;
}

.table-striped tbody tr:nth-of-type(odd){
  background:rgba(255,255,255,.02)!important;
}

/* =========================================================
   STRAY LIGHT / WHITE AREAS
   ========================================================= */

.progress,
.progress-bar-bg,
.bg-gray,
.bg-grey,
.bg-light-gray,
.bg-light-grey{
  background-color:#14162d!important;
  border-color:rgba(255,255,255,.07)!important;
}

.progress{
  box-shadow:none!important;
}

hr{
  background:transparent!important;
  border-color:rgba(255,255,255,.07)!important;
}

/* =========================================================
   LOGIN
   ========================================================= */

.login-form .card{
  background:var(--hn-panel)!important;
  border:1px solid var(--hn-line)!important;
  box-shadow:0 25px 70px rgba(0,0,0,.28)!important;
}

/* =========================================================
   FOOTER
   ========================================================= */

footer.footer{
  display:none!important;
}

.hn-client-footer{
  width:100%!important;
  margin-top:70px;
  background:#07081d!important;
  border-top:1px solid rgba(62,193,243,.10)!important;
  color:#aebbd6!important;
}

.hn-client-footer .container{
  width:calc(100% - 64px)!important;
  max-width:var(--hn-content)!important;
  margin:0 auto!important;
  padding-top:58px!important;
  padding-bottom:24px!important;
}

.hn-client-footer-grid{
  display:grid;
  grid-template-columns:1.35fr 1fr 1fr 1fr;
  gap:48px;
}

.hn-client-footer-brand p{
  max-width:330px;
  margin:20px 0 0;
  color:#9facc7!important;
  font-size:14px;
  line-height:1.75;
}

.hn-client-footer-logo{
  display:inline-flex;
  align-items:center;
}

.hn-client-footer-logo img{
  display:block;
  width:auto!important;
  height:42px!important;
  max-width:250px!important;
  object-fit:contain;
}

.hn-client-footer-col{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.hn-client-footer-col h4{
  margin:0 0 8px;
  color:#fff!important;
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.5px;
}

.hn-client-footer-col a,
.hn-client-footer-legal a{
  color:#aebbd6!important;
  text-decoration:none;
  font-size:14px;
}

.hn-client-footer-col a:hover,
.hn-client-footer-legal a:hover{
  color:var(--hn-blue)!important;
}

.hn-client-footer-bottom{
  margin-top:48px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.07);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.hn-client-footer-bottom p{
  margin:0;
  color:#8f9bb7!important;
  font-size:12px;
}

.hn-client-footer-legal{
  display:flex;
  gap:22px;
}

.hn-client-footer-legal a{
  font-size:12px;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:991px){

  .container,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl,
  .container-xxl,
  #main-body > .container,
  section#main-body > .container,
  .hn-simple-brandbar .container,
  .hn-simple-navband .container,
  .master-breadcrumb .container,
  .hn-client-footer .container{
    width:calc(100% - 30px)!important;
  }

  .hn-simple-brandrow{
    min-height:64px;
  }

  .hn-simple-logo img{
    height:32px!important;
    max-width:210px!important;
  }

  .hn-simple-menu-button{
    display:inline-flex;
    margin:8px 0;
    width:42px;
    height:38px;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.10);
    border-radius:7px;
    background:#171927;
    color:#fff;
  }

  .hn-simple-nav-collapse{
    display:none!important;
  }

  .hn-simple-nav-collapse.show{
    display:block!important;
  }

  .hn-simple-nav{
    padding:8px 0 14px;
    min-height:0;
    flex-direction:column;
    align-items:stretch;
    gap:0;
  }

  .hn-simple-nav>li>a{
    min-height:42px;
  }

  .hn-store-menu{
    position:static;
    display:block;
    margin:0 0 8px 12px;
    box-shadow:none!important;
  }
}

@media(max-width:900px){
  .hn-client-footer-grid{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:600px){
  .hn-client-footer-grid{
    grid-template-columns:1fr;
    gap:32px;
  }

  .hn-client-footer-bottom{
    align-items:flex-start;
    flex-direction:column;
  }

  .hn-client-footer-legal{
    flex-wrap:wrap;
  }
}