/* woche.css — Ansicht „Woche".
   Sieben große Flächen, gestaffelt statt gleichrangig: Der Trainingstag
   glüht, der freie Tag tritt zurück, der vergangene ist stumm. */

.woche { gap: 18px; }

.woche-kopf {
  display: flex; align-items: center; gap: 12px;
}
.woche-titel-block { flex: 1; min-width: 0; text-align: center; }
.woche-titel-block p { margin-top: 2px; }

.woche-pfeil {
  width: 56px; height: 56px; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: var(--flaeche);
  border: 1px solid var(--linie); border-radius: var(--radius);
  color: var(--tinte);
  transition: border-color var(--wechsel), opacity var(--wechsel);
}
.woche-pfeil:hover { border-color: var(--tinte-leise); }
.woche-pfeil--rechts .symbol { transform: scaleX(-1); }
.woche-pfeil:disabled { opacity: 0.35; }

.woche-tage { display: grid; gap: 8px; }

.woche-tag {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; min-height: 64px;
  padding: 12px 16px;
  background: var(--flaeche);
  border: 1px solid var(--linie);
  border-radius: var(--radius);
  text-align: left;
  transition: background-color var(--wechsel), border-color var(--wechsel),
              color var(--wechsel);
}

.woche-tag-name {
  display: flex; align-items: baseline; gap: 8px;
  font-size: 17px; font-weight: 600;
  color: var(--tinte);
}
.woche-tag-heute {
  font-size: 13px; font-weight: 500;
  color: var(--akzent);
}
.woche-tag-zustand {
  display: flex; align-items: center; gap: 8px;
  flex: none;
  font-size: 15px;
  color: var(--tinte-gedimmt);
}

/* Geplant: die Glut. Das ist der Zustand, den man auf einen Blick sucht. */
.woche-tag--geplant {
  background: var(--akzent);
  border-color: var(--akzent);
}
.woche-tag--geplant .woche-tag-name,
.woche-tag--geplant .woche-tag-zustand { color: var(--akzent-tinte); }
.woche-tag--geplant .woche-tag-heute { color: rgba(20, 16, 11, 0.72); }

/* Erledigt: ruhiger als geplant — getan ist getan. */
.woche-tag--trainiert {
  background: var(--flaeche-hoch);
  border-color: var(--akzent);
}
.woche-tag--trainiert .woche-tag-zustand { color: var(--akzent); }

.woche-tag--heute { box-shadow: inset 0 0 0 1px var(--akzent); }
.woche-tag--geplant.woche-tag--heute { box-shadow: none; }

/* Vergangenes und Erledigtes lässt sich nicht umplanen. Kein Grauschleier,
   sondern zurückgenommener Kontrast — die Zeile bleibt lesbar. */
.woche-tag--fest { opacity: 0.55; }
.woche-tag--fest.woche-tag--trainiert { opacity: 0.8; }
.woche-tag:not(:disabled):hover { border-color: var(--tinte-leise); }
.woche-tag--geplant:not(:disabled):hover { border-color: var(--tinte); }

.woche-fuss { margin-top: 4px; }
.woche-summe {
  font-size: 17px;
  color: var(--tinte);
  font-variant-numeric: tabular-nums;
}

/* Der Weg in die Woche — steht in der Trainingsansicht unter der Karte, als
   Fläche wie alles andere Antippbare. Dasselbe Muster wie der Zugang zur
   Statistik im Kalender. */
.training-woche {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 72px;
  padding: 14px 16px;
  background: var(--flaeche);
  border: 1px solid var(--linie);
  border-radius: var(--radius-gross);
  text-decoration: none;
  transition: border-color var(--wechsel), background-color var(--wechsel);
}
.training-woche:hover { border-color: var(--tinte-leise); }
.training-woche:active { background: var(--flaeche-hoch); }

.training-woche-text { display: grid; gap: 2px; min-width: 0; }
.training-woche-titel {
  font-size: 22px; font-weight: 600; letter-spacing: -0.005em;
  color: var(--tinte);
}
.training-woche-unter { font-size: 13px; color: var(--tinte-gedimmt); }
.training-woche-pfeil { flex: none; color: var(--akzent); transform: scaleX(-1); }