@marioschmidt/design-system-tokens 1.0.62 → 1.0.64

package/dist/ios/brands/bild/components/Video/VideoTokens.swift

@@ -0,0 +1,79 @@
+//
+// Do not edit directly, this file was auto-generated.
+//
+// BILD Design System Tokens v1.0.64
+// Generated by Style Dictionary
+//
+// Component: Video | Brand: Bild
+// Aggregated component tokens with all modes
+//
+// Copyright (c) 2024 Axel Springer Deutschland GmbH
+//
+
+import SwiftUI
+
+/// Video Design Tokens
+///
+/// Usage:
+///   VideoTokens.Colors.light.primaryBgIdle
+///   VideoTokens.Sizing.compact.height
+///   VideoTokens.Density.current(for: theme.density).contentGap
+public enum VideoTokens {
+
+    // MARK: - Sizing
+
+    /// Sizing tokens protocol
+    public protocol VideoSizingTokens: Sendable {
+        var videoTimeBadgeCornerSize: CGFloat { get }
+        var videoTimeBadgeFontSize: CGFloat { get }
+        var videoTimeBadgeSize: CGFloat { get }
+        var videoRedPlayIconWidthSize: CGFloat { get }
+        var videoRedPlayIconHeightSize: CGFloat { get }
+        var videoBadgeTimeLineHeight: CGFloat { get }
+        var videoSkeletonContainerHeight: CGFloat { get }
+        var videoFrameInlineSpace: CGFloat { get }
+        var verticalVideoMockHeadlineFontSize: CGFloat { get }
+        var videoAdBadgeFontSize: CGFloat { get }
+    }
+
+    /// Size class accessor
+    public enum Sizing {
+        /// Returns sizing tokens for the specified size class
+        public static func current(for sizeClass: SizeClass) -> any VideoSizingTokens {
+            sizeClass == .compact ? Compact.shared : Regular.shared
+        }
+
+        public static var compact: Compact { Compact.shared }
+        public static var regular: Regular { Regular.shared }
+
+        public struct Compact: VideoSizingTokens {
+            public static let shared = Compact()
+            private init() {}
+            public let videoTimeBadgeCornerSize: CGFloat = 2
+            public let videoTimeBadgeFontSize: CGFloat = 16
+            public let videoTimeBadgeSize: CGFloat = 24
+            public let videoRedPlayIconWidthSize: CGFloat = 8
+            public let videoRedPlayIconHeightSize: CGFloat = 10
+            public let videoBadgeTimeLineHeight: CGFloat = 21
+            public let videoSkeletonContainerHeight: CGFloat = 180
+            public let videoFrameInlineSpace: CGFloat = 0
+            public let verticalVideoMockHeadlineFontSize: CGFloat = 22
+            public let videoAdBadgeFontSize: CGFloat = 14
+        }
+
+        public struct Regular: VideoSizingTokens {
+            public static let shared = Regular()
+            private init() {}
+            public let videoTimeBadgeCornerSize: CGFloat = 2
+            public let videoTimeBadgeFontSize: CGFloat = 18
+            public let videoTimeBadgeSize: CGFloat = 40
+            public let videoRedPlayIconWidthSize: CGFloat = 14
+            public let videoRedPlayIconHeightSize: CGFloat = 18
+            public let videoBadgeTimeLineHeight: CGFloat = 23.8
+            public let videoSkeletonContainerHeight: CGFloat = 464
+            public let videoFrameInlineSpace: CGFloat = 16
+            public let verticalVideoMockHeadlineFontSize: CGFloat = 32
+            public let videoAdBadgeFontSize: CGFloat = 16
+        }
+    }
+}

package/dist/ios/brands/bild/components/_DSysDoc/_DSysDocTokens.swift

@@ -0,0 +1,61 @@
+//
+// Do not edit directly, this file was auto-generated.
+//
+// BILD Design System Tokens v1.0.64
+// Generated by Style Dictionary
+//
+// Component: _DSysDoc | Brand: Bild
+// Aggregated component tokens with all modes
+//
+// Copyright (c) 2024 Axel Springer Deutschland GmbH
+//
+
+import SwiftUI
+
+/// _DSysDoc Design Tokens
+///
+/// Usage:
+///   _DSysDocTokens.Colors.light.primaryBgIdle
+///   _DSysDocTokens.Sizing.compact.height
+///   _DSysDocTokens.Density.current(for: theme.density).contentGap
+public enum _DSysDocTokens {
+
+    // MARK: - Colors
+
+    /// Color tokens protocol
+    public protocol _DSysDocColorTokens: Sendable {
+        var dsysDocsLabelTextSurfaceColorPrimaryPrimitiveName: String { get }
+        var dsysDocsLabelTextColorMode: String { get }
+        var dsDocSpacingItemBgColor: Color { get }
+        var dsDocSpacingItemBorderColor: Color { get }
+    }
+
+    /// Color scheme accessor
+    public enum Colors {
+        /// Returns color tokens for the specified theme mode
+        public static func current(isDark: Bool) -> any _DSysDocColorTokens {
+            isDark ? Dark.shared : Light.shared
+        }
+
+        public static var light: Light { Light.shared }
+        public static var dark: Dark { Dark.shared }
+
+        public struct Light: _DSysDocColorTokens {
+            public static let shared = Light()
+            private init() {}
+            public let dsysDocsLabelTextSurfaceColorPrimaryPrimitiveName: String = "BILD100"
+            public let dsysDocsLabelTextColorMode: String = "(Light Mode)"
+            public let dsDocSpacingItemBgColor: Color = Color(hex: 0xDD0000, alpha: 0.10)
+            public let dsDocSpacingItemBorderColor: Color = Color(hex: 0xDD0000, alpha: 0.50)
+        }
+
+        public struct Dark: _DSysDocColorTokens {
+            public static let shared = Dark()
+            private init() {}
+            public let dsysDocsLabelTextSurfaceColorPrimaryPrimitiveName: String = "BILD010"
+            public let dsysDocsLabelTextColorMode: String = "(Dark Mode)"
+            public let dsDocSpacingItemBgColor: Color = Color(hex: 0xFFFFFF, alpha: 0.20)
+            public let dsDocSpacingItemBorderColor: Color = Color(hex: 0xFFFFFF, alpha: 0.80)
+        }
+    }
+}

package/dist/ios/brands/bild/components/_DSysDocs/_DSysDocsTokens.swift

@@ -0,0 +1,82 @@
+//
+// Do not edit directly, this file was auto-generated.
+//
+// BILD Design System Tokens v1.0.64
+// Generated by Style Dictionary
+//
+// Component: _DSysDocs | Brand: Bild
+// Aggregated component tokens with all modes
+//
+// Copyright (c) 2024 Axel Springer Deutschland GmbH
+//
+
+import SwiftUI
+
+/// _DSysDocs Design Tokens
+///
+/// Usage:
+///   _DSysDocsTokens.Colors.light.primaryBgIdle
+///   _DSysDocsTokens.Sizing.compact.height
+///   _DSysDocsTokens.Density.current(for: theme.density).contentGap
+public enum _DSysDocsTokens {
+
+    // MARK: - Sizing
+
+    /// Sizing tokens protocol
+    public protocol _DSysDocsSizingTokens: Sendable {
+        var bildDesignFrameSpace: CGFloat { get }
+        var dsMainContainerSpace: CGFloat { get }
+        var dsysDocsWidthSize: CGFloat { get }
+        var mainContentStageSize: CGFloat { get }
+        var foundationsBannerHeightSize: CGFloat { get }
+        var dsCaptionStackSpace0p5x: CGFloat { get }
+        var dsCaptionStackSpace1x: CGFloat { get }
+        var _1columnMobile: CGFloat { get }
+        var thinBannerVerticalHeightSize: CGFloat { get }
+        var specsFontFamily: String { get }
+        var docHeaderHeightSize: CGFloat { get }
+    }
+
+    /// Size class accessor
+    public enum Sizing {
+        /// Returns sizing tokens for the specified size class
+        public static func current(for sizeClass: SizeClass) -> any _DSysDocsSizingTokens {
+            sizeClass == .compact ? Compact.shared : Regular.shared
+        }
+
+        public static var compact: Compact { Compact.shared }
+        public static var regular: Regular { Regular.shared }
+
+        public struct Compact: _DSysDocsSizingTokens {
+            public static let shared = Compact()
+            private init() {}
+            public let bildDesignFrameSpace: CGFloat = 12
+            public let dsMainContainerSpace: CGFloat = 0
+            public let dsysDocsWidthSize: CGFloat = 750
+            public let mainContentStageSize: CGFloat = 750
+            public let foundationsBannerHeightSize: CGFloat = 80
+            public let dsCaptionStackSpace0p5x: CGFloat = 4
+            public let dsCaptionStackSpace1x: CGFloat = 8
+            public let _1columnMobile: CGFloat = 320
+            public let thinBannerVerticalHeightSize: CGFloat = 558
+            public let specsFontFamily: String = "Gotham"
+            public let docHeaderHeightSize: CGFloat = 144
+        }
+
+        public struct Regular: _DSysDocsSizingTokens {
+            public static let shared = Regular()
+            private init() {}
+            public let bildDesignFrameSpace: CGFloat = 64
+            public let dsMainContainerSpace: CGFloat = 68
+            public let dsysDocsWidthSize: CGFloat = 1440
+            public let mainContentStageSize: CGFloat = 1024
+            public let foundationsBannerHeightSize: CGFloat = 140
+            public let dsCaptionStackSpace0p5x: CGFloat = 8
+            public let dsCaptionStackSpace1x: CGFloat = 16
+            public let _1columnMobile: CGFloat = 656
+            public let thinBannerVerticalHeightSize: CGFloat = 186
+            public let specsFontFamily: String = "Gotham"
+            public let docHeaderHeightSize: CGFloat = 180
+        }
+    }
+}

package/dist/ios/brands/bild/semantic/color/ColorsDark.swift

@@ -0,0 +1,103 @@
+//
+// Do not edit directly, this file was auto-generated.
+//
+// BILD Design System Tokens v1.0.64
+// Generated by Style Dictionary
+//
+// Copyright (c) 2024 Axel Springer Deutschland GmbH
+//
+
+import SwiftUI
+
+/// Dark mode color implementation
+public struct BildDarkColors: BildColorScheme, DesignColorScheme {
+    public static let shared = BildDarkColors()
+    private init() {}
+
+    public let textColorAccentConstant: Color = Color(hex: 0xDD0000)
+    public let textColorPrimary: Color = Color(hex: 0xE9ECEF)
+    public let textColorMuted: Color = Color(hex: 0xCED4DA)
+    public let textColorPrimaryInverse: Color = Color(hex: 0x232629)
+    public let textColorPrimaryConstant: Color = Color(hex: 0x232629)
+    public let textColorSuccessConstant: Color = Color(hex: 0x006E3E)
+    public let textColorPrimaryInverseConstant: Color = Color(hex: 0xE9ECEF)
+    public let textColorSecondary: Color = Color(hex: 0x8C9196)
+    public let textColorAttentionHigh: Color = Color(hex: 0xDD0000)
+    public let textColorAccent: Color = Color(hex: 0xFFFFFF)
+    public let textColorAttentionMedium: Color = Color(hex: 0xFD8227)
+    public let textColorOnDarkSurface: Color = Color(hex: 0xFFFFFF)
+    public let surfaceColorPrimary: Color = Color(hex: 0x232629)
+    public let surfaceColorSecondary: Color = Color(hex: 0x2C3138)
+    public let surfaceColorPrimaryInverse: Color = Color(hex: 0xFFFFFF)
+    public let surfaceColorPrimaryConstantLight: Color = Color(hex: 0xFFFFFF)
+    public let surfaceColorPrimaryConstantDark: Color = Color(hex: 0x232629)
+    public let surfaceColorQuartenary: Color = Color(hex: 0x4B525A)
+    public let surfaceColorSuccess: Color = Color(hex: 0xCEF4E4)
+    public let surfaceColorTertiary: Color = Color(hex: 0x343C41)
+    public let surfaceColorTertiaryGradientStop: Color = Color(hex: 0x343C41, alpha: 0.00)
+    public let surfaceColorTertiaryInverse: Color = Color(hex: 0xE9ECEF)
+    public let surfaceColorPrimaryGradientStop: Color = Color(hex: 0x232629, alpha: 0.00)
+    public let surfaceColorSecondaryGradientStop: Color = Color(hex: 0x2C3138, alpha: 0.00)
+    public let surfaceColorQuartenaryInverse: Color = Color(hex: 0xCED4DA)
+    public let kickerTextColorOnSurface: Color = Color(hex: 0x8C9196)
+    public let headlineColorPrimary: Color = Color(hex: 0xFFFFFF)
+    public let headlineColorWhiteConst: Color = Color(hex: 0xFFFFFF)
+    public let kickerTextColorOnRed: Color = Color(hex: 0xFFFFFF)
+    public let kickerTextColorOnDarkBg: Color = Color(hex: 0xFFFFFF, alpha: 0.80)
+    public let kickerTextColorOnBrightBg: Color = Color(hex: 0x000000, alpha: 0.70)
+    public let colorSecondaryActive: Color = Color(hex: 0xF2F4F5)
+    public let colorPrimaryActive: Color = Color(hex: 0xDD0000)
+    public let colorSecondaryDisabled: Color = Color(hex: 0x4B525A)
+    public let colorPrimaryDisabled: Color = Color(hex: 0x343C41)
+    public let colorSecondaryActiveInverse: Color = Color(hex: 0x232629)
+    public let colorTertiaryActive: Color = Color(hex: 0x00C373)
+    public let colorTertiaryDisabled: Color = Color(hex: 0x666B70)
+    public let borderColorMediumContrast: Color = Color(hex: 0x666B70)
+    public let borderColorLowContrast: Color = Color(hex: 0x4B525A)
+    public let borderColorHighContrast: Color = Color(hex: 0xFFFFFF)
+    public let borderColorLowContrastConstant: Color = Color(hex: 0xE9ECEF)
+    public let borderColorSuccess: Color = Color(hex: 0x00C373)
+    public let borderColorWarning: Color = Color(hex: 0xDD0000)
+    public let borderColorPrimaryDisabled: Color = Color(hex: 0x343C41)
+    public let borderColorSecondaryDisabled: Color = Color(hex: 0x4B525A)
+    public let coreColorPrimary: Color = Color(hex: 0xDD0000)
+    public let coreColorSecondary: Color = Color(hex: 0x232629)
+    public let coreColorTertiary: Color = Color(hex: 0xFFFFFF)
+    public let coreColorSecondaryConstant: Color = Color(hex: 0xFFFFFF)
+    public let coreColorTertiaryConstant: Color = Color(hex: 0x232629)
+    public let iconColorPrimary: Color = Color(hex: 0x8C9196)
+    public let iconColorInverse: Color = Color(hex: 0x4B525A)
+    public let iconColorSecondaryConstant: Color = Color(hex: 0x8C9196)
+    public let iconColorConstantOnDark: Color = Color(hex: 0xF2F4F5)
+    public let iconColorPrimaryConstant: Color = Color(hex: 0x4B525A)
+    public let iconColorSuccess: Color = Color(hex: 0x00C373)
+    public let labelColorPrimary: Color = Color(hex: 0xE9ECEF)
+    public let labelColorSecondary: Color = Color(hex: 0xCED4DA)
+    public let labelColorDisabled: Color = Color(hex: 0x4B525A)
+    public let labelColorPrimaryConstant: Color = Color(hex: 0x232629)
+    public let labelColorPrimaryInverseConstant: Color = Color(hex: 0xE9ECEF)
+    public let labelColorTertiary: Color = Color(hex: 0x8C9196)
+    public let labelColorPrimaryInverse: Color = Color(hex: 0x232629)
+    public let attentionColorHigh: Color = Color(hex: 0xDD0000)
+    public let accentColorPrimary: Color = Color(hex: 0xFFFFFF)
+    public let attentionColorMedium: Color = Color(hex: 0xFD8227)
+    public let attentionColorLow: Color = Color(hex: 0xFFBF00)
+    public let accentColorPrimaryConstant: Color = Color(hex: 0xDD0000)
+    public let attentionColorSuccessPrimary: Color = Color(hex: 0x00C373)
+    public let attentionColorExtraLow: Color = Color(hex: 0x343C41)
+    public let attentionColorSuccessSecondary: Color = Color(hex: 0x006E3E)
+    public let overlayScrimBlack: Color = Color(hex: 0x000000, alpha: 0.70)
+    public let overlayScrimWhite: Color = Color(hex: 0xFFFFFF, alpha: 0.70)
+    public let layerOpacity05: Double = 0.05
+    public let layerOpacity10: Double = 0.1
+    public let layerOpacity20: Double = 0.2
+    public let layerOpacity30: Double = 0.3
+    public let layerOpacity40: Double = 0.4
+    public let layerOpacity50: Double = 0.5
+    public let layerOpacity60: Double = 0.6
+    public let layerOpacity70: Double = 0.7
+    public let layerOpacity80: Double = 0.8
+    public let layerOpacity90: Double = 0.9
+    public let layerOpacity100: Double = 1
+    public let layerOpacity00: Double = 0
+}

package/dist/ios/brands/bild/semantic/color/ColorsLight.swift

@@ -0,0 +1,267 @@
+//
+// Do not edit directly, this file was auto-generated.
+//
+// BILD Design System Tokens v1.0.64
+// Generated by Style Dictionary
+//
+// Copyright (c) 2024 Axel Springer Deutschland GmbH
+//
+
+import SwiftUI
+
+/// Protocol for type-safe color access across Light/Dark modes
+public protocol BildColorScheme: Sendable {
+    /// Applies to text elements requiring fixed brand color usage (e.g., permanent links, brand slogans on constant backgrounds). Behavior: Constant — maintains identical red tone across Light and Dark mode.
+    var textColorAccentConstant: Color { get }
+    /// Main text color used for body copy and all primary textual content. Ensures optimal readability and contrast on standard surfaces. Behavior: Dynamic — switches between dark text on light backgrounds and light text on dark backgrounds.
+    var textColorPrimary: Color { get }
+    /// Muted text tone for subtle information, timestamps, or inactive text elements. Behavior: Dynamic — adjusts between mid-gray in Light mode and lighter gray in Dark mode.
+    var textColorMuted: Color { get }
+    /// Inverse text color used on opposing surfaces (e.g., white text on red or dark backgrounds). Behavior: Dynamic — alternates between light and dark mode.
+    var textColorPrimaryInverse: Color { get }
+    /// Used when primary text color must remain fixed regardless of mode (e.g., on light constant backgrounds). Behavior: Constant — same tone across Light and Dark mode.
+    var textColorPrimaryConstant: Color { get }
+    /// Used for positive or success-related messages (e.g., “Saved”, “Success”, or confirmation text) on success surface colors. Behavior: Constant — green tone remains consistent across both modes.
+    var textColorSuccessConstant: Color { get }
+    /// Fixed inverse tone for text that always appears on dark surfaces (e.g., hero headlines or persistent dark cards). Behavior: Constant — unchanged across modes.
+    var textColorPrimaryInverseConstant: Color { get }
+    /// Secondary text color used for supportive information, subtitles, and less prominent text. Behavior: Dynamic — adapts between neutral tones to maintain proper contrast per theme. In 2025 css it is called figure meta.
+    var textColorSecondary: Color { get }
+    /// Used for strong warnings, errors, or destructive action labels. Behavior: Constant — red color remains unchanged between Light and Dark mode for visibility and recognition.
+    var textColorAttentionHigh: Color { get }
+    /// Accent text color used for links, interactive text, or highlighted key words. Changes from a red in light mode to a white in dark mode.
+    var textColorAccent: Color { get }
+    /// Represents medium attention states, often used in warnings or pending states. Behavior: Constant — same orange tone across Light and Dark mode.
+    var textColorAttentionMedium: Color { get }
+    /// Used for text displayed on dark surfaces to ensure maximum legibility and contrast. Behavior: Constant — always light neutral to guarantee accessibility on dark backgrounds.
+    var textColorOnDarkSurface: Color { get }
+    /// Primary surface color used for main backgrounds and large layout areas (e.g., page background, primary containers). Behavior: Dynamic — adapts between light and dark surface tokens to maintain legibility and hierarchy.
+    var surfaceColorPrimary: Color { get }
+    /// Used for secondary surface layers such as cards, panels, or nested containers that need to differentiate themselves from the primary surface.  Behavior: Dynamic — adapts brightness level based on mode for appropriate depth contrast.
+    var surfaceColorSecondary: Color { get }
+    /// Inverse of the primary surface, used when Light and Dark surfaces are swapped (e.g., inverse cards or elevated sections). Behavior: Dynamic — switches between dark and light values depending on mode.
+    var surfaceColorPrimaryInverse: Color { get }
+    /// A fixed light surface tone used when a consistent light background is required (e.g., light panels within dark layouts). Behavior: Constant — remains the same in both modes.
+    var surfaceColorPrimaryConstantLight: Color { get }
+    /// A fixed dark surface tone used for dark overlays or nested dark sections inside light layouts. Behavior: Constant — identical across Light and Dark mode.
+    var surfaceColorPrimaryConstantDark: Color { get }
+    /// HIghtest elevation surface color, typically used for grouping or background accents to differentiate themselves from all previous surface color options. Uses corresponding light/dark tones for consistent layering.
+    var surfaceColorQuartenary: Color { get }
+    /// Success-related background used for positive notifications, confirmation surfaces, or success banners. Behavior: Constant — remains the same across Light and Dark mode to ensure brand alignment.
+    var surfaceColorSuccess: Color { get }
+    /// Tertiary background layer for inner containers, grouped content, or subtle elevation steps  that need to differentiate themselves from the primary and secondary surfaces. Behavior: Dynamic — switches between light and dark tertiary tones.
+    var surfaceColorTertiary: Color { get }
+    /// Represents tertiary-level gradient background. Currently used on skeletons.
+    var surfaceColorTertiaryGradientStop: Color { get }
+    /// Inverse tertiary background, applied when Light and Dark surfaces are reversed (e.g., dark-on-light cards). Behavior: Dynamic — swaps values between modes for contrast preservation.
+    var surfaceColorTertiaryInverse: Color { get }
+    /// Defines the end stops for primary surface gradients, creating visual depth or elevation. Used next to sliders buttons and slider container edges for fading out content. Behavior: Dynamic — light gradients in Light mode, dark gradients in Dark mode.
+    var surfaceColorPrimaryGradientStop: Color { get }
+    /// Used for secondary surface gradients or subtle depth layers across backgrounds. Behavior: Dynamic — adapts to mode brightness for smooth gradient transitions.
+    var surfaceColorSecondaryGradientStop: Color { get }
+    /// Inverse of the quartenary surface, used for background reversals in mixed-layout areas. Behavior: Dynamic — inverts between dark and light tones depending on mode.
+    var surfaceColorQuartenaryInverse: Color { get }
+    /// Used for kicker text and category labels placed directly on standard surface backgrounds. Behavior: Dynamic — adjusts between red for Light and a neutral tone in Dark modes.
+    var kickerTextColorOnSurface: Color { get }
+    /// Primary color for headings and display typography. Ensures clear hierarchy and optimal readability on main surfaces. Adapds it´s color based on the brand mode for brand recognition. Behavior: Dynamic — dark text in Light mode, light text in Dark mode.
+    var headlineColorPrimary: Color { get }
+    /// Fixed white heading color used on dark or colored backgrounds (e.g., hero sections, banners) that remain constant across modes. Behavior: Constant — remains white in both Light and Dark mode.
+    var headlineColorWhiteConst: Color { get }
+    /// Specialized kicker color for use on red or brand-colored backgrounds (e.g., red kicker bg within teaser cards). Behavior: Constant — remains consistent across light and darkmode.
+    var kickerTextColorOnRed: Color { get }
+    /// Applied to kicker or meta text on dark colored backgrounds to maintain high legibility. Behavior: Constant — always uses semi-transparent white for consistent readability.
+    var kickerTextColorOnDarkBg: Color { get }
+    /// Used for kicker text placed on bright or light colored backgrounds. Ensures balanced contrast without harsh visual dominance. Behavior: Constant — remains semi-transparent black across both modes.
+    var kickerTextColorOnBrightBg: Color { get }
+    /// Defines the active state color for secondary actions (e.g., secondary buttons, tabs, or toggles). Behavior: Dynamic - light gray in Light mode and bright gray in Dark mode to maintain perceptual balance.
+    var colorSecondaryActive: Color { get }
+    /// Used to represent the active or pressed state of primary actions such as tabs or links. Behavior: Constant - identical value across modes for consistent interaction feedback.
+    var colorPrimaryActive: Color { get }
+    /// Used for disabled secondary elements, ensuring reduced visual prominence while maintaining legibility. Behavior: Dynamic - adapts neutral tones based on theme brightness.
+    var colorSecondaryDisabled: Color { get }
+    /// Defines the disabled color for primary components (e.g., disabled primary buttons, inputs). Reduces emphasis and contrast to signal inactivity. Behavior: Dynamic - slightly lighter in Light mode and darker in Dark mode to remain visually accessible.
+    var colorPrimaryDisabled: Color { get }
+    /// Inverse variant of the secondary active state, applied on dark backgrounds or inverse layouts. Behavior: Dynamic - switches between bright and dark tones depending on the background.
+    var colorSecondaryActiveInverse: Color { get }
+    /// Represents active or pressed states for tertiary elements (e.g., link highlights, icons, or subtle interactive surfaces). Behavior: Constant - uses the same green success tone across Light and Dark mode.
+    var colorTertiaryActive: Color { get }
+    /// Represents disabled states for tertiary levels, maintaining subtle visibility without drawing attention. Behavior: Dynamic - adjusts between gray tones for Light and Dark mode consistency.
+    var colorTertiaryDisabled: Color { get }
+    /// Medium-emphasis border color for standard outlines, input fields, or separators that require visible yet non-dominant contrast. Behavior: Dynamic - adjusts to maintain legibility in Light and Dark themes.
+    var borderColorMediumContrast: Color { get }
+    /// Used for subtle dividers and low-emphasis borders in neutral areas (e.g., card outlines, input containers). Dynamic - light gray 093 in Light mode, dark gray 035 in Dark mode.
+    var borderColorLowContrast: Color { get }
+    /// High-emphasis border color for clear delineation between surfaces (e.g., focus rings, high-contrast UI zones). Behavior: Dynamic — light surfaces use a darker neutral, dark surfaces a light neutral tone.
+    var borderColorHighContrast: Color { get }
+    /// Applies to UI elements that must visually remain the same regardless of theme (e.g., brand containers, static illustrations). Identical tone across Light and Dark mode.
+    var borderColorLowContrastConstant: Color { get }
+    /// Used for success states and validation borders (e.g., input success outlines or confirmation frames). Behavior: Constant — same success tone across modes for consistent feedback semantics.
+    var borderColorSuccess: Color { get }
+    /// Defines border color for warning and error-related components, typically used for input validation or caution zones. Behavior: Constant — retains the same red warning tone in both Light and Dark modes.
+    var borderColorWarning: Color { get }
+    /// Applied to disabled states of primary elements (e.g., buttons, inputs) to visually reduce emphasis and indicate inactivity.
+    var borderColorPrimaryDisabled: Color { get }
+    /// Used for secondary component borders in a disabled state (e.g., secondary buttons, inactive input outlines).
+    var borderColorSecondaryDisabled: Color { get }
+    /// Used as the main brand color for key interactive elements such as primary buttons, active states, and prominent highlights. It remains constant across Light and Dark Mode.
+    var coreColorPrimary: Color { get }
+    /// Defines the secondary brand tone. This variable changes across Light and Dark Mode.
+    var coreColorSecondary: Color { get }
+    /// Represents tertiary brand accents. This variable changes across Light and Dark Mode.
+    var coreColorTertiary: Color { get }
+    /// Use this on elements that must maintain the white color even in dark mode.
+    var coreColorSecondaryConstant: Color { get }
+    /// Use this on elements that need to maintain the dark color across themes and color modes.
+    var coreColorTertiaryConstant: Color { get }
+    /// Primary icon color on primary surfaces.
+    var iconColorPrimary: Color { get }
+    /// Inverse icon color for use on contrasting backgrounds (e.g., light icons on dark surfaces or dark icons on bright surfaces). Behavior: Dynamic - switches between light and dark.
+    var iconColorInverse: Color { get }
+    /// Secondary icon tone for less prominent actions or supportive iconography (e.g., secondary buttons, tool icons). Remains unchanged across modes.
+    var iconColorSecondaryConstant: Color { get }
+    /// Used for icons displayed on dark backgrounds that don´t change colors, ensuring sufficient contrast and legibility. Behavior: Constant - always uses a neutral bright value.
+    var iconColorConstantOnDark: Color { get }
+    /// Used for icons that must remain visually consistent regardless of mode (e.g.,  icons that are on surfaces that don't change color). Identical tone in both Light and Dark mode.
+    var iconColorPrimaryConstant: Color { get }
+    /// Represents success or confirmation icons (e.g., checkmarks, completion indicators). Behavior: Constant - same success green tone across Light and Dark mode.
+    var iconColorSuccess: Color { get }
+    /// Primary label color used for labels, badges, or tag text on light backgrounds. Ensures strong readability and visual hierarchy. Behavior: Dynamic — dark neutral in Light mode, light neutral in Dark mode.
+    var labelColorPrimary: Color { get }
+    /// Secondary label tone used for less prominent text such as secondary badges or supporting labels. Behavior: Dynamic — adapts between mid-grays for Light and Dark surfaces.
+    var labelColorSecondary: Color { get }
+    /// Disabled label tone indicating inactive or unavailable states in UI elements. Behavior: Dynamic — lighter gray in Light mode, darker neutral in Dark mode.
+    var labelColorDisabled: Color { get }
+    /// Used when primary label color should remain unchanged across modes in static UI areas. Behavior: Constant — identical tone in both Light and Dark mode.
+    var labelColorPrimaryConstant: Color { get }
+    /// Fixed inverse label tone applied where white or bright text must always appear, regardless of theme. Behavior: Constant — remains bright neutral in both Light and Dark mode.
+    var labelColorPrimaryInverseConstant: Color { get }
+    /// Tertiary label tone for subtle, low-emphasis UI text such as placeholder text or tertiary badges. Behavior: Constant — identical tone across both modes for stable hierarchy.
+    var labelColorTertiary: Color { get }
+    /// Inverse version of the primary label color, used on dark or colored backgrounds. Behavior: Dynamic — switches between light and dark.
+    var labelColorPrimaryInverse: Color { get }
+    /// High-level attention color used for errors, destructive actions, and critical alerts (e.g., delete actions, error states). Remains red in both Light and Dark mode for immediate recognition.
+    var attentionColorHigh: Color { get }
+    /// Primary accent color used to emphasize interactive or highlight elements such as links, selection states, or focus indicators. Adapts in Darkmode to a fully white tone.
+    var accentColorPrimary: Color { get }
+    /// Medium-level attention tone representing stronger caution or intermediate alert states. Commonly applied in warning messages. Constant — identical in both modes.
+    var attentionColorMedium: Color { get }
+    /// Low-level warning or attention tone, typically used for informational or cautionary messages. Same yellow tone across Light and Dark to maintain recognition.
+    var attentionColorLow: Color { get }
+    /// Used for accent highlights that must remain visually consistent across themes (e.g., brand identifiers, logos, or fixed emphasis areas). Color value does not change between Light and Dark mode.
+    var accentColorPrimaryConstant: Color { get }
+    /// Primary success color used to indicate positive states, confirmations, or completed actions (e.g., success banners, icons, or badges). Remains the same across modes to ensure recognizability and consistency.
+    var attentionColorSuccessPrimary: Color { get }
+    /// Very low-contrast background tone used for information or system-neutral surfaces, often for tooltips or quiet information highlights. Dynamic — light neutral in Light mode and dark neutral in Dark mode.
+    var attentionColorExtraLow: Color { get }
+    /// Secondary success tone used for secondary states. Maintains the same color in both Light and Dark mode for clarity.
+    var attentionColorSuccessSecondary: Color { get }
+    /// A semi-transparent black overlay used to dim background content when modals, drawers, or dialogs are active. Identical opacity and tone in both Light and Dark mode to ensure consistent overlay depth.
+    var overlayScrimBlack: Color { get }
+    /// A semi-transparent white overlay used to brighten or fade background layers, often applied behind bottom sheets or temporary panels. Behavior: Constant — same opacity level across modes to preserve uniform layering behavior.
+    var overlayScrimWhite: Color { get }
+    var layerOpacity05: Double { get }
+    var layerOpacity10: Double { get }
+    var layerOpacity20: Double { get }
+    var layerOpacity30: Double { get }
+    var layerOpacity40: Double { get }
+    var layerOpacity50: Double { get }
+    var layerOpacity60: Double { get }
+    var layerOpacity70: Double { get }
+    var layerOpacity80: Double { get }
+    var layerOpacity90: Double { get }
+    var layerOpacity100: Double { get }
+    var layerOpacity00: Double { get }
+}
+
+/// Light mode color implementation
+public struct BildLightColors: BildColorScheme, DesignColorScheme {
+    public static let shared = BildLightColors()
+    private init() {}
+
+    public let textColorAccentConstant: Color = Color(hex: 0xDD0000)
+    public let textColorPrimary: Color = Color(hex: 0x232629)
+    public let textColorMuted: Color = Color(hex: 0x666B70)
+    public let textColorPrimaryInverse: Color = Color(hex: 0xE9ECEF)
+    public let textColorPrimaryConstant: Color = Color(hex: 0x232629)
+    public let textColorSuccessConstant: Color = Color(hex: 0x006E3E)
+    public let textColorPrimaryInverseConstant: Color = Color(hex: 0xE9ECEF)
+    public let textColorSecondary: Color = Color(hex: 0x8C9196)
+    public let textColorAttentionHigh: Color = Color(hex: 0xDD0000)
+    public let textColorAccent: Color = Color(hex: 0xDD0000)
+    public let textColorAttentionMedium: Color = Color(hex: 0xFD8227)
+    public let textColorOnDarkSurface: Color = Color(hex: 0xFFFFFF)
+    public let surfaceColorPrimary: Color = Color(hex: 0xFFFFFF)
+    public let surfaceColorSecondary: Color = Color(hex: 0xF2F4F5)
+    public let surfaceColorPrimaryInverse: Color = Color(hex: 0x232629)
+    public let surfaceColorPrimaryConstantLight: Color = Color(hex: 0xFFFFFF)
+    public let surfaceColorPrimaryConstantDark: Color = Color(hex: 0x232629)
+    public let surfaceColorQuartenary: Color = Color(hex: 0xCED4DA)
+    public let surfaceColorSuccess: Color = Color(hex: 0xCEF4E4)
+    public let surfaceColorTertiary: Color = Color(hex: 0xE9ECEF)
+    public let surfaceColorTertiaryGradientStop: Color = Color(hex: 0xE9ECEF, alpha: 0.00)
+    public let surfaceColorTertiaryInverse: Color = Color(hex: 0x343C41)
+    public let surfaceColorPrimaryGradientStop: Color = Color(hex: 0xFFFFFF, alpha: 0.00)
+    public let surfaceColorSecondaryGradientStop: Color = Color(hex: 0xF2F4F5, alpha: 0.00)
+    public let surfaceColorQuartenaryInverse: Color = Color(hex: 0x4B525A)
+    public let kickerTextColorOnSurface: Color = Color(hex: 0xDD0000)
+    public let headlineColorPrimary: Color = Color(hex: 0x232629)
+    public let headlineColorWhiteConst: Color = Color(hex: 0xFFFFFF)
+    public let kickerTextColorOnRed: Color = Color(hex: 0xFFFFFF)
+    public let kickerTextColorOnDarkBg: Color = Color(hex: 0xFFFFFF, alpha: 0.80)
+    public let kickerTextColorOnBrightBg: Color = Color(hex: 0x000000, alpha: 0.70)
+    public let colorSecondaryActive: Color = Color(hex: 0x232629)
+    public let colorPrimaryActive: Color = Color(hex: 0xDD0000)
+    public let colorSecondaryDisabled: Color = Color(hex: 0xE9ECEF)
+    public let colorPrimaryDisabled: Color = Color(hex: 0xF2F4F5)
+    public let colorSecondaryActiveInverse: Color = Color(hex: 0xF2F4F5)
+    public let colorTertiaryActive: Color = Color(hex: 0x00C373)
+    public let colorTertiaryDisabled: Color = Color(hex: 0x8C9196)
+    public let borderColorMediumContrast: Color = Color(hex: 0xCED4DA)
+    public let borderColorLowContrast: Color = Color(hex: 0xE9ECEF)
+    public let borderColorHighContrast: Color = Color(hex: 0x232629)
+    public let borderColorLowContrastConstant: Color = Color(hex: 0xE9ECEF)
+    public let borderColorSuccess: Color = Color(hex: 0x00C373)
+    public let borderColorWarning: Color = Color(hex: 0xDD0000)
+    public let borderColorPrimaryDisabled: Color = Color(hex: 0xF2F4F5)
+    public let borderColorSecondaryDisabled: Color = Color(hex: 0xE9ECEF)
+    public let coreColorPrimary: Color = Color(hex: 0xDD0000)
+    public let coreColorSecondary: Color = Color(hex: 0xFFFFFF)
+    public let coreColorTertiary: Color = Color(hex: 0x232629)
+    public let coreColorSecondaryConstant: Color = Color(hex: 0xFFFFFF)
+    public let coreColorTertiaryConstant: Color = Color(hex: 0x232629)
+    public let iconColorPrimary: Color = Color(hex: 0x4B525A)
+    public let iconColorInverse: Color = Color(hex: 0xCED4DA)
+    public let iconColorSecondaryConstant: Color = Color(hex: 0x8C9196)
+    public let iconColorConstantOnDark: Color = Color(hex: 0xF2F4F5)
+    public let iconColorPrimaryConstant: Color = Color(hex: 0x4B525A)
+    public let iconColorSuccess: Color = Color(hex: 0x00C373)
+    public let labelColorPrimary: Color = Color(hex: 0x232629)
+    public let labelColorSecondary: Color = Color(hex: 0x4B525A)
+    public let labelColorDisabled: Color = Color(hex: 0xCED4DA)
+    public let labelColorPrimaryConstant: Color = Color(hex: 0x232629)
+    public let labelColorPrimaryInverseConstant: Color = Color(hex: 0xE9ECEF)
+    public let labelColorTertiary: Color = Color(hex: 0x8C9196)
+    public let labelColorPrimaryInverse: Color = Color(hex: 0xE9ECEF)
+    public let attentionColorHigh: Color = Color(hex: 0xDD0000)
+    public let accentColorPrimary: Color = Color(hex: 0xDD0000)
+    public let attentionColorMedium: Color = Color(hex: 0xFD8227)
+    public let attentionColorLow: Color = Color(hex: 0xFFBF00)
+    public let accentColorPrimaryConstant: Color = Color(hex: 0xDD0000)
+    public let attentionColorSuccessPrimary: Color = Color(hex: 0x00C373)
+    public let attentionColorExtraLow: Color = Color(hex: 0xFFFFFF)
+    public let attentionColorSuccessSecondary: Color = Color(hex: 0x006E3E)
+    public let overlayScrimBlack: Color = Color(hex: 0x000000, alpha: 0.70)
+    public let overlayScrimWhite: Color = Color(hex: 0xFFFFFF, alpha: 0.70)
+    public let layerOpacity05: Double = 0.05
+    public let layerOpacity10: Double = 0.1
+    public let layerOpacity20: Double = 0.2
+    public let layerOpacity30: Double = 0.3
+    public let layerOpacity40: Double = 0.4
+    public let layerOpacity50: Double = 0.5
+    public let layerOpacity60: Double = 0.6
+    public let layerOpacity70: Double = 0.7
+    public let layerOpacity80: Double = 0.8
+    public let layerOpacity90: Double = 0.9
+    public let layerOpacity100: Double = 1
+    public let layerOpacity00: Double = 0
+}