/* Go Green Domains — candidate Twenty-One child theme, not live-validated.
   EDITOR: colours match the approved staged website. Keep parent templates intact.
   This file styles existing controls; it does not replace authentication or billing. */
@font-face{font-family:'DM Sans';src:url('../fonts/dm-sans.woff2') format('woff2');font-style:normal;font-weight:400 700;font-display:swap}
@font-face{font-family:Sora;src:url('../fonts/sora.woff2') format('woff2');font-style:normal;font-weight:400 700;font-display:swap}
:root{--gg-deep:#082f24;--gg-ink:#112d24;--gg-lime:#caf879;--gg-paper:#fcfdf9;--gg-muted:#59695f;--gg-line:#d8dfd7;--gg-soft:#f1f3ec}
body{background:var(--gg-paper);color:var(--gg-ink);font-family:'DM Sans',Arial,sans-serif;font-size:16px;line-height:1.6}
h1,h2,h3,h4,.card-title{font-family:Sora,Arial,sans-serif;font-weight:500;letter-spacing:-.035em;line-height:1.25}
h1{font-size:clamp(1.9rem,4vw,3.2rem)}
a{color:#23663f}a:hover{color:var(--gg-deep)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #267b42;outline-offset:3px}
/* Shared header: the real logo is configured through WHMCS General Settings. */
header.header,#header{background:var(--gg-paper);border-bottom:1px solid var(--gg-line)}
header.header .logo img,#header .logo img{width:190px;max-width:100%;height:auto}
.navbar-main{background:var(--gg-deep);border:0}
.navbar-main .navbar-nav>.nav-item>.nav-link{color:#f1f3ec;min-height:44px;display:flex;align-items:center}
.navbar-main .navbar-nav>.nav-item>.nav-link:hover{color:var(--gg-lime)}
.dropdown-menu{background:var(--gg-paper);border:1px solid var(--gg-line);border-radius:6px;box-shadow:0 15px 40px #082f241a}
.dropdown-item{color:var(--gg-ink);padding:.7rem 1rem}.dropdown-item:hover,.dropdown-item:focus{background:var(--gg-soft);color:var(--gg-deep)}
.master-breadcrumb{background:var(--gg-soft)}.breadcrumb{background:transparent}
/* Leave functional state colours (errors, warnings, paid/unpaid) distinct. */
.btn{border-radius:4px;font-weight:600;padding:.7rem 1.15rem;min-height:44px;white-space:normal}
.btn-primary{background:var(--gg-deep);border-color:var(--gg-deep);color:white}
.btn-primary:hover,.btn-primary:focus{background:#154c38;border-color:#154c38;color:white}
.btn-default,.btn-outline-primary{border:1px solid var(--gg-deep);color:var(--gg-deep);background:transparent}
.btn-default:hover,.btn-outline-primary:hover{background:var(--gg-soft);color:var(--gg-deep)}
.btn-link{background:transparent}.btn:disabled{opacity:.55}
.form-control,.custom-select{border:1px solid #aab9ac;border-radius:4px;background:white;color:var(--gg-ink);min-height:46px;font:inherit}
.form-control:focus,.custom-select:focus{border-color:#267b42;box-shadow:0 0 0 3px #267b421a}
textarea.form-control{min-height:130px}label{font-weight:600}
.card{border:1px solid var(--gg-line);border-radius:8px;background:white;box-shadow:0 8px 24px #082f2406;overflow:visible}
.card-header{background:var(--gg-soft);border-bottom:1px solid var(--gg-line);color:var(--gg-ink);padding:1rem 1.25rem}
.card-body{padding:1.4rem}.card-footer{background:var(--gg-paper);border-top:1px solid var(--gg-line)}
.list-group-item{border-color:var(--gg-line);padding:.85rem 1.2rem}.list-group-item.active{background:var(--gg-deep);border-color:var(--gg-deep);color:white}
.tiles .tile{border:1px solid var(--gg-line);border-radius:6px;background:var(--gg-soft);box-shadow:0 5px 0 #dce5d8;color:var(--gg-ink)}
.tiles .tile .stat{color:var(--gg-deep);font-family:Sora,Arial,sans-serif}.tiles .tile .icon{color:#267b42}
.table{color:var(--gg-ink)}.table thead th{background:var(--gg-soft);border-color:var(--gg-line);font-weight:600}.table td{border-color:var(--gg-line);vertical-align:middle}
.page-item.active .page-link{background:var(--gg-deep);border-color:var(--gg-deep)}.page-link{color:var(--gg-deep)}
.login-form{max-width:500px}.login-form .card{box-shadow:0 18px 50px #082f2410}
footer.footer,#footer{background:var(--gg-deep);color:#c4d6cc;border-top:0}footer.footer a,#footer a{color:#eef6e8}
/* Order-form styling is deliberately pending the installed order-form name/version. */
@media(max-width:767px){body{font-size:16px}.card-body{padding:1rem}.btn{max-width:100%}header.header .logo img,#header .logo img{width:166px}.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}.form-control{font-size:16px}.navbar-main .nav-link{min-height:46px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media print{body{background:white;color:black}footer.footer,#footer{background:white;color:black}.card{box-shadow:none}}

/* ---------------------------------------------------------------
   Go Green client portal layer
   EDITOR: this section styles Twenty-One's native dashboard and
   billing components. It does not replace their Smarty templates.
   --------------------------------------------------------------- */
:root{
 --gg-radius:8px;
 --gg-radius-lg:14px;
 --gg-shadow:0 18px 45px rgba(8,47,36,.09);
 --gg-shadow-soft:0 7px 22px rgba(8,47,36,.06);
}
body{background:linear-gradient(180deg,#fcfdf9 0,#f5f7f0 100%);min-height:100vh}
#main-body,.main-content,.container-fluid{position:relative}
#main-body:before{content:"";display:block;position:absolute;inset:0 0 auto;height:250px;background:radial-gradient(circle at 82% 0,rgba(202,248,121,.25),transparent 48%),linear-gradient(180deg,#eef5e9,transparent);pointer-events:none;z-index:-1}
.container{max-width:1240px}
.header,.navbar,.navbar-main{box-shadow:0 6px 22px rgba(8,47,36,.05)}
.header{position:relative;z-index:10}
.navbar-main{background:var(--gg-deep);border-radius:0 0 var(--gg-radius) var(--gg-radius)}
.navbar-main .navbar-nav>.nav-item>.nav-link{font-size:.9rem;font-weight:600;letter-spacing:.01em;padding-inline:1rem}
.navbar-main .navbar-nav>.nav-item.active>.nav-link,.navbar-main .navbar-nav>.nav-item>.nav-link:hover{background:rgba(202,248,121,.12);color:var(--gg-lime)}
.master-breadcrumb{border:0;background:transparent;padding-top:1.25rem}.breadcrumb{font-size:.82rem;color:var(--gg-muted)}
.breadcrumb a{color:var(--gg-green,var(--gg-deep));font-weight:600}
.page-header h1,.page-header .title,.client-home-title{font-family:Sora,Arial,sans-serif;color:var(--gg-deep);letter-spacing:-.05em}
.page-header{padding-block:1.35rem 1.1rem}
.page-header p{color:var(--gg-muted)}
.card,.panel,.client-home-cards .card{border-radius:var(--gg-radius-lg);box-shadow:var(--gg-shadow-soft);border-color:var(--gg-line)}
.card-header,.panel-heading{font-family:Sora,Arial,sans-serif;font-size:1rem;letter-spacing:-.02em;border-radius:var(--gg-radius-lg) var(--gg-radius-lg) 0 0}
.card-header h3,.card-header h4,.panel-title{font-size:1rem;margin:0}
.card-body{background:rgba(255,255,255,.84)}
.tiles{margin-bottom:2.25rem}.tiles .row{margin-inline:-.55rem}
.tiles [class*=col-]{padding:.55rem}.tiles .tile{position:relative;min-height:154px;border:1px solid rgba(216,223,215,.9);border-radius:var(--gg-radius-lg);background:rgba(255,255,255,.92);box-shadow:var(--gg-shadow-soft);padding:1.3rem 1.35rem;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;overflow:hidden}
.tiles .tile:after{content:"";position:absolute;right:-30px;bottom:-38px;width:112px;height:112px;border-radius:50%;background:rgba(202,248,121,.18);pointer-events:none}
.tiles .tile:hover{transform:translateY(-3px);border-color:#b4ccae;box-shadow:var(--gg-shadow)}
.tiles .tile .icon,.tiles .tile>i{position:relative;color:var(--gg-green);font-size:1.35rem;margin-bottom:1.3rem;z-index:1}
.tiles .tile .stat{position:relative;font-size:2rem;line-height:1.1;z-index:1}.tiles .tile .title{position:relative;color:var(--gg-muted);font-size:.88rem;font-weight:600;z-index:1}
.tiles .tile .highlight{height:4px!important;left:1.35rem!important;right:auto!important;width:44px!important;bottom:1.05rem!important;border-radius:99px;background:var(--gg-lime)!important}
.tiles .tile .highlight.bg-color-red{background:#e98c76!important}.tiles .tile .highlight.bg-color-gold{background:#e7bc51!important}
.client-home-cards{gap:1.15rem}.client-home-cards .card{background:rgba(255,255,255,.88)}
.client-home-cards .card-title{font-size:1.12rem;color:var(--gg-deep)}
.client-home-cards a:not(.btn){font-weight:600;color:var(--gg-green)}
.list-group-item{background:transparent}.list-group-item:hover{background:var(--gg-soft)}
.table-responsive{border-radius:var(--gg-radius);box-shadow:var(--gg-shadow-soft)}
.table{margin-bottom:0;background:rgba(255,255,255,.9)}.table thead th{font-family:Sora,Arial,sans-serif;font-size:.78rem;letter-spacing:.03em;text-transform:none;color:var(--gg-deep);padding:1rem .85rem}.table td{padding:.9rem .85rem}
.status,.label,.badge{border-radius:999px;font-weight:700;letter-spacing:.01em;padding:.35em .7em}.label-success,.badge-success{background:#dff4c5;color:#24572e}.label-danger,.badge-danger{background:#fbe0d9;color:#8b2e25}.label-warning,.badge-warning{background:#fff0bd;color:#76540c}.label-info,.badge-info{background:#d9eef1;color:#155563}
.alert{border:1px solid transparent;border-radius:var(--gg-radius);box-shadow:none}.alert-success{background:#eaf7dc;border-color:#cce7a9;color:#24572e}.alert-danger{background:#fff0ec;border-color:#f0c3b8;color:#7c2c25}.alert-warning{background:#fff8df;border-color:#ead68c;color:#73530a}.alert-info{background:#eaf5f4;border-color:#c6e1df;color:#225b5a}
.btn{box-shadow:none;transition:transform .15s ease,background .15s ease,box-shadow .15s ease}.btn:hover{transform:translateY(-1px);box-shadow:0 6px 15px rgba(8,47,36,.12)}.btn-primary{background:var(--gg-deep);border-color:var(--gg-deep)}.btn-success{background:#267b42;border-color:#267b42;color:white}.btn-success:hover{background:#1b6032;border-color:#1b6032;color:white}.btn-outline-primary{border-color:#267b42;color:#267b42}.btn-outline-primary:hover{background:#edf7e5;color:var(--gg-deep);border-color:#267b42}
.form-group{margin-bottom:1.2rem}.form-control,.custom-select{box-shadow:none}.form-control::placeholder{color:#84948b}.input-group .btn{min-height:46px}
.login-container,.login-form{max-width:510px}.login-form{margin-inline:auto}.login-form .card{border-top:5px solid var(--gg-lime);box-shadow:var(--gg-shadow)}.login-form .card-header{background:var(--gg-deep);color:#f6f8ee}.login-form .card-body{padding:2rem}.login-form .btn-primary{width:100%}
.modal-content{border:0;border-radius:var(--gg-radius-lg);box-shadow:var(--gg-shadow)}.modal-header{background:var(--gg-deep);color:white;border-radius:var(--gg-radius-lg) var(--gg-radius-lg) 0 0}.close{color:inherit;opacity:.85}
.pagination .page-link{border-color:var(--gg-line);background:white}.pagination .page-item.active .page-link{background:var(--gg-deep)}
footer.footer,#footer{margin-top:4rem;padding-block:2.8rem 1.5rem}footer.footer .container,#footer .container{max-width:1240px}footer.footer small,#footer small{color:#b9cbc0}
/* Existing customer shortcut: reinforces the service-first portal without inventing data. */
.gg-portal-note{display:flex;gap:1rem;align-items:center;margin:0 0 1.7rem;padding:1.1rem 1.25rem;border:1px solid #d3e6c0;border-radius:var(--gg-radius);background:linear-gradient(100deg,#f2f9e9,#fff);color:var(--gg-ink)}
.gg-portal-note strong{font-family:Sora,Arial,sans-serif;font-size:1rem}.gg-portal-note a{margin-left:auto;white-space:nowrap}
@media(max-width:767px){#main-body:before{height:180px}.page-header{padding-block:.9rem}.tiles .tile{min-height:132px;padding:1rem}.tiles .tile .stat{font-size:1.65rem}.tiles .tile .highlight{left:1rem!important;bottom:.8rem!important}.client-home-cards{display:block}.client-home-cards .card{margin-bottom:1rem}.table{min-width:650px}.table-responsive{box-shadow:none}.gg-portal-note{display:block}.gg-portal-note a{display:inline-flex;margin:1rem 0 0}.navbar-main .navbar-nav>.nav-item>.nav-link{padding-block:.75rem}}
/* Keep the Twenty-One header controls on one row at narrow widths. */
#header .navbar.navbar-light > .container {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: .35rem;
}

#header .navbar-brand {
  flex: 0 1 auto;
  min-width: 0;
  margin-right: .35rem !important;
}

#header .navbar-brand .logo-img {
  display: block;
  width: 190px;
  max-width: 100%;
  height: auto;
}

#header .navbar.navbar-light > .container > form.form-inline {
  flex: 1 1 auto;
  min-width: 0;
}

#header .navbar-light .toolbar {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  align-items: center;
  margin-left: auto;
}

#header .navbar-light .toolbar .nav-item {
  flex: 0 0 auto;
  margin-left: .35rem !important;
}

#header .navbar-light .toolbar .nav-link {
  white-space: nowrap;
}

@media (max-width: 575px) {
  #header .navbar-brand .logo-img {
    width: auto;
    max-width: calc(100vw - 126px);
  }

  #header .navbar-light .toolbar .nav-item {
    margin-left: .1rem !important;
  }

  #header .navbar-light .toolbar .nav-link {
    padding-inline: .4rem;
  }
}

/* Slightly stronger structural outlines for portal surfaces. */
:root{--gg-line:#c4d0c6}

/* Client portal header: keep only brand and menu controls. */
#header .navbar-light .toolbar .nav-item:first-child{display:none}
#header .navbar-light .toolbar{margin-left:auto}

/* Stronger hamburger control contrast. */
#header .navbar-light .toolbar .nav-link{color:var(--gg-deep);border:1px solid #aebdb1;background:#fff;opacity:1}
#header .navbar-light .toolbar .nav-link:hover,#header .navbar-light .toolbar .nav-link:focus{color:var(--gg-deep);border-color:#267b42;background:var(--gg-soft)}
#header .navbar-light .toolbar .nav-link .fa-bars{color:var(--gg-deep);opacity:1}