@activecollab/components 2.0.401 → 2.0.403

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"GlobalStyle.js","names":["createGlobalStyle","DARK_THEME_MATCH","GlobalStyle"],"sources":["../../../src/components/GlobalStyle.ts"],"sourcesContent":["import { createGlobalStyle } from \"styled-components\";\n\nimport { DARK_THEME_MATCH } from \"../utils/themes\";\n\nexport const GlobalStyle = createGlobalStyle`\n :root {\n --color-primary: #5d2bff;\n --color-secondary: #5d2bff;\n\n --color-theme-100: #ffffff;\n --color-theme-200: #f6f6f9;\n --color-theme-300: #ebebee;\n --color-theme-400: #d7d7da;\n --color-theme-500: #b9b9bd;\n --color-theme-600: #89898e;\n --color-theme-700: #6d6d73;\n --color-theme-800: #5b5b61;\n --color-theme-900: #303037;\n\n --color-primary-200: rgba(93, 43, 255, 0.05);\n --color-primary-300: rgba(93, 43, 255, 0.1);\n --color-primary-400: rgba(93, 43, 255, 0.25);\n --color-primary-500: rgba(93, 43, 255, 0.5);\n --color-primary-600: rgba(93, 43, 255, 0.75);\n --color-primary-700: #5d2bff;\n --color-primary-800: #4a21cd;\n --color-primary-900: #32178b;\n\n --color-secondary-200: rgba(93, 43, 255, 0.05);\n --color-secondary-300: rgba(93, 43, 255, 0.1);\n --color-secondary-400: rgba(93, 43, 255, 0.25);\n --color-secondary-500: rgba(93, 43, 255, 0.5);\n --color-secondary-600: rgba(93, 43, 255, 0.75);\n --color-secondary-700: #5d2bff;\n --color-secondary-800: #4a21cd;\n --color-secondary-900: #32178b;\n\n --color-theme-transparent-200: rgba(36,36,76,0.04);\n --color-theme-transparent-300: rgba(48,48,55,0.1);\n --color-theme-transparent-400: rgba(48,48,55,0.2);\n --color-theme-transparent-500: rgba(48,48,55,0.34);\n --color-theme-transparent-600: rgba(48,48,55,0.57);\n --color-theme-transparent-700: rgba(48,48,55,0.7);\n --color-theme-transparent-800: rgba(48,48,55,0.8);\n\n --color-primary-opaque-300: #efeaff;\n --color-primary-opaque-400: #d6caff;\n\n --color-secondary-opaque-300: #efeaff;\n --color-secondary-opaque-400: #d6caff;\n\n --color-sucess-green: #64cd93;\n --color-pale-green: #c3e799;\n --color-progress-blue: #4182f2;\n\n --color-yellow: #FDF196;\n --color-yellow-darker: #948D5D;\n --color-yellow-lighter: #EBD429;\n --color-orange: #FBBB75;\n --color-orange-darker: #916C43;\n --color-orange-lighter: #E99841;\n --color-beige: #EAC2AD;\n --color-beige-darker: #877064;\n --color-beige-lighter: #B98A72;\n --color-pink: #FBD6E7;\n --color-pink-darker: #917C86;\n --color-pink-lighter: #E4A1C0;\n --color-coral: #FF9C9C;\n --color-coral-darker: #945A5A;\n --color-coral-lighter: #DB4545;\n --color-purple-dirty: #C49CB6;\n --color-purple-dirty-darker: #715A69;\n --color-purple-dirty-lighter: #B16E9A;\n --color-purple: #BEACF9;\n --color-purple-darker: #6E6390;\n --color-purple-lighter: #9B86DF;\n --color-blue-aqua: #BDF7FD;\n --color-blue-aqua-darker: #6D8F92;\n --color-blue-aqua-lighter: #7BDDE7;\n --color-blue-pale: #BEEAFF;\n --color-blue-pale-darker: #6E8794;\n --color-blue-pale-lighter: #92BFD4;\n --color-blue-sky: #A0CBFD;\n --color-blue-sky-darker: #5C7592;\n --color-blue-sky-lighter: #568CCB;\n --color-turquoise: #B9E4E0;\n --color-turquoise-darker: #6B8482;\n --color-turquoise-lighter: #70BFB8;\n --color-green-pale: #C3E799;\n --color-green-pale-darker: #718658;\n --color-green-pale-lighter: #80C333;\n --color-green-olive-drab: #98B57C;\n --color-green-olive-drab-darker: #647157;\n --color-green-olive-drab-lighter: #819F65;\n --color-gray-silver: #DDDDDD;\n --color-gray-silver-darker: #808080;\n --color-gray-silver-lighter: #ACACAC;\n --color-gray: #CACACA;\n --color-gray-darker: #757575;\n --color-gray-lighter: #7D7D7D;\n\n --body-bg-main: rgb(244, 245, 247);\n --body-bg-main-transparent: rgba(244, 245, 247, 0);\n --page-paper-main: #ffffff;\n --border-primary: #d7d7da;\n --selectable: #d7d7da;\n --selectable-active: #3b82f6;\n\n --note-bg: #fff9f1;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.06), 0 16px 16px 0 rgba(0, 0, 0, 0.04),\n 0 4px 4px 0 rgba(0, 0, 0, 0.04), 0 2px 2px 0 rgba(0, 0, 0, 0.04);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.06),\n 0 32px 32px 0 rgba(0, 0, 0, 0.03), 0 16px 16px 0 rgba(0, 0, 0, 0.02),\n 0 4px 4px 0 rgba(0, 0, 0, 0.02), 0 2px 2px 0 rgba(0, 0, 0, 0.02);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.17);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.05),\n 0 10px 15px -3px rgba(0, 0, 0, 0.1);\n --shadow-tertiary-hover: 0 4px 10px -2px rgba(0, 0, 0, 0.1),\n 0 12px 20px -3px rgba(0, 0, 0, 0.2);\n\n --page-paper-main-shadow: rgba(\n 255,\n 255,\n 255,\n 0\n ); /* Shadow list shadow for page paper main */\n\n --modal-background: rgba(244, 245, 247, 0.6);\n\n --highlight-dark: rgba(0, 0, 0, 0.03);\n\n --input-background-color: #ffffff;\n\n /* Consumed by app LESS under the dark-theme selector; every theme must define them so a dark\n theme never inherits another theme's chrome. */\n --color-primary-100: rgba(93, 43, 255, 0.03);\n --color-primary-opaque-200: #f7f4ff;\n --muted-text: #6d6d73;\n --alert-surface: rgba(243, 24, 72, 0.12);\n --muted-surface: #d7d7da;\n --muted-surface-text: #303037;\n --stripe-pattern: #e6e6e9;\n --drop-overlay-bg: rgba(255, 255, 255, 0.93);\n\n --ai-gradient: linear-gradient(135deg, #4da2ed, #9f69e5, #ec43d8, #f72222);\n \n --ai-gradient-lighter: linear-gradient(\n 135deg,\n rgba(77, 162, 237, 0.1),\n rgba(159, 105, 229, 0.1),\n rgba(236, 67, 216, 0.1),\n rgba(230, 10, 10, 0.1)\n );\n\n --red-alert: rgb(237, 97, 97);\n\n --warning: #ffcc6b;\n\n --only-white: #ffffff;\n\n --only-black: #000000;\n\n --ac-br-4: 4px;\n\n --ac-br-6: 6px;\n\n --ac-br-8: 8px;\n\n --ac-br-rounded: 999px;\n }\n\n .cupcake {\n --color-primary: #29bcdd;\n --color-secondary: #fe6fa7;\n\n --color-primary-200: rgba(41, 188, 221, 0.07);\n --color-primary-300: rgba(41, 188, 221, 0.12);\n --color-primary-400: rgba(41, 188, 221, 0.26);\n --color-primary-500: rgba(41, 188, 221, 0.52);\n --color-primary-600: rgba(41, 188, 221, 0.75);\n --color-primary-700: #29bcdd;\n --color-primary-800: #219fbb;\n --color-primary-900: #1a768b;\n\n --color-secondary-200: rgba(254, 111, 167, 0.07);\n --color-secondary-300: rgba(254, 111, 167, 0.13);\n --color-secondary-400: rgba(254, 111, 167, 0.27);\n --color-secondary-500: rgba(254, 111, 167, 0.52);\n --color-secondary-600: rgba(254, 111, 167, 0.75);\n --color-secondary-700: #fe6fa7;\n --color-secondary-800: #dd6091;\n --color-secondary-900: #ab496f;\n\n --color-primary-opaque-300: #e5f7fb;\n --color-primary-opaque-400: #c8eef6;\n\n --color-secondary-opaque-300: #ffecf4;\n --color-secondary-opaque-400: #ffd8e7;\n\n --color-primary-100: rgba(41, 188, 221, 0.04);\n --color-primary-opaque-200: #f0fafc;\n }\n\n .classic {\n --color-primary: #4182f2;\n --color-secondary: #4182f2;\n\n --color-primary-200: rgba(65, 130, 242, 0.07);\n --color-primary-300: rgba(65, 130, 242, 0.13);\n --color-primary-400: rgba(65, 130, 242, 0.26);\n --color-primary-500: rgba(65, 130, 242, 0.52);\n --color-primary-600: rgba(65, 130, 242, 0.75);\n --color-primary-700: #4182f2;\n --color-primary-800: #356bc8;\n --color-primary-900: #244a8a;\n\n --color-secondary-200: rgba(65, 130, 242, 0.07);\n --color-secondary-300: rgba(65, 130, 242, 0.13);\n --color-secondary-400: rgba(65, 130, 242, 0.26);\n --color-secondary-500: rgba(65, 130, 242, 0.52);\n --color-secondary-600: rgba(65, 130, 242, 0.75);\n --color-secondary-700: #4182f2;\n --color-secondary-800: #356bc8;\n --color-secondary-900: #244a8a;\n\n --color-primary-opaque-300: #e6effd;\n --color-primary-opaque-400: #cedffc;\n\n --color-secondary-opaque-300: #e6effd;\n --color-secondary-opaque-400: #cedffc;\n\n --color-primary-100: rgba(65, 130, 242, 0.04);\n --color-primary-opaque-200: #f2f6fe;\n }\n\n .neon {\n --color-primary: #67ffc8;\n --color-secondary: #67ffc8;\n\n --color-theme-100: #000000;\n --color-theme-200: #292b34;\n --color-theme-300: #23252d;\n --color-theme-400: #17171a;\n --color-theme-500: #6D6D73;\n --color-theme-600: #89898e;\n --color-theme-700: #b0b0b5;\n --color-theme-800: #dfdfe5;\n --color-theme-900: #ffffff;\n\n --color-primary-200: rgba(103, 255, 200, 0.05);\n --color-primary-300: rgba(103, 255, 200, 0.1);\n --color-primary-400: rgba(103, 255, 200, 0.25);\n --color-primary-500: rgba(103, 255, 200, 0.5);\n --color-primary-600: rgba(103, 255, 200, 0.75);\n --color-primary-700: #67ffc8;\n --color-primary-800: #a5ffdf;\n --color-primary-900: #d0fdec;\n\n --color-secondary-200: rgba(103, 255, 200, 0.05);\n --color-secondary-300: rgba(103, 255, 200, 0.1);\n --color-secondary-400: rgba(103, 255, 200, 0.25);\n --color-secondary-500: rgba(103, 255, 200, 0.5);\n --color-secondary-600: rgba(103, 255, 200, 0.75);\n --color-secondary-700: #67ffc8;\n --color-secondary-800: #a5ffdf;\n --color-secondary-900: #d0fdec;\n\n --color-theme-transparent-200: rgba(6,7,8,0.12);\n --color-theme-transparent-300: rgba(6,7,8,0.22);\n --color-theme-transparent-400: rgba(6,7,8,0.5);\n --color-theme-transparent-500: rgba(255,255,255,0.27);\n --color-theme-transparent-600: rgba(255,255,255,0.4);\n --color-theme-transparent-700: rgba(255,255,255,0.6);\n --color-theme-transparent-800: rgba(255,255,255,0.85);\n\n --color-primary-opaque-300: #334447;\n --color-primary-opaque-400: #3c605a;\n\n --color-secondary-opaque-300: #334447;\n --color-secondary-opaque-400: #3c605a;\n\n --body-bg-main: rgb(36, 38, 46);\n --body-bg-main-transparent: rgba(36, 38, 46, 0);\n --page-paper-main: #2f323a;\n --border-primary: #17171a;\n --selectable: #17171a;\n --selectable-active: #3b82f6;\n\n --note-bg: #3d3c3c;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.2),\n 0 32px 32px 0 rgba(0, 0, 0, 0.2), 0 16px 16px 0 rgba(0, 0, 0, 0.2),\n 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.1), 0 16px 16px 0 rgba(0, 0, 0, 0.1),\n 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.1);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.3);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.1),\n 0 10px 15px -3px rgba(0, 0, 0, 0.15);\n --shadow-tertiary-hover: 0 4px 12px -2px rgba(0, 0, 0, 0.4),\n 0 10px 30px -3px rgba(0, 0, 0, 0.5);\n\n --page-paper-main-shadow: rgba(\n 47,\n 50,\n 58,\n 0\n ); /* Shadow list shadow for page paper main */\n\n --modal-background: rgba(36, 38, 46, 0.7);\n\n --highlight-dark: rgba(0, 0, 0, 0.06);\n\n --input-background-color: #24262e;\n\n --only-white: #ffffff;\n\n --only-black: #000000;\n\n --color-primary-100: rgba(103, 255, 200, 0.08);\n --color-primary-opaque-200: #31403b;\n --muted-text: #cfcfd0;\n --alert-surface: rgba(243, 24, 72, 0.25);\n --muted-surface: #b4b4b8;\n --muted-surface-text: #4a4a4a;\n --stripe-pattern: #524145;\n --drop-overlay-bg: rgba(47, 50, 58, 0.93);\n }\n\n .dracula {\n --color-primary: #bd93f9;\n --color-secondary: #ff79c6;\n\n --color-theme-100: #000000;\n --color-theme-200: #292a39;\n --color-theme-300: #1f212b;\n --color-theme-400: #111217;\n --color-theme-500: #6272a4;\n --color-theme-600: #7d8ab8;\n --color-theme-700: #a4aecd;\n --color-theme-800: #dededa;\n --color-theme-900: #f8f8f2;\n\n --color-primary-200: rgba(189, 147, 249, 0.05);\n --color-primary-300: rgba(189, 147, 249, 0.1);\n --color-primary-400: rgba(189, 147, 249, 0.25);\n --color-primary-500: rgba(189, 147, 249, 0.5);\n --color-primary-600: rgba(189, 147, 249, 0.75);\n --color-primary-700: #bd93f9;\n --color-primary-800: #d2b6fb;\n --color-primary-900: #e4d3fd;\n\n --color-secondary-200: rgba(255, 121, 198, 0.05);\n --color-secondary-300: rgba(255, 121, 198, 0.1);\n --color-secondary-400: rgba(255, 121, 198, 0.25);\n --color-secondary-500: rgba(255, 121, 198, 0.5);\n --color-secondary-600: rgba(255, 121, 198, 0.75);\n --color-secondary-700: #ff79c6;\n --color-secondary-800: #ffa3d7;\n --color-secondary-900: #ffc9e7;\n\n --color-theme-transparent-200: rgba(6, 7, 8, 0.12);\n --color-theme-transparent-300: rgba(6, 7, 8, 0.22);\n --color-theme-transparent-400: rgba(6, 7, 8, 0.5);\n --color-theme-transparent-500: rgba(255, 255, 255, 0.27);\n --color-theme-transparent-600: rgba(255, 255, 255, 0.4);\n --color-theme-transparent-700: rgba(255, 255, 255, 0.6);\n --color-theme-transparent-800: rgba(255, 255, 255, 0.85);\n\n --color-primary-opaque-300: #42385b;\n --color-primary-opaque-400: #534472;\n\n --color-secondary-opaque-300: #543448;\n --color-secondary-opaque-400: #6f435f;\n\n --body-bg-main: rgb(32, 34, 44);\n --body-bg-main-transparent: rgba(32, 34, 44, 0);\n --page-paper-main: #2c2f3c;\n --border-primary: #111217;\n --selectable: #111217;\n --selectable-active: #3b82f6;\n\n --note-bg: #323026;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.2),\n 0 32px 32px 0 rgba(0, 0, 0, 0.2), 0 16px 16px 0 rgba(0, 0, 0, 0.2),\n 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.1), 0 16px 16px 0 rgba(0, 0, 0, 0.1),\n 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.1);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.3);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.1),\n 0 10px 15px -3px rgba(0, 0, 0, 0.15);\n --shadow-tertiary-hover: 0 4px 12px -2px rgba(0, 0, 0, 0.4),\n 0 10px 30px -3px rgba(0, 0, 0, 0.5);\n\n --page-paper-main-shadow: rgba(44, 47, 60, 0);\n\n --modal-background: rgba(32, 34, 44, 0.7);\n\n --highlight-dark: rgba(0, 0, 0, 0.06);\n\n --input-background-color: #191a22;\n\n --color-primary-100: rgba(189, 147, 249, 0.08);\n --color-primary-opaque-200: #302c3e;\n --muted-text: #d0d0cb;\n --alert-surface: rgba(255, 85, 85, 0.25);\n --muted-surface: #a9aec4;\n --muted-surface-text: #282a36;\n --stripe-pattern: #503d47;\n --drop-overlay-bg: rgba(44, 47, 60, 0.93);\n }\n\n .one-dark {\n --color-primary: #61afef;\n --color-secondary: #c678dd;\n\n --color-theme-100: #000000;\n --color-theme-200: #272c35;\n --color-theme-300: #1e2127;\n --color-theme-400: #191c21;\n --color-theme-500: #5c6370;\n --color-theme-600: #767d8a;\n --color-theme-700: #9aa2b1;\n --color-theme-800: #cdd3de;\n --color-theme-900: #dcdfe4;\n\n --color-primary-200: rgba(97, 175, 239, 0.05);\n --color-primary-300: rgba(97, 175, 239, 0.1);\n --color-primary-400: rgba(97, 175, 239, 0.25);\n --color-primary-500: rgba(97, 175, 239, 0.5);\n --color-primary-600: rgba(97, 175, 239, 0.75);\n --color-primary-700: #61afef;\n --color-primary-800: #8ec6f4;\n --color-primary-900: #bcdcf9;\n\n --color-secondary-200: rgba(198, 120, 221, 0.05);\n --color-secondary-300: rgba(198, 120, 221, 0.1);\n --color-secondary-400: rgba(198, 120, 221, 0.25);\n --color-secondary-500: rgba(198, 120, 221, 0.5);\n --color-secondary-600: rgba(198, 120, 221, 0.75);\n --color-secondary-700: #c678dd;\n --color-secondary-800: #d79ce8;\n --color-secondary-900: #e8c2f2;\n\n --color-theme-transparent-200: rgba(6, 7, 8, 0.12);\n --color-theme-transparent-300: rgba(6, 7, 8, 0.22);\n --color-theme-transparent-400: rgba(6, 7, 8, 0.5);\n --color-theme-transparent-500: rgba(255, 255, 255, 0.27);\n --color-theme-transparent-600: rgba(255, 255, 255, 0.4);\n --color-theme-transparent-700: rgba(255, 255, 255, 0.6);\n --color-theme-transparent-800: rgba(255, 255, 255, 0.85);\n\n --color-primary-opaque-300: #2d3e51;\n --color-primary-opaque-400: #364e65;\n\n --color-secondary-opaque-300: #402e47;\n --color-secondary-opaque-400: #543b5d;\n\n --body-bg-main: rgb(32, 35, 42);\n --body-bg-main-transparent: rgba(32, 35, 42, 0);\n --page-paper-main: #292d35;\n --border-primary: #191c21;\n --selectable: #191c21;\n --selectable-active: #3b82f6;\n\n --note-bg: #302e28;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.2),\n 0 32px 32px 0 rgba(0, 0, 0, 0.2), 0 16px 16px 0 rgba(0, 0, 0, 0.2),\n 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.1), 0 16px 16px 0 rgba(0, 0, 0, 0.1),\n 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.1);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.3);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.1),\n 0 10px 15px -3px rgba(0, 0, 0, 0.15);\n --shadow-tertiary-hover: 0 4px 12px -2px rgba(0, 0, 0, 0.4),\n 0 10px 30px -3px rgba(0, 0, 0, 0.5);\n\n --page-paper-main-shadow: rgba(41, 45, 53, 0);\n\n --modal-background: rgba(32, 35, 42, 0.7);\n\n --highlight-dark: rgba(0, 0, 0, 0.06);\n\n --input-background-color: #191c21;\n\n --color-primary-100: rgba(97, 175, 239, 0.08);\n --color-primary-opaque-200: #25313e;\n --muted-text: #c5cbd6;\n --alert-surface: rgba(224, 108, 117, 0.25);\n --muted-surface: #a3aab8;\n --muted-surface-text: #282c34;\n --stripe-pattern: #4b3e41;\n --drop-overlay-bg: rgba(41, 45, 53, 0.93);\n }\n\n html {\n color-scheme: light;\n\n &${DARK_THEME_MATCH} {\n color-scheme: dark;\n }\n }\n\n .ac-shadow,\n .ac-shadow--raised {\n &--lg {\n box-shadow: var(--shadow-primary);\n }\n &--sm {\n box-shadow: var(--shadow-tertiary);\n }\n }\n\n .ac-shadow--raised {\n &--lg {\n transition: box-shadow 0.3s;\n &:hover {\n box-shadow: var(--shadow-primary-hover);\n }\n }\n &--sm {\n transition: box-shadow 0.3s;\n &:hover {\n box-shadow: var(--shadow-tertiary-hover);\n }\n }\n }\n\n .ac-shadow-optimized--sm {\n position: relative;\n box-shadow: var(--shadow-tertiary);\n\n &::before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n content: \"\";\n box-shadow: var(--shadow-tertiary);\n opacity: 0;\n border-radius: var(--ac-br-6);\n transition: opacity 0.3s ease;\n z-index: -1;\n }\n\n @media (hover: hover) {\n &:hover::before {\n opacity: 1;\n }\n }\n }\n\n .ac-shadow-optimized--lg {\n position: relative;\n box-shadow: var(--shadow-primary);\n\n &::before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n content: \"\";\n box-shadow: var(--shadow-primary);\n opacity: 0;\n border-radius: var(--ac-br-8);\n transition: opacity 0.3s ease;\n z-index: -1;\n }\n\n @media (hover: hover) {\n &:hover::before {\n opacity: 1;\n }\n }\n }\n\n .ac-border-radius {\n &-4 {\n border-radius: var(--ac-br-4);\n }\n\n &-6 {\n border-radius: var(--ac-br-6);\n }\n\n &-8 {\n border-radius: var(--ac-br-8);\n }\n\n &-rounded {\n border-radius: var(--ac-br-rounded);\n }\n }\n\n\n // CSS Tooltip ::after content: data-tooltip\n\n .c-cooltip {\n position: relative;\n\n /*\n * Prefer scoped variables in this case.\n * This lines of CSS should be scoped too.\n */\n\n --cooltip-spacing: 0.5rem;\n --cooltip-padding: 0.25rem 0.625rem;\n --cooltip-max-width: 12.5rem;\n\n --cooltip-transition-duration: 0.15s, 0.1s, 0.15s;\n --cooltip-transition-delay: 0.6s;\n --cooltip-timing: ease, ease, cubic-bezier(0.39, 0.575, 0.565, 1);\n }\n\n .c-cooltip::after {\n /*\n * will-change is intended to be used as a last resort,\n * in order to try to deal with existing performance problems.\n * It should not be used to anticipate performance problems.\n * https://developer.mozilla.org/en-US/docs/Web/CSS/will-change\n *\n * will-change: transform, opacity\n */\n pointer-events: none;\n content: attr(data-tooltip);\n position: absolute;\n color: #fff;\n opacity: 0;\n background-color: rgba(0, 0, 0, 0.9);\n border-radius: 0.5rem;\n font-size: 0.75rem;\n font-weight: 500;\n line-height: 1.3;\n max-width: var(--cooltip-max-width);\n padding: var(--cooltip-padding);\n text-align: center;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n }\n\n .c-cooltip--top::after {\n bottom: calc(100% + var(--cooltip-spacing));\n left: 50%;\n transform: scale(0.85) translateX(-50%);\n transform-origin: 0;\n }\n\n .c-cooltip--right::after {\n left: calc(100% + var(--cooltip-spacing));\n transform: scale(0.85);\n }\n\n .c-cooltip--bottom::after {\n top: calc(100% + var(--cooltip-spacing));\n left: 50%;\n transform: scale(0.85) translateX(-50%);\n transform-origin: 0;\n }\n\n .c-cooltip--left::after {\n right: calc(100% + var(--cooltip-spacing));\n transform: scale(0.85);\n }\n\n /*\n * Make sure that disabled and aria pressed\n * items do not have tooltips available.\n */\n .c-cooltip:disabled::after,\n [aria-pressed=\"true\"]::after {\n display: none;\n }\n\n /*\n *\n * Only use hover when is available .\n * https://developer.mozilla.org/en-US/docs/Web/CSS/@media/hover\n */\n @media (hover: hover) {\n /*\n * Here we maybe have a complex selector but actually it's not.\n * We simply asks here to show tooltip only on hover.\n * Focused elements (in this case, clicked elements) should hide the tooltip.\n */\n .c-cooltip--top:not(:focus):hover::after,\n .c-cooltip--bottom:not(:focus):hover::after {\n transition-property: opacity, transform;\n transition-duration: var(--cooltip-transition-duration);\n transition-delay: var(--cooltip-transition-delay);\n transition-timing-function: var(--cooltip-timing);\n transform: scale(1) translateX(-50%);\n opacity: 1;\n }\n\n /*\n *\n * This is not code duplication!\n * Transform properties are tricky to animate and values\n * are not the same depending on the tooltip position.\n *\n * Animating only one transform, eg. scale(1) will\n * override all previously set transforms, eg. translateY.\n * So we need to always chain them.\n * eg. transform: scale(1) translateY(-50%) etc...\n */\n\n .c-cooltip--right:not(:focus):hover::after,\n .c-cooltip--left:not(:focus):hover::after {\n transition-property: opacity, transform;\n transition-duration: var(--cooltip-transition-duration);\n transition-delay: var(--cooltip-transition-delay);\n transition-timing-function: var(--cooltip-timing);\n transform: scale(1);\n opacity: 1;\n }\n }\n\n .c-date-picker--calendar {\n width: 260px;\n padding: 16px 0px 8px 0px;\n margin: auto;\n background-color: var(--page-paper-main);\n }\n`;\n"],"mappings":"AAAA,SAASA,iBAAiB,QAAQ,mBAAmB;AAErD,SAASC,gBAAgB,QAAQ,iBAAiB;AAElD,OAAO,MAAMC,WAAW,GAAGF,iBAAiB,u6gBA4frCC,gBAAgB,CAoOtB","ignoreList":[]}
1
+ {"version":3,"file":"GlobalStyle.js","names":["createGlobalStyle","DARK_THEME_MATCH","GlobalStyle"],"sources":["../../../src/components/GlobalStyle.ts"],"sourcesContent":["import { createGlobalStyle } from \"styled-components\";\n\nimport { DARK_THEME_MATCH } from \"../utils/themes\";\n\nexport const GlobalStyle = createGlobalStyle`\n :root {\n --color-primary: #5d2bff;\n --color-secondary: #5d2bff;\n\n --color-theme-100: #ffffff;\n --color-theme-200: #f6f6f9;\n --color-theme-300: #ebebee;\n --color-theme-400: #d7d7da;\n --color-theme-500: #b9b9bd;\n --color-theme-600: #89898e;\n --color-theme-700: #6d6d73;\n --color-theme-800: #5b5b61;\n --color-theme-900: #303037;\n\n --color-primary-200: rgba(93, 43, 255, 0.05);\n --color-primary-300: rgba(93, 43, 255, 0.1);\n --color-primary-400: rgba(93, 43, 255, 0.25);\n --color-primary-500: rgba(93, 43, 255, 0.5);\n --color-primary-600: rgba(93, 43, 255, 0.75);\n --color-primary-700: #5d2bff;\n --color-primary-800: #4a21cd;\n --color-primary-900: #32178b;\n\n --color-secondary-200: rgba(93, 43, 255, 0.05);\n --color-secondary-300: rgba(93, 43, 255, 0.1);\n --color-secondary-400: rgba(93, 43, 255, 0.25);\n --color-secondary-500: rgba(93, 43, 255, 0.5);\n --color-secondary-600: rgba(93, 43, 255, 0.75);\n --color-secondary-700: #5d2bff;\n --color-secondary-800: #4a21cd;\n --color-secondary-900: #32178b;\n\n --color-theme-transparent-200: rgba(36,36,76,0.04);\n --color-theme-transparent-300: rgba(48,48,55,0.1);\n --color-theme-transparent-400: rgba(48,48,55,0.2);\n --color-theme-transparent-500: rgba(48,48,55,0.34);\n --color-theme-transparent-600: rgba(48,48,55,0.57);\n --color-theme-transparent-700: rgba(48,48,55,0.7);\n --color-theme-transparent-800: rgba(48,48,55,0.8);\n\n --color-primary-opaque-300: #efeaff;\n --color-primary-opaque-400: #d6caff;\n\n --color-secondary-opaque-300: #efeaff;\n --color-secondary-opaque-400: #d6caff;\n\n --color-sucess-green: #64cd93;\n --color-pale-green: #c3e799;\n --color-progress-blue: #4182f2;\n\n --color-yellow: #FDF196;\n --color-yellow-darker: #948D5D;\n --color-yellow-lighter: #EBD429;\n --color-orange: #FBBB75;\n --color-orange-darker: #916C43;\n --color-orange-lighter: #E99841;\n --color-beige: #EAC2AD;\n --color-beige-darker: #877064;\n --color-beige-lighter: #B98A72;\n --color-pink: #FBD6E7;\n --color-pink-darker: #917C86;\n --color-pink-lighter: #E4A1C0;\n --color-coral: #FF9C9C;\n --color-coral-darker: #945A5A;\n --color-coral-lighter: #DB4545;\n --color-purple-dirty: #C49CB6;\n --color-purple-dirty-darker: #715A69;\n --color-purple-dirty-lighter: #B16E9A;\n --color-purple: #BEACF9;\n --color-purple-darker: #6E6390;\n --color-purple-lighter: #9B86DF;\n --color-blue-aqua: #BDF7FD;\n --color-blue-aqua-darker: #6D8F92;\n --color-blue-aqua-lighter: #7BDDE7;\n --color-blue-pale: #BEEAFF;\n --color-blue-pale-darker: #6E8794;\n --color-blue-pale-lighter: #92BFD4;\n --color-blue-sky: #A0CBFD;\n --color-blue-sky-darker: #5C7592;\n --color-blue-sky-lighter: #568CCB;\n --color-turquoise: #B9E4E0;\n --color-turquoise-darker: #6B8482;\n --color-turquoise-lighter: #70BFB8;\n --color-green-pale: #C3E799;\n --color-green-pale-darker: #718658;\n --color-green-pale-lighter: #80C333;\n --color-green-olive-drab: #98B57C;\n --color-green-olive-drab-darker: #647157;\n --color-green-olive-drab-lighter: #819F65;\n --color-gray-silver: #DDDDDD;\n --color-gray-silver-darker: #808080;\n --color-gray-silver-lighter: #ACACAC;\n --color-gray: #CACACA;\n --color-gray-darker: #757575;\n --color-gray-lighter: #7D7D7D;\n\n --body-bg-main: rgb(244, 245, 247);\n --body-bg-main-transparent: rgba(244, 245, 247, 0);\n --page-paper-main: #ffffff;\n --border-primary: #d7d7da;\n --selectable: #d7d7da;\n --selectable-active: #3b82f6;\n\n --note-bg: #fff9f1;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.06), 0 16px 16px 0 rgba(0, 0, 0, 0.04),\n 0 4px 4px 0 rgba(0, 0, 0, 0.04), 0 2px 2px 0 rgba(0, 0, 0, 0.04);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.06),\n 0 32px 32px 0 rgba(0, 0, 0, 0.03), 0 16px 16px 0 rgba(0, 0, 0, 0.02),\n 0 4px 4px 0 rgba(0, 0, 0, 0.02), 0 2px 2px 0 rgba(0, 0, 0, 0.02);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.17);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.05),\n 0 10px 15px -3px rgba(0, 0, 0, 0.1);\n --shadow-tertiary-hover: 0 4px 10px -2px rgba(0, 0, 0, 0.1),\n 0 12px 20px -3px rgba(0, 0, 0, 0.2);\n\n --page-paper-main-shadow: rgba(\n 255,\n 255,\n 255,\n 0\n ); /* Shadow list shadow for page paper main */\n\n --modal-background: rgba(244, 245, 247, 0.6);\n\n --highlight-dark: rgba(0, 0, 0, 0.03);\n\n --input-background-color: #ffffff;\n\n /* Consumed by app LESS under the dark-theme selector; every theme must define them so a dark\n theme never inherits another theme's chrome. */\n --color-primary-100: rgba(93, 43, 255, 0.03);\n --color-primary-opaque-200: #f7f4ff;\n --muted-text: #6d6d73;\n --alert-surface: rgba(243, 24, 72, 0.12);\n --muted-surface: #d7d7da;\n --muted-surface-text: #303037;\n --stripe-pattern: #e6e6e9;\n --drop-overlay-bg: rgba(255, 255, 255, 0.93);\n\n --ai-gradient: linear-gradient(135deg, #4da2ed, #9f69e5, #ec43d8, #f72222);\n \n --ai-gradient-lighter: linear-gradient(\n 135deg,\n rgba(77, 162, 237, 0.1),\n rgba(159, 105, 229, 0.1),\n rgba(236, 67, 216, 0.1),\n rgba(230, 10, 10, 0.1)\n );\n\n --red-alert: rgb(237, 97, 97);\n\n --warning: #ffcc6b;\n\n --only-white: #ffffff;\n\n --only-black: #000000;\n\n --ac-br-4: 4px;\n\n --ac-br-6: 6px;\n\n --ac-br-8: 8px;\n\n --ac-br-rounded: 999px;\n }\n\n .cupcake {\n --color-primary: #29bcdd;\n --color-secondary: #fe6fa7;\n\n --color-primary-200: rgba(41, 188, 221, 0.07);\n --color-primary-300: rgba(41, 188, 221, 0.12);\n --color-primary-400: rgba(41, 188, 221, 0.26);\n --color-primary-500: rgba(41, 188, 221, 0.52);\n --color-primary-600: rgba(41, 188, 221, 0.75);\n --color-primary-700: #29bcdd;\n --color-primary-800: #219fbb;\n --color-primary-900: #1a768b;\n\n --color-secondary-200: rgba(254, 111, 167, 0.07);\n --color-secondary-300: rgba(254, 111, 167, 0.13);\n --color-secondary-400: rgba(254, 111, 167, 0.27);\n --color-secondary-500: rgba(254, 111, 167, 0.52);\n --color-secondary-600: rgba(254, 111, 167, 0.75);\n --color-secondary-700: #fe6fa7;\n --color-secondary-800: #dd6091;\n --color-secondary-900: #ab496f;\n\n --color-primary-opaque-300: #e5f7fb;\n --color-primary-opaque-400: #c8eef6;\n\n --color-secondary-opaque-300: #ffecf4;\n --color-secondary-opaque-400: #ffd8e7;\n\n --color-primary-100: rgba(41, 188, 221, 0.04);\n --color-primary-opaque-200: #f0fafc;\n }\n\n .classic {\n --color-primary: #4182f2;\n --color-secondary: #4182f2;\n\n --color-primary-200: rgba(65, 130, 242, 0.07);\n --color-primary-300: rgba(65, 130, 242, 0.13);\n --color-primary-400: rgba(65, 130, 242, 0.26);\n --color-primary-500: rgba(65, 130, 242, 0.52);\n --color-primary-600: rgba(65, 130, 242, 0.75);\n --color-primary-700: #4182f2;\n --color-primary-800: #356bc8;\n --color-primary-900: #244a8a;\n\n --color-secondary-200: rgba(65, 130, 242, 0.07);\n --color-secondary-300: rgba(65, 130, 242, 0.13);\n --color-secondary-400: rgba(65, 130, 242, 0.26);\n --color-secondary-500: rgba(65, 130, 242, 0.52);\n --color-secondary-600: rgba(65, 130, 242, 0.75);\n --color-secondary-700: #4182f2;\n --color-secondary-800: #356bc8;\n --color-secondary-900: #244a8a;\n\n --color-primary-opaque-300: #e6effd;\n --color-primary-opaque-400: #cedffc;\n\n --color-secondary-opaque-300: #e6effd;\n --color-secondary-opaque-400: #cedffc;\n\n --color-primary-100: rgba(65, 130, 242, 0.04);\n --color-primary-opaque-200: #f2f6fe;\n }\n\n .neon {\n --color-primary: #67ffc8;\n --color-secondary: #67ffc8;\n\n --color-theme-100: #000000;\n --color-theme-200: #292b34;\n --color-theme-300: #202129;\n --color-theme-400: #17171a;\n --color-theme-500: #6D6D73;\n --color-theme-600: #89898e;\n --color-theme-700: #b0b0b5;\n --color-theme-800: #dfdfe5;\n --color-theme-900: #ffffff;\n\n --color-primary-200: rgba(103, 255, 200, 0.05);\n --color-primary-300: rgba(103, 255, 200, 0.1);\n --color-primary-400: rgba(103, 255, 200, 0.25);\n --color-primary-500: rgba(103, 255, 200, 0.5);\n --color-primary-600: rgba(103, 255, 200, 0.75);\n --color-primary-700: #67ffc8;\n --color-primary-800: #a5ffdf;\n --color-primary-900: #d0fdec;\n\n --color-secondary-200: rgba(103, 255, 200, 0.05);\n --color-secondary-300: rgba(103, 255, 200, 0.1);\n --color-secondary-400: rgba(103, 255, 200, 0.25);\n --color-secondary-500: rgba(103, 255, 200, 0.5);\n --color-secondary-600: rgba(103, 255, 200, 0.75);\n --color-secondary-700: #67ffc8;\n --color-secondary-800: #a5ffdf;\n --color-secondary-900: #d0fdec;\n\n --color-theme-transparent-200: rgba(6,7,8,0.12);\n --color-theme-transparent-300: rgba(6,7,8,0.22);\n --color-theme-transparent-400: rgba(6,7,8,0.5);\n --color-theme-transparent-500: rgba(255,255,255,0.27);\n --color-theme-transparent-600: rgba(255,255,255,0.4);\n --color-theme-transparent-700: rgba(255,255,255,0.6);\n --color-theme-transparent-800: rgba(255,255,255,0.85);\n\n --color-primary-opaque-300: #334447;\n --color-primary-opaque-400: #3c605a;\n\n --color-secondary-opaque-300: #334447;\n --color-secondary-opaque-400: #3c605a;\n\n --body-bg-main: rgb(36, 38, 46);\n --body-bg-main-transparent: rgba(36, 38, 46, 0);\n --page-paper-main: #2f323a;\n --border-primary: #17171a;\n --selectable: #17171a;\n --selectable-active: #3b82f6;\n\n --note-bg: #3d3c3c;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.2),\n 0 32px 32px 0 rgba(0, 0, 0, 0.2), 0 16px 16px 0 rgba(0, 0, 0, 0.2),\n 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.1), 0 16px 16px 0 rgba(0, 0, 0, 0.1),\n 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.1);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.3);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.1),\n 0 10px 15px -3px rgba(0, 0, 0, 0.15);\n --shadow-tertiary-hover: 0 4px 12px -2px rgba(0, 0, 0, 0.4),\n 0 10px 30px -3px rgba(0, 0, 0, 0.5);\n\n --page-paper-main-shadow: rgba(\n 47,\n 50,\n 58,\n 0\n ); /* Shadow list shadow for page paper main */\n\n --modal-background: rgba(36, 38, 46, 0.7);\n\n --highlight-dark: rgba(0, 0, 0, 0.06);\n\n --input-background-color: #24262e;\n\n --only-white: #ffffff;\n\n --only-black: #000000;\n\n --color-primary-100: rgba(103, 255, 200, 0.08);\n --color-primary-opaque-200: #31403b;\n --muted-text: #cfcfd0;\n --alert-surface: rgba(243, 24, 72, 0.25);\n --muted-surface: #b4b4b8;\n --muted-surface-text: #4a4a4a;\n --stripe-pattern: #524145;\n --drop-overlay-bg: rgba(47, 50, 58, 0.93);\n }\n\n .dracula {\n --color-primary: #bd93f9;\n --color-secondary: #ff79c6;\n\n --color-theme-100: #000000;\n --color-theme-200: #262735;\n --color-theme-300: #1c1e27;\n --color-theme-400: #111217;\n --color-theme-500: #6272a4;\n --color-theme-600: #7d8ab8;\n --color-theme-700: #a4aecd;\n --color-theme-800: #dededa;\n --color-theme-900: #f8f8f2;\n\n --color-primary-200: rgba(189, 147, 249, 0.05);\n --color-primary-300: rgba(189, 147, 249, 0.1);\n --color-primary-400: rgba(189, 147, 249, 0.25);\n --color-primary-500: rgba(189, 147, 249, 0.5);\n --color-primary-600: rgba(189, 147, 249, 0.75);\n --color-primary-700: #bd93f9;\n --color-primary-800: #d2b6fb;\n --color-primary-900: #e4d3fd;\n\n --color-secondary-200: rgba(255, 121, 198, 0.05);\n --color-secondary-300: rgba(255, 121, 198, 0.1);\n --color-secondary-400: rgba(255, 121, 198, 0.25);\n --color-secondary-500: rgba(255, 121, 198, 0.5);\n --color-secondary-600: rgba(255, 121, 198, 0.75);\n --color-secondary-700: #ff79c6;\n --color-secondary-800: #ffa3d7;\n --color-secondary-900: #ffc9e7;\n\n --color-theme-transparent-200: rgba(6, 7, 8, 0.12);\n --color-theme-transparent-300: rgba(6, 7, 8, 0.22);\n --color-theme-transparent-400: rgba(6, 7, 8, 0.5);\n --color-theme-transparent-500: rgba(255, 255, 255, 0.27);\n --color-theme-transparent-600: rgba(255, 255, 255, 0.4);\n --color-theme-transparent-700: rgba(255, 255, 255, 0.6);\n --color-theme-transparent-800: rgba(255, 255, 255, 0.85);\n\n --color-primary-opaque-300: #42385b;\n --color-primary-opaque-400: #534472;\n\n --color-secondary-opaque-300: #543448;\n --color-secondary-opaque-400: #6f435f;\n\n --body-bg-main: rgb(32, 34, 44);\n --body-bg-main-transparent: rgba(32, 34, 44, 0);\n --page-paper-main: #2c2f3c;\n --border-primary: #111217;\n --selectable: #111217;\n --selectable-active: #3b82f6;\n\n --note-bg: #323026;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.2),\n 0 32px 32px 0 rgba(0, 0, 0, 0.2), 0 16px 16px 0 rgba(0, 0, 0, 0.2),\n 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.1), 0 16px 16px 0 rgba(0, 0, 0, 0.1),\n 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.1);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.3);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.1),\n 0 10px 15px -3px rgba(0, 0, 0, 0.15);\n --shadow-tertiary-hover: 0 4px 12px -2px rgba(0, 0, 0, 0.4),\n 0 10px 30px -3px rgba(0, 0, 0, 0.5);\n\n --page-paper-main-shadow: rgba(44, 47, 60, 0);\n\n --modal-background: rgba(32, 34, 44, 0.7);\n\n --highlight-dark: rgba(0, 0, 0, 0.06);\n\n --input-background-color: #191a22;\n\n --color-primary-100: rgba(189, 147, 249, 0.08);\n --color-primary-opaque-200: #302c3e;\n --muted-text: #d0d0cb;\n --alert-surface: rgba(255, 85, 85, 0.25);\n --muted-surface: #a9aec4;\n --muted-surface-text: #282a36;\n --stripe-pattern: #503d47;\n --drop-overlay-bg: rgba(44, 47, 60, 0.93);\n }\n\n .one-dark {\n --color-primary: #61afef;\n --color-secondary: #c678dd;\n\n --color-theme-100: #000000;\n --color-theme-200: #22262e;\n --color-theme-300: #1c1f24;\n --color-theme-400: #191c21;\n --color-theme-500: #5c6370;\n --color-theme-600: #767d8a;\n --color-theme-700: #9aa2b1;\n --color-theme-800: #cdd3de;\n --color-theme-900: #dcdfe4;\n\n --color-primary-200: rgba(97, 175, 239, 0.05);\n --color-primary-300: rgba(97, 175, 239, 0.1);\n --color-primary-400: rgba(97, 175, 239, 0.25);\n --color-primary-500: rgba(97, 175, 239, 0.5);\n --color-primary-600: rgba(97, 175, 239, 0.75);\n --color-primary-700: #61afef;\n --color-primary-800: #8ec6f4;\n --color-primary-900: #bcdcf9;\n\n --color-secondary-200: rgba(198, 120, 221, 0.05);\n --color-secondary-300: rgba(198, 120, 221, 0.1);\n --color-secondary-400: rgba(198, 120, 221, 0.25);\n --color-secondary-500: rgba(198, 120, 221, 0.5);\n --color-secondary-600: rgba(198, 120, 221, 0.75);\n --color-secondary-700: #c678dd;\n --color-secondary-800: #d79ce8;\n --color-secondary-900: #e8c2f2;\n\n --color-theme-transparent-200: rgba(6, 7, 8, 0.12);\n --color-theme-transparent-300: rgba(6, 7, 8, 0.22);\n --color-theme-transparent-400: rgba(6, 7, 8, 0.5);\n --color-theme-transparent-500: rgba(255, 255, 255, 0.27);\n --color-theme-transparent-600: rgba(255, 255, 255, 0.4);\n --color-theme-transparent-700: rgba(255, 255, 255, 0.6);\n --color-theme-transparent-800: rgba(255, 255, 255, 0.85);\n\n --color-primary-opaque-300: #2d3e51;\n --color-primary-opaque-400: #364e65;\n\n --color-secondary-opaque-300: #402e47;\n --color-secondary-opaque-400: #543b5d;\n\n --body-bg-main: rgb(32, 35, 42);\n --body-bg-main-transparent: rgba(32, 35, 42, 0);\n --page-paper-main: #292d35;\n --border-primary: #191c21;\n --selectable: #191c21;\n --selectable-active: #3b82f6;\n\n --note-bg: #302e28;\n\n --shadow-primary-hover: 0 64px 64px 0 rgba(0, 0, 0, 0.2),\n 0 32px 32px 0 rgba(0, 0, 0, 0.2), 0 16px 16px 0 rgba(0, 0, 0, 0.2),\n 0 4px 4px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);\n --shadow-primary: 0 64px 64px 0 rgba(0, 0, 0, 0.1),\n 0 32px 32px 0 rgba(0, 0, 0, 0.1), 0 16px 16px 0 rgba(0, 0, 0, 0.1),\n 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.1);\n\n --shadow-secondary: 0 4px 14px 0 rgba(0, 0, 0, 0.3);\n\n --shadow-tertiary: 0 4px 6px -2px rgba(0, 0, 0, 0.1),\n 0 10px 15px -3px rgba(0, 0, 0, 0.15);\n --shadow-tertiary-hover: 0 4px 12px -2px rgba(0, 0, 0, 0.4),\n 0 10px 30px -3px rgba(0, 0, 0, 0.5);\n\n --page-paper-main-shadow: rgba(41, 45, 53, 0);\n\n --modal-background: rgba(32, 35, 42, 0.7);\n\n --highlight-dark: rgba(0, 0, 0, 0.06);\n\n --input-background-color: #191c21;\n\n --color-primary-100: rgba(97, 175, 239, 0.08);\n --color-primary-opaque-200: #25313e;\n --muted-text: #c5cbd6;\n --alert-surface: rgba(224, 108, 117, 0.25);\n --muted-surface: #a3aab8;\n --muted-surface-text: #282c34;\n --stripe-pattern: #4b3e41;\n --drop-overlay-bg: rgba(41, 45, 53, 0.93);\n }\n\n html {\n color-scheme: light;\n\n &${DARK_THEME_MATCH} {\n color-scheme: dark;\n }\n }\n\n .ac-shadow,\n .ac-shadow--raised {\n &--lg {\n box-shadow: var(--shadow-primary);\n }\n &--sm {\n box-shadow: var(--shadow-tertiary);\n }\n }\n\n .ac-shadow--raised {\n &--lg {\n transition: box-shadow 0.3s;\n &:hover {\n box-shadow: var(--shadow-primary-hover);\n }\n }\n &--sm {\n transition: box-shadow 0.3s;\n &:hover {\n box-shadow: var(--shadow-tertiary-hover);\n }\n }\n }\n\n .ac-shadow-optimized--sm {\n position: relative;\n box-shadow: var(--shadow-tertiary);\n\n &::before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n content: \"\";\n box-shadow: var(--shadow-tertiary);\n opacity: 0;\n border-radius: var(--ac-br-6);\n transition: opacity 0.3s ease;\n z-index: -1;\n }\n\n @media (hover: hover) {\n &:hover::before {\n opacity: 1;\n }\n }\n }\n\n .ac-shadow-optimized--lg {\n position: relative;\n box-shadow: var(--shadow-primary);\n\n &::before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n content: \"\";\n box-shadow: var(--shadow-primary);\n opacity: 0;\n border-radius: var(--ac-br-8);\n transition: opacity 0.3s ease;\n z-index: -1;\n }\n\n @media (hover: hover) {\n &:hover::before {\n opacity: 1;\n }\n }\n }\n\n .ac-border-radius {\n &-4 {\n border-radius: var(--ac-br-4);\n }\n\n &-6 {\n border-radius: var(--ac-br-6);\n }\n\n &-8 {\n border-radius: var(--ac-br-8);\n }\n\n &-rounded {\n border-radius: var(--ac-br-rounded);\n }\n }\n\n\n // CSS Tooltip ::after content: data-tooltip\n\n .c-cooltip {\n position: relative;\n\n /*\n * Prefer scoped variables in this case.\n * This lines of CSS should be scoped too.\n */\n\n --cooltip-spacing: 0.5rem;\n --cooltip-padding: 0.25rem 0.625rem;\n --cooltip-max-width: 12.5rem;\n\n --cooltip-transition-duration: 0.15s, 0.1s, 0.15s;\n --cooltip-transition-delay: 0.6s;\n --cooltip-timing: ease, ease, cubic-bezier(0.39, 0.575, 0.565, 1);\n }\n\n .c-cooltip::after {\n /*\n * will-change is intended to be used as a last resort,\n * in order to try to deal with existing performance problems.\n * It should not be used to anticipate performance problems.\n * https://developer.mozilla.org/en-US/docs/Web/CSS/will-change\n *\n * will-change: transform, opacity\n */\n pointer-events: none;\n content: attr(data-tooltip);\n position: absolute;\n color: #fff;\n opacity: 0;\n background-color: rgba(0, 0, 0, 0.9);\n border-radius: 0.5rem;\n font-size: 0.75rem;\n font-weight: 500;\n line-height: 1.3;\n max-width: var(--cooltip-max-width);\n padding: var(--cooltip-padding);\n text-align: center;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n }\n\n .c-cooltip--top::after {\n bottom: calc(100% + var(--cooltip-spacing));\n left: 50%;\n transform: scale(0.85) translateX(-50%);\n transform-origin: 0;\n }\n\n .c-cooltip--right::after {\n left: calc(100% + var(--cooltip-spacing));\n transform: scale(0.85);\n }\n\n .c-cooltip--bottom::after {\n top: calc(100% + var(--cooltip-spacing));\n left: 50%;\n transform: scale(0.85) translateX(-50%);\n transform-origin: 0;\n }\n\n .c-cooltip--left::after {\n right: calc(100% + var(--cooltip-spacing));\n transform: scale(0.85);\n }\n\n /*\n * Make sure that disabled and aria pressed\n * items do not have tooltips available.\n */\n .c-cooltip:disabled::after,\n [aria-pressed=\"true\"]::after {\n display: none;\n }\n\n /*\n *\n * Only use hover when is available .\n * https://developer.mozilla.org/en-US/docs/Web/CSS/@media/hover\n */\n @media (hover: hover) {\n /*\n * Here we maybe have a complex selector but actually it's not.\n * We simply asks here to show tooltip only on hover.\n * Focused elements (in this case, clicked elements) should hide the tooltip.\n */\n .c-cooltip--top:not(:focus):hover::after,\n .c-cooltip--bottom:not(:focus):hover::after {\n transition-property: opacity, transform;\n transition-duration: var(--cooltip-transition-duration);\n transition-delay: var(--cooltip-transition-delay);\n transition-timing-function: var(--cooltip-timing);\n transform: scale(1) translateX(-50%);\n opacity: 1;\n }\n\n /*\n *\n * This is not code duplication!\n * Transform properties are tricky to animate and values\n * are not the same depending on the tooltip position.\n *\n * Animating only one transform, eg. scale(1) will\n * override all previously set transforms, eg. translateY.\n * So we need to always chain them.\n * eg. transform: scale(1) translateY(-50%) etc...\n */\n\n .c-cooltip--right:not(:focus):hover::after,\n .c-cooltip--left:not(:focus):hover::after {\n transition-property: opacity, transform;\n transition-duration: var(--cooltip-transition-duration);\n transition-delay: var(--cooltip-transition-delay);\n transition-timing-function: var(--cooltip-timing);\n transform: scale(1);\n opacity: 1;\n }\n }\n\n .c-date-picker--calendar {\n width: 260px;\n padding: 16px 0px 8px 0px;\n margin: auto;\n background-color: var(--page-paper-main);\n }\n`;\n"],"mappings":"AAAA,SAASA,iBAAiB,QAAQ,mBAAmB;AAErD,SAASC,gBAAgB,QAAQ,iBAAiB;AAElD,OAAO,MAAMC,WAAW,GAAGF,iBAAiB,u6gBA4frCC,gBAAgB,CAoOtB","ignoreList":[]}