.nestle-traceability,
.nestle-traceability-detail,
.nestle-process-reality {
  scroll-margin-top: 92px;
}

.nestle-traceability .section-heading,
.nestle-traceability-detail .section-heading,
.nestle-process-reality .section-heading {
  gap: 16px;
  align-items: flex-start;
}

.nestle-traceability-kpis {
  margin: 16px 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.nestle-traceability-kpis .kpi {
  min-width: 0;
  padding: 14px 16px;
}

.nestle-traceability-kpis .metric {
  font-size: clamp(1.35rem, 2vw, 2rem);
}

.nestle-traceability-filters {
  grid-template-columns: minmax(150px, .9fr) minmax(150px, .9fr) minmax(240px, 1.5fr) minmax(145px, .8fr) minmax(145px, .8fr);
  align-items: end;
  gap: 12px;
  margin: 14px 0 16px;
}

.nestle-traceability-filters .field,
.nestle-traceability-filters input,
.nestle-traceability-filters select {
  min-width: 0;
  width: 100%;
}

.nestle-traceability-table-wrap {
  width: 100%;
  overflow: visible;
}

.nestle-traceability-table {
  width: 100%;
  table-layout: fixed;
  font-size: clamp(.74rem, .78vw, .88rem);
}

.nestle-traceability-table col.trace-doc { width: 18%; }
.nestle-traceability-table col.trace-subject { width: 24%; }
.nestle-traceability-table col.trace-result { width: 23%; }
.nestle-traceability-table col.trace-status { width: 13%; }
.nestle-traceability-table col.trace-indicator { width: 13%; }
.nestle-traceability-table col.trace-action { width: 9%; }

.nestle-traceability-table th,
.nestle-traceability-table td {
  padding: 10px 8px;
  vertical-align: top;
  overflow-wrap: anywhere;
  white-space: normal;
}

.nestle-traceability-table th {
  font-size: .72rem;
  letter-spacing: .045em;
}

.nestle-traceability-table small,
.nestle-traceability-detail small {
  display: block;
  margin-top: 4px;
  line-height: 1.3;
  opacity: .7;
}

.nestle-traceability-table .status {
  display: inline-flex;
  max-width: 100%;
  white-space: normal;
  text-align: center;
  justify-content: center;
}

.trace-detail-button {
  width: 100%;
  min-width: 0;
  padding: 8px 6px;
  font-size: .75rem;
  line-height: 1.15;
  white-space: normal;
}

.trace-no-action {
  display: block;
  text-align: center;
  opacity: .45;
}

.nestle-traceability-detail {
  margin-top: 14px;
}

.nestle-traceability-detail > .breadcrumb {
  margin: 8px 0 16px;
}

.nestle-traceability-detail-table-wrap {
  width: 100%;
  overflow: visible;
}

.nestle-traceability-detail-table {
  width: 100%;
  table-layout: fixed;
  font-size: clamp(.74rem, .8vw, .88rem);
}

.nestle-traceability-detail-table th:nth-child(1) { width: 22%; }
.nestle-traceability-detail-table th:nth-child(2),
.nestle-traceability-detail-table th:nth-child(3) { width: 11%; }
.nestle-traceability-detail-table th:nth-child(4) { width: 16%; }
.nestle-traceability-detail-table th:nth-child(5) { width: 8%; }
.nestle-traceability-detail-table th:nth-child(6) { width: 18%; }
.nestle-traceability-detail-table th:nth-child(7) { width: 14%; }

.nestle-traceability-detail-table th,
.nestle-traceability-detail-table td {
  padding: 10px 8px;
  vertical-align: top;
  overflow-wrap: anywhere;
  white-space: normal;
}

.nestle-traceability-detail-table .status {
  margin: 0 4px 4px 0;
  white-space: normal;
}

.nestle-traceability-mobile,
.nestle-traceability-detail-mobile {
  display: none;
}

.nestle-process-reality .report-process-grid {
  margin-top: 14px;
}

.nestle-process-reality .report-process-card small {
  line-height: 1.2;
}

@media (max-width: 1180px) {
  .nestle-traceability-filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .nestle-traceability-search {
    grid-column: span 1;
  }

  .nestle-traceability-table {
    font-size: .74rem;
  }

  .nestle-traceability-table th,
  .nestle-traceability-table td {
    padding: 8px 6px;
  }
}

@media (max-width: 860px) {
  .nestle-traceability-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nestle-traceability-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .nestle-traceability-table-wrap,
  .nestle-traceability-detail-table-wrap {
    display: none;
  }

  .nestle-traceability-mobile,
  .nestle-traceability-detail-mobile {
    display: grid;
    gap: 12px;
    margin-top: 14px;
  }

  .nestle-traceability-mobile article,
  .nestle-traceability-detail-mobile article {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid rgba(148, 163, 184, .28);
    border-radius: 16px;
    background: rgba(148, 163, 184, .06);
  }

  .nestle-traceability-mobile article > div:first-child,
  .nestle-traceability-detail-mobile article > div:first-child {
    display: grid;
    gap: 5px;
  }

  .nestle-traceability-detail-mobile dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
  }

  .nestle-traceability-detail-mobile dl div {
    display: grid;
    gap: 3px;
  }

  .nestle-traceability-detail-mobile dt {
    font-size: .76rem;
    opacity: .68;
  }

  .nestle-traceability-detail-mobile dd {
    margin: 0;
    font-weight: 700;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 620px) {
  .nestle-traceability .section-heading,
  .nestle-traceability-detail .section-heading,
  .nestle-process-reality .section-heading {
    display: grid;
    grid-template-columns: 1fr;
  }

  .nestle-traceability .actions {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .nestle-traceability .actions .company-btn,
  .nestle-traceability-detail .company-btn {
    width: 100%;
  }

  .nestle-traceability-filters {
    grid-template-columns: 1fr;
  }

  .nestle-traceability-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
