@kickstartds/ds-agency-premium 1.6.71--canary.54.2407.0 → 1.6.71

package/dist/components/content-nav/content-nav.schema.json

@@ -1,52 +0,0 @@
-{
-  "$schema": "http://json-schema.org/draft-07/schema#",
-  "$id": "http://schema.mydesignsystem.com/content-nav.schema.json",
-  "title": "Content Nav",
-  "type": "object",
-  "properties": {
-    "image": {
-      "type": "object",
-      "properties": {
-        "src": {
-          "type": "string",
-          "format": "uri",
-          "description": "URL of the image to display in the content nav."
-        },
-        "alt": {
-          "type": "string",
-          "description": "Alternative text for the image."
-        }
-      },
-      "required": ["src"]
-    },
-    "topic": {
-      "type": "string",
-      "description": "The topic of the content being navigated."
-    },
-    "links": {
-      "type": "array",
-      "items": {
-        "type": "object",
-        "properties": {
-          "label": {
-            "type": "string",
-            "description": "The text label for the link."
-          },
-          "url": {
-            "type": "string",
-            "format": "uri",
-            "description": "The URL the link points to."
-          }
-        },
-        "required": ["label", "url"],
-        "additionalProperties": false
-      }
-    },
-    "initiallyShown": {
-      "type": "number",
-      "default": 4,
-      "description": "Determines how many links are initially shown in the content nav. If there are more links, a 'Show More' button will be displayed."
-    }
-  },
-  "additionalProperties": false
-}

package/dist/components/content-nav/index.d.ts

@@ -1,7 +0,0 @@
-/// <reference types="react" />
-import { ContentNavProps } from "../../ContentNavProps-0e282a9f.js";
-declare const ContentNavContextDefault: import("react").ForwardRefExoticComponent<ContentNavProps & import("react").RefAttributes<HTMLDivElement>>;
-declare const ContentNavContext: import("react").Context<import("react").ForwardRefExoticComponent<ContentNavProps & import("react").RefAttributes<HTMLDivElement>>>;
-declare const ContentNav: import("react").ForwardRefExoticComponent<ContentNavProps & import("react").RefAttributes<HTMLDivElement>>;
-export type { ContentNavProps };
-export { ContentNavContextDefault, ContentNavContext, ContentNav };

package/dist/components/content-nav/index.js

@@ -1,21 +0,0 @@
-import "./content-nav.css";
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef, createContext, useContext } from 'react';
-import { Icon } from '@kickstartds/base/lib/icon';
-import { d as deepMergeDefaults } from '../../helpers-12f48df8.js';
-
-const defaults = {
-    "image": {},
-    "links": [],
-    "initiallyShown": 4
-};
-
-const ContentNavContextDefault = forwardRef(({ image, links, topic, initiallyShown }, ref) => (jsxs("div", { className: "dsa-content-nav", ref: ref, children: [image && image?.src && (jsx("div", { className: "dsa-content-nav__image", children: jsx("img", { src: image.src, alt: image.alt }) })), jsxs("div", { className: "dsa-content-nav__content", children: [topic && (jsx("div", { className: "dsa-content-nav__topic", children: jsx("span", { children: topic }) })), jsx("div", { className: "dsa-content-nav__links dsa-content-nav__links--initial", children: links.slice(0, initiallyShown).map((link, index) => (jsxs("a", { href: link.url, className: "dsa-content-nav__link", children: [link.label, jsx(Icon, { icon: "chevron-right" })] }, index))) }), links.length > initiallyShown && (jsxs("details", { className: "dsa-content-nav__more", children: [jsxs("summary", { className: "dsa-content-nav__toggle-more", children: [jsx("span", { className: "dsa-content-nav__toggle-label--more", children: "Show more" }), jsx("span", { className: "dsa-content-nav__toggle-label--less", children: "Show less" }), jsx(Icon, { "aria-hidden": true, icon: "chevron-down" })] }), jsx("div", { className: "dsa-content-nav__more-content", children: jsx("div", { className: "dsa-content-nav__links dsa-content-nav__links--more", children: links.slice(initiallyShown).map((link, index) => (jsxs("a", { href: link.url, className: "dsa-content-nav__link", children: [link.label, jsx(Icon, { icon: "chevron-right" })] }, index))) }) })] }))] })] })));
-const ContentNavContext = createContext(ContentNavContextDefault);
-const ContentNav = forwardRef((props, ref) => {
-    const Component = useContext(ContentNavContext);
-    return jsx(Component, { ...deepMergeDefaults(defaults, props), ref: ref });
-});
-ContentNav.displayName = "ContentNav";
-
-export { ContentNav, ContentNavContext, ContentNavContextDefault };

package/dist/components/cookie-consent/C15t.client.d.ts

@@ -1,5 +0,0 @@
-import CookieConsent from "./CookieConsent.client.js";
-declare class CookieConsentC15t extends CookieConsent {
-    static store: any;
-}
-export { CookieConsentC15t as default };

package/dist/components/cookie-consent/C15t.client.js

@@ -1,123 +0,0 @@
-import { define } from '@kickstartds/core/lib/component';
-import 'c15t';
-import CookieConsent from './CookieConsent.client.js';
-
-const customTranslations = {
-    de: {
-        accept: "Akzeptieren",
-        reject: "Ablehnen",
-        required: "Immer aktiv",
-        settings: "Cookies verwalten",
-    },
-    en: {
-        accept: "Accept",
-        reject: "Reject",
-        required: "Always Active",
-        settings: "Cookie Preferences",
-    },
-};
-const translate = (elements, translationConfig) => {
-    const defaultLanguage = translationConfig.defaultLanguage;
-    const translations = translationConfig.translations[defaultLanguage];
-    const customTranslation = customTranslations[defaultLanguage] || customTranslations.en;
-    // Notice
-    elements.notice.title.textContent = translations.cookieBanner.title;
-    elements.notice.description.textContent =
-        translations.cookieBanner.description;
-    elements.notice.customizeBtn.textContent = translations.common.customize;
-    elements.notice.rejectAllBtn.textContent = translations.common.rejectAll;
-    elements.notice.acceptAllBtn.textContent = translations.common.acceptAll;
-    // Dialog
-    elements.dialog.title.textContent = translations.consentManagerDialog.title;
-    elements.dialog.description.textContent =
-        translations.consentManagerDialog.description;
-    elements.dialog.activateAllBtn.textContent = translations.common.acceptAll;
-    elements.dialog.deactivateAllBtn.textContent = translations.common.rejectAll;
-    elements.dialog.saveBtn.textContent = translations.common.save;
-    for (const option of elements.dialog.form.querySelectorAll(".dsa-cookie-consent-dialogue__option")) {
-        const type = option.dataset.consentType;
-        const translation = translations.consentTypes[type];
-        if (translation) {
-            option.querySelector(".dsa-headline__inner").textContent =
-                translation.title;
-            option.querySelector(".dsa-cookie-consent-dialogue__option-description").textContent = translation.description;
-        }
-        const requiredLabel = option.querySelector(".dsa-cookie-consent-dialogue__label");
-        if (requiredLabel)
-            requiredLabel.textContent = customTranslation.required;
-    }
-    for (const element of elements.dialog.form.elements) {
-        if (element.type === "radio") {
-            element.nextElementSibling.nextElementSibling.textContent =
-                customTranslation[element.value];
-        }
-    }
-    // settings
-    elements.settings.button.firstElementChild.textContent =
-        customTranslation.settings;
-};
-class CookieConsentC15t extends CookieConsent {
-    constructor(element) {
-        super(element);
-        const store = this.constructor.store;
-        const elements = this.elements;
-        // get gdprTypes from radio buttons
-        const initialState = store.getState();
-        const gdprTypes = [];
-        for (const element of elements.dialog.form.elements) {
-            if (element.type === "radio" && element.value === "accept") {
-                gdprTypes.push(element.name);
-            }
-        }
-        initialState.setGdprTypes(gdprTypes);
-        const update = (state) => {
-            // show/hide cookie banner or settings button
-            this.showNotice = state.showPopup;
-            // update dialog form
-            for (const type in state.consents) {
-                const radios = elements.dialog.form.elements[type];
-                const accepted = state.consents[type];
-                if (radios) {
-                    for (const radio of radios) {
-                        radio.defaultChecked =
-                            radio.value === "accept" ? accepted : !accepted;
-                    }
-                }
-            }
-        };
-        const unsub = store.subscribe(update);
-        translate(this.elements, initialState.translationConfig);
-        update(initialState);
-        const acceptCustom = () => {
-            const state = store.getState();
-            const consentTypes = state.getDisplayedConsents();
-            for (const type of consentTypes) {
-                if (!type.disabled) {
-                    state.setConsent(type.name, elements.dialog.form.elements[type.name].value === "accept");
-                }
-            }
-            state.saveConsents("custom");
-        };
-        const acceptAll = () => {
-            const state = store.getState();
-            state.saveConsents("all");
-        };
-        const rejectAll = () => {
-            const state = store.getState();
-            state.saveConsents("necessary");
-        };
-        elements.dialog.form.addEventListener("submit", acceptCustom);
-        elements.notice.acceptAllBtn.addEventListener("click", acceptAll);
-        elements.notice.rejectAllBtn.addEventListener("click", rejectAll);
-        this.onDisconnect(() => {
-            unsub();
-            elements.dialog.form.removeEventListener("submit", acceptCustom);
-            elements.notice.acceptAllBtn.removeEventListener("click", acceptAll);
-            elements.notice.rejectAllBtn.removeEventListener("click", rejectAll);
-        });
-    }
-}
-CookieConsentC15t.identifier = "dsa.cookie-consent.c15t";
-define(CookieConsentC15t.identifier, CookieConsentC15t);
-
-export { CookieConsentC15t as default };

package/dist/components/cookie-consent/CookieConsent.client.d.ts

@@ -1,29 +0,0 @@
-declare class CookieConsent {
-    static identifier: string;
-    constructor(element: any);
-    elements: {
-        notice: {
-            wrapper: any;
-            title: any;
-            description: any;
-            customizeBtn: any;
-            rejectAllBtn: any;
-            acceptAllBtn: any;
-        };
-        dialog: {
-            wrapper: any;
-            title: any;
-            description: any;
-            closeBtn: any;
-            form: any;
-            activateAllBtn: any;
-            deactivateAllBtn: any;
-            saveBtn: any;
-        };
-        settings: {
-            button: any;
-        };
-    };
-    set showNotice(arg: any);
-}
-export { CookieConsent as default };

package/dist/components/cookie-consent/CookieConsent.client.js

@@ -1,84 +0,0 @@
-import { define, Component } from '@kickstartds/core/lib/component';
-
-class CookieConsent extends Component {
-    constructor(element) {
-        super(element);
-        const $ = element.querySelector.bind(element);
-        const elements = (this.elements = {
-            notice: {
-                wrapper: $(".dsa-cookie-consent-notice"),
-                title: $(".dsa-cookie-consent-notice__title .dsa-headline__inner"),
-                description: $(".dsa-cookie-consent-notice__description"),
-                customizeBtn: $(".dsa-cookie-consent-notice__button--customize"),
-                rejectAllBtn: $(".dsa-cookie-consent-notice__button--reject"),
-                acceptAllBtn: $(".dsa-cookie-consent-notice__button--accept"),
-            },
-            dialog: {
-                wrapper: $(".dsa-cookie-consent-dialogue"),
-                title: $(".dsa-cookie-consent-dialogue__title .dsa-headline__inner"),
-                description: $(".dsa-cookie-consent-dialogue__description"),
-                closeBtn: $(".dsa-cookie-consent-dialogue__close"),
-                form: $(".dsa-cookie-consent-dialogue__form"),
-                activateAllBtn: $(".dsa-cookie-consent-dialogue__button--activate-all"),
-                deactivateAllBtn: $(".dsa-cookie-consent-dialogue__button--deactivate-all"),
-                saveBtn: $(".dsa-cookie-consent-dialogue__button--save"),
-            },
-            settings: {
-                button: $(".dsa-cookie-consent-revisit"),
-            },
-        });
-        const showDialog = () => {
-            elements.dialog.wrapper.showModal();
-        };
-        const closeDialog = () => {
-            elements.dialog.wrapper.close();
-        };
-        const closeDialogAndReset = () => {
-            closeDialog();
-            elements.dialog.form.reset();
-        };
-        const onBackdropClick = (event) => {
-            if (event.target === elements.dialog.wrapper)
-                closeDialogAndReset();
-        };
-        const activateAll = () => {
-            for (const element of elements.dialog.form.elements) {
-                if (element.value === "accept") {
-                    element.checked = true;
-                }
-            }
-        };
-        const deactivateAll = () => {
-            for (const element of elements.dialog.form.elements) {
-                if (element.value === "reject") {
-                    element.checked = true;
-                }
-            }
-        };
-        elements.notice.customizeBtn.addEventListener("click", showDialog);
-        elements.settings.button.addEventListener("click", showDialog);
-        elements.dialog.closeBtn.addEventListener("click", closeDialogAndReset);
-        elements.dialog.activateAllBtn.addEventListener("click", activateAll);
-        elements.dialog.deactivateAllBtn.addEventListener("click", deactivateAll);
-        elements.dialog.wrapper.addEventListener("click", onBackdropClick);
-        window._ks.radio.on(CookieConsent.identifier + ".showNotice", (_, value) => {
-            this.showNotice = value;
-        });
-        this.onDisconnect(() => {
-            elements.notice.customizeBtn.removeEventListener("click", showDialog);
-            elements.settings.button.removeEventListener("click", showDialog);
-            elements.dialog.closeBtn.removeEventListener("click", closeDialogAndReset);
-            elements.dialog.activateAllBtn.removeEventListener("click", activateAll);
-            elements.dialog.deactivateAllBtn.removeEventListener("click", deactivateAll);
-            elements.dialog.wrapper.removeEventListener("click", onBackdropClick);
-        });
-    }
-    set showNotice(value) {
-        this.elements.notice.wrapper.hidden = !value;
-        this.elements.settings.button.hidden = value;
-    }
-}
-CookieConsent.identifier = "dsa.cookie-consent";
-define(CookieConsent.identifier, CookieConsent);
-
-export { CookieConsent as default };

package/dist/components/cookie-consent/cookie-consent.css

@@ -1,255 +0,0 @@
-.dsa-cookie-consent {
-  --dsa-cookie-consent-notice--gap: var(--ks-spacing-stack-s);
-  --dsa-cookie-consent-notice--max-height: 45vh;
-  --dsa-cookie-consent-notice_card--background-color: var(--ks-background-color-default);
-  --dsa-cookie-consent-notice_card--padding: var(--ks-spacing-inset-m);
-  --dsa-cookie-consent-notice_card--left: var(--ks-spacing-m);
-  --dsa-cookie-consent-notice_card--bottom: var(--ks-spacing-m);
-  --dsa-cookie-consent-notice_card--border-radius: var(--ks-border-radius-card);
-  --dsa-cookie-consent-notice_card--max-width: var(--dsa-tile--width_largest);
-  --dsa-cookie-consent-notice_card--border: var(--ks-border-color-card) solid var(--ks-border-width-default);
-  --dsa-cookie-consent-notice_card--box-shadow: var(--ks-box-shadow-card);
-  --dsa-cookie-consent-notice_banner--padding: var(--ks-spacing-inset-m);
-  --dsa-cookie-consent-notice_banner--background-color: var(--ks-background-color-default);
-  --dsa-cookie-consent-notice_banner--box-shadow: var(--ks-box-shadow-surface);
-  --dsa-cookie-consent-notice_banner--border-top: var(--ks-border-color-interface) solid var(--ks-border-width-default);
-  --dsa-cookie-consent-notice__buttons--gap: var(--ks-spacing-stack-xs) var(--ks-spacing-inline-s);
-  --dsa-cookie-consent-revisit--bottom: var(--ks-spacing-m);
-  --dsa-cookie-consent-revisit--left: var(--ks-spacing-m);
-  --dsa-cookie-consent-revisit__label--background-color: var(--ks-background-color-default-inverted);
-  --dsa-cookie-consent-revisit__label--border-radius: 0.25em;
-  --dsa-cookie-consent-revisit__label--padding: var(--ks-spacing-inset-squish-xs);
-  --dsa-cookie-consent-dialogue--padding-horizontal: var(--ks-spacing-inset-m);
-  --dsa-cookie-consent-dialogue--border-radius: var(--ks-border-radius-card);
-  --dsa-cookie-consent-dialogue--border: var(--ks-border-color-interface) solid var(--ks-border-width-default);
-  --dsa-cookie-consent-dialogue--box-shadow: var(--ks-box-shadow-card);
-  --dsa-cookie-consent-dialogue--background-color: var(--ks-background-color-default);
-  --dsa-cookie-consent-dialogue--max-width: var(--dsa-tile--width_largest);
-  --dsa-cookie-consent-dialogue--max-height: 100%;
-  --dsa-cookie-consent-dialogue--spacing-vertical: var(--ks-spacing-inset-s);
-  --dsa-cookie-consent-dialogue--spacing-horizontal: var(--ks-spacing-inset-s);
-  --dsa-cookie-consent-dialogue__block--padding-vertical: var(--ks-spacing-inset-m);
-  --dsa-cookie-consent-dialogue__header--padding: var(--ks-spacing-inset-squish-m);
-  --dsa-cookie-consent-dialogue__header--gap: var(--ks-spacing-inline-m);
-  --dsa-cookie-consent-dialogue__content--border: var(--ks-border-color-interface) solid var(--ks-border-width-default);
-  --dsa-cookie-consent-dialogue__close--padding: var(--ks-spacing-inset-xs);
-  --dsa-cookie-consent-dialogue__close--color: var(--ks-text-color-interface-interactive);
-  --dsa-cookie-consent-dialogue__close--color_hover: var(--ks-text-color-interface-interactive);
-  --dsa-cookie-consent-dialogue__close--background-color_hover: var(--ks-color-fg-alpha-8);
-  --dsa-cookie-consent-dialogue__close--background-color: transparent;
-  --dsa-cookie-consent-dialogue__description--border-bottom: 1px solid var(--ks-border-color-interface);
-  --dsa-cookie-consent-dialogue__description--font: var(--ks-font-interface-s);
-  --dsa-cookie-consent-dialogue__description--color: var(--ks-text-color-interface);
-  --dsa-cookie-consent-dialogue__option--border-bottom: 1px solid var(--ks-border-color-interface);
-  --dsa-cookie-consent-dialogue__option--padding-vertical: var(--ks-spacing-stack-m);
-  --dsa-cookie-consent-dialogue__option--gap: var(--ks-spacing-stack-xs);
-  --dsa-cookie-consent-dialogue__label--font: var(--ks-font-interface-s);
-  --dsa-cookie-consent-dialogue__label--color: var(--ks-text-color-positive);
-  --dsa-cookie-consent-dialogue__label--font-weight: var(--ks-font-weight-bold);
-  --dsa-cookie-consent-dialogue__toggle--gap: var(--ks-spacing-stack-xs) var(--ks-spacing-inline-m);
-  --dsa-cookie-consent-dialogue__buttons--gap: var(--ks-spacing-stack-xs) var(--ks-spacing-inline-s);
-  --dsa-cookie-consent-overlay--background-color: var(--dsa-overlay--background-color);
-}
-@media (min-width: 48em) {
-  .dsa-cookie-consent {
-    --dsa-cookie-consent-dialogue--max-height: 90vh;
-  }
-}
-
-.dsa-cookie-consent-notice {
-  display: flex;
-  gap: var(--dsa-cookie-consent-notice--gap, var(--ks-spacing-stack-s));
-  flex-direction: column;
-  max-height: var(--dsa-cookie-consent-notice--max-height, 45vh);
-}
-.dsa-cookie-consent-notice--card {
-  width: 100%;
-  background-color: var(--dsa-cookie-consent-notice_card--background-color, var(--ks-background-color-default));
-  padding: var(--dsa-cookie-consent-notice_card--padding, var(--ks-spacing-inset-m));
-  position: fixed;
-  box-shadow: var(--dsa-cookie-consent-notice_card--box-shadow, var(--ks-box-shadow-card));
-  bottom: 0;
-  left: 0;
-  border-top: var(--dsa-cookie-consent-notice_card--border, var(--ks-border-color-card) solid var(--ks-border-width-default));
-}
-@media (min-width: 48em) {
-  .dsa-cookie-consent-notice--card {
-    border: var(--dsa-cookie-consent-notice_card--border, var(--ks-border-color-card) solid var(--ks-border-width-default));
-    border-radius: var(--dsa-cookie-consent-notice_card--border-radius, var(--ks-border-radius-card));
-    max-width: var(--dsa-cookie-consent-notice_card--max-width, var(--dsa-tile--width_large));
-    bottom: var(--dsa-cookie-consent-notice_card--bottom, var(--ks-spacing-m));
-    left: var(--dsa-cookie-consent-notice_card--left, var(--ks-spacing-m));
-    border-radius: var(--dsa-cookie-consent-notice_card--border-radius, var(--ks-border-radius-card));
-  }
-}
-.dsa-cookie-consent-notice--banner {
-  background-color: var(--dsa-cookie-consent-notice_banner--background-color, var(--ks-background-color-default));
-  border-top: var(--dsa-cookie-consent-notice_banner--border-top, var(--ks-border-color-interface)) solid var(--ks-border-width-default);
-  box-shadow: var(--dsa-cookie-consent-notice_banner--box-shadow, var(--ks-box-shadow-surface));
-  padding: var(--dsa-cookie-consent-notice_banner--padding, var(--ks-spacing-inset-m));
-  position: fixed;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  z-index: 500;
-}
-.dsa-cookie-consent-notice__buttons {
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--dsa-cookie-consent-notice__buttons--gap, var(--ks-spacing-stack-xs) var(--ks-spacing-inline-s));
-  flex-direction: column;
-}
-@media (min-width: 36em) {
-  .dsa-cookie-consent-notice__buttons {
-    flex-direction: row;
-  }
-}
-
-.dsa-cookie-consent-revisit {
-  position: fixed;
-  bottom: var(--dsa-cookie-consent-revisit--bottom, var(--ks-spacing-m));
-  left: var(--dsa-cookie-consent-revisit--left, var(--ks-spacing-m));
-  z-index: 1000;
-  height: fit-content;
-  width: fit-content;
-  padding: var(--dsa-cookie-consent-revisit--padding, var(--ks-spacing-inset-s));
-  border-radius: var(--ks-border-radius-circle);
-}
-.dsa-cookie-consent-revisit .icon {
-  margin: 0;
-}
-.dsa-cookie-consent-revisit:hover span {
-  opacity: 1;
-}
-.dsa-cookie-consent-revisit span {
-  transition: var(--ks-transition-hover);
-  position: absolute;
-  width: fit-content;
-  white-space: nowrap;
-  left: 100%;
-  transform: translateX(6.5%);
-  background-color: var(--dsa-cookie-consent-revisit__label--background-color, var(--ks-background-color-default-inverted));
-  padding: var(--dsa-cookie-consent-revisit__label--padding, var(--ks-spacing-inset-squish-xs));
-  border-radius: var(--dsa-cookie-consent-revisit__label--border-radius, 0.25em);
-  opacity: 0;
-}
-.dsa-cookie-consent-revisit span::before {
-  position: absolute;
-  content: "";
-  height: 0.75em;
-  aspect-ratio: 1;
-  background-color: var(--dsa-cookie-consent-revisit__label--background-color, var(--ks-background-color-default-inverted));
-  top: 50%;
-  transform: translate(-50%, -50%) rotate(45deg);
-  left: 0;
-}
-
-.dsa-cookie-consent-dialogue[open] {
-  border-radius: var(--dsa-cookie-consent-dialogue--border-radius, var(--ks-border-radius-card));
-  border: var(--dsa-cookie-consent-dialogue--border, var(--ks-border-color-interface) solid var(--ks-border-width-default));
-  box-shadow: var(--dsa-cookie-consent-dialogue--box-shadow, var(--ks-box-shadow-card));
-  background-color: var(--dsa-cookie-consent-dialogue--background-color, var(--ks-background-color-default));
-  display: flex;
-  flex-direction: column;
-  padding: 0;
-  width: calc(100% - var(--dsa-cookie-consent-dialogue--spacing-horizontal, var(--ks-spacing-inset-xs)) * 2);
-  max-width: var(--dsa-cookie-consent-dialogue--max-width, var(--dsa-tile--width_largest));
-  max-height: calc(var(--dsa-cookie-consent-dialogue--max-height, 100%) - var(--dsa-cookie-consent-dialogue--spacing-vertical, var(--ks-spacing-inset-xs)) * 2);
-}
-.dsa-cookie-consent-dialogue__header {
-  padding-top: var(--dsa-cookie-consent-dialogue__block--padding-vertical, var(--ks-spacing-inset-m));
-  padding-bottom: var(--dsa-cookie-consent-dialogue__block--padding-vertical, var(--ks-spacing-inset-m));
-  padding-left: var(--dsa-cookie-consent-dialogue--padding-horizontal, var(--ks-spacing-inset-m));
-  padding-right: var(--dsa-cookie-consent-dialogue--padding-horizontal, var(--ks-spacing-inset-m));
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: var(--dsa-cookie-consent-dialogue__header--gap, var(--ks-spacing-inline-m));
-}
-.dsa-cookie-consent-dialogue__close {
-  --dsa-button--padding: var(--dsa-cookie-consent-dialogue__close--padding, var(--ks-spacing-inset-xs));
-  margin: calc(var(--dsa-cookie-consent-dialogue__close--padding, var(--ks-spacing-inset-xs)) * -1);
-  --dsa-button_secondary--color: var(
-    --dsa-cookie-consent-dialogue__close--color,
-    var(--ks-text-color-interface-interactive)
-  );
-  --dsa-button_secondary--color_hover: var(
-    --dsa-cookie-consent-dialogue__close--color_hover,
-    var(--ks-text-color-interface-interactive)
-  );
-  --dsa-button_secondary--background-color_hover: var(
-    --dsa-cookie-consent-dialogue__close--background-color_hover,
-    var(--ks-color-fg-alpha-8)
-  );
-  border-radius: var(--ks-border-radius-circle);
-  background-color: var(--dsa-cookie-consent-dialogue__close--background-color, transparent);
-}
-.dsa-cookie-consent-dialogue__form {
-  flex: 1;
-  overflow-y: auto;
-  display: flex;
-  flex-direction: column;
-}
-.dsa-cookie-consent-dialogue__content {
-  flex: 1;
-  overflow-y: auto;
-  border-top: var(--dsa-cookie-consent-dialogue__content--border, var(--ks-border-color-interface) solid var(--ks-border-width-default));
-  border-bottom: var(--dsa-cookie-consent-dialogue__content--border, var(--ks-border-color-interface) solid var(--ks-border-width-default));
-}
-.dsa-cookie-consent-dialogue__description {
-  border-bottom: var(--dsa-cookie-consent-dialogue__description--border-bottom, 1px solid var(--ks-border-color-interface));
-  padding-top: calc(var(--dsa-cookie-consent-dialogue__block--padding-vertical, var(--ks-spacing-stack-m)) * 0.65);
-  padding-bottom: calc(var(--dsa-cookie-consent-dialogue__block--padding-vertical, var(--ks-spacing-stack-m)) * 0.65);
-  padding-left: var(--dsa-cookie-consent-dialogue--padding-horizontal, var(--ks-spacing-inline-m));
-  padding-right: var(--dsa-cookie-consent-dialogue--padding-horizontal, var(--ks-spacing-inline-m));
-  font: var(--dsa-cookie-consent-dialogue__description--font, var(--ks-font-interface-s));
-}
-.dsa-cookie-consent-dialogue__options {
-  padding-left: var(--dsa-cookie-consent-dialogue--padding-horizontal, var(--ks-spacing-inline-m));
-  padding-right: var(--dsa-cookie-consent-dialogue--padding-horizontal, var(--ks-spacing-inline-m));
-}
-.dsa-cookie-consent-dialogue__option {
-  display: flex;
-  flex-direction: column;
-  gap: var(--dsa-cookie-consent-dialogue__option--gap, var(--ks-spacing-stack-xs));
-  border-bottom: var(--dsa-cookie-consent-dialogue__option--border-bottom, 1px solid var(--ks-border-color-interface));
-  padding-top: var(--dsa-cookie-consent-dialogue__option--padding-vertical, var(--ks-spacing-inset-m));
-  padding-bottom: var(--dsa-cookie-consent-dialogue__option--padding-vertical, var(--ks-spacing-inset-m));
-}
-.dsa-cookie-consent-dialogue__option:last-child {
-  border-bottom: none;
-}
-.dsa-cookie-consent-dialogue__label {
-  font: var(--dsa-cookie-consent-dialogue__label--font, var(--ks-font-interface-s));
-  color: var(--dsa-cookie-consent-dialogue__label--color, var(--ks-text-color-positive));
-  font-weight: var(--dsa-cookie-consent-dialogue__label--font-weight, var(--ks-font-weight-bold));
-}
-.dsa-cookie-consent-dialogue__option-description {
-  margin: 0;
-  font: var(--dsa-cookie-consent-dialogue__description--font, var(--ks-font-interface-s));
-  color: var(--dsa-cookie-consent-dialogue__description--color, var(--ks-text-color-interface));
-}
-.dsa-cookie-consent-dialogue__toggle {
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--dsa-cookie-consent-dialogue__toggle--gap, var(--ks-spacing-stack-xs) var(--ks-spacing-inline-s));
-  align-items: center;
-}
-.dsa-cookie-consent-dialogue__buttons {
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--dsa-cookie-consent-dialogue__buttons--gap, var(--ks-spacing-stack-xs) var(--ks-spacing-inline-s));
-  padding-top: var(--dsa-cookie-consent-dialogue__block--padding-vertical, var(--ks-spacing-inset-m));
-  padding-bottom: var(--dsa-cookie-consent-dialogue__block--padding-vertical, var(--ks-spacing-inset-m));
-  padding-left: var(--dsa-cookie-consent-dialogue--padding-horizontal, var(--ks-spacing-inset-m));
-  padding-right: var(--dsa-cookie-consent-dialogue--padding-horizontal, var(--ks-spacing-inset-m));
-  flex-direction: column;
-}
-@media (min-width: 36em) {
-  .dsa-cookie-consent-dialogue__buttons {
-    flex-direction: row;
-  }
-}
-.dsa-cookie-consent-dialogue::backdrop {
-  background-color: var(--dsa-cookie-consent-overlay--background-color, var(--dsa-overlay--background-color));
-}