/* bestellen.css — Panzer IT: Cart/Checkout-Seite (Leistungs-Karten, Warenkorb-Tabelle, Formular)
   Nur für /bestellen/. Baut auf base.css/components.css/cart.css/inner.css auf
   (keine Neudefinition von Tokens, keine Duplikate bestehender Klassen). */

/* ==========================================================================
   Accessibility-Utility (seitenlokal, wie auf anderen Innenseiten üblich)
   ========================================================================== */
.visually-hidden{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ==========================================================================
   Abschnitt A — Leistungs-Karten
   ========================================================================== */
.offer-group{ margin-top:var(--sp-6); }
.offer-group:first-of-type{ margin-top:var(--sp-5); }
.offer-group__title{ font-size:1.25rem; margin-bottom:var(--sp-3); color:var(--c-brass); }
.offer-grid{
  display:grid; gap:var(--sp-3);
  grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
}
.offer-card{ display:flex; flex-direction:column; gap:.6rem; }
.offer-card h3{ font-size:1.15rem; }
.offer-card__price{
  font-family:var(--font-display); font-weight:700;
  font-size:clamp(1.4rem, 1.2rem + .6vw, 1.8rem); color:var(--c-brass);
}
.offer-card__price small{ font-size:.6em; color:var(--c-muted); font-weight:500; margin-left:.15em; }
.offer-card p:not(.offer-card__price){ color:var(--c-muted); font-size:.92rem; flex:1; }
.offer-card .btn{ margin-top:auto; width:100%; justify-content:center; }

/* ==========================================================================
   Abschnitt B — Warenkorb-Zusammenfassung
   ========================================================================== */
.checkout-summary{
  margin-top:var(--sp-5);
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  border:1px solid var(--c-line); border-radius:var(--radius);
  contain:layout;
  background:var(--c-base);
}
.checkout-table{ width:100%; min-width:520px; border-collapse:collapse; font-size:.95rem; }
.checkout-table th, .checkout-table td{
  padding:.85em 1.1em; text-align:left; white-space:nowrap;
  border-bottom:1px solid var(--c-line);
}
.checkout-table thead th{
  font-family:var(--font-display); font-weight:600; color:var(--c-text);
  background:var(--c-panel);
}
.checkout-table thead th:first-child{ border-top-left-radius:var(--radius); }
.checkout-table thead th:last-child{ border-top-right-radius:var(--radius); }
.checkout-table tbody td{ color:var(--c-text); }
.checkout-table tbody tr:last-child td{ border-bottom:none; }
.checkout-remove{
  background:transparent; border:none; color:var(--c-muted); cursor:pointer;
  font-size:1rem; line-height:1; padding:.4em; border-radius:999px;
  transition:color .2s var(--ease), background .2s var(--ease);
}
.checkout-remove:hover, .checkout-remove:focus-visible{
  color:var(--c-copper); background:rgba(184,115,51,.12);
}
.checkout-empty{ color:var(--c-muted); text-align:center; padding:var(--sp-5); }
.checkout-empty__link{ color:var(--c-copper); font-family:var(--font-display); font-weight:600; }
.checkout-empty__link:hover, .checkout-empty__link:focus-visible{ color:var(--c-brass); }

.checkout-summary-foot{
  display:flex; align-items:center; justify-content:space-between;
  margin-top:var(--sp-3); padding:var(--sp-3) var(--sp-4);
  background:var(--c-base); border:1px solid var(--c-line); border-radius:var(--radius);
  font-family:var(--font-display); font-weight:600; font-size:1.15rem;
}
#checkout-total{ color:var(--c-brass); }

/* ==========================================================================
   Abschnitt C — Anfrage-/Bestellformular
   ========================================================================== */
.order-form{ margin-top:var(--sp-5); display:grid; gap:var(--sp-3); max-width:640px; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-3); }
.form-group{ display:flex; flex-direction:column; gap:.4em; }
.form-group label{
  font-family:var(--font-display); font-size:.85rem; color:var(--c-muted);
}
.form-group input,
.form-group textarea{
  background:var(--c-panel); border:1px solid var(--c-line); border-radius:8px;
  padding:.75em 1em; color:var(--c-text); font-family:var(--font-body); font-size:1rem;
  transition:border-color .25s var(--ease);
}
.form-group input:focus-visible,
.form-group textarea:focus-visible{ outline:none; border-color:var(--c-copper); }
.form-group textarea{ resize:vertical; min-height:130px; }

.form-check{ display:flex; align-items:flex-start; gap:.65em; }
.form-check input[type="checkbox"]{
  margin-top:.3em; width:1.15em; height:1.15em; flex:none; accent-color:var(--c-copper);
}
.form-check label{ color:var(--c-muted); font-size:.9rem; }
.form-check a{ color:var(--c-copper); transition:color .2s var(--ease); }
.form-check a:hover, .form-check a:focus-visible{ color:var(--c-brass); }

.order-form > .btn{ justify-self:start; }

@media (max-width:640px){
  .form-row{ grid-template-columns:1fr; }
  .order-form > .btn{ width:100%; justify-content:center; }
}
