/* CONNECT Central do Cliente — V2.3.1 FINAL
   Refinamento visual da area logada: densidade, hierarquia, responsividade,
   header/footer unificados e sem alteracao de fluxo funcional do WHMCS. */

body.connect-theme{
  --connect-v231-navy:#020817;
  --connect-v231-blue:#0b74ff;
  --connect-v231-text:#102a4a;
  --connect-v231-muted:#64788f;
  --connect-v231-border:#dce6f2;
  --connect-v231-shadow:0 10px 28px rgba(7,47,89,.065);
  overflow-x:hidden;
}
body.connect-theme:not(.template-login) .connect-brand-row{min-height:118px!important;padding:5px 0!important}
body.connect-theme:not(.template-login) .connect-brand-container{min-height:104px!important}
body.connect-theme:not(.template-login) .connect-brand-logo,
body.connect-theme:not(.template-login) .connect-logo-header{width:300px!important;max-width:min(300px,38vw)!important;height:auto!important;transform:none!important}
body.connect-theme:not(.template-login) .connect-native-nav{min-height:54px!important}
body.connect-theme .connect-account-bar-inner{min-height:38px}
body.connect-theme .connect-account-user,
body.connect-theme .connect-account-notices .btn{font-size:12px}
body.connect-theme.template-homepage .connect-client-home.is-logged-in{padding-top:0}
body.connect-theme.template-homepage .connect-home-intro{padding-top:24px!important;padding-bottom:4px!important}
body.connect-theme.template-homepage .connect-home-intro h1{font-size:clamp(25px,2.5vw,31px)!important}
body.connect-theme.template-homepage .connect-home-intro p{margin-top:6px!important;font-size:13.5px!important}
body.connect-theme.template-homepage .connect-home-intro>.btn{min-height:42px!important;padding:9px 15px!important;font-size:12.5px!important}
body.connect-theme.template-homepage .connect-client-alerts{margin-top:22px!important}
body.connect-theme.template-homepage .connect-client-alerts-head{margin-bottom:10px!important;gap:4px 10px!important}
body.connect-theme.template-homepage .connect-client-alerts-head>span{font-size:10px!important;letter-spacing:.12em!important}
body.connect-theme.template-homepage .connect-client-alerts-head>strong{font-size:14px!important}
body.connect-theme.template-homepage .connect-client-alerts-list{gap:8px!important}
body.connect-theme.template-homepage .connect-client-alert{grid-template-columns:38px minmax(0,1fr) auto!important;gap:13px!important;min-height:66px!important;padding:11px 15px!important;border-radius:13px!important;box-shadow:0 5px 16px rgba(9,36,75,.04)!important}
body.connect-theme.template-homepage .connect-client-alert>i:first-child{width:36px!important;height:36px!important;border-radius:10px!important;font-size:15px!important}
body.connect-theme.template-homepage .connect-client-alert>.connect-alert-content{gap:2px!important;font-size:13px!important;line-height:1.38!important}
body.connect-theme.template-homepage .connect-alert-content>strong{font-size:11.5px!important}
body.connect-theme.template-homepage .connect-client-alert>.connect-alert-action{min-height:32px;padding:6px 9px;border-radius:9px;background:rgba(11,116,255,.06);font-size:11.5px!important}
body.connect-theme.template-homepage .connect-client-alert-warning>.connect-alert-action{background:rgba(214,148,37,.08)}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-section{padding-top:24px!important;padding-bottom:26px!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-section-head{margin-bottom:16px!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-section-head>span{font-size:10px!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-section-head h2{margin-top:5px!important;margin-bottom:5px!important;font-size:clamp(22px,2.3vw,28px)!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-section-head p{font-size:13px!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-actions-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:11px!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-action{min-height:76px!important;gap:11px!important;padding:12px 14px!important;border-radius:13px!important;border-color:var(--connect-v231-border)!important;box-shadow:0 6px 18px rgba(7,47,89,.045)!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-action>i{width:38px!important;height:38px!important;border-radius:10px!important;font-size:17px!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-action strong{font-size:14px!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-action small{margin-top:2px!important;font-size:11.5px!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-action:hover{transform:translateY(-2px);border-color:#a8cdf8!important;box-shadow:0 11px 26px rgba(8,76,158,.08)!important}
body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-section+.connect-domain-quick{margin-top:10px!important;margin-bottom:34px!important}
body.connect-theme.template-homepage .connect-domain-quick{padding:20px 22px!important;gap:18px!important;border-radius:14px!important;box-shadow:0 13px 34px rgba(7,26,54,.085)!important}
body.connect-theme.template-homepage .connect-domain-quick-copy h2{font-size:18px!important;line-height:1.3!important}
body.connect-theme.template-homepage .connect-domain-quick-form input,
body.connect-theme.template-homepage .connect-domain-quick-form .btn{min-height:48px!important;height:48px!important}
body.connect-theme .connect-footer{padding-top:38px!important}
body.connect-theme .connect-footer-top{grid-template-columns:1.35fr .75fr .75fr 1fr!important;gap:28px!important;padding-bottom:28px!important}
body.connect-theme .connect-footer .connect-footer-logo,
body.connect-theme .connect-footer .connect-logo-footer{width:300px!important;max-width:100%!important;height:auto!important;margin:0 0 10px!important}
body.connect-theme .connect-footer-brand p{max-width:350px!important;margin-bottom:9px!important;line-height:1.55!important}
body.connect-theme .connect-footer .connect-footer-legal{margin:9px 0!important;font-size:12px!important;line-height:1.45!important}
body.connect-theme .connect-footer h4{margin-bottom:11px!important}
body.connect-theme .connect-footer li{margin:6px 0!important}
body.connect-theme .connect-footer-bottom{min-height:54px!important}
body.connect-theme .connect-footer-contact a[href^="mailto:"]{word-break:normal!important;overflow-wrap:anywhere!important}
body.connect-theme.template-homepage .connect-whatsapp-float{width:52px!important;min-width:52px!important;height:52px!important;min-height:52px!important;right:16px!important;bottom:16px!important;box-shadow:0 10px 24px rgba(0,0,0,.18)!important}

@media(max-width:1199.98px){
  body.connect-theme:not(.template-login) .connect-brand-row{min-height:102px!important}
  body.connect-theme:not(.template-login) .connect-brand-container{min-height:90px!important}
  body.connect-theme:not(.template-login) .connect-brand-logo,
  body.connect-theme:not(.template-login) .connect-logo-header{width:265px!important;max-width:min(265px,42vw)!important}
  body.connect-theme .connect-footer-top{grid-template-columns:1.2fr 1fr 1fr!important}
  body.connect-theme .connect-footer-contact{grid-column:1/-1}
}
@media(max-width:991.98px){
  body.connect-theme:not(.template-login) .connect-brand-row{min-height:88px!important}
  body.connect-theme:not(.template-login) .connect-brand-container{min-height:76px!important}
  body.connect-theme:not(.template-login) .connect-brand-logo,
  body.connect-theme:not(.template-login) .connect-logo-header{width:235px!important;max-width:min(235px,48vw)!important}
  body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-actions-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.connect-theme .connect-footer .connect-footer-logo,
  body.connect-theme .connect-footer .connect-logo-footer{width:235px!important}
}
@media(max-width:767.98px){
  body.connect-theme:not(.template-login) .connect-brand-row{min-height:76px!important;padding:4px 0!important}
  body.connect-theme:not(.template-login) .connect-brand-container{min-height:66px!important}
  body.connect-theme:not(.template-login) .connect-brand-logo,
  body.connect-theme:not(.template-login) .connect-logo-header{width:205px!important;max-width:min(205px,58vw)!important}
  body.connect-theme.template-homepage .connect-home-intro{padding-top:20px!important}
  body.connect-theme.template-homepage .connect-home-intro>.btn{width:100%}
  body.connect-theme.template-homepage .connect-client-alert{grid-template-columns:36px minmax(0,1fr)!important;padding:11px 12px!important}
  body.connect-theme.template-homepage .connect-client-alert>.connect-alert-action{grid-column:2;margin-top:2px;width:max-content;max-width:100%}
  body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-actions-grid{grid-template-columns:1fr!important;gap:9px!important}
  body.connect-theme.template-homepage .connect-client-home.is-logged-in .connect-client-action{min-height:70px!important}
  body.connect-theme.template-homepage .connect-domain-quick{padding:17px!important}
  body.connect-theme .connect-footer{padding-top:32px!important}
  body.connect-theme .connect-footer-top{grid-template-columns:1fr 1fr!important;gap:23px 20px!important}
  body.connect-theme .connect-footer-brand,
  body.connect-theme .connect-footer-contact{grid-column:1/-1!important}
  body.connect-theme .connect-footer .connect-footer-logo,
  body.connect-theme .connect-footer .connect-logo-footer{width:205px!important}
}
@media(max-width:479.98px){
  body.connect-theme:not(.template-login) .connect-brand-logo,
  body.connect-theme:not(.template-login) .connect-logo-header{width:185px!important;max-width:56vw!important}
  body.connect-theme .connect-footer-top{grid-template-columns:1fr!important}
  body.connect-theme .connect-footer-brand,
  body.connect-theme .connect-footer-contact{grid-column:auto!important}
  body.connect-theme .connect-footer .connect-footer-logo,
  body.connect-theme .connect-footer .connect-logo-footer{width:185px!important}
}
@media(prefers-reduced-motion:reduce){
  body.connect-theme .connect-client-action,
  body.connect-theme .connect-client-alert{transition:none!important}
}


/* =========================================================
   V2.3.1 — HOTFIX ÁREA DO CLIENTE
   2026-09-28
   1) alinhamento real dos ícones nos tiles
   2) espaçamento equilibrado no resumo do produto
   ========================================================= */

/* Visão geral: mantém o ícone grande, corrige somente a grade/posição. */
body.connect-theme.template-clientareahome .tiles .tile{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 68px!important;
  grid-template-rows:auto auto!important;
  column-gap:14px!important;
  row-gap:3px!important;
  align-content:center!important;
  align-items:center!important;
  min-height:100px!important;
  padding:15px 16px!important;
}
body.connect-theme.template-clientareahome .tiles .tile>i{
  grid-column:2!important;
  grid-row:1 / 3!important;
  align-self:center!important;
  justify-self:center!important;
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  min-height:58px!important;
  margin:0!important;
  display:grid!important;
  place-items:center!important;
  border-radius:16px!important;
  font-size:30px!important;
  line-height:1!important;
  transform:none!important;
}
body.connect-theme.template-clientareahome .tiles .tile .stat{
  grid-column:1!important;
  grid-row:1!important;
  align-self:end!important;
  justify-self:start!important;
  margin:0!important;
  font-size:27px!important;
  line-height:1!important;
  text-align:left!important;
}
body.connect-theme.template-clientareahome .tiles .tile .title{
  grid-column:1!important;
  grid-row:2!important;
  align-self:start!important;
  justify-self:start!important;
  margin:2px 0 0!important;
  font-size:11.5px!important;
  line-height:1.25!important;
  text-align:left!important;
}
body.connect-theme.template-clientareahome .tiles .tile .highlight{
  grid-column:1 / -1!important;
}

/* Detalhes do produto: remove o vazio excessivo e melhora a hierarquia. */
body.connect-theme.template-clientareaproductdetails .primary-content>.tab-content{
  margin-bottom:18px!important;
}
body.connect-theme.template-clientareaproductdetails .tab-pane#tabOverview>.card{
  margin-bottom:20px!important;
  border-radius:16px!important;
  overflow:hidden;
}
body.connect-theme.template-clientareaproductdetails .tab-pane#tabOverview>.card>.card-body{
  padding:18px!important;
}
body.connect-theme.template-clientareaproductdetails .product-details>.row{
  display:grid!important;
  grid-template-columns:minmax(260px,.92fr) minmax(330px,1.08fr)!important;
  gap:22px!important;
  align-items:start!important;
  margin:0!important;
}
body.connect-theme.template-clientareaproductdetails .product-details>.row>[class*="col-md-"]{
  width:auto!important;
  max-width:none!important;
  flex:none!important;
  padding:0!important;
}
body.connect-theme.template-clientareaproductdetails .product-status{
  margin:0!important;
  padding:20px!important;
  border-radius:14px!important;
}
body.connect-theme.template-clientareaproductdetails .product-status .product-icon{
  transform:none!important;
  transform-origin:center!important;
}
body.connect-theme.template-clientareaproductdetails .product-status h3{
  margin-top:10px!important;
  margin-bottom:5px!important;
  font-size:20px!important;
  line-height:1.18!important;
}
body.connect-theme.template-clientareaproductdetails .product-status h4{
  margin:0!important;
  font-size:15px!important;
  line-height:1.3!important;
}
body.connect-theme.template-clientareaproductdetails .product-details>.row>.text-center{
  padding:4px 14px!important;
  color:#536980!important;
  font-size:13.5px!important;
  line-height:1.32!important;
}
body.connect-theme.template-clientareaproductdetails .product-details>.row>.text-center h4{
  margin:10px 0 2px!important;
  color:#173653!important;
  font-size:15.5px!important;
  font-weight:850!important;
  line-height:1.18!important;
}
body.connect-theme.template-clientareaproductdetails .product-details>.row>.text-center h4:first-child{
  margin-top:0!important;
}
body.connect-theme.template-clientareaproductdetails .product-actions-wrapper{
  margin-top:12px!important;
}

/* Tablet */
@media(max-width:991.98px){
  body.connect-theme.template-clientareahome .tiles .tile{
    grid-template-columns:minmax(0,1fr) 64px!important;
  }
  body.connect-theme.template-clientareahome .tiles .tile>i{
    width:56px!important;
    height:56px!important;
    min-width:56px!important;
    min-height:56px!important;
    font-size:29px!important;
  }
  body.connect-theme.template-clientareaproductdetails .product-details>.row{
    grid-template-columns:minmax(230px,.9fr) minmax(280px,1.1fr)!important;
    gap:18px!important;
  }
}

/* Mobile */
@media(max-width:767.98px){
  body.connect-theme.template-clientareahome .tiles .tile{
    grid-template-columns:minmax(0,1fr) 62px!important;
    min-height:92px!important;
    padding:13px 14px!important;
  }
  body.connect-theme.template-clientareahome .tiles .tile>i{
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
    min-height:54px!important;
    font-size:28px!important;
  }
  body.connect-theme.template-clientareahome .tiles .tile .stat{
    font-size:25px!important;
  }
  body.connect-theme.template-clientareahome .tiles .tile .title{
    font-size:11px!important;
  }
  body.connect-theme.template-clientareaproductdetails .product-details>.row{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }
  body.connect-theme.template-clientareaproductdetails .product-details>.row>.text-center{
    padding:2px 4px 4px!important;
  }
}


/* V2.3.1 — HOTFIX 3
   Status do produto: elimina a faixa visual vazia causada pelo texto branco
   do WHMCS sobre o fundo claro customizado. */
body.connect-theme.template-clientareaproductdetails .product-status-text{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  min-width:70px!important;
  min-height:28px!important;
  margin:10px auto 0!important;
  padding:5px 12px!important;
  border:1px solid #cfe5da!important;
  border-radius:999px!important;
  background:#e9f8ef!important;
  color:#167a4c!important;
  font-size:11px!important;
  font-weight:850!important;
  line-height:1!important;
  letter-spacing:.035em!important;
  text-transform:uppercase!important;
}
body.connect-theme.template-clientareaproductdetails .product-status-active .product-status-text{
  border-color:#c8ecd7!important;
  background:#e9f8ef!important;
  color:#157b4b!important;
}
body.connect-theme.template-clientareaproductdetails .product-status-pending .product-status-text{
  border-color:#f0ddb1!important;
  background:#fff6df!important;
  color:#91600d!important;
}
body.connect-theme.template-clientareaproductdetails .product-status-suspended .product-status-text{
  border-color:#cbdff5!important;
  background:#eaf4ff!important;
  color:#1260a8!important;
}
body.connect-theme.template-clientareaproductdetails .product-status-terminated .product-status-text,
body.connect-theme.template-clientareaproductdetails .product-status-cancelled .product-status-text{
  border-color:#d9dee5!important;
  background:#f1f3f6!important;
  color:#596575!important;
}
body.connect-theme.template-clientareaproductdetails .product-status-fraud .product-status-text{
  border-color:#d8dce2!important;
  background:#eceff3!important;
  color:#28303b!important;
}



/* =========================================================
   V2.3.1 — HOTFIX 4
   Ajuste fino:
   1) ícones da home um pouco maiores, sem alterar o alinhamento
   2) card superior dos detalhes do produto mais equilibrado
   ========================================================= */

/* HOME — mais presença para os ícones, preservando a grade corrigida. */
body.connect-theme.template-clientareahome .tiles .tile{
  grid-template-columns:minmax(0,1fr) 72px!important;
  column-gap:15px!important;
  min-height:102px!important;
}
body.connect-theme.template-clientareahome .tiles .tile>i{
  width:62px!important;
  height:62px!important;
  min-width:62px!important;
  min-height:62px!important;
  font-size:32px!important;
  border-radius:17px!important;
}
body.connect-theme.template-clientareahome .tiles .tile .stat{
  font-size:28px!important;
}
body.connect-theme.template-clientareahome .tiles .tile .title{
  font-size:11.8px!important;
  line-height:1.28!important;
}

/* DETALHES DO PRODUTO — ajuste fino do bloco superior. */
body.connect-theme.template-clientareaproductdetails .tab-pane#tabOverview>.card{
  border-radius:18px!important;
}
body.connect-theme.template-clientareaproductdetails .tab-pane#tabOverview>.card>.card-body{
  padding:20px 20px 18px!important;
}
body.connect-theme.template-clientareaproductdetails .product-details>.row{
  grid-template-columns:minmax(300px,370px) minmax(320px,1fr)!important;
  gap:26px!important;
  align-items:center!important;
}
body.connect-theme.template-clientareaproductdetails .product-status{
  padding:18px 18px 14px!important;
  border-radius:16px!important;
}
body.connect-theme.template-clientareaproductdetails .product-status .product-icon{
  max-width:310px!important;
  margin:0 auto!important;
  padding:24px 22px!important;
  border-radius:14px!important;
}
body.connect-theme.template-clientareaproductdetails .product-status h3{
  margin-top:12px!important;
  margin-bottom:4px!important;
  font-size:19px!important;
  line-height:1.18!important;
}
body.connect-theme.template-clientareaproductdetails .product-status h4{
  font-size:14.5px!important;
  line-height:1.25!important;
}
body.connect-theme.template-clientareaproductdetails .product-status-text{
  margin-top:8px!important;
}
body.connect-theme.template-clientareaproductdetails .product-details>.row>.text-center{
  padding:4px 8px!important;
  font-size:13.5px!important;
  line-height:1.3!important;
}
body.connect-theme.template-clientareaproductdetails .product-details>.row>.text-center h4{
  margin:8px 0 2px!important;
  font-size:15.5px!important;
  line-height:1.16!important;
}
body.connect-theme.template-clientareaproductdetails .product-details>.row>.text-center h4:first-child{
  margin-top:0!important;
}

@media(max-width:991.98px){
  body.connect-theme.template-clientareahome .tiles .tile{
    grid-template-columns:minmax(0,1fr) 68px!important;
  }
  body.connect-theme.template-clientareahome .tiles .tile>i{
    width:58px!important;
    height:58px!important;
    min-width:58px!important;
    min-height:58px!important;
    font-size:30px!important;
  }
  body.connect-theme.template-clientareaproductdetails .product-details>.row{
    grid-template-columns:minmax(260px,340px) minmax(280px,1fr)!important;
    gap:20px!important;
  }
  body.connect-theme.template-clientareaproductdetails .product-status .product-icon{
    max-width:290px!important;
  }
}
@media(max-width:767.98px){
  body.connect-theme.template-clientareahome .tiles .tile{
    grid-template-columns:minmax(0,1fr) 64px!important;
  }
  body.connect-theme.template-clientareahome .tiles .tile>i{
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
    min-height:54px!important;
    font-size:28px!important;
  }
  body.connect-theme.template-clientareaproductdetails .tab-pane#tabOverview>.card>.card-body{
    padding:16px!important;
  }
  body.connect-theme.template-clientareaproductdetails .product-details>.row{
    grid-template-columns:1fr!important;
    gap:16px!important;
    align-items:start!important;
  }
  body.connect-theme.template-clientareaproductdetails .product-status .product-icon{
    max-width:100%!important;
  }
}