rk-designsystem 1.2.5 → 1.3.0

package/dist/componentlibrary.es.js

@@ -1,87 +1,95 @@
-import { jsx as t, jsxs as r, Fragment as Ge } from "react/jsx-runtime";
-import Le, { forwardRef as se, useState as Z, useContext as We, createContext as Ze, useEffect as R, useMemo as he, useCallback as ae, useRef as Xe } from "react";
-import { Alert as Je, Avatar as Qe, BadgePosition as et, Badge as tt, Breadcrumbs as nt, BreadcrumbsItem as ot, BreadcrumbsLink as rt, BreadcrumbsList as at, Button as Ae, Card as st, CardBlock as it, Checkbox as lt, useCheckboxGroup as dt, Fieldset as He, Chip as ct, Spinner as pt, Details as mt, Dialog as gt, Divider as ut, Dropdown as ht, DropdownButton as ft, DropdownHeading as kt, DropdownItem as vt, DropdownList as bt, DropdownTrigger as yt, DropdownTriggerContext as xt, ErrorSummary as Tt, Field as Ct, FieldCounter as wt, FieldDescription as St, Heading as It, Input as _t, Label as Dt, Link as Lt, List as At, Pagination as Nt, PaginationButton as Mt, PaginationItem as jt, PaginationList as Ft, usePagination as Bt, Paragraph as Et, Popover as Pt, Radio as $t, useRadioGroup as zt, Search as Rt, SearchInput as Gt, SearchClear as Wt, SearchButton as Ht, Select as Ut, Skeleton as Vt, SkipLink as Ot, EXPERIMENTAL_Suggestion as Kt, Switch as qt, Table as Yt, Tabs as Zt, Tag as Xt, Textarea as Jt, Textfield as Qt, ToggleGroup as en, Tooltip as tn, ValidationMessage as nn } from "@digdir/designsystemet-react";
-import { startOfMonth as ge, isValid as Se, isSameMonth as Me, startOfWeek as Ue, format as fe, addDays as Ve, subMonths as on, addMonths as rn, isSameDay as an, isToday as sn, eachDayOfInterval as ln } from "date-fns";
-import dn from "embla-carousel-react";
-import { ChevronLeftIcon as cn, ChevronRightIcon as pn, ChevronDownIcon as je, XMarkIcon as Fe, MagnifyingGlassIcon as Be, MenuHamburgerIcon as mn, HeartIcon as gn } from "@navikt/aksel-icons";
-const un = se((n, e) => /* @__PURE__ */ t(Je, { ref: e, ...n }));
-un.displayName = "Alert";
-const Oe = se((n, e) => /* @__PURE__ */ t(Qe, { ref: e, ...n }));
-Oe.displayName = "Avatar";
-const hn = se((n, e) => /* @__PURE__ */ t(tt, { ref: e, ...n }));
-hn.displayName = "Badge";
-const Us = et, Vs = nt, Os = at, Ks = ot, qs = rt, de = se(function({ variant: e, ...a }, d) {
-  return /* @__PURE__ */ t(Ae, { ref: d, variant: e, ...a });
+import { jsx as t, jsxs as r, Fragment as tt } from "react/jsx-runtime";
+import ye, { forwardRef as me, useState as Z, useContext as nt, createContext as pt, useEffect as U, useRef as Ee, useMemo as Ae, useCallback as ce, useId as We } from "react";
+import { Heading as mt, Alert as gt, Avatar as ut, BadgePosition as ht, Badge as ft, Breadcrumbs as kt, BreadcrumbsItem as vt, BreadcrumbsLink as bt, BreadcrumbsList as yt, Button as Ge, Card as xt, CardBlock as Tt, Checkbox as Ct, useCheckboxGroup as wt, Fieldset as ot, Chip as St, Spinner as _t, Details as It, Dialog as Lt, Divider as Dt, Dropdown as Mt, DropdownButton as jt, DropdownHeading as At, DropdownItem as Nt, DropdownList as Et, DropdownTrigger as Bt, DropdownTriggerContext as Ft, ErrorSummary as Pt, Field as $t, FieldCounter as zt, FieldDescription as Rt, Input as Gt, Label as Ht, Link as Wt, List as Ut, Pagination as Vt, PaginationButton as Ot, PaginationItem as Kt, PaginationList as Zt, usePagination as qt, Paragraph as Yt, Popover as Xt, Radio as Jt, useRadioGroup as Qt, Search as en, SearchInput as tn, SearchClear as nn, SearchButton as on, Select as rn, Skeleton as an, SkipLink as sn, EXPERIMENTAL_Suggestion as ln, Switch as dn, Table as cn, Tabs as pn, Tag as mn, Textarea as gn, Textfield as un, ToggleGroup as hn, Tooltip as fn, ValidationMessage as kn } from "@digdir/designsystemet-react";
+import { startOfMonth as be, isValid as De, isSameMonth as Fe, format as ve, startOfWeek as He, addDays as Ce, subMonths as Ve, addMonths as Oe, endOfWeek as vn, isSameDay as Ke, isToday as bn, eachDayOfInterval as yn, getDaysInMonth as xn, setDate as Tn, parse as Cn } from "date-fns";
+import wn from "embla-carousel-react";
+import { ChevronLeftIcon as Sn, ChevronRightIcon as _n, PlayIcon as In, PauseIcon as Ln, ChevronDownIcon as Ze, XMarkIcon as qe, MagnifyingGlassIcon as Ye, MenuHamburgerIcon as Dn, HeartIcon as Mn } from "@navikt/aksel-icons";
+const rt = me((n, e) => /* @__PURE__ */ t(mt, { ref: e, ...n }));
+rt.displayName = "Heading";
+const jn = me((n, e) => {
+  const { title: a, titleLevel: c, children: k, ...y } = n;
+  return /* @__PURE__ */ r(gt, { ref: e, ...y, children: [
+    a && (c ? /* @__PURE__ */ t(rt, { level: c, "data-size": "2xs", style: { marginBottom: "var(--ds-size-1)" }, children: a }) : /* @__PURE__ */ t("p", { className: "ds-heading", "data-size": "2xs", style: { marginBottom: "var(--ds-size-1)" }, children: a })),
+    k
+  ] });
 });
-de.displayName = "Button";
-const fn = st, Ys = it;
-fn.displayName = "Card";
-const kn = lt, vn = He, Zs = dt;
-kn.displayName = "Checkbox";
-vn.displayName = "Fieldset";
-const Xs = ct;
-function Ie(n) {
+jn.displayName = "Alert";
+const at = me((n, e) => /* @__PURE__ */ t(ut, { ref: e, ...n }));
+at.displayName = "Avatar";
+const An = me((n, e) => /* @__PURE__ */ t(ft, { ref: e, ...n }));
+An.displayName = "Badge";
+const gi = ht, ui = kt, hi = yt, fi = vt, ki = bt, fe = me(function({ variant: e, ...a }, c) {
+  return /* @__PURE__ */ t(Ge, { ref: c, variant: e, ...a });
+});
+fe.displayName = "Button";
+const Nn = xt, vi = Tt;
+Nn.displayName = "Card";
+const En = Ct, Bn = ot, bi = wt;
+En.displayName = "Checkbox";
+Bn.displayName = "Fieldset";
+const yi = St;
+function $e(n) {
   return (e = {}) => {
     const a = e.width ? String(e.width) : n.defaultWidth;
     return n.formats[a] || n.formats[n.defaultWidth];
   };
 }
-function ke(n) {
+function _e(n) {
   return (e, a) => {
-    const d = a != null && a.context ? String(a.context) : "standalone";
-    let h;
-    if (d === "formatting" && n.formattingValues) {
-      const u = n.defaultFormattingWidth || n.defaultWidth, v = a != null && a.width ? String(a.width) : u;
-      h = n.formattingValues[v] || n.formattingValues[u];
+    const c = a != null && a.context ? String(a.context) : "standalone";
+    let k;
+    if (c === "formatting" && n.formattingValues) {
+      const f = n.defaultFormattingWidth || n.defaultWidth, x = a != null && a.width ? String(a.width) : f;
+      k = n.formattingValues[x] || n.formattingValues[f];
     } else {
-      const u = n.defaultWidth, v = a != null && a.width ? String(a.width) : n.defaultWidth;
-      h = n.values[v] || n.values[u];
+      const f = n.defaultWidth, x = a != null && a.width ? String(a.width) : n.defaultWidth;
+      k = n.values[x] || n.values[f];
     }
-    const k = n.argumentCallback ? n.argumentCallback(e) : e;
-    return h[k];
+    const y = n.argumentCallback ? n.argumentCallback(e) : e;
+    return k[y];
   };
 }
-function ve(n) {
+function Ie(n) {
   return (e, a = {}) => {
-    const d = a.width, h = d && n.matchPatterns[d] || n.matchPatterns[n.defaultMatchWidth], k = e.match(h);
-    if (!k)
+    const c = a.width, k = c && n.matchPatterns[c] || n.matchPatterns[n.defaultMatchWidth], y = e.match(k);
+    if (!y)
       return null;
-    const u = k[0], v = d && n.parsePatterns[d] || n.parsePatterns[n.defaultParseWidth], M = Array.isArray(v) ? yn(v, (I) => I.test(u)) : (
+    const f = y[0], x = c && n.parsePatterns[c] || n.parsePatterns[n.defaultParseWidth], B = Array.isArray(x) ? Pn(x, (L) => L.test(f)) : (
       // [TODO] -- I challenge you to fix the type
-      bn(v, (I) => I.test(u))
+      Fn(x, (L) => L.test(f))
     );
-    let C;
-    C = n.valueCallback ? n.valueCallback(M) : M, C = a.valueCallback ? (
+    let I;
+    I = n.valueCallback ? n.valueCallback(B) : B, I = a.valueCallback ? (
       // [TODO] -- I challenge you to fix the type
-      a.valueCallback(C)
-    ) : C;
-    const G = e.slice(u.length);
-    return { value: C, rest: G };
+      a.valueCallback(I)
+    ) : I;
+    const J = e.slice(f.length);
+    return { value: I, rest: J };
   };
 }
-function bn(n, e) {
+function Fn(n, e) {
   for (const a in n)
     if (Object.prototype.hasOwnProperty.call(n, a) && e(n[a]))
       return a;
 }
-function yn(n, e) {
+function Pn(n, e) {
   for (let a = 0; a < n.length; a++)
     if (e(n[a]))
       return a;
 }
-function xn(n) {
+function $n(n) {
   return (e, a = {}) => {
-    const d = e.match(n.matchPattern);
-    if (!d) return null;
-    const h = d[0], k = e.match(n.parsePattern);
-    if (!k) return null;
-    let u = n.valueCallback ? n.valueCallback(k[0]) : k[0];
-    u = a.valueCallback ? a.valueCallback(u) : u;
-    const v = e.slice(h.length);
-    return { value: u, rest: v };
+    const c = e.match(n.matchPattern);
+    if (!c) return null;
+    const k = c[0], y = e.match(n.parsePattern);
+    if (!y) return null;
+    let f = n.valueCallback ? n.valueCallback(y[0]) : y[0];
+    f = a.valueCallback ? a.valueCallback(f) : f;
+    const x = e.slice(k.length);
+    return { value: f, rest: x };
   };
 }
-const Tn = {
+const zn = {
   lessThanXSeconds: {
     one: "mindre enn ett sekund",
     other: "mindre enn {{count}} sekunder"
@@ -143,54 +151,54 @@ const Tn = {
     one: "nesten ett år",
     other: "nesten {{count}} år"
   }
-}, Cn = (n, e, a) => {
-  let d;
-  const h = Tn[n];
-  return typeof h == "string" ? d = h : e === 1 ? d = h.one : d = h.other.replace("{{count}}", String(e)), a != null && a.addSuffix ? a.comparison && a.comparison > 0 ? "om " + d : d + " siden" : d;
-}, wn = {
+}, Rn = (n, e, a) => {
+  let c;
+  const k = zn[n];
+  return typeof k == "string" ? c = k : e === 1 ? c = k.one : c = k.other.replace("{{count}}", String(e)), a != null && a.addSuffix ? a.comparison && a.comparison > 0 ? "om " + c : c + " siden" : c;
+}, Gn = {
   full: "EEEE d. MMMM y",
   long: "d. MMMM y",
   medium: "d. MMM y",
   short: "dd.MM.y"
-}, Sn = {
+}, Hn = {
   full: "'kl'. HH:mm:ss zzzz",
   long: "HH:mm:ss z",
   medium: "HH:mm:ss",
   short: "HH:mm"
-}, In = {
+}, Wn = {
   full: "{{date}} 'kl.' {{time}}",
   long: "{{date}} 'kl.' {{time}}",
   medium: "{{date}} {{time}}",
   short: "{{date}} {{time}}"
-}, _n = {
-  date: Ie({
-    formats: wn,
+}, Un = {
+  date: $e({
+    formats: Gn,
     defaultWidth: "full"
   }),
-  time: Ie({
-    formats: Sn,
+  time: $e({
+    formats: Hn,
     defaultWidth: "full"
   }),
-  dateTime: Ie({
-    formats: In,
+  dateTime: $e({
+    formats: Wn,
     defaultWidth: "full"
   })
-}, Dn = {
+}, Vn = {
   lastWeek: "'forrige' eeee 'kl.' p",
   yesterday: "'i går kl.' p",
   today: "'i dag kl.' p",
   tomorrow: "'i morgen kl.' p",
   nextWeek: "EEEE 'kl.' p",
   other: "P"
-}, Ln = (n, e, a, d) => Dn[n], An = {
+}, On = (n, e, a, c) => Vn[n], Kn = {
   narrow: ["f.Kr.", "e.Kr."],
   abbreviated: ["f.Kr.", "e.Kr."],
   wide: ["før Kristus", "etter Kristus"]
-}, Nn = {
+}, Zn = {
   narrow: ["1", "2", "3", "4"],
   abbreviated: ["Q1", "Q2", "Q3", "Q4"],
   wide: ["1. kvartal", "2. kvartal", "3. kvartal", "4. kvartal"]
-}, Mn = {
+}, qn = {
   narrow: ["J", "F", "M", "A", "M", "J", "J", "A", "S", "O", "N", "D"],
   abbreviated: [
     "jan.",
@@ -220,7 +228,7 @@ const Tn = {
     "november",
     "desember"
   ]
-}, jn = {
+}, Yn = {
   narrow: ["S", "M", "T", "O", "T", "F", "L"],
   short: ["sø", "ma", "ti", "on", "to", "fr", "lø"],
   abbreviated: ["søn", "man", "tir", "ons", "tor", "fre", "lør"],
@@ -233,7 +241,7 @@ const Tn = {
     "fredag",
     "lørdag"
   ]
-}, Fn = {
+}, Xn = {
   narrow: {
     am: "a",
     pm: "p",
@@ -264,46 +272,46 @@ const Tn = {
     evening: "på kvelden",
     night: "på natten"
   }
-}, Bn = (n, e) => Number(n) + ".", En = {
-  ordinalNumber: Bn,
-  era: ke({
-    values: An,
+}, Jn = (n, e) => Number(n) + ".", Qn = {
+  ordinalNumber: Jn,
+  era: _e({
+    values: Kn,
     defaultWidth: "wide"
   }),
-  quarter: ke({
-    values: Nn,
+  quarter: _e({
+    values: Zn,
     defaultWidth: "wide",
     argumentCallback: (n) => n - 1
   }),
-  month: ke({
-    values: Mn,
+  month: _e({
+    values: qn,
     defaultWidth: "wide"
   }),
-  day: ke({
-    values: jn,
+  day: _e({
+    values: Yn,
     defaultWidth: "wide"
   }),
-  dayPeriod: ke({
-    values: Fn,
+  dayPeriod: _e({
+    values: Xn,
     defaultWidth: "wide"
   })
-}, Pn = /^(\d+)\.?/i, $n = /\d+/i, zn = {
+}, eo = /^(\d+)\.?/i, to = /\d+/i, no = {
   narrow: /^(f\.? ?Kr\.?|fvt\.?|e\.? ?Kr\.?|evt\.?)/i,
   abbreviated: /^(f\.? ?Kr\.?|fvt\.?|e\.? ?Kr\.?|evt\.?)/i,
   wide: /^(før Kristus|før vår tid|etter Kristus|vår tid)/i
-}, Rn = {
+}, oo = {
   any: [/^f/i, /^e/i]
-}, Gn = {
+}, ro = {
   narrow: /^[1234]/i,
   abbreviated: /^q[1234]/i,
   wide: /^[1234](\.)? kvartal/i
-}, Wn = {
+}, ao = {
   any: [/1/i, /2/i, /3/i, /4/i]
-}, Hn = {
+}, so = {
   narrow: /^[jfmasond]/i,
   abbreviated: /^(jan|feb|mars?|apr|mai|juni?|juli?|aug|sep|okt|nov|des)\.?/i,
   wide: /^(januar|februar|mars|april|mai|juni|juli|august|september|oktober|november|desember)/i
-}, Un = {
+}, io = {
   narrow: [
     /^j/i,
     /^f/i,
@@ -332,17 +340,17 @@ const Tn = {
     /^n/i,
     /^d/i
   ]
-}, Vn = {
+}, lo = {
   narrow: /^[smtofl]/i,
   short: /^(sø|ma|ti|on|to|fr|lø)/i,
   abbreviated: /^(søn|man|tir|ons|tor|fre|lør)/i,
   wide: /^(søndag|mandag|tirsdag|onsdag|torsdag|fredag|lørdag)/i
-}, On = {
+}, co = {
   any: [/^s/i, /^m/i, /^ti/i, /^o/i, /^to/i, /^f/i, /^l/i]
-}, Kn = {
+}, po = {
   narrow: /^(midnatt|middag|(på) (morgenen|ettermiddagen|kvelden|natten)|[ap])/i,
   any: /^([ap]\.?\s?m\.?|midnatt|middag|(på) (morgenen|ettermiddagen|kvelden|natten))/i
-}, qn = {
+}, mo = {
   any: {
     am: /^a(\.?\s?m\.?)?$/i,
     pm: /^p(\.?\s?m\.?)?$/i,
@@ -353,55 +361,55 @@ const Tn = {
     evening: /kveld/i,
     night: /natt/i
   }
-}, Yn = {
-  ordinalNumber: xn({
-    matchPattern: Pn,
-    parsePattern: $n,
+}, go = {
+  ordinalNumber: $n({
+    matchPattern: eo,
+    parsePattern: to,
     valueCallback: (n) => parseInt(n, 10)
   }),
-  era: ve({
-    matchPatterns: zn,
+  era: Ie({
+    matchPatterns: no,
     defaultMatchWidth: "wide",
-    parsePatterns: Rn,
+    parsePatterns: oo,
     defaultParseWidth: "any"
   }),
-  quarter: ve({
-    matchPatterns: Gn,
+  quarter: Ie({
+    matchPatterns: ro,
     defaultMatchWidth: "wide",
-    parsePatterns: Wn,
+    parsePatterns: ao,
     defaultParseWidth: "any",
     valueCallback: (n) => n + 1
   }),
-  month: ve({
-    matchPatterns: Hn,
+  month: Ie({
+    matchPatterns: so,
     defaultMatchWidth: "wide",
-    parsePatterns: Un,
+    parsePatterns: io,
     defaultParseWidth: "any"
   }),
-  day: ve({
-    matchPatterns: Vn,
+  day: Ie({
+    matchPatterns: lo,
     defaultMatchWidth: "wide",
-    parsePatterns: On,
+    parsePatterns: co,
     defaultParseWidth: "any"
   }),
-  dayPeriod: ve({
-    matchPatterns: Kn,
+  dayPeriod: Ie({
+    matchPatterns: po,
     defaultMatchWidth: "any",
-    parsePatterns: qn,
+    parsePatterns: mo,
     defaultParseWidth: "any"
   })
-}, ue = {
+}, he = {
   code: "nb",
-  formatDistance: Cn,
-  formatLong: _n,
-  formatRelative: Ln,
-  localize: En,
-  match: Yn,
+  formatDistance: Rn,
+  formatLong: Un,
+  formatRelative: On,
+  localize: Qn,
+  match: go,
   options: {
     weekStartsOn: 1,
     firstWeekContainsDate: 4
   }
-}, Ke = ({ title: n, ...e }) => /* @__PURE__ */ r(
+}, st = ({ title: n, ...e }) => /* @__PURE__ */ r(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -426,8 +434,8 @@ const Tn = {
     ]
   }
 );
-Ke.displayName = "ChevronLeftIcon";
-const qe = ({ title: n, ...e }) => /* @__PURE__ */ r(
+st.displayName = "ChevronLeftIcon";
+const it = ({ title: n, ...e }) => /* @__PURE__ */ r(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -452,20 +460,21 @@ const qe = ({ title: n, ...e }) => /* @__PURE__ */ r(
     ]
   }
 );
-qe.displayName = "ChevronRightIcon";
-const Zn = "_calendarContainer_htlea_1", Xn = "_calendarHeader_htlea_16", Jn = "_monthYear_htlea_23", Qn = "_navigationButtons_htlea_34", eo = "_grid_htlea_43", to = "_dayNameCell_htlea_51", no = "_dateCell_htlea_69", oo = "_dateNumberContainer_htlea_95", ro = "_otherMonth_htlea_108", ao = "_disabled_htlea_108", so = "_selectedDate_htlea_134", oe = {
-  calendarContainer: Zn,
-  calendarHeader: Xn,
-  monthYear: Jn,
-  navigationButtons: Qn,
-  grid: eo,
-  dayNameCell: to,
-  dateCell: no,
-  dateNumberContainer: oo,
-  otherMonth: ro,
-  disabled: ao,
-  selectedDate: so
-}, io = {
+it.displayName = "ChevronRightIcon";
+const uo = "_calendarContainer_1ukqo_1", ho = "_calendarHeader_1ukqo_16", fo = "_monthYear_1ukqo_23", ko = "_navigationButtons_1ukqo_34", vo = "_gridWrapper_1ukqo_43", bo = "_gridRow_1ukqo_48", yo = "_dayNameCell_1ukqo_55", xo = "_dateCell_1ukqo_73", To = "_dateNumberContainer_1ukqo_106", Co = "_otherMonth_1ukqo_119", wo = "_disabled_1ukqo_119", So = "_selectedDate_1ukqo_145", de = {
+  calendarContainer: uo,
+  calendarHeader: ho,
+  monthYear: fo,
+  navigationButtons: ko,
+  gridWrapper: vo,
+  gridRow: bo,
+  dayNameCell: yo,
+  dateCell: xo,
+  dateNumberContainer: To,
+  otherMonth: Co,
+  disabled: wo,
+  selectedDate: So
+}, _o = {
   NO: {
     // Header
     header: {
@@ -486,6 +495,7 @@ const Zn = "_calendarContainer_htlea_1", Xn = "_calendarHeader_htlea_16", Jn = "
       suggestions: "Forslag til søk",
       viewAll: "Vis alle resultater",
       noResults: "Ingen treff funnet for",
+      suggestionCount: "{count} forslag",
       selectLanguage: "Velg språk",
       homeAriaLabel: "Norges Røde Kors Hjem",
       nav: {
@@ -493,6 +503,7 @@ const Zn = "_calendarContainer_htlea_1", Xn = "_calendarHeader_htlea_16", Jn = "
         components: "Komponenter",
         code: "Kode",
         tokens: "Tokens",
+        skipToContent: "Hopp til hovedinnhold",
         work: "Vårt arbeid",
         volunteer: "Bli frivillig",
         courses: "Kurs og opplæring"
@@ -502,6 +513,16 @@ const Zn = "_calendarContainer_htlea_1", Xn = "_calendarHeader_htlea_16", Jn = "
     home: {
       heroTitle: "Røde Kors Designsystem",
       heroLead: "Felles komponentbibliotek og retningslinjer for design og utvikling av digitale løsninger i Røde Kors.",
+      hero: {
+        kicker: "For designere og utviklere",
+        title: "Ett felles designspråk for Røde Kors",
+        lead: "Ferdige React-komponenter, designtokens og retningslinjer — bygget på Digdir Designsystemet og tilpasset Røde Kors sin visuelle identitet.",
+        primaryCta: "Kom i gang",
+        secondaryCta: "Utforsk komponenter",
+        specimenButton: "Bli frivillig",
+        breadcrumbLabel: "Du er her",
+        breadcrumbHome: "Hjem"
+      },
       searchComponents: "Søk i komponenter",
       exploreSystem: "Utforsk systemet",
       componentsDesc: "Bibliotek med ferdige React-komponenter.",
@@ -510,6 +531,11 @@ const Zn = "_calendarContainer_htlea_1", Xn = "_calendarHeader_htlea_16", Jn = "
       tokensDesc: "Design tokens, farger og spacing.",
       universalDesign: "Universell utforming",
       universalDesignText: "Innebygd tilgjengelighet som standard. Vi følger WCAG 2.1-kravene strengt.",
+      palette: {
+        title: "Varme farger",
+        lead: "Fargepaletten er utvidet med varme, nøytrale toner som komplementerer rød uten å konkurrere med den — og gir flaten mer pust.",
+        link: "Se alle tokens"
+      },
       readGuidelines: "Les retningslinjene",
       consistentBrand: "Konsistent merkevare",
       consistentBrandText: "Design tokens sikrer at Røde Kors sin visuelle profil ivaretas på alle flater.",
@@ -581,7 +607,11 @@ const Zn = "_calendarContainer_htlea_1", Xn = "_calendarHeader_htlea_16", Jn = "
       intro: "Designsystemet inneholder grunnleggende komponenter som kan settes sammen på mange ulike måter og i forskjellige mønstre.",
       searchPlaceholder: "Søk etter komponent...",
       searchAriaLabel: "Søk i komponenter",
-      noResults: "Ingen komponenter funnet for"
+      noResults: "Ingen komponenter funnet for",
+      openLabel: "Les mer",
+      ctaTitle: "Utforsk komponentene i Storybook",
+      ctaText: "Se alle varianter, tilstander og kodeeksempler i den interaktive dokumentasjonen.",
+      ctaButton: "Åpne Storybook"
     },
     // Code Page
     code: {
@@ -1495,7 +1525,9 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
       previousImage: "Forrige bilde",
       nextImage: "Neste bilde",
       imagePosition: "Bildeposisjon",
-      goToImage: "Gå til bilde"
+      goToImage: "Gå til bilde",
+      pauseAutoplay: "Pause automatisk avspilling",
+      resumeAutoplay: "Start automatisk avspilling"
     },
     // DatePicker
     datePicker: {
@@ -1527,6 +1559,7 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
       suggestions: "Search suggestions",
       viewAll: "View all results",
       noResults: "No results found for",
+      suggestionCount: "{count} suggestions",
       selectLanguage: "Select language",
       homeAriaLabel: "Norwegian Red Cross Home",
       nav: {
@@ -1534,6 +1567,7 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
         components: "Components",
         code: "Code",
         tokens: "Tokens",
+        skipToContent: "Skip to main content",
         work: "Our Work",
         volunteer: "Volunteer",
         courses: "Courses & Training"
@@ -1543,6 +1577,16 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
     home: {
       heroTitle: "Red Cross Design System",
       heroLead: "Common component library and guidelines for design and development of digital solutions in Red Cross.",
+      hero: {
+        kicker: "For designers and developers",
+        title: "One shared design language for the Red Cross",
+        lead: "Ready-made React components, design tokens and guidelines — built on the Digdir Design System and tailored to the Red Cross visual identity.",
+        primaryCta: "Get started",
+        secondaryCta: "Explore components",
+        specimenButton: "Volunteer",
+        breadcrumbLabel: "You are here",
+        breadcrumbHome: "Home"
+      },
       searchComponents: "Search components",
       exploreSystem: "Explore the system",
       componentsDesc: "Library with ready-made React components.",
@@ -1551,6 +1595,11 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
       tokensDesc: "Design tokens, colors, and spacing.",
       universalDesign: "Universal Design",
       universalDesignText: "Built-in accessibility by default. We strictly follow WCAG 2.1 requirements.",
+      palette: {
+        title: "Warm colors",
+        lead: "The color palette has been extended with warm, neutral tones that complement red without competing with it — giving the surface more room to breathe.",
+        link: "See all tokens"
+      },
       readGuidelines: "Read guidelines",
       consistentBrand: "Consistent Brand",
       consistentBrandText: "Design tokens ensure the Red Cross visual profile is maintained across all surfaces.",
@@ -1622,7 +1671,11 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
       intro: "The design system contains fundamental components that can be combined in many different ways and in different patterns.",
       searchPlaceholder: "Search for component...",
       searchAriaLabel: "Search components",
-      noResults: "No components found for"
+      noResults: "No components found for",
+      openLabel: "Learn more",
+      ctaTitle: "Explore the components in Storybook",
+      ctaText: "See every variant, state and code example in the interactive documentation.",
+      ctaButton: "Open Storybook"
     },
     // Code Page
     code: {
@@ -2538,7 +2591,9 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
       previousImage: "Previous image",
       nextImage: "Next image",
       imagePosition: "Image position",
-      goToImage: "Go to image"
+      goToImage: "Go to image",
+      pauseAutoplay: "Pause autoplay",
+      resumeAutoplay: "Resume autoplay"
     },
     // DatePicker
     datePicker: {
@@ -2550,25 +2605,25 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
       openDatePicker: "Open date picker"
     }
   }
-}, Ne = Ze(void 0), Js = ({ children: n }) => {
-  const [e, a] = Z("NO"), d = (h) => {
-    const k = h.split(".");
-    let u = io[e];
-    for (const v of k) {
-      if (u[v] === void 0)
-        return console.warn(`Translation missing for key: ${h} in language: ${e}`), h;
-      u = u[v];
+}, Ue = pt(void 0), xi = ({ children: n }) => {
+  const [e, a] = Z("NO"), c = (k) => {
+    const y = k.split(".");
+    let f = _o[e];
+    for (const x of y) {
+      if (f[x] === void 0)
+        return console.warn(`Translation missing for key: ${k} in language: ${e}`), k;
+      f = f[x];
     }
-    return u;
+    return f;
   };
-  return /* @__PURE__ */ t(Ne.Provider, { value: { language: e, setLanguage: a, t: d }, children: n });
-}, Qs = () => {
-  const n = We(Ne);
+  return /* @__PURE__ */ t(Ue.Provider, { value: { language: e, setLanguage: a, t: c }, children: n });
+}, Ti = () => {
+  const n = nt(Ue);
   if (n === void 0)
     throw new Error("useLanguage must be used within a LanguageProvider");
   return n;
-}, xe = () => {
-  const n = We(Ne);
+}, Be = () => {
+  const n = nt(Ue);
   return n === void 0 ? {
     language: "NO",
     setLanguage: () => {
@@ -2595,6 +2650,7 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
       "header.suggestions": "Forslag",
       "header.viewAll": "Se alle",
       "header.noResults": "Ingen resultater for",
+      "header.suggestionCount": "{count} forslag",
       // Footer translations
       "footer.shortcuts": "Snarveier",
       "footer.shortcutsLinks.services": "Tilbudene",
@@ -2621,6 +2677,8 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
       "carousel.nextImage": "Neste bilde",
       "carousel.imagePosition": "Bildeposisjon",
       "carousel.goToImage": "Gå til bilde",
+      "carousel.pauseAutoplay": "Pause automatisk avspilling",
+      "carousel.resumeAutoplay": "Start automatisk avspilling",
       // DatePicker translations
       "datePicker.previousMonth": "Forrige måned",
       "datePicker.nextMonth": "Neste måned",
@@ -2628,122 +2686,182 @@ Map design elements to our existing components where possible (e.g. Buttons, Hea
       "dateInput.openDatePicker": "Åpne datovelger"
     })[e] || e
   } : n;
-}, lo = (n) => {
-  const e = ge(n), a = Ue(e, { locale: ue }), d = Ve(a, 41);
-  return ln({ start: a, end: d });
-}, Ee = (n) => n && n.charAt(0).toUpperCase() + n.slice(1), co = ({
+}, Io = (n) => {
+  const e = be(n), a = He(e, { locale: he }), c = Ce(a, 41);
+  return yn({ start: a, end: c });
+}, Xe = (n) => n && n.charAt(0).toUpperCase() + n.slice(1), Le = (n, e) => {
+  const a = Math.min(n.getDate(), xn(e));
+  return Tn(be(e), a);
+}, Lo = ({
   initialDate: n = /* @__PURE__ */ new Date(),
   selectedDate: e = null,
-  // Prop for valgt dato
   onDateSelect: a,
-  "data-color": d,
-  // <-- Destrukturert
-  "data-size": h
-  // <-- Destrukturert
+  "data-color": c,
+  "data-size": k
 }) => {
-  const { t: k } = xe();
-  R(() => {
-    const m = "rk-datepicker-inline-styles";
-    if (typeof document > "u" || document.getElementById(m)) return;
-    const L = po(oe), w = document.createElement("style");
-    w.id = m, w.textContent = L, document.head.appendChild(w);
+  const { t: y } = Be();
+  U(() => {
+    const d = "rk-datepicker-inline-styles";
+    if (typeof document > "u" || document.getElementById(d)) return;
+    const l = Do(de), v = document.createElement("style");
+    v.id = d, v.textContent = l, document.head.appendChild(v);
   }, []);
-  const [u, v] = Z(
-    ge(e && Se(e) ? e : n)
-  );
-  R(() => {
-    if (e && Se(e)) {
-      const m = ge(e);
-      Me(m, u) || v(m);
+  const [f, x] = Z(
+    be(e && De(e) ? e : n)
+  ), [B, I] = Z(
+    () => e && De(e) ? e : n
+  ), J = Ee(null), L = Ee(!1);
+  U(() => {
+    if (e && De(e)) {
+      I(e);
+      const d = be(e);
+      x(
+        (l) => Fe(d, l) ? l : d
+      );
     }
-  }, [e]);
-  const M = he(() => ge(/* @__PURE__ */ new Date()), []), C = he(() => !1, [u, M]), G = he(
-    () => lo(u),
-    [u]
-  ), I = he(() => {
-    const m = Ue(/* @__PURE__ */ new Date(), { locale: ue });
-    return Array.from({ length: 7 }).map((L, w) => {
-      const j = fe(Ve(m, w), "EEEEEE", { locale: ue });
-      return Ee(j);
+  }, [e]), U(() => {
+    var l;
+    if (!L.current) return;
+    L.current = !1;
+    const d = (l = J.current) == null ? void 0 : l.querySelector(
+      `[data-date="${ve(B, "yyyy-MM-dd")}"]`
+    );
+    d == null || d.focus();
+  }, [B, f]);
+  const R = Ae(
+    () => Io(f),
+    [f]
+  ), G = Ae(() => {
+    const d = [];
+    for (let l = 0; l < R.length; l += 7)
+      d.push(R.slice(l, l + 7));
+    return d;
+  }, [R]), p = Ae(() => {
+    const d = He(/* @__PURE__ */ new Date(), { locale: he });
+    return Array.from({ length: 7 }).map((l, v) => {
+      const S = ve(Ce(d, v), "EEEEEE", { locale: he });
+      return Xe(S);
+    });
+  }, []), Q = ce(() => {
+    x((d) => {
+      const l = be(Ve(d, 1));
+      return I((v) => Le(v, l)), l;
     });
-  }, []), V = ae(() => {
-    C || v((m) => ge(on(m, 1)));
-  }, [C]), D = ae(() => {
-    v((m) => ge(rn(m, 1)));
-  }, []), p = ae(
-    (m) => {
-      a && a(m);
+  }, []), K = ce(() => {
+    x((d) => {
+      const l = be(Oe(d, 1));
+      return I((v) => Le(v, l)), l;
+    });
+  }, []), N = ce(
+    (d) => {
+      I(d), a == null || a(d);
     },
     [a]
-  ), X = ae(
-    (m, L) => {
-      (m.key === "Enter" || m.key === " ") && (m.preventDefault(), p(L));
+  ), w = ce((d) => {
+    L.current = !0, I(d), x(
+      (l) => Fe(d, l) ? l : be(d)
+    );
+  }, []), H = ce(
+    (d, l) => {
+      switch (d.key) {
+        case "Enter":
+        case " ":
+          d.preventDefault(), N(l);
+          return;
+        case "ArrowLeft":
+          d.preventDefault(), w(Ce(l, -1));
+          return;
+        case "ArrowRight":
+          d.preventDefault(), w(Ce(l, 1));
+          return;
+        case "ArrowUp":
+          d.preventDefault(), w(Ce(l, -7));
+          return;
+        case "ArrowDown":
+          d.preventDefault(), w(Ce(l, 7));
+          return;
+        case "Home":
+          d.preventDefault(), w(He(l, { locale: he }));
+          return;
+        case "End":
+          d.preventDefault(), w(vn(l, { locale: he }));
+          return;
+        case "PageUp":
+          d.preventDefault(), w(Le(l, Ve(l, 1)));
+          return;
+        case "PageDown":
+          d.preventDefault(), w(Le(l, Oe(l, 1)));
+          return;
+      }
     },
-    [p]
-  ), ne = fe(u, "MMMM", { locale: ue }), _ = fe(u, "yyyy", { locale: ue }), J = `${Ee(ne)} ${_}`;
+    [N, w]
+  ), P = ve(f, "MMMM", { locale: he }), E = ve(f, "yyyy", { locale: he }), q = `${Xe(P)} ${E}`, Y = We(), $ = Fe(B, f) ? B : Le(B, f);
   return /* @__PURE__ */ r(
     "div",
     {
-      className: oe.calendarContainer,
-      "data-color": d,
-      "data-size": h,
+      className: de.calendarContainer,
+      "data-color": c,
+      "data-size": k,
       children: [
-        /* @__PURE__ */ r("div", { className: oe.calendarHeader, children: [
-          /* @__PURE__ */ t("span", { className: oe.monthYear, children: J }),
-          /* @__PURE__ */ r("div", { className: oe.navigationButtons, children: [
+        /* @__PURE__ */ r("div", { className: de.calendarHeader, children: [
+          /* @__PURE__ */ t("span", { className: de.monthYear, id: Y, "aria-live": "polite", children: q }),
+          /* @__PURE__ */ r("div", { className: de.navigationButtons, children: [
             /* @__PURE__ */ t(
-              Ae,
+              Ge,
               {
                 variant: "tertiary",
                 icon: !0,
-                onClick: V,
-                "aria-label": k("datePicker.previousMonth"),
-                disabled: C,
-                children: /* @__PURE__ */ t(Ke, {})
+                onClick: Q,
+                "aria-label": y("datePicker.previousMonth"),
+                children: /* @__PURE__ */ t(st, {})
               }
             ),
             /* @__PURE__ */ t(
-              Ae,
+              Ge,
               {
                 variant: "tertiary",
                 icon: !0,
-                onClick: D,
-                "aria-label": k("datePicker.nextMonth"),
-                children: /* @__PURE__ */ t(qe, {})
+                onClick: K,
+                "aria-label": y("datePicker.nextMonth"),
+                children: /* @__PURE__ */ t(it, {})
               }
             )
           ] })
         ] }),
-        /* @__PURE__ */ t("div", { className: oe.grid, children: I.map((m) => /* @__PURE__ */ t("div", { className: oe.dayNameCell, children: m }, m)) }),
-        /* @__PURE__ */ t("div", { className: oe.grid, children: G.map((m) => {
-          const L = Me(m, u), w = e && Se(e) && an(m, e), j = sn(m), A = [
-            oe.dateCell,
-            L ? "" : oe.otherMonth,
-            w ? oe.selectedDate : "",
-            // Utheving basert på prop
-            j && !w ? oe.todayDate : ""
-          ].filter(Boolean).join(" ");
-          return /* @__PURE__ */ t(
-            "div",
-            {
-              className: A,
-              onClick: () => p(m),
-              onKeyDown: (F) => X(F, m),
-              role: "button",
-              tabIndex: 0,
-              "aria-pressed": w ?? !1,
-              "aria-label": fe(m, "PPP", { locale: ue }),
-              children: /* @__PURE__ */ t("span", { className: oe.dateNumberContainer, children: fe(m, "d") })
-            },
-            m.toISOString()
-          );
-        }) })
+        /* @__PURE__ */ r("div", { role: "grid", "aria-labelledby": Y, className: de.gridWrapper, ref: J, children: [
+          /* @__PURE__ */ t("div", { role: "row", className: de.gridRow, children: p.map((d) => /* @__PURE__ */ t("div", { role: "columnheader", className: de.dayNameCell, children: d }, d)) }),
+          G.map((d) => /* @__PURE__ */ t("div", { role: "row", className: de.gridRow, children: d.map((l) => {
+            const v = Fe(l, f), S = e && De(e) && Ke(l, e), F = bn(l), D = v && Ke(l, $), g = [
+              de.dateCell,
+              v ? "" : de.otherMonth,
+              S ? de.selectedDate : "",
+              F && !S ? de.todayDate : ""
+            ].filter(Boolean).join(" ");
+            return /* @__PURE__ */ t(
+              "div",
+              {
+                role: "gridcell",
+                className: g,
+                "data-date": ve(l, "yyyy-MM-dd"),
+                onClick: v ? () => N(l) : void 0,
+                onKeyDown: v ? (se) => H(se, l) : void 0,
+                tabIndex: v ? D ? 0 : -1 : void 0,
+                "aria-selected": v ? !!S : void 0,
+                "aria-disabled": !v || void 0,
+                "aria-current": F ? "date" : void 0,
+                "aria-label": ve(l, "PPP", { locale: he }),
+                children: /* @__PURE__ */ t("span", { className: de.dateNumberContainer, children: ve(l, "d") })
+              },
+              l.toISOString()
+            );
+          }) }, d[0].toISOString()))
+        ] })
       ]
     }
   );
 };
-co.displayName = "DatePicker";
-function po(n) {
+Lo.displayName = "DatePicker";
+function Do(n) {
   return `
 .${n.calendarContainer} {
   display: inline-flex;
@@ -2780,12 +2898,15 @@ function po(n) {
 .${n.navigationButtons} > button:disabled svg {
   opacity: var(--ds-opacity-disabled, 0.3);
 }
-.${n.grid} {
+.${n.gridWrapper} {
+  width: 100%;
+  overflow: hidden;
+}
+.${n.gridRow} {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
   width: 100%;
   text-align: center;
-  overflow: hidden;
 }
 .${n.dayNameCell} {
   display: flex;
@@ -2822,6 +2943,12 @@ function po(n) {
   user-select: none;
   min-width: 0;
 }
+.${n.dateCell}:focus-visible {
+  outline: var(--ds-border-width-focus, 3px) solid var(--ds-color-focus-outer, #2b2b2b);
+  outline-offset: calc(-1 * var(--ds-border-width-focus, 3px));
+  position: relative;
+  z-index: 2;
+}
 .${n.dateNumberContainer} {
   display: flex;
   justify-content: center;
@@ -2873,11 +3000,11 @@ function po(n) {
   }
   .${n.dayNameCell} {
     padding: var(--ds-size-1, 4px);
-    font-size: var(--ds-body-2xs-font-size, 12px);
+    font-size: var(--ds-font-size-1, 12px);
   }
   .${n.dateCell} {
     padding: var(--ds-size-2, 8px);
-    font-size: var(--ds-body-2xs-font-size, 12px);
+    font-size: var(--ds-font-size-1, 12px);
   }
   .${n.dateNumberContainer} {
     width: 20px;
@@ -2903,203 +3030,191 @@ function po(n) {
 }
 `;
 }
-const mo = "_fieldset_16fx7_2", go = "_description_16fx7_14", uo = "_error_16fx7_21", ho = "_inputWrapper_16fx7_30", fo = "_inputWrapperError_16fx7_42", ko = "_suffixButton_16fx7_80", vo = "_suffixButtonInteractive_16fx7_100", le = {
-  fieldset: mo,
-  description: go,
-  error: uo,
-  inputWrapper: ho,
-  inputWrapperError: fo,
-  suffixButton: ko,
-  suffixButtonInteractive: vo
-}, Pe = (n) => {
-  const e = n.slice(0, 2), a = n.slice(2, 4), d = n.slice(4, 8);
-  return n.length > 4 ? `${e}.${a}.${d}` : n.length > 2 ? `${e}.${a}` : n.length > 0 ? e : "";
-}, $e = (n) => (n || "").replace(/\D/g, ""), ze = (n) => {
-  let e = n;
-  if (e.length >= 2) {
-    const a = parseInt(e.substring(0, 2), 10);
-    !isNaN(a) && a > 31 && (e = "31" + e.substring(2));
-  }
-  if (e.length >= 4) {
-    const a = parseInt(e.substring(2, 4), 10);
-    !isNaN(a) && a > 12 && (e = e.substring(0, 2) + "12" + e.substring(4));
-  }
-  return e.slice(0, 8);
-}, bo = se(
+const Mo = "_fieldset_1d1ez_2", jo = "_description_1d1ez_14", Ao = "_error_1d1ez_21", No = "_inputWrapper_1d1ez_30", Eo = "_inputWrapperError_1d1ez_42", Bo = "_suffixButton_1d1ez_80", Fo = "_suffixButtonInteractive_1d1ez_100", ue = {
+  fieldset: Mo,
+  description: jo,
+  error: Ao,
+  inputWrapper: No,
+  inputWrapperError: Eo,
+  suffixButton: Bo,
+  suffixButtonInteractive: Fo
+}, Me = (n) => {
+  const e = n.slice(0, 2), a = n.slice(2, 4), c = n.slice(4, 8);
+  return n.length > 4 ? `${e}.${a}.${c}` : n.length > 2 ? `${e}.${a}` : n.length > 0 ? e : "";
+}, ze = (n) => (n || "").replace(/\D/g, "").slice(0, 8), Je = (n) => {
+  if (n.length < 8) return null;
+  const e = Cn(Me(n), "dd.MM.yyyy", /* @__PURE__ */ new Date());
+  return De(e);
+}, Po = me(
   (n, e) => {
-    const { t: a } = xe();
-    R(() => {
-      const c = "rk-dateinput-inline-styles";
-      if (typeof document > "u" || document.getElementById(c)) return;
-      const T = yo(le), $ = document.createElement("style");
-      $.id = c, $.textContent = T, document.head.appendChild($);
+    const { t: a } = Be();
+    U(() => {
+      const A = "rk-dateinput-inline-styles";
+      if (typeof document > "u" || document.getElementById(A)) return;
+      const ae = $o(ue), s = document.createElement("style");
+      s.id = A, s.textContent = ae, document.head.appendChild(s);
     }, []);
     const {
-      label: d,
-      suffixIcon: h,
-      onSuffixClick: k,
-      className: u,
-      // For ytre fieldset
-      inputWrapperClassName: v,
-      // For input wrapper div
-      inputClassName: M,
-      // For selve input-elementet
-      value: C,
-      defaultValue: G,
-      onChange: I,
-      readOnly: V,
-      placeholder: D = "dd.mm.åååå",
-      id: p,
-      name: X,
-      required: ne,
-      disabled: _,
-      onClick: J,
-      onFocus: m,
-      // Send ekstern onFocus videre
-      onBlur: L,
-      // Send ekstern onBlur videre
-      autoComplete: w = "off",
-      "aria-label": j,
-      "aria-labelledby": A,
-      description: F,
-      error: O,
-      // Bruk error-prop for styling
-      "data-color": Q,
-      // <-- Destrukturering
-      "data-size": P,
-      // <-- Destrukturering
-      ...B
-    } = n, E = C !== void 0, f = Xe(null);
-    Le.useImperativeHandle(
+      label: c,
+      suffixIcon: k,
+      onSuffixClick: y,
+      className: f,
+      inputWrapperClassName: x,
+      inputClassName: B,
+      value: I,
+      defaultValue: J,
+      onChange: L,
+      onValidationChange: R,
+      readOnly: G,
+      placeholder: p = "dd.mm.åååå",
+      id: Q,
+      name: K,
+      required: N,
+      disabled: w,
+      onClick: H,
+      onFocus: P,
+      onBlur: E,
+      autoComplete: q = "off",
+      "aria-label": Y,
+      "aria-labelledby": $,
+      description: d,
+      error: l,
+      "data-color": v,
+      "data-size": S,
+      ...F
+    } = n, D = I !== void 0, g = Ee(null);
+    ye.useImperativeHandle(
       e,
-      () => f.current
+      () => g.current
     );
-    const l = ae(
-      (c) => {
-        const T = $e(c), $ = ze(T);
-        return Pe($);
+    const se = Ee(null), ee = ce(
+      (A, ae) => {
+        A !== se.current && (se.current = A, R == null || R(A, ae));
       },
+      [R]
+    ), te = ce(
+      (A) => Me(ze(A)),
       []
-    ), [y, ee] = Z(
-      () => l(C ?? G)
+    ), [ne, z] = Z(
+      () => te(I ?? J)
     );
-    R(() => {
-      if (E) {
-        const c = l(C);
-        c !== y && (ee(c), f.current && f.current.value !== c && (f.current.value = c));
+    U(() => {
+      if (D) {
+        const A = te(I);
+        A !== ne && (z(A), g.current && g.current.value !== A && (g.current.value = A));
       }
-    }, [C, E, y, l]);
-    const H = ae(
-      (c) => {
-        const T = c.target, $ = T.value, q = y, ie = $e($).slice(0, 8), i = ze(ie), g = Pe(i);
-        let b = 0;
-        const Y = i.length;
-        Y <= 2 ? b = Y : Y <= 4 ? b = Y + 1 : b = Y + 2, b = Math.min(b, g.length), requestAnimationFrame(() => {
-          if (f.current && (ee(g), f.current.value = g, f.current.setSelectionRange(b, b), (g !== q || E) && I)) {
-            const we = {
-              ...c,
-              target: { ...T, value: g }
-            };
-            I(we, g);
-          }
-        });
+    }, [I, D, ne, te]);
+    const ie = ce(
+      (A) => {
+        const ae = A.target, s = ne, m = ze(ae.value), b = Me(m);
+        let V = 0;
+        const ke = m.length;
+        ke <= 2 ? V = ke : ke <= 4 ? V = ke + 1 : V = ke + 2, V = Math.min(V, b.length), z(b), ae.value = b, ae.setSelectionRange(V, V), (b !== s || D) && (L == null || L(A, b));
+        const ct = Je(m);
+        (m.length === 0 || m.length === 8) && ee(m.length === 0 ? null : ct, b);
+      },
+      [ne, D, L, ee]
+    ), T = ce(
+      (A) => {
+        const ae = ze(A.target.value);
+        ae.length === 0 ? ee(null, "") : ae.length < 8 ? ee(!1, Me(ae)) : ee(Je(ae), Me(ae)), E == null || E(A);
       },
-      [y, E, I, l]
-    ), S = [le.fieldset, u].filter(Boolean).join(" "), N = [
-      le.inputWrapper,
-      v,
-      O ? le.inputWrapperError : ""
-    ].filter(Boolean).join(" "), K = [
-      M
-    ].filter(Boolean).join(" "), x = [
-      le.suffixButton,
-      k ? le.suffixButtonInteractive : ""
+      [E, ee]
+    ), h = [ue.fieldset, f].filter(Boolean).join(" "), C = [
+      ue.inputWrapper,
+      x,
+      l ? ue.inputWrapperError : ""
+    ].filter(Boolean).join(" "), j = [
+      B
+    ].filter(Boolean).join(" "), _ = [
+      ue.suffixButton,
+      y ? ue.suffixButtonInteractive : ""
     ].filter(Boolean).join(" ");
-    !d && !j && !A && console.warn("Advarsel: DateInput-komponenten bør ha label, aria-label, eller aria-labelledby for tilgjengelighet.");
-    const te = d && typeof d == "string" ? A || `${p}-label` : void 0, me = F ? `${p}-desc` : void 0, ce = O ? `${p}-err` : void 0, pe = [me, ce].filter(Boolean).join(" ") || void 0;
+    !c && !Y && !$ && console.warn("Advarsel: DateInput-komponenten bør ha label, aria-label, eller aria-labelledby for tilgjengelighet.");
+    const u = We(), M = Q ?? `dateinput${u}`, le = c && typeof c == "string" ? `${M}-label` : void 0, re = d ? `${M}-desc` : void 0, ge = l ? `${M}-err` : void 0, xe = [re, ge].filter(Boolean).join(" ") || void 0, Se = $ ?? le;
     return (
       // --- Bruk data-color og data-size på den ytre wrapperen ---
       /* @__PURE__ */ r(
         "div",
         {
-          className: S,
-          "data-color": Q,
-          "data-size": P,
+          className: h,
+          "data-color": v,
+          "data-size": S,
           children: [
-            d && typeof d == "string" ? /* @__PURE__ */ t("label", { id: te, htmlFor: p, children: d }) : d,
-            F && /* @__PURE__ */ t("p", { id: me, className: le.description, children: F }),
-            /* @__PURE__ */ r("div", { className: N, children: [
+            c && typeof c == "string" ? /* @__PURE__ */ t("label", { id: le, htmlFor: M, children: c }) : c,
+            d && /* @__PURE__ */ t("p", { id: re, className: ue.description, children: d }),
+            /* @__PURE__ */ r("div", { className: C, children: [
               /* @__PURE__ */ t(
                 "input",
                 {
-                  ref: f,
+                  ref: g,
                   type: "text",
                   inputMode: "numeric",
                   pattern: "\\d{2}\\.\\d{2}\\.\\d{4}",
                   maxLength: 10,
-                  value: y,
-                  readOnly: V,
-                  placeholder: D,
-                  id: p,
-                  name: X,
-                  required: ne,
-                  disabled: _,
-                  onClick: J,
-                  onChange: H,
-                  onFocus: m,
-                  onBlur: L,
-                  autoComplete: w,
-                  "aria-label": j,
-                  "aria-labelledby": te,
-                  "aria-describedby": pe,
-                  "aria-invalid": !!O,
-                  className: K,
-                  ...B
+                  value: ne,
+                  readOnly: G,
+                  placeholder: p,
+                  id: M,
+                  name: K,
+                  required: N,
+                  disabled: w,
+                  onClick: H,
+                  onChange: ie,
+                  onFocus: P,
+                  onBlur: T,
+                  autoComplete: q,
+                  "aria-label": Y,
+                  "aria-labelledby": Se,
+                  "aria-describedby": xe,
+                  "aria-invalid": !!l,
+                  className: j,
+                  ...F
                 }
               ),
-              h && /* @__PURE__ */ t(
+              k && /* @__PURE__ */ t(
                 "button",
                 {
                   type: "button",
-                  className: x,
-                  onClick: _ ? void 0 : k,
-                  tabIndex: k && !_ ? 0 : -1,
-                  "aria-hidden": !k,
-                  disabled: _,
-                  "aria-label": k ? a("dateInput.openDatePicker") : void 0,
-                  children: h
+                  className: _,
+                  onClick: w ? void 0 : y,
+                  tabIndex: y && !w ? 0 : -1,
+                  "aria-hidden": !y,
+                  disabled: w,
+                  "aria-label": y ? a("dateInput.openDatePicker") : void 0,
+                  children: k
                 }
               )
             ] }),
-            O && /* @__PURE__ */ t("p", { id: ce, className: le.error, role: "alert", children: O })
+            l && /* @__PURE__ */ t("p", { id: ge, className: ue.error, role: "alert", children: l })
           ]
         }
       )
     );
   }
 );
-bo.displayName = "DateInput";
-function yo(n) {
+Po.displayName = "DateInput";
+function $o(n) {
   return `
 .${n.fieldset} {
-  margin-bottom: var(--ds-spacing-4, 16px);
+  margin-bottom: var(--ds-size-4, 16px);
 }
 .${n.fieldset} label {
   display: block;
-  margin-bottom: var(--ds-spacing-1, 4px);
+  margin-bottom: var(--ds-size-1, 4px);
   font-weight: var(--ds-font-weight-medium, 500);
   color: var(--ds-color-text-default, #2b2b2b);
 }
 .${n.description} {
-  font-size: var(--ds-font-size-sm, 14px);
+  font-size: var(--ds-font-size-2, 14px);
   color: var(--ds-color-text-subtle, #5d5d5d);
-  margin-top: var(--ds-spacing-1, 4px);
-  margin-bottom: var(--ds-spacing-2, 8px);
+  margin-top: var(--ds-size-1, 4px);
+  margin-bottom: var(--ds-size-2, 8px);
 }
 .${n.error} {
-  font-size: var(--ds-font-size-sm, 14px);
+  font-size: var(--ds-font-size-2, 14px);
   color: var(--ds-color-danger-text-default, #c30000);
-  margin-top: var(--ds-spacing-1, 4px);
+  margin-top: var(--ds-size-1, 4px);
 }
 .${n.inputWrapper} {
   display: flex;
@@ -3116,7 +3231,7 @@ function yo(n) {
 }
 .${n.inputWrapper}:focus-within {
   outline: var(--ds-border-width-focus, 3px) solid var(--ds-color-focus-outer, #2B2B2B);
-  outline-offset: var(--ds-focus-outline-offset, 2px);
+  outline-offset: var(--ds-border-width-focus, 2px);
 }
 .${n.inputWrapper} input {
   box-sizing: border-box;
@@ -3137,7 +3252,7 @@ function yo(n) {
 .${n.inputWrapper} input:disabled {
   opacity: var(--ds-opacity-disabled, 0.5);
   cursor: not-allowed;
-  background-color: var(--ds-color-neutral-surface-subtle, #f0f0f0);
+  background-color: var(--ds-color-neutral-surface-tinted, #f0f0f0);
   color: var(--ds-color-neutral-text-subtle, #5d5d5d);
 }
 .${n.suffixButton} {
@@ -3172,173 +3287,204 @@ function yo(n) {
 }
 `;
 }
-const xo = "_carouselContainer_eo3g5_1", To = "_viewport_eo3g5_14", Co = "_slides_eo3g5_20", wo = "_slide_eo3g5_20", So = "_slideInner_eo3g5_40", Io = "_loaderOverlay_eo3g5_48", _o = "_image_eo3g5_58", Do = "_loaded_eo3g5_69", Lo = "_loading_eo3g5_73", Ao = "_empty_eo3g5_81", No = "_controls_eo3g5_87", Mo = "_arrows_eo3g5_97", jo = "_dots_eo3g5_107", Fo = "_dot_eo3g5_107", Bo = "_dotActive_eo3g5_133", W = {
-  carouselContainer: xo,
-  viewport: To,
-  slides: Co,
-  slide: wo,
-  slideInner: So,
-  loaderOverlay: Io,
-  image: _o,
-  loaded: Do,
-  loading: Lo,
-  empty: Ao,
-  controls: No,
-  arrows: Mo,
-  dots: jo,
-  dot: Fo,
-  dotActive: Bo
-}, Eo = pt, Po = ({
+const zo = "_carouselContainer_oit30_1", Ro = "_viewport_oit30_14", Go = "_slides_oit30_20", Ho = "_slide_oit30_20", Wo = "_slideInner_oit30_40", Uo = "_loaderOverlay_oit30_48", Vo = "_image_oit30_58", Oo = "_loaded_oit30_69", Ko = "_loading_oit30_73", Zo = "_empty_oit30_81", qo = "_controls_oit30_87", Yo = "_arrows_oit30_97", Xo = "_dots_oit30_107", Jo = "_playPause_oit30_122", Qo = "_dot_oit30_107", er = "_dotActive_oit30_153", X = {
+  carouselContainer: zo,
+  viewport: Ro,
+  slides: Go,
+  slide: Ho,
+  slideInner: Wo,
+  loaderOverlay: Uo,
+  image: Vo,
+  loaded: Oo,
+  loading: Ko,
+  empty: Zo,
+  controls: qo,
+  arrows: Yo,
+  dots: Xo,
+  playPause: Jo,
+  dot: Qo,
+  dotActive: er
+}, tr = _t, nr = ({
   images: n,
   autoPlay: e = !1,
   autoDelay: a = 5,
-  showArrows: d = !0,
-  showDots: h = !0,
-  variant: k,
-  slidesPerView: u = 1,
-  slideSpacing: v = 16,
-  cornerRadius: M = 0,
-  "data-color": C,
-  "data-size": G
+  showArrows: c = !0,
+  showDots: k = !0,
+  variant: y,
+  slidesPerView: f = 1,
+  slideSpacing: x = 16,
+  cornerRadius: B = 0,
+  "data-color": I,
+  "data-size": J
 }) => {
-  const { t: I } = xe();
-  R(() => {
-    const f = "rk-carousel-inline-styles";
-    if (typeof document > "u" || document.getElementById(f)) return;
-    const l = $o(W), y = document.createElement("style");
-    y.id = f, y.textContent = l, document.head.appendChild(y);
+  const { t: L } = Be();
+  U(() => {
+    const h = "rk-carousel-inline-styles";
+    if (typeof document > "u" || document.getElementById(h)) return;
+    const C = or(X), j = document.createElement("style");
+    j.id = h, j.textContent = C, document.head.appendChild(j);
   }, []);
-  const V = {
+  const R = {
     loop: !0,
     align: "start",
     containScroll: "trimSnaps",
     slidesToScroll: 1
-  }, [D, p] = dn(V), [X, ne] = Z(0), [_, J] = Z([]), [m, L] = Z([]);
-  R(() => {
-    L(new Array((n == null ? void 0 : n.length) || 0).fill(!1));
-  }, [n]);
-  const w = ae((f) => {
-    L((l) => {
-      const y = [...l];
-      return y[f] = !0, y;
+  }, [G, p] = wn(R), [Q, K] = Z(0), [N, w] = Z([]), [H, P] = Z([]), E = Ee([]), q = (n ?? []).map((h) => h.src).join(`
+`);
+  U(() => {
+    P(
+      (n ?? []).map((h, C) => {
+        const j = E.current[C];
+        return !!(j && j.complete && j.naturalWidth > 0);
+      })
+    );
+  }, [q]);
+  const Y = ce((h) => {
+    P((C) => {
+      if (C[h]) return C;
+      const j = [...C];
+      return j[h] = !0, j;
     });
-  }, []), j = he(() => a * 1e3, [a]), A = ae(() => {
-    p && ne(p.selectedScrollSnap());
-  }, [p]), F = ae((f) => p && p.scrollTo(f), [p]), O = ae(() => p && p.scrollPrev(), [p]), Q = ae(() => p && p.scrollNext(), [p]);
-  R(() => {
+  }, []), $ = Ae(() => a * 1e3, [a]), d = ce(() => {
+    p && K(p.selectedScrollSnap());
+  }, [p]), l = ce((h) => p && p.scrollTo(h), [p]), v = ce(() => p && p.scrollPrev(), [p]), S = ce(() => p && p.scrollNext(), [p]);
+  U(() => {
     if (p)
-      return p.on("select", A), p.on("reInit", A), J(p.scrollSnapList()), () => {
-        p.off("select", A), p.off("reInit", A);
+      return p.on("select", d), p.on("reInit", d), w(p.scrollSnapList()), () => {
+        p.off("select", d), p.off("reInit", d);
       };
-  }, [p, A]), R(() => {
-    p && (p.reInit(), J(p.scrollSnapList()));
-  }, [p, n, u, v]), R(() => {
-    if (!e || !p || !n || n.length <= 1) return;
-    const f = window.setInterval(() => {
+  }, [p, d]), U(() => {
+    p && (p.reInit(), w(p.scrollSnapList()));
+  }, [p, n, f, x]);
+  const [F, D] = Z(!1), [g, se] = Z(!1), [ee, te] = Z(!1), ne = e && !F && !g && !ee;
+  U(() => {
+    if (!ne || !p || !n || n.length <= 1) return;
+    const h = window.setInterval(() => {
       p.canScrollNext() && p.scrollNext();
-    }, j);
+    }, $);
     return () => {
-      window.clearInterval(f);
+      window.clearInterval(h);
     };
-  }, [e, j, p, n]);
-  const P = Math.max(1, u), B = `${100 / P}%`, E = v / 2;
+  }, [ne, $, p, n]);
+  const z = Math.max(1, f), ie = `${100 / z}%`, T = x / 2;
   return /* @__PURE__ */ r(
     "div",
     {
-      className: W.carouselContainer,
-      "data-color": C,
-      "data-size": G,
-      "data-variant": k,
+      className: X.carouselContainer,
+      "data-color": I,
+      "data-size": J,
+      "data-variant": y,
+      onMouseEnter: e ? () => se(!0) : void 0,
+      onMouseLeave: e ? () => se(!1) : void 0,
+      onFocus: e ? () => te(!0) : void 0,
+      onBlur: e ? (h) => {
+        h.currentTarget.contains(h.relatedTarget) || te(!1);
+      } : void 0,
       children: [
-        /* @__PURE__ */ t("div", { className: W.viewport, ref: D, children: /* @__PURE__ */ t(
+        /* @__PURE__ */ t("div", { className: X.viewport, ref: G, children: /* @__PURE__ */ t(
           "div",
           {
-            className: W.slides,
+            className: X.slides,
             style: {
-              marginLeft: `-${E}px`,
-              marginRight: `-${E}px`
+              marginLeft: `-${T}px`,
+              marginRight: `-${T}px`
             },
-            children: n && n.length > 0 ? n.map((f, l) => /* @__PURE__ */ t(
+            children: n && n.length > 0 ? n.map((h, C) => /* @__PURE__ */ t(
               "div",
               {
-                className: W.slide,
+                className: X.slide,
                 style: {
-                  flex: `0 0 ${B}`,
-                  paddingLeft: `${E}px`,
-                  paddingRight: `${E}px`,
-                  borderRadius: M > 0 ? `${M}px` : void 0,
+                  flex: `0 0 ${ie}`,
+                  paddingLeft: `${T}px`,
+                  paddingRight: `${T}px`,
+                  borderRadius: B > 0 ? `${B}px` : void 0,
                   overflow: "hidden"
                   // Ensure radius clips content
                 },
-                children: /* @__PURE__ */ r("div", { className: W.slideInner, style: { borderRadius: `${M}px`, overflow: "hidden", position: "relative", width: "100%", height: "100%" }, children: [
-                  !m[l] && /* @__PURE__ */ t("div", { className: W.loaderOverlay, children: /* @__PURE__ */ t(Eo, { "aria-label": I("carousel.loading") }) }),
+                children: /* @__PURE__ */ r("div", { className: X.slideInner, style: { borderRadius: `${B}px`, overflow: "hidden", position: "relative", width: "100%", height: "100%" }, children: [
+                  !H[C] && /* @__PURE__ */ t("div", { className: X.loaderOverlay, children: /* @__PURE__ */ t(tr, { "aria-label": L("carousel.loading") }) }),
                   /* @__PURE__ */ t(
                     "img",
                     {
-                      className: `${W.image} ${m[l] ? W.loaded : W.loadingImage}`,
-                      src: f.src,
-                      alt: f.alt,
-                      loading: l < P ? "eager" : "lazy",
+                      ref: (j) => {
+                        E.current[C] = j;
+                      },
+                      className: `${X.image} ${H[C] ? X.loaded : X.loadingImage}`,
+                      src: h.src,
+                      alt: h.alt,
+                      loading: C < z ? "eager" : "lazy",
                       crossOrigin: "anonymous",
-                      onLoad: () => w(l),
-                      onError: (y) => {
-                        y.target.style.display = "none", w(l);
+                      onLoad: () => Y(C),
+                      onError: (j) => {
+                        j.target.style.display = "none", Y(C);
                       }
                     }
                   )
                 ] })
               },
-              `image-${l}-${f.src}`
-            )) : /* @__PURE__ */ t("div", { className: W.slide, style: { flex: "0 0 100%" }, children: /* @__PURE__ */ t("div", { className: W.empty, children: "Ingen bilder" }) })
+              `image-${C}-${h.src}`
+            )) : /* @__PURE__ */ t("div", { className: X.slide, style: { flex: "0 0 100%" }, children: /* @__PURE__ */ t("div", { className: X.empty, children: "Ingen bilder" }) })
           }
         ) }),
-        (d || h && n && n.length > 1) && /* @__PURE__ */ r("div", { className: W.controls, "aria-hidden": "false", children: [
-          d && /* @__PURE__ */ r("div", { className: W.arrows, children: [
+        (c || k && n && n.length > 1) && /* @__PURE__ */ r("div", { className: X.controls, "aria-hidden": "false", children: [
+          c && /* @__PURE__ */ r("div", { className: X.arrows, children: [
             /* @__PURE__ */ t(
-              de,
+              fe,
               {
                 variant: "primary",
                 icon: !0,
-                "aria-label": I("carousel.previousImage"),
-                onClick: O,
+                "aria-label": L("carousel.previousImage"),
+                onClick: v,
                 disabled: !n || n.length <= 1,
-                children: /* @__PURE__ */ t(cn, { "aria-hidden": !0 })
+                children: /* @__PURE__ */ t(Sn, { "aria-hidden": !0 })
               }
             ),
             /* @__PURE__ */ t(
-              de,
+              fe,
               {
                 variant: "primary",
                 icon: !0,
-                "aria-label": I("carousel.nextImage"),
-                onClick: Q,
+                "aria-label": L("carousel.nextImage"),
+                onClick: S,
                 disabled: !n || n.length <= 1,
-                children: /* @__PURE__ */ t(pn, { "aria-hidden": !0 })
+                children: /* @__PURE__ */ t(_n, { "aria-hidden": !0 })
               }
             )
           ] }),
-          h && n && n.length > 1 && /* @__PURE__ */ t("div", { className: W.dots, role: "tablist", "aria-label": I("carousel.imagePosition"), children: _.map((f, l) => {
-            const y = l === X;
-            return /* @__PURE__ */ t(
+          k && n && n.length > 1 && /* @__PURE__ */ r("div", { className: X.dots, role: "group", "aria-label": L("carousel.imagePosition"), children: [
+            e && /* @__PURE__ */ t(
               "button",
               {
                 type: "button",
-                className: `${W.dot} ${y ? W.dotActive : ""}`,
-                onClick: () => F(l),
-                "aria-label": `${I("carousel.goToImage")} ${l + 1}`,
-                "aria-selected": y,
-                role: "tab"
-              },
-              `dot-${l}`
-            );
-          }) })
+                className: X.playPause,
+                onClick: () => D((h) => !h),
+                "aria-label": L(F ? "carousel.resumeAutoplay" : "carousel.pauseAutoplay"),
+                "aria-pressed": F,
+                children: F ? /* @__PURE__ */ t(In, { "aria-hidden": !0 }) : /* @__PURE__ */ t(Ln, { "aria-hidden": !0 })
+              }
+            ),
+            N.map((h, C) => {
+              const j = C === Q;
+              return /* @__PURE__ */ t(
+                "button",
+                {
+                  type: "button",
+                  className: `${X.dot} ${j ? X.dotActive : ""}`,
+                  onClick: () => l(C),
+                  "aria-label": `${L("carousel.goToImage")} ${C + 1}`,
+                  "aria-current": j || void 0
+                },
+                `dot-${C}`
+              );
+            })
+          ] })
         ] })
       ]
     }
   );
 };
-Po.displayName = "Carousel";
-function $o(n) {
+nr.displayName = "Carousel";
+function or(n) {
   return `
 .${n.carouselContainer} {
   position: relative;
@@ -3379,7 +3525,7 @@ function $o(n) {
   position: relative;
   width: 100%;
   height: 100%;
-  background-color: var(--ds-color-neutral-surface-subtle, #f5f5f5);
+  background-color: var(--ds-color-neutral-surface-tinted, #f5f5f5);
   overflow: hidden;
 }
 .${n.loaderOverlay} {
@@ -3409,11 +3555,11 @@ function $o(n) {
   align-items: center;
   gap: var(--ds-size-2, 8px);
   color: var(--ds-color-text-subtle, #5d5d5d);
-  font-size: var(--ds-font-size-sm, 14px);
+  font-size: var(--ds-font-size-2, 14px);
 }
 .${n.empty} {
   color: var(--ds-color-text-subtle, #5d5d5d);
-  font-size: var(--ds-font-size-sm, 14px);
+  font-size: var(--ds-font-size-2, 14px);
   text-align: center;
 }
 .${n.controls} {
@@ -3440,6 +3586,7 @@ function $o(n) {
   transform: translateX(-50%);
   bottom: var(--ds-size-3, 12px);
   display: inline-flex;
+  align-items: center;
   gap: var(--ds-size-2, 8px);
   pointer-events: auto;
   background-color: rgba(255, 255, 255, 0.1);
@@ -3458,6 +3605,20 @@ function $o(n) {
   cursor: pointer;
   transition: all 0.2s ease;
 }
+.${n.playPause} {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--ds-size-6, 24px);
+  height: var(--ds-size-6, 24px);
+  border-radius: 999px;
+  border: var(--ds-border-width-default, 1px) solid var(--ds-color-border-subtle, #d6d6d6);
+  background-color: rgba(255, 255, 255, 0.85);
+  color: var(--ds-color-neutral-text-default, #2b2b2b);
+  padding: 0;
+  margin: 0;
+  cursor: pointer;
+}
 .${n.dotActive} {
   background-color: var(--ds-color-primary-color-red-base-default, #D52B1E);
   border-color: var(--ds-color-primary-color-red-base-default, #D52B1E);
@@ -3510,225 +3671,471 @@ function $o(n) {
 }
 `;
 }
-const zo = "_crossCorner_1caiu_1", Ro = "_shape_1caiu_6", _e = {
-  crossCorner: zo,
-  shape: Ro
+const rr = "_graphicElement_134cx_1", ar = "_shape_134cx_12", sr = "_faceFront_134cx_28", ir = "_faceTop_134cx_32", lr = "_faceRight_134cx_36", we = {
+  graphicElement: rr,
+  shape: ar,
+  faceFront: sr,
+  faceTop: ir,
+  faceRight: lr
 };
-function Go(n) {
+function dr(n) {
   return `
-.${n.crossCorner} {
+.${n.graphicElement} {
   display: inline-block;
   flex-shrink: 0;
+  --graphic-element-color: var(--ds-color-base-default, #DA4236);
+  --graphic-element-face-front: var(--ds-color-border-subtle, #EEABA6);
+  --graphic-element-face-top: var(--ds-color-surface-active, #E5776F);
 }
+/* data-color scoping: the theme's [data-color] scopes swap the generic
+   --ds-color-* variables, so no per-ramp rules are needed here. */
 .${n.shape} {
-  fill: var(--ds-color-base-default, #DA4236);
+  fill: var(--graphic-element-color);
 }
-/* Color variants via data-color attribute */
-.${n.crossCorner}[data-color="accent"] .${n.shape} {
-  fill: var(--ds-color-accent-base-default, #DA4236);
+/* Outline variant: thin stroke, no fill */
+.${n.graphicElement}[data-variant="outline"] {
+  overflow: visible;
 }
-.${n.crossCorner}[data-color="brand1"] .${n.shape} {
-  fill: var(--ds-color-brand1-base-default, #DA4236);
+.${n.graphicElement}[data-variant="outline"] .${n.shape} {
+  fill: none;
+  stroke: var(--graphic-element-color);
+  stroke-width: 2px;
 }
-.${n.crossCorner}[data-color="brand2"] .${n.shape} {
-  fill: var(--ds-color-brand2-base-default, #1E2B3C);
+/* Isometric variant: three token-driven cube faces */
+.${n.faceFront} {
+  fill: var(--graphic-element-face-front);
 }
-.${n.crossCorner}[data-color="brand3"] .${n.shape} {
-  fill: var(--ds-color-brand3-base-default, #F5F5F5);
+.${n.faceTop} {
+  fill: var(--graphic-element-face-top);
 }
-.${n.crossCorner}[data-color="neutral"] .${n.shape} {
-  fill: var(--ds-color-neutral-base-default, #5D5D5D);
+.${n.faceRight} {
+  fill: var(--graphic-element-color);
 }
 `;
 }
-const Wo = {
-  sm: 48,
-  md: 68,
-  lg: 96
-}, Ho = {
+const cr = {
+  sm: 24,
+  md: 34,
+  lg: 48
+}, pr = {
   "top-left": 270,
   "top-right": 0,
   "bottom-right": 90,
   "bottom-left": 180
-}, be = se(
+}, mr = {
+  // One unit square. Outline: bottom edge only.
+  square: {
+    viewBoxW: 34,
+    viewBoxH: 34,
+    solid: "M0 0H34V34H0V0Z",
+    outline: "M0 34H34"
+  },
+  // Three cells of a 2x2 grid with the TOP-LEFT cell missing:
+  // (1,0), (0,1), (1,1). Outline: bottom + right edges (open step).
+  corner: {
+    viewBoxW: 68,
+    viewBoxH: 68,
+    solid: "M34 0H68V68H0V34H34V0Z",
+    outline: "M0 68H68V0"
+  },
+  // The corner rotated -90deg: (0,0), (1,0), (1,1) - top bar plus the
+  // bottom-right cell (this is the legacy CrossCorner form).
+  // Outline: top + right edges.
+  angle: {
+    viewBoxW: 68,
+    viewBoxH: 68,
+    solid: "M0 0H68V68H34V34H0V0Z",
+    outline: "M0 0H68V68"
+  },
+  // Three unit squares rotated 45deg (diamonds, radius 24 = U*sqrt(2)/2):
+  // two side by side on top (centers (24,24) and (72,24)) and one
+  // centered below/between them (center (48,48)). Their union forms
+  // the angular heart. Outline: only the two bottom edges (open V).
+  heart: {
+    viewBoxW: 96,
+    viewBoxH: 72,
+    solid: "M24 0L48 24L72 0L96 24L48 72L0 24L24 0Z",
+    outline: "M0 24L48 72L96 24"
+  },
+  // Four cells: a 3x1 row plus one center cell above it -
+  // (1,0), (0,1), (1,1), (2,1). T pointing up.
+  // Outline: 2U horizontal line with a 1U tick rising from its midpoint.
+  tee: {
+    viewBoxW: 102,
+    viewBoxH: 68,
+    solid: "M34 0H68V34H102V68H0V34H34V0Z",
+    outline: "M17 68H85M51 34V68"
+  },
+  // Three cells in a row. Outline: bottom edge (one 3U line).
+  bar: {
+    viewBoxW: 102,
+    viewBoxH: 34,
+    solid: "M0 0H102V34H0V0Z",
+    outline: "M0 34H102"
+  },
+  // Four cells with NO center cell: (1,0), (0,1), (2,1), (1,2) -
+  // the gapped, checkerboard-style cross.
+  // Outline: full-height vertical axis plus two 1U horizontal ticks,
+  // leaving a gap over the (empty) center cell.
+  cross: {
+    viewBoxW: 102,
+    viewBoxH: 102,
+    solid: "M34 0H68V34H34V0ZM0 34H34V68H0V34ZM68 34H102V68H68V34ZM34 68H68V102H34V68Z",
+    outline: "M51 0V102M0 51H34M68 51H102"
+  }
+}, W = {
+  cube: {
+    w: 58.89,
+    h: 68,
+    faces: [
+      { face: "top", d: "M0 17L29.44 0L58.89 17L29.44 34Z" },
+      { face: "right", d: "M29.44 34L58.89 17L58.89 51L29.44 68Z" },
+      { face: "front", d: "M0 17L29.44 34L29.44 68L0 51Z" }
+    ]
+  },
+  cornerStanding: {
+    w: 88.33,
+    h: 102,
+    faces: [
+      { face: "top", d: "M0 34L29.44 17L58.89 34L29.44 51Z" },
+      { face: "front", d: "M0 34L29.44 51L29.44 85L0 68Z" },
+      { face: "right", d: "M58.89 68L88.33 51L88.33 85L58.89 102Z" },
+      { face: "front", d: "M29.44 51L58.89 68L58.89 102L29.44 85Z" },
+      { face: "top", d: "M29.44 17L58.89 0L88.33 17L58.89 34Z" },
+      { face: "right", d: "M58.89 34L88.33 17L88.33 51L58.89 68Z" },
+      { face: "front", d: "M29.44 17L58.89 34L58.89 68L29.44 51Z" }
+    ]
+  },
+  cornerLying: {
+    w: 117.78,
+    h: 85,
+    faces: [
+      { face: "front", d: "M0 17L29.44 34L29.44 68L0 51Z" },
+      { face: "top", d: "M0 17L29.44 34L58.89 17L29.44 0Z" },
+      { face: "right", d: "M88.33 34L117.78 17L117.78 51L88.33 68Z" },
+      { face: "top", d: "M58.89 17L88.33 34L117.78 17L88.33 0Z" },
+      { face: "front", d: "M29.44 34L58.89 51L58.89 85L29.44 68Z" },
+      { face: "right", d: "M58.89 51L88.33 34L88.33 68L58.89 85Z" },
+      { face: "top", d: "M29.44 34L58.89 51L88.33 34L58.89 17Z" }
+    ]
+  },
+  angleStanding: {
+    w: 88.33,
+    h: 119,
+    faces: [
+      { face: "top", d: "M0 17L29.44 0L58.89 17L29.44 34Z" },
+      { face: "front", d: "M0 17L29.44 34L29.44 68L0 51Z" },
+      { face: "right", d: "M58.89 85L88.33 68L88.33 102L58.89 119Z" },
+      { face: "front", d: "M29.44 68L58.89 85L58.89 119L29.44 102Z" },
+      { face: "top", d: "M29.44 34L58.89 17L88.33 34L58.89 51Z" },
+      { face: "right", d: "M58.89 51L88.33 34L88.33 68L58.89 85Z" },
+      { face: "front", d: "M29.44 34L58.89 51L58.89 85L29.44 68Z" }
+    ]
+  },
+  angleLying: {
+    w: 88.33,
+    h: 102,
+    faces: [
+      { face: "right", d: "M58.89 34L88.33 17L88.33 51L58.89 68Z" },
+      { face: "top", d: "M29.44 17L58.89 34L88.33 17L58.89 0Z" },
+      { face: "front", d: "M0 34L29.44 51L29.44 85L0 68Z" },
+      { face: "top", d: "M0 34L29.44 51L58.89 34L29.44 17Z" },
+      { face: "front", d: "M29.44 51L58.89 68L58.89 102L29.44 85Z" },
+      { face: "right", d: "M58.89 68L88.33 51L88.33 85L58.89 102Z" },
+      { face: "top", d: "M29.44 51L58.89 68L88.33 51L58.89 34Z" }
+    ]
+  },
+  heart: {
+    w: 102,
+    h: 88.33,
+    faces: [
+      { face: "front", d: "M17 0L34 29.44L17 58.89L0 29.44Z" },
+      { face: "top", d: "M17 0L51 0L68 29.44L34 29.44Z" },
+      { face: "right", d: "M51 58.89L85 58.89L68 88.33L34 88.33Z" },
+      { face: "front", d: "M34 29.44L51 58.89L34 88.33L17 58.89Z" },
+      { face: "right", d: "M68 29.44L102 29.44L85 58.89L51 58.89Z" },
+      { face: "front", d: "M51 0L68 29.44L51 58.89L34 29.44Z" },
+      { face: "top", d: "M51 0L85 0L102 29.44L68 29.44Z" }
+    ]
+  },
+  heartMirrored: {
+    w: 102,
+    h: 88.33,
+    faces: [
+      { face: "front", d: "M85 0L68 29.44L85 58.89L102 29.44Z" },
+      { face: "top", d: "M85 0L51 0L34 29.44L68 29.44Z" },
+      { face: "right", d: "M51 58.89L17 58.89L34 88.33L68 88.33Z" },
+      { face: "front", d: "M68 29.44L51 58.89L68 88.33L85 58.89Z" },
+      { face: "right", d: "M34 29.44L0 29.44L17 58.89L51 58.89Z" },
+      { face: "front", d: "M51 0L34 29.44L51 58.89L68 29.44Z" },
+      { face: "top", d: "M51 0L17 0L0 29.44L34 29.44Z" }
+    ]
+  },
+  barHorizontal: {
+    w: 117.78,
+    h: 102,
+    faces: [
+      { face: "top", d: "M0 17L29.44 0L58.89 17L29.44 34Z" },
+      { face: "front", d: "M0 17L29.44 34L29.44 68L0 51Z" },
+      { face: "top", d: "M29.44 34L58.89 17L88.33 34L58.89 51Z" },
+      { face: "front", d: "M29.44 34L58.89 51L58.89 85L29.44 68Z" },
+      { face: "top", d: "M58.89 51L88.33 34L117.78 51L88.33 68Z" },
+      { face: "right", d: "M88.33 68L117.78 51L117.78 85L88.33 102Z" },
+      { face: "front", d: "M58.89 51L88.33 68L88.33 102L58.89 85Z" }
+    ]
+  },
+  barVertical: {
+    w: 58.89,
+    h: 136,
+    faces: [
+      { face: "right", d: "M29.44 102L58.89 85L58.89 119L29.44 136Z" },
+      { face: "front", d: "M0 85L29.44 102L29.44 136L0 119Z" },
+      { face: "right", d: "M29.44 68L58.89 51L58.89 85L29.44 102Z" },
+      { face: "front", d: "M0 51L29.44 68L29.44 102L0 85Z" },
+      { face: "top", d: "M0 17L29.44 0L58.89 17L29.44 34Z" },
+      { face: "right", d: "M29.44 34L58.89 17L58.89 51L29.44 68Z" },
+      { face: "front", d: "M0 17L29.44 34L29.44 68L0 51Z" }
+    ]
+  }
+}, lt = {
+  square: {
+    "top-left": W.cube,
+    "top-right": W.cube,
+    "bottom-left": W.cube,
+    "bottom-right": W.cube
+  },
+  corner: {
+    "top-left": W.cornerStanding,
+    "top-right": W.cornerStanding,
+    "bottom-left": W.cornerLying,
+    "bottom-right": W.cornerLying
+  },
+  angle: {
+    "top-left": W.angleStanding,
+    "top-right": W.angleStanding,
+    "bottom-left": W.angleLying,
+    "bottom-right": W.angleLying
+  },
+  heart: {
+    "top-left": W.heart,
+    "top-right": W.heart,
+    "bottom-left": W.heart,
+    "bottom-right": W.heart
+  },
+  bar: {
+    "top-left": W.barVertical,
+    "top-right": W.barHorizontal,
+    "bottom-left": W.barHorizontal,
+    "bottom-right": W.barVertical
+  }
+}, Qe = 34, gr = {
+  front: we.faceFront,
+  top: we.faceTop,
+  right: we.faceRight
+};
+function ur(n) {
+  return n in lt;
+}
+const je = me(
   ({
-    position: n = "top-left",
-    size: e = "md",
-    className: a,
-    "aria-label": d,
-    "aria-hidden": h = !0,
-    "data-color": k,
-    "data-size": u,
-    ...v
-  }, M) => {
-    R(() => {
-      const I = "rk-crosscorner-inline-styles";
-      if (typeof document > "u" || document.getElementById(I)) return;
-      const V = Go(_e), D = document.createElement("style");
-      D.id = I, D.textContent = V, document.head.appendChild(D);
+    shape: n = "corner",
+    variant: e = "solid",
+    position: a = "top-left",
+    size: c = "md",
+    mirrored: k = !1,
+    className: y,
+    "aria-label": f,
+    "aria-hidden": x = !0,
+    "data-color": B,
+    "data-size": I,
+    ...J
+  }, L) => {
+    U(() => {
+      const d = "rk-graphic-element-inline-styles";
+      if (typeof document > "u" || document.getElementById(d)) return;
+      const l = dr(we), v = document.createElement("style");
+      v.id = d, v.textContent = l, document.head.appendChild(v);
     }, []);
-    const C = Wo[e], G = Ho[n];
+    const R = cr[c], G = mr[n], p = e === "isometric" && ur(n) ? n === "heart" && k ? W.heartMirrored : lt[n][a] : void 0, Q = e === "isometric" && !p ? "solid" : e, K = p ? 0 : pr[a], N = p ? p.w : G.viewBoxW, w = p ? p.h : G.viewBoxH, H = K === 90 || K === 270, P = H ? w : N, E = H ? N : w, q = Math.round(R * P / Qe), Y = Math.round(R * E / Qe), $ = K === 90 ? `rotate(90) translate(0 ${-w})` : K === 180 ? `rotate(180) translate(${-N} ${-w})` : K === 270 ? `rotate(-90) translate(${-N} 0)` : void 0;
     return /* @__PURE__ */ t(
       "svg",
       {
-        ref: M,
-        className: `${_e.crossCorner} ${a || ""}`,
-        width: C,
-        height: C,
-        viewBox: "0 0 68 68",
+        ref: L,
+        className: `${we.graphicElement} ${y || ""}`,
+        width: q,
+        height: Y,
+        viewBox: `0 0 ${P} ${E}`,
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg",
-        "aria-label": d,
-        "aria-hidden": h,
-        role: h ? void 0 : "img",
-        "data-color": k,
-        "data-size": u,
-        style: {
-          transform: G ? `rotate(${G}deg)` : void 0
-        },
-        ...v,
-        children: /* @__PURE__ */ t(
+        "aria-label": f,
+        "aria-hidden": x,
+        role: x ? void 0 : "img",
+        "data-shape": n,
+        "data-variant": Q,
+        "data-color": B,
+        "data-size": I,
+        ...J,
+        children: /* @__PURE__ */ t("g", { transform: $, children: p ? p.faces.map((d, l) => /* @__PURE__ */ t("path", { d: d.d, className: gr[d.face] }, l)) : /* @__PURE__ */ t(
           "path",
           {
-            d: "M68 0V33.8203H67.998V68H34.1777V33.8203H0V0H68Z",
-            className: _e.shape
+            d: Q === "outline" ? G.outline : G.solid,
+            className: we.shape,
+            vectorEffect: "non-scaling-stroke"
           }
-        )
+        ) })
       }
     );
   }
 );
-be.displayName = "CrossCorner";
-const ei = mt, ti = gt, ni = ut, U = ht, oi = yt, ri = xt, ai = kt, si = bt, ii = vt, li = ft, di = Tt, ci = Ct, Uo = St, Vo = wt;
-Uo.displayName = "Field.Description";
-Vo.displayName = "Field.Counter";
-const pi = He, Oo = se((n, e) => /* @__PURE__ */ t(It, { ref: e, ...n }));
-Oo.displayName = "Heading";
-const Ye = _t;
-Ye.displayName = "Input";
-const Ko = se((n, e) => /* @__PURE__ */ t(Dt, { ref: e, ...n }));
-Ko.displayName = "Label";
-const re = Lt, mi = At, qo = Nt, gi = Ft, ui = jt, hi = Mt, fi = Bt;
-qo.displayName = "Pagination";
-const ye = se(
-  (n, e) => /* @__PURE__ */ t(Et, { ref: e, ...n })
+je.displayName = "GraphicElement";
+const Ci = It, wi = Lt, Si = Dt, oe = Mt, _i = Bt, Ii = Ft, Li = At, Di = Et, Mi = Nt, ji = jt, Ai = Pt, Ni = $t, hr = Rt, fr = zt;
+hr.displayName = "Field.Description";
+fr.displayName = "Field.Counter";
+const Ei = ot, dt = Gt;
+dt.displayName = "Input";
+const kr = me((n, e) => /* @__PURE__ */ t(Ht, { ref: e, ...n }));
+kr.displayName = "Label";
+const pe = Wt, Bi = Ut, vr = Vt, Fi = Zt, Pi = Kt, $i = Ot, zi = qt;
+vr.displayName = "Pagination";
+const Ne = me(
+  (n, e) => /* @__PURE__ */ t(Yt, { ref: e, ...n })
 );
-ye.displayName = "Paragraph";
-const ki = Pt, vi = $t, bi = zt, Te = Object.assign(Rt, {
-  Button: Ht,
-  ClearButton: Wt,
-  Input: Gt
-}), yi = Ut, xi = Vt, Ti = Ot, Yo = Kt;
-Yo.displayName = "Suggestion";
-const De = qt, Ci = Yt, Ce = Zt, Zo = se(function({ shape: e, style: a, ...d }, h) {
-  const k = {};
-  e === "rounded" && (k.borderRadius = "var(--ds-border-radius-xl)");
-  const u = Object.keys(k).length === 0 && !a ? void 0 : { ...k, ...a }, v = {};
-  return e === "rounded" && (v["data-shape"] = "rounded"), /* @__PURE__ */ t(Xt, { ref: h, ...d, ...v, style: u });
+Ne.displayName = "Paragraph";
+const Ri = Xt, Gi = Jt, Hi = Qt, Pe = Object.assign(en, {
+  Button: on,
+  ClearButton: nn,
+  Input: tn
+}), Wi = rn, Ui = an, Vi = sn, br = ln;
+br.displayName = "Suggestion";
+const Re = dn, Oi = cn, Te = pn, yr = me(function({ shape: e, style: a, ...c }, k) {
+  const y = {};
+  e === "rounded" && (y.borderRadius = "var(--ds-border-radius-xl)");
+  const f = Object.keys(y).length === 0 && !a ? void 0 : { ...y, ...a }, x = {};
+  return e === "rounded" && (x["data-shape"] = "rounded"), /* @__PURE__ */ t(mn, { ref: k, ...c, ...x, style: f });
 });
-Zo.displayName = "Tag";
-const wi = Jt, Xo = Qt, Si = en, Ii = tn, Jo = se((n, e) => /* @__PURE__ */ t(nn, { ref: e, ...n }));
-Jo.displayName = "ValidationMessage";
-const Qo = "_header_ae1dv_1", er = "_languageSwitch_ae1dv_37", tr = "_searchOverlay_ae1dv_41", nr = "_headerExtension_ae1dv_46", or = "_headerExtensionTinted_ae1dv_75", rr = "_languageLabel_ae1dv_83", ar = "_languageLink_ae1dv_88", sr = "_extensionContent_ae1dv_93", ir = "_extensionDivider_ae1dv_98", lr = "_extensionContentWrapper_ae1dv_103", dr = "_headerInner_ae1dv_199", cr = "_logoWrapper_ae1dv_216", pr = "_logo_ae1dv_216", mr = "_secondaryLogoWrapper_ae1dv_239", gr = "_slotComponent_ae1dv_248", ur = "_slotContainer_ae1dv_258", hr = "_slotText_ae1dv_266", fr = "_secondaryLogo_ae1dv_239", kr = "_redCrossLogo_ae1dv_293", vr = "_primaryLogo_ae1dv_299", br = "_navItems_ae1dv_303", yr = "_navLink_ae1dv_312", xr = "_actions_ae1dv_325", Tr = "_ctaButton_ae1dv_333", Cr = "_themeToggle_ae1dv_338", wr = "_userInfo_ae1dv_343", Sr = "_userName_ae1dv_349", Ir = "_loginLink_ae1dv_356", _r = "_loginText_ae1dv_365", Dr = "_underline_ae1dv_372", Lr = "_searchButtonWrapper_ae1dv_378", Ar = "_buttonText_ae1dv_382", Nr = "_menuButton_ae1dv_387", Mr = "_menuOverlay_ae1dv_392", jr = "_searchContent_ae1dv_426", Fr = "_menuContent_ae1dv_436", Br = "_menuLeftColumn_ae1dv_445", Er = "_menuRightColumn_ae1dv_451", Pr = "_slotContent_ae1dv_465", $r = "_navList_ae1dv_478", zr = "_menuUtilities_ae1dv_485", Rr = "_menuBrand_ae1dv_492", Gr = "_suggestionsSection_ae1dv_496", Wr = "_suggestionsTitle_ae1dv_502", Hr = "_searchResults_ae1dv_511", Ur = "_resultList_ae1dv_517", Vr = "_resultItem_ae1dv_523", Or = "_resultLink_ae1dv_531", Kr = "_suggestionIcon_ae1dv_545", qr = "_suggestionText_ae1dv_558", Yr = "_highlightedText_ae1dv_565", Zr = "_remainingText_ae1dv_570", Xr = "_viewAllLink_ae1dv_583", Jr = "_noResults_ae1dv_618", s = {
-  header: Qo,
-  languageSwitch: er,
-  searchOverlay: tr,
-  headerExtension: nr,
-  headerExtensionTinted: or,
-  languageLabel: rr,
-  languageLink: ar,
-  extensionContent: sr,
-  extensionDivider: ir,
-  extensionContentWrapper: lr,
-  headerInner: dr,
-  logoWrapper: cr,
-  logo: pr,
-  secondaryLogoWrapper: mr,
-  slotComponent: gr,
-  slotContainer: ur,
-  slotText: hr,
-  secondaryLogo: fr,
-  redCrossLogo: kr,
-  primaryLogo: vr,
-  navItems: br,
-  navLink: yr,
-  actions: xr,
-  ctaButton: Tr,
-  themeToggle: Cr,
-  userInfo: wr,
-  userName: Sr,
-  loginLink: Ir,
-  loginText: _r,
-  underline: Dr,
-  searchButtonWrapper: Lr,
-  buttonText: Ar,
-  menuButton: Nr,
-  menuOverlay: Mr,
-  searchContent: jr,
-  menuContent: Fr,
-  menuLeftColumn: Br,
-  menuRightColumn: Er,
-  slotContent: Pr,
-  navList: $r,
-  menuUtilities: zr,
-  menuBrand: Rr,
-  suggestionsSection: Gr,
-  suggestionsTitle: Wr,
-  searchResults: Hr,
-  resultList: Ur,
-  resultItem: Vr,
-  resultLink: Or,
-  suggestionIcon: Kr,
-  suggestionText: qr,
-  highlightedText: Yr,
-  remainingText: Zr,
-  viewAllLink: Xr,
-  noResults: Jr
-}, Qr = [
+yr.displayName = "Tag";
+const Ki = gn, xr = un, Zi = hn, qi = fn, Tr = me((n, e) => /* @__PURE__ */ t(kn, { ref: e, ...n }));
+Tr.displayName = "ValidationMessage";
+const Cr = "_header_4177j_1", wr = "_languageSwitch_4177j_37", Sr = "_searchOverlay_4177j_41", _r = "_headerExtension_4177j_46", Ir = "_headerExtensionTinted_4177j_75", Lr = "_languageLabel_4177j_83", Dr = "_languageLink_4177j_88", Mr = "_extensionContent_4177j_93", jr = "_extensionDivider_4177j_98", Ar = "_extensionContentWrapper_4177j_103", Nr = "_headerInner_4177j_199", Er = "_logoWrapper_4177j_216", Br = "_logo_4177j_216", Fr = "_secondaryLogoWrapper_4177j_239", Pr = "_slotComponent_4177j_248", $r = "_slotContainer_4177j_258", zr = "_slotText_4177j_266", Rr = "_secondaryLogo_4177j_239", Gr = "_redCrossLogo_4177j_293", Hr = "_primaryLogo_4177j_299", Wr = "_navItems_4177j_303", Ur = "_navLink_4177j_312", Vr = "_actions_4177j_325", Or = "_ctaButton_4177j_333", Kr = "_themeToggle_4177j_338", Zr = "_userInfo_4177j_343", qr = "_userName_4177j_349", Yr = "_loginLink_4177j_356", Xr = "_loginText_4177j_365", Jr = "_underline_4177j_372", Qr = "_searchButtonWrapper_4177j_378", ea = "_buttonText_4177j_382", ta = "_menuButton_4177j_387", na = "_menuOverlay_4177j_392", oa = "_searchContent_4177j_426", ra = "_menuContent_4177j_436", aa = "_menuLeftColumn_4177j_445", sa = "_menuRightColumn_4177j_451", ia = "_slotContent_4177j_465", la = "_navList_4177j_478", da = "_menuUtilities_4177j_485", ca = "_menuBrand_4177j_492", pa = "_suggestionsSection_4177j_496", ma = "_suggestionsTitle_4177j_502", ga = "_searchResults_4177j_511", ua = "_resultList_4177j_517", ha = "_resultItem_4177j_523", fa = "_resultLink_4177j_531", ka = "_suggestionIcon_4177j_545", va = "_suggestionText_4177j_558", ba = "_highlightedText_4177j_565", ya = "_remainingText_4177j_570", xa = "_viewAllLink_4177j_583", Ta = "_noResults_4177j_618", i = {
+  header: Cr,
+  languageSwitch: wr,
+  searchOverlay: Sr,
+  headerExtension: _r,
+  headerExtensionTinted: Ir,
+  languageLabel: Lr,
+  languageLink: Dr,
+  extensionContent: Mr,
+  extensionDivider: jr,
+  extensionContentWrapper: Ar,
+  headerInner: Nr,
+  logoWrapper: Er,
+  logo: Br,
+  secondaryLogoWrapper: Fr,
+  slotComponent: Pr,
+  slotContainer: $r,
+  slotText: zr,
+  secondaryLogo: Rr,
+  redCrossLogo: Gr,
+  primaryLogo: Hr,
+  navItems: Wr,
+  navLink: Ur,
+  actions: Vr,
+  ctaButton: Or,
+  themeToggle: Kr,
+  userInfo: Zr,
+  userName: qr,
+  loginLink: Yr,
+  loginText: Xr,
+  underline: Jr,
+  searchButtonWrapper: Qr,
+  buttonText: ea,
+  menuButton: ta,
+  menuOverlay: na,
+  searchContent: oa,
+  menuContent: ra,
+  menuLeftColumn: aa,
+  menuRightColumn: sa,
+  slotContent: ia,
+  navList: la,
+  menuUtilities: da,
+  menuBrand: ca,
+  suggestionsSection: pa,
+  suggestionsTitle: ma,
+  searchResults: ga,
+  resultList: ua,
+  resultItem: ha,
+  resultLink: fa,
+  suggestionIcon: ka,
+  suggestionText: va,
+  highlightedText: ba,
+  remainingText: ya,
+  viewAllLink: xa,
+  noResults: Ta
+}, Ca = [
   // Pages
   { id: "home", title: "Hjem", category: "Page", path: "home", description: "Forsiden" },
   { id: "components", title: "Komponenter", category: "Page", path: "components", description: "Oversikt over alle komponenter" },
   { id: "design", title: "Design", category: "Page", path: "design", description: "Designretningslinjer og prinsipper" },
   { id: "code", title: "Kode", category: "Page", path: "code", description: "Utviklerdokumentasjon og oppsett" },
-  // Components
+  { id: "tokens", title: "Tokens", category: "Page", path: "tokens", description: "Design tokens: farger, størrelser og typografi" },
+  // Components (samme utvalg som komponentkatalogen)
   { id: "alert", title: "Alert", category: "Component", path: "components", description: "Varselbokser for viktige meldinger" },
   { id: "avatar", title: "Avatar", category: "Component", path: "components", description: "Profilbilder og initialer" },
   { id: "badge", title: "Badge", category: "Component", path: "components", description: "Små merker for status eller antall" },
+  { id: "breadcrumbs", title: "Breadcrumbs", category: "Component", path: "components", description: "Brødsmulesti for navigasjon" },
   { id: "button", title: "Button", category: "Component", path: "components", description: "Knapper for handlinger" },
   { id: "card", title: "Card", category: "Component", path: "components", description: "Kort for gruppering av innhold" },
   { id: "carousel", title: "Carousel", category: "Component", path: "components", description: "Bildekarusell" },
   { id: "checkbox", title: "Checkbox", category: "Component", path: "components", description: "Valg av flere alternativer" },
+  { id: "chip", title: "Chip", category: "Component", path: "components", description: "Filtrering og valg i kompakte merker" },
+  { id: "dateinput", title: "DateInput", category: "Component", path: "components", description: "Tekstfelt for dato (dd.mm.åååå)" },
+  { id: "datepicker", title: "DatePicker", category: "Component", path: "components", description: "Kalender for valg av dato" },
+  { id: "details", title: "Details", category: "Component", path: "components", description: "Ekspanderbare seksjoner" },
   { id: "dialog", title: "Dialog", category: "Component", path: "components", description: "Modale vinduer" },
+  { id: "divider", title: "Divider", category: "Component", path: "components", description: "Skillelinjer" },
   { id: "dropdown", title: "Dropdown", category: "Component", path: "components", description: "Nedtrekksmenyer" },
+  { id: "errorsummary", title: "ErrorSummary", category: "Component", path: "components", description: "Oppsummering av skjemafeil" },
+  { id: "field", title: "Field", category: "Component", path: "components", description: "Feltoppsett med etikett og beskrivelse" },
+  { id: "fieldset", title: "Fieldset", category: "Component", path: "components", description: "Gruppering av skjemafelt" },
+  { id: "graphicelement", title: "GraphicElement", category: "Component", path: "components", description: "Grafiske merkevareelementer fra designretningen" },
   { id: "header", title: "Header", category: "Component", path: "components", description: "Topptekst og navigasjon" },
-  { id: "herosection", title: "HeroSection", category: "Component", path: "components", description: "Store introduksjonsseksjoner" },
   { id: "input", title: "Input", category: "Component", path: "components", description: "Tekstfelt for brukerinput" },
   { id: "link", title: "Link", category: "Component", path: "components", description: "Lenker til andre sider" },
   { id: "list", title: "List", category: "Component", path: "components", description: "Ordnede og uordnede lister" },
   { id: "pagination", title: "Pagination", category: "Component", path: "components", description: "Navigasjon mellom sider" },
+  { id: "popover", title: "Popover", category: "Component", path: "components", description: "Flytende innholdsbokser" },
   { id: "radio", title: "Radio", category: "Component", path: "components", description: "Valg av ett alternativ" },
   { id: "search", title: "Search", category: "Component", path: "components", description: "Søkefelter" },
   { id: "select", title: "Select", category: "Component", path: "components", description: "Valgmeny" },
-  { id: "spinner", title: "Spinner", category: "Component", path: "components", description: "Lasteindikator" },
+  { id: "skeletonloader", title: "SkeletonLoader", category: "Component", path: "components", description: "Plassholdere under lasting" },
+  { id: "skiplink", title: "SkipLink", category: "Component", path: "components", description: "Hopp til hovedinnhold" },
+  { id: "spinnerloader", title: "SpinnerLoader", category: "Component", path: "components", description: "Lasteindikator" },
+  { id: "suggestion", title: "Suggestion", category: "Component", path: "components", description: "Søkefelt med forslag" },
   { id: "switch", title: "Switch", category: "Component", path: "components", description: "Av/på bryter" },
   { id: "table", title: "Table", category: "Component", path: "components", description: "Tabeller for data" },
   { id: "tabs", title: "Tabs", category: "Component", path: "components", description: "Faner for inndeling av innhold" },
   { id: "tag", title: "Tag", category: "Component", path: "components", description: "Merkelapper og emneknagger" },
   { id: "textarea", title: "Textarea", category: "Component", path: "components", description: "Flerlinjers tekstfelt" },
+  { id: "textfield", title: "Textfield", category: "Component", path: "components", description: "Komplett tekstfelt med etikett" },
+  { id: "togglegroup", title: "ToggleGroup", category: "Component", path: "components", description: "Grupperte veksleknapper" },
   { id: "tooltip", title: "Tooltip", category: "Component", path: "components", description: "Hjelpetekster ved hover" },
-  // Design Docs - For Designere
+  // Design — For designere
   { id: "figma-oppkobling", title: "Figma tilkobling", category: "Design", path: "design/figma-oppkobling", description: "Hvordan koble til Figma-biblioteket" },
   { id: "oppstart", title: "Oppstart", category: "Design", path: "design/oppstart", description: "Oppsett av arbeidsområde" },
-  { id: "lage-komponenter", title: "Lage ett nytt komponent", category: "Design", path: "design/lage-komponenter", description: "Veileder for komponentbygging" },
+  { id: "lage-komponenter", title: "Lage en ny komponent", category: "Design", path: "design/lage-komponenter", description: "Veileder for komponentbygging" },
   { id: "praktiske-eksempler", title: "Praktiske eksempler", category: "Design", path: "design/praktiske-eksempler", description: "Eksempler på bruk av designsystemet" },
   { id: "token-studio", title: "Token Studio", category: "Design", path: "design/token-studio", description: "Bruk av Token Studio" },
-  // Design Docs - Farger
+  // Design — Farger
   { id: "fargesystem", title: "Sette opp ditt eget fargesystem", category: "Design", path: "design/fargesystem", description: "Hvordan sette opp farger" },
   { id: "temabygger", title: "Temabygger", category: "Design", path: "design/temabygger", description: "Designsystemets temagenerator" },
   { id: "bruk-farger", title: "Bruk fargene", category: "Design", path: "design/bruk-farger", description: "Bruk genererte farger" },
-  // Design Docs - Bidra
+  // Design — Guider
+  { id: "vedlikeholde-design-tokens", title: "Vedlikeholde design tokens", category: "Design", path: "design/vedlikeholde-design-tokens", description: "Endre tokens og publisere ny versjon" },
+  { id: "endre-bygge-tema", title: "Endre og bygge tema", category: "Design", path: "design/endre-bygge-tema", description: "Temaoppsett og bygging av tokens" },
+  { id: "koble-tokens-til-figma", title: "Koble tokens til Figma", category: "Design", path: "design/koble-tokens-til-figma", description: "Synkronisere tokens med Figma" },
+  // Design — Bidra
   { id: "foresla-design", title: "Foreslå nytt design", category: "Design", path: "design/foresla-design", description: "Hvordan bidra med nytt design" },
-  // Design Docs - Designelementer
+  // Design — Designelementer
   { id: "hva-er-design-tokens", title: "Hva er design tokens", category: "Design", path: "design/hva-er-design-tokens", description: "Introduksjon til design tokens" },
   { id: "design-tokens-i-figma", title: "Design tokens i Figma", category: "Design", path: "design/design-tokens-i-figma", description: "Bruke tokens i Figma" },
   { id: "farger-navnestruktur", title: "Farger: Navnestruktur", category: "Design", path: "design/farger-navnestruktur", description: "Navngiving av farger" },
@@ -3740,55 +4147,67 @@ const Qo = "_header_ae1dv_1", er = "_languageSwitch_ae1dv_37", tr = "_searchOver
   { id: "storrelse-tokens", title: "Størrelse-tokens", category: "Design", path: "design/storrelse-tokens", description: "Tokens for størrelser" },
   { id: "font-family", title: "Typografi: Font-family", category: "Design", path: "design/font-family", description: "Font-familier" },
   { id: "typografi-tokens", title: "Typografi-tokens", category: "Design", path: "design/typografi-tokens", description: "Tokens for typografi" },
-  // Code Docs
-  { id: "code-intro", title: "Oversikt (Kode)", category: "Code", path: "code/intro", description: "Startside for kode" },
+  // Code
   { id: "kom-i-gang", title: "Kom i gang (Kode)", category: "Code", path: "code/kom-i-gang", description: "Installasjon og oppsett" },
-  { id: "figma-mcp", title: "Fra Figma til Kode (MCP)", category: "Code", path: "code/figma-mcp", description: "Automatisert arbeidsflyt med MCP" },
-  { id: "komponent-kreasjon", title: "Komponent Kreasjon", category: "Code", path: "code/komponent-kreasjon", description: "Opprette nye komponenter" },
-  { id: "progression", title: "Progresjon", category: "Code", path: "code/progression", description: "Fra design til ferdig komponent" },
-  { id: "metadata-files", title: "Metadata filer", category: "Code", path: "code/metadata-files", description: "Struktur og bruk av metadata.json" }
+  { id: "code-design-tokens", title: "Design tokens (Kode)", category: "Code", path: "code/design-tokens", description: "Bruke tokens i kode" },
+  { id: "fonts", title: "Fonter", category: "Code", path: "code/fonts", description: "Oppsett av Source Sans 3" },
+  { id: "icons", title: "Ikoner", category: "Code", path: "code/icons", description: "Ikonbibliotek og bruk" },
+  { id: "contributing", title: "Bidra med kode", category: "Code", path: "code/contributing", description: "Retningslinjer for bidrag" },
+  { id: "figma-mcp-intro", title: "Fra Figma til kode (MCP)", category: "Code", path: "code/figma-mcp-intro", description: "Automatisert arbeidsflyt med MCP" },
+  { id: "figma-mcp-cursor", title: "Figma MCP i Cursor", category: "Code", path: "code/figma-mcp-cursor", description: "Oppsett av MCP i Cursor" },
+  { id: "figma-mcp-claude", title: "Figma MCP i Claude", category: "Code", path: "code/figma-mcp-claude", description: "Oppsett av MCP i Claude" },
+  { id: "komponent-kreasjon", title: "Komponentkreasjon", category: "Code", path: "code/komponent-kreasjon", description: "Opprette nye komponenter" },
+  { id: "metadata-files", title: "Metadata-filer", category: "Code", path: "code/metadata-files", description: "Struktur og bruk av metadata.json" }
 ];
-function ea(n) {
+function wa(n) {
   return n.split(/\s+/).map((e) => e[0] ?? "").join("").slice(0, 2).toUpperCase();
 }
-const _i = ({
+const Yi = ({
   variant: n = "default",
   "data-color": e = "primary",
   activePage: a,
-  setPage: d,
-  children: h,
-  showUser: k = !0,
-  showSearch: u = !0,
-  showLogin: v = !0,
-  showCta: M = !1,
-  ctaLabel: C,
-  ctaIcon: G = /* @__PURE__ */ t(gn, { "aria-hidden": !0 }),
-  onCtaClick: I,
-  showThemeToggle: V = !1,
-  secondaryLogo: D = !1,
+  setPage: c,
+  children: k,
+  showUser: y = !0,
+  showSearch: f = !0,
+  showLogin: x = !0,
+  showCta: B = !1,
+  ctaLabel: I,
+  ctaIcon: J = /* @__PURE__ */ t(Mn, { "aria-hidden": !0 }),
+  onCtaClick: L,
+  showThemeToggle: R = !1,
+  secondaryLogo: G = !1,
   secondaryLogoSrc: p,
-  secondaryLogoSrcDark: X,
-  secondaryLogoAlt: ne = "Secondary Logo",
-  navItems: _,
-  showNavItems: J = !0,
-  showMenuButton: m = !0,
-  showHeaderExtension: L = !1,
-  showModeToggle: w = !1,
-  showLanguageSwitch: j = !1,
-  extensionColor: A,
-  userName: F,
-  userInitials: O,
-  userAvatarSrc: Q,
-  onUserClick: P
+  secondaryLogoSrcDark: Q,
+  secondaryLogoAlt: K = "Secondary Logo",
+  navItems: N,
+  showNavItems: w = !0,
+  showMenuButton: H = !0,
+  showHeaderExtension: P = !1,
+  showModeToggle: E = !1,
+  showLanguageSwitch: q = !1,
+  extensionColor: Y,
+  userName: $,
+  userInitials: d,
+  userAvatarSrc: l,
+  onUserClick: v
 }) => {
-  const [B, E] = Z(!1), [f, l] = Z(!1), [y, ee] = Z(""), [H, S] = Z("light"), { language: N, setLanguage: K, t: x } = xe(), [te, me] = Z(!1);
-  R(() => {
-    const i = "rk-header-inline-styles";
-    if (typeof document > "u" || document.getElementById(i)) return;
-    const g = ta(s), b = document.createElement("style");
-    b.id = i, b.textContent = g, document.head.appendChild(b);
+  const [S, F] = Z(!1), [D, g] = Z(!1), se = ye.useRef(null), ee = ye.useRef(null), te = ye.useRef(null), ne = ye.useRef(null), [z, ie] = Z(""), [T, h] = Z(() => {
+    var s;
+    if (typeof document < "u") {
+      const m = document.documentElement.getAttribute("data-color-scheme");
+      if (m === "dark" || m === "light") return m;
+      if ((s = window.matchMedia) != null && s.call(window, "(prefers-color-scheme: dark)").matches) return "dark";
+    }
+    return "light";
+  }), { language: C, setLanguage: j, t: _ } = Be(), [u, M] = Z(!1);
+  U(() => {
+    const s = "rk-header-inline-styles";
+    if (typeof document > "u" || document.getElementById(s)) return;
+    const m = Sa(i), b = document.createElement("style");
+    b.id = s, b.textContent = m, document.head.appendChild(b);
   }, []);
-  const ce = () => /* @__PURE__ */ r(
+  const le = () => /* @__PURE__ */ r(
     "svg",
     {
       width: "170",
@@ -3798,7 +4217,7 @@ const _i = ({
       xmlns: "http://www.w3.org/2000/svg",
       "aria-hidden": !0,
       focusable: "false",
-      className: s.redCrossLogo,
+      className: i.redCrossLogo,
       children: [
         /* @__PURE__ */ t("path", { d: "M76.1036 48.1397C77.8925 47.8781 79.6984 47.7525 81.5061 47.7639C84.1713 47.7639 86.0396 48.1669 87.3182 49.1857C87.8735 49.639 88.3149 50.2176 88.6067 50.8744C88.8984 51.5312 89.0323 52.2479 88.9974 52.9665C88.9839 53.9451 88.6724 54.896 88.1049 55.691C87.5373 56.4861 86.7411 57.087 85.8235 57.4129V57.4944C87.0796 58.006 87.7684 59.2104 88.2231 60.8722C88.7813 62.9097 89.3441 65.2688 89.6907 65.9661H85.5309C85.2382 65.4544 84.7835 63.9829 84.2793 61.7597C83.7751 59.5365 83.0097 58.8527 81.344 58.8527H80.1284V65.9661H76.1036V48.1397ZM80.1284 55.9141H81.7312C83.7526 55.9141 84.9546 54.8954 84.9546 53.3151C84.9546 51.6534 83.8336 50.8202 81.9698 50.7931C81.3532 50.7814 80.7368 50.8268 80.1284 50.9289V55.9141Z", fill: "#1E1E1E" }),
         /* @__PURE__ */ t("path", { d: "M97.8528 52.5633C98.9439 52.5351 100.026 52.7744 101.004 53.2606L102.256 51.4087L103.669 52.4003L102.467 54.2115C103.188 54.8589 103.758 55.6585 104.137 56.5531C104.515 57.4478 104.692 58.4154 104.655 59.3869C104.655 64.0506 101.243 66.2738 97.8573 66.2738C96.7852 66.2984 95.7234 66.059 94.7644 65.5765L93.4543 67.4556L92.1037 66.387L93.2787 64.6438C91.8651 63.4892 91.0277 61.7233 91.0277 59.414C91.0277 55.2891 93.7965 52.5543 97.8213 52.5543L97.8528 52.5633ZM99.2934 55.9411C98.8798 55.6237 98.3731 55.4533 97.8528 55.4566C95.7458 55.4566 94.949 57.5757 94.949 59.4005C94.9265 60.126 95.0909 60.845 95.4262 61.4878L95.4802 61.515L99.2934 55.9411ZM96.4932 62.8552C96.8653 63.1843 97.3486 63.3576 97.8438 63.3397C99.6446 63.3397 100.748 61.7821 100.748 59.4774C100.76 58.7777 100.625 58.0833 100.351 57.4399L100.27 57.4127L96.4932 62.8552Z", fill: "#1E1E1E" }),
@@ -3813,212 +4232,222 @@ const _i = ({
       ]
     }
   );
-  R(() => {
-    E(!1), l(!1), ee("");
-  }, [a]), R(() => {
-    if (!(typeof document > "u") && B && te) {
-      const i = document.body.style.overflow;
+  U(() => {
+    F(!1), g(!1), ie("");
+  }, [a]), U(() => {
+    if (!(typeof document > "u") && S && u) {
+      const s = document.body.style.overflow;
       return document.body.style.overflow = "hidden", () => {
-        document.body.style.overflow = i;
+        document.body.style.overflow = s;
       };
     }
-  }, [B, te]), R(() => {
+  }, [S, u]), U(() => {
     if (typeof window > "u" || typeof window.matchMedia > "u") return;
-    const i = window.matchMedia("(max-width: 850px)"), g = (b) => me("matches" in b ? b.matches : i.matches);
-    return g(i), i.addEventListener ? i.addEventListener("change", g) : i.addListener(g), () => {
-      i.removeEventListener ? i.removeEventListener("change", g) : i.removeListener(g);
+    const s = window.matchMedia("(max-width: 850px)"), m = (b) => M("matches" in b ? b.matches : s.matches);
+    return m(s), s.addEventListener ? s.addEventListener("change", m) : s.addListener(m), () => {
+      s.removeEventListener ? s.removeEventListener("change", m) : s.removeListener(m);
     };
-  }, []), R(() => {
+  }, []), U(() => {
     if (typeof document > "u") return;
-    const i = document.querySelector(`.${s.header}`);
-    if (!i) return;
-    const g = () => {
-      const Y = i.offsetHeight;
-      document.documentElement.style.setProperty("--header-height-mobile", `${Y}px`);
+    const s = document.querySelector(`.${i.header}`);
+    if (!s) return;
+    const m = () => {
+      const V = s.offsetHeight;
+      document.documentElement.style.setProperty("--header-height-mobile", `${V}px`);
     };
-    g(), window.addEventListener("resize", g);
+    m(), window.addEventListener("resize", m);
     const b = new ResizeObserver(() => {
-      g();
+      m();
     });
-    return b.observe(i), () => {
-      window.removeEventListener("resize", g), b.disconnect();
+    return b.observe(s), () => {
+      window.removeEventListener("resize", m), b.disconnect();
     };
-  }, [te]), R(() => {
+  }, [u]), U(() => {
     if (typeof document > "u") return;
-    const i = document.querySelector(`.${s.logoWrapper}`);
-    if (!i) return;
-    const g = () => {
-      const b = i.offsetWidth;
+    const s = document.querySelector(`.${i.logoWrapper}`);
+    if (!s) return;
+    const m = () => {
+      const b = s.offsetWidth;
       document.documentElement.style.setProperty("--rk-logo-width", `${b}px`);
     };
-    return g(), window.addEventListener("resize", g), () => window.removeEventListener("resize", g);
-  }, [te]), R(() => {
-    if (typeof document > "u" || !f) {
+    return m(), window.addEventListener("resize", m), () => window.removeEventListener("resize", m);
+  }, [u]), U(() => {
+    if (typeof document > "u" || !D) {
       document.documentElement.style.setProperty("--rk-search-overlay-height", "0px");
       return;
     }
-    const i = document.querySelector(`.${s.searchOverlay}`);
-    if (!i) return;
-    const g = () => {
-      const Y = i.offsetHeight;
-      document.documentElement.style.setProperty("--rk-search-overlay-height", `${Y}px`);
+    const s = document.querySelector(`.${i.searchOverlay}`);
+    if (!s) return;
+    const m = () => {
+      const V = s.offsetHeight;
+      document.documentElement.style.setProperty("--rk-search-overlay-height", `${V}px`);
     };
-    requestAnimationFrame(g), window.addEventListener("resize", g);
-    const b = new ResizeObserver(g);
-    return b.observe(i), () => {
-      window.removeEventListener("resize", g), b.disconnect();
+    requestAnimationFrame(m), window.addEventListener("resize", m);
+    const b = new ResizeObserver(m);
+    return b.observe(s), () => {
+      window.removeEventListener("resize", m), b.disconnect();
     };
-  }, [f]);
-  const pe = () => {
-    const i = H === "light" ? "dark" : "light";
-    S(i), document.documentElement.setAttribute("data-color-scheme", i);
-  }, c = (i) => {
-    d && (i.preventDefault(), d("home")), E(!1), l(!1);
-  }, T = () => {
-    E(!B), f && l(!1), !B && typeof document < "u" && requestAnimationFrame(() => {
-      const i = document.querySelector(`.${s.header}`);
-      if (i) {
-        const g = i.offsetHeight;
-        document.documentElement.style.setProperty("--header-height-mobile", `${g}px`);
+  }, [D]), U(() => {
+    if (!S && !D) return;
+    const s = (m) => {
+      var b, V;
+      m.key === "Escape" && (S && (F(!1), (b = se.current) == null || b.focus()), D && (g(!1), (V = ee.current) == null || V.focus()));
+    };
+    return document.addEventListener("keydown", s), () => document.removeEventListener("keydown", s);
+  }, [S, D]), U(() => {
+    var s, m, b;
+    D ? (s = ne.current) == null || s.focus() : S && ((b = (m = te.current) == null ? void 0 : m.querySelector('a[href], button, input, select, [tabindex]:not([tabindex="-1"])')) == null || b.focus());
+  }, [S, D]);
+  const re = () => {
+    const s = T === "light" ? "dark" : "light";
+    h(s), document.documentElement.setAttribute("data-color-scheme", s);
+  }, ge = (s) => {
+    c && (s.preventDefault(), c("home")), F(!1), g(!1);
+  }, xe = () => {
+    F(!S), D && g(!1), !S && typeof document < "u" && requestAnimationFrame(() => {
+      const s = document.querySelector(`.${i.header}`);
+      if (s) {
+        const m = s.offsetHeight;
+        document.documentElement.style.setProperty("--header-height-mobile", `${m}px`);
       }
     });
-  }, $ = () => {
-    l(!f), B && E(!1);
-  }, q = he(() => {
-    if (!y.trim()) return [];
-    const i = y.toLowerCase();
-    return Qr.filter(
-      (g) => g.title.toLowerCase().startsWith(i)
+  }, Se = () => {
+    g(!D), S && F(!1);
+  }, A = Ae(() => {
+    if (!z.trim()) return [];
+    const s = z.toLowerCase();
+    return Ca.filter(
+      (m) => m.title.toLowerCase().startsWith(s)
     );
-  }, [y]), ie = (i) => {
-    d && d(i), l(!1), ee("");
+  }, [z]), ae = (s) => {
+    c && c(s), g(!1), ie("");
   };
-  return /* @__PURE__ */ r("header", { className: s.header, "data-open": B ? "true" : "false", "data-color": e, "data-variant": n, children: [
-    L && /* @__PURE__ */ t("div", { className: `${s.headerExtension}${A === "tinted" ? ` ${s.headerExtensionTinted}` : ""}`, "data-color-scheme": "light", "data-extension-color": A, children: /* @__PURE__ */ r("div", { className: s.extensionContentWrapper, children: [
-      w && /* @__PURE__ */ t("div", { className: s.extensionContent, children: /* @__PURE__ */ t(
-        De,
+  return /* @__PURE__ */ r("header", { className: i.header, "data-open": S ? "true" : "false", "data-color": e, "data-variant": n, children: [
+    P && /* @__PURE__ */ t("div", { className: `${i.headerExtension}${Y === "tinted" ? ` ${i.headerExtensionTinted}` : ""}`, "data-color-scheme": "light", "data-extension-color": Y, children: /* @__PURE__ */ r("div", { className: i.extensionContentWrapper, children: [
+      E && /* @__PURE__ */ t("div", { className: i.extensionContent, children: /* @__PURE__ */ t(
+        Re,
         {
           "data-size": "sm",
-          checked: H === "dark",
-          onChange: pe,
-          label: x("header.darkMode"),
+          checked: T === "dark",
+          onChange: re,
+          label: _("header.darkMode"),
           color: "neutral",
           "data-color-scheme": "light"
         }
       ) }),
-      w && j && /* @__PURE__ */ t("div", { className: s.extensionDivider }),
-      j && /* @__PURE__ */ r("div", { className: s.languageSwitch, children: [
-        /* @__PURE__ */ t("span", { className: s.languageLabel, children: x("header.language") }),
-        /* @__PURE__ */ r(U.TriggerContext, { children: [
+      E && q && /* @__PURE__ */ t("div", { className: i.extensionDivider }),
+      q && /* @__PURE__ */ r("div", { className: i.languageSwitch, children: [
+        /* @__PURE__ */ t("span", { className: i.languageLabel, children: _("header.language") }),
+        /* @__PURE__ */ r(oe.TriggerContext, { children: [
           /* @__PURE__ */ r(
-            U.Trigger,
+            oe.Trigger,
             {
-              className: s.languageLink,
-              "aria-label": x("header.selectLanguage"),
+              className: i.languageLink,
+              "aria-label": _("header.selectLanguage"),
               style: { background: "transparent", border: "none", padding: 0, cursor: "pointer", font: "inherit" },
               children: [
-                N,
+                C,
                 " ",
-                /* @__PURE__ */ t(je, { "aria-hidden": !0 })
+                /* @__PURE__ */ t(Ze, { "aria-hidden": !0 })
               ]
             }
           ),
           /* @__PURE__ */ t(
-            U,
+            oe,
             {
-              "data-color-scheme": H,
+              "data-color-scheme": T,
               placement: "bottom-end",
-              children: /* @__PURE__ */ r(U.List, { children: [
-                /* @__PURE__ */ t(U.Item, { children: /* @__PURE__ */ t(U.Button, { onClick: () => K("NO"), children: "Norsk (NO)" }) }),
-                /* @__PURE__ */ t(U.Item, { children: /* @__PURE__ */ t(U.Button, { onClick: () => K("EN"), children: "English (EN)" }) })
+              children: /* @__PURE__ */ r(oe.List, { children: [
+                /* @__PURE__ */ t(oe.Item, { children: /* @__PURE__ */ t(oe.Button, { onClick: () => j("NO"), children: "Norsk (NO)" }) }),
+                /* @__PURE__ */ t(oe.Item, { children: /* @__PURE__ */ t(oe.Button, { onClick: () => j("EN"), children: "English (EN)" }) })
               ] })
             }
           )
         ] })
       ] })
     ] }) }),
-    /* @__PURE__ */ r("div", { className: s.headerInner, children: [
-      /* @__PURE__ */ r("div", { className: s.logoWrapper, children: [
+    /* @__PURE__ */ r("div", { className: i.headerInner, children: [
+      /* @__PURE__ */ r("div", { className: i.logoWrapper, children: [
         /* @__PURE__ */ t(
-          re,
+          pe,
           {
             href: "/",
-            className: `${s.logo} ${s.primaryLogo}`,
-            "aria-label": x("header.homeAriaLabel"),
-            onClick: c,
-            children: /* @__PURE__ */ t(ce, {})
+            className: `${i.logo} ${i.primaryLogo}`,
+            "aria-label": _("header.homeAriaLabel"),
+            onClick: ge,
+            children: /* @__PURE__ */ t(le, {})
           }
         ),
-        /* @__PURE__ */ t("div", { className: s.secondaryLogoWrapper, children: D && p ? /* @__PURE__ */ t(
+        /* @__PURE__ */ t("div", { className: i.secondaryLogoWrapper, children: G && p ? /* @__PURE__ */ t(
           "img",
           {
-            src: H === "dark" && X ? X : p,
-            alt: ne,
-            className: s.secondaryLogo
+            src: T === "dark" && Q ? Q : p,
+            alt: K,
+            className: i.secondaryLogo
           }
-        ) : D ? /* @__PURE__ */ t("div", { className: s.slotComponent, children: /* @__PURE__ */ t("div", { className: s.slotContainer, children: /* @__PURE__ */ t("p", { className: s.slotText, children: "SLOT" }) }) }) : null })
+        ) : G ? /* @__PURE__ */ t("div", { className: i.slotComponent, children: /* @__PURE__ */ t("div", { className: i.slotContainer, children: /* @__PURE__ */ t("p", { className: i.slotText, children: "SLOT" }) }) }) : null })
       ] }),
-      J && _ && _.length > 0 && !te && /* @__PURE__ */ t("nav", { className: s.navItems, children: _.map((i, g) => /* @__PURE__ */ t(
-        re,
+      w && N && N.length > 0 && !u && /* @__PURE__ */ t("nav", { className: i.navItems, children: N.map((s, m) => /* @__PURE__ */ t(
+        pe,
         {
-          href: i.href,
-          className: s.navLink,
+          href: s.href,
+          className: i.navLink,
           onClick: (b) => {
-            d && (b.preventDefault(), d(i.href));
+            c && (b.preventDefault(), c(s.href));
           },
-          children: i.label
+          children: s.label
         },
-        g
+        m
       )) }),
-      /* @__PURE__ */ r("div", { className: s.actions, children: [
-        M && /* @__PURE__ */ r(
-          de,
+      /* @__PURE__ */ r("div", { className: i.actions, children: [
+        B && /* @__PURE__ */ r(
+          fe,
           {
             variant: "primary",
             "data-color": "main",
             "data-size": "md",
-            className: s.ctaButton,
-            onClick: I,
+            className: i.ctaButton,
+            onClick: L,
             children: [
-              G,
-              /* @__PURE__ */ t("span", { className: G ? s.buttonText : void 0, children: C || x("header.supportUs") })
+              J,
+              /* @__PURE__ */ t("span", { className: J ? i.buttonText : void 0, children: I || _("header.supportUs") })
             ]
           }
         ),
-        !L && V && /* @__PURE__ */ t("div", { className: s.themeToggle, children: /* @__PURE__ */ t(
-          De,
+        !P && R && /* @__PURE__ */ t("div", { className: i.themeToggle, children: /* @__PURE__ */ t(
+          Re,
           {
-            checked: H === "dark",
-            onChange: pe,
-            "aria-label": x("header.toggleTheme")
+            checked: T === "dark",
+            onChange: re,
+            "aria-label": _("header.toggleTheme")
           }
         ) }),
-        k && (() => {
-          const i = F ?? "Frodo Baggins", g = O ?? (F ? ea(F) : "FB"), b = !!P;
+        y && (() => {
+          const s = $ ?? "Frodo Baggins", m = d ?? ($ ? wa($) : "FB"), b = !!v;
           return /* @__PURE__ */ r(
             "div",
             {
-              className: s.userInfo,
-              onClick: P,
+              className: i.userInfo,
+              onClick: v,
               role: b ? "button" : void 0,
               tabIndex: b ? 0 : void 0,
-              onKeyDown: b ? (Y) => {
-                (Y.key === "Enter" || Y.key === " ") && (Y.preventDefault(), P == null || P());
+              onKeyDown: b ? (V) => {
+                (V.key === "Enter" || V.key === " ") && (V.preventDefault(), v == null || v());
               } : void 0,
               style: b ? { cursor: "pointer" } : void 0,
               children: [
-                /* @__PURE__ */ t(ye, { "data-size": "md", className: s.userName, children: i }),
+                /* @__PURE__ */ t(Ne, { "data-size": "md", className: i.userName, children: s }),
                 /* @__PURE__ */ t(
-                  Oe,
+                  at,
                   {
-                    "aria-label": i,
+                    "aria-label": s,
                     "data-color": "main",
                     variant: "circle",
-                    initials: Q ? void 0 : g,
-                    children: Q ? /* @__PURE__ */ t(
+                    initials: l ? void 0 : m,
+                    children: l ? /* @__PURE__ */ t(
                       "img",
                       {
-                        src: Q,
+                        src: l,
                         alt: "",
                         style: { width: "100%", height: "100%", objectFit: "cover" }
                       }
@@ -4029,169 +4458,173 @@ const _i = ({
             }
           );
         })(),
-        v && /* @__PURE__ */ r("a", { href: "#", className: s.loginLink, children: [
-          /* @__PURE__ */ t(ye, { "data-size": "md", className: s.loginText, children: x("header.login") }),
-          /* @__PURE__ */ t("div", { className: s.underline })
+        x && /* @__PURE__ */ r("a", { href: "#", className: i.loginLink, children: [
+          /* @__PURE__ */ t(Ne, { "data-size": "md", className: i.loginText, children: _("header.login") }),
+          /* @__PURE__ */ t("div", { className: i.underline })
         ] }),
-        u && /* @__PURE__ */ t("div", { className: s.searchButtonWrapper, children: /* @__PURE__ */ r(
-          de,
+        f && /* @__PURE__ */ t("div", { className: i.searchButtonWrapper, children: /* @__PURE__ */ r(
+          fe,
           {
+            ref: ee,
             variant: "secondary",
             "data-color": "main",
             "data-size": "md",
-            onClick: $,
-            "aria-expanded": f,
-            "aria-label": x(f ? "header.closeSearch" : "header.openSearch"),
+            onClick: Se,
+            "aria-expanded": D,
+            "aria-label": _(D ? "header.closeSearch" : "header.openSearch"),
             children: [
-              f ? /* @__PURE__ */ t(Fe, { "aria-hidden": !0 }) : /* @__PURE__ */ t(Be, { "aria-hidden": !0 }),
-              /* @__PURE__ */ t("span", { className: s.buttonText, children: x(f ? "header.close" : "header.search") })
+              D ? /* @__PURE__ */ t(qe, { "aria-hidden": !0 }) : /* @__PURE__ */ t(Ye, { "aria-hidden": !0 }),
+              /* @__PURE__ */ t("span", { className: i.buttonText, children: _(D ? "header.close" : "header.search") })
             ]
           }
         ) }),
-        (m || te) && /* @__PURE__ */ r(
-          de,
+        (H || u) && /* @__PURE__ */ r(
+          fe,
           {
+            ref: se,
             variant: "primary",
             "data-color": "main",
             "data-size": "md",
-            onClick: T,
-            "aria-expanded": B,
-            "aria-label": x(B ? "header.closeMenu" : "header.openMenu"),
-            className: s.menuButton,
+            onClick: xe,
+            "aria-expanded": S,
+            "aria-label": _(S ? "header.closeMenu" : "header.openMenu"),
+            className: i.menuButton,
             children: [
-              B ? /* @__PURE__ */ t(Fe, { "aria-hidden": !0 }) : /* @__PURE__ */ t(mn, { "aria-hidden": !0 }),
-              /* @__PURE__ */ t("span", { className: s.buttonText, children: x(B ? "header.close" : "header.menu") })
+              S ? /* @__PURE__ */ t(qe, { "aria-hidden": !0 }) : /* @__PURE__ */ t(Dn, { "aria-hidden": !0 }),
+              /* @__PURE__ */ t("span", { className: i.buttonText, children: _(S ? "header.close" : "header.menu") })
             ]
           }
         )
       ] })
     ] }),
-    B && /* @__PURE__ */ t("div", { className: s.menuOverlay, children: /* @__PURE__ */ r("div", { className: s.menuContent, children: [
-      /* @__PURE__ */ t("div", { className: s.menuLeftColumn }),
-      /* @__PURE__ */ r("div", { className: s.menuRightColumn, children: [
-        te && (j || w) && /* @__PURE__ */ r("div", { className: s.menuUtilities, children: [
-          j && /* @__PURE__ */ r("div", { className: s.languageSwitch, children: [
-            /* @__PURE__ */ t("span", { className: s.languageLabel, children: x("header.language") }),
-            /* @__PURE__ */ r(U.TriggerContext, { children: [
+    S && /* @__PURE__ */ t("div", { className: i.menuOverlay, ref: te, children: /* @__PURE__ */ r("div", { className: i.menuContent, children: [
+      /* @__PURE__ */ t("div", { className: i.menuLeftColumn }),
+      /* @__PURE__ */ r("div", { className: i.menuRightColumn, children: [
+        u && (q || E) && /* @__PURE__ */ r("div", { className: i.menuUtilities, children: [
+          q && /* @__PURE__ */ r("div", { className: i.languageSwitch, children: [
+            /* @__PURE__ */ t("span", { className: i.languageLabel, children: _("header.language") }),
+            /* @__PURE__ */ r(oe.TriggerContext, { children: [
               /* @__PURE__ */ r(
-                U.Trigger,
+                oe.Trigger,
                 {
-                  className: s.languageLink,
-                  "aria-label": x("header.selectLanguage"),
+                  className: i.languageLink,
+                  "aria-label": _("header.selectLanguage"),
                   style: { background: "transparent", border: "none", padding: 0, cursor: "pointer", font: "inherit" },
                   children: [
-                    N,
+                    C,
                     " ",
-                    /* @__PURE__ */ t(je, { "aria-hidden": !0 })
+                    /* @__PURE__ */ t(Ze, { "aria-hidden": !0 })
                   ]
                 }
               ),
               /* @__PURE__ */ t(
-                U,
+                oe,
                 {
-                  "data-color-scheme": H,
+                  "data-color-scheme": T,
                   placement: "bottom-start",
-                  children: /* @__PURE__ */ r(U.List, { children: [
-                    /* @__PURE__ */ t(U.Item, { children: /* @__PURE__ */ t(U.Button, { onClick: () => K("NO"), children: "Norsk (NO)" }) }),
-                    /* @__PURE__ */ t(U.Item, { children: /* @__PURE__ */ t(U.Button, { onClick: () => K("EN"), children: "English (EN)" }) })
+                  children: /* @__PURE__ */ r(oe.List, { children: [
+                    /* @__PURE__ */ t(oe.Item, { children: /* @__PURE__ */ t(oe.Button, { onClick: () => j("NO"), children: "Norsk (NO)" }) }),
+                    /* @__PURE__ */ t(oe.Item, { children: /* @__PURE__ */ t(oe.Button, { onClick: () => j("EN"), children: "English (EN)" }) })
                   ] })
                 }
               )
             ] })
           ] }),
-          w && /* @__PURE__ */ t("div", { className: s.extensionContent, children: /* @__PURE__ */ t(
-            De,
+          E && /* @__PURE__ */ t("div", { className: i.extensionContent, children: /* @__PURE__ */ t(
+            Re,
             {
               "data-size": "sm",
-              checked: H === "dark",
-              onChange: pe,
-              label: x("header.darkMode"),
+              checked: T === "dark",
+              onChange: re,
+              label: _("header.darkMode"),
               color: "neutral",
               "data-color-scheme": "light"
             }
           ) })
         ] }),
-        /* @__PURE__ */ r("div", { className: s.slotContent, children: [
-          h,
-          te && J && _ && _.length > 0 && /* @__PURE__ */ t("nav", { className: s.navList, children: _.map((i, g) => /* @__PURE__ */ t(
-            re,
+        /* @__PURE__ */ r("div", { className: i.slotContent, children: [
+          k,
+          u && w && N && N.length > 0 && /* @__PURE__ */ t("nav", { className: i.navList, children: N.map((s, m) => /* @__PURE__ */ t(
+            pe,
             {
-              href: i.href,
-              className: s.navLink,
+              href: s.href,
+              className: i.navLink,
               onClick: (b) => {
-                d && (b.preventDefault(), d(i.href));
+                c && (b.preventDefault(), c(s.href));
               },
-              children: i.label
+              children: s.label
             },
-            g
+            m
           )) })
         ] }),
-        te && /* @__PURE__ */ t("div", { className: s.menuBrand, children: /* @__PURE__ */ t(ce, {}) })
+        u && /* @__PURE__ */ t("div", { className: i.menuBrand, children: /* @__PURE__ */ t(le, {}) })
       ] })
     ] }) }),
-    f && /* @__PURE__ */ t("div", { className: s.searchOverlay, children: /* @__PURE__ */ r("div", { className: s.searchContent, children: [
-      /* @__PURE__ */ r(Te, { children: [
+    D && /* @__PURE__ */ t("div", { className: i.searchOverlay, children: /* @__PURE__ */ r("div", { className: i.searchContent, children: [
+      /* @__PURE__ */ r(Pe, { children: [
         /* @__PURE__ */ t(
-          Te.Input,
+          Pe.Input,
           {
-            "aria-label": x("header.search"),
-            placeholder: x("header.searchPlaceholder"),
-            value: y,
-            onChange: (i) => ee(i.target.value)
+            ref: ne,
+            "aria-label": _("header.search"),
+            placeholder: _("header.searchPlaceholder"),
+            value: z,
+            onChange: (s) => ie(s.target.value)
           }
         ),
-        /* @__PURE__ */ t(Te.Button, { "aria-label": x("header.search") }),
-        /* @__PURE__ */ t(Te.ClearButton, { onClick: () => ee(""), "aria-label": x("header.clearSearch") })
+        /* @__PURE__ */ t(Pe.Button, { "aria-label": _("header.search") }),
+        /* @__PURE__ */ t(Pe.ClearButton, { onClick: () => ie(""), "aria-label": _("header.clearSearch") })
       ] }),
-      y && /* @__PURE__ */ t("div", { className: s.searchResults, children: q.length > 0 ? /* @__PURE__ */ r("div", { className: s.suggestionsSection, children: [
-        /* @__PURE__ */ t("h3", { className: s.suggestionsTitle, children: x("header.suggestions") }),
-        /* @__PURE__ */ t("ul", { className: s.resultList, children: q.slice(0, 5).map((i) => /* @__PURE__ */ t("li", { className: s.resultItem, children: /* @__PURE__ */ r(
+      z && /* @__PURE__ */ t("div", { role: "status", className: "ds-sr-only", children: A.length > 0 ? _("header.suggestionCount").replace("{count}", String(Math.min(A.length, 5))) : `${_("header.noResults")} ${z}` }),
+      z && /* @__PURE__ */ t("div", { className: i.searchResults, children: A.length > 0 ? /* @__PURE__ */ r("div", { className: i.suggestionsSection, children: [
+        /* @__PURE__ */ t("h3", { className: i.suggestionsTitle, children: _("header.suggestions") }),
+        /* @__PURE__ */ t("ul", { className: i.resultList, children: A.slice(0, 5).map((s) => /* @__PURE__ */ t("li", { className: i.resultItem, children: /* @__PURE__ */ r(
           "button",
           {
-            className: s.resultLink,
-            onClick: () => ie(i.path),
+            className: i.resultLink,
+            onClick: () => ae(s.path),
             children: [
-              /* @__PURE__ */ t("span", { className: s.suggestionIcon, children: /* @__PURE__ */ t(Be, { "aria-hidden": !0 }) }),
-              /* @__PURE__ */ t("span", { className: s.suggestionText, children: (() => {
-                const g = i.title.toLowerCase().indexOf(y.toLowerCase());
-                if (g === -1) return /* @__PURE__ */ t("span", { className: s.remainingText, children: i.title });
-                const b = i.title.slice(0, g), Y = i.title.slice(g, g + y.length), we = i.title.slice(g + y.length);
-                return /* @__PURE__ */ r(Ge, { children: [
-                  /* @__PURE__ */ t("span", { className: s.remainingText, children: b }),
-                  /* @__PURE__ */ t("span", { className: s.highlightedText, children: Y }),
-                  /* @__PURE__ */ t("span", { className: s.remainingText, children: we })
+              /* @__PURE__ */ t("span", { className: i.suggestionIcon, children: /* @__PURE__ */ t(Ye, { "aria-hidden": !0 }) }),
+              /* @__PURE__ */ t("span", { className: i.suggestionText, children: (() => {
+                const m = s.title.toLowerCase().indexOf(z.toLowerCase());
+                if (m === -1) return /* @__PURE__ */ t("span", { className: i.remainingText, children: s.title });
+                const b = s.title.slice(0, m), V = s.title.slice(m, m + z.length), ke = s.title.slice(m + z.length);
+                return /* @__PURE__ */ r(tt, { children: [
+                  /* @__PURE__ */ t("span", { className: i.remainingText, children: b }),
+                  /* @__PURE__ */ t("span", { className: i.highlightedText, children: V }),
+                  /* @__PURE__ */ t("span", { className: i.remainingText, children: ke })
                 ] });
               })() })
             ]
           }
-        ) }, i.id)) }),
-        q.length > 5 && /* @__PURE__ */ r(
-          re,
+        ) }, s.id)) }),
+        A.length > 5 && /* @__PURE__ */ r(
+          pe,
           {
             href: "#",
             "data-color": "neutral",
-            className: s.viewAllLink,
-            onClick: (i) => {
-              i.preventDefault(), d && d(`search/${y}`), l(!1), ee("");
+            className: i.viewAllLink,
+            onClick: (s) => {
+              s.preventDefault(), c && c(`search/${encodeURIComponent(z)}`), g(!1), ie("");
             },
             children: [
-              x("header.viewAll"),
+              _("header.viewAll"),
               " (",
-              q.length,
+              A.length,
               ")"
             ]
           }
         )
-      ] }) : /* @__PURE__ */ t("div", { className: s.noResults, children: /* @__PURE__ */ r(ye, { children: [
-        x("header.noResults"),
+      ] }) : /* @__PURE__ */ t("div", { className: i.noResults, children: /* @__PURE__ */ r(Ne, { children: [
+        _("header.noResults"),
         ' "',
-        y,
+        z,
         '"'
       ] }) }) })
     ] }) })
   ] });
 };
-function ta(n) {
+function Sa(n) {
   const e = n;
   return `
 .${e.header} {
@@ -4252,10 +4685,10 @@ function ta(n) {
   align-items: center;
   gap: var(--ds-size-4);
 }
-.${e.extensionContent} .ds-label { font-size: var(--ds-font-size-md) !important; }
+.${e.extensionContent} .ds-label { font-size: var(--ds-font-size-3) !important; }
 .${e.extensionDivider} { width: 1px; height: 18px; background-color: rgba(247,233,232,1); }
 .${e.languageSwitch} { display: flex; align-items: center; gap: var(--ds-size-2); }
-.${e.languageLabel} { font-size: var(--ds-font-size-md); color: #ECECEC; }
+.${e.languageLabel} { font-size: var(--ds-font-size-3); color: #ECECEC; }
 .${e.languageLink} { color: white; text-decoration: none; display: flex; align-items: center; gap: 4px; }
 .${e.header}[data-color="primary"] .${e.languageLabel} { color: #ECECEC; }
 .${e.header}[data-color="neutral"] .${e.languageLabel} { color: var(--ds-color-neutral-text-default); }
@@ -4273,16 +4706,16 @@ function ta(n) {
 .${e.secondaryLogoWrapper} { display: flex; align-items: center; justify-content: center; height: 100%; padding: 0 var(--ds-size-6); background: var(--ds-color-neutral-background-default); }
 .${e.secondaryLogo} { height: 24px; width: auto; display: block; }
 .${e.navItems} { display: flex; gap: 40px; align-items: center; margin-left: 24px; flex-grow: 1; justify-content: center; }
-.${e.navLink} { color: var(--ds-color-primary-color-red-text-default); font-family: inherit; font-size: var(--ds-font-size-md); text-decoration: none; font-weight: var(--ds-font-weight-regular); letter-spacing: 0.09px; }
+.${e.navLink} { color: var(--ds-color-primary-color-red-text-default); font-family: inherit; font-size: var(--ds-font-size-3); text-decoration: none; font-weight: var(--ds-font-weight-regular); letter-spacing: 0.09px; }
 .${e.navLink}:hover { text-decoration: underline; }
 .${e.actions} { display: flex; align-items: center; gap: var(--ds-size-6); flex-shrink: 0; margin-left: auto; }
 .${e.ctaButton} { display: flex; align-items: center; }
 .${e.themeToggle} { display: flex; align-items: center; }
 .${e.userInfo} { display: flex; align-items: center; gap: var(--ds-size-3); }
-.${e.userName} { display: block; font-family: inherit; font-size: var(--ds-font-size-md); color: var(--ds-color-neutral-text-default); }
-.${e.loginLink} { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--ds-color-main-text-subtle); gap: 2px; }
-.${e.loginText} { font-family: inherit; font-size: var(--ds-font-size-md); font-weight: var(--ds-font-weight-regular); line-height: 1.5; }
-.${e.underline} { width: 100%; height: 1px; background-color: var(--ds-color-main-border-strong); }
+.${e.userName} { display: block; font-family: inherit; font-size: var(--ds-font-size-3); color: var(--ds-color-neutral-text-default); }
+.${e.loginLink} { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--ds-color-primary-color-red-text-subtle); gap: 2px; }
+.${e.loginText} { font-family: inherit; font-size: var(--ds-font-size-3); font-weight: var(--ds-font-weight-regular); line-height: 1.5; }
+.${e.underline} { width: 100%; height: 1px; background-color: var(--ds-color-primary-color-red-border-strong); }
 .${e.searchButtonWrapper} { display: flex; }
 .${e.buttonText} { display: inline-block; margin-left: var(--ds-size-2); }
 .${e.menuButton} { display: flex; align-items: center; }
@@ -4302,12 +4735,12 @@ function ta(n) {
 .${e.menuContent} { max-width: 1364px; margin: 0 auto; display: flex; flex-direction: row; align-items: stretch; box-sizing: border-box; }
 .${e.menuLeftColumn} { width: calc(217px + var(--ds-size-6)); flex-shrink: 0; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: var(--ds-size-6); }
 .${e.menuRightColumn} { flex: 1; display: flex; flex-direction: column; padding: 48px 24px 80px 24px; gap: 24px; }
-.${e.slotContent} { width: 100%; padding: var(--ds-size-10) 0; text-align: left; color: var(--ds-color-neutral-text-subtle); font-size: var(--ds-font-size-md); border-radius: var(--ds-border-radius-md); display: flex; flex-direction: column; gap: var(--ds-size-4); align-items: flex-start; }
+.${e.slotContent} { width: 100%; padding: var(--ds-size-10) 0; text-align: left; color: var(--ds-color-neutral-text-subtle); font-size: var(--ds-font-size-3); border-radius: var(--ds-border-radius-md); display: flex; flex-direction: column; gap: var(--ds-size-4); align-items: flex-start; }
 .${e.navList} { display: flex; flex-direction: column; gap: var(--ds-size-3); align-items: flex-start; }
 .${e.menuBrand} { display: none; }
 .${e.menuUtilities} { display: flex; justify-content: space-between; align-items: center; width: 100%; }
 .${e.suggestionsSection} { display: flex; flex-direction: column; gap: var(--ds-size-4); }
-.${e.suggestionsTitle} { font-family: inherit; font-size: var(--ds-font-size-md); color: var(--ds-color-neutral-text-subtle); font-weight: var(--ds-font-weight-regular); margin: 0; letter-spacing: 0.09px; }
+.${e.suggestionsTitle} { font-family: inherit; font-size: var(--ds-font-size-3); color: var(--ds-color-neutral-text-subtle); font-weight: var(--ds-font-weight-regular); margin: 0; letter-spacing: 0.09px; }
 .${e.searchResults} { margin-top: var(--ds-size-4); max-height: 400px; overflow-y: auto; }
 .${e.resultList} { list-style: none; padding: 0; margin: 0; }
 .${e.resultItem} { border-bottom: none; }
@@ -4317,10 +4750,10 @@ function ta(n) {
   text-align: left; cursor: pointer; gap: var(--ds-size-4); text-decoration: none;
 }
 .${e.suggestionIcon} { font-size: 20px; color: var(--ds-color-neutral-text-subtle); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
-.${e.suggestionText} { font-family: inherit; font-size: var(--ds-font-size-md); color: var(--ds-color-neutral-text-default); line-height: 1.5; }
+.${e.suggestionText} { font-family: inherit; font-size: var(--ds-font-size-3); color: var(--ds-color-neutral-text-default); line-height: 1.5; }
 .${e.highlightedText} { color: var(--ds-color-primary-color-red-text-default); font-weight: var(--ds-font-weight-medium); }
 .${e.remainingText} { color: var(--ds-color-neutral-border-subtle); }
-.${e.viewAllLink} { display: block; padding: var(--ds-size-3); text-align: left; font-size: var(--ds-font-size-sm); font-weight: var(--ds-font-weight-medium); color: var(--ds-color-neutral-text-default); text-decoration: none; }
+.${e.viewAllLink} { display: block; padding: var(--ds-size-3); text-align: left; font-size: var(--ds-font-size-2); font-weight: var(--ds-font-weight-medium); color: var(--ds-color-neutral-text-default); text-decoration: none; }
 .${e.noResults} { padding: var(--ds-size-4); text-align: center; color: var(--ds-color-neutral-text-subtle); }
 @media (max-width: 850px) {
   .${e.header} { z-index: 10000; position: relative; }
@@ -4356,116 +4789,114 @@ function ta(n) {
 }
 `;
 }
-const na = "_footer_12vvu_1", oa = "_mainSection_12vvu_7", ra = "_mainContainer_12vvu_25", aa = "_crossCornerTopRight_12vvu_35", sa = "_crossCornerBottomLeft_12vvu_42", ia = "_contentRow_12vvu_50", la = "_newsletterSection_12vvu_60", da = "_newsletterDescription_12vvu_67", ca = "_newsletterForm_12vvu_76", pa = "_newsletterInputGroup_12vvu_82", ma = "_newsletterInput_12vvu_82", ga = "_consentText_12vvu_93", ua = "_linksSection_12vvu_103", ha = "_linksColumn_12vvu_109", fa = "_linksTitle_12vvu_116", ka = "_linksList_12vvu_127", va = "_footerLink_12vvu_136", ba = "_divider_12vvu_158", ya = "_contactSection_12vvu_166", xa = "_contactColumn_12vvu_173", Ta = "_contactTitle_12vvu_181", Ca = "_contactContent_12vvu_190", wa = "_copyrightSection_12vvu_204", Sa = "_copyrightText_12vvu_209", Ia = "_whiteSection_12vvu_219", _a = "_whiteContainer_12vvu_224", Da = "_whiteContent_12vvu_232", La = "_logo_12vvu_240", Aa = "_redCrossLogo_12vvu_254", Na = "_slotLarge_12vvu_260", Ma = "_contentRowContact_12vvu_315", ja = "_socialLinksSection_12vvu_325", Fa = "_socialLinksTitle_12vvu_332", Ba = "_socialLinksList_12vvu_343", Ea = "_socialLink_12vvu_325", Pa = "_socialLinkIcon_12vvu_376", $a = "_contactPersonsSection_12vvu_391", za = "_contactPersonsTitle_12vvu_398", Ra = "_contactPersonsGrid_12vvu_409", Ga = "_contactPersonCard_12vvu_415", Wa = "_contactPersonName_12vvu_422", Ha = "_contactPersonRole_12vvu_431", Ua = "_contactPersonDetails_12vvu_440", Va = "_contactPersonLabel_12vvu_447", Oa = "_contactPersonEmail_12vvu_451", Ka = "_contactPersonPhone_12vvu_452", qa = "_contactPersonAddress_12vvu_453", Ya = "_bottomRowContact_12vvu_474", Za = "_legalLinksRow_12vvu_483", Xa = "_legalLink_12vvu_483", Ja = "_dpMain_12vvu_558", Qa = "_dpContainer_12vvu_567", es = "_dpColumns_12vvu_575", ts = "_dpColumn_12vvu_575", ns = "_dpColTitle_12vvu_588", os = "_dpList_12vvu_596", rs = "_dpLink_12vvu_605", as = "_dpDivider_12vvu_619", ss = "_dpMeta_12vvu_627", is = "_dpMetaCol_12vvu_633", ls = "_dpMetaTitle_12vvu_641", ds = "_dpMetaText_12vvu_649", cs = "_dpBottom_12vvu_657", ps = "_dpLegal_12vvu_665", ms = "_dpLegalLink_12vvu_674", gs = "_dpCopyright_12vvu_686", us = "_dpLogoBox_12vvu_694", hs = "_dpLogoImg_12vvu_710", o = {
-  footer: na,
-  mainSection: oa,
-  mainContainer: ra,
-  crossCornerTopRight: aa,
-  crossCornerBottomLeft: sa,
-  contentRow: ia,
-  newsletterSection: la,
-  newsletterDescription: da,
-  newsletterForm: ca,
-  newsletterInputGroup: pa,
-  newsletterInput: ma,
-  consentText: ga,
-  linksSection: ua,
-  linksColumn: ha,
-  linksTitle: fa,
-  linksList: ka,
-  footerLink: va,
-  divider: ba,
-  contactSection: ya,
-  contactColumn: xa,
-  contactTitle: Ta,
-  contactContent: Ca,
-  copyrightSection: wa,
-  copyrightText: Sa,
-  whiteSection: Ia,
-  whiteContainer: _a,
-  whiteContent: Da,
-  logo: La,
-  redCrossLogo: Aa,
-  slotLarge: Na,
-  contentRowContact: Ma,
-  socialLinksSection: ja,
-  socialLinksTitle: Fa,
-  socialLinksList: Ba,
-  socialLink: Ea,
-  socialLinkIcon: Pa,
-  contactPersonsSection: $a,
-  contactPersonsTitle: za,
-  contactPersonsGrid: Ra,
-  contactPersonCard: Ga,
-  contactPersonName: Wa,
-  contactPersonRole: Ha,
-  contactPersonDetails: Ua,
-  contactPersonLabel: Va,
-  contactPersonEmail: Oa,
-  contactPersonPhone: Ka,
-  contactPersonAddress: qa,
-  bottomRowContact: Ya,
-  legalLinksRow: Za,
-  legalLink: Xa,
-  dpMain: Ja,
-  dpContainer: Qa,
-  dpColumns: es,
-  dpColumn: ts,
-  dpColTitle: ns,
-  dpList: os,
-  dpLink: rs,
-  dpDivider: as,
-  dpMeta: ss,
-  dpMetaCol: is,
-  dpMetaTitle: ls,
-  dpMetaText: ds,
-  dpBottom: cs,
-  dpLegal: ps,
-  dpLegalLink: ms,
-  dpCopyright: gs,
-  dpLogoBox: us,
-  dpLogoImg: hs
-}, Di = ({
+const _a = "_footer_61pj1_1", Ia = "_mainSection_61pj1_7", La = "_mainContainer_61pj1_25", Da = "_graphicElementTopRight_61pj1_35", Ma = "_graphicElementBottomLeft_61pj1_42", ja = "_contentRow_61pj1_50", Aa = "_newsletterSection_61pj1_60", Na = "_newsletterDescription_61pj1_67", Ea = "_newsletterForm_61pj1_76", Ba = "_newsletterInputGroup_61pj1_82", Fa = "_newsletterInput_61pj1_82", Pa = "_consentText_61pj1_93", $a = "_linksSection_61pj1_103", za = "_linksColumn_61pj1_109", Ra = "_linksTitle_61pj1_116", Ga = "_linksList_61pj1_127", Ha = "_footerLink_61pj1_136", Wa = "_divider_61pj1_158", Ua = "_contactSection_61pj1_166", Va = "_contactColumn_61pj1_173", Oa = "_contactTitle_61pj1_181", Ka = "_contactContent_61pj1_190", Za = "_copyrightSection_61pj1_204", qa = "_copyrightText_61pj1_209", Ya = "_whiteSection_61pj1_219", Xa = "_whiteContainer_61pj1_224", Ja = "_whiteContent_61pj1_232", Qa = "_logo_61pj1_240", es = "_redCrossLogo_61pj1_254", ts = "_slotLarge_61pj1_260", ns = "_contentRowContact_61pj1_315", os = "_socialLinksSection_61pj1_325", rs = "_socialLinksTitle_61pj1_332", as = "_socialLinksList_61pj1_343", ss = "_socialLink_61pj1_325", is = "_socialLinkIcon_61pj1_376", ls = "_contactPersonsSection_61pj1_391", ds = "_contactPersonsTitle_61pj1_398", cs = "_contactPersonsGrid_61pj1_409", ps = "_contactPersonCard_61pj1_415", ms = "_contactPersonName_61pj1_422", gs = "_contactPersonRole_61pj1_431", us = "_contactPersonDetails_61pj1_440", hs = "_contactPersonLabel_61pj1_447", fs = "_contactPersonEmail_61pj1_451", ks = "_contactPersonPhone_61pj1_452", vs = "_contactPersonAddress_61pj1_453", bs = "_bottomRowContact_61pj1_474", ys = "_legalLinksRow_61pj1_483", xs = "_legalLink_61pj1_483", Ts = "_dpMain_61pj1_558", Cs = "_dpContainer_61pj1_567", ws = "_dpColumns_61pj1_575", Ss = "_dpColumn_61pj1_575", _s = "_dpColTitle_61pj1_588", Is = "_dpList_61pj1_596", Ls = "_dpLink_61pj1_605", Ds = "_dpDivider_61pj1_619", Ms = "_dpMeta_61pj1_627", js = "_dpMetaCol_61pj1_633", As = "_dpMetaTitle_61pj1_641", Ns = "_dpMetaText_61pj1_649", Es = "_dpBottom_61pj1_657", Bs = "_dpLegal_61pj1_665", Fs = "_dpLegalLink_61pj1_674", Ps = "_dpCopyright_61pj1_686", o = {
+  footer: _a,
+  mainSection: Ia,
+  mainContainer: La,
+  graphicElementTopRight: Da,
+  graphicElementBottomLeft: Ma,
+  contentRow: ja,
+  newsletterSection: Aa,
+  newsletterDescription: Na,
+  newsletterForm: Ea,
+  newsletterInputGroup: Ba,
+  newsletterInput: Fa,
+  consentText: Pa,
+  linksSection: $a,
+  linksColumn: za,
+  linksTitle: Ra,
+  linksList: Ga,
+  footerLink: Ha,
+  divider: Wa,
+  contactSection: Ua,
+  contactColumn: Va,
+  contactTitle: Oa,
+  contactContent: Ka,
+  copyrightSection: Za,
+  copyrightText: qa,
+  whiteSection: Ya,
+  whiteContainer: Xa,
+  whiteContent: Ja,
+  logo: Qa,
+  redCrossLogo: es,
+  slotLarge: ts,
+  contentRowContact: ns,
+  socialLinksSection: os,
+  socialLinksTitle: rs,
+  socialLinksList: as,
+  socialLink: ss,
+  socialLinkIcon: is,
+  contactPersonsSection: ls,
+  contactPersonsTitle: ds,
+  contactPersonsGrid: cs,
+  contactPersonCard: ps,
+  contactPersonName: ms,
+  contactPersonRole: gs,
+  contactPersonDetails: us,
+  contactPersonLabel: hs,
+  contactPersonEmail: fs,
+  contactPersonPhone: ks,
+  contactPersonAddress: vs,
+  bottomRowContact: bs,
+  legalLinksRow: ys,
+  legalLink: xs,
+  dpMain: Ts,
+  dpContainer: Cs,
+  dpColumns: ws,
+  dpColumn: Ss,
+  dpColTitle: _s,
+  dpList: Is,
+  dpLink: Ls,
+  dpDivider: Ds,
+  dpMeta: Ms,
+  dpMetaCol: js,
+  dpMetaTitle: As,
+  dpMetaText: Ns,
+  dpBottom: Es,
+  dpLegal: Bs,
+  dpLegalLink: Fs,
+  dpCopyright: Ps
+}, Xi = ({
   "data-color": n = "neutral",
   variant: e = "default",
   colorScheme: a,
-  columns: d,
-  showCrossCorners: h = !1,
-  newsletterDescription: k = "Tekst om rødekors som kan være rundt 2 linjebrudd i lengde.",
-  newsletterPlaceholder: u = "Input tekst",
-  newsletterButtonText: v = "Meld deg på",
-  newsletterConsentText: M,
-  onNewsletterSubmit: C,
-  hideNewsletter: G = !1,
-  shortcutsLinks: I,
-  linksLinks: V,
-  shortcutsTitle: D,
+  columns: c,
+  showGraphicElements: k = !1,
+  newsletterDescription: y = "Tekst om rødekors som kan være rundt 2 linjebrudd i lengde.",
+  newsletterPlaceholder: f = "Input tekst",
+  newsletterButtonText: x = "Meld deg på",
+  newsletterConsentText: B,
+  onNewsletterSubmit: I,
+  hideNewsletter: J = !1,
+  shortcutsLinks: L,
+  linksLinks: R,
+  shortcutsTitle: G,
   linksTitle: p,
-  visitingAddress: X = ["Hausmannsgate 7 (Korsegården)", "0186 Oslo"],
-  organizationNumber: ne = "XXX XXX XXX",
-  email: _ = "post@redcross.no",
-  showPrimaryLogo: J = !0,
-  primaryLogoSrc: m,
-  primaryLogoAlt: L = "Røde Kors Logo",
-  whiteSectionSlot: w,
-  socialLinks: j = [],
-  contactPersons: A = [],
-  legalLinks: F = [],
-  socialLinksTitle: O,
-  contactPersonsTitle: Q
+  visitingAddress: Q = ["Hausmannsgate 7 (Korsegården)", "0186 Oslo"],
+  organizationNumber: K = "XXX XXX XXX",
+  email: N = "post@redcross.no",
+  showPrimaryLogo: w = !0,
+  primaryLogoSrc: H,
+  primaryLogoAlt: P = "Røde Kors Logo",
+  whiteSectionSlot: E,
+  socialLinks: q = [],
+  contactPersons: Y = [],
+  legalLinks: $ = [],
+  socialLinksTitle: d,
+  contactPersonsTitle: l
 } = {}) => {
-  const P = (/* @__PURE__ */ new Date()).getFullYear(), { t: B } = xe(), [E, f] = Le.useState(""), l = (c, T) => {
-    const $ = B(c);
-    return $ === c ? T : $;
+  const v = (/* @__PURE__ */ new Date()).getFullYear(), { t: S } = Be(), [F, D] = ye.useState(""), g = (u, M) => {
+    const le = S(u);
+    return le === u ? M : le;
   };
-  Le.useEffect(() => {
-    const c = "rk-footer-inline-styles";
-    if (typeof document > "u" || document.getElementById(c)) return;
-    const T = fs(o), $ = document.createElement("style");
-    $.id = c, $.textContent = T, document.head.appendChild($);
+  ye.useEffect(() => {
+    const u = "rk-footer-inline-styles";
+    if (typeof document > "u" || document.getElementById(u)) return;
+    const M = $s(o), le = document.createElement("style");
+    le.id = u, le.textContent = M, document.head.appendChild(le);
   }, []);
-  const y = (c) => {
-    c.preventDefault(), C == null || C(E);
+  const se = (u) => {
+    u.preventDefault(), I == null || I(F);
   }, ee = () => /* @__PURE__ */ r(
     "svg",
     {
@@ -4490,223 +4921,233 @@ const na = "_footer_12vvu_1", oa = "_mainSection_12vvu_7", ra = "_mainContainer_
         /* @__PURE__ */ t("path", { d: "M63.2545 52.9331H24.0869V66.0625H63.2545V52.9331Z", fill: "#D52B1E" })
       ]
     }
-  ), H = [
-    { label: l("footer.shortcutsLinks.services", "Tilbudene"), href: "#" },
-    { label: l("footer.shortcutsLinks.volunteer", "Bli frivillig"), href: "#" },
-    { label: l("footer.shortcutsLinks.ourWork", "Vårt arbeid"), href: "#" },
-    { label: l("footer.shortcutsLinks.about", "Om Røde Kors"), href: "#" },
-    { label: l("footer.shortcutsLinks.support", "Støtt arbeidet"), href: "#" },
-    { label: l("footer.shortcutsLinks.contact", "Kontakt oss"), href: "#" }
-  ], S = [
-    { label: l("footer.legal.privacy", "Personvern"), href: "#" },
-    { label: l("footer.legal.press", "For presse"), href: "#" },
-    { label: l("footer.legal.procurement", "Regler for innkjøp"), href: "#" },
-    { label: l("footer.legal.whistleblowing", "Varsling/Misconduct"), href: "#" }
-  ], N = /* @__PURE__ */ r(Ge, { children: [
+  ), te = [
+    { label: g("footer.shortcutsLinks.services", "Tilbudene"), href: "#" },
+    { label: g("footer.shortcutsLinks.volunteer", "Bli frivillig"), href: "#" },
+    { label: g("footer.shortcutsLinks.ourWork", "Vårt arbeid"), href: "#" },
+    { label: g("footer.shortcutsLinks.about", "Om Røde Kors"), href: "#" },
+    { label: g("footer.shortcutsLinks.support", "Støtt arbeidet"), href: "#" },
+    { label: g("footer.shortcutsLinks.contact", "Kontakt oss"), href: "#" }
+  ], ne = [
+    { label: g("footer.legal.privacy", "Personvern"), href: "#" },
+    { label: g("footer.legal.press", "For presse"), href: "#" },
+    { label: g("footer.legal.procurement", "Regler for innkjøp"), href: "#" },
+    { label: g("footer.legal.whistleblowing", "Varsling/Misconduct"), href: "#" }
+  ], z = /* @__PURE__ */ r(tt, { children: [
     'Ved å trykke "',
-    v,
+    x,
     '" samtykker du til å motta nyhetsbrev.',
     /* @__PURE__ */ t("br", {}),
     "Du kan når som helst ",
-    /* @__PURE__ */ t(re, { href: "#", children: "melde deg av" }),
+    /* @__PURE__ */ t(pe, { href: "#", children: "melde deg av" }),
     " nyhetsbrevet uten kostnad."
-  ] }), K = I || H, x = V || S, te = () => /* @__PURE__ */ r("div", { className: o.socialLinksSection, children: [
-    O && /* @__PURE__ */ t("h3", { className: o.socialLinksTitle, children: O }),
-    /* @__PURE__ */ t("ul", { className: o.socialLinksList, children: j.map((c, T) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ r(re, { href: c.href, className: o.socialLink, children: [
-      /* @__PURE__ */ t("span", { className: o.socialLinkIcon, children: c.icon }),
-      c.label
-    ] }) }, T)) })
-  ] }), me = ({ person: c }) => /* @__PURE__ */ r("div", { className: o.contactPersonCard, children: [
-    /* @__PURE__ */ t("p", { className: o.contactPersonName, children: c.name }),
-    /* @__PURE__ */ t("p", { className: o.contactPersonRole, children: c.role }),
+  ] }), ie = L || te, T = R || ne, h = () => /* @__PURE__ */ r("div", { className: o.socialLinksSection, children: [
+    d && /* @__PURE__ */ t("h3", { className: o.socialLinksTitle, children: d }),
+    /* @__PURE__ */ t("ul", { className: o.socialLinksList, children: q.map((u, M) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ r(pe, { href: u.href, className: o.socialLink, children: [
+      /* @__PURE__ */ t("span", { className: o.socialLinkIcon, children: u.icon }),
+      u.label
+    ] }) }, M)) })
+  ] }), C = ({ person: u }) => /* @__PURE__ */ r("div", { className: o.contactPersonCard, children: [
+    /* @__PURE__ */ t("p", { className: o.contactPersonName, children: u.name }),
+    /* @__PURE__ */ t("p", { className: o.contactPersonRole, children: u.role }),
     /* @__PURE__ */ r("div", { className: o.contactPersonDetails, children: [
       /* @__PURE__ */ r("p", { className: o.contactPersonEmail, children: [
         /* @__PURE__ */ r("span", { className: o.contactPersonLabel, children: [
-          l("footer.contact.email", "E-post"),
+          g("footer.contact.email", "E-post"),
           ":"
         ] }),
         " ",
-        /* @__PURE__ */ t(re, { href: `mailto:${c.email}`, children: c.email })
+        /* @__PURE__ */ t(pe, { href: `mailto:${u.email}`, children: u.email })
       ] }),
-      c.phone && /* @__PURE__ */ r("p", { className: o.contactPersonPhone, children: [
+      u.phone && /* @__PURE__ */ r("p", { className: o.contactPersonPhone, children: [
         /* @__PURE__ */ r("span", { className: o.contactPersonLabel, children: [
-          l("footer.contact.phone", "Telefon"),
+          g("footer.contact.phone", "Telefon"),
           ":"
         ] }),
         " ",
-        c.phone
+        u.phone
       ] }),
-      c.address && /* @__PURE__ */ t("p", { className: o.contactPersonAddress, children: c.address })
+      u.address && /* @__PURE__ */ t("p", { className: o.contactPersonAddress, children: u.address })
     ] })
-  ] }), ce = () => /* @__PURE__ */ r("div", { className: o.contactPersonsSection, children: [
-    Q && /* @__PURE__ */ t("h3", { className: o.contactPersonsTitle, children: Q }),
-    /* @__PURE__ */ t("div", { className: o.contactPersonsGrid, children: A.map((c, T) => /* @__PURE__ */ t(me, { person: c }, T)) })
-  ] }), pe = () => /* @__PURE__ */ t("ul", { className: o.legalLinksRow, children: F.map((c, T) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(re, { href: c.href, className: o.legalLink, children: c.label }) }, T)) });
+  ] }), j = () => /* @__PURE__ */ r("div", { className: o.contactPersonsSection, children: [
+    l && /* @__PURE__ */ t("h3", { className: o.contactPersonsTitle, children: l }),
+    /* @__PURE__ */ t("div", { className: o.contactPersonsGrid, children: Y.map((u, M) => /* @__PURE__ */ t(C, { person: u }, M)) })
+  ] }), _ = () => /* @__PURE__ */ t("ul", { className: o.legalLinksRow, children: $.map((u, M) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(pe, { href: u.href, className: o.legalLink, children: u.label }) }, M)) });
   if (e === "columns") {
-    const c = [
+    const u = [
       {
-        title: l("footer.contact.title", "Kontakt"),
-        links: H
+        title: g("footer.contact.title", "Kontakt"),
+        links: te
       },
       {
-        title: l("footer.bidra", "Bidra"),
-        links: H
+        title: g("footer.bidra", "Bidra"),
+        links: te
       },
       {
-        title: l("footer.shortcuts", "Snarveier"),
-        links: H
+        title: g("footer.shortcuts", "Snarveier"),
+        links: te
       }
-    ], T = d && d.length > 0 ? d : c, $ = F.length > 0 ? F : S;
-    return /* @__PURE__ */ t("footer", { className: o.footer, "data-color": n, "data-color-scheme": a, children: /* @__PURE__ */ t("div", { className: o.dpMain, children: /* @__PURE__ */ r("div", { className: o.dpContainer, children: [
-      /* @__PURE__ */ t("div", { className: o.dpColumns, children: T.map((q, ie) => /* @__PURE__ */ r("nav", { className: o.dpColumn, "aria-label": q.title, children: [
-        /* @__PURE__ */ t("h3", { className: o.dpColTitle, children: q.title }),
-        /* @__PURE__ */ t("ul", { className: o.dpList, children: q.links.map((i, g) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(re, { href: i.href, className: o.dpLink, children: i.label }) }, g)) })
-      ] }, ie)) }),
-      /* @__PURE__ */ t("hr", { className: o.dpDivider }),
-      /* @__PURE__ */ r("div", { className: o.dpMeta, children: [
-        /* @__PURE__ */ r("div", { className: o.dpMetaCol, children: [
-          /* @__PURE__ */ t("h4", { className: o.dpMetaTitle, children: l("footer.contact.visitingAddress", "Besøksadresse") }),
-          X.map((q, ie) => /* @__PURE__ */ t("p", { className: o.dpMetaText, children: q }, ie))
-        ] }),
-        /* @__PURE__ */ r("div", { className: o.dpMetaCol, children: [
-          /* @__PURE__ */ t("h4", { className: o.dpMetaTitle, children: l("footer.contact.organizationNumber", "Organisasjonsnummer") }),
-          /* @__PURE__ */ t("p", { className: o.dpMetaText, children: ne })
+    ], M = c && c.length > 0 ? c : u, le = $.length > 0 ? $ : ne;
+    return /* @__PURE__ */ r("footer", { className: o.footer, "data-color": n, "data-color-scheme": a, children: [
+      /* @__PURE__ */ t("div", { className: o.dpMain, children: /* @__PURE__ */ r("div", { className: o.dpContainer, children: [
+        /* @__PURE__ */ t("div", { className: o.dpColumns, children: M.map((re, ge) => /* @__PURE__ */ r("nav", { className: o.dpColumn, "aria-label": re.title, children: [
+          /* @__PURE__ */ t("h3", { className: o.dpColTitle, children: re.title }),
+          /* @__PURE__ */ t("ul", { className: o.dpList, children: re.links.map((xe, Se) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(pe, { href: xe.href, className: o.dpLink, children: xe.label }) }, Se)) })
+        ] }, ge)) }),
+        /* @__PURE__ */ t("hr", { className: o.dpDivider }),
+        /* @__PURE__ */ r("div", { className: o.dpMeta, children: [
+          /* @__PURE__ */ r("div", { className: o.dpMetaCol, children: [
+            /* @__PURE__ */ t("h4", { className: o.dpMetaTitle, children: g("footer.contact.visitingAddress", "Besøksadresse") }),
+            Q.map((re, ge) => /* @__PURE__ */ t("p", { className: o.dpMetaText, children: re }, ge))
+          ] }),
+          /* @__PURE__ */ r("div", { className: o.dpMetaCol, children: [
+            /* @__PURE__ */ t("h4", { className: o.dpMetaTitle, children: g("footer.contact.organizationNumber", "Organisasjonsnummer") }),
+            /* @__PURE__ */ t("p", { className: o.dpMetaText, children: K })
+          ] }),
+          /* @__PURE__ */ r("div", { className: o.dpMetaCol, children: [
+            /* @__PURE__ */ t("h4", { className: o.dpMetaTitle, children: g("footer.contact.email", "E-post") }),
+            /* @__PURE__ */ t("p", { className: o.dpMetaText, children: N })
+          ] })
         ] }),
-        /* @__PURE__ */ r("div", { className: o.dpMetaCol, children: [
-          /* @__PURE__ */ t("h4", { className: o.dpMetaTitle, children: l("footer.contact.email", "E-post") }),
-          /* @__PURE__ */ t("p", { className: o.dpMetaText, children: _ })
-        ] })
-      ] }),
-      /* @__PURE__ */ t("hr", { className: o.dpDivider }),
-      /* @__PURE__ */ r("div", { className: o.dpBottom, children: [
-        /* @__PURE__ */ t("ul", { className: o.dpLegal, children: $.map((q, ie) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(re, { href: q.href, className: o.dpLegalLink, children: q.label }) }, ie)) }),
-        /* @__PURE__ */ r("p", { className: o.dpCopyright, children: [
-          "© ",
-          P,
-          " ",
-          l("footer.copyright", "Røde Kors")
+        /* @__PURE__ */ t("hr", { className: o.dpDivider }),
+        /* @__PURE__ */ r("div", { className: o.dpBottom, children: [
+          /* @__PURE__ */ t("ul", { className: o.dpLegal, children: le.map((re, ge) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(pe, { href: re.href, className: o.dpLegalLink, children: re.label }) }, ge)) }),
+          /* @__PURE__ */ r("p", { className: o.dpCopyright, children: [
+            "© ",
+            v,
+            " ",
+            g("footer.copyright", "Røde Kors")
+          ] })
         ] })
-      ] }),
-      m ? /* @__PURE__ */ t("img", { src: m, alt: L, className: o.dpLogoImg }) : /* @__PURE__ */ t("div", { className: o.dpLogoBox, "data-color-scheme": "light", children: /* @__PURE__ */ t(ee, {}) })
-    ] }) }) });
+      ] }) }),
+      w && /* @__PURE__ */ t("div", { className: o.whiteSection, "data-color-scheme": "light", children: /* @__PURE__ */ t("div", { className: o.whiteContainer, children: /* @__PURE__ */ t("div", { className: o.whiteContent, children: H ? /* @__PURE__ */ t(
+        "img",
+        {
+          src: H,
+          alt: P,
+          className: o.logo,
+          loading: "lazy"
+        }
+      ) : /* @__PURE__ */ t("div", { className: o.logo, children: /* @__PURE__ */ t(ee, {}) }) }) }) })
+    ] });
   }
   return e === "contact" ? /* @__PURE__ */ r("footer", { className: o.footer, "data-color": n, children: [
     /* @__PURE__ */ t("div", { className: o.mainSection, children: /* @__PURE__ */ r("div", { className: o.mainContainer, children: [
-      h && /* @__PURE__ */ t("div", { className: o.crossCornerTopRight, children: /* @__PURE__ */ t(be, { position: "top-right", size: "md", "aria-hidden": !0 }) }),
+      k && /* @__PURE__ */ t("div", { className: o.graphicElementTopRight, children: /* @__PURE__ */ t(je, { shape: "angle", position: "top-right", size: "md", "aria-hidden": !0 }) }),
       /* @__PURE__ */ r("div", { className: o.contentRowContact, children: [
-        j.length > 0 && /* @__PURE__ */ t(te, {}),
-        A.length > 0 && /* @__PURE__ */ t(ce, {})
+        q.length > 0 && /* @__PURE__ */ t(h, {}),
+        Y.length > 0 && /* @__PURE__ */ t(j, {})
       ] }),
       /* @__PURE__ */ t("div", { className: o.divider }),
       /* @__PURE__ */ r("div", { className: o.contactSection, children: [
         /* @__PURE__ */ r("div", { className: o.contactColumn, children: [
-          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: l("footer.contact.visitingAddress", "Besøks adresse") }),
-          /* @__PURE__ */ t("div", { className: o.contactContent, children: X.map((c, T) => /* @__PURE__ */ t("p", { children: c }, T)) })
+          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: g("footer.contact.visitingAddress", "Besøks adresse") }),
+          /* @__PURE__ */ t("div", { className: o.contactContent, children: Q.map((u, M) => /* @__PURE__ */ t("p", { children: u }, M)) })
         ] }),
         /* @__PURE__ */ r("div", { className: o.contactColumn, children: [
-          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: l("footer.contact.organizationNumber", "Organisasjonsnummer") }),
-          /* @__PURE__ */ t("p", { className: o.contactContent, children: ne })
+          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: g("footer.contact.organizationNumber", "Organisasjonsnummer") }),
+          /* @__PURE__ */ t("p", { className: o.contactContent, children: K })
         ] }),
         /* @__PURE__ */ r("div", { className: o.contactColumn, children: [
-          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: l("footer.contact.email", "E-post") }),
-          /* @__PURE__ */ t("p", { className: o.contactContent, children: _ })
+          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: g("footer.contact.email", "E-post") }),
+          /* @__PURE__ */ t("p", { className: o.contactContent, children: N })
         ] })
       ] }),
       /* @__PURE__ */ t("div", { className: o.divider }),
       /* @__PURE__ */ r("div", { className: o.bottomRowContact, children: [
-        F.length > 0 && /* @__PURE__ */ t(pe, {}),
+        $.length > 0 && /* @__PURE__ */ t(_, {}),
         /* @__PURE__ */ r("p", { className: o.copyrightText, children: [
           "© ",
-          P,
+          v,
           " ",
-          l("footer.copyright", "Rødekors")
+          g("footer.copyright", "Rødekors")
         ] })
       ] }),
-      h && /* @__PURE__ */ t("div", { className: o.crossCornerBottomLeft, children: /* @__PURE__ */ t(be, { position: "bottom-left", size: "md", "aria-hidden": !0 }) })
+      k && /* @__PURE__ */ t("div", { className: o.graphicElementBottomLeft, children: /* @__PURE__ */ t(je, { shape: "angle", position: "bottom-left", size: "md", "aria-hidden": !0 }) })
     ] }) }),
     /* @__PURE__ */ t("div", { className: o.whiteSection, children: /* @__PURE__ */ t("div", { className: o.whiteContainer, children: /* @__PURE__ */ r("div", { className: o.whiteContent, children: [
-      J && (m ? /* @__PURE__ */ t(
+      w && (H ? /* @__PURE__ */ t(
         "img",
         {
-          src: m,
-          alt: L,
+          src: H,
+          alt: P,
           className: o.logo,
           loading: "lazy"
         }
       ) : /* @__PURE__ */ t("div", { className: o.logo, children: /* @__PURE__ */ t(ee, {}) })),
-      w && /* @__PURE__ */ t("div", { className: o.slotLarge, children: w })
+      E && /* @__PURE__ */ t("div", { className: o.slotLarge, children: E })
     ] }) }) })
   ] }) : /* @__PURE__ */ r("footer", { className: o.footer, "data-color": n, children: [
     /* @__PURE__ */ t("div", { className: o.mainSection, children: /* @__PURE__ */ r("div", { className: o.mainContainer, children: [
-      h && /* @__PURE__ */ t("div", { className: o.crossCornerTopRight, children: /* @__PURE__ */ t(be, { position: "top-right", size: "md", "aria-hidden": !0 }) }),
+      k && /* @__PURE__ */ t("div", { className: o.graphicElementTopRight, children: /* @__PURE__ */ t(je, { shape: "angle", position: "top-right", size: "md", "aria-hidden": !0 }) }),
       /* @__PURE__ */ r("div", { className: o.contentRow, children: [
-        !G && /* @__PURE__ */ r("div", { className: o.newsletterSection, children: [
-          /* @__PURE__ */ t("p", { className: o.newsletterDescription, children: k }),
-          /* @__PURE__ */ t("form", { className: o.newsletterForm, onSubmit: y, children: /* @__PURE__ */ r("div", { className: o.newsletterInputGroup, children: [
+        !J && /* @__PURE__ */ r("div", { className: o.newsletterSection, children: [
+          /* @__PURE__ */ t("p", { className: o.newsletterDescription, children: y }),
+          /* @__PURE__ */ t("form", { className: o.newsletterForm, onSubmit: se, children: /* @__PURE__ */ r("div", { className: o.newsletterInputGroup, children: [
             /* @__PURE__ */ t(
-              Ye,
+              dt,
               {
                 type: "email",
-                placeholder: u,
-                value: E,
-                onChange: (c) => f(c.target.value),
+                placeholder: f,
+                value: F,
+                onChange: (u) => D(u.target.value),
                 className: o.newsletterInput
               }
             ),
-            /* @__PURE__ */ t(de, { type: "submit", variant: "primary", "data-color": "neutral", children: v })
+            /* @__PURE__ */ t(fe, { type: "submit", variant: "primary", "data-color": "neutral", children: x })
           ] }) }),
-          /* @__PURE__ */ t("p", { className: o.consentText, children: M || N })
+          /* @__PURE__ */ t("p", { className: o.consentText, children: B || z })
         ] }),
         /* @__PURE__ */ r("div", { className: o.linksSection, children: [
-          /* @__PURE__ */ r("nav", { className: o.linksColumn, "aria-label": D || l("footer.shortcuts", "Snarveier"), children: [
-            /* @__PURE__ */ t("h3", { className: o.linksTitle, children: D || l("footer.shortcuts", "Snarveier") }),
-            /* @__PURE__ */ t("ul", { className: o.linksList, children: K.map((c, T) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(re, { href: c.href, className: o.footerLink, children: c.label }) }, T)) })
+          /* @__PURE__ */ r("nav", { className: o.linksColumn, "aria-label": G || g("footer.shortcuts", "Snarveier"), children: [
+            /* @__PURE__ */ t("h3", { className: o.linksTitle, children: G || g("footer.shortcuts", "Snarveier") }),
+            /* @__PURE__ */ t("ul", { className: o.linksList, children: ie.map((u, M) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(pe, { href: u.href, className: o.footerLink, children: u.label }) }, M)) })
           ] }),
-          /* @__PURE__ */ r("nav", { className: o.linksColumn, "aria-label": p || l("footer.links", "Lenker"), children: [
-            /* @__PURE__ */ t("h3", { className: o.linksTitle, children: p || l("footer.links", "Lenker") }),
-            /* @__PURE__ */ t("ul", { className: o.linksList, children: x.map((c, T) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(re, { href: c.href, className: o.footerLink, children: c.label }) }, T)) })
+          /* @__PURE__ */ r("nav", { className: o.linksColumn, "aria-label": p || g("footer.links", "Lenker"), children: [
+            /* @__PURE__ */ t("h3", { className: o.linksTitle, children: p || g("footer.links", "Lenker") }),
+            /* @__PURE__ */ t("ul", { className: o.linksList, children: T.map((u, M) => /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(pe, { href: u.href, className: o.footerLink, children: u.label }) }, M)) })
           ] })
         ] })
       ] }),
       /* @__PURE__ */ t("div", { className: o.divider }),
       /* @__PURE__ */ r("div", { className: o.contactSection, children: [
         /* @__PURE__ */ r("div", { className: o.contactColumn, children: [
-          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: l("footer.contact.visitingAddress", "Besøks adresse") }),
-          /* @__PURE__ */ t("div", { className: o.contactContent, children: X.map((c, T) => /* @__PURE__ */ t("p", { children: c }, T)) })
+          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: g("footer.contact.visitingAddress", "Besøks adresse") }),
+          /* @__PURE__ */ t("div", { className: o.contactContent, children: Q.map((u, M) => /* @__PURE__ */ t("p", { children: u }, M)) })
         ] }),
         /* @__PURE__ */ r("div", { className: o.contactColumn, children: [
-          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: l("footer.contact.organizationNumber", "Organisasjonsnummer") }),
-          /* @__PURE__ */ t("p", { className: o.contactContent, children: ne })
+          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: g("footer.contact.organizationNumber", "Organisasjonsnummer") }),
+          /* @__PURE__ */ t("p", { className: o.contactContent, children: K })
         ] }),
         /* @__PURE__ */ r("div", { className: o.contactColumn, children: [
-          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: l("footer.contact.email", "E-post") }),
-          /* @__PURE__ */ t("p", { className: o.contactContent, children: _ })
+          /* @__PURE__ */ t("h4", { className: o.contactTitle, children: g("footer.contact.email", "E-post") }),
+          /* @__PURE__ */ t("p", { className: o.contactContent, children: N })
         ] })
       ] }),
       /* @__PURE__ */ t("div", { className: o.divider }),
       /* @__PURE__ */ t("div", { className: o.copyrightSection, children: /* @__PURE__ */ r("p", { className: o.copyrightText, children: [
         "© ",
-        P,
+        v,
         " ",
-        l("footer.copyright", "Rødekors")
+        g("footer.copyright", "Rødekors")
       ] }) }),
-      h && /* @__PURE__ */ t("div", { className: o.crossCornerBottomLeft, children: /* @__PURE__ */ t(be, { position: "bottom-left", size: "md", "aria-hidden": !0 }) })
+      k && /* @__PURE__ */ t("div", { className: o.graphicElementBottomLeft, children: /* @__PURE__ */ t(je, { shape: "angle", position: "bottom-left", size: "md", "aria-hidden": !0 }) })
     ] }) }),
     /* @__PURE__ */ t("div", { className: o.whiteSection, children: /* @__PURE__ */ t("div", { className: o.whiteContainer, children: /* @__PURE__ */ r("div", { className: o.whiteContent, children: [
-      J && (m ? /* @__PURE__ */ t(
+      w && (H ? /* @__PURE__ */ t(
         "img",
         {
-          src: m,
-          alt: L,
+          src: H,
+          alt: P,
           className: o.logo,
           loading: "lazy"
         }
       ) : /* @__PURE__ */ t("div", { className: o.logo, children: /* @__PURE__ */ t(ee, {}) })),
-      w && /* @__PURE__ */ t("div", { className: o.slotLarge, children: w })
+      E && /* @__PURE__ */ t("div", { className: o.slotLarge, children: E })
     ] }) }) })
   ] });
 };
-function fs(n) {
+function $s(n) {
   const e = n;
   return `
 .${e.footer} {
@@ -4731,16 +5172,16 @@ function fs(n) {
   width: 100%;
   max-width: 1440px;
   margin: 0 auto;
-  padding: var(--ds-size-30, 120px) var(--ds-size-44, 175px);
+  padding: var(--ds-size-30, 120px) 175px;
   box-sizing: border-box;
 }
-.${e.crossCornerTopRight} {
+.${e.graphicElementTopRight} {
   display: flex;
   justify-content: flex-end;
   width: 100%;
   margin-bottom: var(--ds-size-6, 24px);
 }
-.${e.crossCornerBottomLeft} {
+.${e.graphicElementBottomLeft} {
   display: flex;
   justify-content: flex-start;
   width: 100%;
@@ -4849,7 +5290,7 @@ function fs(n) {
 }
 .${e.contactTitle} {
   font-size: var(--ds-font-size-3, 16px);
-  font-weight: var(--ds-font-weight-bold);
+  font-weight: var(--ds-font-weight-semibold);
   line-height: 1.5;
   letter-spacing: 0.04px;
   color: var(--ds-color-neutral-text-default, #2b2b2b);
@@ -4886,7 +5327,7 @@ function fs(n) {
   width: 100%;
   max-width: 1440px;
   margin: 0 auto;
-  padding: var(--ds-size-6, 24px) var(--ds-size-44, 175px);
+  padding: var(--ds-size-6, 24px) 175px;
   box-sizing: border-box;
 }
 .${e.whiteContent} {
@@ -4922,7 +5363,7 @@ function fs(n) {
 }
 @media (max-width: 1024px) {
   .${e.mainContainer} {
-    padding: var(--ds-size-16, 64px) var(--ds-size-8, 32px);
+    padding: var(--ds-size-15, 64px) var(--ds-size-8, 32px);
   }
   .${e.whiteContainer} {
     padding: var(--ds-size-6, 24px) var(--ds-size-8, 32px);
@@ -5032,7 +5473,7 @@ function fs(n) {
 }
 .${e.contactPersonName} {
   font-size: var(--ds-font-size-4, 18px);
-  font-weight: var(--ds-font-weight-bold);
+  font-weight: var(--ds-font-weight-semibold);
   line-height: 1.5;
   letter-spacing: 0.09px;
   color: var(--ds-color-neutral-text-default, #2b2b2b);
@@ -5131,25 +5572,26 @@ function fs(n) {
 }
 `;
 }
-const ks = "_donor_1hxqz_1", vs = "_tabsWrapper_1hxqz_14", bs = "_content_1hxqz_35", ys = "_amountSection_1hxqz_47", xs = "_amountLabel_1hxqz_55", Ts = "_amountButtons_1hxqz_64", Cs = "_customAmountField_1hxqz_75", ws = "_impactRow_1hxqz_80", Ss = "_heartIcon_1hxqz_88", Is = "_impactText_1hxqz_102", _s = "_impactAmount_1hxqz_112", Ds = "_actionsSection_1hxqz_117", Ls = "_vippsButton_1hxqz_127", As = "_vippsButtonLabel_1hxqz_157", Ns = "_vippsLogo_1hxqz_166", Ms = "_avtalegiroLink_1hxqz_179", js = "_tabHeartIcon_1hxqz_184", z = {
-  donor: ks,
-  tabsWrapper: vs,
-  content: bs,
-  amountSection: ys,
-  amountLabel: xs,
-  amountButtons: Ts,
-  customAmountField: Cs,
-  impactRow: ws,
-  heartIcon: Ss,
-  impactText: Is,
-  impactAmount: _s,
-  actionsSection: Ds,
-  vippsButton: Ls,
-  vippsButtonLabel: As,
-  vippsLogo: Ns,
-  avtalegiroLink: Ms,
-  tabHeartIcon: js
-}, Re = () => /* @__PURE__ */ t(
+const zs = "_donor_xzqak_1", Rs = "_tabsWrapper_xzqak_14", Gs = "_content_xzqak_35", Hs = "_amountSection_xzqak_47", Ws = "_amountLabel_xzqak_55", Us = "_amountButtons_xzqak_64", Vs = "_customAmountField_xzqak_75", Os = "_impactRow_xzqak_80", Ks = "_heartIcon_xzqak_88", Zs = "_impactText_xzqak_102", qs = "_impactAmount_xzqak_112", Ys = "_actionsSection_xzqak_117", Xs = "_vippsButton_xzqak_127", Js = "_vippsButtonLabel_xzqak_157", Qs = "_vippsLogo_xzqak_166", ei = "_avtalegiroLink_xzqak_179", ti = "_tabHeartIcon_xzqak_184", ni = "_tabPanel_xzqak_214", O = {
+  donor: zs,
+  tabsWrapper: Rs,
+  content: Gs,
+  amountSection: Hs,
+  amountLabel: Ws,
+  amountButtons: Us,
+  customAmountField: Vs,
+  impactRow: Os,
+  heartIcon: Ks,
+  impactText: Zs,
+  impactAmount: qs,
+  actionsSection: Ys,
+  vippsButton: Xs,
+  vippsButtonLabel: Js,
+  vippsLogo: Qs,
+  avtalegiroLink: ei,
+  tabHeartIcon: ti,
+  tabPanel: ni
+}, et = () => /* @__PURE__ */ t(
   "svg",
   {
     width: "19",
@@ -5167,7 +5609,7 @@ const ks = "_donor_1hxqz_1", vs = "_tabsWrapper_1hxqz_14", bs = "_content_1hxqz_
       }
     )
   }
-), Fs = () => /* @__PURE__ */ t(
+), oi = () => /* @__PURE__ */ t(
   "svg",
   {
     width: "16",
@@ -5185,7 +5627,7 @@ const ks = "_donor_1hxqz_1", vs = "_tabsWrapper_1hxqz_14", bs = "_content_1hxqz_
       }
     )
   }
-), Bs = () => /* @__PURE__ */ t(
+), ri = () => /* @__PURE__ */ t(
   "svg",
   {
     width: "64",
@@ -5203,134 +5645,154 @@ const ks = "_donor_1hxqz_1", vs = "_tabsWrapper_1hxqz_14", bs = "_content_1hxqz_
       }
     )
   }
-), Es = [
+), ai = [
   { value: 220, label: "220 kr" },
   { value: 345, label: "345 kr" },
   { value: 660, label: "660 kr" }
-], Li = ({
+], Ji = ({
   "data-color": n = "primary",
-  amounts: e = Es,
+  amounts: e = ai,
   defaultAmount: a = 345,
-  oneTimeLabel: d = "En gang",
-  monthlyLabel: h = "Hver måned",
-  customAmountPlaceholder: k = "Valgfritt beløp",
-  amountLabel: u = "Velg ønsket beløp:",
-  impactMessage: v = "En gave på {amount} bidrar til ...",
-  vippsButtonLabel: M = "Gi med",
-  avtalegiroLabel: C = "Gi med avtalegiro",
-  avtalegiroHref: G = "#",
-  currencySuffix: I = "kr",
-  onVippsClick: V,
-  onAvtalegiroClick: D,
+  oneTimeLabel: c = "En gang",
+  monthlyLabel: k = "Hver måned",
+  customAmountPlaceholder: y = "Valgfritt beløp",
+  amountLabel: f = "Velg ønsket beløp:",
+  impactMessage: x = "En gave på {amount} bidrar til ...",
+  vippsButtonLabel: B = "Gi med",
+  avtalegiroLabel: I = "Gi med avtalegiro",
+  avtalegiroHref: J = "#",
+  currencySuffix: L = "kr",
+  onVippsClick: R,
+  onAvtalegiroClick: G,
   onAmountChange: p,
-  showVippsButton: X = !0,
-  showAvtalegiroLink: ne = !0,
-  showImpactMessage: _ = !0,
-  heartVariant: J = "outlined"
+  showVippsButton: Q = !0,
+  showAvtalegiroLink: K = !0,
+  showImpactMessage: N = !0,
+  heartVariant: w = "outlined"
 }) => {
-  const [m, L] = Z("monthly"), [w, j] = Z(a), [A, F] = Z(""), [O, Q] = Z(!1);
-  R(() => {
-    const S = "rk-donor-inline-styles";
-    if (typeof document > "u" || document.getElementById(S)) return;
-    const N = Ps(z), K = document.createElement("style");
-    K.id = S, K.textContent = N, document.head.appendChild(K);
+  const H = We(), [P, E] = Z("monthly"), [q, Y] = Z(a), [$, d] = Z(""), [l, v] = Z(!1);
+  U(() => {
+    const T = "rk-donor-inline-styles";
+    if (typeof document > "u" || document.getElementById(T)) return;
+    const h = si(O), C = document.createElement("style");
+    C.id = T, C.textContent = h, document.head.appendChild(C);
   }, []);
-  const P = O && A ? parseInt(A, 10) || 0 : w, B = (S) => {
-    j(S), Q(!1), F(""), p == null || p(S, m);
-  }, E = (S) => {
-    const N = S.target.value;
-    F(N), Q(!0);
-    const K = parseInt(N, 10);
-    K > 0 && (p == null || p(K, m));
-  }, f = () => {
-    Q(!0);
-  }, l = (S) => {
-    const N = S;
-    L(N), p == null || p(P, N);
-  }, y = () => {
-    V == null || V(P, m);
-  }, ee = () => {
-    D == null || D();
-  }, H = () => {
-    const S = `${P} ${I}`, N = v.split("{amount}");
+  const S = parseInt($, 10), F = l && $ && S > 0 ? S : q, D = (T) => {
+    Y(T), v(!1), d(""), p == null || p(T, P);
+  }, g = (T) => {
+    const h = T.target.value;
+    d(h), v(!0);
+    const C = parseInt(h, 10);
+    C > 0 && (p == null || p(C, P));
+  }, se = () => {
+    v(!0);
+  }, ee = (T) => {
+    const h = T;
+    E(h), p == null || p(F, h);
+  }, te = () => {
+    F > 0 && (R == null || R(F, P));
+  }, ne = () => {
+    G == null || G();
+  }, z = () => {
+    const T = `${F} ${L}`, h = x.split("{amount}");
     return /* @__PURE__ */ r("span", { children: [
-      N[0],
-      /* @__PURE__ */ t("span", { className: z.impactAmount, children: S }),
-      N[1] || ""
+      h[0],
+      /* @__PURE__ */ t("span", { className: O.impactAmount, children: T }),
+      h[1] || ""
     ] });
-  };
-  return /* @__PURE__ */ r("div", { className: z.donor, "data-color": n, children: [
-    /* @__PURE__ */ t("div", { className: z.tabsWrapper, children: /* @__PURE__ */ t(Ce, { defaultValue: "monthly", onChange: l, "data-size": "md", children: /* @__PURE__ */ r(Ce.List, { children: [
-      /* @__PURE__ */ t(Ce.Tab, { value: "one-time", children: d }),
-      /* @__PURE__ */ r(Ce.Tab, { value: "monthly", children: [
-        /* @__PURE__ */ t("span", { className: z.tabHeartIcon, children: /* @__PURE__ */ t(Re, {}) }),
-        h
-      ] })
-    ] }) }) }),
-    /* @__PURE__ */ r("div", { className: z.content, children: [
-      /* @__PURE__ */ r("div", { className: z.amountSection, children: [
-        /* @__PURE__ */ t(ye, { className: z.amountLabel, "data-size": "sm", children: u }),
-        /* @__PURE__ */ t("div", { className: z.amountButtons, children: e.map((S) => {
-          const N = !O && w === S.value;
-          return /* @__PURE__ */ t(
-            de,
-            {
-              variant: N ? "primary" : "secondary",
-              "data-color": N ? "accent" : "neutral",
-              onClick: () => B(S.value),
-              children: S.label
-            },
-            S.value
-          );
-        }) }),
-        /* @__PURE__ */ t("div", { className: z.customAmountField, children: /* @__PURE__ */ t(
-          Xo,
-          {
-            "aria-label": k,
-            placeholder: k,
-            value: A,
-            onChange: E,
-            onFocus: f,
-            type: "number",
-            min: 1
-          }
-        ) })
-      ] }),
-      _ && /* @__PURE__ */ r("div", { className: z.impactRow, children: [
-        /* @__PURE__ */ t("div", { className: z.heartIcon, children: J === "filled" ? /* @__PURE__ */ t(Re, {}) : /* @__PURE__ */ t(Fs, {}) }),
-        /* @__PURE__ */ t("p", { className: z.impactText, children: H() })
-      ] }),
-      /* @__PURE__ */ r("div", { className: z.actionsSection, children: [
-        X && /* @__PURE__ */ r(
-          "button",
-          {
-            className: z.vippsButton,
-            onClick: y,
-            type: "button",
-            "aria-label": `${M} Vipps`,
-            children: [
-              /* @__PURE__ */ t("span", { className: z.vippsButtonLabel, children: M }),
-              /* @__PURE__ */ t("span", { className: z.vippsLogo, children: /* @__PURE__ */ t(Bs, {}) })
-            ]
-          }
-        ),
-        ne && /* @__PURE__ */ t(
-          re,
-          {
-            href: G,
-            "data-color": "neutral",
-            className: z.avtalegiroLink,
-            onClick: (S) => {
-              D && (S.preventDefault(), ee());
-            },
-            children: C
-          }
-        )
-      ] })
+  }, ie = /* @__PURE__ */ r("div", { className: O.content, children: [
+    /* @__PURE__ */ r("div", { className: O.amountSection, children: [
+      /* @__PURE__ */ t(Ne, { className: O.amountLabel, "data-size": "sm", id: H, children: f }),
+      /* @__PURE__ */ t(
+        "div",
+        {
+          className: O.amountButtons,
+          role: "group",
+          "aria-labelledby": H,
+          children: e.map((T) => {
+            const h = !l && q === T.value;
+            return /* @__PURE__ */ t(
+              fe,
+              {
+                variant: h ? "primary" : "secondary",
+                "data-color": h ? "accent" : "neutral",
+                "aria-pressed": h,
+                onClick: () => D(T.value),
+                children: T.label
+              },
+              T.value
+            );
+          })
+        }
+      ),
+      /* @__PURE__ */ t("div", { className: O.customAmountField, children: /* @__PURE__ */ t(
+        xr,
+        {
+          "aria-label": y,
+          placeholder: y,
+          value: $,
+          onChange: g,
+          onFocus: se,
+          type: "number",
+          min: 1
+        }
+      ) })
+    ] }),
+    N && /* @__PURE__ */ r("div", { className: O.impactRow, children: [
+      /* @__PURE__ */ t("div", { className: O.heartIcon, children: w === "filled" ? /* @__PURE__ */ t(et, {}) : /* @__PURE__ */ t(oi, {}) }),
+      /* @__PURE__ */ t("p", { className: O.impactText, children: z() })
+    ] }),
+    /* @__PURE__ */ r("div", { className: O.actionsSection, children: [
+      Q && /* @__PURE__ */ r(
+        "button",
+        {
+          className: O.vippsButton,
+          onClick: te,
+          type: "button",
+          "aria-label": `${B} Vipps`,
+          "data-brand-exception": "vipps",
+          children: [
+            /* @__PURE__ */ t("span", { className: O.vippsButtonLabel, children: B }),
+            /* @__PURE__ */ t("span", { className: O.vippsLogo, children: /* @__PURE__ */ t(ri, {}) })
+          ]
+        }
+      ),
+      K && /* @__PURE__ */ t(
+        pe,
+        {
+          href: J,
+          "data-color": "neutral",
+          className: O.avtalegiroLink,
+          onClick: (T) => {
+            G && (T.preventDefault(), ne());
+          },
+          children: I
+        }
+      )
     ] })
   ] });
+  return /* @__PURE__ */ t("div", { className: O.donor, "data-color": n, children: /* @__PURE__ */ r(
+    Te,
+    {
+      defaultValue: "monthly",
+      onChange: ee,
+      "data-size": "md",
+      className: O.tabsWrapper,
+      children: [
+        /* @__PURE__ */ r(Te.List, { children: [
+          /* @__PURE__ */ t(Te.Tab, { value: "one-time", children: c }),
+          /* @__PURE__ */ r(Te.Tab, { value: "monthly", children: [
+            /* @__PURE__ */ t("span", { className: O.tabHeartIcon, children: /* @__PURE__ */ t(et, {}) }),
+            k
+          ] })
+        ] }),
+        /* @__PURE__ */ t(Te.Panel, { value: "one-time", className: O.tabPanel, children: P === "one-time" ? ie : null }),
+        /* @__PURE__ */ t(Te.Panel, { value: "monthly", className: O.tabPanel, children: P === "monthly" ? ie : null })
+      ]
+    }
+  ) });
 };
-function Ps(n) {
+function si(n) {
   return `
 .${n.donor} {
   border-radius: 16px;
@@ -5352,6 +5814,10 @@ function Ps(n) {
   display: flex !important;
   width: 100% !important;
 }
+.${n.tabPanel} {
+  width: 100%;
+  padding: 0;
+}
 .${n.tabsWrapper} [role="tab"] {
   flex: 1 1 50% !important;
   display: inline-flex !important;
@@ -5496,72 +5962,72 @@ function Ps(n) {
 `;
 }
 export {
-  un as Alert,
-  Oe as Avatar,
-  hn as Badge,
-  Us as BadgePosition,
-  Vs as Breadcrumbs,
-  Ks as BreadcrumbsItem,
-  qs as BreadcrumbsLink,
-  Os as BreadcrumbsList,
-  de as Button,
-  fn as Card,
-  Ys as CardBlock,
-  Po as Carousel,
-  kn as Checkbox,
-  Xs as Chip,
-  be as CrossCorner,
-  bo as DateInput,
-  co as DatePicker,
-  ei as Details,
-  ti as Dialog,
-  ni as Divider,
-  Li as Donor,
-  U as Dropdown,
-  li as DropdownButton,
-  ai as DropdownHeading,
-  ii as DropdownItem,
-  si as DropdownList,
-  oi as DropdownTrigger,
-  ri as DropdownTriggerContext,
-  di as ErrorSummary,
-  ci as Field,
-  Vo as FieldCounter,
-  Uo as FieldDescription,
-  pi as Fieldset,
-  Di as Footer,
-  _i as Header,
-  Oo as Heading,
-  Ye as Input,
-  Ko as Label,
-  Js as LanguageProvider,
-  re as Link,
-  mi as List,
-  qo as Pagination,
-  hi as PaginationButton,
-  ui as PaginationItem,
-  gi as PaginationList,
-  ye as Paragraph,
-  ki as Popover,
-  vi as Radio,
-  Te as Search,
-  yi as Select,
-  xi as SkeletonLoader,
-  Ti as SkipLink,
-  Eo as Spinner,
-  Yo as Suggestion,
-  De as Switch,
-  Ci as Table,
-  Ce as Tabs,
-  Zo as Tag,
-  wi as Textarea,
-  Xo as Textfield,
-  Si as ToggleGroup,
-  Ii as Tooltip,
-  Jo as ValidationMessage,
-  Zs as useCheckboxGroup,
-  Qs as useLanguage,
-  xe as useLanguageOptional,
-  fi as usePagination,
-  bi as useRadioGroup
+  jn as Alert,
+  at as Avatar,
+  An as Badge,
+  gi as BadgePosition,
+  ui as Breadcrumbs,
+  fi as BreadcrumbsItem,
+  ki as BreadcrumbsLink,
+  hi as BreadcrumbsList,
+  fe as Button,
+  Nn as Card,
+  vi as CardBlock,
+  nr as Carousel,
+  En as Checkbox,
+  yi as Chip,
+  Po as DateInput,
+  Lo as DatePicker,
+  Ci as Details,
+  wi as Dialog,
+  Si as Divider,
+  Ji as Donor,
+  oe as Dropdown,
+  ji as DropdownButton,
+  Li as DropdownHeading,
+  Mi as DropdownItem,
+  Di as DropdownList,
+  _i as DropdownTrigger,
+  Ii as DropdownTriggerContext,
+  Ai as ErrorSummary,
+  Ni as Field,
+  fr as FieldCounter,
+  hr as FieldDescription,
+  Ei as Fieldset,
+  Xi as Footer,
+  je as GraphicElement,
+  Yi as Header,
+  rt as Heading,
+  dt as Input,
+  kr as Label,
+  xi as LanguageProvider,
+  pe as Link,
+  Bi as List,
+  vr as Pagination,
+  $i as PaginationButton,
+  Pi as PaginationItem,
+  Fi as PaginationList,
+  Ne as Paragraph,
+  Ri as Popover,
+  Gi as Radio,
+  Pe as Search,
+  Wi as Select,
+  Ui as SkeletonLoader,
+  Vi as SkipLink,
+  tr as Spinner,
+  br as Suggestion,
+  Re as Switch,
+  Oi as Table,
+  Te as Tabs,
+  yr as Tag,
+  Ki as Textarea,
+  xr as Textfield,
+  Zi as ToggleGroup,
+  qi as Tooltip,
+  Tr as ValidationMessage,
+  bi as useCheckboxGroup,
+  Ti as useLanguage,
+  Be as useLanguageOptional,
+  zi as usePagination,
+  Hi as useRadioGroup
 };