/* ============================================================
   order.css – NUR für die Bestellseite (bestellung.php).
   Setzt site.css voraus (Design-Variablen, Grundtypografie usw.
   müssen davor geladen sein).
   ============================================================ */

/* ---------- Produktkarten ---------- */
.product-group{
  margin-bottom:28px;
}
.product-group h3{
  font-size:1rem;
  margin:0 0 4px;
  display:flex;
  align-items:center;
  gap:8px;
}
.product-group .desc{
  font-size:0.85rem;
  color:#5C6C6C;
  margin:0 0 12px;
}
.product-card{
  display:flex;
  align-items:flex-start;
  gap:14px;
  background:#fff;
  border:1.5px solid #E1E8E7;
  border-radius:10px;
  padding:14px 16px;
  margin-bottom:10px;
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.product-card:hover{border-color:var(--seaglass-dark);}
.product-card.checked{
  border-color:var(--teal-deep);
  background:var(--seaglass);
}
.product-card input[type=checkbox]{
  width:19px;height:19px;
  margin-top:2px;
  accent-color:var(--teal-deep);
  flex-shrink:0;
}
.product-card .info{flex:1;}
.product-card .name{font-weight:600; font-size:0.95rem;}
.product-card .note{font-size:0.8rem; color:#5C6C6C; margin-top:3px;}
.product-card .price{
  font-weight:600;
  color:var(--teal-deep);
  white-space:nowrap;
  font-size:0.95rem;
}
.qty-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
  padding-left:33px;
  font-size:0.85rem;
}
.qty-row input{width:56px; padding:6px 8px;}
.serial-row{
  padding-left:33px;
  margin-top:8px;
}
.serial-row input{max-width:220px;}
.serial-row .hint{font-size:0.78rem; color:#5C6C6C; margin-top:4px;}
.serial-row.is-required input{border-color:#C1442D;}
.serial-row.is-required .hint{color:#C1442D;}

/* ---------- Sticky Bestell-Zusammenfassung ---------- */
.summary{
  position:sticky;
  top:24px;
  background:var(--teal-deep);
  color:var(--paper);
  border-radius:14px;
  padding:24px;
}
.summary h2{
  color:var(--paper);
  font-size:1.05rem;
  margin:0 0 4px;
}
.summary .empty{
  font-size:0.85rem;
  color:#AFC7C5;
  margin-top:10px;
}
.summary ul{list-style:none; margin:14px 0; padding:0;}
.summary li{
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:0.85rem;
  padding:8px 0;
  border-bottom:1px solid #33565A;
}
.summary .total-row{
  display:flex;
  justify-content:space-between;
  font-size:1.05rem;
  font-weight:600;
  padding-top:14px;
  margin-top:4px;
  border-top:1px solid #33565A;
}
.summary .total-row .mono{color:var(--gold);}
.summary .fineprint{
  font-size:0.75rem;
  color:#9FBBB9;
  margin-top:10px;
}
.summary .btn-submit{width:100%; margin-top:20px;}
.summary .btn-reset{width:100%; margin-top:8px; color:#CFE3E1; border-color:#33565A;}