/* Wonderweb WHMCS V2.2 | Header/Logo Cleanup
 * Scope: client-side wonderwebv2 only. Does not affect admin, checkout, or Paynow.
 * Loaded after existing theme styles intentionally to override previous refinements.
 */
:root { --ww-head-navy: #151431; --ww-head-light: #f7f7fb; --ww-head-accent: #a991ff; }

/* Remove redundant bands: extra utility ribbon + decorative accent strip. */
body.ww-portal .ww-utility,
body.ww-portal .ww-page-accent { display: none !important; }

/* Collapse header into one continuous navy surface. */
body.ww-portal #header {
  background: var(--ww-head-navy) !important;
  border: 0 !important;
  box-shadow: 0 4px 16px rgba(14,12,41,.12) !important;
  padding: 0 !important;
  margin: 0 !important;
}
body.ww-portal #header .topbar {
  background: var(--ww-head-navy) !important;
  border: 0 !important;
  box-shadow: none !important;
}
body.ww-portal #header > .navbar.navbar-light {
  background: var(--ww-head-navy) !important;
  border: 0 !important;
  padding: 12px 0 8px !important;
}
body.ww-portal #header > .navbar.navbar-light > .container {
  min-height: 0 !important;
  align-items: center !important;
}

/* The official white logo has transparency: no opaque plaque or white backing. */
body.ww-portal #header .navbar-brand,
body.ww-portal #header .navbar-brand.mr-3 {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 20px 0 0 !important;
  min-height: 0 !important;
}
body.ww-portal #header .ww-brand-logo,
body.ww-portal #header .navbar-brand img {
  display: block !important;
  background: transparent !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  width: min(245px, 43vw) !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 52px !important;
  object-fit: contain !important;
}

/* Compact navigation row: merge into the navy header instead of a white ribbon. */
body.ww-portal #header .main-navbar-wrapper {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.ww-portal #header .main-navbar-wrapper > .container {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  min-height: 0 !important;
}
body.ww-portal #header .main-navbar-wrapper .navbar-nav > li > a,
body.ww-portal #header .main-navbar-wrapper .navbar-nav .nav-link,
body.ww-portal #header .main-navbar-wrapper .navbar-nav .dropdown-toggle {
  color: #f5f3ff !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  padding: 9px 12px !important;
  min-height: 0 !important;
}
body.ww-portal #header .main-navbar-wrapper .navbar-nav > li > a:hover,
body.ww-portal #header .main-navbar-wrapper .navbar-nav > li > a:focus,
body.ww-portal #header .main-navbar-wrapper .navbar-nav > li.show > a,
body.ww-portal #header .main-navbar-wrapper .navbar-nav .nav-link:hover {
  color: var(--ww-head-accent) !important;
}
/* Important: dropdown items sit on white and must remain dark and legible. */
body.ww-portal #header .main-navbar-wrapper .dropdown-menu {
  background: #fff !important;
  border: 1px solid #e7e6ef !important;
  padding: 6px !important;
}
body.ww-portal #header .main-navbar-wrapper .dropdown-menu a,
body.ww-portal #header .main-navbar-wrapper .dropdown-menu .dropdown-item {
  color: #24233f !important;
  background: transparent !important;
  font-size: 14px !important;
  padding: 9px 12px !important;
}
body.ww-portal #header .main-navbar-wrapper .dropdown-menu a:hover,
body.ww-portal #header .main-navbar-wrapper .dropdown-menu .dropdown-item:hover {
  color: #603ddd !important;
  background: #f4f0ff !important;
}

/* The breadcrumb is content, not a separate full-width ribbon. */
body.ww-portal .master-breadcrumb {
  background: var(--ww-head-light) !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 9px 0 0 !important;
  min-height: 0 !important;
}
body.ww-portal .master-breadcrumb .breadcrumb {
  background: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
}
body.ww-portal #main-body { padding-top: 18px !important; }

/* Same official transparent logo on navy footer. */
body.ww-portal #footer .ww-footer-logo {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  width: 225px !important;
  max-width: 100% !important;
  height: auto !important;
}

@media (max-width: 1199px) {
  body.ww-portal #header > .navbar.navbar-light { padding: 10px 0 !important; }
  body.ww-portal #header .main-navbar-wrapper,
  body.ww-portal #header .main-navbar-wrapper > .container {
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
  }
  body.ww-portal #header .main-navbar-wrapper .navbar-collapse:not(.show):not(.collapsing) { display: none !important; }
  body.ww-portal #header .main-navbar-wrapper .navbar-collapse.show,
  body.ww-portal #header .main-navbar-wrapper .navbar-collapse.collapsing {
    background: #1c1b40 !important;
    padding: 8px 10px 12px !important;
    margin: 0 0 5px !important;
    border-radius: 10px !important;
  }
  body.ww-portal #header .main-navbar-wrapper .navbar-nav > li > a,
  body.ww-portal #header .main-navbar-wrapper .navbar-nav .nav-link,
  body.ww-portal #header .main-navbar-wrapper .navbar-nav .dropdown-toggle { padding: 11px 13px !important; }
}
@media (max-width: 767px) {
  body.ww-portal #header .ww-brand-logo,
  body.ww-portal #header .navbar-brand img {
    width: min(190px, 49vw) !important;
    max-height: 39px !important;
  }
  body.ww-portal #header .navbar-brand { margin-right: 10px !important; }
  body.ww-portal #header .toolbar .nav-link { padding: 9px !important; }
  body.ww-portal .master-breadcrumb { padding: 7px 0 0 !important; }
  body.ww-portal #main-body { padding-top: 12px !important; }
}
@media print {
  body.ww-portal .ww-utility,
  body.ww-portal .ww-page-accent,
  body.ww-portal #header .main-navbar-wrapper { display: none !important; }
}
