/* HerbaSinn System V7 - 2026-07-09
   Refinamento global pós-V6: CRM com colunas maiores, botões de filtro padronizados
   e indicadores/bolinhas mais discretos. Somente CSS/UI. */

:root{
  --herba-green:#58b91f;
  --herba-green-600:#47a51f;
  --herba-green-700:#2f7d32;
  --herba-green-800:#24672a;
  --herba-mint:#f4fbef;
  --herba-mint-2:#eef8e7;
  --herba-gold:#d9b64a;
  --herba-ink:#102033;
  --herba-text:#344039;
  --herba-muted:#68766d;
  --herba-line:#d7e8cf;
  --herba-line-strong:#b8dca8;
  --herba-shadow-soft:0 9px 20px rgba(31,70,38,.07);
}

/* =========================================================
   CRM KANBAN: colunas maiores para o card não criar scroll
   ========================================================= */
.sinn-crm-page .sinn-crm-board-shell{
  overflow-x:auto!important;
  overflow-y:visible!important;
  padding-bottom:14px!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(88,185,31,.22) transparent;
}

.sinn-crm-page .sinn-crm-board-shell::-webkit-scrollbar{
  height:7px;
}

.sinn-crm-page .sinn-crm-board-shell::-webkit-scrollbar-thumb{
  background:rgba(88,185,31,.24);
  border-radius:999px;
}

.sinn-crm-page .sinn-crm-board-grid{
  display:flex!important;
  grid-template-columns:none!important;
  grid-auto-flow:unset!important;
  grid-auto-columns:unset!important;
  gap:16px!important;
  min-width:max-content!important;
  width:max-content!important;
  align-items:flex-start!important;
}

.sinn-crm-page [data-crm-column]{
  width:320px!important;
  min-width:320px!important;
  max-width:320px!important;
  flex:0 0 320px!important;
  overflow:visible!important;
  padding:12px!important;
}

.sinn-crm-page [data-crm-list]{
  overflow:visible!important;
  min-height:315px!important;
}

/* Card dentro da coluna sempre ocupa a largura correta, sem vazar */
.sinn-crm-page .sinn-crm-mini-card{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}

.sinn-crm-page .sinn-crm-mini-card > div,
.sinn-crm-page .sinn-crm-mini-card .sinn-crm-card-next{
  min-width:0!important;
}

/* =========================================================
   CRM ETAPAS: bolinhas discretas de 4x4px
   ========================================================= */
.sinn-crm-page [data-crm-column] > .flex:first-child .h-3.w-3.rounded-full,
.sinn-crm-page [data-crm-column] > .flex:first-child span[style*="background"]{
  width:4px!important;
  height:4px!important;
  min-width:4px!important;
  min-height:4px!important;
  max-width:4px!important;
  max-height:4px!important;
  border:0!important;
  box-shadow:none!important;
  outline:0!important;
  margin-right:4px!important;
  transform:none!important;
}

.sinn-crm-page [data-crm-column] > .flex:first-child .flex.items-center.gap-2{
  gap:6px!important;
  align-items:center!important;
}

.sinn-crm-page [data-crm-column] h3{
  font-size:12px!important;
  line-height:1.1!important;
  letter-spacing:.10em!important;
  color:#1e2b22!important;
}

.sinn-crm-page [data-crm-column] [data-crm-count]{
  margin-top:6px!important;
  font-size:11px!important;
  line-height:1.25!important;
}

/* Indicador do card também fica discreto para não parecer bug visual */
.sinn-crm-page .sinn-crm-urgency-dot{
  width:4px!important;
  height:4px!important;
  min-width:4px!important;
  min-height:4px!important;
  max-width:4px!important;
  max-height:4px!important;
  right:11px!important;
  top:11px!important;
  border:0!important;
  box-shadow:none!important;
  outline:0!important;
}

/* =========================================================
   CRM CARD: botões em uma linha, sem scroll e sem corte estranho
   ========================================================= */
.sinn-crm-page .sinn-crm-card-actions{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:6px!important;
  width:100%!important;
  overflow:hidden!important;
}

.sinn-crm-page .sinn-crm-card-actions > *,
.sinn-crm-page .sinn-crm-card-actions button,
.sinn-crm-page .sinn-crm-card-actions a,
.sinn-crm-page .sinn-crm-card-actions span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:0!important;
  height:34px!important;
  min-height:34px!important;
  max-height:34px!important;
  padding:0 9px!important;
  border-radius:11px!important;
  font-size:10.5px!important;
  font-weight:900!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  box-sizing:border-box!important;
}

.sinn-crm-page .sinn-crm-card-actions > :nth-child(1){
  flex:1.12 1 0!important;
}

.sinn-crm-page .sinn-crm-card-actions > :nth-child(2){
  flex:.84 1 0!important;
}

.sinn-crm-page .sinn-crm-card-actions > :nth-child(3){
  flex:1.02 1 0!important;
}

.sinn-crm-page .sinn-crm-card-actions svg,
.sinn-crm-page .sinn-crm-card-actions i,
.sinn-crm-page .sinn-crm-card-actions .svg-inline--fa{
  width:11px!important;
  height:11px!important;
  min-width:11px!important;
  margin-right:3px!important;
}

/* =========================================================
   FILTROS CRM: botões do filtro com mesmo padrão visual
   ========================================================= */
.sinn-crm-page .sinn-crm-filter-shell{
  padding:16px!important;
  border-radius:24px!important;
}

.sinn-crm-page .crm-filter-form,
.sinn-crm-page .sinn-crm-filter-grid{
  align-items:center!important;
  gap:10px!important;
}

.sinn-crm-page .crm-filter-actions{
  display:flex!important;
  grid-template-columns:none!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  width:auto!important;
  min-width:0!important;
}

.sinn-crm-page .crm-filter-actions > *,
.sinn-crm-page .crm-filter-actions button,
.sinn-crm-page .crm-filter-actions a{
  width:auto!important;
  min-width:112px!important;
  max-width:none!important;
  height:38px!important;
  min-height:38px!important;
  max-height:38px!important;
  padding:0 15px!important;
  border-radius:12px!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1!important;
  white-space:nowrap!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  box-sizing:border-box!important;
  text-decoration:none!important;
}

.sinn-crm-page .crm-filter-actions .fit-btn-primary,
.sinn-crm-page .crm-filter-actions button[type="submit"]{
  background:var(--herba-green)!important;
  border:1px solid var(--herba-green)!important;
  color:#fff!important;
  box-shadow:0 8px 17px rgba(88,185,31,.18)!important;
}

.sinn-crm-page .crm-filter-actions .fit-btn-secondary,
.sinn-crm-page .crm-filter-actions a.fit-btn-secondary,
.sinn-crm-page .crm-filter-actions button.fit-btn-secondary{
  background:var(--herba-mint)!important;
  border:1px solid var(--herba-line-strong)!important;
  color:var(--herba-green-800)!important;
  box-shadow:0 7px 14px rgba(31,70,38,.055)!important;
}

.sinn-crm-page .crm-filter-actions .fit-btn-soft,
.sinn-crm-page .crm-filter-actions button.fit-btn-soft,
.sinn-crm-page .crm-filter-actions a.fit-btn-soft{
  background:#fff!important;
  border:1px solid var(--herba-line)!important;
  color:var(--herba-green-800)!important;
  box-shadow:0 7px 14px rgba(31,70,38,.045)!important;
}

.sinn-crm-page .crm-filter-actions .fit-btn-secondary:hover,
.sinn-crm-page .crm-filter-actions .fit-btn-soft:hover{
  background:#eef8e7!important;
  border-color:var(--herba-line-strong)!important;
  color:var(--herba-green-700)!important;
}

.sinn-crm-page .crm-filter-actions svg,
.sinn-crm-page .crm-filter-actions i,
.sinn-crm-page .crm-filter-actions .svg-inline--fa{
  width:12px!important;
  height:12px!important;
  min-width:12px!important;
}

/* Chips rápidos: mantém o padrão compacto aprovado */
.sinn-crm-page .crm-filter-quick{
  gap:7px!important;
  align-items:center!important;
}

.sinn-crm-page .sinn-filter-chip{
  height:34px!important;
  min-height:34px!important;
  padding:0 13px!important;
  border-radius:11px!important;
  font-size:11px!important;
  font-weight:900!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
}

/* =========================================================
   Produção/Receitas: reforço para botões do topo em uma linha
   ========================================================= */
.sinn-page-header-content .flex.flex-wrap:has(.fit-btn-primary),
.sinn-page-header-content .flex.flex-wrap:has(.fit-btn-secondary),
.sinn-page-header-content .flex.flex-wrap:has(.fit-btn-soft){
  flex-wrap:nowrap!important;
  align-items:center!important;
  gap:8px!important;
  overflow-x:auto!important;
  padding-bottom:2px!important;
}

.sinn-page-header-content .fit-btn-primary,
.sinn-page-header-content .fit-btn-secondary,
.sinn-page-header-content .fit-btn-soft,
.sinn-page-header-content a[class*="fit-btn"],
.sinn-page-header-content button[class*="fit-btn"]{
  height:36px!important;
  min-height:36px!important;
  max-height:36px!important;
  padding:0 13px!important;
  border-radius:11px!important;
  font-size:12px!important;
  font-weight:900!important;
  white-space:nowrap!important;
  flex:0 0 auto!important;
}

@media (max-width: 1500px){
  .sinn-crm-page [data-crm-column]{
    width:310px!important;
    min-width:310px!important;
    max-width:310px!important;
    flex-basis:310px!important;
  }
}

@media (max-width: 1280px){
  .sinn-crm-page [data-crm-column]{
    width:300px!important;
    min-width:300px!important;
    max-width:300px!important;
    flex-basis:300px!important;
  }

  .sinn-crm-page .crm-filter-actions{
    grid-column:1 / -1!important;
  }
}

@media (max-width: 768px){
  .sinn-crm-page .sinn-crm-board-grid{
    gap:12px!important;
  }

  .sinn-crm-page [data-crm-column]{
    width:286px!important;
    min-width:286px!important;
    max-width:286px!important;
    flex-basis:286px!important;
  }

  .sinn-crm-page .crm-filter-actions{
    flex-wrap:wrap!important;
  }

  .sinn-crm-page .crm-filter-actions > *,
  .sinn-crm-page .crm-filter-actions button,
  .sinn-crm-page .crm-filter-actions a{
    flex:1 1 120px!important;
  }
}