@ory/elements-react 1.0.0 → 1.2.0-rc.0

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,1727 +1,1905 @@
1
- /* tailwind/generated/default-variables.css */
2
- :root {
3
- --ui-100: #f1f5f9;
4
- --ui-200: #e2e8f0;
5
- --ui-300: #cbd5e1;
6
- --ui-400: #94a3b8;
7
- --ui-50: #f8fafc;
8
- --ui-500: #64748b;
9
- --ui-600: #475569;
10
- --ui-700: #334155;
11
- --ui-800: #1e293b;
12
- --ui-900: #0f172a;
13
- --ui-950: #020617;
14
- --ui-black: #000000;
15
- --ui-danger: #dc2626;
16
- --ui-success: #22c55e;
17
- --ui-transparent: #ffffff00;
18
- --ui-warning: #eab308;
19
- --ui-white: #ffffff;
20
- --button-identifier-background-default: var( --interface-background-brand-secondary );
21
- --button-identifier-background-hover: var( --interface-background-brand-secondary-hover );
22
- --button-identifier-border-border-default: var( --interface-border-brand-brand );
23
- --button-identifier-border-border-hover: var(--interface-border-brand-brand);
24
- --button-identifier-foreground-default: var( --interface-foreground-brand-on-secondary );
25
- --button-identifier-foreground-hover: var( --interface-foreground-brand-on-secondary );
26
- --button-link-brand-brand: var(--interface-foreground-brand-primary);
27
- --button-link-brand-brand-hover: var(--interface-foreground-default-primary);
28
- --button-link-default-primary: var(--interface-foreground-default-primary);
29
- --button-link-default-primary-hover: var( --interface-foreground-brand-primary );
30
- --button-link-default-secondary: var( --interface-foreground-default-secondary );
31
- --button-link-default-secondary-hover: var( --interface-foreground-default-tertiary );
32
- --button-link-disabled-disabled: var( --interface-foreground-disabled-disabled );
33
- --button-primary-background-default: var( --interface-background-brand-primary );
34
- --button-primary-background-disabled: var( --interface-background-disabled-disabled );
35
- --button-primary-background-hover: var( --interface-background-brand-primary-hover );
36
- --button-primary-border-default: var(--interface-border-default-none);
37
- --button-primary-border-disabled: var(--interface-border-disabled-disabled);
38
- --button-primary-border-hover: var(--interface-border-default-none);
39
- --button-primary-foreground-default: var( --interface-foreground-brand-on-primary );
40
- --button-primary-foreground-disabled: var( --interface-foreground-disabled-on-disabled );
41
- --button-primary-foreground-hover: var( --interface-foreground-brand-on-primary );
42
- --button-secondary-background-default: var( --interface-background-default-primary );
43
- --button-secondary-background-disabled: var( --interface-background-disabled-disabled );
44
- --button-secondary-background-hover: var( --interface-background-default-primary-hover );
45
- --button-secondary-border-default: var(--interface-border-default-primary);
46
- --button-secondary-border-disabled: var(--interface-border-disabled-disabled);
47
- --button-secondary-border-hover: var(--interface-border-default-primary);
48
- --button-secondary-foreground-default: var( --interface-foreground-default-primary );
49
- --button-secondary-foreground-disabled: var( --interface-foreground-disabled-on-disabled );
50
- --button-secondary-foreground-hover: var( --interface-foreground-default-secondary );
51
- --button-social-background-default: var( --interface-background-default-primary );
52
- --button-social-background-disabled: var( --interface-background-disabled-disabled );
53
- --button-social-background-generic-provider: var( --interface-background-default-inverted );
54
- --button-social-background-hover: var( --interface-background-default-primary-hover );
55
- --button-social-border-default: var(--interface-border-default-primary);
56
- --button-social-border-disabled: var(--interface-border-disabled-disabled);
57
- --button-social-border-generic-provider: var(--interface-border-default-none);
58
- --button-social-border-hover: var(--interface-border-default-primary);
59
- --button-social-foreground-default: var( --interface-foreground-default-primary );
60
- --button-social-foreground-disabled: var( --interface-foreground-disabled-on-disabled );
61
- --button-social-foreground-generic-provider: var( --interface-foreground-default-inverted );
62
- --button-social-foreground-hover: var( --interface-foreground-default-secondary );
63
- --checkbox-background-checked: var(--interface-background-brand-primary);
64
- --checkbox-background-default: var(--interface-background-default-secondary);
65
- --checkbox-border-checkbox-border-checked: var( --interface-border-brand-brand );
66
- --checkbox-border-checkbox-border-default: var( --interface-border-default-primary );
67
- --checkbox-foreground-checked: var(--interface-foreground-brand-on-primary);
68
- --checkbox-foreground-default: var(--interface-foreground-default-primary);
69
- --form-background-default: var(--interface-background-default-primary);
70
- --form-border-default: var(--interface-border-default-primary);
71
- --input-background-default: var(--interface-background-default-primary);
72
- --input-background-disabled: var(--interface-background-disabled-disabled);
73
- --input-background-hover: var(--interface-background-default-primary-hover);
74
- --input-border-default: var(--interface-border-default-primary);
75
- --input-border-disabled: var(--interface-border-disabled-disabled);
76
- --input-border-focus: var(--interface-border-brand-brand);
77
- --input-border-hover: var(--interface-border-default-primary);
78
- --input-foreground-disabled: var(--interface-foreground-disabled-on-disabled);
79
- --input-foreground-primary: var(--interface-foreground-default-primary);
80
- --input-foreground-secondary: var(--interface-foreground-default-secondary);
81
- --input-foreground-tertiary: var(--interface-foreground-default-tertiary);
82
- --interface-background-brand-primary: var(--brand-500);
83
- --interface-background-brand-primary-hover: var(--brand-400);
84
- --interface-background-brand-secondary: var(--brand-50);
85
- --interface-background-brand-secondary-hover: var(--brand-100);
86
- --interface-background-default-inverted: var(--ui-900);
87
- --interface-background-default-inverted-hover: var(--ui-800);
88
- --interface-background-default-none: var(--ui-transparent);
89
- --interface-background-default-primary: var(--ui-white);
90
- --interface-background-default-primary-hover: var(--ui-50);
91
- --interface-background-default-secondary: var(--ui-50);
92
- --interface-background-default-secondary-hover: var(--ui-200);
93
- --interface-background-default-tertiary: var(--ui-200);
94
- --interface-background-default-tertiary-hover: var(--ui-300);
95
- --interface-background-disabled-disabled: var(--ui-200);
96
- --interface-background-validation-danger: var(--ui-danger);
97
- --interface-background-validation-success: var(--ui-success);
98
- --interface-background-validation-warning: var(--ui-warning);
99
- --interface-border-brand-brand: var(--brand-500);
100
- --interface-border-default-inverted: var(--ui-700);
101
- --interface-border-default-none: var(--ui-transparent);
102
- --interface-border-default-primary: var(--ui-300);
103
- --interface-border-disabled-disabled: var(--ui-300);
104
- --interface-border-validation-danger: var(--ui-danger);
105
- --interface-border-validation-success: var(--ui-success);
106
- --interface-border-validation-warning: var(--ui-warning);
107
- --interface-foreground-brand-on-primary: var(--brand-50);
108
- --interface-foreground-brand-on-secondary: var(--brand-950);
109
- --interface-foreground-brand-primary: var(--brand-500);
110
- --interface-foreground-brand-secondary: var(--brand-50);
111
- --interface-foreground-default-inverted: var(--ui-white);
112
- --interface-foreground-default-primary: var(--ui-900);
113
- --interface-foreground-default-secondary: var(--ui-700);
114
- --interface-foreground-default-tertiary: var(--ui-500);
115
- --interface-foreground-disabled-disabled: var(--ui-300);
116
- --interface-foreground-disabled-on-disabled: var(--ui-400);
117
- --interface-foreground-validation-danger: var(--ui-danger);
118
- --interface-foreground-validation-success: var(--ui-success);
119
- --interface-foreground-validation-warning: var(--ui-warning);
120
- --ory-background-default: var(--interface-background-default-primary);
121
- --ory-border-default: var(--interface-border-default-primary);
122
- --ory-foreground-default: var(--interface-foreground-default-primary);
123
- --radio-background-checked: var(--interface-background-brand-primary);
124
- --radio-background-default: var(--interface-background-default-secondary);
125
- --radio-border-checked: var(--interface-border-brand-brand);
126
- --radio-border-default: var(--interface-border-default-primary);
127
- --radio-foreground-checked: var(--interface-foreground-brand-on-primary);
128
- --radio-foreground-default: var(--interface-foreground-default-primary);
129
- --toggle-background-checked: var(--interface-background-brand-primary);
130
- --toggle-background-default: var(--interface-background-default-secondary);
131
- --toggle-border-checked: var(--interface-border-default-none);
132
- --toggle-border-default: var(--interface-border-default-primary);
133
- --toggle-foreground-checked: var(--interface-foreground-brand-on-primary);
134
- --toggle-foreground-default: var(--interface-foreground-brand-primary);
135
- --brand-100: var(--ui-100);
136
- --brand-200: var(--ui-300);
137
- --brand-300: var(--ui-500);
138
- --brand-400: var(--ui-700);
139
- --brand-50: var(--ui-50);
140
- --brand-500: var(--ui-900);
141
- --brand-600: var(--ui-white);
142
- --brand-700: var(--ui-200);
143
- --brand-800: var(--ui-400);
144
- --brand-900: var(--ui-600);
145
- --brand-950: var(--ui-800);
146
- --border-radius-buttons: 0.25rem;
147
- --border-radius-forms: 0.25rem;
148
- --border-radius-general: 0.25rem;
149
- --border-radius-branding: 0.5rem;
150
- --border-radius-cards: 0.75rem;
151
- --border-radius-identifier: 62.4375rem;
152
- }
153
- [data-theme=dark] {
154
- --button-identifier-background-default: var( --interface-background-brand-secondary );
155
- --button-identifier-background-hover: var( --interface-background-brand-secondary-hover );
156
- --button-identifier-border-border-default: var( --interface-border-brand-brand );
157
- --button-identifier-border-border-hover: var(--interface-border-brand-brand);
158
- --button-identifier-foreground-default: var( --interface-foreground-brand-on-secondary );
159
- --button-identifier-foreground-hover: var( --interface-foreground-brand-on-secondary );
160
- --button-link-brand-brand: var(--interface-foreground-brand-primary);
161
- --button-link-brand-brand-hover: var(--interface-foreground-default-primary);
162
- --button-link-default-primary: var(--interface-foreground-default-primary);
163
- --button-link-default-primary-hover: var( --interface-foreground-brand-primary );
164
- --button-link-default-secondary: var( --interface-foreground-default-secondary );
165
- --button-link-default-secondary-hover: var( --interface-foreground-default-tertiary );
166
- --button-link-disabled-disabled: var( --interface-foreground-disabled-disabled );
167
- --button-primary-background-default: var( --interface-background-brand-primary );
168
- --button-primary-background-disabled: var( --interface-foreground-disabled-disabled );
169
- --button-primary-background-hover: var( --interface-background-brand-primary-hover );
170
- --button-primary-border-default: var(--interface-border-default-none);
171
- --button-primary-border-disabled: var(--interface-border-disabled-disabled);
172
- --button-primary-border-hover: var(--interface-border-default-none);
173
- --button-primary-foreground-default: var( --interface-foreground-brand-on-primary );
174
- --button-primary-foreground-disabled: var( --interface-foreground-disabled-on-disabled );
175
- --button-primary-foreground-hover: var( --interface-foreground-brand-on-primary );
176
- --button-secondary-background-default: var( --interface-background-default-primary );
177
- --button-secondary-background-disabled: var( --interface-background-disabled-disabled );
178
- --button-secondary-background-hover: var( --interface-background-default-primary-hover );
179
- --button-secondary-border-default: var(--interface-border-default-primary);
180
- --button-secondary-border-disabled: var(--interface-border-disabled-disabled);
181
- --button-secondary-border-hover: var(--interface-border-default-primary);
182
- --button-secondary-foreground-default: var( --interface-foreground-default-primary );
183
- --button-secondary-foreground-disabled: var( --interface-foreground-disabled-on-disabled );
184
- --button-secondary-foreground-hover: var( --interface-foreground-default-secondary );
185
- --button-social-background-default: var( --interface-background-default-primary );
186
- --button-social-background-disabled: var( --interface-background-disabled-disabled );
187
- --button-social-background-generic-provider: var( --interface-background-default-inverted );
188
- --button-social-background-hover: var( --interface-background-default-primary-hover );
189
- --button-social-border-default: var(--interface-border-default-primary);
190
- --button-social-border-disabled: var(--interface-border-disabled-disabled);
191
- --button-social-border-generic-provider: var(--interface-border-default-none);
192
- --button-social-border-hover: var(--interface-border-default-primary);
193
- --button-social-foreground-default: var( --interface-foreground-default-primary );
194
- --button-social-foreground-disabled: var( --interface-foreground-disabled-on-disabled );
195
- --button-social-foreground-generic-provider: var( --interface-foreground-default-inverted );
196
- --button-social-foreground-hover: var( --interface-foreground-default-secondary );
197
- --checkbox-background-checked: var(--interface-background-brand-primary);
198
- --checkbox-background-default: var(--interface-background-default-secondary);
199
- --checkbox-border-checkbox-border-checked: var( --interface-border-brand-brand );
200
- --checkbox-border-checkbox-border-default: var( --interface-border-default-primary );
201
- --checkbox-foreground-checked: var(--interface-foreground-brand-on-primary);
202
- --checkbox-foreground-default: var(--interface-foreground-default-primary);
203
- --form-background-default: var(--interface-background-default-primary);
204
- --form-border-default: var(--interface-border-default-primary);
205
- --input-background-default: var(--interface-background-default-primary);
206
- --input-background-disabled: var(--interface-background-disabled-disabled);
207
- --input-background-hover: var(--interface-background-default-primary-hover);
208
- --input-border-default: var(--interface-border-default-primary);
209
- --input-border-disabled: var(--interface-border-disabled-disabled);
210
- --input-border-focus: var(--interface-border-brand-brand);
211
- --input-border-hover: var(--interface-border-default-primary);
212
- --input-foreground-disabled: var(--interface-foreground-disabled-on-disabled);
213
- --input-foreground-primary: var(--interface-foreground-default-primary);
214
- --input-foreground-secondary: var(--interface-foreground-default-secondary);
215
- --input-foreground-tertiary: var(--interface-foreground-default-tertiary);
216
- --interface-background-brand-primary: var(--brand-600);
217
- --interface-background-brand-primary-hover: var(--brand-700);
218
- --interface-background-brand-secondary: var(--brand-950);
219
- --interface-background-brand-secondary-hover: var(--brand-900);
220
- --interface-background-default-inverted: var(--ui-white);
221
- --interface-background-default-inverted-hover: var(--ui-50);
222
- --interface-background-default-none: var(--ui-transparent);
223
- --interface-background-default-primary: var(--ui-900);
224
- --interface-background-default-primary-hover: var(--ui-950);
225
- --interface-background-default-secondary: var(--ui-950);
226
- --interface-background-default-secondary-hover: var(--ui-800);
227
- --interface-background-default-tertiary: var(--ui-800);
228
- --interface-background-default-tertiary-hover: var(--ui-700);
229
- --interface-background-disabled-disabled: var(--ui-700);
230
- --interface-background-validation-danger: var(--ui-danger);
231
- --interface-background-validation-success: var(--ui-success);
232
- --interface-background-validation-warning: var(--ui-warning);
233
- --interface-border-brand-brand: var(--brand-600);
234
- --interface-border-default-inverted: var(--ui-300);
235
- --interface-border-default-none: var(--ui-transparent);
236
- --interface-border-default-primary: var(--ui-700);
237
- --interface-border-disabled-disabled: var(--ui-700);
238
- --interface-border-validation-danger: var(--ui-danger);
239
- --interface-border-validation-success: var(--ui-success);
240
- --interface-border-validation-warning: var(--ui-warning);
241
- --interface-foreground-brand-on-primary: var(--brand-950);
242
- --interface-foreground-brand-on-secondary: var(--brand-50);
243
- --interface-foreground-brand-primary: var(--brand-600);
244
- --interface-foreground-brand-secondary: var(--brand-950);
245
- --interface-foreground-default-inverted: var(--ui-900);
246
- --interface-foreground-default-primary: var(--ui-white);
247
- --interface-foreground-default-secondary: var(--ui-200);
248
- --interface-foreground-default-tertiary: var(--ui-400);
249
- --interface-foreground-disabled-disabled: var(--ui-700);
250
- --interface-foreground-disabled-on-disabled: var(--ui-500);
251
- --interface-foreground-validation-danger: var(--ui-danger);
252
- --interface-foreground-validation-success: var(--ui-success);
253
- --interface-foreground-validation-warning: var(--ui-warning);
254
- --ory-background-default: var(--interface-background-default-primary);
255
- --ory-border-default: var(--interface-border-default-primary);
256
- --ory-foreground-default: var(--interface-foreground-default-primary);
257
- --radio-background-checked: var(--interface-background-brand-primary);
258
- --radio-background-default: var(--interface-background-default-secondary);
259
- --radio-border-checked: var(--interface-border-brand-brand);
260
- --radio-border-default: var(--interface-border-default-primary);
261
- --radio-foreground-checked: var(--interface-foreground-brand-on-primary);
262
- --radio-foreground-default: var(--interface-foreground-default-primary);
263
- --toggle-background-checked: var(--interface-background-brand-primary);
264
- --toggle-background-default: var(--interface-background-default-secondary);
265
- --toggle-border-checked: var(--interface-border-default-none);
266
- --toggle-border-default: var(--interface-border-default-primary);
267
- --toggle-foreground-checked: var(--interface-foreground-brand-on-primary);
268
- --toggle-foreground-default: var(--interface-foreground-brand-primary);
269
- }
270
-
271
1
  /* src/theme/default/global.css */
272
- *,
273
- ::before,
274
- ::after {
275
- --tw-border-spacing-x: 0;
276
- --tw-border-spacing-y: 0;
277
- --tw-translate-x: 0;
278
- --tw-translate-y: 0;
279
- --tw-rotate: 0;
280
- --tw-skew-x: 0;
281
- --tw-skew-y: 0;
282
- --tw-scale-x: 1;
283
- --tw-scale-y: 1;
284
- --tw-pan-x: ;
285
- --tw-pan-y: ;
286
- --tw-pinch-zoom: ;
287
- --tw-scroll-snap-strictness: proximity;
288
- --tw-gradient-from-position: ;
289
- --tw-gradient-via-position: ;
290
- --tw-gradient-to-position: ;
291
- --tw-ordinal: ;
292
- --tw-slashed-zero: ;
293
- --tw-numeric-figure: ;
294
- --tw-numeric-spacing: ;
295
- --tw-numeric-fraction: ;
296
- --tw-ring-inset: ;
297
- --tw-ring-offset-width: 0px;
298
- --tw-ring-offset-color: #fff;
299
- --tw-ring-color: rgb(147 197 253 / 0.5);
300
- --tw-ring-offset-shadow: 0 0 #0000;
301
- --tw-ring-shadow: 0 0 #0000;
302
- --tw-shadow: 0 0 #0000;
303
- --tw-shadow-colored: 0 0 #0000;
304
- --tw-blur: ;
305
- --tw-brightness: ;
306
- --tw-contrast: ;
307
- --tw-grayscale: ;
308
- --tw-hue-rotate: ;
309
- --tw-invert: ;
310
- --tw-saturate: ;
311
- --tw-sepia: ;
312
- --tw-drop-shadow: ;
313
- --tw-backdrop-blur: ;
314
- --tw-backdrop-brightness: ;
315
- --tw-backdrop-contrast: ;
316
- --tw-backdrop-grayscale: ;
317
- --tw-backdrop-hue-rotate: ;
318
- --tw-backdrop-invert: ;
319
- --tw-backdrop-opacity: ;
320
- --tw-backdrop-saturate: ;
321
- --tw-backdrop-sepia: ;
322
- --tw-contain-size: ;
323
- --tw-contain-layout: ;
324
- --tw-contain-paint: ;
325
- --tw-contain-style: ;
326
- }
327
- ::backdrop {
328
- --tw-border-spacing-x: 0;
329
- --tw-border-spacing-y: 0;
330
- --tw-translate-x: 0;
331
- --tw-translate-y: 0;
332
- --tw-rotate: 0;
333
- --tw-skew-x: 0;
334
- --tw-skew-y: 0;
335
- --tw-scale-x: 1;
336
- --tw-scale-y: 1;
337
- --tw-pan-x: ;
338
- --tw-pan-y: ;
339
- --tw-pinch-zoom: ;
340
- --tw-scroll-snap-strictness: proximity;
341
- --tw-gradient-from-position: ;
342
- --tw-gradient-via-position: ;
343
- --tw-gradient-to-position: ;
344
- --tw-ordinal: ;
345
- --tw-slashed-zero: ;
346
- --tw-numeric-figure: ;
347
- --tw-numeric-spacing: ;
348
- --tw-numeric-fraction: ;
349
- --tw-ring-inset: ;
350
- --tw-ring-offset-width: 0px;
351
- --tw-ring-offset-color: #fff;
352
- --tw-ring-color: rgb(147 197 253 / 0.5);
353
- --tw-ring-offset-shadow: 0 0 #0000;
354
- --tw-ring-shadow: 0 0 #0000;
355
- --tw-shadow: 0 0 #0000;
356
- --tw-shadow-colored: 0 0 #0000;
357
- --tw-blur: ;
358
- --tw-brightness: ;
359
- --tw-contrast: ;
360
- --tw-grayscale: ;
361
- --tw-hue-rotate: ;
362
- --tw-invert: ;
363
- --tw-saturate: ;
364
- --tw-sepia: ;
365
- --tw-drop-shadow: ;
366
- --tw-backdrop-blur: ;
367
- --tw-backdrop-brightness: ;
368
- --tw-backdrop-contrast: ;
369
- --tw-backdrop-grayscale: ;
370
- --tw-backdrop-hue-rotate: ;
371
- --tw-backdrop-invert: ;
372
- --tw-backdrop-opacity: ;
373
- --tw-backdrop-saturate: ;
374
- --tw-backdrop-sepia: ;
375
- --tw-contain-size: ;
376
- --tw-contain-layout: ;
377
- --tw-contain-paint: ;
378
- --tw-contain-style: ;
379
- }
380
- *,
381
- ::before,
382
- ::after {
383
- box-sizing: border-box;
384
- border-width: 0;
385
- border-style: solid;
386
- border-color: currentColor;
387
- }
388
- ::before,
389
- ::after {
390
- --tw-content: "";
391
- }
392
- html,
393
- :host {
394
- line-height: 1.5;
395
- -webkit-text-size-adjust: 100%;
396
- -moz-tab-size: 4;
397
- -o-tab-size: 4;
398
- tab-size: 4;
399
- font-family: var(--font-sans);
400
- font-feature-settings: normal;
401
- font-variation-settings: normal;
402
- -webkit-tap-highlight-color: transparent;
403
- }
404
- body {
405
- margin: 0;
406
- line-height: inherit;
407
- }
408
- hr {
409
- height: 0;
410
- color: inherit;
411
- border-top-width: 1px;
412
- }
413
- abbr:where([title]) {
414
- -webkit-text-decoration: underline dotted;
415
- text-decoration: underline dotted;
416
- }
417
- h1,
418
- h2,
419
- h3,
420
- h4,
421
- h5,
422
- h6 {
423
- font-size: inherit;
424
- font-weight: inherit;
425
- }
426
- a {
427
- color: inherit;
428
- text-decoration: inherit;
429
- }
430
- b,
431
- strong {
432
- font-weight: bolder;
433
- }
434
- code,
435
- kbd,
436
- samp,
437
- pre {
438
- font-family:
439
- ui-monospace,
440
- SFMono-Regular,
441
- Menlo,
442
- Monaco,
443
- Consolas,
444
- "Liberation Mono",
445
- "Courier New",
446
- monospace;
447
- font-feature-settings: normal;
448
- font-variation-settings: normal;
449
- font-size: 1em;
450
- }
451
- small {
452
- font-size: 80%;
453
- }
454
- sub,
455
- sup {
456
- font-size: 75%;
457
- line-height: 0;
458
- position: relative;
459
- vertical-align: baseline;
460
- }
461
- sub {
462
- bottom: -0.25em;
463
- }
464
- sup {
465
- top: -0.5em;
466
- }
467
- table {
468
- text-indent: 0;
469
- border-color: inherit;
470
- border-collapse: collapse;
471
- }
472
- button,
473
- input,
474
- optgroup,
475
- select,
476
- textarea {
477
- font-family: inherit;
478
- font-feature-settings: inherit;
479
- font-variation-settings: inherit;
480
- font-size: 100%;
481
- font-weight: inherit;
482
- line-height: inherit;
483
- letter-spacing: inherit;
484
- color: inherit;
485
- margin: 0;
486
- padding: 0;
487
- }
488
- button,
489
- select {
490
- text-transform: none;
491
- }
492
- button,
493
- input:where([type=button]),
494
- input:where([type=reset]),
495
- input:where([type=submit]) {
496
- -webkit-appearance: button;
497
- background-color: transparent;
498
- background-image: none;
499
- }
500
- :-moz-focusring {
501
- outline: auto;
502
- }
503
- :-moz-ui-invalid {
504
- box-shadow: none;
505
- }
506
- progress {
507
- vertical-align: baseline;
508
- }
509
- ::-webkit-inner-spin-button,
510
- ::-webkit-outer-spin-button {
511
- height: auto;
512
- }
513
- [type=search] {
514
- -webkit-appearance: textfield;
515
- outline-offset: -2px;
516
- }
517
- ::-webkit-search-decoration {
518
- -webkit-appearance: none;
519
- }
520
- ::-webkit-file-upload-button {
521
- -webkit-appearance: button;
522
- font: inherit;
523
- }
524
- summary {
525
- display: list-item;
526
- }
527
- blockquote,
528
- dl,
529
- dd,
530
- h1,
531
- h2,
532
- h3,
533
- h4,
534
- h5,
535
- h6,
536
- hr,
537
- figure,
538
- p,
539
- pre {
540
- margin: 0;
541
- }
542
- fieldset {
543
- margin: 0;
544
- padding: 0;
545
- }
546
- legend {
547
- padding: 0;
548
- }
549
- ol,
550
- ul,
551
- menu {
552
- list-style: none;
553
- margin: 0;
554
- padding: 0;
555
- }
556
- dialog {
557
- padding: 0;
558
- }
559
- textarea {
560
- resize: vertical;
561
- }
562
- input::-moz-placeholder,
563
- textarea::-moz-placeholder {
564
- opacity: 1;
565
- color: #9ca3af;
566
- }
567
- input::placeholder,
568
- textarea::placeholder {
569
- opacity: 1;
570
- color: #9ca3af;
571
- }
572
- button,
573
- [role=button] {
574
- cursor: pointer;
575
- }
576
- :disabled {
577
- cursor: default;
578
- }
579
- img,
580
- svg,
581
- video,
582
- canvas,
583
- audio,
584
- iframe,
585
- embed,
586
- object {
587
- display: block;
588
- vertical-align: middle;
589
- }
590
- img,
591
- video {
592
- max-width: 100%;
593
- height: auto;
594
- }
595
- [hidden]:where(:not([hidden=until-found])) {
596
- display: none;
597
- }
598
- .container {
599
- width: 100%;
600
- }
601
- @media (min-width: 640px) {
602
- .container {
603
- max-width: 640px;
2
+ @layer properties;
3
+ @layer ory-elements;
4
+ @layer ory-elements {
5
+ .ory-elements *,
6
+ .ory-elements ::after,
7
+ .ory-elements ::before,
8
+ .ory-elements ::backdrop,
9
+ .ory-elements ::file-selector-button {
10
+ box-sizing: border-box;
11
+ margin: 0;
12
+ padding: 0;
13
+ border: 0 solid;
604
14
  }
605
- }
606
- @media (min-width: 768px) {
607
- .container {
608
- max-width: 768px;
15
+ .ory-elements,
16
+ :host {
17
+ line-height: 1.5;
18
+ -webkit-text-size-adjust: 100%;
19
+ tab-size: 4;
20
+ font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
21
+ font-feature-settings: var(--default-font-feature-settings, normal);
22
+ font-variation-settings: var(--default-font-variation-settings, normal);
23
+ -webkit-tap-highlight-color: transparent;
609
24
  }
610
- }
611
- @media (min-width: 1024px) {
612
- .container {
613
- max-width: 1024px;
25
+ .ory-elements hr {
26
+ height: 0;
27
+ color: inherit;
28
+ border-top-width: 1px;
614
29
  }
615
- }
616
- @media (min-width: 1280px) {
617
- .container {
618
- max-width: 1280px;
30
+ .ory-elements abbr:where([title]) {
31
+ -webkit-text-decoration: underline dotted;
32
+ text-decoration: underline dotted;
619
33
  }
620
- }
621
- @media (min-width: 1536px) {
622
- .container {
623
- max-width: 1536px;
34
+ .ory-elements h1,
35
+ .ory-elements h2,
36
+ .ory-elements h3,
37
+ .ory-elements h4,
38
+ .ory-elements h5,
39
+ .ory-elements h6 {
40
+ font-size: inherit;
41
+ font-weight: inherit;
624
42
  }
625
- }
626
- .pointer-events-none {
627
- pointer-events: none;
628
- }
629
- .visible {
630
- visibility: visible;
631
- }
632
- .invisible {
633
- visibility: hidden;
634
- }
635
- .fixed {
636
- position: fixed;
637
- }
638
- .absolute {
639
- position: absolute;
640
- }
641
- .relative {
642
- position: relative;
643
- }
644
- .inset-0 {
645
- inset: 0px;
646
- }
647
- .right-0 {
648
- right: 0px;
649
- }
650
- .z-50 {
651
- z-index: 50;
652
- }
653
- .col-span-2 {
654
- grid-column: span 2 / span 2;
655
- }
656
- .col-span-full {
657
- grid-column: 1 / -1;
658
- }
659
- .-m-3 {
660
- margin: -0.75rem;
661
- }
662
- .m-auto {
663
- margin: auto;
664
- }
665
- .ml-auto {
666
- margin-left: auto;
667
- }
668
- .mr-auto {
669
- margin-right: auto;
670
- }
671
- .mt-1 {
672
- margin-top: 0.25rem;
673
- }
674
- .mt-16 {
675
- margin-top: 4rem;
676
- }
677
- .block {
678
- display: block;
679
- }
680
- .inline-block {
681
- display: inline-block;
682
- }
683
- .flex {
684
- display: flex;
685
- }
686
- .inline-flex {
687
- display: inline-flex;
688
- }
689
- .grid {
690
- display: grid;
691
- }
692
- .list-item {
693
- display: list-item;
694
- }
695
- .hidden {
696
- display: none;
697
- }
698
- .aspect-square {
699
- aspect-ratio: 1 / 1;
700
- }
701
- .size-10 {
702
- width: 2.5rem;
703
- height: 2.5rem;
704
- }
705
- .size-2 {
706
- width: 0.5rem;
707
- height: 0.5rem;
708
- }
709
- .size-4 {
710
- width: 1rem;
711
- height: 1rem;
712
- }
713
- .size-5 {
714
- width: 1.25rem;
715
- height: 1.25rem;
716
- }
717
- .size-8 {
718
- width: 2rem;
719
- height: 2rem;
720
- }
721
- .size-full {
722
- width: 100%;
723
- height: 100%;
724
- }
725
- .h-4 {
726
- height: 1rem;
727
- }
728
- .h-44 {
729
- height: 11rem;
730
- }
731
- .h-5 {
732
- height: 1.25rem;
733
- }
734
- .h-9 {
735
- height: 2.25rem;
736
- }
737
- .h-full {
738
- height: 100%;
739
- }
740
- .max-h-10 {
741
- max-height: 2.5rem;
742
- }
743
- .max-h-9 {
744
- max-height: 2.25rem;
745
- }
746
- .min-h-5 {
747
- min-height: 1.25rem;
748
- }
749
- .min-h-\[72px\] {
750
- min-height: 72px;
751
- }
752
- .w-12 {
753
- width: 3rem;
754
- }
755
- .w-7 {
756
- width: 1.75rem;
757
- }
758
- .w-full {
759
- width: 100%;
760
- }
761
- .w-px {
762
- width: 1px;
763
- }
764
- .min-w-1 {
765
- min-width: 0.25rem;
766
- }
767
- .min-w-\[19rem\] {
768
- min-width: 19rem;
769
- }
770
- .max-w-\[488px\] {
771
- max-width: 488px;
772
- }
773
- .max-w-\[60\%\] {
774
- max-width: 60%;
775
- }
776
- .max-w-full {
777
- max-width: 100%;
778
- }
779
- .max-w-screen-sm {
780
- max-width: 640px;
781
- }
782
- .flex-1 {
783
- flex: 1 1 0%;
784
- }
785
- .shrink-0 {
786
- flex-shrink: 0;
787
- }
788
- .grow {
789
- flex-grow: 1;
790
- }
791
- .transform {
792
- 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));
793
- }
794
- @keyframes caret-blink {
795
- 0%, 70%, 100% {
43
+ .ory-elements a {
44
+ color: inherit;
45
+ -webkit-text-decoration: inherit;
46
+ text-decoration: inherit;
47
+ }
48
+ .ory-elements b,
49
+ .ory-elements strong {
50
+ font-weight: bolder;
51
+ }
52
+ .ory-elements code,
53
+ .ory-elements kbd,
54
+ .ory-elements samp,
55
+ .ory-elements pre {
56
+ font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
57
+ font-feature-settings: var(--default-mono-font-feature-settings, normal);
58
+ font-variation-settings: var(--default-mono-font-variation-settings, normal);
59
+ font-size: 1em;
60
+ }
61
+ .ory-elements small {
62
+ font-size: 80%;
63
+ }
64
+ .ory-elements sub,
65
+ .ory-elements sup {
66
+ font-size: 75%;
67
+ line-height: 0;
68
+ position: relative;
69
+ vertical-align: baseline;
70
+ }
71
+ .ory-elements sub {
72
+ bottom: -0.25em;
73
+ }
74
+ .ory-elements sup {
75
+ top: -0.5em;
76
+ }
77
+ .ory-elements table {
78
+ text-indent: 0;
79
+ border-color: inherit;
80
+ border-collapse: collapse;
81
+ }
82
+ .ory-elements :-moz-focusring {
83
+ outline: auto;
84
+ }
85
+ .ory-elements progress {
86
+ vertical-align: baseline;
87
+ }
88
+ .ory-elements summary {
89
+ display: list-item;
90
+ }
91
+ .ory-elements ol,
92
+ .ory-elements ul,
93
+ .ory-elements menu {
94
+ list-style: none;
95
+ }
96
+ .ory-elements img,
97
+ .ory-elements svg,
98
+ .ory-elements video,
99
+ .ory-elements canvas,
100
+ .ory-elements audio,
101
+ .ory-elements iframe,
102
+ .ory-elements embed,
103
+ .ory-elements object {
104
+ display: block;
105
+ vertical-align: middle;
106
+ }
107
+ .ory-elements img,
108
+ .ory-elements video {
109
+ max-width: 100%;
110
+ height: auto;
111
+ }
112
+ .ory-elements button,
113
+ .ory-elements input,
114
+ .ory-elements select,
115
+ .ory-elements optgroup,
116
+ .ory-elements textarea,
117
+ .ory-elements ::file-selector-button {
118
+ font: inherit;
119
+ font-feature-settings: inherit;
120
+ font-variation-settings: inherit;
121
+ letter-spacing: inherit;
122
+ color: inherit;
123
+ border-radius: 0;
124
+ background-color: transparent;
796
125
  opacity: 1;
797
126
  }
798
- 20%, 50% {
799
- opacity: 0;
127
+ .ory-elements :where(select:is([multiple], [size])) optgroup {
128
+ font-weight: bolder;
800
129
  }
801
- }
802
- .animate-caret-blink {
803
- animation: caret-blink 1.25s ease-out infinite;
804
- }
805
- @keyframes spin {
806
- to {
807
- transform: rotate(360deg);
130
+ .ory-elements :where(select:is([multiple], [size])) optgroup option {
131
+ padding-inline-start: 20px;
132
+ }
133
+ .ory-elements ::file-selector-button {
134
+ margin-inline-end: 4px;
135
+ }
136
+ .ory-elements ::placeholder {
137
+ opacity: 1;
138
+ }
139
+ @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
140
+ .ory-elements ::placeholder {
141
+ color: currentcolor;
142
+ @supports (color: color-mix(in lab, red, red)) {
143
+ color: color-mix(in oklab, currentcolor 50%, transparent);
144
+ }
145
+ }
146
+ }
147
+ .ory-elements textarea {
148
+ resize: vertical;
149
+ }
150
+ .ory-elements ::-webkit-search-decoration {
151
+ -webkit-appearance: none;
152
+ }
153
+ .ory-elements ::-webkit-date-and-time-value {
154
+ min-height: 1lh;
155
+ text-align: inherit;
156
+ }
157
+ .ory-elements ::-webkit-datetime-edit {
158
+ display: inline-flex;
159
+ }
160
+ .ory-elements ::-webkit-datetime-edit-fields-wrapper {
161
+ padding: 0;
162
+ }
163
+ .ory-elements ::-webkit-datetime-edit,
164
+ .ory-elements ::-webkit-datetime-edit-year-field,
165
+ .ory-elements ::-webkit-datetime-edit-month-field,
166
+ .ory-elements ::-webkit-datetime-edit-day-field,
167
+ .ory-elements ::-webkit-datetime-edit-hour-field,
168
+ .ory-elements ::-webkit-datetime-edit-minute-field,
169
+ .ory-elements ::-webkit-datetime-edit-second-field,
170
+ .ory-elements ::-webkit-datetime-edit-millisecond-field,
171
+ .ory-elements ::-webkit-datetime-edit-meridiem-field {
172
+ padding-block: 0;
173
+ }
174
+ .ory-elements ::-webkit-calendar-picker-indicator {
175
+ line-height: 1;
176
+ }
177
+ .ory-elements :-moz-ui-invalid {
178
+ box-shadow: none;
179
+ }
180
+ .ory-elements button,
181
+ .ory-elements input:where([type=button], [type=reset], [type=submit]),
182
+ .ory-elements ::file-selector-button {
183
+ appearance: button;
184
+ }
185
+ .ory-elements ::-webkit-inner-spin-button,
186
+ .ory-elements ::-webkit-outer-spin-button {
187
+ height: auto;
188
+ }
189
+ .ory-elements [hidden]:where(:not([hidden=until-found])) {
190
+ display: none !important;
808
191
  }
809
192
  }
810
- .animate-spin {
811
- animation: spin 1s linear infinite;
812
- }
813
- .cursor-pointer {
814
- cursor: pointer;
815
- }
816
- .select-none {
817
- -webkit-user-select: none;
818
- -moz-user-select: none;
819
- user-select: none;
820
- }
821
- .appearance-none {
822
- -webkit-appearance: none;
823
- -moz-appearance: none;
824
- appearance: none;
825
- }
826
- .grid-cols-1 {
827
- grid-template-columns: repeat(1, minmax(0, 1fr));
828
- }
829
- .grid-cols-2 {
830
- grid-template-columns: repeat(2, minmax(0, 1fr));
831
- }
832
- .grid-cols-3 {
833
- grid-template-columns: repeat(3, minmax(0, 1fr));
834
- }
835
- .grid-cols-4 {
836
- grid-template-columns: repeat(4, minmax(0, 1fr));
837
- }
838
- .flex-col {
839
- flex-direction: column;
840
- }
841
- .flex-wrap {
842
- flex-wrap: wrap;
843
- }
844
- .items-start {
845
- align-items: flex-start;
846
- }
847
- .items-end {
848
- align-items: flex-end;
849
- }
850
- .items-center {
851
- align-items: center;
852
- }
853
- .justify-center {
854
- justify-content: center;
855
- }
856
- .justify-between {
857
- justify-content: space-between;
858
- }
859
- .justify-stretch {
860
- justify-content: stretch;
861
- }
862
- .gap-1 {
863
- gap: 0.25rem;
864
- }
865
- .gap-12 {
866
- gap: 3rem;
867
- }
868
- .gap-2 {
869
- gap: 0.5rem;
870
- }
871
- .gap-3 {
872
- gap: 0.75rem;
873
- }
874
- .gap-4 {
875
- gap: 1rem;
876
- }
877
- .gap-6 {
878
- gap: 1.5rem;
879
- }
880
- .gap-8 {
881
- gap: 2rem;
882
- }
883
- .self-start {
884
- align-self: flex-start;
885
- }
886
- .self-stretch {
887
- align-self: stretch;
888
- }
889
- .overflow-hidden {
890
- overflow: hidden;
891
- }
892
- .truncate {
893
- overflow: hidden;
894
- text-overflow: ellipsis;
895
- white-space: nowrap;
896
- }
897
- .text-ellipsis {
898
- text-overflow: ellipsis;
899
- }
900
- .text-nowrap {
901
- text-wrap: nowrap;
902
- }
903
- .break-words {
904
- overflow-wrap: break-word;
905
- }
906
- .rounded-\[999px\] {
907
- border-radius: 999px;
908
- }
909
- .rounded-buttons {
910
- border-radius: var(--border-radius-buttons);
911
- }
912
- .rounded-cards {
913
- border-radius: var(--border-radius-cards);
914
- }
915
- .rounded-forms {
916
- border-radius: var(--border-radius-forms);
917
- }
918
- .rounded-general {
919
- border-radius: var(--border-radius-general);
920
- }
921
- .rounded-identifier {
922
- border-radius: var(--border-radius-identifier);
923
- }
924
- .rounded-b-cards {
925
- border-bottom-right-radius: var(--border-radius-cards);
926
- border-bottom-left-radius: var(--border-radius-cards);
927
- }
928
- .rounded-t-cards {
929
- border-top-left-radius: var(--border-radius-cards);
930
- border-top-right-radius: var(--border-radius-cards);
931
- }
932
- .border {
933
- border-width: 1px;
934
- }
935
- .border-b {
936
- border-bottom-width: 1px;
937
- }
938
- .border-b-0 {
939
- border-bottom-width: 0px;
940
- }
941
- .border-t {
942
- border-top-width: 1px;
943
- }
944
- .border-solid {
945
- border-style: solid;
946
- }
947
- .border-button-identifier-border-border-default {
948
- border-color: var(--button-identifier-border-border-default);
949
- }
950
- .border-button-secondary-border-default {
951
- border-color: var(--button-secondary-border-default);
952
- }
953
- .border-button-social-border-default {
954
- border-color: var(--button-social-border-default);
955
- }
956
- .border-button-social-border-generic-provider {
957
- border-color: var(--button-social-border-generic-provider);
958
- }
959
- .border-checkbox-border-checkbox-border-default {
960
- border-color: var(--checkbox-border-checkbox-border-default);
961
- }
962
- .border-form-border-default {
963
- border-color: var(--form-border-default);
964
- }
965
- .border-input-border-default {
966
- border-color: var(--input-border-default);
967
- }
968
- .border-input-border-focus {
969
- border-color: var(--input-border-focus);
970
- }
971
- .border-interface-border-default-primary {
972
- border-color: var(--interface-border-default-primary);
973
- }
974
- .border-interface-border-validation-danger {
975
- border-color: var(--interface-border-validation-danger);
976
- }
977
- .border-ory-border-default {
978
- border-color: var(--ory-border-default);
979
- }
980
- .border-toggle-border-default {
981
- border-color: var(--toggle-border-default);
982
- }
983
- .bg-\[white\] {
984
- --tw-bg-opacity: 1;
985
- background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
986
- }
987
- .bg-button-identifier-background-default {
988
- background-color: var(--button-identifier-background-default);
989
- }
990
- .bg-button-primary-background-default {
991
- background-color: var(--button-primary-background-default);
992
- }
993
- .bg-button-secondary-background-default {
994
- background-color: var(--button-secondary-background-default);
995
- }
996
- .bg-button-social-background-default {
997
- background-color: var(--button-social-background-default);
998
- }
999
- .bg-button-social-background-generic-provider {
1000
- background-color: var(--button-social-background-generic-provider);
1001
- }
1002
- .bg-checkbox-background-default {
1003
- background-color: var(--checkbox-background-default);
1004
- }
1005
- .bg-form-background-default {
1006
- background-color: var(--form-background-default);
1007
- }
1008
- .bg-input-background-default {
1009
- background-color: var(--input-background-default);
1010
- }
1011
- .bg-interface-background-brand-primary {
1012
- background-color: var(--interface-background-brand-primary);
1013
- }
1014
- .bg-interface-background-default-inverted {
1015
- background-color: var(--interface-background-default-inverted);
1016
- }
1017
- .bg-interface-background-default-primary {
1018
- background-color: var(--interface-background-default-primary);
1019
- }
1020
- .bg-interface-background-default-secondary {
1021
- background-color: var(--interface-background-default-secondary);
1022
- }
1023
- .bg-ory-background-default {
1024
- background-color: var(--ory-background-default);
1025
- }
1026
- .bg-toggle-background-default {
1027
- background-color: var(--toggle-background-default);
1028
- }
1029
- .bg-toggle-foreground-default {
1030
- background-color: var(--toggle-foreground-default);
1031
- }
1032
- .fill-checkbox-foreground-checked {
1033
- fill: var(--checkbox-foreground-checked);
1034
- }
1035
- .object-contain {
1036
- -o-object-fit: contain;
1037
- object-fit: contain;
1038
- }
1039
- .p-2 {
1040
- padding: 0.5rem;
1041
- }
1042
- .p-4 {
1043
- padding: 1rem;
1044
- }
1045
- .p-5 {
1046
- padding: 1.25rem;
1047
- }
1048
- .p-6 {
1049
- padding: 1.5rem;
1050
- }
1051
- .p-8 {
1052
- padding: 2rem;
1053
- }
1054
- .p-\[3px\] {
1055
- padding: 3px;
1056
- }
1057
- .px-2 {
1058
- padding-left: 0.5rem;
1059
- padding-right: 0.5rem;
1060
- }
1061
- .px-4 {
1062
- padding-left: 1rem;
1063
- padding-right: 1rem;
1064
- }
1065
- .px-5 {
1066
- padding-left: 1.25rem;
1067
- padding-right: 1.25rem;
1068
- }
1069
- .px-6 {
1070
- padding-left: 1.5rem;
1071
- padding-right: 1.5rem;
1072
- }
1073
- .px-8 {
1074
- padding-left: 2rem;
1075
- padding-right: 2rem;
1076
- }
1077
- .px-\[11px\] {
1078
- padding-left: 11px;
1079
- padding-right: 11px;
1080
- }
1081
- .py-1\.5 {
1082
- padding-top: 0.375rem;
1083
- padding-bottom: 0.375rem;
1084
- }
1085
- .py-12 {
1086
- padding-top: 3rem;
1087
- padding-bottom: 3rem;
1088
- }
1089
- .py-3 {
1090
- padding-top: 0.75rem;
1091
- padding-bottom: 0.75rem;
1092
- }
1093
- .py-4 {
1094
- padding-top: 1rem;
1095
- padding-bottom: 1rem;
1096
- }
1097
- .py-4\.5 {
1098
- padding-top: 1.125rem;
1099
- padding-bottom: 1.125rem;
1100
- }
1101
- .py-8 {
1102
- padding-top: 2rem;
1103
- padding-bottom: 2rem;
1104
- }
1105
- .py-\[13px\] {
1106
- padding-top: 13px;
1107
- padding-bottom: 13px;
1108
- }
1109
- .py-\[15px\] {
1110
- padding-top: 15px;
1111
- padding-bottom: 15px;
1112
- }
1113
- .py-\[5px\] {
1114
- padding-top: 5px;
1115
- padding-bottom: 5px;
1116
- }
1117
- .pl-8 {
1118
- padding-left: 2rem;
1119
- }
1120
- .text-left {
1121
- text-align: left;
1122
- }
1123
- .text-center {
1124
- text-align: center;
1125
- }
1126
- .font-sans {
1127
- font-family: var(--font-sans);
1128
- }
1129
- .text-lg {
1130
- font-size: 1.125rem;
1131
- line-height: 1.75rem;
1132
- }
1133
- .text-sm {
1134
- font-size: 0.875rem;
1135
- line-height: 1.25rem;
1136
- }
1137
- .text-xl {
1138
- font-size: 1.25rem;
1139
- line-height: 1.75rem;
1140
- }
1141
- .text-xs {
1142
- font-size: 0.75rem;
1143
- line-height: 1rem;
1144
- }
1145
- .font-bold {
1146
- font-weight: 700;
1147
- }
1148
- .font-medium {
1149
- font-weight: 500;
1150
- }
1151
- .font-normal {
1152
- font-weight: 400;
1153
- }
1154
- .font-semibold {
1155
- font-weight: 600;
1156
- }
1157
- .leading-none {
1158
- line-height: 1;
1159
- }
1160
- .leading-normal {
1161
- line-height: 1.5;
1162
- }
1163
- .leading-tight {
1164
- line-height: 1.25;
1165
- }
1166
- .text-button-identifier-foreground-default {
1167
- color: var(--button-identifier-foreground-default);
1168
- }
1169
- .text-button-link-brand-brand {
1170
- color: var(--button-link-brand-brand);
1171
- }
1172
- .text-button-link-default-primary {
1173
- color: var(--button-link-default-primary);
1174
- }
1175
- .text-button-link-default-secondary {
1176
- color: var(--button-link-default-secondary);
1177
- }
1178
- .text-button-primary-foreground-default {
1179
- color: var(--button-primary-foreground-default);
1180
- }
1181
- .text-button-secondary-foreground-default {
1182
- color: var(--button-secondary-foreground-default);
1183
- }
1184
- .text-button-social-foreground-default {
1185
- color: var(--button-social-foreground-default);
1186
- }
1187
- .text-button-social-foreground-generic-provider {
1188
- color: var(--button-social-foreground-generic-provider);
1189
- }
1190
- .text-input-foreground-primary {
1191
- color: var(--input-foreground-primary);
1192
- }
1193
- .text-interface-foreground-brand-primary {
1194
- color: var(--interface-foreground-brand-primary);
1195
- }
1196
- .text-interface-foreground-default-inverted {
1197
- color: var(--interface-foreground-default-inverted);
1198
- }
1199
- .text-interface-foreground-default-primary {
1200
- color: var(--interface-foreground-default-primary);
1201
- }
1202
- .text-interface-foreground-default-secondary {
1203
- color: var(--interface-foreground-default-secondary);
1204
- }
1205
- .text-interface-foreground-default-tertiary {
1206
- color: var(--interface-foreground-default-tertiary);
1207
- }
1208
- .text-interface-foreground-validation-danger {
1209
- color: var(--interface-foreground-validation-danger);
1210
- }
1211
- .text-interface-foreground-validation-success {
1212
- color: var(--interface-foreground-validation-success);
1213
- }
1214
- .text-interface-foreground-validation-warning {
1215
- color: var(--interface-foreground-validation-warning);
1216
- }
1217
- .text-ory-foreground-default {
1218
- color: var(--ory-foreground-default);
1219
- }
1220
- .underline {
1221
- text-decoration-line: underline;
1222
- }
1223
- .antialiased {
1224
- -webkit-font-smoothing: antialiased;
1225
- -moz-osx-font-smoothing: grayscale;
1226
- }
1227
- .mix-blend-multiply {
1228
- mix-blend-mode: multiply;
1229
- }
1230
- .outline-none {
1231
- outline: 2px solid transparent;
1232
- outline-offset: 2px;
1233
- }
1234
- .ring-1 {
1235
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1236
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1237
- box-shadow:
1238
- var(--tw-ring-offset-shadow),
1239
- var(--tw-ring-shadow),
1240
- var(--tw-shadow, 0 0 #0000);
1241
- }
1242
- .ring-inset {
1243
- --tw-ring-inset: inset;
1244
- }
1245
- .ring-button-primary-border-default {
1246
- --tw-ring-color: var(--button-primary-border-default);
1247
- }
1248
- .ring-button-secondary-border-default {
1249
- --tw-ring-color: var(--button-secondary-border-default);
1250
- }
1251
- .filter {
1252
- 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);
1253
- }
1254
- .transition {
1255
- transition-property:
1256
- color,
1257
- background-color,
1258
- border-color,
1259
- text-decoration-color,
1260
- fill,
1261
- stroke,
1262
- opacity,
1263
- box-shadow,
1264
- transform,
1265
- filter,
1266
- -webkit-backdrop-filter;
1267
- transition-property:
1268
- color,
1269
- background-color,
1270
- border-color,
1271
- text-decoration-color,
1272
- fill,
1273
- stroke,
1274
- opacity,
1275
- box-shadow,
1276
- transform,
1277
- filter,
1278
- backdrop-filter;
1279
- transition-property:
1280
- color,
1281
- background-color,
1282
- border-color,
1283
- text-decoration-color,
1284
- fill,
1285
- stroke,
1286
- opacity,
1287
- box-shadow,
1288
- transform,
1289
- filter,
1290
- backdrop-filter,
1291
- -webkit-backdrop-filter;
1292
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1293
- transition-duration: 150ms;
1294
- }
1295
- .transition-all {
1296
- transition-property: all;
1297
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1298
- transition-duration: 150ms;
1299
- }
1300
- .transition-colors {
1301
- transition-property:
1302
- color,
1303
- background-color,
1304
- border-color,
1305
- text-decoration-color,
1306
- fill,
1307
- stroke;
1308
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1309
- transition-duration: 150ms;
1310
- }
1311
- .duration-100 {
1312
- transition-duration: 100ms;
1313
- }
1314
- .duration-700 {
1315
- transition-duration: 700ms;
1316
- }
1317
- .ease-linear {
1318
- transition-timing-function: linear;
1319
- }
1320
- @keyframes enter {
1321
- from {
1322
- opacity: var(--tw-enter-opacity, 1);
1323
- 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));
193
+ @layer ory-elements {
194
+ .ory-elements .pointer-events-none {
195
+ pointer-events: none;
196
+ }
197
+ .ory-elements .invisible {
198
+ visibility: hidden;
199
+ }
200
+ .ory-elements .visible {
201
+ visibility: visible;
202
+ }
203
+ .ory-elements .absolute {
204
+ position: absolute;
205
+ }
206
+ .ory-elements .fixed {
207
+ position: fixed;
208
+ }
209
+ .ory-elements .relative {
210
+ position: relative;
211
+ }
212
+ .ory-elements .inset-0 {
213
+ inset: calc(var(--spacing) * 0);
214
+ }
215
+ .ory-elements .right-0 {
216
+ right: calc(var(--spacing) * 0);
217
+ }
218
+ .ory-elements .z-50 {
219
+ z-index: 50;
220
+ }
221
+ .ory-elements .col-span-2 {
222
+ grid-column: span 2 / span 2;
223
+ }
224
+ .ory-elements .col-span-full {
225
+ grid-column: 1 / -1;
226
+ }
227
+ .ory-elements .container {
228
+ width: 100%;
229
+ @media (width >= 40rem) {
230
+ max-width: 40rem;
231
+ }
232
+ @media (width >= 48rem) {
233
+ max-width: 48rem;
234
+ }
235
+ @media (width >= 64rem) {
236
+ max-width: 64rem;
237
+ }
238
+ @media (width >= 80rem) {
239
+ max-width: 80rem;
240
+ }
241
+ @media (width >= 96rem) {
242
+ max-width: 96rem;
243
+ }
244
+ }
245
+ .ory-elements .-m-3 {
246
+ margin: calc(var(--spacing) * -3);
247
+ }
248
+ .ory-elements .m-auto {
249
+ margin: auto;
250
+ }
251
+ .ory-elements .mt-1 {
252
+ margin-top: calc(var(--spacing) * 1);
253
+ }
254
+ .ory-elements .mt-16 {
255
+ margin-top: calc(var(--spacing) * 16);
256
+ }
257
+ .ory-elements .mr-auto {
258
+ margin-right: auto;
259
+ }
260
+ .ory-elements .ml-auto {
261
+ margin-left: auto;
262
+ }
263
+ .ory-elements .block {
264
+ display: block;
265
+ }
266
+ .ory-elements .contents {
267
+ display: contents;
268
+ }
269
+ .ory-elements .flex {
270
+ display: flex;
271
+ }
272
+ .ory-elements .grid {
273
+ display: grid;
274
+ }
275
+ .ory-elements .hidden {
276
+ display: none;
277
+ }
278
+ .ory-elements .inline {
279
+ display: inline;
280
+ }
281
+ .ory-elements .inline-block {
282
+ display: inline-block;
283
+ }
284
+ .ory-elements .inline-flex {
285
+ display: inline-flex;
286
+ }
287
+ .ory-elements .table {
288
+ display: table;
289
+ }
290
+ .ory-elements .aspect-square {
291
+ aspect-ratio: 1 / 1;
292
+ }
293
+ .ory-elements .size-2 {
294
+ width: calc(var(--spacing) * 2);
295
+ height: calc(var(--spacing) * 2);
296
+ }
297
+ .ory-elements .size-4 {
298
+ width: calc(var(--spacing) * 4);
299
+ height: calc(var(--spacing) * 4);
300
+ }
301
+ .ory-elements .size-5 {
302
+ width: calc(var(--spacing) * 5);
303
+ height: calc(var(--spacing) * 5);
304
+ }
305
+ .ory-elements .size-8 {
306
+ width: calc(var(--spacing) * 8);
307
+ height: calc(var(--spacing) * 8);
308
+ }
309
+ .ory-elements .size-10 {
310
+ width: calc(var(--spacing) * 10);
311
+ height: calc(var(--spacing) * 10);
312
+ }
313
+ .ory-elements .size-full {
314
+ width: 100%;
315
+ height: 100%;
316
+ }
317
+ .ory-elements .h-4 {
318
+ height: calc(var(--spacing) * 4);
319
+ }
320
+ .ory-elements .h-5 {
321
+ height: calc(var(--spacing) * 5);
322
+ }
323
+ .ory-elements .h-9 {
324
+ height: calc(var(--spacing) * 9);
325
+ }
326
+ .ory-elements .h-44 {
327
+ height: calc(var(--spacing) * 44);
328
+ }
329
+ .ory-elements .h-full {
330
+ height: 100%;
331
+ }
332
+ .ory-elements .max-h-9 {
333
+ max-height: calc(var(--spacing) * 9);
334
+ }
335
+ .ory-elements .max-h-10 {
336
+ max-height: calc(var(--spacing) * 10);
337
+ }
338
+ .ory-elements .min-h-5 {
339
+ min-height: calc(var(--spacing) * 5);
340
+ }
341
+ .ory-elements .min-h-\[72px\] {
342
+ min-height: 72px;
343
+ }
344
+ .ory-elements .w-7 {
345
+ width: calc(var(--spacing) * 7);
346
+ }
347
+ .ory-elements .w-12 {
348
+ width: calc(var(--spacing) * 12);
349
+ }
350
+ .ory-elements .w-full {
351
+ width: 100%;
352
+ }
353
+ .ory-elements .w-px {
354
+ width: 1px;
355
+ }
356
+ .ory-elements .max-w-\(--breakpoint-sm\) {
357
+ max-width: var(--breakpoint-sm);
358
+ }
359
+ .ory-elements .max-w-\[60\%\] {
360
+ max-width: 60%;
361
+ }
362
+ .ory-elements .max-w-\[488px\] {
363
+ max-width: 488px;
364
+ }
365
+ .ory-elements .max-w-full {
366
+ max-width: 100%;
367
+ }
368
+ .ory-elements .min-w-1 {
369
+ min-width: calc(var(--spacing) * 1);
370
+ }
371
+ .ory-elements .min-w-76 {
372
+ min-width: calc(var(--spacing) * 76);
373
+ }
374
+ .ory-elements .flex-1 {
375
+ flex: 1;
376
+ }
377
+ .ory-elements .shrink-0 {
378
+ flex-shrink: 0;
379
+ }
380
+ .ory-elements .grow {
381
+ flex-grow: 1;
382
+ }
383
+ .ory-elements .origin-top-right {
384
+ transform-origin: top right;
385
+ }
386
+ .ory-elements .transform {
387
+ transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
388
+ }
389
+ .ory-elements .animate-caret-blink {
390
+ animation: var(--animate-caret-blink);
391
+ }
392
+ .ory-elements .animate-drop-down-in {
393
+ animation: var(--animate-drop-down-in);
394
+ }
395
+ .ory-elements .animate-spin {
396
+ animation: var(--animate-spin);
397
+ }
398
+ .ory-elements .cursor-pointer {
399
+ cursor: pointer;
400
+ }
401
+ .ory-elements .appearance-none {
402
+ appearance: none;
403
+ }
404
+ .ory-elements .grid-cols-1 {
405
+ grid-template-columns: repeat(1, minmax(0, 1fr));
406
+ }
407
+ .ory-elements .grid-cols-2 {
408
+ grid-template-columns: repeat(2, minmax(0, 1fr));
409
+ }
410
+ .ory-elements .grid-cols-3 {
411
+ grid-template-columns: repeat(3, minmax(0, 1fr));
412
+ }
413
+ .ory-elements .grid-cols-4 {
414
+ grid-template-columns: repeat(4, minmax(0, 1fr));
415
+ }
416
+ .ory-elements .flex-col {
417
+ flex-direction: column;
418
+ }
419
+ .ory-elements .flex-wrap {
420
+ flex-wrap: wrap;
421
+ }
422
+ .ory-elements .items-center {
423
+ align-items: center;
424
+ }
425
+ .ory-elements .items-end {
426
+ align-items: flex-end;
427
+ }
428
+ .ory-elements .items-start {
429
+ align-items: flex-start;
430
+ }
431
+ .ory-elements .justify-between {
432
+ justify-content: space-between;
433
+ }
434
+ .ory-elements .justify-center {
435
+ justify-content: center;
436
+ }
437
+ .ory-elements .justify-start {
438
+ justify-content: flex-start;
439
+ }
440
+ .ory-elements .justify-stretch {
441
+ justify-content: stretch;
442
+ }
443
+ .ory-elements .gap-1 {
444
+ gap: calc(var(--spacing) * 1);
445
+ }
446
+ .ory-elements .gap-2 {
447
+ gap: calc(var(--spacing) * 2);
448
+ }
449
+ .ory-elements .gap-3 {
450
+ gap: calc(var(--spacing) * 3);
451
+ }
452
+ .ory-elements .gap-4 {
453
+ gap: calc(var(--spacing) * 4);
454
+ }
455
+ .ory-elements .gap-6 {
456
+ gap: calc(var(--spacing) * 6);
457
+ }
458
+ .ory-elements .gap-8 {
459
+ gap: calc(var(--spacing) * 8);
460
+ }
461
+ .ory-elements .gap-12 {
462
+ gap: calc(var(--spacing) * 12);
463
+ }
464
+ .ory-elements .self-start {
465
+ align-self: flex-start;
466
+ }
467
+ .ory-elements .self-stretch {
468
+ align-self: stretch;
469
+ }
470
+ .ory-elements .truncate {
471
+ overflow: hidden;
472
+ text-overflow: ellipsis;
473
+ white-space: nowrap;
474
+ }
475
+ .ory-elements .overflow-hidden {
476
+ overflow: hidden;
477
+ }
478
+ .ory-elements .rounded-\[999px\] {
479
+ border-radius: 999px;
480
+ }
481
+ .ory-elements .rounded-buttons {
482
+ border-radius: var(--radius-buttons);
483
+ }
484
+ .ory-elements .rounded-cards {
485
+ border-radius: var(--radius-cards);
486
+ }
487
+ .ory-elements .rounded-forms {
488
+ border-radius: var(--radius-forms);
489
+ }
490
+ .ory-elements .rounded-general {
491
+ border-radius: var(--radius-general);
492
+ }
493
+ .ory-elements .rounded-identifier {
494
+ border-radius: var(--radius-identifier);
495
+ }
496
+ .ory-elements .rounded-t-cards {
497
+ border-top-left-radius: var(--radius-cards);
498
+ border-top-right-radius: var(--radius-cards);
499
+ }
500
+ .ory-elements .rounded-b-cards {
501
+ border-bottom-right-radius: var(--radius-cards);
502
+ border-bottom-left-radius: var(--radius-cards);
503
+ }
504
+ .ory-elements .border {
505
+ border-style: var(--tw-border-style);
506
+ border-width: 1px;
507
+ }
508
+ .ory-elements .border-t {
509
+ border-top-style: var(--tw-border-style);
510
+ border-top-width: 1px;
511
+ }
512
+ .ory-elements .border-b {
513
+ border-bottom-style: var(--tw-border-style);
514
+ border-bottom-width: 1px;
515
+ }
516
+ .ory-elements .border-b-0 {
517
+ border-bottom-style: var(--tw-border-style);
518
+ border-bottom-width: 0px;
519
+ }
520
+ .ory-elements .border-solid {
521
+ --tw-border-style: solid;
522
+ border-style: solid;
523
+ }
524
+ .ory-elements .border-button-identifier-border-border-default {
525
+ border-color: var(--color-button-identifier-border-border-default);
526
+ }
527
+ .ory-elements .border-button-secondary-border-default {
528
+ border-color: var(--color-button-secondary-border-default);
529
+ }
530
+ .ory-elements .border-button-social-border-default {
531
+ border-color: var(--color-button-social-border-default);
532
+ }
533
+ .ory-elements .border-button-social-border-generic-provider {
534
+ border-color: var(--color-button-social-border-generic-provider);
535
+ }
536
+ .ory-elements .border-checkbox-border-checkbox-border-default {
537
+ border-color: var(--color-checkbox-border-checkbox-border-default);
538
+ }
539
+ .ory-elements .border-form-border-default {
540
+ border-color: var(--color-form-border-default);
541
+ }
542
+ .ory-elements .border-input-border-default {
543
+ border-color: var(--color-input-border-default);
544
+ }
545
+ .ory-elements .border-input-border-focus {
546
+ border-color: var(--color-input-border-focus);
547
+ }
548
+ .ory-elements .border-interface-border-default-primary {
549
+ border-color: var(--color-interface-border-default-primary);
550
+ }
551
+ .ory-elements .border-interface-border-validation-danger {
552
+ border-color: var(--color-interface-border-validation-danger);
553
+ }
554
+ .ory-elements .border-ory-border-default {
555
+ border-color: var(--color-ory-border-default);
556
+ }
557
+ .ory-elements .border-toggle-border-default {
558
+ border-color: var(--color-toggle-border-default);
559
+ }
560
+ .ory-elements .bg-\[white\] {
561
+ background-color: white;
562
+ }
563
+ .ory-elements .bg-button-identifier-background-default {
564
+ background-color: var(--color-button-identifier-background-default);
565
+ }
566
+ .ory-elements .bg-button-primary-background-default {
567
+ background-color: var(--color-button-primary-background-default);
568
+ }
569
+ .ory-elements .bg-button-secondary-background-default {
570
+ background-color: var(--color-button-secondary-background-default);
571
+ }
572
+ .ory-elements .bg-button-social-background-default {
573
+ background-color: var(--color-button-social-background-default);
574
+ }
575
+ .ory-elements .bg-button-social-background-generic-provider {
576
+ background-color: var(--color-button-social-background-generic-provider);
577
+ }
578
+ .ory-elements .bg-checkbox-background-default {
579
+ background-color: var(--color-checkbox-background-default);
580
+ }
581
+ .ory-elements .bg-form-background-default {
582
+ background-color: var(--color-form-background-default);
583
+ }
584
+ .ory-elements .bg-input-background-default {
585
+ background-color: var(--color-input-background-default);
586
+ }
587
+ .ory-elements .bg-interface-background-brand-primary {
588
+ background-color: var(--color-interface-background-brand-primary);
589
+ }
590
+ .ory-elements .bg-interface-background-default-inverted {
591
+ background-color: var(--color-interface-background-default-inverted);
592
+ }
593
+ .ory-elements .bg-interface-background-default-primary {
594
+ background-color: var(--color-interface-background-default-primary);
595
+ }
596
+ .ory-elements .bg-interface-background-default-secondary {
597
+ background-color: var(--color-interface-background-default-secondary);
598
+ }
599
+ .ory-elements .bg-ory-background-default {
600
+ background-color: var(--color-ory-background-default);
601
+ }
602
+ .ory-elements .bg-toggle-background-default {
603
+ background-color: var(--color-toggle-background-default);
604
+ }
605
+ .ory-elements .bg-toggle-foreground-default {
606
+ background-color: var(--color-toggle-foreground-default);
607
+ }
608
+ .ory-elements .fill-checkbox-foreground-checked {
609
+ fill: var(--color-checkbox-foreground-checked);
610
+ }
611
+ .ory-elements .object-contain {
612
+ object-fit: contain;
613
+ }
614
+ .ory-elements .p-2 {
615
+ padding: calc(var(--spacing) * 2);
616
+ }
617
+ .ory-elements .p-4 {
618
+ padding: calc(var(--spacing) * 4);
619
+ }
620
+ .ory-elements .p-6 {
621
+ padding: calc(var(--spacing) * 6);
622
+ }
623
+ .ory-elements .p-8 {
624
+ padding: calc(var(--spacing) * 8);
625
+ }
626
+ .ory-elements .p-\[3px\] {
627
+ padding: 3px;
628
+ }
629
+ .ory-elements .px-2 {
630
+ padding-inline: calc(var(--spacing) * 2);
631
+ }
632
+ .ory-elements .px-4 {
633
+ padding-inline: calc(var(--spacing) * 4);
634
+ }
635
+ .ory-elements .px-5 {
636
+ padding-inline: calc(var(--spacing) * 5);
637
+ }
638
+ .ory-elements .px-6 {
639
+ padding-inline: calc(var(--spacing) * 6);
640
+ }
641
+ .ory-elements .px-8 {
642
+ padding-inline: calc(var(--spacing) * 8);
643
+ }
644
+ .ory-elements .px-\[11px\] {
645
+ padding-inline: 11px;
646
+ }
647
+ .ory-elements .py-1\.5 {
648
+ padding-block: calc(var(--spacing) * 1.5);
649
+ }
650
+ .ory-elements .py-2 {
651
+ padding-block: calc(var(--spacing) * 2);
652
+ }
653
+ .ory-elements .py-3 {
654
+ padding-block: calc(var(--spacing) * 3);
655
+ }
656
+ .ory-elements .py-4 {
657
+ padding-block: calc(var(--spacing) * 4);
1324
658
  }
1325
- }
1326
- @keyframes exit {
1327
- to {
1328
- opacity: var(--tw-exit-opacity, 1);
1329
- 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));
659
+ .ory-elements .py-4\.5 {
660
+ padding-block: calc(var(--spacing) * 4.5);
1330
661
  }
1331
- }
1332
- .duration-100 {
1333
- animation-duration: 100ms;
1334
- }
1335
- .duration-700 {
1336
- animation-duration: 700ms;
1337
- }
1338
- .ease-linear {
1339
- animation-timing-function: linear;
1340
- }
1341
- .running {
1342
- animation-play-state: running;
1343
- }
1344
- .placeholder\:h-\[20px\]::-moz-placeholder {
1345
- height: 20px;
1346
- }
1347
- .placeholder\:h-\[20px\]::placeholder {
1348
- height: 20px;
1349
- }
1350
- .placeholder\:text-input-foreground-tertiary::-moz-placeholder {
1351
- color: var(--input-foreground-tertiary);
1352
- }
1353
- .placeholder\:text-input-foreground-tertiary::placeholder {
1354
- color: var(--input-foreground-tertiary);
1355
- }
1356
- .first\:border-0:first-child {
1357
- border-width: 0px;
1358
- }
1359
- .checked\:border-checkbox-border-checkbox-border-checked:checked {
1360
- border-color: var(--checkbox-border-checkbox-border-checked);
1361
- }
1362
- .checked\:bg-checkbox-background-checked:checked {
1363
- background-color: var(--checkbox-background-checked);
1364
- }
1365
- .hover\:border-button-identifier-border-border-hover:hover {
1366
- border-color: var(--button-identifier-border-border-hover);
1367
- }
1368
- .hover\:border-button-social-border-hover:hover {
1369
- border-color: var(--button-social-border-hover);
1370
- }
1371
- .hover\:border-input-border-hover:hover {
1372
- border-color: var(--input-border-hover);
1373
- }
1374
- .hover\:bg-button-identifier-background-hover:hover {
1375
- background-color: var(--button-identifier-background-hover);
1376
- }
1377
- .hover\:bg-button-primary-background-hover:hover {
1378
- background-color: var(--button-primary-background-hover);
1379
- }
1380
- .hover\:bg-button-secondary-background-hover:hover {
1381
- background-color: var(--button-secondary-background-hover);
1382
- }
1383
- .hover\:bg-button-social-background-hover:hover {
1384
- background-color: var(--button-social-background-hover);
1385
- }
1386
- .hover\:bg-input-background-hover:hover {
1387
- background-color: var(--input-background-hover);
1388
- }
1389
- .hover\:bg-interface-background-default-primary-hover:hover {
1390
- background-color: var(--interface-background-default-primary-hover);
1391
- }
1392
- .hover\:text-button-link-brand-brand-hover:hover {
1393
- color: var(--button-link-brand-brand-hover);
1394
- }
1395
- .hover\:text-button-link-default-primary-hover:hover {
1396
- color: var(--button-link-default-primary-hover);
1397
- }
1398
- .hover\:text-button-link-default-secondary-hover:hover {
1399
- color: var(--button-link-default-secondary-hover);
1400
- }
1401
- .hover\:text-button-primary-foreground-hover:hover {
1402
- color: var(--button-primary-foreground-hover);
1403
- }
1404
- .hover\:text-button-secondary-foreground-hover:hover {
1405
- color: var(--button-secondary-foreground-hover);
1406
- }
1407
- .hover\:text-button-social-foreground-hover:hover {
1408
- color: var(--button-social-foreground-hover);
1409
- }
1410
- .hover\:ring-button-primary-border-hover:hover {
1411
- --tw-ring-color: var(--button-primary-border-hover);
1412
- }
1413
- .hover\:ring-button-secondary-border-hover:hover {
1414
- --tw-ring-color: var(--button-secondary-border-hover);
1415
- }
1416
- .focus\:border-input-border-focus:focus {
1417
- border-color: var(--input-border-focus);
1418
- }
1419
- .focus\:ring-0:focus {
1420
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1421
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1422
- box-shadow:
1423
- var(--tw-ring-offset-shadow),
1424
- var(--tw-ring-shadow),
1425
- var(--tw-shadow, 0 0 #0000);
1426
- }
1427
- .focus-visible\:border-input-border-focus:focus-visible {
1428
- border-color: var(--input-border-focus);
1429
- }
1430
- .focus-visible\:outline-none:focus-visible {
1431
- outline: 2px solid transparent;
1432
- outline-offset: 2px;
1433
- }
1434
- .disabled\:cursor-default:disabled {
1435
- cursor: default;
1436
- }
1437
- .disabled\:cursor-not-allowed:disabled {
1438
- cursor: not-allowed;
1439
- }
1440
- .disabled\:border-input-border-disabled:disabled {
1441
- border-color: var(--input-border-disabled);
1442
- }
1443
- .disabled\:bg-button-primary-background-disabled:disabled {
1444
- background-color: var(--button-primary-background-disabled);
1445
- }
1446
- .disabled\:bg-button-secondary-background-disabled:disabled {
1447
- background-color: var(--button-secondary-background-disabled);
1448
- }
1449
- .disabled\:bg-input-background-disabled:disabled {
1450
- background-color: var(--input-background-disabled);
1451
- }
1452
- .disabled\:text-button-primary-foreground-disabled:disabled {
1453
- color: var(--button-primary-foreground-disabled);
1454
- }
1455
- .disabled\:text-button-secondary-foreground-disabled:disabled {
1456
- color: var(--button-secondary-foreground-disabled);
1457
- }
1458
- .disabled\:text-input-foreground-disabled:disabled {
1459
- color: var(--input-foreground-disabled);
1460
- }
1461
- .disabled\:opacity-50:disabled {
1462
- opacity: 0.5;
1463
- }
1464
- .disabled\:ring-button-primary-border-disabled:disabled {
1465
- --tw-ring-color: var(--button-primary-border-disabled);
1466
- }
1467
- .disabled\:ring-button-secondary-border-disabled:disabled {
1468
- --tw-ring-color: var(--button-secondary-border-disabled);
1469
- }
1470
- .disabled\:hover\:bg-ui-transparent:hover:disabled {
1471
- background-color: var(--ui-transparent);
1472
- }
1473
- .group:hover .group-hover\:text-button-identifier-foreground-hover {
1474
- color: var(--button-identifier-foreground-hover);
1475
- }
1476
- .peer:checked ~ .peer-checked\:block {
1477
- display: block;
1478
- }
1479
- .has-\[\:disabled\]\:opacity-50:has(:disabled) {
1480
- opacity: 0.5;
1481
- }
1482
- .data-\[disabled\]\:pointer-events-none[data-disabled] {
1483
- pointer-events: none;
1484
- }
1485
- .data-\[state\=checked\]\:translate-x-3[data-state=checked] {
1486
- --tw-translate-x: 0.75rem;
1487
- 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));
1488
- }
1489
- .data-\[state\=checked\]\:border-toggle-border-checked[data-state=checked] {
1490
- border-color: var(--toggle-border-checked);
1491
- }
1492
- .data-\[disabled\]\:bg-button-secondary-background-disabled[data-disabled] {
1493
- background-color: var(--button-secondary-background-disabled);
1494
- }
1495
- .data-\[state\=checked\]\:bg-toggle-background-checked[data-state=checked] {
1496
- background-color: var(--toggle-background-checked);
1497
- }
1498
- .data-\[state\=checked\]\:bg-toggle-foreground-checked[data-state=checked] {
1499
- background-color: var(--toggle-foreground-checked);
1500
- }
1501
- .data-\[disabled\]\:text-button-secondary-foreground-disabled[data-disabled] {
1502
- color: var(--button-secondary-foreground-disabled);
1503
- }
1504
- .data-\[state\=open\]\:animate-in[data-state=open] {
1505
- animation-name: enter;
1506
- animation-duration: 150ms;
1507
- --tw-enter-opacity: initial;
1508
- --tw-enter-scale: initial;
1509
- --tw-enter-rotate: initial;
1510
- --tw-enter-translate-x: initial;
1511
- --tw-enter-translate-y: initial;
1512
- }
1513
- .data-\[state\=closed\]\:animate-out[data-state=closed] {
1514
- animation-name: exit;
1515
- animation-duration: 150ms;
1516
- --tw-exit-opacity: initial;
1517
- --tw-exit-scale: initial;
1518
- --tw-exit-rotate: initial;
1519
- --tw-exit-translate-x: initial;
1520
- --tw-exit-translate-y: initial;
1521
- }
1522
- .data-\[state\=closed\]\:fade-out-0[data-state=closed] {
1523
- --tw-exit-opacity: 0;
1524
- }
1525
- .data-\[state\=open\]\:fade-in-0[data-state=open] {
1526
- --tw-enter-opacity: 0;
1527
- }
1528
- .data-\[state\=closed\]\:zoom-out-95[data-state=closed] {
1529
- --tw-exit-scale: .95;
1530
- }
1531
- .data-\[state\=open\]\:zoom-in-95[data-state=open] {
1532
- --tw-enter-scale: .95;
1533
- }
1534
- .data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom] {
1535
- --tw-enter-translate-y: -0.5rem;
1536
- }
1537
- .data-\[side\=left\]\:slide-in-from-right-2[data-side=left] {
1538
- --tw-enter-translate-x: 0.5rem;
1539
- }
1540
- .data-\[side\=right\]\:slide-in-from-left-2[data-side=right] {
1541
- --tw-enter-translate-x: -0.5rem;
1542
- }
1543
- .data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top] {
1544
- --tw-enter-translate-y: 0.5rem;
1545
- }
1546
- .loading\:cursor-wait[data-loading=true] {
1547
- cursor: wait;
1548
- }
1549
- .loading\:border-button-social-border-disabled[data-loading=true] {
1550
- border-color: var(--button-social-border-disabled);
1551
- }
1552
- .loading\:bg-button-primary-background-default[data-loading=true] {
1553
- background-color: var(--button-primary-background-default);
1554
- }
1555
- .loading\:bg-button-secondary-background-default[data-loading=true] {
1556
- background-color: var(--button-secondary-background-default);
1557
- }
1558
- .loading\:bg-button-social-background-disabled[data-loading=true] {
1559
- background-color: var(--button-social-background-disabled);
1560
- }
1561
- .loading\:text-button-primary-foreground-default[data-loading=true] {
1562
- color: var(--button-primary-foreground-default);
1563
- }
1564
- .loading\:text-button-secondary-foreground-default[data-loading=true] {
1565
- color: var(--button-secondary-foreground-default);
1566
- }
1567
- .loading\:text-button-social-foreground-disabled[data-loading=true] {
1568
- color: var(--button-social-foreground-disabled);
1569
- }
1570
- .loading\:ring-button-primary-border-default[data-loading=true] {
1571
- --tw-ring-color: var(--button-primary-border-default);
1572
- }
1573
- .loading\:ring-button-secondary-border-default[data-loading=true] {
1574
- --tw-ring-color: var(--button-secondary-border-default);
1575
- }
1576
- .loading\:before\:pointer-events-none[data-loading=true]::before {
1577
- content: var(--tw-content);
1578
- pointer-events: none;
1579
- }
1580
- .loading\:before\:absolute[data-loading=true]::before {
1581
- content: var(--tw-content);
1582
- position: absolute;
1583
- }
1584
- .loading\:before\:inset-0[data-loading=true]::before {
1585
- content: var(--tw-content);
1586
- inset: 0px;
1587
- }
1588
- .loading\:before\:bg-button-primary-background-default[data-loading=true]::before {
1589
- content: var(--tw-content);
1590
- background-color: var(--button-primary-background-default);
1591
- }
1592
- .loading\:before\:bg-button-secondary-background-default[data-loading=true]::before {
1593
- content: var(--tw-content);
1594
- background-color: var(--button-secondary-background-default);
1595
- }
1596
- .loading\:before\:opacity-80[data-loading=true]::before {
1597
- content: var(--tw-content);
1598
- opacity: 0.8;
1599
- }
1600
- .loading\:before\:content-\[\'\'\][data-loading=true]::before {
1601
- --tw-content: "";
1602
- content: var(--tw-content);
1603
- }
1604
- @media not all and (min-width: 640px) {
1605
- .max-sm\:bottom-0 {
1606
- bottom: 0px;
662
+ .ory-elements .py-8 {
663
+ padding-block: calc(var(--spacing) * 8);
1607
664
  }
1608
- .max-sm\:left-8 {
1609
- left: 2rem;
665
+ .ory-elements .py-12 {
666
+ padding-block: calc(var(--spacing) * 12);
1610
667
  }
1611
- .max-sm\:hidden {
1612
- display: none;
668
+ .ory-elements .py-\[5px\] {
669
+ padding-block: 5px;
1613
670
  }
1614
- .max-sm\:translate-y-full {
1615
- --tw-translate-y: 100%;
1616
- 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));
671
+ .ory-elements .py-\[13px\] {
672
+ padding-block: 13px;
1617
673
  }
1618
- .max-sm\:rounded-b-branding {
1619
- border-bottom-right-radius: var(--border-radius-branding);
1620
- border-bottom-left-radius: var(--border-radius-branding);
674
+ .ory-elements .py-\[15px\] {
675
+ padding-block: 15px;
1621
676
  }
1622
- .max-sm\:py-\[7px\] {
1623
- padding-top: 7px;
1624
- padding-bottom: 7px;
677
+ .ory-elements .pb-12 {
678
+ padding-bottom: calc(var(--spacing) * 12);
1625
679
  }
1626
- }
1627
- @media (min-width: 640px) {
1628
- .sm\:right-0 {
1629
- right: 0px;
680
+ .ory-elements .pl-8 {
681
+ padding-left: calc(var(--spacing) * 8);
1630
682
  }
1631
- .sm\:top-8 {
1632
- top: 2rem;
683
+ .ory-elements .text-center {
684
+ text-align: center;
1633
685
  }
1634
- .sm\:block {
1635
- display: block;
686
+ .ory-elements .text-left {
687
+ text-align: left;
1636
688
  }
1637
- .sm\:hidden {
1638
- display: none;
689
+ .ory-elements .font-sans-default {
690
+ font-family: var(--font-sans-default);
1639
691
  }
1640
- .sm\:w-\[480px\] {
1641
- width: 480px;
692
+ .ory-elements .text-lg {
693
+ font-size: var(--text-lg);
694
+ line-height: var(--tw-leading, var(--text-lg--line-height));
1642
695
  }
1643
- .sm\:max-w-\[480px\] {
1644
- max-width: 480px;
696
+ .ory-elements .text-sm {
697
+ font-size: var(--text-sm);
698
+ line-height: var(--tw-leading, var(--text-sm--line-height));
1645
699
  }
1646
- .sm\:translate-x-full {
1647
- --tw-translate-x: 100%;
1648
- 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));
700
+ .ory-elements .text-xl {
701
+ font-size: var(--text-xl);
702
+ line-height: var(--tw-leading, var(--text-xl--line-height));
1649
703
  }
1650
- .sm\:grid-cols-2 {
1651
- grid-template-columns: repeat(2, minmax(0, 1fr));
704
+ .ory-elements .text-xs {
705
+ font-size: var(--text-xs);
706
+ line-height: var(--tw-leading, var(--text-xs--line-height));
1652
707
  }
1653
- .sm\:grid-cols-3 {
1654
- grid-template-columns: repeat(3, minmax(0, 1fr));
708
+ .ory-elements .leading-none {
709
+ --tw-leading: 1;
710
+ line-height: 1;
1655
711
  }
1656
- .sm\:flex-row {
1657
- flex-direction: row;
712
+ .ory-elements .leading-normal {
713
+ --tw-leading: var(--leading-normal);
714
+ line-height: var(--leading-normal);
1658
715
  }
1659
- .sm\:items-end {
1660
- align-items: flex-end;
716
+ .ory-elements .leading-tight {
717
+ --tw-leading: var(--leading-tight);
718
+ line-height: var(--leading-tight);
1661
719
  }
1662
- .sm\:items-center {
1663
- align-items: center;
720
+ .ory-elements .font-bold {
721
+ --tw-font-weight: var(--font-weight-bold);
722
+ font-weight: var(--font-weight-bold);
1664
723
  }
1665
- .sm\:rounded-cards {
1666
- border-radius: var(--border-radius-cards);
724
+ .ory-elements .font-medium {
725
+ --tw-font-weight: var(--font-weight-medium);
726
+ font-weight: var(--font-weight-medium);
1667
727
  }
1668
- .sm\:rounded-r-branding {
1669
- border-top-right-radius: var(--border-radius-branding);
1670
- border-bottom-right-radius: var(--border-radius-branding);
728
+ .ory-elements .font-normal {
729
+ --tw-font-weight: var(--font-weight-normal);
730
+ font-weight: var(--font-weight-normal);
1671
731
  }
1672
- .sm\:border {
1673
- border-width: 1px;
732
+ .ory-elements .font-semibold {
733
+ --tw-font-weight: var(--font-weight-semibold);
734
+ font-weight: var(--font-weight-semibold);
1674
735
  }
1675
- .sm\:px-12 {
1676
- padding-left: 3rem;
1677
- padding-right: 3rem;
736
+ .ory-elements .text-nowrap {
737
+ text-wrap: nowrap;
1678
738
  }
1679
- .sm\:py-14 {
1680
- padding-top: 3.5rem;
1681
- padding-bottom: 3.5rem;
739
+ .ory-elements .break-words {
740
+ overflow-wrap: break-word;
1682
741
  }
1683
- .sm\:pl-\[7px\] {
1684
- padding-left: 7px;
742
+ .ory-elements .text-ellipsis {
743
+ text-overflow: ellipsis;
1685
744
  }
1686
- }
1687
- @media (min-width: 768px) {
1688
- .md\:max-w-96 {
1689
- max-width: 24rem;
745
+ .ory-elements .text-button-identifier-foreground-default {
746
+ color: var(--color-button-identifier-foreground-default);
1690
747
  }
1691
- .md\:max-w-\[712px\] {
1692
- max-width: 712px;
748
+ .ory-elements .text-button-link-brand-brand {
749
+ color: var(--color-button-link-brand-brand);
1693
750
  }
1694
- .md\:grid-cols-2 {
1695
- grid-template-columns: repeat(2, minmax(0, 1fr));
751
+ .ory-elements .text-button-link-default-primary {
752
+ color: var(--color-button-link-default-primary);
1696
753
  }
1697
- .md\:grid-cols-3 {
1698
- grid-template-columns: repeat(3, minmax(0, 1fr));
754
+ .ory-elements .text-button-link-default-secondary {
755
+ color: var(--color-button-link-default-secondary);
1699
756
  }
1700
- .md\:grid-cols-5 {
1701
- grid-template-columns: repeat(5, minmax(0, 1fr));
757
+ .ory-elements .text-button-primary-foreground-default {
758
+ color: var(--color-button-primary-foreground-default);
1702
759
  }
1703
- .md\:flex-row {
1704
- flex-direction: row;
760
+ .ory-elements .text-button-secondary-foreground-default {
761
+ color: var(--color-button-secondary-foreground-default);
1705
762
  }
1706
- .md\:items-center {
1707
- align-items: center;
763
+ .ory-elements .text-button-social-foreground-default {
764
+ color: var(--color-button-social-foreground-default);
1708
765
  }
1709
- .md\:justify-between {
1710
- justify-content: space-between;
766
+ .ory-elements .text-button-social-foreground-generic-provider {
767
+ color: var(--color-button-social-foreground-generic-provider);
768
+ }
769
+ .ory-elements .text-input-foreground-primary {
770
+ color: var(--color-input-foreground-primary);
771
+ }
772
+ .ory-elements .text-interface-foreground-brand-primary {
773
+ color: var(--color-interface-foreground-brand-primary);
774
+ }
775
+ .ory-elements .text-interface-foreground-default-inverted {
776
+ color: var(--color-interface-foreground-default-inverted);
777
+ }
778
+ .ory-elements .text-interface-foreground-default-primary {
779
+ color: var(--color-interface-foreground-default-primary);
780
+ }
781
+ .ory-elements .text-interface-foreground-default-secondary {
782
+ color: var(--color-interface-foreground-default-secondary);
783
+ }
784
+ .ory-elements .text-interface-foreground-default-tertiary {
785
+ color: var(--color-interface-foreground-default-tertiary);
786
+ }
787
+ .ory-elements .text-interface-foreground-validation-danger {
788
+ color: var(--color-interface-foreground-validation-danger);
789
+ }
790
+ .ory-elements .text-interface-foreground-validation-success {
791
+ color: var(--color-interface-foreground-validation-success);
792
+ }
793
+ .ory-elements .text-interface-foreground-validation-warning {
794
+ color: var(--color-interface-foreground-validation-warning);
795
+ }
796
+ .ory-elements .text-ory-foreground-default {
797
+ color: var(--color-ory-foreground-default);
798
+ }
799
+ .ory-elements .capitalize {
800
+ text-transform: capitalize;
801
+ }
802
+ .ory-elements .underline {
803
+ text-decoration-line: underline;
804
+ }
805
+ .ory-elements .antialiased {
806
+ -webkit-font-smoothing: antialiased;
807
+ -moz-osx-font-smoothing: grayscale;
808
+ }
809
+ .ory-elements .mix-blend-multiply {
810
+ mix-blend-mode: multiply;
811
+ }
812
+ .ory-elements .ring {
813
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
814
+ box-shadow:
815
+ var(--tw-inset-shadow),
816
+ var(--tw-inset-ring-shadow),
817
+ var(--tw-ring-offset-shadow),
818
+ var(--tw-ring-shadow),
819
+ var(--tw-shadow);
820
+ }
821
+ .ory-elements .ring-1 {
822
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
823
+ box-shadow:
824
+ var(--tw-inset-shadow),
825
+ var(--tw-inset-ring-shadow),
826
+ var(--tw-ring-offset-shadow),
827
+ var(--tw-ring-shadow),
828
+ var(--tw-shadow);
829
+ }
830
+ .ory-elements .ring-button-primary-border-default {
831
+ --tw-ring-color: var(--color-button-primary-border-default);
832
+ }
833
+ .ory-elements .ring-button-secondary-border-default {
834
+ --tw-ring-color: var(--color-button-secondary-border-default);
835
+ }
836
+ .ory-elements .outline-hidden {
837
+ --tw-outline-style: none;
838
+ outline-style: none;
839
+ @media (forced-colors: active) {
840
+ outline: 2px solid transparent;
841
+ outline-offset: 2px;
842
+ }
843
+ }
844
+ .ory-elements .filter {
845
+ 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,);
846
+ }
847
+ .ory-elements .transition {
848
+ transition-property:
849
+ color,
850
+ background-color,
851
+ border-color,
852
+ outline-color,
853
+ text-decoration-color,
854
+ fill,
855
+ stroke,
856
+ --tw-gradient-from,
857
+ --tw-gradient-via,
858
+ --tw-gradient-to,
859
+ opacity,
860
+ box-shadow,
861
+ transform,
862
+ translate,
863
+ scale,
864
+ rotate,
865
+ filter,
866
+ -webkit-backdrop-filter,
867
+ backdrop-filter,
868
+ display,
869
+ visibility,
870
+ content-visibility,
871
+ overlay,
872
+ pointer-events;
873
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
874
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
875
+ }
876
+ .ory-elements .transition-all {
877
+ transition-property: all;
878
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
879
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
880
+ }
881
+ .ory-elements .transition-colors {
882
+ transition-property:
883
+ color,
884
+ background-color,
885
+ border-color,
886
+ outline-color,
887
+ text-decoration-color,
888
+ fill,
889
+ stroke,
890
+ --tw-gradient-from,
891
+ --tw-gradient-via,
892
+ --tw-gradient-to;
893
+ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
894
+ transition-duration: var(--tw-duration, var(--default-transition-duration));
895
+ }
896
+ .ory-elements .duration-100 {
897
+ --tw-duration: 100ms;
898
+ transition-duration: 100ms;
899
+ }
900
+ .ory-elements .duration-700 {
901
+ --tw-duration: 700ms;
902
+ transition-duration: 700ms;
903
+ }
904
+ .ory-elements .ease-linear {
905
+ --tw-ease: linear;
906
+ transition-timing-function: linear;
907
+ }
908
+ .ory-elements .will-change-\[opacity\,transform\] {
909
+ will-change: opacity, transform;
910
+ }
911
+ .ory-elements .select-none {
912
+ -webkit-user-select: none;
913
+ user-select: none;
914
+ }
915
+ .ory-elements .ring-inset {
916
+ --tw-ring-inset: inset;
917
+ }
918
+ .ory-elements .group-hover\:text-button-identifier-foreground-hover {
919
+ &:is(:where(.group):hover *) {
920
+ @media (hover: hover) {
921
+ color: var(--color-button-identifier-foreground-hover);
922
+ }
923
+ }
924
+ }
925
+ .ory-elements .peer-checked\:block {
926
+ &:is(:where(.peer):checked ~ *) {
927
+ display: block;
928
+ }
929
+ }
930
+ .ory-elements .placeholder\:h-\[20px\] {
931
+ &::placeholder {
932
+ height: 20px;
933
+ }
934
+ }
935
+ .ory-elements .placeholder\:text-input-foreground-tertiary {
936
+ &::placeholder {
937
+ color: var(--color-input-foreground-tertiary);
938
+ }
939
+ }
940
+ .ory-elements .first\:border-0 {
941
+ &:first-child {
942
+ border-style: var(--tw-border-style);
943
+ border-width: 0px;
944
+ }
945
+ }
946
+ .ory-elements .checked\:border-checkbox-border-checkbox-border-checked {
947
+ &:checked {
948
+ border-color: var(--color-checkbox-border-checkbox-border-checked);
949
+ }
950
+ }
951
+ .ory-elements .checked\:bg-checkbox-background-checked {
952
+ &:checked {
953
+ background-color: var(--color-checkbox-background-checked);
954
+ }
955
+ }
956
+ .ory-elements .hover\:border-button-identifier-border-border-hover {
957
+ &:hover {
958
+ @media (hover: hover) {
959
+ border-color: var(--color-button-identifier-border-border-hover);
960
+ }
961
+ }
962
+ }
963
+ .ory-elements .hover\:border-button-social-border-hover {
964
+ &:hover {
965
+ @media (hover: hover) {
966
+ border-color: var(--color-button-social-border-hover);
967
+ }
968
+ }
969
+ }
970
+ .ory-elements .hover\:border-input-border-hover {
971
+ &:hover {
972
+ @media (hover: hover) {
973
+ border-color: var(--color-input-border-hover);
974
+ }
975
+ }
976
+ }
977
+ .ory-elements .hover\:bg-button-identifier-background-hover {
978
+ &:hover {
979
+ @media (hover: hover) {
980
+ background-color: var(--color-button-identifier-background-hover);
981
+ }
982
+ }
983
+ }
984
+ .ory-elements .hover\:bg-button-primary-background-hover {
985
+ &:hover {
986
+ @media (hover: hover) {
987
+ background-color: var(--color-button-primary-background-hover);
988
+ }
989
+ }
990
+ }
991
+ .ory-elements .hover\:bg-button-secondary-background-hover {
992
+ &:hover {
993
+ @media (hover: hover) {
994
+ background-color: var(--color-button-secondary-background-hover);
995
+ }
996
+ }
997
+ }
998
+ .ory-elements .hover\:bg-button-social-background-hover {
999
+ &:hover {
1000
+ @media (hover: hover) {
1001
+ background-color: var(--color-button-social-background-hover);
1002
+ }
1003
+ }
1004
+ }
1005
+ .ory-elements .hover\:bg-input-background-hover {
1006
+ &:hover {
1007
+ @media (hover: hover) {
1008
+ background-color: var(--color-input-background-hover);
1009
+ }
1010
+ }
1011
+ }
1012
+ .ory-elements .hover\:bg-interface-background-default-primary-hover {
1013
+ &:hover {
1014
+ @media (hover: hover) {
1015
+ background-color: var(--color-interface-background-default-primary-hover);
1016
+ }
1017
+ }
1018
+ }
1019
+ .ory-elements .hover\:text-button-link-brand-brand-hover {
1020
+ &:hover {
1021
+ @media (hover: hover) {
1022
+ color: var(--color-button-link-brand-brand-hover);
1023
+ }
1024
+ }
1025
+ }
1026
+ .ory-elements .hover\:text-button-link-default-primary-hover {
1027
+ &:hover {
1028
+ @media (hover: hover) {
1029
+ color: var(--color-button-link-default-primary-hover);
1030
+ }
1031
+ }
1032
+ }
1033
+ .ory-elements .hover\:text-button-link-default-secondary-hover {
1034
+ &:hover {
1035
+ @media (hover: hover) {
1036
+ color: var(--color-button-link-default-secondary-hover);
1037
+ }
1038
+ }
1039
+ }
1040
+ .ory-elements .hover\:text-button-primary-foreground-hover {
1041
+ &:hover {
1042
+ @media (hover: hover) {
1043
+ color: var(--color-button-primary-foreground-hover);
1044
+ }
1045
+ }
1046
+ }
1047
+ .ory-elements .hover\:text-button-secondary-foreground-hover {
1048
+ &:hover {
1049
+ @media (hover: hover) {
1050
+ color: var(--color-button-secondary-foreground-hover);
1051
+ }
1052
+ }
1053
+ }
1054
+ .ory-elements .hover\:text-button-social-foreground-hover {
1055
+ &:hover {
1056
+ @media (hover: hover) {
1057
+ color: var(--color-button-social-foreground-hover);
1058
+ }
1059
+ }
1060
+ }
1061
+ .ory-elements .hover\:ring-button-primary-border-hover {
1062
+ &:hover {
1063
+ @media (hover: hover) {
1064
+ --tw-ring-color: var(--color-button-primary-border-hover);
1065
+ }
1066
+ }
1067
+ }
1068
+ .ory-elements .hover\:ring-button-secondary-border-hover {
1069
+ &:hover {
1070
+ @media (hover: hover) {
1071
+ --tw-ring-color: var(--color-button-secondary-border-hover);
1072
+ }
1073
+ }
1074
+ }
1075
+ .ory-elements .focus\:border-input-border-focus {
1076
+ &:focus {
1077
+ border-color: var(--color-input-border-focus);
1078
+ }
1079
+ }
1080
+ .ory-elements .focus\:ring-0 {
1081
+ &:focus {
1082
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1083
+ box-shadow:
1084
+ var(--tw-inset-shadow),
1085
+ var(--tw-inset-ring-shadow),
1086
+ var(--tw-ring-offset-shadow),
1087
+ var(--tw-ring-shadow),
1088
+ var(--tw-shadow);
1089
+ }
1090
+ }
1091
+ .ory-elements .focus-visible\:border-input-border-focus {
1092
+ &:focus-visible {
1093
+ border-color: var(--color-input-border-focus);
1094
+ }
1095
+ }
1096
+ .ory-elements .focus-visible\:outline-hidden {
1097
+ &:focus-visible {
1098
+ --tw-outline-style: none;
1099
+ outline-style: none;
1100
+ @media (forced-colors: active) {
1101
+ outline: 2px solid transparent;
1102
+ outline-offset: 2px;
1103
+ }
1104
+ }
1105
+ }
1106
+ .ory-elements .disabled\:cursor-default {
1107
+ &:disabled {
1108
+ cursor: default;
1109
+ }
1110
+ }
1111
+ .ory-elements .disabled\:cursor-not-allowed {
1112
+ &:disabled {
1113
+ cursor: not-allowed;
1114
+ }
1115
+ }
1116
+ .ory-elements .disabled\:border-input-border-disabled {
1117
+ &:disabled {
1118
+ border-color: var(--color-input-border-disabled);
1119
+ }
1120
+ }
1121
+ .ory-elements .disabled\:bg-button-primary-background-disabled {
1122
+ &:disabled {
1123
+ background-color: var(--color-button-primary-background-disabled);
1124
+ }
1125
+ }
1126
+ .ory-elements .disabled\:bg-button-secondary-background-disabled {
1127
+ &:disabled {
1128
+ background-color: var(--color-button-secondary-background-disabled);
1129
+ }
1130
+ }
1131
+ .ory-elements .disabled\:bg-input-background-disabled {
1132
+ &:disabled {
1133
+ background-color: var(--color-input-background-disabled);
1134
+ }
1135
+ }
1136
+ .ory-elements .disabled\:text-button-primary-foreground-disabled {
1137
+ &:disabled {
1138
+ color: var(--color-button-primary-foreground-disabled);
1139
+ }
1140
+ }
1141
+ .ory-elements .disabled\:text-button-secondary-foreground-disabled {
1142
+ &:disabled {
1143
+ color: var(--color-button-secondary-foreground-disabled);
1144
+ }
1145
+ }
1146
+ .ory-elements .disabled\:text-input-foreground-disabled {
1147
+ &:disabled {
1148
+ color: var(--color-input-foreground-disabled);
1149
+ }
1150
+ }
1151
+ .ory-elements .disabled\:opacity-50 {
1152
+ &:disabled {
1153
+ opacity: 50%;
1154
+ }
1155
+ }
1156
+ .ory-elements .disabled\:ring-button-primary-border-disabled {
1157
+ &:disabled {
1158
+ --tw-ring-color: var(--color-button-primary-border-disabled);
1159
+ }
1160
+ }
1161
+ .ory-elements .disabled\:ring-button-secondary-border-disabled {
1162
+ &:disabled {
1163
+ --tw-ring-color: var(--color-button-secondary-border-disabled);
1164
+ }
1165
+ }
1166
+ .ory-elements .disabled\:hover\:bg-ui-transparent {
1167
+ &:disabled {
1168
+ &:hover {
1169
+ @media (hover: hover) {
1170
+ background-color: var(--color-ui-transparent);
1171
+ }
1172
+ }
1173
+ }
1174
+ }
1175
+ .ory-elements .has-disabled\:opacity-50 {
1176
+ &:has(*:disabled) {
1177
+ opacity: 50%;
1178
+ }
1179
+ }
1180
+ .ory-elements .data-disabled\:pointer-events-none {
1181
+ &[data-disabled] {
1182
+ pointer-events: none;
1183
+ }
1184
+ }
1185
+ .ory-elements .data-\[disabled\]\:bg-button-secondary-background-disabled {
1186
+ &[data-disabled] {
1187
+ background-color: var(--color-button-secondary-background-disabled);
1188
+ }
1189
+ }
1190
+ .ory-elements .data-\[disabled\]\:text-button-secondary-foreground-disabled {
1191
+ &[data-disabled] {
1192
+ color: var(--color-button-secondary-foreground-disabled);
1193
+ }
1194
+ }
1195
+ .ory-elements .data-\[state\=checked\]\:translate-x-3 {
1196
+ &[data-state=checked] {
1197
+ --tw-translate-x: calc(var(--spacing) * 3);
1198
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1199
+ }
1200
+ }
1201
+ .ory-elements .data-\[state\=checked\]\:border-toggle-border-checked {
1202
+ &[data-state=checked] {
1203
+ border-color: var(--color-toggle-border-checked);
1204
+ }
1205
+ }
1206
+ .ory-elements .data-\[state\=checked\]\:bg-toggle-background-checked {
1207
+ &[data-state=checked] {
1208
+ background-color: var(--color-toggle-background-checked);
1209
+ }
1210
+ }
1211
+ .ory-elements .data-\[state\=checked\]\:bg-toggle-foreground-checked {
1212
+ &[data-state=checked] {
1213
+ background-color: var(--color-toggle-foreground-checked);
1214
+ }
1215
+ }
1216
+ .ory-elements .data-\[state\=closed\]\:animate-drop-down-out {
1217
+ &[data-state=closed] {
1218
+ animation: var(--animate-drop-down-out);
1219
+ }
1220
+ }
1221
+ .ory-elements .max-sm\:bottom-0 {
1222
+ @media (width < 40rem) {
1223
+ bottom: calc(var(--spacing) * 0);
1224
+ }
1225
+ }
1226
+ .ory-elements .max-sm\:left-8 {
1227
+ @media (width < 40rem) {
1228
+ left: calc(var(--spacing) * 8);
1229
+ }
1230
+ }
1231
+ .ory-elements .max-sm\:hidden {
1232
+ @media (width < 40rem) {
1233
+ display: none;
1234
+ }
1235
+ }
1236
+ .ory-elements .max-sm\:translate-y-full {
1237
+ @media (width < 40rem) {
1238
+ --tw-translate-y: 100%;
1239
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1240
+ }
1241
+ }
1242
+ .ory-elements .max-sm\:rounded-b-branding {
1243
+ @media (width < 40rem) {
1244
+ border-bottom-right-radius: var(--radius-branding);
1245
+ border-bottom-left-radius: var(--radius-branding);
1246
+ }
1247
+ }
1248
+ .ory-elements .max-sm\:py-\[7px\] {
1249
+ @media (width < 40rem) {
1250
+ padding-block: 7px;
1251
+ }
1252
+ }
1253
+ .ory-elements .sm\:top-8 {
1254
+ @media (width >= 40rem) {
1255
+ top: calc(var(--spacing) * 8);
1256
+ }
1257
+ }
1258
+ .ory-elements .sm\:right-0 {
1259
+ @media (width >= 40rem) {
1260
+ right: calc(var(--spacing) * 0);
1261
+ }
1262
+ }
1263
+ .ory-elements .sm\:block {
1264
+ @media (width >= 40rem) {
1265
+ display: block;
1266
+ }
1267
+ }
1268
+ .ory-elements .sm\:hidden {
1269
+ @media (width >= 40rem) {
1270
+ display: none;
1271
+ }
1272
+ }
1273
+ .ory-elements .sm\:w-\[480px\] {
1274
+ @media (width >= 40rem) {
1275
+ width: 480px;
1276
+ }
1277
+ }
1278
+ .ory-elements .sm\:max-w-\[480px\] {
1279
+ @media (width >= 40rem) {
1280
+ max-width: 480px;
1281
+ }
1282
+ }
1283
+ .ory-elements .sm\:translate-x-full {
1284
+ @media (width >= 40rem) {
1285
+ --tw-translate-x: 100%;
1286
+ translate: var(--tw-translate-x) var(--tw-translate-y);
1287
+ }
1288
+ }
1289
+ .ory-elements .sm\:grid-cols-2 {
1290
+ @media (width >= 40rem) {
1291
+ grid-template-columns: repeat(2, minmax(0, 1fr));
1292
+ }
1293
+ }
1294
+ .ory-elements .sm\:grid-cols-3 {
1295
+ @media (width >= 40rem) {
1296
+ grid-template-columns: repeat(3, minmax(0, 1fr));
1297
+ }
1298
+ }
1299
+ .ory-elements .sm\:flex-row {
1300
+ @media (width >= 40rem) {
1301
+ flex-direction: row;
1302
+ }
1303
+ }
1304
+ .ory-elements .sm\:items-center {
1305
+ @media (width >= 40rem) {
1306
+ align-items: center;
1307
+ }
1308
+ }
1309
+ .ory-elements .sm\:items-end {
1310
+ @media (width >= 40rem) {
1311
+ align-items: flex-end;
1312
+ }
1313
+ }
1314
+ .ory-elements .sm\:rounded-cards {
1315
+ @media (width >= 40rem) {
1316
+ border-radius: var(--radius-cards);
1317
+ }
1318
+ }
1319
+ .ory-elements .sm\:rounded-r-branding {
1320
+ @media (width >= 40rem) {
1321
+ border-top-right-radius: var(--radius-branding);
1322
+ border-bottom-right-radius: var(--radius-branding);
1323
+ }
1324
+ }
1325
+ .ory-elements .sm\:border {
1326
+ @media (width >= 40rem) {
1327
+ border-style: var(--tw-border-style);
1328
+ border-width: 1px;
1329
+ }
1330
+ }
1331
+ .ory-elements .sm\:px-12 {
1332
+ @media (width >= 40rem) {
1333
+ padding-inline: calc(var(--spacing) * 12);
1334
+ }
1335
+ }
1336
+ .ory-elements .sm\:py-14 {
1337
+ @media (width >= 40rem) {
1338
+ padding-block: calc(var(--spacing) * 14);
1339
+ }
1340
+ }
1341
+ .ory-elements .sm\:pl-\[7px\] {
1342
+ @media (width >= 40rem) {
1343
+ padding-left: 7px;
1344
+ }
1345
+ }
1346
+ .ory-elements .md\:max-w-96 {
1347
+ @media (width >= 48rem) {
1348
+ max-width: calc(var(--spacing) * 96);
1349
+ }
1350
+ }
1351
+ .ory-elements .md\:max-w-\[712px\] {
1352
+ @media (width >= 48rem) {
1353
+ max-width: 712px;
1354
+ }
1355
+ }
1356
+ .ory-elements .md\:grid-cols-2 {
1357
+ @media (width >= 48rem) {
1358
+ grid-template-columns: repeat(2, minmax(0, 1fr));
1359
+ }
1360
+ }
1361
+ .ory-elements .md\:grid-cols-3 {
1362
+ @media (width >= 48rem) {
1363
+ grid-template-columns: repeat(3, minmax(0, 1fr));
1364
+ }
1365
+ }
1366
+ .ory-elements .md\:grid-cols-5 {
1367
+ @media (width >= 48rem) {
1368
+ grid-template-columns: repeat(5, minmax(0, 1fr));
1369
+ }
1370
+ }
1371
+ .ory-elements .md\:flex-row {
1372
+ @media (width >= 48rem) {
1373
+ flex-direction: row;
1374
+ }
1375
+ }
1376
+ .ory-elements .md\:items-center {
1377
+ @media (width >= 48rem) {
1378
+ align-items: center;
1379
+ }
1380
+ }
1381
+ .ory-elements .md\:justify-between {
1382
+ @media (width >= 48rem) {
1383
+ justify-content: space-between;
1384
+ }
1385
+ }
1386
+ .ory-elements .lg\:max-w-\[802px\] {
1387
+ @media (width >= 64rem) {
1388
+ max-width: 802px;
1389
+ }
1390
+ }
1391
+ .ory-elements .lg\:py-4\.5 {
1392
+ @media (width >= 64rem) {
1393
+ padding-block: calc(var(--spacing) * 4.5);
1394
+ }
1395
+ }
1396
+ .ory-elements .xl\:max-w-\[896px\] {
1397
+ @media (width >= 80rem) {
1398
+ max-width: 896px;
1399
+ }
1400
+ }
1401
+ .ory-elements .loading\:cursor-wait {
1402
+ &[data-loading=true] {
1403
+ cursor: wait;
1404
+ }
1405
+ }
1406
+ .ory-elements .loading\:border-button-social-border-disabled {
1407
+ &[data-loading=true] {
1408
+ border-color: var(--color-button-social-border-disabled);
1409
+ }
1410
+ }
1411
+ .ory-elements .loading\:bg-button-primary-background-default {
1412
+ &[data-loading=true] {
1413
+ background-color: var(--color-button-primary-background-default);
1414
+ }
1415
+ }
1416
+ .ory-elements .loading\:bg-button-secondary-background-default {
1417
+ &[data-loading=true] {
1418
+ background-color: var(--color-button-secondary-background-default);
1419
+ }
1420
+ }
1421
+ .ory-elements .loading\:bg-button-social-background-disabled {
1422
+ &[data-loading=true] {
1423
+ background-color: var(--color-button-social-background-disabled);
1424
+ }
1425
+ }
1426
+ .ory-elements .loading\:text-button-primary-foreground-default {
1427
+ &[data-loading=true] {
1428
+ color: var(--color-button-primary-foreground-default);
1429
+ }
1430
+ }
1431
+ .ory-elements .loading\:text-button-secondary-foreground-default {
1432
+ &[data-loading=true] {
1433
+ color: var(--color-button-secondary-foreground-default);
1434
+ }
1435
+ }
1436
+ .ory-elements .loading\:text-button-social-foreground-disabled {
1437
+ &[data-loading=true] {
1438
+ color: var(--color-button-social-foreground-disabled);
1439
+ }
1440
+ }
1441
+ .ory-elements .loading\:ring-button-primary-border-default {
1442
+ &[data-loading=true] {
1443
+ --tw-ring-color: var(--color-button-primary-border-default);
1444
+ }
1445
+ }
1446
+ .ory-elements .loading\:ring-button-secondary-border-default {
1447
+ &[data-loading=true] {
1448
+ --tw-ring-color: var(--color-button-secondary-border-default);
1449
+ }
1450
+ }
1451
+ .ory-elements .loading\:before\:pointer-events-none {
1452
+ &[data-loading=true] {
1453
+ &::before {
1454
+ content: var(--tw-content);
1455
+ pointer-events: none;
1456
+ }
1457
+ }
1458
+ }
1459
+ .ory-elements .loading\:before\:absolute {
1460
+ &[data-loading=true] {
1461
+ &::before {
1462
+ content: var(--tw-content);
1463
+ position: absolute;
1464
+ }
1465
+ }
1466
+ }
1467
+ .ory-elements .loading\:before\:inset-0 {
1468
+ &[data-loading=true] {
1469
+ &::before {
1470
+ content: var(--tw-content);
1471
+ inset: calc(var(--spacing) * 0);
1472
+ }
1473
+ }
1474
+ }
1475
+ .ory-elements .loading\:before\:bg-button-primary-background-default {
1476
+ &[data-loading=true] {
1477
+ &::before {
1478
+ content: var(--tw-content);
1479
+ background-color: var(--color-button-primary-background-default);
1480
+ }
1481
+ }
1482
+ }
1483
+ .ory-elements .loading\:before\:bg-button-secondary-background-default {
1484
+ &[data-loading=true] {
1485
+ &::before {
1486
+ content: var(--tw-content);
1487
+ background-color: var(--color-button-secondary-background-default);
1488
+ }
1489
+ }
1490
+ }
1491
+ .ory-elements .loading\:before\:opacity-80 {
1492
+ &[data-loading=true] {
1493
+ &::before {
1494
+ content: var(--tw-content);
1495
+ opacity: 80%;
1496
+ }
1497
+ }
1498
+ }
1499
+ .ory-elements .loading\:before\:content-\[\'\'\] {
1500
+ &[data-loading=true] {
1501
+ &::before {
1502
+ content: var(--tw-content);
1503
+ --tw-content: "";
1504
+ content: var(--tw-content);
1505
+ }
1506
+ }
1507
+ }
1508
+ }
1509
+ @layer ory-elements {
1510
+ .ory-elements,
1511
+ :host {
1512
+ --font-mono:
1513
+ ui-monospace,
1514
+ SFMono-Regular,
1515
+ Menlo,
1516
+ Monaco,
1517
+ Consolas,
1518
+ "Liberation Mono",
1519
+ "Courier New",
1520
+ monospace;
1521
+ --spacing: 0.25rem;
1522
+ --breakpoint-sm: 40rem;
1523
+ --text-xs: 0.75rem;
1524
+ --text-xs--line-height: calc(1 / 0.75);
1525
+ --text-sm: 0.875rem;
1526
+ --text-sm--line-height: calc(1.25 / 0.875);
1527
+ --text-lg: 1.125rem;
1528
+ --text-lg--line-height: calc(1.75 / 1.125);
1529
+ --text-xl: 1.25rem;
1530
+ --text-xl--line-height: calc(1.75 / 1.25);
1531
+ --font-weight-normal: 400;
1532
+ --font-weight-medium: 500;
1533
+ --font-weight-semibold: 600;
1534
+ --font-weight-bold: 700;
1535
+ --leading-tight: 1.25;
1536
+ --leading-normal: 1.5;
1537
+ --animate-spin: spin 1s linear infinite;
1538
+ --default-transition-duration: 150ms;
1539
+ --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1540
+ --default-mono-font-family: var(--font-mono);
1541
+ --ui-100: #f1f5f9;
1542
+ --ui-200: #e2e8f0;
1543
+ --ui-300: #cbd5e1;
1544
+ --ui-400: #94a3b8;
1545
+ --ui-50: #f8fafc;
1546
+ --ui-500: #64748b;
1547
+ --ui-600: #475569;
1548
+ --ui-700: #334155;
1549
+ --ui-800: #1e293b;
1550
+ --ui-900: #0f172a;
1551
+ --ui-950: #020617;
1552
+ --ui-black: #000000;
1553
+ --ui-danger: #dc2626;
1554
+ --ui-success: #22c55e;
1555
+ --ui-transparent: #ffffff00;
1556
+ --ui-warning: #eab308;
1557
+ --ui-white: #ffffff;
1558
+ --button-identifier-background-default: var( --interface-background-brand-secondary );
1559
+ --button-identifier-background-hover: var( --interface-background-brand-secondary-hover );
1560
+ --button-identifier-border-border-default: var( --interface-border-brand-brand );
1561
+ --button-identifier-border-border-hover: var(--interface-border-brand-brand);
1562
+ --button-identifier-foreground-default: var( --interface-foreground-brand-on-secondary );
1563
+ --button-identifier-foreground-hover: var( --interface-foreground-brand-on-secondary );
1564
+ --button-link-brand-brand: var(--interface-foreground-brand-primary);
1565
+ --button-link-brand-brand-hover: var(--interface-foreground-default-primary);
1566
+ --button-link-default-primary: var(--interface-foreground-default-primary);
1567
+ --button-link-default-primary-hover: var( --interface-foreground-brand-primary );
1568
+ --button-link-default-secondary: var( --interface-foreground-default-secondary );
1569
+ --button-link-default-secondary-hover: var( --interface-foreground-default-tertiary );
1570
+ --button-link-disabled-disabled: var( --interface-foreground-disabled-disabled );
1571
+ --button-primary-background-default: var( --interface-background-brand-primary );
1572
+ --button-primary-background-disabled: var( --interface-background-disabled-disabled );
1573
+ --button-primary-background-hover: var( --interface-background-brand-primary-hover );
1574
+ --button-primary-border-default: var(--interface-border-default-none);
1575
+ --button-primary-border-disabled: var(--interface-border-disabled-disabled);
1576
+ --button-primary-border-hover: var(--interface-border-default-none);
1577
+ --button-primary-foreground-default: var( --interface-foreground-brand-on-primary );
1578
+ --button-primary-foreground-disabled: var( --interface-foreground-disabled-on-disabled );
1579
+ --button-primary-foreground-hover: var( --interface-foreground-brand-on-primary );
1580
+ --button-secondary-background-default: var( --interface-background-default-primary );
1581
+ --button-secondary-background-disabled: var( --interface-background-disabled-disabled );
1582
+ --button-secondary-background-hover: var( --interface-background-default-primary-hover );
1583
+ --button-secondary-border-default: var(--interface-border-default-primary);
1584
+ --button-secondary-border-disabled: var(--interface-border-disabled-disabled);
1585
+ --button-secondary-border-hover: var(--interface-border-default-primary);
1586
+ --button-secondary-foreground-default: var( --interface-foreground-default-primary );
1587
+ --button-secondary-foreground-disabled: var( --interface-foreground-disabled-on-disabled );
1588
+ --button-secondary-foreground-hover: var( --interface-foreground-default-secondary );
1589
+ --button-social-background-default: var( --interface-background-default-primary );
1590
+ --button-social-background-disabled: var( --interface-background-disabled-disabled );
1591
+ --button-social-background-generic-provider: var( --interface-background-default-inverted );
1592
+ --button-social-background-hover: var( --interface-background-default-primary-hover );
1593
+ --button-social-border-default: var(--interface-border-default-primary);
1594
+ --button-social-border-disabled: var(--interface-border-disabled-disabled);
1595
+ --button-social-border-generic-provider: var(--interface-border-default-none);
1596
+ --button-social-border-hover: var(--interface-border-default-primary);
1597
+ --button-social-foreground-default: var( --interface-foreground-default-primary );
1598
+ --button-social-foreground-disabled: var( --interface-foreground-disabled-on-disabled );
1599
+ --button-social-foreground-generic-provider: var( --interface-foreground-default-inverted );
1600
+ --button-social-foreground-hover: var( --interface-foreground-default-secondary );
1601
+ --checkbox-background-checked: var(--interface-background-brand-primary);
1602
+ --checkbox-background-default: var(--interface-background-default-secondary);
1603
+ --checkbox-border-checkbox-border-checked: var( --interface-border-brand-brand );
1604
+ --checkbox-border-checkbox-border-default: var( --interface-border-default-primary );
1605
+ --checkbox-foreground-checked: var(--interface-foreground-brand-on-primary);
1606
+ --checkbox-foreground-default: var(--interface-foreground-default-primary);
1607
+ --form-background-default: var(--interface-background-default-primary);
1608
+ --form-border-default: var(--interface-border-default-primary);
1609
+ --input-background-default: var(--interface-background-default-primary);
1610
+ --input-background-disabled: var(--interface-background-disabled-disabled);
1611
+ --input-background-hover: var(--interface-background-default-primary-hover);
1612
+ --input-border-default: var(--interface-border-default-primary);
1613
+ --input-border-disabled: var(--interface-border-disabled-disabled);
1614
+ --input-border-focus: var(--interface-border-brand-brand);
1615
+ --input-border-hover: var(--interface-border-default-primary);
1616
+ --input-foreground-disabled: var(--interface-foreground-disabled-on-disabled);
1617
+ --input-foreground-primary: var(--interface-foreground-default-primary);
1618
+ --input-foreground-secondary: var(--interface-foreground-default-secondary);
1619
+ --input-foreground-tertiary: var(--interface-foreground-default-tertiary);
1620
+ --interface-background-brand-primary: var(--brand-500);
1621
+ --interface-background-brand-primary-hover: var(--brand-400);
1622
+ --interface-background-brand-secondary: var(--brand-50);
1623
+ --interface-background-brand-secondary-hover: var(--brand-100);
1624
+ --interface-background-default-inverted: var(--ui-900);
1625
+ --interface-background-default-inverted-hover: var(--ui-800);
1626
+ --interface-background-default-none: var(--ui-transparent);
1627
+ --interface-background-default-primary: var(--ui-white);
1628
+ --interface-background-default-primary-hover: var(--ui-50);
1629
+ --interface-background-default-secondary: var(--ui-50);
1630
+ --interface-background-default-secondary-hover: var(--ui-200);
1631
+ --interface-background-default-tertiary: var(--ui-200);
1632
+ --interface-background-default-tertiary-hover: var(--ui-300);
1633
+ --interface-background-disabled-disabled: var(--ui-200);
1634
+ --interface-background-validation-danger: var(--ui-danger);
1635
+ --interface-background-validation-success: var(--ui-success);
1636
+ --interface-background-validation-warning: var(--ui-warning);
1637
+ --interface-border-brand-brand: var(--brand-500);
1638
+ --interface-border-default-inverted: var(--ui-700);
1639
+ --interface-border-default-none: var(--ui-transparent);
1640
+ --interface-border-default-primary: var(--ui-300);
1641
+ --interface-border-disabled-disabled: var(--ui-300);
1642
+ --interface-border-validation-danger: var(--ui-danger);
1643
+ --interface-border-validation-success: var(--ui-success);
1644
+ --interface-border-validation-warning: var(--ui-warning);
1645
+ --interface-foreground-brand-on-primary: var(--brand-50);
1646
+ --interface-foreground-brand-on-secondary: var(--brand-950);
1647
+ --interface-foreground-brand-primary: var(--brand-500);
1648
+ --interface-foreground-brand-secondary: var(--brand-50);
1649
+ --interface-foreground-default-inverted: var(--ui-white);
1650
+ --interface-foreground-default-primary: var(--ui-900);
1651
+ --interface-foreground-default-secondary: var(--ui-700);
1652
+ --interface-foreground-default-tertiary: var(--ui-500);
1653
+ --interface-foreground-disabled-disabled: var(--ui-300);
1654
+ --interface-foreground-disabled-on-disabled: var(--ui-400);
1655
+ --interface-foreground-validation-danger: var(--ui-danger);
1656
+ --interface-foreground-validation-success: var(--ui-success);
1657
+ --interface-foreground-validation-warning: var(--ui-warning);
1658
+ --ory-background-default: var(--interface-background-default-primary);
1659
+ --ory-border-default: var(--interface-border-default-primary);
1660
+ --ory-foreground-default: var(--interface-foreground-default-primary);
1661
+ --radio-background-checked: var(--interface-background-brand-primary);
1662
+ --radio-background-default: var(--interface-background-default-secondary);
1663
+ --radio-border-checked: var(--interface-border-brand-brand);
1664
+ --radio-border-default: var(--interface-border-default-primary);
1665
+ --radio-foreground-checked: var(--interface-foreground-brand-on-primary);
1666
+ --radio-foreground-default: var(--interface-foreground-default-primary);
1667
+ --toggle-background-checked: var(--interface-background-brand-primary);
1668
+ --toggle-background-default: var(--interface-background-default-secondary);
1669
+ --toggle-border-checked: var(--interface-border-default-none);
1670
+ --toggle-border-default: var(--interface-border-default-primary);
1671
+ --toggle-foreground-checked: var(--interface-foreground-brand-on-primary);
1672
+ --toggle-foreground-default: var(--interface-foreground-brand-primary);
1673
+ --brand-100: var(--ui-100);
1674
+ --brand-200: var(--ui-300);
1675
+ --brand-300: var(--ui-500);
1676
+ --brand-400: var(--ui-700);
1677
+ --brand-50: var(--ui-50);
1678
+ --brand-500: var(--ui-900);
1679
+ --brand-600: var(--ui-white);
1680
+ --brand-700: var(--ui-200);
1681
+ --brand-800: var(--ui-400);
1682
+ --brand-900: var(--ui-600);
1683
+ --brand-950: var(--ui-800);
1684
+ --color-ui-transparent: var(--ui-transparent);
1685
+ --color-button-identifier-background-default: var( --button-identifier-background-default );
1686
+ --color-button-identifier-background-hover: var( --button-identifier-background-hover );
1687
+ --color-button-identifier-border-border-default: var( --button-identifier-border-border-default );
1688
+ --color-button-identifier-border-border-hover: var( --button-identifier-border-border-hover );
1689
+ --color-button-identifier-foreground-default: var( --button-identifier-foreground-default );
1690
+ --color-button-identifier-foreground-hover: var( --button-identifier-foreground-hover );
1691
+ --color-button-link-brand-brand: var(--button-link-brand-brand);
1692
+ --color-button-link-brand-brand-hover: var(--button-link-brand-brand-hover);
1693
+ --color-button-link-default-primary: var(--button-link-default-primary);
1694
+ --color-button-link-default-primary-hover: var( --button-link-default-primary-hover );
1695
+ --color-button-link-default-secondary: var(--button-link-default-secondary);
1696
+ --color-button-link-default-secondary-hover: var( --button-link-default-secondary-hover );
1697
+ --color-button-primary-background-default: var( --button-primary-background-default );
1698
+ --color-button-primary-background-disabled: var( --button-primary-background-disabled );
1699
+ --color-button-primary-background-hover: var( --button-primary-background-hover );
1700
+ --color-button-primary-border-default: var(--button-primary-border-default);
1701
+ --color-button-primary-border-disabled: var(--button-primary-border-disabled);
1702
+ --color-button-primary-border-hover: var(--button-primary-border-hover);
1703
+ --color-button-primary-foreground-default: var( --button-primary-foreground-default );
1704
+ --color-button-primary-foreground-disabled: var( --button-primary-foreground-disabled );
1705
+ --color-button-primary-foreground-hover: var( --button-primary-foreground-hover );
1706
+ --color-button-secondary-background-default: var( --button-secondary-background-default );
1707
+ --color-button-secondary-background-disabled: var( --button-secondary-background-disabled );
1708
+ --color-button-secondary-background-hover: var( --button-secondary-background-hover );
1709
+ --color-button-secondary-border-default: var( --button-secondary-border-default );
1710
+ --color-button-secondary-border-disabled: var( --button-secondary-border-disabled );
1711
+ --color-button-secondary-border-hover: var(--button-secondary-border-hover);
1712
+ --color-button-secondary-foreground-default: var( --button-secondary-foreground-default );
1713
+ --color-button-secondary-foreground-disabled: var( --button-secondary-foreground-disabled );
1714
+ --color-button-secondary-foreground-hover: var( --button-secondary-foreground-hover );
1715
+ --color-button-social-background-default: var( --button-social-background-default );
1716
+ --color-button-social-background-disabled: var( --button-social-background-disabled );
1717
+ --color-button-social-background-generic-provider: var( --button-social-background-generic-provider );
1718
+ --color-button-social-background-hover: var(--button-social-background-hover);
1719
+ --color-button-social-border-default: var(--button-social-border-default);
1720
+ --color-button-social-border-disabled: var(--button-social-border-disabled);
1721
+ --color-button-social-border-generic-provider: var( --button-social-border-generic-provider );
1722
+ --color-button-social-border-hover: var(--button-social-border-hover);
1723
+ --color-button-social-foreground-default: var( --button-social-foreground-default );
1724
+ --color-button-social-foreground-disabled: var( --button-social-foreground-disabled );
1725
+ --color-button-social-foreground-generic-provider: var( --button-social-foreground-generic-provider );
1726
+ --color-button-social-foreground-hover: var(--button-social-foreground-hover);
1727
+ --color-checkbox-background-checked: var(--checkbox-background-checked);
1728
+ --color-checkbox-background-default: var(--checkbox-background-default);
1729
+ --color-checkbox-border-checkbox-border-checked: var( --checkbox-border-checkbox-border-checked );
1730
+ --color-checkbox-border-checkbox-border-default: var( --checkbox-border-checkbox-border-default );
1731
+ --color-checkbox-foreground-checked: var(--checkbox-foreground-checked);
1732
+ --color-form-background-default: var(--form-background-default);
1733
+ --color-form-border-default: var(--form-border-default);
1734
+ --color-input-background-default: var(--input-background-default);
1735
+ --color-input-background-disabled: var(--input-background-disabled);
1736
+ --color-input-background-hover: var(--input-background-hover);
1737
+ --color-input-border-default: var(--input-border-default);
1738
+ --color-input-border-disabled: var(--input-border-disabled);
1739
+ --color-input-border-focus: var(--input-border-focus);
1740
+ --color-input-border-hover: var(--input-border-hover);
1741
+ --color-input-foreground-disabled: var(--input-foreground-disabled);
1742
+ --color-input-foreground-primary: var(--input-foreground-primary);
1743
+ --color-input-foreground-tertiary: var(--input-foreground-tertiary);
1744
+ --color-interface-background-brand-primary: var( --interface-background-brand-primary );
1745
+ --color-interface-background-default-inverted: var( --interface-background-default-inverted );
1746
+ --color-interface-background-default-primary: var( --interface-background-default-primary );
1747
+ --color-interface-background-default-primary-hover: var( --interface-background-default-primary-hover );
1748
+ --color-interface-background-default-secondary: var( --interface-background-default-secondary );
1749
+ --color-interface-border-default-primary: var( --interface-border-default-primary );
1750
+ --color-interface-border-validation-danger: var( --interface-border-validation-danger );
1751
+ --color-interface-foreground-brand-primary: var( --interface-foreground-brand-primary );
1752
+ --color-interface-foreground-default-inverted: var( --interface-foreground-default-inverted );
1753
+ --color-interface-foreground-default-primary: var( --interface-foreground-default-primary );
1754
+ --color-interface-foreground-default-secondary: var( --interface-foreground-default-secondary );
1755
+ --color-interface-foreground-default-tertiary: var( --interface-foreground-default-tertiary );
1756
+ --color-interface-foreground-validation-danger: var( --interface-foreground-validation-danger );
1757
+ --color-interface-foreground-validation-success: var( --interface-foreground-validation-success );
1758
+ --color-interface-foreground-validation-warning: var( --interface-foreground-validation-warning );
1759
+ --color-ory-background-default: var(--ory-background-default);
1760
+ --color-ory-border-default: var(--ory-border-default);
1761
+ --color-ory-foreground-default: var(--ory-foreground-default);
1762
+ --color-toggle-background-checked: var(--toggle-background-checked);
1763
+ --color-toggle-background-default: var(--toggle-background-default);
1764
+ --color-toggle-border-checked: var(--toggle-border-checked);
1765
+ --color-toggle-border-default: var(--toggle-border-default);
1766
+ --color-toggle-foreground-checked: var(--toggle-foreground-checked);
1767
+ --color-toggle-foreground-default: var(--toggle-foreground-default);
1768
+ --radius-buttons: 0.25rem;
1769
+ --radius-forms: 0.25rem;
1770
+ --radius-general: 0.25rem;
1771
+ --radius-branding: 0.5rem;
1772
+ --radius-cards: 0.75rem;
1773
+ --radius-identifier: 62.4375rem;
1774
+ --font-sans-default: var(--font-sans);
1775
+ --animate-caret-blink: caret-blink 1.25s ease-out infinite;
1776
+ --animate-drop-down-in: drop-down-in 400ms cubic-bezier(0.16, 1, 0.3, 1);
1777
+ --animate-drop-down-out: drop-down-out 400ms cubic-bezier(0.16, 1, 0.3, 1);
1778
+ }
1779
+ }
1780
+ @property --tw-rotate-x { syntax: "*"; inherits: false; }
1781
+ @property --tw-rotate-y { syntax: "*"; inherits: false; }
1782
+ @property --tw-rotate-z { syntax: "*"; inherits: false; }
1783
+ @property --tw-skew-x { syntax: "*"; inherits: false; }
1784
+ @property --tw-skew-y { syntax: "*"; inherits: false; }
1785
+ @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }
1786
+ @property --tw-leading { syntax: "*"; inherits: false; }
1787
+ @property --tw-font-weight { syntax: "*"; inherits: false; }
1788
+ @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1789
+ @property --tw-shadow-color { syntax: "*"; inherits: false; }
1790
+ @property --tw-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
1791
+ @property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1792
+ @property --tw-inset-shadow-color { syntax: "*"; inherits: false; }
1793
+ @property --tw-inset-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
1794
+ @property --tw-ring-color { syntax: "*"; inherits: false; }
1795
+ @property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1796
+ @property --tw-inset-ring-color { syntax: "*"; inherits: false; }
1797
+ @property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1798
+ @property --tw-ring-inset { syntax: "*"; inherits: false; }
1799
+ @property --tw-ring-offset-width { syntax: "<length>"; inherits: false; initial-value: 0px; }
1800
+ @property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; }
1801
+ @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; }
1802
+ @property --tw-blur { syntax: "*"; inherits: false; }
1803
+ @property --tw-brightness { syntax: "*"; inherits: false; }
1804
+ @property --tw-contrast { syntax: "*"; inherits: false; }
1805
+ @property --tw-grayscale { syntax: "*"; inherits: false; }
1806
+ @property --tw-hue-rotate { syntax: "*"; inherits: false; }
1807
+ @property --tw-invert { syntax: "*"; inherits: false; }
1808
+ @property --tw-opacity { syntax: "*"; inherits: false; }
1809
+ @property --tw-saturate { syntax: "*"; inherits: false; }
1810
+ @property --tw-sepia { syntax: "*"; inherits: false; }
1811
+ @property --tw-drop-shadow { syntax: "*"; inherits: false; }
1812
+ @property --tw-drop-shadow-color { syntax: "*"; inherits: false; }
1813
+ @property --tw-drop-shadow-alpha { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
1814
+ @property --tw-drop-shadow-size { syntax: "*"; inherits: false; }
1815
+ @property --tw-duration { syntax: "*"; inherits: false; }
1816
+ @property --tw-ease { syntax: "*"; inherits: false; }
1817
+ @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
1818
+ @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }
1819
+ @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; }
1820
+ @property --tw-content { syntax: "*"; initial-value: ""; inherits: false; }
1821
+ @keyframes spin {
1822
+ to {
1823
+ transform: rotate(360deg);
1824
+ }
1825
+ }
1826
+ @keyframes caret-blink {
1827
+ 0%, 70%, 100% {
1828
+ opacity: 1;
1829
+ }
1830
+ 20%, 50% {
1831
+ opacity: 0;
1832
+ }
1833
+ }
1834
+ @keyframes drop-down-in {
1835
+ from {
1836
+ opacity: 0;
1837
+ transform: scale(0.75);
1838
+ }
1839
+ to {
1840
+ opacity: 1;
1841
+ transform: scale(1);
1711
1842
  }
1712
1843
  }
1713
- @media (min-width: 1024px) {
1714
- .lg\:max-w-\[802px\] {
1715
- max-width: 802px;
1844
+ @keyframes drop-down-out {
1845
+ from {
1846
+ opacity: 1;
1847
+ transform: scale(1);
1716
1848
  }
1717
- .lg\:py-4\.5 {
1718
- padding-top: 1.125rem;
1719
- padding-bottom: 1.125rem;
1849
+ to {
1850
+ opacity: 0;
1851
+ transform: scale(0.96);
1720
1852
  }
1721
1853
  }
1722
- @media (min-width: 1280px) {
1723
- .xl\:max-w-\[896px\] {
1724
- max-width: 896px;
1854
+ @layer properties {
1855
+ @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
1856
+ .ory-elements *,
1857
+ .ory-elements ::before,
1858
+ .ory-elements ::after,
1859
+ .ory-elements ::backdrop {
1860
+ --tw-rotate-x: initial;
1861
+ --tw-rotate-y: initial;
1862
+ --tw-rotate-z: initial;
1863
+ --tw-skew-x: initial;
1864
+ --tw-skew-y: initial;
1865
+ --tw-border-style: solid;
1866
+ --tw-leading: initial;
1867
+ --tw-font-weight: initial;
1868
+ --tw-shadow: 0 0 #0000;
1869
+ --tw-shadow-color: initial;
1870
+ --tw-shadow-alpha: 100%;
1871
+ --tw-inset-shadow: 0 0 #0000;
1872
+ --tw-inset-shadow-color: initial;
1873
+ --tw-inset-shadow-alpha: 100%;
1874
+ --tw-ring-color: initial;
1875
+ --tw-ring-shadow: 0 0 #0000;
1876
+ --tw-inset-ring-color: initial;
1877
+ --tw-inset-ring-shadow: 0 0 #0000;
1878
+ --tw-ring-inset: initial;
1879
+ --tw-ring-offset-width: 0px;
1880
+ --tw-ring-offset-color: #fff;
1881
+ --tw-ring-offset-shadow: 0 0 #0000;
1882
+ --tw-blur: initial;
1883
+ --tw-brightness: initial;
1884
+ --tw-contrast: initial;
1885
+ --tw-grayscale: initial;
1886
+ --tw-hue-rotate: initial;
1887
+ --tw-invert: initial;
1888
+ --tw-opacity: initial;
1889
+ --tw-saturate: initial;
1890
+ --tw-sepia: initial;
1891
+ --tw-drop-shadow: initial;
1892
+ --tw-drop-shadow-color: initial;
1893
+ --tw-drop-shadow-alpha: 100%;
1894
+ --tw-drop-shadow-size: initial;
1895
+ --tw-duration: initial;
1896
+ --tw-ease: initial;
1897
+ --tw-translate-x: 0;
1898
+ --tw-translate-y: 0;
1899
+ --tw-translate-z: 0;
1900
+ --tw-content: "";
1901
+ }
1725
1902
  }
1726
1903
  }
1904
+ /*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */
1727
1905
  /*# sourceMappingURL=index.css.map */