.kr-table { width: 100%; border-collapse: collapse; margin-bottom: 1em; }
.kr-table th, .kr-table td { border: 1px solid #ccc; padding: 0.5em; text-align: left; }
form#kr-form label { display: block; margin-bottom: 0.5em; }
/* --------- Formular-Layout --------- */
#kr-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}
#kr-form label {
  display: flex;
  flex-direction: column;
  font-weight: 600;
}
#kr-form button {
  grid-column: 1 / -1;
  padding: 0.75rem 1.5rem;
  background: #0073aa;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 1rem;
  cursor: pointer;
}
#kr-form button:hover {
  background: #005177;
}

/* --------- Ergebnistabelle --------- */
.kr-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 1rem;
  table-layout: fixed;
}
.kr-table th, .kr-table td {
  border: 1px solid #ddd;
  padding: 0.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* Spaltenbreiten definieren */
.kr-table th:nth-child(1), .kr-table td:nth-child(1) { width: 30%; }  /* Produkt */
.kr-table th:nth-child(2), .kr-table td:nth-child(2) { width: 10%; }  /* Packungen */
.kr-table th:nth-child(3), .kr-table td:nth-child(3) { width: 15%; }  /* Größe */
.kr-table th:nth-child(4), .kr-table td:nth-child(4) { width: 15%; }  /* Gesamt (kg) */
.kr-table th:nth-child(5), .kr-table td:nth-child(5) { width: 20%; }  /* Haltbarkeit */
.kr-table th:nth-child(6), .kr-table td:nth-child(6) { width: 10%; }  /* Mikro (optional) */

/* Responsive Anpassung */
@media (max-width: 600px) {
  #kr-form { grid-template-columns: 1fr; }
  .kr-table th, .kr-table td { font-size: 0.85rem; }
}
.kr-rechner-wrapper {
  background: #f9f9f9;
  padding: 1.5rem;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
/* Tabellenzellen umbrechen statt abschneiden */
.kr-table th, .kr-table td {
  white-space: normal;       /* Zeilenumbruch erlauben */
  word-wrap: break-word;     /* Lange Wörter umbrechen */
  overflow: visible;         /* Überlauf anzeigen */
}

/* Falls nur die Mikro‑Spalte betroffen sein soll */
.kr-table th:nth-child(6),
.kr-table td:nth-child(6) {
  white-space: normal;
  word-wrap: break-word;
}

/* Überschrift, falls abgeschnitten */
.kr-table th {
  white-space: normal;
}
/* Mikronährstoffe unter Produktname */
.kr-table td strong {
  display: block;
  margin-bottom: 0.25rem;
}
.kr-table .kr-mikro {
  display: block;
  font-size: 0.85rem;
  color: #555;
  font-style: italic;
}
.kr-table {
  table-layout: auto; /* Spalten passen sich an den Inhalt an */
}
