/* Stream A: Rechner Energie/Makros und Körper.
   Nur seitenspezifische Styles; gemeinsame Bausteine und Tokens stehen in
   style.css (Abschnitt "Ratgeber-Portal"). Keine neuen Farben. */

/* Einheiten rechts im Feld: Platz für längere Texte wie "Jahre" oder "%/Woche" */
.eb-calc .calc-unit input {
  padding-right: 4.25rem;
}
.eb-calc .eb-unit-long input {
  padding-right: 6.5rem;
}
.eb-calc .calc-optional {
  font-weight: 400;
  color: var(--text-2);
}
.eb-calc .calc-hint a {
  color: var(--accent-text);
}
.eb-calc .calc-field[hidden] {
  display: none;
}

/* Ergebnis */
.eb-calc .result-empty {
  color: var(--text-2);
  margin: 0;
}
.eb-calc .result-empty[hidden],
.eb-calc [data-output][hidden],
.eb-calc [data-show][hidden] {
  display: none;
}
.eb-calc .result-value {
  overflow-wrap: anywhere;
}
.eb-calc .result-item .result-note {
  margin-top: 6px;
  font-size: 13px;
}
.eb-calc .result-note strong {
  color: var(--text);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.eb-calc .eb-next {
  color: var(--accent-text);
  font-weight: 600;
  text-decoration: none;
}
.eb-calc .eb-next:hover {
  text-decoration: underline;
}
.eb-calc .eb-warn {
  color: var(--orange, var(--text));
}
.eb-calc .eb-trend {
  font-size: 14px;
  color: var(--text-2);
  margin: 12px 0 0;
}
.eb-calc .eb-trend a {
  color: var(--accent-text);
}

/* Makro-Verteilung als schmaler Balken */
.eb-bar {
  display: flex;
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--card-2);
  margin-top: 14px;
}
.eb-bar span {
  display: block;
  height: 100%;
  width: 0;
}
.eb-bar-protein {
  background: var(--text);
}
.eb-bar-fat {
  background: var(--text-2);
}
.eb-bar-carbs {
  background: var(--text-3);
}

/* Tabellen (Formeln im Ergebnis, Einordnungen im Erklärteil) */
.eb-formula-table {
  margin-top: 16px;
}
.eb-table-card {
  padding: 8px 10px;
  overflow-x: auto;
}
.eb-prose p {
  max-width: 68ch;
}