/* Ponte visual: markup legado (app-premium / stat-card) → look Ui* do Next. */

.app-premium-page,
.technical-sheets-page,
.entities-page,
.products-list-page,
.settings-page {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start; /* sem isto, com min-height:100% as linhas esticam e abrem buracos entre título, cartões e tabela */
  gap: var(--e-4, 16px);
}

/* Sem isto a tabela (larguras fixas) empurra a página para lá do ecrã e corta o lado direito. */
.app-premium-page > *,
.technical-sheets-page > *,
.entities-page > *,
.products-list-page > *,
.settings-page > *,
.products-list-page__content > *,
.entities-page__content > *,
.technical-sheets-page__content > * {
  min-width: 0;
}

.app-premium-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--e-5, 24px);
  flex-wrap: wrap;
}

.app-premium-eyebrow,
.app-premium-header .eyebrow {
  display: block;
  margin-bottom: var(--e-1, 4px);
  color: var(--cor-destaque, #8c5620);
  font-size: var(--t-xs, 0.75rem);
  font-weight: var(--peso-forte, 700);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.app-premium-title,
.ui-title {
  margin: 0;
  font-family: var(--letra) !important;
  font-size: clamp(1.25rem, 1rem + 0.9vw, 1.5rem) !important;
  font-weight: var(--peso-forte, 700) !important;
  line-height: var(--altura-apertada, 1.25) !important;
  letter-spacing: -0.02em !important;
  color: var(--cor-texto, #17312b) !important;
}

.app-premium-subtitle,
.ui-lead {
  max-width: 68ch;
  margin: var(--e-1, 4px) 0 0;
  font-family: var(--letra) !important;
  color: var(--cor-texto-suave, #4d5b55) !important;
  font-size: var(--t-s, 0.8125rem) !important;
  font-weight: var(--peso-normal, 400) !important;
  line-height: var(--altura-normal, 1.55) !important;
}

/* Conteúdo da vista: o padding vive no shell, como no Next */
.app-shell__view {
  font-family: var(--letra);
  font-size: var(--t-m);
  color: var(--cor-texto);
}

.el-button,
.el-input,
.el-select,
.el-table,
.el-form-item__label {
  font-family: var(--letra) !important;
}

.app-premium-actions {
  display: flex;
  align-items: center;
  gap: var(--e-2, 8px);
  flex-wrap: wrap;
}

.app-premium-card,
.settings-premium-card,
.settings-card,
.stat-card.el-card,
.el-card.stat-card {
  border: 1px solid var(--cor-linha, #ded8cc) !important;
  border-radius: var(--raio-l, 14px) !important;
  background: var(--cor-superficie, #ffffff) !important;
  box-shadow: var(--sombra-assente) !important;
}

.stats-overview,
.entities-page__stats,
.products-list-page__stats {
  display: grid;
  gap: var(--e-4, 16px);
}

.stats-overview,
.entities-page__stats,
.products-list-page__stats {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.stats-overview .el-row,
.entities-page__stats .el-row,
.products-list-page__stats .el-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--e-3, 12px);
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box;
}

.entities-page__stats .el-row {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.products-list-page__stats .el-row {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

/* 5 KPI cards: em ecrãs largos uma fila; abaixo disso auto-fit para não esmagar texto */
@media (min-width: 1280px) {
  .stats-overview--five .el-row {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 1100px) {
  .products-list-page__stats .el-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  .entities-page__stats .el-row,
  .products-list-page__stats .el-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

.stats-overview .el-col,
.entities-page__stats .el-col,
.products-list-page__stats .el-col {
  max-width: none !important;
  flex: none !important;
  width: auto !important;
  padding: 0 !important;
}

.stat-card .el-card__body,
.stat-card {
  padding: var(--e-3, 12px) !important;
  overflow: hidden !important;
  min-width: 0;
}

.stat-content {
  display: grid !important;
  gap: var(--e-2, 8px);
  min-width: 0;
}

.stat-content .stat-icon {
  display: none !important;
}

.stat-content .stat-info,
.stat-content {
  display: grid !important;
  gap: var(--e-1, 4px);
  min-width: 0;
}

.stat-info .label,
.stat-label {
  max-width: 100%;
  white-space: normal;
  line-height: 1.25;
  overflow-wrap: break-word;
}

.stat-content .label,
.stat-content .stat-label {
  color: var(--cor-texto-suave, #4d5b55);
  font-size: var(--t-s, 0.8125rem);
  font-weight: var(--peso-medio, 550);
  text-transform: none;
  letter-spacing: 0;
}

.stat-content .value,
.stat-content .stat-value,
.stat-content h2.stat-value {
  margin: 0;
  color: var(--cor-texto, #17312b);
  font-size: var(--t-xl, 1.5rem);
  font-weight: var(--peso-forte, 700);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}

.products-list-page__content,
.entities-page__content,
.technical-sheets-page__content {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--e-4, 16px);
  padding: var(--e-5, 24px);
  border: 1px solid var(--cor-linha, #ded8cc);
  border-radius: var(--raio-l, 14px);
  background: var(--cor-superficie, #ffffff);
  box-shadow: var(--sombra-assente);
}

.products-list-page__content-topbar,
.entities-page__toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--e-4, 16px);
  flex-wrap: wrap;
}

.main-content,
.app-shell__view .ui-page {
  max-width: none;
}

/* Settings hub cards */
.settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--e-4, 16px);
}

.settings-card__title {
  color: var(--cor-texto, #17312b);
  font-weight: var(--peso-forte, 700);
}

.settings-card__desc {
  color: var(--cor-texto-suave, #4d5b55);
  font-size: var(--t-s, 0.8125rem);
}

/* Cartões de totais compactos: sem altura mínima nem padding duplicado (card + body). */
.stat-card.el-card .el-card__body,
.el-card.stat-card .el-card__body {
  padding: 0 !important;
}
.entities-page .stat-content,
.stats-overview .stat-content {
  min-height: 0 !important;
}

/* Título das vistas de Definições: a fonte "Outfit" não é carregada (caía em serifa grande). Alinha com os títulos das listagens. */
.settings-view-title {
  font-family: var(--letra) !important;
  font-size: clamp(1.25rem, 1rem + 0.9vw, 1.5rem) !important;
  font-weight: var(--peso-forte, 700) !important;
  line-height: var(--altura-apertada, 1.25) !important;
  letter-spacing: -0.02em;
  color: var(--cor-texto, #17312b) !important;
}

/* Cabeçalho seguido de cartões de totais (Documentos, Rastreabilidade, Stock): respiro entre os dois. */
.app-premium-header + .stats-overview {
  margin-top: var(--e-3, 12px);
}

/* Botões do cabeçalho com ícone + texto sem separação (Gestão de KPIs). */
.app-premium-actions .el-button .el-icon:not(:only-child) {
  margin-right: 6px;
}
