/* ============================================================
   PROFINANCE HUB V54.85 — CLIENTES COMPACTOS (SELETORES REAIS)
   Carregado depois do legado v53-69-clientes-legibilidade.css
   ============================================================ */

#clientList.client-list{
  gap:8px!important;
}

/* CARD REAL: .client */
#clientList .client{
  grid-template-columns:42px minmax(245px,1.35fr) minmax(115px,.48fr) minmax(150px,.62fr) minmax(390px,1.16fr)!important;
  gap:9px!important;
  padding:9px 11px 9px 14px!important;
  min-height:0!important;
  border-radius:13px!important;
  box-shadow:0 8px 22px rgba(10,7,30,.12)!important;
}
#clientList .client:before{width:4px!important}

#clientList .client .avatar{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  border-radius:10px!important;
  font-size:12px!important;
}
#clientList .client .avatar img{
  width:100%!important;
  height:100%!important;
  padding:2px!important;
  object-fit:contain!important;
}

#clientList .client h3{
  font-size:13.5px!important;
  line-height:1.15!important;
  margin:0 0 3px!important;
}
#clientList .client p{
  font-size:9px!important;
  line-height:1.25!important;
  margin:2px 0!important;
}
#clientList .client .mono{
  font-size:8px!important;
  line-height:1.2!important;
}
#clientList .client .customer-alert{
  font-size:8.5px!important;
  line-height:1.2!important;
  margin-top:4px!important;
  gap:5px!important;
}
#clientList .client .customer-alert i{
  width:6px!important;
  height:6px!important;
}
#clientList .client>div>strong{
  font-size:10.5px!important;
  line-height:1.15!important;
}

/* Status compactos */
#clientList .client .chip,
#clientList .client .onboarding-status{
  font-size:7.5px!important;
  line-height:1!important;
  padding:4px 6px!important;
  margin-top:3px!important;
}

/* Sucesso do cliente inserido pelo v40-clientes.js */
#clientList .client .cs-client-badges{
  display:flex!important;
  flex-wrap:nowrap!important;
  gap:3px!important;
  margin-top:4px!important;
  overflow:hidden!important;
}
#clientList .client .cs-alert-badge{
  padding:3px 5px!important;
  font-size:6.5px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
#clientList .client .cs-client-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:3px!important;
  margin-top:4px!important;
}
#clientList .client .cs-client-actions button{
  min-height:22px!important;
  padding:3px 6px!important;
  font-size:6.8px!important;
  line-height:1!important;
  border-radius:6px!important;
}

/* Ações principais: 4 colunas compactas, no máximo 2 linhas na maioria dos clientes */
#clientList .client .actions{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(78px,1fr))!important;
  gap:4px!important;
  min-width:390px!important;
  align-content:center!important;
}
#clientList .client .actions .btn{
  width:100%!important;
  min-height:27px!important;
  height:27px!important;
  padding:4px 6px!important;
  border-radius:7px!important;
  font-size:8px!important;
  line-height:1.05!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* KPIs e filtros: menos altura vertical */
.kpis{
  gap:7px!important;
  margin:12px 0!important;
}
.kpis .kpi{
  padding:10px 12px!important;
  min-height:62px!important;
  border-radius:12px!important;
}
.kpis .kpi span{font-size:8px!important}
.kpis .kpi b{font-size:20px!important;margin-top:4px!important}

@media(min-width:1200px){
  main .toolbar{
    grid-template-columns:minmax(240px,2.2fr) repeat(4,minmax(125px,1fr))!important;
    gap:6px!important;
    margin-bottom:10px!important;
  }
  main .toolbar input,
  main .toolbar select{
    min-height:34px!important;
    padding:7px 9px!important;
    font-size:10px!important;
  }
}

/* AGENDA DE SUCESSO REAL */
#customerSuccessBoard.customer-success-board{
  margin:10px 0 9px!important;
  padding:10px 13px!important;
  border-radius:14px!important;
  box-shadow:0 8px 22px rgba(10,7,30,.10)!important;
}
#customerSuccessBoard .cs-board-head{
  gap:8px!important;
  margin-bottom:7px!important;
  min-height:32px!important;
}
#customerSuccessBoard .cs-board-head h2{
  font-size:14px!important;
  line-height:1.15!important;
  margin:0!important;
}
#customerSuccessBoard .cs-board-head p{
  font-size:8.5px!important;
  line-height:1.25!important;
  margin:2px 0 0!important;
}
#customerSuccessBoard .cs-collapse-tools{
  gap:5px!important;
  flex-wrap:nowrap!important;
}
#customerSuccessBoard .cs-agenda-summary{
  font-size:8.5px!important;
  line-height:1!important;
}
#customerSuccessBoard .cs-board-head .btn,
#customerSuccessBoard .cs-collapse-toggle{
  min-height:27px!important;
  height:27px!important;
  padding:4px 8px!important;
  border-radius:7px!important;
  font-size:8px!important;
  line-height:1!important;
}
#customerSuccessBoard.cs-collapsed{
  padding:9px 13px!important;
}
#customerSuccessBoard.cs-collapsed .cs-board-head{
  margin-bottom:0!important;
}

/* Se expandir, a agenda NÃO cresce indefinidamente */
#customerSuccessBoard #customerSuccessAgenda.cs-agenda{
  grid-template-columns:repeat(3,minmax(220px,1fr))!important;
  gap:6px!important;
  max-height:235px!important;
  overflow:auto!important;
  overscroll-behavior:contain!important;
  padding-right:3px!important;
}
#customerSuccessBoard .cs-agenda-item{
  padding:8px 9px!important;
  gap:5px!important;
  border-radius:10px!important;
}
#customerSuccessBoard .cs-agenda-item h3{
  font-size:10px!important;
  line-height:1.15!important;
}
#customerSuccessBoard .cs-agenda-item p{
  font-size:7.5px!important;
  line-height:1.25!important;
}
#customerSuccessBoard .cs-pill{
  padding:3px 5px!important;
  font-size:6.5px!important;
}
#customerSuccessBoard .cs-agenda-actions{
  gap:3px!important;
}
#customerSuccessBoard .cs-agenda-actions button{
  min-height:24px!important;
  padding:3px 6px!important;
  font-size:7px!important;
  border-radius:6px!important;
}
#customerSuccessBoard .cs-empty{
  padding:10px!important;
  font-size:8px!important;
}

/* Tablet */
@media(max-width:1450px){
  #clientList .client{
    grid-template-columns:40px minmax(225px,1.25fr) minmax(110px,.5fr) minmax(145px,.62fr) minmax(340px,1.1fr)!important;
    gap:8px!important;
  }
  #clientList .client .actions{
    min-width:340px!important;
    grid-template-columns:repeat(3,minmax(82px,1fr))!important;
  }
  #customerSuccessBoard #customerSuccessAgenda.cs-agenda{
    grid-template-columns:repeat(2,minmax(220px,1fr))!important;
  }
}
@media(max-width:1120px){
  #clientList .client{
    grid-template-columns:40px minmax(0,1fr) minmax(120px,.55fr)!important;
  }
  #clientList .client>div:nth-of-type(3){grid-column:2/-1}
  #clientList .client .actions{
    grid-column:2/-1!important;
    min-width:0!important;
    grid-template-columns:repeat(4,minmax(86px,1fr))!important;
  }
}
@media(max-width:760px){
  #clientList .client{
    grid-template-columns:38px 1fr!important;
    padding:9px!important;
  }
  #clientList .client>*:nth-child(n+3){grid-column:2}
  #clientList .client .actions{
    grid-column:1/-1!important;
    grid-template-columns:repeat(2,minmax(110px,1fr))!important;
  }
  #customerSuccessBoard .cs-board-head{align-items:flex-start!important;flex-wrap:wrap!important}
  #customerSuccessBoard .cs-collapse-tools{width:100%!important;flex-wrap:wrap!important}
  #customerSuccessBoard #customerSuccessAgenda.cs-agenda{grid-template-columns:1fr!important;max-height:280px!important}
}