UNPKG

@ory/elements-react

Version:

Ory Elements React - a collection of React components for authentication UIs.

1 lines 77.9 kB
{"version":3,"sources":["../../../tailwind/generated/default-variables.css","../../../src/theme/default/global.css"],"sourcesContent":["/* Copyright © 2025 Ory Corp */\n/* SPDX-License-Identifier: Apache-2.0 */\n\n:root {\n --ui-100: #f1f5f9;\n --ui-200: #e2e8f0;\n --ui-300: #cbd5e1;\n --ui-400: #94a3b8;\n --ui-50: #f8fafc;\n --ui-500: #64748b;\n --ui-600: #475569;\n --ui-700: #334155;\n --ui-800: #1e293b;\n --ui-900: #0f172a;\n --ui-950: #020617;\n --ui-black: #000000;\n --ui-danger: #dc2626;\n --ui-success: #22c55e;\n --ui-transparent: #ffffff00;\n --ui-warning: #eab308;\n --ui-white: #ffffff;\n --button-identifier-background-default: var(\n --interface-background-brand-secondary\n );\n --button-identifier-background-hover: var(\n --interface-background-brand-secondary-hover\n );\n --button-identifier-border-border-default: var(\n --interface-border-brand-brand\n );\n --button-identifier-border-border-hover: var(--interface-border-brand-brand);\n --button-identifier-foreground-default: var(\n --interface-foreground-brand-on-secondary\n );\n --button-identifier-foreground-hover: var(\n --interface-foreground-brand-on-secondary\n );\n --button-link-brand-brand: var(--interface-foreground-brand-primary);\n --button-link-brand-brand-hover: var(--interface-foreground-default-primary);\n --button-link-default-primary: var(--interface-foreground-default-primary);\n --button-link-default-primary-hover: var(\n --interface-foreground-brand-primary\n );\n --button-link-default-secondary: var(\n --interface-foreground-default-secondary\n );\n --button-link-default-secondary-hover: var(\n --interface-foreground-default-tertiary\n );\n --button-link-disabled-disabled: var(\n --interface-foreground-disabled-disabled\n );\n --button-primary-background-default: var(\n --interface-background-brand-primary\n );\n --button-primary-background-disabled: var(\n --interface-background-disabled-disabled\n );\n --button-primary-background-hover: var(\n --interface-background-brand-primary-hover\n );\n --button-primary-border-default: var(--interface-border-default-none);\n --button-primary-border-disabled: var(--interface-border-disabled-disabled);\n --button-primary-border-hover: var(--interface-border-default-none);\n --button-primary-foreground-default: var(\n --interface-foreground-brand-on-primary\n );\n --button-primary-foreground-disabled: var(\n --interface-foreground-disabled-on-disabled\n );\n --button-primary-foreground-hover: var(\n --interface-foreground-brand-on-primary\n );\n --button-secondary-background-default: var(\n --interface-background-default-primary\n );\n --button-secondary-background-disabled: var(\n --interface-background-disabled-disabled\n );\n --button-secondary-background-hover: var(\n --interface-background-default-primary-hover\n );\n --button-secondary-border-default: var(--interface-border-default-primary);\n --button-secondary-border-disabled: var(--interface-border-disabled-disabled);\n --button-secondary-border-hover: var(--interface-border-default-primary);\n --button-secondary-foreground-default: var(\n --interface-foreground-default-primary\n );\n --button-secondary-foreground-disabled: var(\n --interface-foreground-disabled-on-disabled\n );\n --button-secondary-foreground-hover: var(\n --interface-foreground-default-secondary\n );\n --button-social-background-default: var(\n --interface-background-default-primary\n );\n --button-social-background-disabled: var(\n --interface-background-disabled-disabled\n );\n --button-social-background-generic-provider: var(\n --interface-background-default-inverted\n );\n --button-social-background-hover: var(\n --interface-background-default-primary-hover\n );\n --button-social-border-default: var(--interface-border-default-primary);\n --button-social-border-disabled: var(--interface-border-disabled-disabled);\n --button-social-border-generic-provider: var(--interface-border-default-none);\n --button-social-border-hover: var(--interface-border-default-primary);\n --button-social-foreground-default: var(\n --interface-foreground-default-primary\n );\n --button-social-foreground-disabled: var(\n --interface-foreground-disabled-on-disabled\n );\n --button-social-foreground-generic-provider: var(\n --interface-foreground-default-inverted\n );\n --button-social-foreground-hover: var(\n --interface-foreground-default-secondary\n );\n --checkbox-background-checked: var(--interface-background-brand-primary);\n --checkbox-background-default: var(--interface-background-default-secondary);\n --checkbox-border-checkbox-border-checked: var(\n --interface-border-brand-brand\n );\n --checkbox-border-checkbox-border-default: var(\n --interface-border-default-primary\n );\n --checkbox-foreground-checked: var(--interface-foreground-brand-on-primary);\n --checkbox-foreground-default: var(--interface-foreground-default-primary);\n --form-background-default: var(--interface-background-default-primary);\n --form-border-default: var(--interface-border-default-primary);\n --input-background-default: var(--interface-background-default-primary);\n --input-background-disabled: var(--interface-background-disabled-disabled);\n --input-background-hover: var(--interface-background-default-primary-hover);\n --input-border-default: var(--interface-border-default-primary);\n --input-border-disabled: var(--interface-border-disabled-disabled);\n --input-border-focus: var(--interface-border-brand-brand);\n --input-border-hover: var(--interface-border-default-primary);\n --input-foreground-disabled: var(--interface-foreground-disabled-on-disabled);\n --input-foreground-primary: var(--interface-foreground-default-primary);\n --input-foreground-secondary: var(--interface-foreground-default-secondary);\n --input-foreground-tertiary: var(--interface-foreground-default-tertiary);\n --interface-background-brand-primary: var(--brand-500);\n --interface-background-brand-primary-hover: var(--brand-400);\n --interface-background-brand-secondary: var(--brand-50);\n --interface-background-brand-secondary-hover: var(--brand-100);\n --interface-background-default-inverted: var(--ui-900);\n --interface-background-default-inverted-hover: var(--ui-800);\n --interface-background-default-none: var(--ui-transparent);\n --interface-background-default-primary: var(--ui-white);\n --interface-background-default-primary-hover: var(--ui-50);\n --interface-background-default-secondary: var(--ui-50);\n --interface-background-default-secondary-hover: var(--ui-200);\n --interface-background-default-tertiary: var(--ui-200);\n --interface-background-default-tertiary-hover: var(--ui-300);\n --interface-background-disabled-disabled: var(--ui-200);\n --interface-background-validation-danger: var(--ui-danger);\n --interface-background-validation-success: var(--ui-success);\n --interface-background-validation-warning: var(--ui-warning);\n --interface-border-brand-brand: var(--brand-500);\n --interface-border-default-inverted: var(--ui-700);\n --interface-border-default-none: var(--ui-transparent);\n --interface-border-default-primary: var(--ui-300);\n --interface-border-disabled-disabled: var(--ui-300);\n --interface-border-validation-danger: var(--ui-danger);\n --interface-border-validation-success: var(--ui-success);\n --interface-border-validation-warning: var(--ui-warning);\n --interface-foreground-brand-on-primary: var(--brand-50);\n --interface-foreground-brand-on-secondary: var(--brand-950);\n --interface-foreground-brand-primary: var(--brand-500);\n --interface-foreground-brand-secondary: var(--brand-50);\n --interface-foreground-default-inverted: var(--ui-white);\n --interface-foreground-default-primary: var(--ui-900);\n --interface-foreground-default-secondary: var(--ui-700);\n --interface-foreground-default-tertiary: var(--ui-500);\n --interface-foreground-disabled-disabled: var(--ui-300);\n --interface-foreground-disabled-on-disabled: var(--ui-400);\n --interface-foreground-validation-danger: var(--ui-danger);\n --interface-foreground-validation-success: var(--ui-success);\n --interface-foreground-validation-warning: var(--ui-warning);\n --ory-background-default: var(--interface-background-default-primary);\n --ory-border-default: var(--interface-border-default-primary);\n --ory-foreground-default: var(--interface-foreground-default-primary);\n --radio-background-checked: var(--interface-background-brand-primary);\n --radio-background-default: var(--interface-background-default-secondary);\n --radio-border-checked: var(--interface-border-brand-brand);\n --radio-border-default: var(--interface-border-default-primary);\n --radio-foreground-checked: var(--interface-foreground-brand-on-primary);\n --radio-foreground-default: var(--interface-foreground-default-primary);\n --toggle-background-checked: var(--interface-background-brand-primary);\n --toggle-background-default: var(--interface-background-default-secondary);\n --toggle-border-checked: var(--interface-border-default-none);\n --toggle-border-default: var(--interface-border-default-primary);\n --toggle-foreground-checked: var(--interface-foreground-brand-on-primary);\n --toggle-foreground-default: var(--interface-foreground-brand-primary);\n --brand-100: var(--ui-100);\n --brand-200: var(--ui-300);\n --brand-300: var(--ui-500);\n --brand-400: var(--ui-700);\n --brand-50: var(--ui-50);\n --brand-500: var(--ui-900);\n --brand-600: var(--ui-white);\n --brand-700: var(--ui-200);\n --brand-800: var(--ui-400);\n --brand-900: var(--ui-600);\n --brand-950: var(--ui-800);\n --border-radius-buttons: 0.25rem;\n --border-radius-forms: 0.25rem;\n --border-radius-general: 0.25rem;\n --border-radius-branding: 0.5rem;\n --border-radius-cards: 0.75rem;\n --border-radius-identifier: 62.4375rem;\n}\n\n[data-theme=\"dark\"] {\n --button-identifier-background-default: var(\n --interface-background-brand-secondary\n );\n --button-identifier-background-hover: var(\n --interface-background-brand-secondary-hover\n );\n --button-identifier-border-border-default: var(\n --interface-border-brand-brand\n );\n --button-identifier-border-border-hover: var(--interface-border-brand-brand);\n --button-identifier-foreground-default: var(\n --interface-foreground-brand-on-secondary\n );\n --button-identifier-foreground-hover: var(\n --interface-foreground-brand-on-secondary\n );\n --button-link-brand-brand: var(--interface-foreground-brand-primary);\n --button-link-brand-brand-hover: var(--interface-foreground-default-primary);\n --button-link-default-primary: var(--interface-foreground-default-primary);\n --button-link-default-primary-hover: var(\n --interface-foreground-brand-primary\n );\n --button-link-default-secondary: var(\n --interface-foreground-default-secondary\n );\n --button-link-default-secondary-hover: var(\n --interface-foreground-default-tertiary\n );\n --button-link-disabled-disabled: var(\n --interface-foreground-disabled-disabled\n );\n --button-primary-background-default: var(\n --interface-background-brand-primary\n );\n --button-primary-background-disabled: var(\n --interface-foreground-disabled-disabled\n );\n --button-primary-background-hover: var(\n --interface-background-brand-primary-hover\n );\n --button-primary-border-default: var(--interface-border-default-none);\n --button-primary-border-disabled: var(--interface-border-disabled-disabled);\n --button-primary-border-hover: var(--interface-border-default-none);\n --button-primary-foreground-default: var(\n --interface-foreground-brand-on-primary\n );\n --button-primary-foreground-disabled: var(\n --interface-foreground-disabled-on-disabled\n );\n --button-primary-foreground-hover: var(\n --interface-foreground-brand-on-primary\n );\n --button-secondary-background-default: var(\n --interface-background-default-primary\n );\n --button-secondary-background-disabled: var(\n --interface-background-disabled-disabled\n );\n --button-secondary-background-hover: var(\n --interface-background-default-primary-hover\n );\n --button-secondary-border-default: var(--interface-border-default-primary);\n --button-secondary-border-disabled: var(--interface-border-disabled-disabled);\n --button-secondary-border-hover: var(--interface-border-default-primary);\n --button-secondary-foreground-default: var(\n --interface-foreground-default-primary\n );\n --button-secondary-foreground-disabled: var(\n --interface-foreground-disabled-on-disabled\n );\n --button-secondary-foreground-hover: var(\n --interface-foreground-default-secondary\n );\n --button-social-background-default: var(\n --interface-background-default-primary\n );\n --button-social-background-disabled: var(\n --interface-background-disabled-disabled\n );\n --button-social-background-generic-provider: var(\n --interface-background-default-inverted\n );\n --button-social-background-hover: var(\n --interface-background-default-primary-hover\n );\n --button-social-border-default: var(--interface-border-default-primary);\n --button-social-border-disabled: var(--interface-border-disabled-disabled);\n --button-social-border-generic-provider: var(--interface-border-default-none);\n --button-social-border-hover: var(--interface-border-default-primary);\n --button-social-foreground-default: var(\n --interface-foreground-default-primary\n );\n --button-social-foreground-disabled: var(\n --interface-foreground-disabled-on-disabled\n );\n --button-social-foreground-generic-provider: var(\n --interface-foreground-default-inverted\n );\n --button-social-foreground-hover: var(\n --interface-foreground-default-secondary\n );\n --checkbox-background-checked: var(--interface-background-brand-primary);\n --checkbox-background-default: var(--interface-background-default-secondary);\n --checkbox-border-checkbox-border-checked: var(\n --interface-border-brand-brand\n );\n --checkbox-border-checkbox-border-default: var(\n --interface-border-default-primary\n );\n --checkbox-foreground-checked: var(--interface-foreground-brand-on-primary);\n --checkbox-foreground-default: var(--interface-foreground-default-primary);\n --form-background-default: var(--interface-background-default-primary);\n --form-border-default: var(--interface-border-default-primary);\n --input-background-default: var(--interface-background-default-primary);\n --input-background-disabled: var(--interface-background-disabled-disabled);\n --input-background-hover: var(--interface-background-default-primary-hover);\n --input-border-default: var(--interface-border-default-primary);\n --input-border-disabled: var(--interface-border-disabled-disabled);\n --input-border-focus: var(--interface-border-brand-brand);\n --input-border-hover: var(--interface-border-default-primary);\n --input-foreground-disabled: var(--interface-foreground-disabled-on-disabled);\n --input-foreground-primary: var(--interface-foreground-default-primary);\n --input-foreground-secondary: var(--interface-foreground-default-secondary);\n --input-foreground-tertiary: var(--interface-foreground-default-tertiary);\n --interface-background-brand-primary: var(--brand-600);\n --interface-background-brand-primary-hover: var(--brand-700);\n --interface-background-brand-secondary: var(--brand-950);\n --interface-background-brand-secondary-hover: var(--brand-900);\n --interface-background-default-inverted: var(--ui-white);\n --interface-background-default-inverted-hover: var(--ui-50);\n --interface-background-default-none: var(--ui-transparent);\n --interface-background-default-primary: var(--ui-900);\n --interface-background-default-primary-hover: var(--ui-950);\n --interface-background-default-secondary: var(--ui-950);\n --interface-background-default-secondary-hover: var(--ui-800);\n --interface-background-default-tertiary: var(--ui-800);\n --interface-background-default-tertiary-hover: var(--ui-700);\n --interface-background-disabled-disabled: var(--ui-700);\n --interface-background-validation-danger: var(--ui-danger);\n --interface-background-validation-success: var(--ui-success);\n --interface-background-validation-warning: var(--ui-warning);\n --interface-border-brand-brand: var(--brand-600);\n --interface-border-default-inverted: var(--ui-300);\n --interface-border-default-none: var(--ui-transparent);\n --interface-border-default-primary: var(--ui-700);\n --interface-border-disabled-disabled: var(--ui-700);\n --interface-border-validation-danger: var(--ui-danger);\n --interface-border-validation-success: var(--ui-success);\n --interface-border-validation-warning: var(--ui-warning);\n --interface-foreground-brand-on-primary: var(--brand-950);\n --interface-foreground-brand-on-secondary: var(--brand-50);\n --interface-foreground-brand-primary: var(--brand-600);\n --interface-foreground-brand-secondary: var(--brand-950);\n --interface-foreground-default-inverted: var(--ui-900);\n --interface-foreground-default-primary: var(--ui-white);\n --interface-foreground-default-secondary: var(--ui-200);\n --interface-foreground-default-tertiary: var(--ui-400);\n --interface-foreground-disabled-disabled: var(--ui-700);\n --interface-foreground-disabled-on-disabled: var(--ui-500);\n --interface-foreground-validation-danger: var(--ui-danger);\n --interface-foreground-validation-success: var(--ui-success);\n --interface-foreground-validation-warning: var(--ui-warning);\n --ory-background-default: var(--interface-background-default-primary);\n --ory-border-default: var(--interface-border-default-primary);\n --ory-foreground-default: var(--interface-foreground-default-primary);\n --radio-background-checked: var(--interface-background-brand-primary);\n --radio-background-default: var(--interface-background-default-secondary);\n --radio-border-checked: var(--interface-border-brand-brand);\n --radio-border-default: var(--interface-border-default-primary);\n --radio-foreground-checked: var(--interface-foreground-brand-on-primary);\n --radio-foreground-default: var(--interface-foreground-default-primary);\n --toggle-background-checked: var(--interface-background-brand-primary);\n --toggle-background-default: var(--interface-background-default-secondary);\n --toggle-border-checked: var(--interface-border-default-none);\n --toggle-border-default: var(--interface-border-default-primary);\n --toggle-foreground-checked: var(--interface-foreground-brand-on-primary);\n --toggle-foreground-default: var(--interface-foreground-brand-primary);\n}\n","/* Copyright © 2024 Ory Corp */\n/* SPDX-License-Identifier: Apache-2.0 */\n@import \"../../../tailwind/generated/default-variables.css\";\n\n*, ::before, ::after{\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(147 197 253 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\n\n::backdrop{\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(147 197 253 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\n\n/* ! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com */\n\n/*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: currentColor; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n -moz-tab-size: 4; /* 3 */\n -o-tab-size: 4;\n tab-size: 4; /* 3 */\n font-family: var(--font-sans); /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n letter-spacing: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\ninput:where([type='button']),\ninput:where([type='reset']),\ninput:where([type='submit']) {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\n\ndialog {\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::-moz-placeholder, textarea::-moz-placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n\n[hidden]:where(:not([hidden=\"until-found\"])) {\n display: none;\n}\n.container{\n width: 100%;\n}\n@media (min-width: 640px){\n\n .container{\n max-width: 640px;\n }\n}\n@media (min-width: 768px){\n\n .container{\n max-width: 768px;\n }\n}\n@media (min-width: 1024px){\n\n .container{\n max-width: 1024px;\n }\n}\n@media (min-width: 1280px){\n\n .container{\n max-width: 1280px;\n }\n}\n@media (min-width: 1536px){\n\n .container{\n max-width: 1536px;\n }\n}\n.pointer-events-none{\n pointer-events: none;\n}\n.visible{\n visibility: visible;\n}\n.invisible{\n visibility: hidden;\n}\n.fixed{\n position: fixed;\n}\n.absolute{\n position: absolute;\n}\n.relative{\n position: relative;\n}\n.inset-0{\n inset: 0px;\n}\n.right-0{\n right: 0px;\n}\n.z-50{\n z-index: 50;\n}\n.col-span-2{\n grid-column: span 2 / span 2;\n}\n.col-span-full{\n grid-column: 1 / -1;\n}\n.-m-3{\n margin: -0.75rem;\n}\n.m-auto{\n margin: auto;\n}\n.ml-auto{\n margin-left: auto;\n}\n.mr-auto{\n margin-right: auto;\n}\n.mt-1{\n margin-top: 0.25rem;\n}\n.mt-16{\n margin-top: 4rem;\n}\n.block{\n display: block;\n}\n.inline-block{\n display: inline-block;\n}\n.flex{\n display: flex;\n}\n.inline-flex{\n display: inline-flex;\n}\n.grid{\n display: grid;\n}\n.list-item{\n display: list-item;\n}\n.hidden{\n display: none;\n}\n.aspect-square{\n aspect-ratio: 1 / 1;\n}\n.size-10{\n width: 2.5rem;\n height: 2.5rem;\n}\n.size-2{\n width: 0.5rem;\n height: 0.5rem;\n}\n.size-4{\n width: 1rem;\n height: 1rem;\n}\n.size-5{\n width: 1.25rem;\n height: 1.25rem;\n}\n.size-8{\n width: 2rem;\n height: 2rem;\n}\n.size-full{\n width: 100%;\n height: 100%;\n}\n.h-4{\n height: 1rem;\n}\n.h-44{\n height: 11rem;\n}\n.h-5{\n height: 1.25rem;\n}\n.h-9{\n height: 2.25rem;\n}\n.h-full{\n height: 100%;\n}\n.max-h-10{\n max-height: 2.5rem;\n}\n.max-h-9{\n max-height: 2.25rem;\n}\n.min-h-5{\n min-height: 1.25rem;\n}\n.min-h-\\[72px\\]{\n min-height: 72px;\n}\n.w-12{\n width: 3rem;\n}\n.w-7{\n width: 1.75rem;\n}\n.w-full{\n width: 100%;\n}\n.w-px{\n width: 1px;\n}\n.min-w-1{\n min-width: 0.25rem;\n}\n.min-w-\\[19rem\\]{\n min-width: 19rem;\n}\n.max-w-\\[488px\\]{\n max-width: 488px;\n}\n.max-w-\\[60\\%\\]{\n max-width: 60%;\n}\n.max-w-full{\n max-width: 100%;\n}\n.max-w-screen-sm{\n max-width: 640px;\n}\n.flex-1{\n flex: 1 1 0%;\n}\n.shrink-0{\n flex-shrink: 0;\n}\n.grow{\n flex-grow: 1;\n}\n.transform{\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n@keyframes caret-blink{\n\n 0%,70%,100%{\n opacity: 1;\n }\n\n 20%,50%{\n opacity: 0;\n }\n}\n.animate-caret-blink{\n animation: caret-blink 1.25s ease-out infinite;\n}\n@keyframes spin{\n\n to{\n transform: rotate(360deg);\n }\n}\n.animate-spin{\n animation: spin 1s linear infinite;\n}\n.cursor-pointer{\n cursor: pointer;\n}\n.select-none{\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n}\n.appearance-none{\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n}\n.grid-cols-1{\n grid-template-columns: repeat(1, minmax(0, 1fr));\n}\n.grid-cols-2{\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\n.grid-cols-3{\n grid-template-columns: repeat(3, minmax(0, 1fr));\n}\n.grid-cols-4{\n grid-template-columns: repeat(4, minmax(0, 1fr));\n}\n.flex-col{\n flex-direction: column;\n}\n.flex-wrap{\n flex-wrap: wrap;\n}\n.items-start{\n align-items: flex-start;\n}\n.items-end{\n align-items: flex-end;\n}\n.items-center{\n align-items: center;\n}\n.justify-center{\n justify-content: center;\n}\n.justify-between{\n justify-content: space-between;\n}\n.justify-stretch{\n justify-content: stretch;\n}\n.gap-1{\n gap: 0.25rem;\n}\n.gap-12{\n gap: 3rem;\n}\n.gap-2{\n gap: 0.5rem;\n}\n.gap-3{\n gap: 0.75rem;\n}\n.gap-4{\n gap: 1rem;\n}\n.gap-6{\n gap: 1.5rem;\n}\n.gap-8{\n gap: 2rem;\n}\n.self-start{\n align-self: flex-start;\n}\n.self-stretch{\n align-self: stretch;\n}\n.overflow-hidden{\n overflow: hidden;\n}\n.truncate{\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.text-ellipsis{\n text-overflow: ellipsis;\n}\n.text-nowrap{\n text-wrap: nowrap;\n}\n.break-words{\n overflow-wrap: break-word;\n}\n.rounded-\\[999px\\]{\n border-radius: 999px;\n}\n.rounded-buttons{\n border-radius: var(--border-radius-buttons);\n}\n.rounded-cards{\n border-radius: var(--border-radius-cards);\n}\n.rounded-forms{\n border-radius: var(--border-radius-forms);\n}\n.rounded-general{\n border-radius: var(--border-radius-general);\n}\n.rounded-identifier{\n border-radius: var(--border-radius-identifier);\n}\n.rounded-b-cards{\n border-bottom-right-radius: var(--border-radius-cards);\n border-bottom-left-radius: var(--border-radius-cards);\n}\n.rounded-t-cards{\n border-top-left-radius: var(--border-radius-cards);\n border-top-right-radius: var(--border-radius-cards);\n}\n.border{\n border-width: 1px;\n}\n.border-b{\n border-bottom-width: 1px;\n}\n.border-b-0{\n border-bottom-width: 0px;\n}\n.border-t{\n border-top-width: 1px;\n}\n.border-solid{\n border-style: solid;\n}\n.border-button-identifier-border-border-default{\n border-color: var(--button-identifier-border-border-default);\n}\n.border-button-secondary-border-default{\n border-color: var(--button-secondary-border-default);\n}\n.border-button-social-border-default{\n border-color: var(--button-social-border-default);\n}\n.border-button-social-border-generic-provider{\n border-color: var(--button-social-border-generic-provider);\n}\n.border-checkbox-border-checkbox-border-default{\n border-color: var(--checkbox-border-checkbox-border-default);\n}\n.border-form-border-default{\n border-color: var(--form-border-default);\n}\n.border-input-border-default{\n border-color: var(--input-border-default);\n}\n.border-input-border-focus{\n border-color: var(--input-border-focus);\n}\n.border-interface-border-default-primary{\n border-color: var(--interface-border-default-primary);\n}\n.border-interface-border-validation-danger{\n border-color: var(--interface-border-validation-danger);\n}\n.border-ory-border-default{\n border-color: var(--ory-border-default);\n}\n.border-toggle-border-default{\n border-color: var(--toggle-border-default);\n}\n.bg-\\[white\\]{\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bg-button-identifier-background-default{\n background-color: var(--button-identifier-background-default);\n}\n.bg-button-primary-background-default{\n background-color: var(--button-primary-background-default);\n}\n.bg-button-secondary-background-default{\n background-color: var(--button-secondary-background-default);\n}\n.bg-button-social-background-default{\n background-color: var(--button-social-background-default);\n}\n.bg-button-social-background-generic-provider{\n background-color: var(--button-social-background-generic-provider);\n}\n.bg-checkbox-background-default{\n background-color: var(--checkbox-background-default);\n}\n.bg-form-background-default{\n background-color: var(--form-background-default);\n}\n.bg-input-background-default{\n background-color: var(--input-background-default);\n}\n.bg-interface-background-brand-primary{\n background-color: var(--interface-background-brand-primary);\n}\n.bg-interface-background-default-inverted{\n background-color: var(--interface-background-default-inverted);\n}\n.bg-interface-background-default-primary{\n background-color: var(--interface-background-default-primary);\n}\n.bg-interface-background-default-secondary{\n background-color: var(--interface-background-default-secondary);\n}\n.bg-ory-background-default{\n background-color: var(--ory-background-default);\n}\n.bg-toggle-background-default{\n background-color: var(--toggle-background-default);\n}\n.bg-toggle-foreground-default{\n background-color: var(--toggle-foreground-default);\n}\n.fill-checkbox-foreground-checked{\n fill: var(--checkbox-foreground-checked);\n}\n.object-contain{\n -o-object-fit: contain;\n object-fit: contain;\n}\n.p-2{\n padding: 0.5rem;\n}\n.p-4{\n padding: 1rem;\n}\n.p-5{\n padding: 1.25rem;\n}\n.p-6{\n padding: 1.5rem;\n}\n.p-8{\n padding: 2rem;\n}\n.p-\\[3px\\]{\n padding: 3px;\n}\n.px-2{\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-4{\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-5{\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n}\n.px-6{\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\n.px-8{\n padding-left: 2rem;\n padding-right: 2rem;\n}\n.px-\\[11px\\]{\n padding-left: 11px;\n padding-right: 11px;\n}\n.py-1\\.5{\n padding-top: 0.375rem;\n padding-bottom: 0.375rem;\n}\n.py-12{\n padding-top: 3rem;\n padding-bottom: 3rem;\n}\n.py-3{\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n}\n.py-4{\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\n.py-4\\.5{\n padding-top: 1.125rem;\n padding-bottom: 1.125rem;\n}\n.py-8{\n padding-top: 2rem;\n padding-bottom: 2rem;\n}\n.py-\\[13px\\]{\n padding-top: 13px;\n padding-bottom: 13px;\n}\n.py-\\[15px\\]{\n padding-top: 15px;\n padding-bottom: 15px;\n}\n.py-\\[5px\\]{\n padding-top: 5px;\n padding-bottom: 5px;\n}\n.pl-8{\n padding-left: 2rem;\n}\n.text-left{\n text-align: left;\n}\n.text-center{\n text-align: center;\n}\n.font-sans{\n font-family: var(--font-sans);\n}\n.text-lg{\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\n.text-sm{\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\n.text-xl{\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\n.text-xs{\n font-size: 0.75rem;\n line-height: 1rem;\n}\n.font-bold{\n font-weight: 700;\n}\n.font-medium{\n font-weight: 500;\n}\n.font-normal{\n font-weight: 400;\n}\n.font-semibold{\n font-weight: 600;\n}\n.leading-none{\n line-height: 1;\n}\n.leading-normal{\n line-height: 1.5;\n}\n.leading-tight{\n line-height: 1.25;\n}\n.text-button-identifier-foreground-default{\n color: var(--button-identifier-foreground-default);\n}\n.text-button-link-brand-brand{\n color: var(--button-link-brand-brand);\n}\n.text-button-link-default-primary{\n color: var(--button-link-default-primary);\n}\n.text-button-link-default-secondary{\n color: var(--button-link-default-secondary);\n}\n.text-button-primary-foreground-default{\n color: var(--button-primary-foreground-default);\n}\n.text-button-secondary-foreground-default{\n color: var(--button-secondary-foreground-default);\n}\n.text-button-social-foreground-default{\n color: var(--button-social-foreground-default);\n}\n.text-button-social-foreground-generic-provider{\n color: var(--button-social-foreground-generic-provider);\n}\n.text-input-foreground-primary{\n color: var(--input-foreground-primary);\n}\n.text-interface-foreground-brand-primary{\n color: var(--interface-foreground-brand-primary);\n}\n.text-interface-foreground-default-inverted{\n color: var(--interface-foreground-default-inverted);\n}\n.text-interface-foreground-default-primary{\n color: var(--interface-foreground-default-primary);\n}\n.text-interface-foreground-default-secondary{\n color: var(--interface-foreground-default-secondary);\n}\n.text-interface-foreground-default-tertiary{\n color: var(--interface-foreground-default-tertiary);\n}\n.text-interface-foreground-validation-danger{\n color: var(--interface-foreground-validation-danger);\n}\n.text-interface-foreground-validation-success{\n color: var(--interface-foreground-validation-success);\n}\n.text-interface-foreground-validation-warning{\n color: var(--interface-foreground-validation-warning);\n}\n.text-ory-foreground-default{\n color: var(--ory-foreground-default);\n}\n.underline{\n text-decoration-line: underline;\n}\n.antialiased{\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.mix-blend-multiply{\n mix-blend-mode: multiply;\n}\n.outline-none{\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.ring-1{\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.ring-inset{\n --tw-ring-inset: inset;\n}\n.ring-button-primary-border-default{\n --tw-ring-color: var(--button-primary-border-default);\n}\n.ring-button-secondary-border-default{\n --tw-ring-color: var(--button-secondary-border-default);\n}\n.filter{\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.transition{\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-all{\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-colors{\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.duration-100{\n transition-duration: 100ms;\n}\n.duration-700{\n transition-duration: 700ms;\n}\n.ease-linear{\n transition-timing-function: linear;\n}\n@keyframes enter{\n\n from{\n opacity: var(--tw-enter-opacity, 1);\n transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));\n }\n}\n@keyframes exit{\n\n to{\n opacity: var(--tw-exit-opacity, 1);\n transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0));\n }\n}\n.duration-100{\n animation-duration: 100ms;\n}\n.duration-700{\n animation-duration: 700ms;\n}\n.ease-linear{\n animation-timing-function: linear;\n}\n.running{\n animation-play-state: running;\n}\n.placeholder\\:h-\\[20px\\]::-moz-placeholder{\n height: 20px;\n}\n.placeholder\\:h-\\[20px\\]::placeholder{\n height: 20px;\n}\n.placeholder\\:text-input-foreground-tertiary::-moz-placeholder{\n color: var(--input-foreground-tertiary);\n}\n.placeholder\\:text-input-foreground-tertiary::placeholder{\n color: var(--input-foreground-tertiary);\n}\n.first\\:border-0:first-child{\n border-width: 0px;\n}\n.checked\\:border-checkbox-border-checkbox-border-checked:checked{\n border-color: var(--checkbox-border-checkbox-border-checked);\n}\n.checked\\:bg-checkbox-background-checked:checked{\n background-color: var(--checkbox-background-checked);\n}\n.hover\\:border-button-identifier-border-border-hover:hover{\n border-color: var(--button-identifier-border-border-hover);\n}\n.hover\\:border-button-social-border-hover:hover{\n border-color: var(--button-social-border-hover);\n}\n.hover\\:border-input-border-hover:hover{\n border-color: var(--input-border-hover);\n}\n.hover\\:bg-button-identifier-background-hover:hover{\n background-color: var(--button-identifier-background-hover);\n}\n.hover\\:bg-button-primary-background-hover:hover{\n background-color: var(--button-primary-background-hover);\n}\n.hover\\:bg-button-secondary-background-hover:hover{\n background-color: var(--button-secondary-background-hover);\n}\n.hover\\:bg-button-social-background-hover:hover{\n background-color: var(--button-social-background-hover);\n}\n.hover\\:bg-input-background-hover:hover{\n background-color: var(--input-background-hover);\n}\n.hover\\:bg-interface-background-default-primary-hover:hover{\n background-color: var(--interface-background-default-primary-hover);\n}\n.hover\\:text-button-link-brand-brand-hover:hover{\n color: var(--button-link-brand-brand-hover);\n}\n.hover\\:text-button-link-default-primary-hover:hover{\n color: var(--button-link-default-primary-hover);\n}\n.hover\\:text-button-link-default-secondary-hover:hover{\n color: var(--button-link-default-secondary-hover);\n}\n.hover\\:text-button-primary-foreground-hover:hover{\n color: var(--button-primary-foreground-hover);\n}\n.hover\\:text-button-secondary-foreground-hover:hover{\n color: var(--button-secondary-foreground-hover);\n}\n.hover\\:text-button-social-foreground-hover:hover{\n color: var(--button-social-foreground-hover);\n}\n.hover\\:ring-button-primary-border-hover:hover{\n --tw-ring-color: var(--button-primary-border-hover);\n}\n.hover\\:ring-button-secondary-border-hover:hover{\n --tw-ring-color: var(--button-secondary-border-hover);\n}\n.focus\\:border-input-border-focus:focus{\n border-color: var(--input-border-focus);\n}\n.focus\\:ring-0:focus{\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.focus-visible\\:border-input-border-focus:focus-visible{\n border-color: var(--input-border-focus);\n}\n.focus-visible\\:outline-none:focus-visible{\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\n.disabled\\:cursor-default:disabled{\n cursor: default;\n}\n.disabled\\:cursor-not-allowed:disabled{\n cursor: not-allowed;\n}\n.disabled\\:border-input-border-disabled:disabled{\n border-color: var(--input-border-disabled);\n}\n.disabled\\:bg-button-primary-background-disabled:disabled{\n background-color: var(--button-primary-background-disabled);\n}\n.disabled\\:bg-button-secondary-background-disabled:disabled{\n background-color: var(--button-secondary-background-disabled);\n}\n.disabled\\:bg-input-background-disabled:disabled{\n background-color: var(--input-background-disabled);\n}\n.disabled\\:text-button-primary-foreground-disabled:disabled{\n color: var(--button-primary-foreground-disabled);\n}\n.disabled\\:text-button-secondary-foreground-disabled:disabled{\n color: var(--button-secondary-foreground-disabled);\n}\n.disabled\\:text-input-foreground-disabled:disabled{\n color: var(--input-foreground-disabled);\n}\n.disabled\\:opacity-50:disabled{\n opacity: 0.5;\n}\n.disabled\\:ring-button-primary-border-disabled:disabled{\n --tw-ring-color: var(--button-primary-border-disabled);\n}\n.disabled\\:ring-button-secondary-border-disabled:disabled{\n --tw-ring-color: var(--button-secondary-border-disabled);\n}\n.disabled\\:hover\\:bg-ui-transparent:hover:disabled{\n background-color: var(--ui-transparent);\n}\n.group:hover .group-hover\\:text-button-identifier-foreground-hover{\n color: var(--button-identifier-foreground-hover);\n}\n.peer:checked ~ .peer-checked\\:block{\n display: block;\n}\n.has-\\[\\:disabled\\]\\:opacity-50:has(:disabled){\n opacity: 0.5;\n}\n.data-\\[disabled\\]\\:pointer-events-none[data-disabled]{\n pointer-events: none;\n}\n.data-\\[state\\=checked\\]\\:translate-x-3[data-state=\"checked\"]{\n --tw-translate-x: 0.75rem;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.data-\\[state\\=checked\\]\\:border-toggle-border-checked[data-state=\"checked\"]{\n border-color: var(--toggle-border-checked);\n}\n.data-\\[disabled\\]\\:bg-button-secondary-background-disabled[data-disabled]{\n background-color: var(--button-secondary-background-disabled);\n}\n.