Stundenkonto und Vorschuss am Einrichtungs-Ticket und beim Kunden

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

src/components/customer/AboStatusCard.jsx

@@ -3,6 +3,7 @@ import { Card, Badge } from '../ui'
 import { getCustomerAboStatus } from '../../lib/teamApi'
 import { fmtDate, productLabelOf } from '../../lib/format'
 import { storageLabel } from '../../lib/storageFormat'
+import StundenkontoLeiste from './StundenkontoLeiste'
 
 // Abo-Status eines Kunden (Reiter "Abo & Angebote"): Appwrite-Spiegel des Stripe-Abos, fuer alle Mitarbeiter
 export default function AboStatusCard({ customerId }) {
@@ -19,13 +20,16 @@ export default function AboStatusCard({ customerId }) {
     return () => { alive = false }
   }, [customerId])
 
+  // Nur ein aktives Wartungs-Abo hat ein Stundenkonto (das Hosting-Abo nicht)
+  const mitKonto = Boolean(abo && abo.productKey === 'wartung' && abo.active)
+
   return (
     <Card title="Abo">
       {error && <div className="msg err" role="alert">{error}</div>}
       {!abo && !error && <div className="loading">Wird geladen …</div>}
       {abo && !abo.status && <p className="muted">kein Abo</p>}
       {abo && abo.status && (
-        <dl className="kv">
+        <dl className={mitKonto ? 'kv mb-2' : 'kv'}>
           <dt>Abo</dt>
           <dd className="flex items-center gap-2 wrap">
             {productLabelOf(abo.productKey)}
@@ -37,6 +41,7 @@ export default function AboStatusCard({ customerId }) {
           <dt>Zusatzspeicher</dt><dd>{storageLabel(abo.storageUnits)}</dd>
         </dl>
       )}
+      {mitKonto && <StundenkontoLeiste customerId={customerId} />}
     </Card>
   )
 }