/*
 * plan.css – Gemeinsame Plan-Komponenten
 * Wird von back-to-the-gym.html und plan-generator.html verwendet.
 * Setzt main.css (CSS-Variablen, Nav, Basis-Typografie) voraus.
 */

/* ── Tip-Box ──────────────────────────────────────────────── */
.tip{
  background:rgba(232,146,10,.07);
  border:1px solid rgba(232,146,10,.25);
  border-left:3px solid var(--amber);
  border-radius:4px;
  padding:13px 17px;
  margin:14px 0;
}
.tip p{margin:0;font-size:.87rem;color:var(--white)}
.tip.info{
  background:rgba(100,150,255,.05);
  border-left-color:#5588cc;
  border-color:rgba(100,150,255,.2);
}
.tip.info p{color:var(--muted)}

/* ── Plan-Box ─────────────────────────────────────────────── */
.planbox{
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:5px;
  overflow:hidden;
  margin:10px 0;
}
.pbh{
  background:var(--surface);
  padding:9px 16px;
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--amber);
  border-bottom:1px solid var(--border);
}
.pbb{padding:0}

/* ── Block-Sektionen ──────────────────────────────────────── */
.block-sec{
  padding:12px 16px;
  border-bottom:1px solid var(--border);
}
.block-sec:last-child{border-bottom:none}

.block-hdr{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  padding-left:4px;
}
.block-badge{
  font-size:.62rem;
  font-weight:700;
  color:#000;
  padding:2px 7px;
  border-radius:2px;
  flex-shrink:0;
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}
.block-title{
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
}

/* ── Übungsliste ──────────────────────────────────────────── */
.block-list{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:7px;
}
.block-list li{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  font-size:.87rem;
  color:var(--white);
  font-weight:300;
  line-height:1.5;
}
.block-list li.note{
  color:var(--muted);
  font-style:italic;
  font-size:.8rem;
  border-top:1px solid var(--border);
  padding-top:8px;
  margin-top:4px;
  justify-content:flex-start;
}
/* Sätze/Wiederholungen – rechts */
.ps{
  flex-shrink:0;
  font-size:.77rem;
  color:var(--amber);
  font-weight:600;
  text-align:right;
  min-width:80px;
}
/* Anmerkung unter Übungsliste */
.pn{
  font-size:.81rem;
  color:var(--muted);
  font-style:italic;
  padding-top:9px;
  border-top:1px solid var(--border);
  margin-top:8px;
  line-height:1.7;
  display:block;
}

/* ── Hervorgehobene (frei gewählte) Übung ─────────────────── */
.ex-hi{
  color:var(--amber-lt) !important;
  font-weight:500 !important;
  font-style:italic;
}

/* ── Responsive ───────────────────────────────────────────── */
@media(max-width:640px){
  .block-list li{flex-wrap:wrap}
  .ps{min-width:unset;text-align:left}
  .block-sec{padding:10px 12px}
}