@ambita/design-system 5.7.1-31.0 → 5.7.1-3101.0

package/dist/ambita-logo.svg

@@ -1,4 +1 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-  xml:space="preserve" preserveAspectRatio="xMinYMid meet" x="0px" y="0px"
-  viewBox="0 0 694.11 164.663" style="enable-background:new 0 0 694.11 164.663;" role="img"
-  aria-labelledby="ambita-logo-title"> <title id="ambita-logo-title">Ambita</title> <path fill="currentcolor" class="ambita-logo__svg__path" d="M101.071,48.106h-5.002c-5.439,0-9.889,4.451-9.889,9.892v0.155 c-8.794-6.17-19.177-10.047-30.702-10.047c-15.85,0-29.602,6.764-39.627,17.485C5.876,76.03,0.058,90.393,0.002,106.385 c0,0.078-0.002,0.156-0.002,0.236c0,15.848,5.827,30.302,15.85,41.022c10.025,10.493,23.778,17.02,39.627,17.02 c11.525,0,21.909-3.648,30.705-9.814c0.04,5.403,4.472,9.814,9.886,9.814h5.002c5.437,0,9.887-4.453,9.887-9.889V57.998 C110.958,52.558,106.507,48.106,101.071,48.106z M86.18,108.901c-0.508,8.609-3.876,16.153-9.021,21.729 c-5.595,5.826-13.522,9.089-21.681,9.089c-8.389,0-16.316-3.263-21.677-9.089c-5.595-6.063-8.859-14.453-8.859-24.009 c0-0.08,0.003-0.158,0.003-0.236c0.051-9.691,3.305-17.993,8.856-23.777c5.36-6.293,13.288-9.556,21.677-9.556 c8.159,0,16.086,3.263,21.681,9.556c5.145,5.36,8.513,12.888,9.021,21.68v2.098V108.901z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M281.806,48.106H150.147l0,0c-5.439,0-9.891,4.451-9.891,9.892v96.776 c0,5.436,4.451,9.889,9.891,9.889h4.999c5.439,0,9.89-4.453,9.89-9.889V72.887h38.551v81.888c0,5.436,4.451,9.889,9.89,9.889h4.999 c5.439,0,9.889-4.453,9.889-9.889V72.887h38.551v81.888c0,5.436,4.452,9.889,9.889,9.889h5.001c5.44,0,9.889-4.453,9.889-9.889 V57.998C291.695,52.558,287.247,48.106,281.806,48.106z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M684.222,48.106h-5.001c-5.44,0-9.889,4.451-9.889,9.892v0.155 c-8.794-6.17-19.178-10.047-30.702-10.047c-15.85,0-29.601,6.764-39.626,17.485c-9.976,10.438-15.791,24.801-15.848,40.793 c0,0.078-0.003,0.156-0.003,0.236c0,15.848,5.827,30.302,15.851,41.022c10.025,10.493,23.776,17.02,39.626,17.02 c11.525,0,21.908-3.648,30.702-9.814c0.041,5.403,4.475,9.814,9.889,9.814h5.001c5.438,0,9.889-4.453,9.889-9.889V57.998 C694.11,52.558,689.659,48.106,684.222,48.106z M669.332,108.907c-0.511,8.608-3.878,16.147-9.023,21.723 c-5.595,5.826-13.519,9.089-21.68,9.089c-8.391,0-16.315-3.263-21.679-9.089c-5.594-6.063-8.855-14.453-8.855-24.009 c0-0.08,0-0.158,0.003-0.236c0.051-9.691,3.305-17.993,8.852-23.777c5.363-6.293,13.288-9.556,21.679-9.556 c8.16,0,16.085,3.263,21.68,9.556c5.145,5.357,8.512,12.886,9.023,21.672v2.106V108.907z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M470.419,48.106h-5c-5.438,0-9.891,4.451-9.891,9.892v96.776c0,5.436,4.452,9.889,9.891,9.889h5 c5.439,0,9.889-4.453,9.889-9.889V57.998C480.308,52.558,475.857,48.106,470.419,48.106z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M433.659,106.385c-0.124-31.832-25.25-58.278-56.643-58.278c-11.422,0-22.608,3.731-31.234,9.792 l-0.008-46.522c0-5.437-4.448-9.889-9.888-9.889h-0.003h-4.998h-0.001c-5.439,0-9.889,4.452-9.889,9.889v143.398 c0,5.436,4.449,9.889,9.889,9.889h0.001h4.998h0.003c5.382,0,9.792-4.359,9.884-9.717c8.785,5.886,19.79,9.717,31.246,9.717 c31.471,0,56.647-26.575,56.647-58.042C433.662,106.541,433.659,106.463,433.659,106.385z M398.928,129.696 c-5.827,6.06-13.52,9.559-21.912,9.559c-8.623,0-16.084-3.499-21.911-9.559c-5.827-5.827-9.323-14.22-9.323-23.075 c0-0.08,0.001-0.158,0.001-0.236c0.059-9.232,3.542-17.532,9.322-23.311c5.827-6.06,13.288-9.559,21.911-9.559 c8.393,0,16.085,3.499,21.912,9.559c5.78,5.778,9.264,14.079,9.323,23.311c0,0.078,0.002,0.156,0.002,0.236 C408.253,115.477,404.758,123.869,398.928,129.696z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M565.793,48.106h-15.241v-36.73c0-5.437-4.45-9.889-9.889-9.889h-5.001 c-5.438,0-9.889,4.452-9.889,9.889v36.73h-15.241c-5.44,0-9.889,4.451-9.889,9.892v4.999c0,5.439,4.449,9.89,9.889,9.89h15.241 v81.888c0,5.436,4.451,9.889,9.889,9.889h5.001c5.438,0,9.889-4.453,9.889-9.889V72.887h15.241c5.44,0,9.889-4.45,9.889-9.89 v-4.999C575.682,52.558,571.233,48.106,565.793,48.106z"></path> <circle fill="currentcolor" class="ambita-logo__svg__path" cx="467.919" cy="13.877" r="13.878"></circle> </svg>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" preserveAspectRatio="xMinYMid meet" x="0px" y="0px" viewBox="0 0 694.11 164.663" style="enable-background:new 0 0 694.11 164.663;"> <path fill="currentcolor" class="ambita-logo__svg__path" d="M101.071,48.106h-5.002c-5.439,0-9.889,4.451-9.889,9.892v0.155 c-8.794-6.17-19.177-10.047-30.702-10.047c-15.85,0-29.602,6.764-39.627,17.485C5.876,76.03,0.058,90.393,0.002,106.385 c0,0.078-0.002,0.156-0.002,0.236c0,15.848,5.827,30.302,15.85,41.022c10.025,10.493,23.778,17.02,39.627,17.02 c11.525,0,21.909-3.648,30.705-9.814c0.04,5.403,4.472,9.814,9.886,9.814h5.002c5.437,0,9.887-4.453,9.887-9.889V57.998 C110.958,52.558,106.507,48.106,101.071,48.106z M86.18,108.901c-0.508,8.609-3.876,16.153-9.021,21.729 c-5.595,5.826-13.522,9.089-21.681,9.089c-8.389,0-16.316-3.263-21.677-9.089c-5.595-6.063-8.859-14.453-8.859-24.009 c0-0.08,0.003-0.158,0.003-0.236c0.051-9.691,3.305-17.993,8.856-23.777c5.36-6.293,13.288-9.556,21.677-9.556 c8.159,0,16.086,3.263,21.681,9.556c5.145,5.36,8.513,12.888,9.021,21.68v2.098V108.901z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M281.806,48.106H150.147l0,0c-5.439,0-9.891,4.451-9.891,9.892v96.776 c0,5.436,4.451,9.889,9.891,9.889h4.999c5.439,0,9.89-4.453,9.89-9.889V72.887h38.551v81.888c0,5.436,4.451,9.889,9.89,9.889h4.999 c5.439,0,9.889-4.453,9.889-9.889V72.887h38.551v81.888c0,5.436,4.452,9.889,9.889,9.889h5.001c5.44,0,9.889-4.453,9.889-9.889 V57.998C291.695,52.558,287.247,48.106,281.806,48.106z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M684.222,48.106h-5.001c-5.44,0-9.889,4.451-9.889,9.892v0.155 c-8.794-6.17-19.178-10.047-30.702-10.047c-15.85,0-29.601,6.764-39.626,17.485c-9.976,10.438-15.791,24.801-15.848,40.793 c0,0.078-0.003,0.156-0.003,0.236c0,15.848,5.827,30.302,15.851,41.022c10.025,10.493,23.776,17.02,39.626,17.02 c11.525,0,21.908-3.648,30.702-9.814c0.041,5.403,4.475,9.814,9.889,9.814h5.001c5.438,0,9.889-4.453,9.889-9.889V57.998 C694.11,52.558,689.659,48.106,684.222,48.106z M669.332,108.907c-0.511,8.608-3.878,16.147-9.023,21.723 c-5.595,5.826-13.519,9.089-21.68,9.089c-8.391,0-16.315-3.263-21.679-9.089c-5.594-6.063-8.855-14.453-8.855-24.009 c0-0.08,0-0.158,0.003-0.236c0.051-9.691,3.305-17.993,8.852-23.777c5.363-6.293,13.288-9.556,21.679-9.556 c8.16,0,16.085,3.263,21.68,9.556c5.145,5.357,8.512,12.886,9.023,21.672v2.106V108.907z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M470.419,48.106h-5c-5.438,0-9.891,4.451-9.891,9.892v96.776c0,5.436,4.452,9.889,9.891,9.889h5 c5.439,0,9.889-4.453,9.889-9.889V57.998C480.308,52.558,475.857,48.106,470.419,48.106z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M433.659,106.385c-0.124-31.832-25.25-58.278-56.643-58.278c-11.422,0-22.608,3.731-31.234,9.792 l-0.008-46.522c0-5.437-4.448-9.889-9.888-9.889h-0.003h-4.998h-0.001c-5.439,0-9.889,4.452-9.889,9.889v143.398 c0,5.436,4.449,9.889,9.889,9.889h0.001h4.998h0.003c5.382,0,9.792-4.359,9.884-9.717c8.785,5.886,19.79,9.717,31.246,9.717 c31.471,0,56.647-26.575,56.647-58.042C433.662,106.541,433.659,106.463,433.659,106.385z M398.928,129.696 c-5.827,6.06-13.52,9.559-21.912,9.559c-8.623,0-16.084-3.499-21.911-9.559c-5.827-5.827-9.323-14.22-9.323-23.075 c0-0.08,0.001-0.158,0.001-0.236c0.059-9.232,3.542-17.532,9.322-23.311c5.827-6.06,13.288-9.559,21.911-9.559 c8.393,0,16.085,3.499,21.912,9.559c5.78,5.778,9.264,14.079,9.323,23.311c0,0.078,0.002,0.156,0.002,0.236 C408.253,115.477,404.758,123.869,398.928,129.696z"></path> <path fill="currentcolor" class="ambita-logo__svg__path" d="M565.793,48.106h-15.241v-36.73c0-5.437-4.45-9.889-9.889-9.889h-5.001 c-5.438,0-9.889,4.452-9.889,9.889v36.73h-15.241c-5.44,0-9.889,4.451-9.889,9.892v4.999c0,5.439,4.449,9.89,9.889,9.89h15.241 v81.888c0,5.436,4.451,9.889,9.889,9.889h5.001c5.438,0,9.889-4.453,9.889-9.889V72.887h15.241c5.44,0,9.889-4.45,9.889-9.89 v-4.999C575.682,52.558,571.233,48.106,565.793,48.106z"></path> <circle fill="currentcolor" class="ambita-logo__svg__path" cx="467.919" cy="13.877" r="13.878"></circle> </svg>

package/dist/css/_tokens/_byggesoknaden.scss

@@ -1,7 +1,7 @@
 // Do not edit directly, this file was auto-generated.
 
-$amb-font-family-display-serif: 'Source Sans Pro', Arial, Helvetica, sans-serif;
-$amb-font-family-sans-serif: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+$amb-font-family-display-serif: PT Serif;
+$amb-font-family-sans-serif: Inter;
 $amb-font-weight-bold: 700;
 $amb-font-weight-medium: 500;
 $amb-font-weight-regular: 400;
@@ -32,7 +32,7 @@ $bs-color-red-3: #b74a40; // For UI
 $bs-color-white: #ffffff; // For marketing and UI
 $bs-color-yellow-1: #fefaed; // For UI
 $bs-color-yellow-2: #dfbb2c; // For UI
-$bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+$bs-font-family-bs-font: Source Sans pro;
 $bs-font-line-height-14: 14px;
 $bs-font-line-height-16: 16px;
 $bs-font-line-height-18: 18px;

package/dist/css/_tokens/byggesoknaden.css

@@ -3,8 +3,8 @@
  */
 
 :root {
-  --amb-font-family-display-serif: 'Source Sans Pro', Arial, Helvetica, sans-serif;
-  --amb-font-family-sans-serif: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --amb-font-family-display-serif: PT Serif;
+  --amb-font-family-sans-serif: Inter;
   --amb-font-weight-bold: 700;
   --amb-font-weight-medium: 500;
   --amb-font-weight-regular: 400;
@@ -35,7 +35,7 @@
   --bs-color-white: #ffffff; /** For marketing and UI */
   --bs-color-yellow-1: #fefaed; /** For UI */
   --bs-color-yellow-2: #dfbb2c; /** For UI */
-  --bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --bs-font-family-bs-font: Source Sans pro;
   --bs-font-line-height-14: 14px;
   --bs-font-line-height-16: 16px;
   --bs-font-line-height-18: 18px;
@@ -164,7 +164,7 @@
     --bs-color-red-3
   ); /** Fyllfarge for å bruke på en ramme for å indikere en feil. */
   --border-color-focus: var(
-    --bs-color-blue-5
+    --bs-color-blue-3
   ); /** Fyllfarge for å bruke på en ramme i interaktive komponenter som er i fokusert tilstand. */
   --border-color-input: var(
     --bs-color-grey-5
@@ -217,7 +217,7 @@
   ); /** Fyllfarge for høykontrast elementer i deaktivert tilstand. */
   --fill-error: var(--bs-color-red-1); /** Dempet fyllfarge som indikerer feilmelding. */
   --fill-error-stronger: var(--bs-color-red-2); /** Sterk fyllfarge som indikerer feilmelding. */
-  --fill-hover-default: var(--bs-color-blue-1); /** Fyllfarge for interaktive elementer */
+  --fill-hover-default: var(--bs-color-blue-2); /** Fyllfarge for interaktive elementer */
   --fill-info: var(--bs-color-blue-1); /** Dempet fyllfarge som indikerer nøytral informasjon. */
   --fill-info-stronger: var(
     --bs-color-blue-2

package/dist/css/_tokens/component-tokens.css

@@ -28,14 +28,7 @@
      TYPOGRAPHY TOKENS
      Global font settings that can be overridden per theme
      ======================================================================== */
-  --font-family-base: var(--font-family-sans-serif, 'Inter', Arial, Helvetica, sans-serif);
-  --font-family-display: var(
-    --font-family-display-serif,
-    'PT Serif',
-    Georgia,
-    'Times New Roman',
-    serif
-  );
+  --font-family-base: 'ff-din-round-web', sans-serif;
   /* ------------------------------------------------------------------------
     SHADOW TOKENS
     ------------------------------------------------------------------------ */
@@ -44,7 +37,7 @@
   --Shadow-Error: 0 0 0 2px var(--text-error);
   --Shadow-Dropdown: 0px 4px 8px 3px rgba(0, 0, 0, 0.05), 0px 1px 3px 0px rgba(85, 85, 85, 0.4);
   /* TagsInput Dropdown */
-  --tags-dropdown-max-height: 240px;
+  --tags-dropdown-max-height: 15rem;
   --tags-dropdown-separator-margin: 5px;
   --tags-dropdown-separator-height: 1px;
   /* TagsInput Dropdown Label */

package/dist/css/ambita-dark.css

@@ -3,8 +3,8 @@
  */
 
 :root {
-  --amb-font-family-display-serif: 'PT Serif', Georgia, 'Times New Roman', serif;
-  --amb-font-family-sans-serif: 'Inter', Arial, Helvetica, sans-serif;
+  --amb-font-family-display-serif: PT Serif;
+  --amb-font-family-sans-serif: Inter;
   --amb-font-weight-bold: 700;
   --amb-font-weight-medium: 500;
   --amb-font-weight-regular: 400;
@@ -35,7 +35,7 @@
   --bs-color-white: #ffffff; /** For marketing and UI */
   --bs-color-yellow-1: #fefaed; /** For UI */
   --bs-color-yellow-2: #dfbb2c; /** For UI */
-  --bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --bs-font-family-bs-font: Source Sans pro;
   --bs-font-line-height-14: 14px;
   --bs-font-line-height-16: 16px;
   --bs-font-line-height-18: 18px;

package/dist/css/ambita-dark.scss

@@ -6,9 +6,6 @@
  *
  * Usage:
  *   import '@ambita/design-system/dist/css/ambita-dark.css';
- *
- * Fonts: Add this to your HTML <head>:
- *   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet" />
  */
 
 /* Layer 0: Legacy SCSS Variables (for legacy Aux components) */

package/dist/css/ambita-light.css

@@ -3,8 +3,8 @@
  */
 
 :root {
-  --amb-font-family-display-serif: 'PT Serif', Georgia, 'Times New Roman', serif;
-  --amb-font-family-sans-serif: 'Inter', Arial, Helvetica, sans-serif;
+  --amb-font-family-display-serif: PT Serif;
+  --amb-font-family-sans-serif: Inter;
   --amb-font-weight-bold: 700;
   --amb-font-weight-medium: 500;
   --amb-font-weight-regular: 400;
@@ -35,7 +35,7 @@
   --bs-color-white: #ffffff; /** For marketing and UI */
   --bs-color-yellow-1: #fefaed; /** For UI */
   --bs-color-yellow-2: #dfbb2c; /** For UI */
-  --bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --bs-font-family-bs-font: Source Sans pro;
   --bs-font-line-height-14: 14px;
   --bs-font-line-height-16: 16px;
   --bs-font-line-height-18: 18px;

package/dist/css/ambita-light.scss

@@ -7,9 +7,6 @@
  * Usage:
  *   import '@ambita/design-system/dist/css/ambita-light.css';
  *
- * Fonts: Add this to your HTML <head>:
- *   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet" />
- *
  * This is the default theme for the design system.
  */
 

package/dist/css/ambita-old.css

@@ -3,8 +3,8 @@
  */
 
 :root {
-  --amb-font-family-display-serif: 'PT Serif', Georgia, 'Times New Roman', serif;
-  --amb-font-family-sans-serif: 'Inter', Arial, Helvetica, sans-serif;
+  --amb-font-family-display-serif: PT Serif;
+  --amb-font-family-sans-serif: Inter;
   --amb-font-weight-bold: 700;
   --amb-font-weight-medium: 500;
   --amb-font-weight-regular: 400;
@@ -35,7 +35,7 @@
   --bs-color-white: #ffffff; /** For marketing and UI */
   --bs-color-yellow-1: #fefaed; /** For UI */
   --bs-color-yellow-2: #dfbb2c; /** For UI */
-  --bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --bs-font-family-bs-font: Source Sans pro;
   --bs-font-line-height-14: 14px;
   --bs-font-line-height-16: 16px;
   --bs-font-line-height-18: 18px;

package/dist/css/ambita-old.scss

@@ -7,9 +7,6 @@
  * Usage:
  *   import '@ambita/design-system/dist/css/ambita-old.css';
  *
- * Fonts: DIN Round is not available on Google Fonts.
- * Host the font files and add @font-face declarations, or use the fallback (Arial).
- *
  * This theme maintains backwards compatibility with older designs.
  */
 

package/dist/css/byggesoknaden.css

@@ -3,8 +3,8 @@
  */
 
 :root {
-  --amb-font-family-display-serif: 'Source Sans Pro', Arial, Helvetica, sans-serif;
-  --amb-font-family-sans-serif: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --amb-font-family-display-serif: PT Serif;
+  --amb-font-family-sans-serif: Inter;
   --amb-font-weight-bold: 700;
   --amb-font-weight-medium: 500;
   --amb-font-weight-regular: 400;
@@ -35,7 +35,7 @@
   --bs-color-white: #ffffff; /** For marketing and UI */
   --bs-color-yellow-1: #fefaed; /** For UI */
   --bs-color-yellow-2: #dfbb2c; /** For UI */
-  --bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --bs-font-family-bs-font: Source Sans pro;
   --bs-font-line-height-14: 14px;
   --bs-font-line-height-16: 16px;
   --bs-font-line-height-18: 18px;

package/dist/css/byggesoknaden.scss

@@ -6,9 +6,6 @@
  *
  * Usage:
  *   import '@ambita/design-system/dist/css/byggesoknaden.css';
- *
- * Fonts: DIN Round is not available on Google Fonts.
- * Host the font files and add @font-face declarations, or use the fallback (Arial).
  */
 
 /* Layer 0: Legacy SCSS Variables (for legacy Aux components) */

package/dist/css/neo-mixins.scss

@@ -185,7 +185,7 @@
  * Dropdown item with icon indicator (for multi-select)
  * Adds padding-left to accommodate the indicator
  */
-@mixin dropdown-item-with-indicator($indicator-width: 40px) {
+@mixin dropdown-item-with-indicator($indicator-width: 2.5rem) {
   @include dropdown-item-base;
   padding-left: $indicator-width;
   display: flex;
@@ -196,7 +196,7 @@
  * Dropdown empty state
  * Shown when no items match search/filter
  */
-@mixin dropdown-empty($padding-y: 8px, $padding-x: 8px) {
+@mixin dropdown-empty($padding-y: 0.5rem, $padding-x: 0.5rem) {
   padding: $padding-y $padding-x;
   text-align: center;
   font-size: 16px;
@@ -207,7 +207,7 @@
  * Dropdown separator
  * Divides groups of items
  */
-@mixin dropdown-separator($margin-y: 0px) {
+@mixin dropdown-separator($margin-y: 0rem) {
   margin-top: $margin-y;
   margin-bottom: $margin-y;
   height: 1px;
@@ -218,7 +218,7 @@
  * Dropdown group label
  * Labels for grouped items
  */
-@mixin dropdown-label($padding-y: 8px, $padding-x: 12px) {
+@mixin dropdown-label($padding-y: 0.5rem, $padding-x: 0.75rem) {
   padding: $padding-y $padding-x;
   font-size: 14px;
   font-weight: 600;
@@ -382,7 +382,7 @@
 
   @keyframes slideInFromTop {
     from {
-      transform: translateY(-8px);
+      transform: translateY(-0.5rem);
     }
     to {
       transform: translateY(0);
@@ -391,7 +391,7 @@
 
   @keyframes slideInFromBottom {
     from {
-      transform: translateY(8px);
+      transform: translateY(0.5rem);
     }
     to {
       transform: translateY(0);
@@ -400,7 +400,7 @@
 
   @keyframes slideInFromLeft {
     from {
-      transform: translateX(-8px);
+      transform: translateX(-0.5rem);
     }
     to {
       transform: translateX(0);
@@ -409,135 +409,10 @@
 
   @keyframes slideInFromRight {
     from {
-      transform: translateX(8px);
+      transform: translateX(0.5rem);
     }
     to {
       transform: translateX(0);
     }
   }
 }
-
-/* ============================================================================
-   TYPOGRAPHY MIXINS
-   ============================================================================
-
-   Semantic typography mixins based on the Ambita design system.
-   These provide pre-composed text styles matching the design specifications.
-
-   Usage:
-   ```scss
-   @use '@/css/neo-mixins' as *;
-
-   .my-title {
-     @include heading-xxl-display;
-   }
-   ```
-
-   Heading styles:
-   - Display variants use PT Serif (--font-family-display)
-   - Regular variants use Inter (--font-family-base)
-============================================================================ */
-
-/* Heading XXL Display - PT Serif, 50px, weight 400, line-height 54px */
-@mixin heading-xxl-display {
-  font-family: var(--font-family-display);
-  font-size: var(--font-size-xxl);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-xxxl);
-}
-
-/* Heading XXL - Inter, 50px, weight 400, line-height 54px */
-@mixin heading-xxl {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-xxl);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-xxxl);
-}
-
-/* Heading XL Display - PT Serif, 30px, weight 400, line-height 34px */
-@mixin heading-xl-display {
-  font-family: var(--font-family-display);
-  font-size: var(--font-size-xl);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-xxl);
-}
-
-/* Heading XL - Inter, 30px, weight 500, line-height 34px */
-@mixin heading-xl {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-xl);
-  font-weight: var(--font-weight-medium);
-  line-height: var(--font-line-height-xxl);
-}
-
-/* Heading L - Inter, 22px, weight 500, line-height 26px */
-@mixin heading-l {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-l);
-  font-weight: var(--font-weight-medium);
-  line-height: var(--font-line-height-xl);
-}
-
-/* Heading L Link - Inter, 22px, weight 400, line-height 26px */
-@mixin heading-l-link {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-l);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-xl);
-}
-
-/* Heading M - Inter, 20px, weight 500, line-height 24px */
-@mixin heading-m {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-m);
-  font-weight: var(--font-weight-medium);
-  line-height: var(--font-line-height-l);
-}
-
-/* Heading S - Inter, 18px, weight 500, line-height 22px */
-@mixin heading-s {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-s);
-  font-weight: var(--font-weight-medium);
-  line-height: var(--font-line-height-m);
-}
-
-/* Body L - Inter, 18px, weight 400, line-height 26px */
-@mixin body-l {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-s);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-xl);
-}
-
-/* Body M - Inter, 16px, weight 400, line-height 22px */
-@mixin body-m {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-xs);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-m);
-}
-
-/* Body S - Inter, 14px, weight 400, line-height 19px */
-@mixin body-s {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-xxs);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-s);
-}
-
-/* Caption - Inter, 12px, weight 400, line-height 16px */
-@mixin caption {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-xxxs);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-xxs);
-}
-
-/* Label - Inter, 16px, weight 500, line-height 19px */
-@mixin label {
-  font-family: var(--font-family-base);
-  font-size: var(--font-size-xs);
-  font-weight: var(--font-weight-medium);
-  line-height: var(--font-line-height-s);
-}

package/dist/css/themes/_base/component-tokens.css

@@ -21,14 +21,7 @@
      Global font settings that can be overridden per theme
      ======================================================================== */
 
-  --font-family-base: var(--font-family-sans-serif, 'Inter', Arial, Helvetica, sans-serif);
-  --font-family-display: var(
-    --font-family-display-serif,
-    'PT Serif',
-    Georgia,
-    'Times New Roman',
-    serif
-  );
+  --font-family-base: 'ff-din-round-web', sans-serif;
 
   /* ========================================================================
      SHADOW TOKENS
@@ -50,7 +43,7 @@
   --tags-input-padding-x: 6px;
 
   /* TagsInput Dropdown */
-  --tags-dropdown-max-height: 240px;
+  --tags-dropdown-max-height: 15rem;
   --tags-dropdown-separator-margin: 5px;
   --tags-dropdown-separator-height: 1px;
 

package/dist/css/themes/ambita-dark/component-tokens.css

@@ -11,14 +11,7 @@
      Global font settings that can be overridden per theme
      ======================================================================== */
 
-  --font-family-base: var(--font-family-sans-serif, 'Inter', Arial, Helvetica, sans-serif);
-  --font-family-display: var(
-    --font-family-display-serif,
-    'PT Serif',
-    Georgia,
-    'Times New Roman',
-    serif
-  );
+  --font-family-base: 'ff-din-round-web', sans-serif;
 
   /* ========================================================================
      SHADOW TOKENS
@@ -40,7 +33,7 @@
   --tags-input-padding-x: 6px;
 
   /* TagsInput Dropdown */
-  --tags-dropdown-max-height: 240px;
+  --tags-dropdown-max-height: 15rem;
   --tags-dropdown-separator-margin: 5px;
   --tags-dropdown-separator-height: 1px;
 

package/dist/css/themes/ambita-dark/semantic-tokens.css

@@ -3,8 +3,8 @@
  */
 
 :root {
-  --amb-font-family-display-serif: 'PT Serif', Georgia, 'Times New Roman', serif;
-  --amb-font-family-sans-serif: 'Inter', Arial, Helvetica, sans-serif;
+  --amb-font-family-display-serif: PT Serif;
+  --amb-font-family-sans-serif: Inter;
   --amb-font-weight-bold: 700;
   --amb-font-weight-medium: 500;
   --amb-font-weight-regular: 400;
@@ -35,7 +35,7 @@
   --bs-color-white: #ffffff; /** For marketing and UI */
   --bs-color-yellow-1: #fefaed; /** For UI */
   --bs-color-yellow-2: #dfbb2c; /** For UI */
-  --bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --bs-font-family-bs-font: Source Sans pro;
   --bs-font-line-height-14: 14px;
   --bs-font-line-height-16: 16px;
   --bs-font-line-height-18: 18px;

package/dist/css/themes/ambita-light/component-tokens.css

@@ -13,14 +13,7 @@
      Global font settings that can be overridden per theme
      ======================================================================== */
 
-  --font-family-base: var(--font-family-sans-serif, 'Inter', Arial, Helvetica, sans-serif);
-  --font-family-display: var(
-    --font-family-display-serif,
-    'PT Serif',
-    Georgia,
-    'Times New Roman',
-    serif
-  );
+  --font-family-base: 'ff-din-round-web', sans-serif;
 
   /* ========================================================================
      SHADOW TOKENS
@@ -42,7 +35,7 @@
   --tags-input-padding-x: 6px;
 
   /* TagsInput Dropdown */
-  --tags-dropdown-max-height: 240px;
+  --tags-dropdown-max-height: 15rem;
   --tags-dropdown-separator-margin: 5px;
   --tags-dropdown-separator-height: 1px;
 

package/dist/css/themes/ambita-light/semantic-tokens.css

@@ -3,8 +3,8 @@
  */
 
 :root {
-  --amb-font-family-display-serif: 'PT Serif', Georgia, 'Times New Roman', serif;
-  --amb-font-family-sans-serif: 'Inter', Arial, Helvetica, sans-serif;
+  --amb-font-family-display-serif: PT Serif;
+  --amb-font-family-sans-serif: Inter;
   --amb-font-weight-bold: 700;
   --amb-font-weight-medium: 500;
   --amb-font-weight-regular: 400;
@@ -35,7 +35,7 @@
   --bs-color-white: #ffffff; /** For marketing and UI */
   --bs-color-yellow-1: #fefaed; /** For UI */
   --bs-color-yellow-2: #dfbb2c; /** For UI */
-  --bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --bs-font-family-bs-font: Source Sans pro;
   --bs-font-line-height-14: 14px;
   --bs-font-line-height-16: 16px;
   --bs-font-line-height-18: 18px;

package/dist/css/themes/ambita-old/component-tokens.css

@@ -13,8 +13,7 @@
      Global font settings that can be overridden per theme
      ======================================================================== */
 
-  --font-family-base: var(--font-family-sans-serif, 'Inter', Arial, Helvetica, sans-serif);
-  --font-family-display: var(--font-family-sans-serif, 'Inter', Arial, Helvetica, sans-serif);
+  --font-family-base: 'ff-din-round-web', sans-serif;
 
   /* ========================================================================
      SHADOW TOKENS
@@ -36,7 +35,7 @@
   --tags-input-padding-x: 6px;
 
   /* TagsInput Dropdown */
-  --tags-dropdown-max-height: 240px;
+  --tags-dropdown-max-height: 15rem;
   --tags-dropdown-separator-margin: 5px;
   --tags-dropdown-separator-height: 1px;
 

package/dist/css/themes/ambita-old/semantic-tokens.css

@@ -3,8 +3,8 @@
  */
 
 :root {
-  --amb-font-family-display-serif: 'PT Serif', Georgia, 'Times New Roman', serif;
-  --amb-font-family-sans-serif: 'Inter', Arial, Helvetica, sans-serif;
+  --amb-font-family-display-serif: PT Serif;
+  --amb-font-family-sans-serif: Inter;
   --amb-font-weight-bold: 700;
   --amb-font-weight-medium: 500;
   --amb-font-weight-regular: 400;
@@ -35,7 +35,7 @@
   --bs-color-white: #ffffff; /** For marketing and UI */
   --bs-color-yellow-1: #fefaed; /** For UI */
   --bs-color-yellow-2: #dfbb2c; /** For UI */
-  --bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --bs-font-family-bs-font: Source Sans pro;
   --bs-font-line-height-14: 14px;
   --bs-font-line-height-16: 16px;
   --bs-font-line-height-18: 18px;

package/dist/css/themes/byggesoknaden/component-tokens.css

@@ -11,20 +11,7 @@
        Global font settings that can be overridden per theme
        ======================================================================== */
 
-  --font-family-base: var(
-    --font-family-sans-serif,
-    'Source Sans Pro',
-    Arial,
-    Helvetica,
-    sans-serif
-  );
-  --font-family-display: var(
-    --font-family-display-serif,
-    'Source Sans Pro',
-    Arial,
-    Helvetica,
-    sans-serif
-  );
+  --font-family-base: 'ff-din-round-web', sans-serif;
 
   /* ========================================================================
        SHADOW TOKENS
@@ -46,7 +33,7 @@
   --tags-input-padding-x: 6px;
 
   /* TagsInput Dropdown */
-  --tags-dropdown-max-height: 240px;
+  --tags-dropdown-max-height: 15rem;
   --tags-dropdown-separator-margin: 5px;
   --tags-dropdown-separator-height: 1px;
 

package/dist/css/themes/byggesoknaden/semantic-tokens.css

@@ -3,8 +3,8 @@
  */
 
 :root {
-  --amb-font-family-display-serif: 'Source Sans Pro', Arial, Helvetica, sans-serif;
-  --amb-font-family-sans-serif: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --amb-font-family-display-serif: PT Serif;
+  --amb-font-family-sans-serif: Inter;
   --amb-font-weight-bold: 700;
   --amb-font-weight-medium: 500;
   --amb-font-weight-regular: 400;
@@ -35,7 +35,7 @@
   --bs-color-white: #ffffff; /** For marketing and UI */
   --bs-color-yellow-1: #fefaed; /** For UI */
   --bs-color-yellow-2: #dfbb2c; /** For UI */
-  --bs-font-family-bs-font: 'Source Sans Pro', Arial, Helvetica, sans-serif;
+  --bs-font-family-bs-font: Source Sans pro;
   --bs-font-line-height-14: 14px;
   --bs-font-line-height-16: 16px;
   --bs-font-line-height-18: 18px;