/* GLP-1-Verlauf (0.80.0), aus den Bausteinen Karte, Pills, Menüliste und Blatt */
.glp1-screen {
  display: grid;
  gap: var(--space-2);
}

.glp1-sub,
.glp1-hint {
  margin: 0;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.glp1-sub {
  text-align: center;
}

/* Nach «Befinden speichern» (Stand 28.09.2026): immer derselbe Satz, 13 px in --text-2, ohne Icon und ohne Farbe. */
.glp1-saved {
  margin: 0;
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
}

.glp1-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3);
  padding: var(--space-3);
}

.glp1-summary small {
  display: block;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.glp1-summary strong {
  color: var(--text);
  font-size: var(--font-size-value);
  font-weight: var(--font-weight-medium);
}

.glp1-card {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-3);
}

.me-list-row.glp1-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.glp1-row > span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.glp1-row strong {
  font-size: var(--font-size-list);
  font-weight: var(--font-weight-medium);
}

.glp1-row small {
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.glp1-row > b {
  color: var(--text-2);
  font-size: var(--font-size-list);
  font-weight: var(--font-weight-regular);
  white-space: nowrap;
}

.glp1-row--static {
  cursor: default;
}

.glp1-scale {
  display: grid;
  gap: var(--space-1);
  margin: 0;
  padding: 0;
  border: 0;
}

.glp1-scale legend {
  margin-bottom: var(--space-1);
  padding: 0;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.glp1-scale__options {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-1);
}

.glp1-scale__options label {
  position: relative;
}

.glp1-scale__options input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.glp1-scale__options span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--pill-height);
  padding: 0 var(--space-1);
  color: var(--text-2);
  font-size: var(--font-size-label);
  background: var(--page);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  cursor: pointer;
}

.glp1-scale__options input:checked + span {
  color: var(--card);
  background: var(--accent);
  border-color: var(--accent);
}

.glp1-scale__options input:focus-visible + span {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.glp1-chart {
  margin: 0;
}

.glp1-chart svg {
  display: block;
  width: 100%;
  height: auto;
}

.glp1-chart__line {
  fill: none;
  stroke: var(--accent);
  stroke-width: 2;
  stroke-linejoin: round;
}

.glp1-chart__dot {
  fill: var(--card);
  stroke: var(--accent);
  stroke-width: 1.5;
}

.glp1-chart__marker {
  stroke: var(--accent-light);
  stroke-width: 1;
  stroke-dasharray: 3 3;
}

/* --glp1-label-size gleicht die Skalierung des SVG aus (37-glp1-ui.js), damit die Beschriftung 11 px bleibt. */
.glp1-chart__label {
  fill: var(--text-3);
  font-size: var(--glp1-label-size, var(--font-size-label));
}

.glp1-chart figcaption {
  margin-top: var(--space-1);
  color: var(--text-2);
  font-size: var(--font-size-label);
}

.glp1-chart figcaption strong {
  color: var(--accent);
  font-weight: var(--font-weight-medium);
}

/* «Seit Beginn» (js/47-glp1-stats.js): Werteliste in der Karte, Zeilen mit Trennlinie, Veränderung mit Pfeil in --accent. */
.glp1-since__list {
  display: grid;
}

.glp1-since__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
  min-height: var(--control-height);
  padding: var(--space-2) 0;
  border-top: 1px solid var(--border);
}

.glp1-since__row:first-child {
  border-top: 0;
}

.glp1-since__row > span {
  display: grid;
  gap: 2px;
  min-width: 0;
  color: var(--text);
  font-size: var(--font-size-list);
}

.glp1-since__row small {
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.glp1-since__row b {
  color: var(--text);
  font: var(--font-weight-medium) var(--font-size-list) / 1.4 var(--font-system);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.glp1-change-arrow {
  color: var(--accent);
}

.glp1-sheet__body {
  display: grid;
  gap: var(--space-3);
}

.glp1-sheet__text {
  margin: 0;
  color: var(--text-2);
  font-size: var(--font-size-list);
}

.glp1-form {
  display: grid;
  gap: var(--space-3);
}

/* Bericht für den Arzttermin: ruhige Tabellen, druckbar. */
.glp1-report {
  display: grid;
  gap: var(--space-4);
  padding: var(--space-4);
  color: var(--text);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
}

.glp1-report__head h2 {
  margin: 0 0 var(--space-1);
  font: var(--font-weight-medium) var(--font-size-value) / 1.3 var(--font-system);
}

.glp1-report__head p,
.glp1-report__foot {
  margin: 0;
  color: var(--text-2);
  font-size: var(--font-size-label);
}

.glp1-report section {
  display: grid;
  gap: var(--space-2);
  min-width: 0;
  overflow-x: auto;
}

.glp1-report h3 {
  margin: 0;
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-section) / 1.4 var(--font-system);
}

.glp1-report__table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--font-size-label);
  font-variant-numeric: tabular-nums;
}

.glp1-report__table th,
.glp1-report__table td {
  padding: var(--space-1) var(--space-2) var(--space-1) 0;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--border);
}

.glp1-report__table th {
  color: var(--text-3);
  font-weight: var(--font-weight-regular);
}

.glp1-report__actions {
  margin-top: var(--space-3);
}

.glp1-report__actions .ui-primary-button {
  width: 100%;
}

/* Beim Drucken nur der Bericht, ohne Navigation und Knöpfe. */
@media print {
  body.glp1-print .ui-tab-bar,
  body.glp1-print .me-subscreen-header,
  body.glp1-print .glp1-report__actions,
  body.glp1-print dialog,
  body.glp1-print .page:not(#glp1) {
    display: none !important;
  }

  body.glp1-print,
  body.glp1-print .main {
    height: auto !important;
    overflow: visible !important;
    padding: 0 !important;
    background: var(--card) !important;
  }

  body.glp1-print .glp1-report {
    border: 0;
    padding: 0;
  }

  body.glp1-print .glp1-report section {
    overflow: visible;
    break-inside: avoid;
  }
}

.glp1-report__table td:first-child {
  white-space: nowrap;
}

/* Einnahmen von Präparaten (ab 0.86.17, js/51-medication-intakes.js): unter Präparate → Routine, auf Today in «Heute zu
   tun» und im Blatt je Präparat. Je Tag zwei Umschalter «Genommen» und «Ausgelassen» (44 px); der gewählte ist wie jede
   Auswahl gefüllt, beide gleich (die Farbe bewertet nicht). Die Übersicht je Woche ist schlichter Text ohne Farbe. Ist
   die Zeile zu schmal (320 px), stehen die Umschalter rechtsbündig unter dem Namen statt ihn zu quetschen. */
.med-intake + .med-intake {
  border-top: 1px solid var(--border);
}

.med-intake__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-1) var(--space-2);
  min-height: var(--control-height);
  padding-block: var(--space-1);
}

.med-intake__today {
  padding: 0 var(--space-3) var(--space-2);
}

/* «Heute» und ein Datum sind kurz: die Umschalter bleiben daneben, auch bei 320 px. */
.med-intake__today .med-intake__name,
.med-intake-sheet__days .med-intake__name {
  flex-basis: auto;
}

.med-intake__name {
  display: grid;
  flex: 1 1 8em;
  gap: 2px;
  min-width: 0;
}

.med-intake__name strong {
  color: var(--text);
  font: var(--font-weight-regular) var(--font-size-list) / 1.3 var(--font-system);
  overflow-wrap: anywhere;
}

.med-intake__name small {
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-label) / 1.4 var(--font-system);
  font-variant-numeric: tabular-nums;
}

.med-intake__choices {
  display: flex;
  flex: 0 0 auto;
  gap: var(--space-1);
  margin-left: auto;
}

.med-intake__choice {
  min-width: var(--control-height);
  min-height: var(--control-height);
  padding: 0 var(--space-3);
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.2 var(--font-system);
  background: var(--page);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  cursor: pointer;
}

.med-intake__choice[aria-pressed="true"] {
  color: var(--card);
  background: var(--accent);
  border-color: var(--accent);
}

.med-intake__choice:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.med-intakes__status[hidden] {
  display: none;
}

.med-intakes .me-list + .glp1-hint {
  margin-top: var(--space-2);
}

/* Today: eigene Gruppe unter «Einnehmen», Zeilen mit Trennlinie wie die Supplement-Routine. */
.today-meds {
  display: grid;
}

.today-meds header {
  padding-block: var(--space-2);
}

.today-meds h3 {
  margin: 0;
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-label) / 1.4 var(--font-system);
}

.today-meds .med-intake__row {
  border-top: 1px solid var(--border);
}

/* Blatt je Präparat: Kopf mit Titel und «Schliessen» nebeneinander (wie bei den eigenen Messwerten), ein langer Name
   bricht um; darunter letzte 7 Tage und Wochen. */
.med-intake-sheet .ui-bottom-sheet__header {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding-block: 0;
  background: var(--card);
}

.med-intake-sheet .ui-bottom-sheet__title {
  min-width: 0;
  overflow-wrap: break-word;
  text-wrap: balance;
}

.med-intake-sheet__heading {
  margin: var(--space-4) 0 var(--space-1);
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-section) / 1.4 var(--font-system);
}

.med-intake-sheet__days .med-intake__row + .med-intake__row,
.med-intake-sheet__weeks li + li {
  border-top: 1px solid var(--border);
}

.med-intake-sheet__weeks {
  margin: 0;
  padding: 0;
  list-style: none;
}

.med-intake-sheet__weeks li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-1) var(--space-2);
  min-height: var(--control-height);
  padding-block: var(--space-1);
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
}

.med-intake-sheet__weeks b {
  margin-left: auto;
  color: var(--text);
  font-weight: var(--font-weight-regular);
  font-variant-numeric: tabular-nums;
  text-align: right;
}