/* FIX: Forçar cards de estoque a não quebrar linha */

/* Forçar texto em linha única nos cards de estatísticas */
.md\:col-span-3 .text-sm,
.md\:col-span-2 .text-sm,
.md\:col-span-3 .font-semibold,
.md\:col-span-2 .font-semibold {
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/* Garantir que os cards tenham largura mínima */
.md\:col-span-3 {
  min-width: 180px !important;
}

.md\:col-span-2 {
  min-width: 160px !important;
}

/* Forçar flexbox a não encolher o texto */
.md\:col-span-3 > div > div:first-child,
.md\:col-span-2 > div > div:first-child {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* Ícone não deve encolher */
.md\:col-span-3 > div > div:last-child,
.md\:col-span-2 > div > div:last-child {
  flex-shrink: 0 !important;
  margin-left: 8px !important;
}

/* Media query para telas maiores que 768px */
@media (min-width: 768px) {
  /* Grid de 12 colunas */
  .grid.grid-cols-1.md\:grid-cols-12 {
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    gap: 1rem !important;
  }
  
  /* Garantir span correto */
  .md\:col-span-2 {
    grid-column: span 2 / span 2 !important;
  }
  
  .md\:col-span-3 {
    grid-column: span 3 / span 3 !important;
  }
}

/* Mobile: permitir quebra apenas em telas muito pequenas */
@media (max-width: 767px) {
  .md\:col-span-3,
  .md\:col-span-2 {
    min-width: auto !important;
  }
  
  /* Reduzir fonte em mobile para caber */
  .md\:col-span-3 .text-sm,
  .md\:col-span-2 .text-sm {
    font-size: 0.7rem !important;
  }
}