@bytebrand/fe-ui-core-autobahn 1.0.148 → 1.0.149

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytebrand/fe-ui-core-autobahn",
-  "version": "1.0.148",
+  "version": "1.0.149",
   "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/theme/md3.css

@@ -5446,6 +5446,24 @@ line-height: 31px;
     order: -1;
     align-self: flex-end;
   }
+  /* ...but without adding a line to the price row: the struck UVP overlays the empty space
+     above the (52px on a 58px line) Kaufen figure, right-aligned over it — so Kaufen's hero is
+     exactly as tall as the Finanzierung/Leasing one (15px Figma gap from the tab underline to
+     the figure on every tab, nothing below it moves on a tab switch; see .cc-hero-stack). */
+  .md3 .cc-price .pp-hero--buy .pp-hero-rate {
+    position: relative;
+  }
+  .md3 .cc-price .pp-hero--buy .pp-hero-unit-group {
+    position: absolute;
+    right: 0;
+    bottom: calc(100% - 11px);
+  }
+  /* nudge the Kaufen figure 3px down (visual only, layout untouched) so the overlaid struck UVP
+     line clears its glyph tops */
+  .md3 .cc-price .pp-hero--buy .pp-hero-val {
+    position: relative;
+    top: 3px;
+  }
   /* Kaufen hero price on mobile — was falling through to the generic (rate-sized) .pp-hero-val
      above (65px, shrinking only via the rate-digit len4/5/6 classes cardParts.tsx never applies
      in Kaufen mode), so real purchase prices had no digit-based shrink at all here and could
@@ -6590,8 +6608,13 @@ line-height: 31px;
      Both capped to the fixed inset:0 scrim's CURRENT visible height (%, not vh — on iOS Safari
      100vh > the visible area while the toolbar shows, which pushed the sheet's top off-screen). */
   .md3 .fin-modal {
+    /* room under the fold for whatever overlays the bottom of the screen: the home-indicator
+       inset, and on iOS (WebKit only: -webkit-touch-callout) Safari's floating bottom toolbar,
+       which sits ON TOP of fixed content — without it the "Finanzierungs-Details" link ended up
+       hidden behind the toolbar. */
+    --fin-sheet-bottom-gap: env(safe-area-inset-bottom, 0px);
     max-width: none;
-    height: min(var(--fin-sheet-fold, 85vh), calc(100% - 24px));
+    height: min(calc(var(--fin-sheet-fold, 85vh) + var(--fin-sheet-bottom-gap)), calc(100% - 24px));
     max-height: none;
     background: #FFFFFF;
     box-shadow: 0px -4px 18px rgba(0, 0, 0, 0.13);
@@ -6601,6 +6624,14 @@ line-height: 31px;
   .md3 .fin-modal.fin-modal--expanded {
     height: calc(100% - 24px);
   }
+  .md3 .fin-modal .fin-modal-body {
+    padding-bottom: calc(13px + var(--fin-sheet-bottom-gap));
+  }
+  @supports (-webkit-touch-callout: none) {
+    .md3 .fin-modal {
+      --fin-sheet-bottom-gap: max(env(safe-area-inset-bottom, 0px), 64px);
+    }
+  }
   /* set from the frame after the first fold measure (not on open — no 85vh -> fold shrink) */
   .md3 .fin-modal.fin-modal--animated {
     transition: height 0.35s var(--ease-standard, ease);