/* Basis */
.pl-wrap { max-width: 1100px; margin: 0 auto; }
.pl-stepper { display:flex; gap:1rem; margin: 0 0 1rem; }
.pl-step { flex:1 1 auto; text-align:center; padding:1rem; border-radius:14px; background:#f6f8fb; color:#666; font-weight:700; }
.pl-card { background:#fff; border:1px solid #eef1f5; border-radius:18px; padding:1.25rem; margin-bottom:1rem; box-shadow:0 1px 0 rgba(0,0,0,.02); }
.pl-sec legend{ font-size:1.6rem; font-weight:800; color:#5a6; opacity:.85; }
.pl-sec-desc{ color:#666; margin:.25rem 0 1rem; }
.pl-actions { display:flex; justify-content:space-between; margin-top:1rem; }
.pl-btn { background:#1357ff; color:#fff; border:none; border-radius:12px; padding:.75rem 1rem; font-weight:700; cursor:pointer; }
.pl-btn.secondary { background:#eef2f7; color:#111; }

/* Grid & Felder breiter (2 Spalten) */
.pl-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1.25rem 2rem; }
@media (max-width: 900px){ .pl-grid{ grid-template-columns: 1fr; } }
.pl-field > label{ display:flex; align-items:flex-start; gap:1rem; }
.pl-field .pl-label{ min-width:18rem; padding-top:.55rem; font-weight:700; }
.pl-field input[type="text"],
.pl-field input[type="email"],
.pl-field input[type="date"],
.pl-field input[type="number"],
.pl-field input[type="tel"],
.pl-field input[type="file"],
.pl-field select,
.pl-field textarea{ width:100%; box-sizing:border-box; padding:.75rem .9rem; border:1px solid #dfe4ea; border-radius:10px; background:#f8f9fb; }

/* Radios/Checks in Linie */
.choices-inline{ display:flex; flex-wrap:wrap; gap:1rem; }
.choice{ display:inline-flex; align-items:center; gap:.5rem; }
.pl-field input[type="radio"], .pl-field input[type="checkbox"]{ transform:translateY(1px); }

/* Fehler */
.pl-field.invalid input,
.pl-field.invalid select,
.pl-field.invalid textarea{ border:2px solid #b00020 !important; background:#fff5f5; }
.pl-error{ color:#b00020; font-weight:700; margin-top:.35rem; }

/* Kinder-Felder */
.pl-child{ display:none; }
.pl-child.show{ display:block; }

.pl-step.active{ background:#1357ff; color:#fff; }

/* Kachel-Badge für offene Felder/Fehler */
.pl-step { position: relative; }
.pl-step .pl-badge {
  position: absolute; top: -8px; right: -8px;
  min-width: 22px; height: 22px; line-height: 22px;
  padding: 0 6px; border-radius: 999px;
  background: #b00020; color: #fff; font-size: 12px; font-weight: 800;
  display: none; text-align: center;
}
.pl-step.has-issues .pl-badge { display: inline-block; }

/* Hinweisbalken unter dem Stepper */
.pl-summary {
  background: #fff7f8; border: 1px solid #ffd6db; color: #7a0013;
  border-radius: 12px; padding: .6rem .9rem; margin: .5rem 0 1rem;
  font-weight: 600;
}
.pl-summary .pill {
  display: inline-block; background:#ffe3e7; border-radius:999px;
  padding:.2rem .6rem; margin-left:.4rem; font-weight:700;
}

/* Pflichtfeld-Kennzeichnung */
.pl-field.is-required .pl-label .req{
  color:#b00020; font-weight:900; margin-left:.25rem;
}

/* Tooltip auf dem Label bei Pflichtfeldern */
.pl-label[data-tip]{
  position:relative; cursor:help;
}
.pl-label[data-tip]:hover::after{
  content: attr(data-tip);
  position:absolute; left:0; top:100%;
  transform: translateY(6px);
  background:#111; color:#fff; font-size:.82rem;
  padding:.35rem .5rem; border-radius:.4rem;
  white-space:nowrap; z-index:10;
  box-shadow: 0 6px 20px rgba(0,0,0,.15);
}
.pl-label[data-tip]:hover::before{
  content:""; position:absolute; left:10px; top:100%;
  transform: translateY(1px);
  border:6px solid transparent; border-bottom-color:#111;
}

/* 2-Spalten Grid */
.pl-grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr); /* 12er Grid */
  gap: 1rem 1.25rem; /* vertikal / horizontal Abstand */
}
.pl-field{
  grid-column: span 6; /* jede pl-field nimmt 6 von 12 Spalten = 2 pro Zeile */
}

/* auf schmalen Screens einspaltig */
@media (max-width: 860px){
  .pl-field{ grid-column: span 12; }
}
