@bytebrand/fe-ui-core-autobahn 1.0.45 → 1.0.46

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytebrand/fe-ui-core-autobahn",
-  "version": "1.0.45",
+  "version": "1.0.46",
   "description": "auto.de md3 (Autobahn) design system — UI primitives, cards, chrome, VDP modules, theme CSS and locales. Ships raw TypeScript source (like fe-ui-core before it); each consumer's bundler compiles it.",
   "main": "index.ts",
   "license": "UNLICENSED",

package/vdp/FinanceCalculator.tsx

@@ -94,21 +94,22 @@ export const EvalBar: React.FunctionComponent<{ tier: number; leftPct?: number }
 /** Figma CTA icon — document with a check-in-circle badge over its bottom-right corner
  *  (no single lucide glyph matches; composed from file-text + a knocked-out check-circle).
  *  The badge backdrop assumes a filled (primary) button. */
-export const DocCheckIcon: React.FunctionComponent<{ size?: number }> = ({ size = 18 }) => (
+export const DocCheckIcon: React.FunctionComponent<{ size?: number }> = ({ size = 19 }) => (
   <span style={{ position: 'relative', display: 'inline-flex', flex: 'none' }}>
     <Icon name="file-text" size={size} stroke={2} />
     <span
       style={{
         position: 'absolute',
-        right: -4,
-        bottom: -3,
+        right: -3,
+        bottom: -2,
         display: 'flex',
         borderRadius: '50%',
         background: 'var(--md-primary)',
         padding: 1,
       }}
     >
-      <Icon name="check-circle" size={Math.round(size * 0.62)} stroke={2.6} />
+      {/* badge ≈ half the doc — at 62% it swallowed the document at button size */}
+      <Icon name="check-circle" size={Math.max(9, Math.round(size * 0.5))} stroke={2.8} />
     </span>
   </span>
 );

package/vdp/VdpModules.tsx

@@ -1699,16 +1699,17 @@ export const FinanceDetailsModal: React.FunctionComponent<FinanceDetailsModalPro
 
             <div className="fin-price-grid">
               <div className="fin-rate-main">
+                {/* Figma Kaufen sheet: struck list price ABOVE the price, aligned to its right
+                    edge (inline-beside wraps — the 44px phone hero fills the whole column) */}
+                {isCash && listPrice != null && listPrice > price && (
+                  <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
+                    <s className="num fin-rate-old">{eur(listPrice)} €</s>
+                  </div>
+                )}
                 <div style={{ display: 'flex', alignItems: 'center', gap: 6 }}>
                   <span className="num" style={{ fontSize: 34, fontWeight: 800, color: 'var(--md-primary)', letterSpacing: '-1px' }}>
                     {isCash ? eur(price) : eur(Math.round(monthly))} €
                   </span>
-                  {/* Figma Kaufen sheet: struck list price top-right beside the big figure */}
-                  {isCash && listPrice != null && listPrice > price && (
-                    <span className="fin-rate-unit" style={{ alignSelf: 'flex-start', paddingTop: 2 }}>
-                      <s className="num fin-rate-old">{eur(listPrice)} €</s>
-                    </span>
-                  )}
                   {!isCash && (
                     <>
                       <span className="md-label-sm" style={{ fontWeight: 600, alignSelf: 'flex-end', paddingBottom: 5 }}>