@bcc-code/design-tokens 3.0.12 → 3.0.16

package/build/bcc/js/aura-bcc-config.js

@@ -1,1148 +0,0 @@
-/**
- * Do not edit directly, this file was auto-generated.
- */
-
-export default {
-  "font-family": {
-    archivo: "Archivo",
-  },
-  color: {
-    neutral: {
-      0: "#ffffff",
-      100: "#f7f8f9",
-      200: "#f1f2f4",
-      300: "#dcdfe4",
-      400: "#b3b9c4",
-      500: "#8590a2",
-      600: "#758195",
-      700: "#626f86",
-      800: "#44546f",
-      900: "#2c3e5d",
-      1000: "#172b4d",
-      1100: "#091e42",
-    },
-    "neutral-alpha": {
-      "100A": "rgba(9, 30, 77, 0.03)",
-      "200A": "rgba(9, 30, 77, 0.06)",
-      "300A": "rgba(9, 30, 77, 0.14)",
-      "400A": "rgba(9, 30, 77, 0.32)",
-      "500A": "rgba(9, 30, 77, 0.5)",
-    },
-    "dark-neutral": {
-      0: "#161a1d",
-      100: "#101214",
-      200: "#22272b",
-      250: "#282e33",
-      300: "#2c333a",
-      350: "#38414a",
-      400: "#454f59",
-      500: "#596773",
-      600: "#738496",
-      700: "#8c9bab",
-      800: "#9fadbc",
-      900: "#b6c2cf",
-      1000: "#c7d1db",
-      1100: "#dee4ea",
-      "negative-100": "#101214",
-    },
-    "dark-neutral-alpha": {
-      "100A": "rgba(0, 0, 0, 0.24)",
-      "200A": "rgba(188, 214, 240, 0.08)",
-      "250A": "rgba(188, 214, 240, 0.1)",
-      "300A": "rgba(188, 214, 240, 0.16)",
-      "350A": "rgba(188, 214, 240, 0.2)",
-      "400A": "rgba(188, 214, 240, 0.28)",
-      "500A": "rgba(188, 214, 240, 0.5)",
-    },
-    blue: {
-      100: "#f6fbff",
-      200: "#d9ecff",
-      300: "#a6cdfd",
-      400: "#7cabf9",
-      500: "#608ef6",
-      600: "#446add",
-      700: "#274eb5",
-      800: "#273c8f",
-      900: "#212c64",
-      1000: "#091e47",
-    },
-    teal: {
-      100: "#f6fbff",
-      200: "#c3f2f8",
-      300: "#82d3e3",
-      400: "#51b9cf",
-      500: "#1a9eb7",
-      600: "#0b7da1",
-      700: "#005b81",
-      800: "#09486b",
-      900: "#0d324d",
-      1000: "#0c2132",
-    },
-    bcc: {
-      100: "#f0fcfa",
-      200: "#d2eeeb",
-      300: "#a0cec8",
-      400: "#6fb5ad",
-      500: "#3e9f97",
-      600: "#1d7f78",
-      700: "#0c625c",
-      800: "#014d49",
-      900: "#0b3633",
-      1000: "#012320",
-    },
-    green: {
-      100: "#efffed",
-      200: "#cbf3c9",
-      300: "#83d895",
-      400: "#32c180",
-      500: "#1ca673",
-      600: "#09825d",
-      700: "#0c6241",
-      800: "#094c3b",
-      900: "#073734",
-      1000: "#032429",
-    },
-    brown: {
-      100: "#f9faf4",
-      200: "#ece8dc",
-      300: "#d1c5b0",
-      400: "#bea889",
-      500: "#a98c66",
-      600: "#8b6d45",
-      700: "#6e5232",
-      800: "#553d28",
-      900: "#3f2c1e",
-      1000: "#2e1b0f",
-    },
-    yellow: {
-      100: "#fdf8e9",
-      200: "#f8e6a0",
-      300: "#e9c348",
-      400: "#d5a406",
-      500: "#bc870d",
-      600: "#a4670b",
-      700: "#854901",
-      800: "#653805",
-      900: "#4b2c04",
-      1000: "#2d1f00",
-    },
-    orange: {
-      100: "#fffaed",
-      200: "#fee3c1",
-      300: "#f6b981",
-      400: "#f19457",
-      500: "#da772e",
-      600: "#b55919",
-      700: "#943a14",
-      800: "#782612",
-      900: "#5d1712",
-      1000: "#420e0d",
-    },
-    red: {
-      100: "#fff8f3",
-      200: "#fee2dd",
-      300: "#fab6ad",
-      400: "#fa877e",
-      500: "#ed6362",
-      600: "#ca414e",
-      700: "#a42237",
-      800: "#811436",
-      900: "#630d2e",
-      1000: "#440223",
-    },
-    magenta: {
-      100: "#fff8ff",
-      200: "#fce0f8",
-      300: "#f3b4e2",
-      400: "#eb8acf",
-      500: "#de66b0",
-      600: "#be428f",
-      700: "#952e70",
-      800: "#751f57",
-      900: "#5b1043",
-      1000: "#3f0534",
-    },
-    purple: {
-      100: "#f6f9ff",
-      200: "#e3e3fe",
-      300: "#c9c3ec",
-      400: "#afa0e0",
-      500: "#9a82da",
-      600: "#8360c3",
-      700: "#61479c",
-      800: "#493481",
-      900: "#352465",
-      1000: "#1d154d",
-    },
-    Transparent: "rgba(0, 0, 0, 0)",
-  },
-  space: {
-    0: "0rem",
-    25: "0.125rem",
-    50: "0.25rem",
-    75: "0.375rem",
-    100: "0.5rem",
-    150: "0.75rem",
-    200: "1rem",
-    250: "1.25rem",
-    300: "1.5rem",
-    400: "2rem",
-    500: "2.5rem",
-    600: "3rem",
-    800: "4rem",
-    1000: "5rem",
-    negative: {
-      25: "-0.125rem",
-      50: "-0.25rem",
-      75: "-0.375rem",
-      100: "-0.5rem",
-      150: "-0.75rem",
-      200: "-1rem",
-      250: "-1.25rem",
-      300: "-1.5rem",
-      400: "-2rem",
-    },
-  },
-  "border-radius": {
-    none: "0",
-    xs: "0.125rem",
-    sm: "0.25rem",
-    md: "0.5rem",
-    lg: "1rem",
-    xl: "1.5rem",
-    "2xl": "2rem",
-    "3xl": "3rem",
-    full: "999px",
-  },
-  "icon-size": {
-    xs: "1rem",
-    sm: "1.25rem",
-    md: "1.5rem",
-    lg: "2rem",
-    xl: "3rem",
-  },
-  "border-width": {
-    0: "0",
-    1: "1px",
-    2: "2px",
-  },
-  "font-weight": {
-    regular: 400,
-    medium: 500,
-    bold: 700,
-  },
-  "line-height": {
-    1: "12px",
-    2: "16px",
-    3: "20px",
-    4: "24px",
-    5: "28px",
-    6: "32px",
-    7: "36px",
-    8: "40px",
-    9: "52px",
-    10: "64px",
-    none: 1,
-  },
-  "font-size": {
-    xs: "0.75rem",
-    sm: "0.875rem",
-    md: "1rem",
-    lg: "1.25rem",
-    xl: "1.5rem",
-    "2xl": "2em",
-    "3xl": "2.25rem",
-    "4xl": "3rem",
-  },
-  "aura/primitive": {
-    border: {
-      radius: {
-        none: "0",
-        xs: "2px",
-        sm: "4px",
-        md: "6px",
-        lg: "8px",
-        xl: "12px",
-      },
-    },
-    emerald: {
-      50: "#f0fcfa",
-      100: "#d2eeeb",
-      200: "#a0cec8",
-      300: "#6fb5ad",
-      400: "#3e9f97",
-      500: "#1d7f78",
-      600: "#0c625c",
-      700: "#014d49",
-      800: "#0b3633",
-      900: "#012320",
-      950: "#012320",
-    },
-    green: {
-      50: "#efffed",
-      100: "#cbf3c9",
-      200: "#83d895",
-      300: "#32c180",
-      400: "#1ca673",
-      500: "#09825d",
-      600: "#0c6241",
-      700: "#094c3b",
-      800: "#073734",
-      900: "#032429",
-      950: "#032429",
-    },
-    lime: {
-      50: "#f7fee7",
-      100: "#ecfccb",
-      200: "#d9f99d",
-      300: "#bef264",
-      400: "#a3e635",
-      500: "#84cc16",
-      600: "#65a30d",
-      700: "#4d7c0f",
-      800: "#3f6212",
-      900: "#365314",
-      950: "#1a2e05",
-    },
-    red: {
-      50: "#fff8f3",
-      100: "#fee2dd",
-      200: "#fab6ad",
-      300: "#fa877e",
-      400: "#ed6362",
-      500: "#ca414e",
-      600: "#a42237",
-      700: "#811436",
-      800: "#630d2e",
-      900: "#440223",
-      950: "#440223",
-    },
-    orange: {
-      50: "#fffaed",
-      100: "#fee3c1",
-      200: "#f6b981",
-      300: "#f19457",
-      400: "#da772e",
-      500: "#b55919",
-      600: "#943a14",
-      700: "#782612",
-      800: "#5d1712",
-      900: "#420e0d",
-      950: "#420e0d",
-    },
-    amber: {
-      50: "#fffbeb",
-      100: "#fef3c7",
-      200: "#fde68a",
-      300: "#fcd34d",
-      400: "#fbbf24",
-      500: "#f59e0b",
-      600: "#d97706",
-      700: "#b45309",
-      800: "#92400e",
-      900: "#78350f",
-      950: "#451a03",
-    },
-    yellow: {
-      50: "#fdf8e9",
-      100: "#f8e6a0",
-      200: "#e9c348",
-      300: "#d5a406",
-      400: "#bc870d",
-      500: "#a4670b",
-      600: "#854901",
-      700: "#653805",
-      800: "#4b2c04",
-      900: "#2d1f00",
-      950: "#2d1f00",
-    },
-    teal: {
-      50: "#f6fbff",
-      100: "#c3f2f8",
-      200: "#82d3e3",
-      300: "#51b9cf",
-      400: "#1a9eb7",
-      500: "#0b7da1",
-      600: "#005b81",
-      700: "#09486b",
-      800: "#0d324d",
-      900: "#0c2132",
-      950: "#0c2132",
-    },
-    cyan: {
-      50: "#ecfeff",
-      100: "#cffafe",
-      200: "#a5f3fc",
-      300: "#67e8f9",
-      400: "#22d3ee",
-      500: "#06b6d4",
-      600: "#0891b2",
-      700: "#0e7490",
-      800: "#155e75",
-      900: "#164e63",
-      950: "#083344",
-    },
-    sky: {
-      50: "#f6fbff",
-      100: "#d9ecff",
-      200: "#a6cdfd",
-      300: "#7cabf9",
-      400: "#608ef6",
-      500: "#446add",
-      600: "#274eb5",
-      700: "#273c8f",
-      800: "#212c64",
-      900: "#091e47",
-      950: "#091e47",
-    },
-    blue: {
-      50: "#f6fbff",
-      100: "#d9ecff",
-      200: "#a6cdfd",
-      300: "#7cabf9",
-      400: "#608ef6",
-      500: "#446add",
-      600: "#274eb5",
-      700: "#273c8f",
-      800: "#212c64",
-      900: "#091e47",
-      950: "#091e47",
-    },
-    indigo: {
-      50: "#eef2ff",
-      100: "#e0e7ff",
-      200: "#c7d2fe",
-      300: "#a5b4fc",
-      400: "#818cf8",
-      500: "#6366f1",
-      600: "#4f46e5",
-      700: "#4338ca",
-      800: "#3730a3",
-      900: "#312e81",
-      950: "#1e1b4b",
-    },
-    violet: {
-      50: "#f5f3ff",
-      100: "#ede9fe",
-      200: "#ddd6fe",
-      300: "#c4b5fd",
-      400: "#a78bfa",
-      500: "#8b5cf6",
-      600: "#7c3aed",
-      700: "#6d28d9",
-      800: "#5b21b6",
-      900: "#4c1d95",
-      950: "#2e1065",
-    },
-    purple: {
-      50: "#f6f9ff",
-      100: "#e3e3fe",
-      200: "#c9c3ec",
-      300: "#afa0e0",
-      400: "#9a82da",
-      500: "#8360c3",
-      600: "#61479c",
-      700: "#493481",
-      800: "#352465",
-      900: "#1d154d",
-      950: "#1d154d",
-    },
-    fuchsia: {
-      50: "#fdf4ff",
-      100: "#fae8ff",
-      200: "#f5d0fe",
-      300: "#f0abfc",
-      400: "#e879f9",
-      500: "#d946ef",
-      600: "#c026d3",
-      700: "#a21caf",
-      800: "#86198f",
-      900: "#701a75",
-      950: "#4a044e",
-    },
-    pink: {
-      50: "#fff8ff",
-      100: "#fce0f8",
-      200: "#f3b4e2",
-      300: "#eb8acf",
-      400: "#de66b0",
-      500: "#be428f",
-      600: "#952e70",
-      700: "#751f57",
-      800: "#5b1043",
-      900: "#3f0534",
-      950: "#3f0534",
-    },
-    rose: {
-      50: "#fff1f2",
-      100: "#ffe4e6",
-      200: "#fecdd3",
-      300: "#fda4af",
-      400: "#fb7185",
-      500: "#f43f5e",
-      600: "#e11d48",
-      700: "#be123c",
-      800: "#9f1239",
-      900: "#881337",
-      950: "#4c0519",
-    },
-    slate: {
-      50: "#f7f8f9",
-      100: "#f1f2f4",
-      200: "#dcdfe4",
-      300: "#b3b9c4",
-      400: "#8590a2",
-      500: "#758195",
-      600: "#626f86",
-      700: "#44546f",
-      800: "#2c3e5d",
-      900: "#172b4d",
-      950: "#091e42",
-    },
-    gray: {
-      50: "#f9fafb",
-      100: "#f3f4f6",
-      200: "#e5e7eb",
-      300: "#d1d5db",
-      400: "#9ca3af",
-      500: "#6b7280",
-      600: "#4b5563",
-      700: "#374151",
-      800: "#1f2937",
-      900: "#111827",
-      950: "#030712",
-    },
-    zinc: {
-      50: "#dee4ea",
-      100: "#c7d1db",
-      200: "#b6c2cf",
-      300: "#9fadbc",
-      400: "#8c9bab",
-      500: "#738496",
-      600: "#596773",
-      700: "#454f59",
-      800: "#2c333a",
-      900: "#22272b",
-      950: "#101214",
-    },
-    neutral: {
-      50: "#fafafa",
-      100: "#f5f5f5",
-      200: "#e5e5e5",
-      300: "#d4d4d4",
-      400: "#a3a3a3",
-      500: "#737373",
-      600: "#525252",
-      700: "#404040",
-      800: "#262626",
-      900: "#171717",
-      950: "#0a0a0a",
-    },
-    stone: {
-      50: "#fafaf9",
-      100: "#f5f5f4",
-      200: "#e7e5e4",
-      300: "#d6d3d1",
-      400: "#a8a29e",
-      500: "#78716c",
-      600: "#57534e",
-      700: "#44403c",
-      800: "#292524",
-      900: "#1c1917",
-      950: "#0c0a09",
-    },
-    space: {
-      0: "0px",
-      25: "2px",
-      50: "4px",
-      75: "6px",
-      100: "8px",
-      150: "12px",
-      200: "16px",
-      250: "20px",
-      300: "24px",
-      400: "32px",
-      500: "40px",
-      600: "48px",
-      800: "64px",
-      1000: "80px",
-    },
-  },
-  "aura/semantic": {
-    primary: {
-      50: "#f0fcfa",
-      100: "#d2eeeb",
-      200: "#a0cec8",
-      300: "#6fb5ad",
-      400: "#3e9f97",
-      500: "#1d7f78",
-      600: "#0c625c",
-      700: "#014d49",
-      800: "#0b3633",
-      900: "#012320",
-      950: "#012320",
-    },
-    anchor: {
-      gutter: "2px",
-    },
-    icon: {
-      size: "1rem",
-    },
-    disabled: {
-      opacity: "0.6",
-    },
-    form: {
-      field: {
-        padding: {
-          x: "0.75rem",
-          y: "0.5rem",
-        },
-        border: {
-          radius: "6px",
-        },
-        focus: {
-          ring: {
-            width: "0",
-            style: "none",
-            color: "rgba(0, 0, 0, 0)",
-            offset: "0",
-            shadow: "0 0 0 0 rgba(0, 0, 0, 0)",
-          },
-        },
-        sm: {
-          font: {
-            size: "0.875rem",
-          },
-          padding: {
-            x: "0.625rem",
-            y: "0.375rem",
-          },
-        },
-        lg: {
-          font: {
-            size: "1.125rem",
-          },
-          padding: {
-            x: "0.875rem",
-            y: "0.625rem",
-          },
-        },
-        transition: {
-          duration: "150ms",
-        },
-      },
-    },
-    content: {
-      border: {
-        radius: "6px",
-      },
-    },
-    focus: {
-      ring: {
-        width: "1px",
-        color: "#1d7f78",
-        offset: "2px",
-        shadow: "0 0 0 0 rgba(0, 0, 0, 0)",
-        stroke: "3px solid #1d7f78",
-        style: "solid",
-      },
-    },
-    list: {
-      padding: "0.25rem 0.25rem",
-      gap: "2px",
-      header: {
-        padding: "0.5rem 0.75rem 0.25rem 0.75rem",
-      },
-      option: {
-        padding: "0.5rem 0.75rem",
-        border: {
-          radius: "4px",
-        },
-        group: {
-          padding: "0.5rem 0.75rem",
-          font: {
-            weight: "600",
-          },
-        },
-      },
-    },
-    navigation: {
-      list: {
-        padding: "0.25rem 0.25rem",
-        gap: "2px",
-      },
-      item: {
-        padding: "0.5rem 0.75rem",
-        border: {
-          radius: "4px",
-        },
-        gap: "0.5rem",
-      },
-      submenu: {
-        label: {
-          padding: "0.5rem 0.75rem",
-          font: {
-            weight: "600",
-          },
-        },
-        icon: {
-          size: "0.875rem",
-        },
-      },
-    },
-    overlay: {
-      select: {
-        border: {
-          radius: "6px",
-        },
-        shadow:
-          "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)",
-      },
-      popover: {
-        border: {
-          radius: "6px",
-        },
-        padding: "0.75rem",
-        shadow:
-          "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)",
-      },
-      modal: {
-        border: {
-          radius: "12px",
-        },
-        padding: "1.25rem",
-        shadow:
-          "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1)",
-      },
-      navigation: {
-        shadow:
-          "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1)",
-      },
-    },
-    transition: {
-      duration: "0.2s",
-    },
-  },
-  "aura/semantic/light": {
-    surface: {
-      0: "#ffffff",
-      50: "#f7f8f9",
-      100: "#f1f2f4",
-      200: "#dcdfe4",
-      300: "#b3b9c4",
-      400: "#8590a2",
-      500: "#758195",
-      600: "#626f86",
-      700: "#44546f",
-      800: "#2c3e5d",
-      900: "#172b4d",
-      950: "#091e42",
-    },
-    primary: {
-      color: "#1d7f78",
-      contrast: {
-        color: "#ffffff",
-      },
-      hover: {
-        color: "#0c625c",
-      },
-      active: {
-        color: "#014d49",
-      },
-    },
-    highlight: {
-      background: "#f0fcfa",
-      focus: {
-        background: "#d2eeeb",
-        color: "#0b3633",
-      },
-      color: "#014d49",
-    },
-    mask: {
-      background: "rgba(0, 0, 0, 0.4)",
-      color: "#dcdfe4",
-    },
-    form: {
-      field: {
-        background: "#ffffff",
-        disabled: {
-          background: "#dcdfe4",
-          color: "#758195",
-        },
-        filled: {
-          background: "#f7f8f9",
-          focus: {
-            background: "#f7f8f9",
-          },
-          hover: {
-            background: "#f7f8f9",
-          },
-        },
-        border: {
-          color: "#b3b9c4",
-        },
-        hover: {
-          border: {
-            color: "#8590a2",
-          },
-        },
-        focus: {
-          border: {
-            color: "#1d7f78",
-          },
-        },
-        invalid: {
-          border: {
-            color: "#ed6362",
-          },
-          placeholder: {
-            color: "#a42237",
-          },
-        },
-        placeholder: {
-          color: "#758195",
-        },
-        float: {
-          label: {
-            color: "#758195",
-            focus: {
-              color: "#758195",
-            },
-            invalid: {
-              color: "#a42237",
-            },
-            active: {
-              color: "#758195",
-            },
-          },
-        },
-        icon: {
-          color: "#8590a2",
-        },
-        shadow: "0 1px 2px 0 rgba(18, 18, 23, 0.05)",
-        color: "#44546f",
-      },
-    },
-    content: {
-      background: "#ffffff",
-      hover: {
-        background: "#f1f2f4",
-        color: "#2c3e5d",
-      },
-      border: {
-        color: "#dcdfe4",
-      },
-      color: "#44546f",
-    },
-    text: {
-      color: "#44546f",
-      hover: {
-        color: "#2c3e5d",
-        muted: {
-          color: "#626f86",
-        },
-      },
-      muted: {
-        color: "#758195",
-      },
-    },
-    overlay: {
-      select: {
-        background: "#ffffff",
-        border: {
-          color: "#dcdfe4",
-        },
-        color: "#44546f",
-      },
-      popover: {
-        background: "#ffffff",
-        border: {
-          color: "#dcdfe4",
-        },
-        color: "#44546f",
-      },
-      modal: {
-        background: "#ffffff",
-        border: {
-          color: "#dcdfe4",
-        },
-        color: "#44546f",
-      },
-    },
-    list: {
-      option: {
-        focus: {
-          background: "#f1f2f4",
-          color: "#2c3e5d",
-        },
-        selected: {
-          background: "#f0fcfa",
-          focus: {
-            background: "#d2eeeb",
-            color: "#0b3633",
-          },
-          color: "#014d49",
-        },
-        color: "#44546f",
-        icon: {
-          color: "#8590a2",
-          focus: {
-            color: "#758195",
-          },
-        },
-        group: {
-          background: "rgba(0, 0, 0, 0)",
-          color: "#758195",
-        },
-      },
-    },
-    navigation: {
-      item: {
-        focus: {
-          background: "#f1f2f4",
-          color: "#2c3e5d",
-        },
-        active: {
-          background: "#f1f2f4",
-          color: "#2c3e5d",
-        },
-        color: "#44546f",
-        icon: {
-          color: "#8590a2",
-          focus: {
-            color: "#758195",
-          },
-          active: {
-            color: "#758195",
-          },
-        },
-      },
-      submenu: {
-        label: {
-          background: "rgba(0, 0, 0, 0)",
-          color: "#758195",
-        },
-        icon: {
-          color: "#8590a2",
-          focus: {
-            color: "#758195",
-          },
-          active: {
-            color: "#758195",
-          },
-        },
-      },
-    },
-  },
-  "aura/semantic/dark": {
-    surface: {
-      0: "#ffffff",
-      50: "#dee4ea",
-      100: "#c7d1db",
-      200: "#b6c2cf",
-      300: "#9fadbc",
-      400: "#8c9bab",
-      500: "#738496",
-      600: "#596773",
-      700: "#454f59",
-      800: "#2c333a",
-      900: "#22272b",
-      950: "#101214",
-    },
-    primary: {
-      color: "#3e9f97",
-      contrast: {
-        color: "#22272b",
-      },
-      hover: {
-        color: "#6fb5ad",
-      },
-      active: {
-        color: "#a0cec8",
-      },
-    },
-    highlight: {
-      background: "rgb(24.314% 62.353% 59.216% / 0.16)",
-      focus: {
-        background: "rgb(24.314% 62.353% 59.216% / 0.24)",
-        color: "rgba(255, 255, 255, 0.87)",
-      },
-      color: "rgba(255, 255, 255, 0.87)",
-    },
-    mask: {
-      background: "rgba(0, 0, 0, 0.6)",
-      color: "#b6c2cf",
-    },
-    form: {
-      field: {
-        background: "#101214",
-        disabled: {
-          background: "#454f59",
-          color: "#8c9bab",
-        },
-        filled: {
-          background: "#2c333a",
-          focus: {
-            background: "#2c333a",
-          },
-          hover: {
-            background: "#2c333a",
-          },
-        },
-        border: {
-          color: "#596773",
-        },
-        hover: {
-          border: {
-            color: "#738496",
-          },
-        },
-        focus: {
-          border: {
-            color: "#1d7f78",
-          },
-        },
-        invalid: {
-          border: {
-            color: "#fa877e",
-          },
-          placeholder: {
-            color: "#ed6362",
-          },
-        },
-        placeholder: {
-          color: "#8c9bab",
-        },
-        float: {
-          label: {
-            color: "#8c9bab",
-            focus: {
-              color: "#8c9bab",
-            },
-            invalid: {
-              color: "#ed6362",
-            },
-            active: {
-              color: "#8c9bab",
-            },
-          },
-        },
-        icon: {
-          color: "#8c9bab",
-        },
-        shadow: "0 1px 2px 0 rgba(18, 18, 23, 0.05)",
-        color: "#ffffff",
-      },
-    },
-    content: {
-      background: "#22272b",
-      hover: {
-        background: "#2c333a",
-        color: "#ffffff",
-      },
-      border: {
-        color: "#454f59",
-      },
-      color: "#ffffff",
-    },
-    text: {
-      color: "#ffffff",
-      hover: {
-        color: "#ffffff",
-        muted: {
-          color: "#9fadbc",
-        },
-      },
-      muted: {
-        color: "#8c9bab",
-      },
-    },
-    overlay: {
-      select: {
-        background: "#22272b",
-        border: {
-          color: "#454f59",
-        },
-        color: "#ffffff",
-      },
-      popover: {
-        background: "#22272b",
-        border: {
-          color: "#454f59",
-        },
-        color: "#ffffff",
-      },
-      modal: {
-        background: "#22272b",
-        border: {
-          color: "#454f59",
-        },
-        color: "#ffffff",
-      },
-    },
-    list: {
-      option: {
-        focus: {
-          background: "#2c333a",
-          color: "#ffffff",
-        },
-        selected: {
-          background: "rgb(24.314% 62.353% 59.216% / 0.16)",
-          focus: {
-            background: "rgb(24.314% 62.353% 59.216% / 0.24)",
-            color: "rgba(255, 255, 255, 0.87)",
-          },
-          color: "rgba(255, 255, 255, 0.87)",
-        },
-        color: "#ffffff",
-        icon: {
-          color: "#738496",
-          focus: {
-            color: "#8c9bab",
-          },
-        },
-        group: {
-          background: "rgba(0, 0, 0, 0)",
-          color: "#8c9bab",
-        },
-      },
-    },
-    navigation: {
-      item: {
-        focus: {
-          background: "#2c333a",
-          color: "#ffffff",
-        },
-        active: {
-          background: "#2c333a",
-          color: "#ffffff",
-        },
-        color: "#ffffff",
-        icon: {
-          color: "#738496",
-          focus: {
-            color: "#8c9bab",
-          },
-          active: {
-            color: "#8c9bab",
-          },
-        },
-      },
-      submenu: {
-        label: {
-          background: "rgba(0, 0, 0, 0)",
-          color: "#8c9bab",
-        },
-        icon: {
-          color: "#738496",
-          focus: {
-            color: "#8c9bab",
-          },
-          active: {
-            color: "#8c9bab",
-          },
-        },
-      },
-    },
-  },
-};