/* Generated by scripts/build-whmcs-theme.mjs. Edit whmcs/src/custom.css, not this file. */
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/56069e83bb5b2425-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c4,u+2113,u+2c60-2c7f,u+a720-a7ff}
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/91601dd83defba07-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/56069e83bb5b2425-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c4,u+2113,u+2c60-2c7f,u+a720-a7ff}
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/91601dd83defba07-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/56069e83bb5b2425-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c4,u+2113,u+2c60-2c7f,u+a720-a7ff}
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/91601dd83defba07-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/56069e83bb5b2425-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c4,u+2113,u+2c60-2c7f,u+a720-a7ff}
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/91601dd83defba07-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/56069e83bb5b2425-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c4,u+2113,u+2c60-2c7f,u+a720-a7ff}
@font-face{font-family:Schibsted Grotesk;font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/91601dd83defba07-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:Schibsted Grotesk Fallback;src:local("Arial");ascent-override:93.46%;descent-override:24.67%;line-gap-override:0.00%;size-adjust:104.49%}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/edc640959b0c7826-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ac0e76ddaeeb7981-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/64d784ea54a4acde-s.woff2) format("woff2");unicode-range:u+0370-0377,u+037a-037f,u+0384-038a,u+038c,u+038e-03a1,u+03a3-03ff}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ff71da380fbe67dd-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/6d831b18ae5b01dc-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c4,u+2113,u+2c60-2c7f,u+a720-a7ff}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/558ca1a6aa3cb55e-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/edc640959b0c7826-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ac0e76ddaeeb7981-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/64d784ea54a4acde-s.woff2) format("woff2");unicode-range:u+0370-0377,u+037a-037f,u+0384-038a,u+038c,u+038e-03a1,u+03a3-03ff}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ff71da380fbe67dd-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/6d831b18ae5b01dc-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c4,u+2113,u+2c60-2c7f,u+a720-a7ff}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/558ca1a6aa3cb55e-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/edc640959b0c7826-s.woff2) format("woff2");unicode-range:u+0460-052f,u+1c80-1c8a,u+20b4,u+2de0-2dff,u+a640-a69f,u+fe2e-fe2f}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ac0e76ddaeeb7981-s.woff2) format("woff2");unicode-range:u+0301,u+0400-045f,u+0490-0491,u+04b0-04b1,u+2116}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/64d784ea54a4acde-s.woff2) format("woff2");unicode-range:u+0370-0377,u+037a-037f,u+0384-038a,u+038c,u+038e-03a1,u+03a3-03ff}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ff71da380fbe67dd-s.woff2) format("woff2");unicode-range:u+0102-0103,u+0110-0111,u+0128-0129,u+0168-0169,u+01a0-01a1,u+01af-01b0,u+0300-0301,u+0303-0304,u+0308-0309,u+0323,u+0329,u+1ea0-1ef9,u+20ab}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/6d831b18ae5b01dc-s.woff2) format("woff2");unicode-range:u+0100-02ba,u+02bd-02c5,u+02c7-02cc,u+02ce-02d7,u+02dd-02ff,u+0304,u+0308,u+0329,u+1d00-1dbf,u+1e00-1e9f,u+1ef2-1eff,u+2020,u+20a0-20ab,u+20ad-20c4,u+2113,u+2c60-2c7f,u+a720-a7ff}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/558ca1a6aa3cb55e-s.p.woff2) format("woff2");unicode-range:u+00??,u+0131,u+0152-0153,u+02bb-02bc,u+02c6,u+02da,u+02dc,u+0304,u+0308,u+0329,u+2000-206f,u+20ac,u+2122,u+2191,u+2193,u+2212,u+2215,u+feff,u+fffd}
@font-face{font-family:JetBrains Mono Fallback;src:local("Arial");ascent-override:75.79%;descent-override:22.29%;line-gap-override:0.00%;size-adjust:134.59%}
:root{--font-schibsted:,system-ui,sans-serif;--font-jetbrains:,ui-monospace,monospace;}
:root{
  --paper: #eef0f2;
  --white: #ffffff;
  --ink: #0e1114;
  --mute: #5c646b;
  --on-ink: #bfc7cc;
  --line: #d1d6da;
  --ink-line: #333a42;
  --orange: #ff5a1f;
  --orange-ink: #c93a00;
  --green: #34cc73;
  --logo-dark: #0e1114;
  --logo-mid: #5c646b;
  --logo-signal: #ff5a1f;
  --ease: cubic-bezier(0.23, 1, 0.32, 1);
  --font-display:
    var(--font-schibsted), system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: var(--font-jetbrains), ui-monospace, 'SF Mono', Menlo, monospace;
  --gutter-x: max(20px, env(safe-area-inset-left, 0px));
  color-scheme: light;
}
.crx .sr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.crx .band{
  padding-inline: max(var(--gutter-x), calc((100% - 1280px) / 2));
}
.crx .band-ink{
  background: var(--ink);
  color: var(--paper);
}
.crx .band-white{
  background: var(--white);
}
.crx .band-orange{
  background: var(--orange);
  color: var(--ink);
}
.crx .eyebrow{
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}
.crx .band-ink .eyebrow{
  color: var(--on-ink);
}
.crx .announce{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  padding-block: 10px;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
}
.crx .announce a{
  flex: none;
  padding: 4px 12px;
  border: 1px solid var(--on-ink);
  text-decoration: none;
}
.crx .announce a:hover{
  background: var(--paper);
  color: var(--ink);
}
.crx .header{
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px 32px;
  padding-block: 16px;
  background: rgb(238 240 242 / 0.9);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.crx .logo{
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}
.crx .logo-word{
  letter-spacing: -0.03em;
  line-height: 1;
}
.crx .logo-light{
  font-weight: 400;
}
.crx .logo-bold{
  font-weight: 800;
}
.crx .nav{
  display: flex;
  align-items: center;
  gap: 4px 28px;
  font-size: 16px;
  font-weight: 500;
}
.crx .nav a,.crx .nav button{
  text-decoration: none;
}
.crx .nav-plain,.crx .nav-item > button{
  padding: 8px 0;
  background: none;
  border: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
}
.crx .nav-item{
  position: relative;
}
.crx .nav-menu{
  position: absolute;
  top: 100%;
  left: -16px;
  min-width: 220px;
  padding: 8px;
  background: var(--white);
  border: 1px solid var(--line);
  box-shadow: 0 12px 32px rgb(14 17 20 / 0.1);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  transition:
    opacity 160ms var(--ease),
    transform 160ms var(--ease),
    visibility 160ms;
}
.crx .nav-item:hover .nav-menu,.crx .nav-item:focus-within .nav-menu{
  opacity: 1;
  visibility: visible;
  transform: none;
}
.crx .nav-menu a{
  display: block;
  padding: 9px 12px;
  font-size: 15px;
}
.crx .nav-menu a:hover{
  background: var(--paper);
}
.crx .mnav{
  display: none;
}
.crx .btn,.crx .btn-outline{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  white-space: nowrap;
  transition:
    transform 160ms var(--ease),
    background-color 160ms var(--ease),
    color 160ms var(--ease);
}
.crx .btn{
  padding: 13px 24px;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.2;
  border: 1px solid transparent;
}
.crx .btn:active,.crx .btn-outline:active{
  transform: scale(0.97);
}
.crx .btn-ink{
  background: var(--ink);
  color: var(--paper);
}
.crx .btn-ink:hover{
  background: #262d34;
}
.crx .btn-orange{
  background: var(--orange);
  color: var(--ink);
}
.crx .btn-orange:hover{
  background: #ff7240;
}
.crx .btn-line{
  border-color: var(--ink);
}
.crx .band-ink .btn-line{
  border-color: var(--on-ink);
  color: var(--paper);
}
.crx .btn-line:hover{
  background: rgb(255 255 255 / 0.1);
}
.crx .band-orange .btn-line:hover{
  background: rgb(14 17 20 / 0.08);
}
.crx .btn-outline{
  padding: 10px 16px;
  border: 1px solid var(--ink);
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 500;
}
.crx .btn-outline:hover{
  background: var(--ink);
  color: var(--paper);
}
.crx .actions{
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.crx .footer{
  padding-block: 64px 36px;
  font-size: 15px;
  color: var(--on-ink);
  --logo-dark: #eef0f2;
  --logo-mid: #7c868d;
}
.crx .footer-cols{
  display: grid;
  grid-template-columns: 1.5fr repeat(6, 1fr);
  gap: 28px;
}
.crx .footer-brand{
  display: grid;
  gap: 14px;
  align-content: start;
  color: var(--paper);
}
.crx .footer-brand p{
  font-size: 14px;
  color: var(--on-ink);
}
.crx .footer-facts{
  display: grid;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--paper);
}
.crx .footer-facts li::before{
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 10px;
  background: var(--orange);
}
.crx .footer nav ul{
  display: grid;
  gap: 10px;
  margin-top: 14px;
}
.crx .footer nav a{
  color: var(--paper);
  text-decoration: none;
}
.crx .footer nav a:hover{
  text-decoration: underline;
  text-underline-offset: 4px;
}
.crx .footer-base{
  margin-top: 44px;
  padding-top: 22px;
  border-top: 1px solid var(--ink-line);
  font-size: 13px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
}
.crx .footer-base p:last-child{
  display: flex;
  gap: 24px;
}
.crx .footer-base a{
  color: var(--on-ink);
  text-decoration: none;
}
.crx .footer-base a:hover{
  color: var(--paper);
}
.crx .band-ink .lede{
  color: var(--on-ink);
}
.crx .band-ink .note{
  color: var(--on-ink);
}
@media (max-width: 900px){.crx .announce{
    font-size: 10px;
  }
.crx .announce a{
    display: none;
  }
.crx .nav-plain,.crx .nav-item{
    display: none;
  }
.crx .mnav{
    display: block;
    position: relative;
    order: 3;
  }
.crx .mnav summary{
    padding: 8px 4px;
    font-weight: 500;
    cursor: pointer;
    list-style: none;
  }
.crx .mnav ul{
    position: absolute;
    right: 0;
    top: 100%;
    min-width: 240px;
    padding: 8px;
    background: var(--white);
    border: 1px solid var(--line);
  }
.crx .mnav a{
    display: block;
    padding: 10px 12px;
    text-decoration: none;
  }
.crx .header{
    flex-wrap: nowrap;
  }
.crx .btn{
    padding: 11px 18px;
  }
.crx .footer-cols{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
.crx .footer-brand{
    grid-column: 1 / -1;
  }
}
@media (prefers-reduced-motion: reduce){.crx .btn,.crx .btn-outline,.crx .nav-menu{
    transition: none;
  }
}

.crx{display:contents;font-family:var(--font-display);font-size:18px;line-height:1.55;color:var(--ink)}
.crx *,.crx *::before,.crx *::after{box-sizing:border-box}
.crx a{color:inherit}
.crx ul,.crx ol,.crx p,.crx dl{margin:0;padding:0;list-style:none}
.crx button{font-family:inherit}
.crx .btn{border-radius:0;border:1px solid transparent}
.crx .btn-ink{background:var(--ink);color:var(--paper)}
.crx .btn-orange{background:var(--orange);color:var(--ink)}
.crx .areabar{display:flex;align-items:center;gap:4px 30px;background:var(--ink);font-family:var(--font-mono);font-size:13px;font-weight:500}
.crx .areabar a{padding:15px 0;color:var(--on-ink);text-decoration:none;border-bottom:3px solid transparent}
.crx .areabar a[aria-current]{color:var(--paper);border-bottom-color:var(--orange)}
.crx .areabar .areabar-order{margin-left:auto;color:var(--orange);border-bottom:0}
.crx .crx-user button i{display:inline-block;width:8px;height:8px;margin-right:10px;border-radius:50%;background:var(--green)}
.crx .nav-item.crx-user>button{padding:11px 16px;background:var(--ink);color:var(--paper)}
.crx .nav-menu{z-index:30}
@media (max-width:900px){.crx .areabar{overflow-x:auto}.crx .areabar-order{display:none}}

/*
 * Crypracks skin for the WHMCS client area (Twenty-One child theme).
 *
 * The shared header, footer, tokens and fonts come from the website build and sit above this
 * file in css/custom.css. This file turns the Bootstrap 4 / Twenty-One components into the
 * same system: paper ground, ink, one orange accent, square corners, mono labels and numbers.
 * Selectors target Twenty-One's markup; verify on a staging WHMCS after any WHMCS upgrade.
 */

/* The website header and footer replace Twenty-One's own. */
header#header,
footer#footer,
#header.header,
.header-lined + .navbar {
  display: none !important;
}

body,
body.primary-bg-color {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-display);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

/* Square everything. */
.btn,
.card,
.form-control,
.custom-select,
.input-group-text,
.alert,
.badge,
.label,
.dropdown-menu,
.modal-content,
.list-group-item,
.nav-tabs .nav-link,
.page-link,
.progress,
.progress-bar,
.tile,
.panel,
.table {
  border-radius: 0 !important;
  box-shadow: none !important;
}

a {
  color: var(--ink);
  text-decoration-color: var(--orange);
  text-underline-offset: 3px;
}

a:hover {
  color: var(--orange-ink);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: -0.04em;
  color: var(--ink);
}

.header-lined {
  margin: 40px 0 24px;
  padding: 0;
  border: 0;
}

.header-lined h1,
.header-lined h2 {
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.05;
  letter-spacing: -0.05em;
}

.header-lined h1 small,
.header-lined h2 small {
  display: block;
  margin-top: 6px;
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}

/* Breadcrumb becomes the mono "Client area / Services" line. */
.master-breadcrumb {
  background: transparent;
  border: 0;
  padding: 28px 0 0;
}

.master-breadcrumb .breadcrumb {
  margin: 0;
  padding: 0;
  background: transparent;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.breadcrumb-item + .breadcrumb-item::before {
  color: var(--mute);
}

#main-body {
  padding-block: 8px 72px;
}

.container {
  max-width: 1280px;
}

/* Cards and panels */
.card {
  background: var(--white);
  border: 1px solid var(--line);
  margin-bottom: 24px;
}

.card-header {
  padding: 16px 22px;
  background: var(--white);
  border-bottom: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}

.card-header .card-title,
.card-title {
  margin: 0;
  font: inherit;
  letter-spacing: inherit;
  color: inherit;
}

.card-body {
  padding: 20px 22px;
}

.card-footer {
  background: var(--paper);
  border-top: 1px solid var(--line);
}

.list-group-item {
  border-color: var(--line);
  background: transparent;
  padding: 12px 22px;
}

.list-group-item.active,
.list-group-item-action.active {
  background: var(--paper);
  border-color: var(--line);
  color: var(--ink);
  font-weight: 500;
  box-shadow: inset 3px 0 0 var(--orange) !important;
}

.list-group-item-action:hover {
  background: var(--paper);
  color: var(--ink);
}

/* Dashboard tiles: the stat bar. */
.tiles .tile,
div.tile {
  background: var(--white);
  border: 1px solid var(--line);
  padding: 22px;
}

.tile .stat {
  font-family: var(--font-mono);
  font-size: 28px;
  font-weight: 500;
  letter-spacing: -0.04em;
  color: var(--ink);
}

.tile .title {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}

.tile .highlight {
  background: var(--orange) !important;
  height: 3px;
}

/* Buttons: same hierarchy as the website. */
.btn {
  padding: 12px 22px;
  border-width: 1px;
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  transition:
    transform 160ms cubic-bezier(0.23, 1, 0.32, 1),
    background-color 160ms cubic-bezier(0.23, 1, 0.32, 1);
}

.btn:active {
  transform: scale(0.97);
}

.btn-primary,
.btn-success,
.btn-order-now,
.btn-checkout,
#order-standard_cart .btn-primary {
  background: var(--orange);
  border-color: var(--orange);
  color: var(--ink);
}

.btn-primary:hover,
.btn-success:hover,
.btn-order-now:hover,
.btn-checkout:hover {
  background: #ff7240;
  border-color: #ff7240;
  color: var(--ink);
}

.btn-default,
.btn-secondary,
.btn-outline-primary,
.btn-light {
  background: transparent;
  border: 1px solid var(--ink);
  color: var(--ink);
}

.btn-default:hover,
.btn-secondary:hover,
.btn-outline-primary:hover,
.btn-light:hover {
  background: var(--ink);
  color: var(--paper);
}

.btn-info,
.btn-dark {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}

.btn-danger {
  background: transparent;
  border: 1px solid var(--ink);
  color: var(--orange-ink);
}

.btn-sm {
  padding: 8px 14px;
  font-family: var(--font-mono);
  font-size: 12px;
}

/* Forms */
label,
.col-form-label {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mute);
}

.form-control,
.custom-select {
  height: auto;
  padding: 13px 14px;
  background: var(--white);
  border: 1px solid var(--ink);
  color: var(--ink);
  font-size: 16px;
}

.form-control:focus,
.custom-select:focus {
  border-color: var(--ink);
  outline: 3px solid var(--orange);
  outline-offset: 2px;
}

.form-control::placeholder {
  color: var(--mute);
}

.input-group-text {
  background: var(--paper);
  border: 1px solid var(--ink);
}

/* Tables: same look as the website plan table. */
.table {
  background: var(--white);
  border: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 13px;
}

.table thead th {
  padding: 13px 20px;
  background: var(--paper);
  border: 0;
  border-bottom: 1px solid var(--line);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}

.table td,
.table tbody th {
  padding: 16px 20px;
  border-color: var(--line);
  vertical-align: middle;
}

.table-hover tbody tr:hover {
  background: var(--paper);
}

.table-striped tbody tr:nth-of-type(odd) {
  background: transparent;
}

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  border: 1px solid var(--ink);
  padding: 8px 12px;
}

.page-link {
  border-color: var(--line);
  color: var(--ink);
}

.page-item.active .page-link {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}

/* Status labels: a dot and a mono word. */
.label,
.badge,
.status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 10px;
  background: var(--white);
  border: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink);
}

.label::before,
.badge::before,
.status::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mute);
}

.status-active::before,
.label-success::before,
.badge-success::before,
.status-paid::before {
  background: var(--green);
}

.status-pending::before,
.status-unpaid::before,
.status-overdue::before,
.label-warning::before,
.label-danger::before,
.badge-warning::before,
.badge-danger::before,
.status-open::before {
  background: var(--orange);
}

.alert {
  border: 1px solid var(--ink);
  background: var(--white);
  color: var(--ink);
}

.alert-danger,
.alert-warning {
  border-left: 4px solid var(--orange);
}

.alert-success,
.alert-info {
  border-left: 4px solid var(--green);
}

/* Dropdowns and modals */
.dropdown-menu {
  border: 1px solid var(--line);
  padding: 8px;
}

.dropdown-item {
  padding: 9px 12px;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background: var(--paper);
  color: var(--ink);
}

.modal-content {
  border: 1px solid var(--ink);
}

.modal-header {
  border-bottom: 1px solid var(--line);
}

/* Login */
.logincontainer {
  max-width: 440px;
  margin: 56px auto;
}

.logincontainer .header-lined {
  text-align: left;
}

.login-form .card,
.logincontainer .card {
  padding: 8px;
}

/* Order form (standard cart): same system as the site's plan table and spec grid. */
body #order-standard_cart {
  color: var(--ink);
}

body #order-standard_cart .cart-body .header-lined h1 {
  font-size: clamp(32px, 4vw, 48px);
}

body #order-standard_cart .cart-sidebar .card,
body #order-standard_cart .products .product,
body #order-standard_cart .view-cart-items,
body #order-standard_cart .domain-checker-container,
body #order-standard_cart .panel-addon,
body #order-standard_cart .product-info,
body #order-standard_cart .view-cart-tabs .tab-content,
body #order-standard_cart .view-cart-tabs .nav-tabs a {
  border-radius: 0;
  background: var(--white);
  border: 1px solid var(--line);
}

/* Sidebar: mono labels, no blue. */
body #order-standard_cart .cart-sidebar .card-header,
body #order-standard_cart .cart-sidebar .card-title {
  background: var(--white);
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body #order-standard_cart .cart-sidebar .list-group-item {
  border-color: var(--line);
  color: var(--ink);
}

body #order-standard_cart .cart-sidebar .list-group-item.active,
body #order-standard_cart .cart-sidebar .list-group-item:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}

/* Product cards. */
body #order-standard_cart .products .product header {
  background: var(--paper);
  color: var(--ink);
  border-bottom: 1px solid var(--line);
  font-weight: 700;
  letter-spacing: -0.02em;
}

body #order-standard_cart .products .product .product-desc,
body #order-standard_cart .product-info {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--mute);
}

body #order-standard_cart .products .product .product-pricing,
body #order-standard_cart .price,
body #order-standard_cart .total-due-today .amt,
body #order-standard_cart .view-cart-items .item-price {
  font-family: var(--font-mono);
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--ink);
}

body #order-standard_cart .products .product .btn-order-now,
body #order-standard_cart .btn-primary,
body #order-standard_cart .btn-success,
body #order-standard_cart .btn-checkout,
body #order-standard_cart .btn-continue {
  background: var(--orange);
  border-color: var(--orange);
  color: var(--ink);
  font-weight: 500;
}

body #order-standard_cart .btn-primary:hover,
body #order-standard_cart .btn-success:hover,
body #order-standard_cart .btn-checkout:hover,
body #order-standard_cart .btn-continue:hover,
body #order-standard_cart .products .product .btn-order-now:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}

body #order-standard_cart .btn-checkout.disabled,
body #order-standard_cart .btn-checkout:disabled {
  background: var(--line);
  border-color: var(--line);
  color: var(--mute);
}

/* Order summary: white panel, ink bar, mono figures. The default text was pale on pale. */
body #order-standard_cart .order-summary {
  background: var(--white);
  border: 1px solid var(--ink);
  border-radius: 0;
}

body #order-standard_cart .order-summary h2 {
  background: var(--ink);
  color: var(--paper);
  padding: 14px 16px;
  text-align: left;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body #order-standard_cart .summary-container {
  background: var(--white);
  color: var(--ink);
  border-radius: 0;
  padding: 18px 16px;
  font-size: 14px;
}

body #order-standard_cart .order-summary .product-name {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ink);
}

body #order-standard_cart .order-summary .product-group {
  font-style: normal;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}

body #order-standard_cart .order-summary .summary-totals,
body #order-standard_cart .order-summary .bordered-totals {
  border-color: var(--line);
}

body #order-standard_cart .order-summary .summary-totals span,
body #order-standard_cart .order-summary .bordered-totals span,
body #order-standard_cart .order-summary .recurring-charges span,
body #order-standard_cart .order-summary .total-due-today span {
  color: var(--ink);
}

body #order-standard_cart .order-summary .total-due-today .amt {
  font-size: 32px;
  color: var(--ink);
}

body #order-standard_cart .order-summary .total-due-today span:last-child,
body #order-standard_cart .order-summary .loader {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}

body #order-standard_cart .order-summary .btn-continue-shopping {
  color: var(--mute);
  text-decoration: underline;
  text-decoration-color: var(--orange);
}

/* Cart table: the website plan-table header, not WHMCS blue. */
body #order-standard_cart .view-cart-items-header {
  background: var(--paper);
  color: var(--mute);
  border-bottom: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body #order-standard_cart .view-cart-items {
  border-bottom: 1px solid var(--ink);
}

body #order-standard_cart .view-cart-items .item {
  border-color: var(--line);
}

body #order-standard_cart .view-cart-tabs .nav-tabs {
  border-bottom: 1px solid var(--line);
}

body #order-standard_cart .view-cart-tabs .nav-tabs a {
  color: var(--mute);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body #order-standard_cart .view-cart-tabs .nav-tabs a[aria-selected='true'],
body #order-standard_cart .view-cart-tabs .nav-tabs a[aria-expanded='true'] {
  background: var(--white);
  color: var(--ink);
  border-bottom-color: var(--white);
}

/* Section headings: "Configure server" and friends, ink with an orange tick instead of blue. */
body #order-standard_cart .sub-heading,
body #order-standard_cart .sub-heading-borderless {
  border-top: 1px solid var(--line);
  background: transparent;
  margin: 28px 0 20px;
}

body #order-standard_cart .sub-heading span,
body #order-standard_cart .sub-heading-borderless span {
  background: var(--paper);
  padding: 0 14px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
}

body #order-standard_cart .sub-heading span::before,
body #order-standard_cart .sub-heading-borderless span::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 10px;
  background: var(--orange);
  vertical-align: middle;
}

/* Fields: same as site inputs, orange focus ring. */
body #order-standard_cart .field,
body #order-standard_cart .form-control,
body #order-standard_cart .custom-select {
  height: 48px;
  background: var(--white);
  border: 1px solid var(--ink);
  border-radius: 0;
  color: var(--ink);
}

body #order-standard_cart .field:focus,
body #order-standard_cart .form-control:focus,
body #order-standard_cart .custom-select:focus {
  border-color: var(--ink);
  outline: 2px solid var(--orange);
  outline-offset: 2px;
}

body #order-standard_cart label,
body #order-standard_cart .field-container label {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mute);
}

body #order-standard_cart .billing-cycle-select,
body #order-standard_cart .panel-addon-selected {
  border-color: var(--ink);
  background: var(--white);
}

/* Help box and alerts. */
body #order-standard_cart .sales-support,
body #order-standard_cart .alert-info {
  background: var(--white);
  border: 1px solid var(--ink);
  border-left: 3px solid var(--orange);
  color: var(--ink);
}

body #order-standard_cart a.btn-link,
body #order-standard_cart .text-primary {
  color: var(--ink) !important;
}

/* Sidebar (categories, actions, currency): quiet mono headers, no heavy caps. */
.sidebar .card-sidebar,
.sidebar .card {
  background: var(--white);
  border: 1px solid var(--line);
}

.sidebar .card-sidebar .card-header,
.sidebar .card .card-header {
  background: var(--white);
  border-bottom: 1px solid var(--line);
  padding: 14px 16px;
}

.sidebar .card-sidebar .card-title,
.sidebar .card .card-title {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
}

.sidebar .list-group-item {
  border-color: var(--line);
  color: var(--ink);
}

.sidebar .list-group-item.active,
.sidebar .list-group-item:hover,
.sidebar .list-group-item:focus {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}

/* Tickets */
.ticket-reply,
.ticket-reply.staff {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 0;
}

.ticket-reply.staff {
  background: var(--ink);
  color: var(--on-ink);
}

.ticket-reply.staff .posted-by,
.ticket-reply.staff .posted-on {
  color: var(--paper);
}

.ticket-reply .posted-on {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--orange);
}

@media (max-width: 900px) {
  #main-body {
    padding-bottom: 48px;
  }

  .table {
    font-size: 12px;
  }
}

/* Cart sidebar panels (WHMCS markup: .panel.card-sidebar > .panel-heading). */
body .panel-sidebar {
  background: var(--white);
  border: 1px solid var(--line);
}

body .panel-sidebar .panel-heading,
body .panel-sidebar .card-header {
  background: var(--white);
  border-bottom: 1px solid var(--line);
  padding: 14px 16px;
}

body .panel-sidebar .panel-title,
body .panel-sidebar .card-title {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
}

body .panel-sidebar .list-group-item {
  border-color: var(--line);
  color: var(--ink);
}

body .panel-sidebar .list-group-item.active,
body .panel-sidebar .list-group-item:hover {
  background: var(--ink);
  border-color: var(--ink);
  color: var(--paper);
}