@netlify/spark-ui 1.18.0 → 1.20.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.
Files changed (28) hide show
  1. package/README.md +66 -0
  2. package/package.json +3 -2
  3. package/packages/components/ActionArrow.astro +1 -1
  4. package/packages/components/ActionLink.astro +5 -5
  5. package/packages/components/Blockquote.astro +22 -22
  6. package/packages/components/Card.astro +20 -19
  7. package/packages/components/Eyebrow.astro +4 -4
  8. package/packages/components/HeadingBlock.astro +12 -12
  9. package/packages/components/PageHero.astro +4 -4
  10. package/packages/components/PageHeroGraphic.astro +9 -9
  11. package/packages/components/PageSection.astro +9 -9
  12. package/packages/components/Switchback.astro +14 -14
  13. package/packages/components/SwitchbackGroup.astro +1 -1
  14. package/packages/components/TabPanelGroup.astro +4 -4
  15. package/packages/components/TabbedContent.astro +13 -13
  16. package/packages/components/TabbedContentPanel.astro +14 -14
  17. package/packages/components/TestimonialSlider.astro +8 -8
  18. package/packages/components/Ticker.astro +1 -1
  19. package/packages/components/TrustBarTicker.astro +1 -1
  20. package/packages/components/TrustBarTickerItem.astro +5 -5
  21. package/packages/components/preact/AskNetlify/components/ActionBar.tsx +1 -1
  22. package/packages/styles/base.css +1 -0
  23. package/packages/styles/layout.compat.css +114 -0
  24. package/packages/styles/layout.css +35 -35
  25. package/packages/styles/tokens.compat.css +548 -0
  26. package/packages/styles/tokens.css +524 -440
  27. package/packages/styles/tokens.overrides.css +6 -0
  28. package/skills/landing-page.md +189 -0
package/packages/styles/tokens.css CHANGED
@@ -3,456 +3,540 @@
3
3
  * ------------------------------------------- */
4
4
 
5
5
  :root {
6
- --active-switcher-tab-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.047058823529411764);
7
- --badge-bg-color: var(--neutral-100);
8
- --badge-border-color: var(--neutral-300);
9
- --badge-text-color: var(--neutral-500);
10
- --blockquote-accent-color: var(--blue-700);
11
- --blue-000: color(srgb 0.9294117647058824 0.9568627450980393 1);
12
- --blue-100: color(srgb 0.803921568627451 0.8862745098039215 1);
13
- --blue-200: color(srgb 0.7098039215686275 0.8235294117647058 0.984313725490196);
14
- --blue-300: color(srgb 0.611764705882353 0.7450980392156863 0.9647058823529412);
15
- --blue-400: color(srgb 0.5019607843137255 0.6705882352941176 0.9803921568627451);
16
- --blue-500: color(srgb 0.36470588235294116 0.5529411764705883 0.9607843137254902);
17
- --blue-600: color(srgb 0.19215686274509805 0.4196078431372549 0.9568627450980393);
18
- --blue-700: color(srgb 0.1803921568627451 0.3176470588235294 0.9294117647058824);
19
- --blue-800: color(srgb 0.12549019607843137 0.21176470588235294 0.6313725490196078);
20
- --blue-900: color(srgb 0.10588235294117647 0.12549019607843137 0.3568627450980392);
21
- --button-outline-bg-color: color(srgb 0 0 0 / 0);
22
- --button-outline-bg-color-hover: color(srgb 0.8392156862745098 0.9803921568627451 0.9764705882352941);
23
- --button-outline-stroke-color: var(--neutral-800);
24
- --button-outline-text-color: var(--neutral-800);
25
- --button-primary-bg-color: var(--teal-200);
26
- --button-primary-bg-color-hover: var(--teal-100);
27
- --button-primary-text-color: var(--neutral-800);
28
- --button-secondary-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.09803921568627451);
29
- --button-secondary-bg-color-hover: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.14901960784313725);
30
- --button-secondary-text-color: var(--neutral-800);
31
- --card-bg-color: var(--neutral-000);
32
- --card-border-color: var(--neutral-200);
33
- --card-border-color-hover: var(--neutral-300);
34
- --code-bg-color: var(--teal-900);
35
- --color-bg: var(--neutral-000);
36
- --color-bg-2: var(--neutral-100);
37
- --color-bg-3: var(--neutral-200);
38
- --color-disabled-bg: var(--neutral-200);
39
- --color-disabled-border: var(--neutral-400);
40
- --color-disabled-text: var(--neutral-400);
41
- --color-highlight-bg: var(--purple-100);
42
- --color-highlight-border: var(--purple-600);
43
- --color-highlight-text: var(--purple-600);
44
- --color-icon: var(--blue-700);
45
- --color-info-bg: var(--blue-100);
46
- --color-info-border: var(--blue-600);
47
- --color-info-text: var(--blue-600);
48
- --color-invalid-bg: var(--red-100);
49
- --color-invalid-border: var(--red-600);
50
- --color-invalid-text: var(--red-600);
51
- --color-link: var(--blue-700);
52
- --color-logo-inactive: color(srgb 0.7019607843137254 0.7019607843137254 0.7019607843137254);
53
- --color-logo-spark: var(--teal-400);
54
- --color-logo-type: var(--teal-800);
55
- --color-stroke: color(srgb 0 0 0 / 0.14901960784313725);
56
- --color-success-bg: var(--green-100);
57
- --color-success-border: var(--green-300);
58
- --color-success-text: var(--green-800);
59
- --color-text: var(--neutral-600);
60
- --color-text-accent: var(--teal-000);
61
- --color-text-weak: var(--neutral-500);
62
- --color-text-weaker: var(--neutral-400);
63
- --color-warning-bg: var(--gold-100);
64
- --color-warning-border: var(--gold-300);
65
- --color-warning-text: var(--gold-800);
66
- --eyebrow-text-color: var(--blue-700);
67
- --font-family-display: "Figtree", system-ui, "Helvetica", sans-serif;
68
- --font-family-mono: "Martian Mono", ui-monospace, "Cascadia Code", "Source Code Pro", "Menlo", "Consolas", "DejaVu Sans Mono", monospace;
69
- --font-family-text: "Instrument Sans", system-ui, "Helvetica", sans-serif;
70
- --font-size-display-2xl: 4rem;
71
- --font-size-display-2xs: 1.25rem;
72
- --font-size-display-3xl: 4.5rem;
73
- --font-size-display-4xl: 5rem;
74
- --font-size-display-lg: 3rem;
75
- --font-size-display-md: 2.5rem;
76
- --font-size-display-sm: 2rem;
77
- --font-size-display-xl: 3.5rem;
78
- --font-size-display-xs: 1.5rem;
79
- --font-size-text-lg: 1.125rem;
80
- --font-size-text-md: 1rem;
81
- --font-size-text-sm: 0.875rem;
82
- --font-size-text-xl: 1.375rem;
83
- --font-size-text-xs: 0.75rem;
84
- --font-weight-bold: 700;
85
- --font-weight-extrabold: 800;
86
- --font-weight-medium: 500;
87
- --font-weight-regular: 400;
88
- --font-weight-semibold: 600;
89
- --gold-000: color(srgb 0.9921568627450981 0.9607843137254902 0.8470588235294118);
90
- --gold-100: color(srgb 0.9647058823529412 0.8784313725490196 0.6470588235294118);
91
- --gold-200: color(srgb 0.9803921568627451 0.803921568627451 0.43529411764705883);
92
- --gold-300: color(srgb 0.984313725490196 0.6941176470588235 0.23921568627450981);
93
- --gold-400: color(srgb 0.9764705882352941 0.5568627450980392 0.12941176470588237);
94
- --gold-500: color(srgb 0.8352941176470589 0.4666666666666667 0.10196078431372549);
95
- --gold-600: color(srgb 0.6588235294117647 0.36470588235294116 0.07450980392156863);
96
- --gold-700: color(srgb 0.5490196078431373 0.2980392156862745 0.050980392156862744);
97
- --gold-800: color(srgb 0.3764705882352941 0.20392156862745098 0.03137254901960784);
98
- --gold-900: color(srgb 0.2 0.13333333333333333 0.07450980392156863);
99
- --green-000: color(srgb 0.9058823529411765 0.9882352941176471 0.9137254901960784);
100
- --green-100: color(srgb 0.7450980392156863 0.9764705882352941 0.7764705882352941);
101
- --green-200: color(srgb 0.5764705882352941 0.9607843137254902 0.6470588235294118);
102
- --green-300: color(srgb 0.39215686274509803 0.8470588235294118 0.4980392156862745);
103
- --green-400: color(srgb 0.22745098039215686 0.7647058823529411 0.39215686274509803);
104
- --green-500: color(srgb 0.19215686274509805 0.6588235294117647 0.3333333333333333);
105
- --green-600: color(srgb 0.13333333333333333 0.5098039215686274 0.25098039215686274);
106
- --green-700: color(srgb 0.10196078431372549 0.4196078431372549 0.20392156862745098);
107
- --green-800: color(srgb 0.058823529411764705 0.2901960784313726 0.12941176470588237);
108
- --green-900: color(srgb 0.08235294117647059 0.16470588235294117 0.09803921568627451);
109
- --heading-text-color: var(--neutral-800);
110
- --line-height-heading: 1.1;
111
- --line-height-none: 1;
112
- --line-height-text: 1.5;
113
- --neutral-000: color(srgb 1 1 1);
114
- --neutral-100: color(srgb 0.9647058823529412 0.9647058823529412 0.9686274509803922);
115
- --neutral-200: color(srgb 0.9137254901960784 0.9215686274509803 0.9294117647058824);
116
- --neutral-300: color(srgb 0.8196078431372549 0.8352941176470589 0.8549019607843137);
117
- --neutral-400: color(srgb 0.615686274509804 0.6549019607843137 0.6980392156862745);
118
- --neutral-500: color(srgb 0.4666666666666667 0.5019607843137255 0.5372549019607843);
119
- --neutral-600: color(srgb 0.32941176470588235 0.35294117647058826 0.3803921568627451);
120
- --neutral-700: color(srgb 0.20784313725490197 0.22745098039215686 0.24313725490196078);
121
- --neutral-800: color(srgb 0.09411764705882353 0.10196078431372549 0.10980392156862745);
122
- --neutral-900: color(srgb 0.023529411764705882 0.043137254901960784 0.06274509803921569);
123
- --page-content-max-width: 80rem;
124
- --page-gutter: var(--space-l);
125
- --pink-000: color(srgb 0.9882352941176471 0.9411764705882353 0.984313725490196);
126
- --pink-100: color(srgb 0.9647058823529412 0.8235294117647058 0.9490196078431372);
127
- --pink-200: color(srgb 0.9686274509803922 0.7372549019607844 0.9529411764705882);
128
- --pink-300: color(srgb 0.9529411764705882 0.6588235294117647 0.9333333333333333);
129
- --pink-400: color(srgb 0.9372549019607843 0.4980392156862745 0.9215686274509803);
130
- --pink-500: color(srgb 0.8745098039215686 0.35294117647058826 0.8627450980392157);
131
- --pink-600: color(srgb 0.7254901960784313 0.2196078431372549 0.7215686274509804);
132
- --pink-700: color(srgb 0.6039215686274509 0.17647058823529413 0.6);
133
- --pink-800: color(srgb 0.4235294117647059 0.11372549019607843 0.4196078431372549);
134
- --pink-900: color(srgb 0.2196078431372549 0.10588235294117647 0.21568627450980393);
135
- --purple-000: color(srgb 0.9607843137254902 0.9490196078431372 0.9882352941176471);
136
- --purple-100: color(srgb 0.8862745098039215 0.8509803921568627 0.9686274509803922);
137
- --purple-200: color(srgb 0.8470588235294118 0.7803921568627451 1);
138
- --purple-300: color(srgb 0.792156862745098 0.7254901960784313 0.9568627450980393);
139
- --purple-400: color(srgb 0.7058823529411765 0.615686274509804 0.9450980392156862);
140
- --purple-500: color(srgb 0.6078431372549019 0.5019607843137255 0.9294117647058824);
141
- --purple-600: color(srgb 0.4666666666666667 0.3607843137254902 0.9058823529411765);
142
- --purple-700: color(srgb 0.3803921568627451 0.2901960784313726 0.792156862745098);
143
- --purple-800: color(srgb 0.2196078431372549 0.16470588235294117 0.6431372549019608);
144
- --purple-900: color(srgb 0.1607843137254902 0.12941176470588237 0.25882352941176473);
145
- --radius-2xl: 1.875rem;
146
- --radius-l: 0.75rem;
147
- --radius-m: 0.375rem;
148
- --radius-pill: 360px;
149
- --radius-s: 0.25rem;
150
- --radius-xl: 1rem;
151
- --radius-xs: 0.125rem;
152
- --red-000: color(srgb 0.984313725490196 0.9333333333333333 0.9294117647058824);
153
- --red-100: color(srgb 0.984313725490196 0.8274509803921568 0.8156862745098039);
154
- --red-200: color(srgb 1 0.7411764705882353 0.7294117647058823);
155
- --red-300: color(srgb 1 0.6784313725490196 0.6627450980392157);
156
- --red-400: color(srgb 0.996078431372549 0.5137254901960784 0.5098039215686274);
157
- --red-500: color(srgb 0.996078431372549 0.3058823529411765 0.3607843137254902);
158
- --red-600: color(srgb 0.8392156862745098 0.15294117647058825 0.25098039215686274);
159
- --red-700: color(srgb 0.6862745098039216 0.1450980392156863 0.21176470588235294);
160
- --red-800: color(srgb 0.5019607843137255 0.0392156862745098 0.12549019607843137);
161
- --red-900: color(srgb 0.23921568627450981 0.10980392156862745 0.10588235294117647);
162
- --search-answer-message-color: var(--neutral-200);
163
- --search-back-btn-bg-color: var(--neutral-100);
164
- --search-bg-color: var(--neutral-000);
165
- --search-highlight-color: var(--teal-000);
166
- --search-icon-color: var(--neutral-400);
167
- --search-input-bg-color: var(--neutral-100);
168
- --search-loading-color: var(--teal-700);
169
- --search-source-list-color: var(--neutral-100);
170
- --search-submit-btn-bg-color: var(--teal-200);
171
- --search-user-message-color: var(--teal-000);
172
- --shadow-deep: 0 16px 24px 0 color(srgb 0 0 0 / 0.07), 0 6px 30px 0 color(srgb 0 0 0 / 0.06), 0 8px 10px 0 color(srgb 0 0 0 / 0.1);
173
- --shadow-heavy: -10px 10px 80px 0 color(srgb 0 0 0 / 0.1);
174
- --shadow-hover: 0 4px 12px 0 color(srgb 0 0 0 / 0.25);
175
- --shadow-light: 0 2px 4px 0 color(srgb 0.2 0.21568627450980393 0.23137254901960785 / 0.08), 0 1px 10px 0 color(srgb 0.2 0.21568627450980393 0.23137254901960785 / 0.06);
176
- --space-2xl: 4rem;
177
- --space-2xs: 0.5rem;
178
- --space-3xl: 6rem;
179
- --space-3xs: 0.25rem;
180
- --space-4xl: 10rem;
181
- --space-l: 2rem;
182
- --space-m: 1.5rem;
183
- --space-s: 1rem;
184
- --space-xl: 3rem;
185
- --space-xs: 0.75rem;
186
- --tabbed-content-bg-color: var(--neutral-000);
187
- --tabbed-content-bg-color-active: var(--neutral-000);
188
- --tabbed-content-border-color: var(--color-icon);
189
- --tabbed-content-code-bg-color: var(--neutral-900);
190
- --tabbed-content-tab-text-color-active: var(--color-icon);
191
- --teal-000: color(srgb 0.8705882352941177 1 0.996078431372549);
192
- --teal-100: color(srgb 0.5568627450980392 0.984313725490196 0.9686274509803922);
193
- --teal-200: color(srgb 0.19607843137254902 0.9019607843137255 0.8862745098039215);
194
- --teal-300: color(srgb 0.0784313725490196 0.8470588235294118 0.8313725490196079);
195
- --teal-400: color(srgb 0.0196078431372549 0.7411764705882353 0.7294117647058823);
196
- --teal-500: color(srgb 0.01568627450980392 0.6352941176470588 0.6235294117647059);
197
- --teal-600: color(srgb 0.00784313725490196 0.5019607843137255 0.49019607843137253);
198
- --teal-700: color(srgb 0.00392156862745098 0.4117647058823529 0.40784313725490196);
199
- --teal-800: color(srgb 0.00392156862745098 0.2823529411764706 0.2784313725490196);
200
- --teal-900: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117);
201
- --testimonial-logo-hover-color: var(--neutral-500);
202
- --testimonial-logo-inactive-color: var(--neutral-400);
203
- --title-text-color: color(srgb 0.32941176470588235 0.35294117647058826 0.3803921568627451 / 0.7490196078431373);
6
+ --ntl-active-switcher-tab-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.047058823529411764);
7
+ --ntl-badge-bg-color: var(--ntl-neutral-100);
8
+ --ntl-badge-border-color: var(--ntl-neutral-300);
9
+ --ntl-badge-text-color: var(--ntl-neutral-500);
10
+ --ntl-blockquote-accent-color: var(--ntl-blue-700);
11
+ --ntl-blue-000: color(srgb 0.9294117647058824 0.9568627450980393 1);
12
+ --ntl-blue-100: color(srgb 0.803921568627451 0.8862745098039215 1);
13
+ --ntl-blue-200: color(srgb 0.7098039215686275 0.8235294117647058 0.984313725490196);
14
+ --ntl-blue-300: color(srgb 0.611764705882353 0.7450980392156863 0.9647058823529412);
15
+ --ntl-blue-400: color(srgb 0.5019607843137255 0.6705882352941176 0.9803921568627451);
16
+ --ntl-blue-500: color(srgb 0.36470588235294116 0.5529411764705883 0.9607843137254902);
17
+ --ntl-blue-600: color(srgb 0.19215686274509805 0.4196078431372549 0.9568627450980393);
18
+ --ntl-blue-700: color(srgb 0.1803921568627451 0.3176470588235294 0.9294117647058824);
19
+ --ntl-blue-800: color(srgb 0.12549019607843137 0.21176470588235294 0.6313725490196078);
20
+ --ntl-blue-900: color(srgb 0.10588235294117647 0.12549019607843137 0.3568627450980392);
21
+ --ntl-border-width-base: 1.5px;
22
+ --ntl-border-width-heavy: 3px;
23
+ --ntl-border-width-thick: 2px;
24
+ --ntl-border-width-thin: 1px;
25
+ --ntl-button-outline-bg-color: color(srgb 0 0 0 / 0);
26
+ --ntl-button-outline-bg-color-hover: color(srgb 0.8392156862745098 0.9803921568627451 0.9764705882352941);
27
+ --ntl-button-outline-stroke-color: var(--ntl-neutral-800);
28
+ --ntl-button-outline-text-color: var(--ntl-neutral-800);
29
+ --ntl-button-primary-bg-color: var(--ntl-teal-200);
30
+ --ntl-button-primary-bg-color-hover: var(--ntl-teal-100);
31
+ --ntl-button-primary-text-color: var(--ntl-neutral-800);
32
+ --ntl-button-secondary-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.09803921568627451);
33
+ --ntl-button-secondary-bg-color-hover: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.14901960784313725);
34
+ --ntl-button-secondary-text-color: var(--ntl-neutral-800);
35
+ --ntl-card-bg-color: var(--ntl-neutral-000);
36
+ --ntl-card-border-color: var(--ntl-neutral-200);
37
+ --ntl-card-border-color-hover: var(--ntl-neutral-300);
38
+ --ntl-code-bg-color: var(--ntl-teal-900);
39
+ --ntl-color-bg: var(--ntl-neutral-000);
40
+ --ntl-color-bg-2: var(--ntl-neutral-100);
41
+ --ntl-color-bg-3: var(--ntl-neutral-200);
42
+ --ntl-color-bg-inverse: var(--ntl-neutral-300);
43
+ --ntl-color-bg-translucent: color(srgb 1 1 1 / 0.9019607843137255);
44
+ --ntl-color-border-default: color(srgb 0 0 0 / 0.14901960784313725);
45
+ --ntl-color-border-strong: var(--ntl-neutral-300);
46
+ --ntl-color-border-subtle: color(srgb 0 0 0 / 0.06274509803921569);
47
+ --ntl-color-brand-primary: var(--ntl-blue-700);
48
+ --ntl-color-brand-primary-hover: var(--ntl-blue-800);
49
+ --ntl-color-brand-secondary: var(--ntl-teal-300);
50
+ --ntl-color-brand-secondary-hover: var(--ntl-teal-800);
51
+ --ntl-color-disabled-bg: var(--ntl-neutral-200);
52
+ --ntl-color-disabled-border: var(--ntl-neutral-400);
53
+ --ntl-color-disabled-text: var(--ntl-neutral-400);
54
+ --ntl-color-highlight-bg: var(--ntl-purple-100);
55
+ --ntl-color-highlight-border: var(--ntl-purple-600);
56
+ --ntl-color-highlight-text: var(--ntl-purple-600);
57
+ --ntl-color-icon: var(--ntl-blue-700);
58
+ --ntl-color-info-bg: var(--ntl-blue-100);
59
+ --ntl-color-info-border: var(--ntl-blue-600);
60
+ --ntl-color-info-text: var(--ntl-blue-600);
61
+ --ntl-color-invalid-bg: var(--ntl-red-100);
62
+ --ntl-color-invalid-border: var(--ntl-red-600);
63
+ --ntl-color-invalid-text: var(--ntl-red-600);
64
+ --ntl-color-link: var(--ntl-blue-700);
65
+ --ntl-color-link-default: var(--ntl-blue-700);
66
+ --ntl-color-link-hover: var(--ntl-blue-800);
67
+ --ntl-color-link-inverse: var(--ntl-blue-400);
68
+ --ntl-color-logo-inactive: color(srgb 0.7019607843137254 0.7019607843137254 0.7019607843137254);
69
+ --ntl-color-logo-spark: var(--ntl-teal-400);
70
+ --ntl-color-logo-type: var(--ntl-teal-800);
71
+ --ntl-color-stroke: color(srgb 0 0 0 / 0.14901960784313725);
72
+ --ntl-color-success-bg: var(--ntl-green-100);
73
+ --ntl-color-success-border: var(--ntl-green-300);
74
+ --ntl-color-success-text: var(--ntl-green-800);
75
+ --ntl-color-text: var(--ntl-neutral-700);
76
+ --ntl-color-text-accent: var(--ntl-teal-300);
77
+ --ntl-color-text-default: var(--ntl-neutral-700);
78
+ --ntl-color-text-inverse: var(--ntl-neutral-100);
79
+ --ntl-color-text-weak: var(--ntl-neutral-500);
80
+ --ntl-color-text-weaker: var(--ntl-neutral-400);
81
+ --ntl-color-warning-bg: var(--ntl-gold-100);
82
+ --ntl-color-warning-border: var(--ntl-gold-300);
83
+ --ntl-color-warning-text: var(--ntl-gold-800);
84
+ --ntl-eyebrow-text-color: var(--ntl-blue-700);
85
+ --ntl-focus-outline-offset: 0;
86
+ --ntl-focus-outline-width: 5px;
87
+ --ntl-font-family-display: "Figtree", system-ui, "Helvetica", sans-serif;
88
+ --ntl-font-family-mono: "Martian Mono", ui-monospace, "Cascadia Code", "Source Code Pro", "Menlo", "Consolas", "DejaVu Sans Mono", monospace;
89
+ --ntl-font-family-text: "Instrument Sans", system-ui, "Helvetica", sans-serif;
90
+ --ntl-font-size-display-2xl: 4rem;
91
+ --ntl-font-size-display-2xs: 1.25rem;
92
+ --ntl-font-size-display-3xl: 4.5rem;
93
+ --ntl-font-size-display-4xl: 5rem;
94
+ --ntl-font-size-display-lg: 3rem;
95
+ --ntl-font-size-display-md: 2.5rem;
96
+ --ntl-font-size-display-sm: 2rem;
97
+ --ntl-font-size-display-xl: 3.5rem;
98
+ --ntl-font-size-display-xs: 1.5rem;
99
+ --ntl-font-size-text-lg: 1.125rem;
100
+ --ntl-font-size-text-md: 1rem;
101
+ --ntl-font-size-text-sm: 0.875rem;
102
+ --ntl-font-size-text-xl: 1.375rem;
103
+ --ntl-font-size-text-xs: 0.75rem;
104
+ --ntl-font-weight-bold: 700;
105
+ --ntl-font-weight-extrabold: 800;
106
+ --ntl-font-weight-medium: 500;
107
+ --ntl-font-weight-regular: 400;
108
+ --ntl-font-weight-semibold: 600;
109
+ --ntl-gold-000: color(srgb 0.9921568627450981 0.9607843137254902 0.8470588235294118);
110
+ --ntl-gold-100: color(srgb 0.9647058823529412 0.8784313725490196 0.6470588235294118);
111
+ --ntl-gold-200: color(srgb 0.9803921568627451 0.803921568627451 0.43529411764705883);
112
+ --ntl-gold-300: color(srgb 0.984313725490196 0.6941176470588235 0.23921568627450981);
113
+ --ntl-gold-400: color(srgb 0.9764705882352941 0.5568627450980392 0.12941176470588237);
114
+ --ntl-gold-500: color(srgb 0.8352941176470589 0.4666666666666667 0.10196078431372549);
115
+ --ntl-gold-600: color(srgb 0.6588235294117647 0.36470588235294116 0.07450980392156863);
116
+ --ntl-gold-700: color(srgb 0.5490196078431373 0.2980392156862745 0.050980392156862744);
117
+ --ntl-gold-800: color(srgb 0.3764705882352941 0.20392156862745098 0.03137254901960784);
118
+ --ntl-gold-900: color(srgb 0.2 0.13333333333333333 0.07450980392156863);
119
+ --ntl-green-000: color(srgb 0.9058823529411765 0.9882352941176471 0.9137254901960784);
120
+ --ntl-green-100: color(srgb 0.7450980392156863 0.9764705882352941 0.7764705882352941);
121
+ --ntl-green-200: color(srgb 0.5764705882352941 0.9607843137254902 0.6470588235294118);
122
+ --ntl-green-300: color(srgb 0.39215686274509803 0.8470588235294118 0.4980392156862745);
123
+ --ntl-green-400: color(srgb 0.22745098039215686 0.7647058823529411 0.39215686274509803);
124
+ --ntl-green-500: color(srgb 0.19215686274509805 0.6588235294117647 0.3333333333333333);
125
+ --ntl-green-600: color(srgb 0.13333333333333333 0.5098039215686274 0.25098039215686274);
126
+ --ntl-green-700: color(srgb 0.10196078431372549 0.4196078431372549 0.20392156862745098);
127
+ --ntl-green-800: color(srgb 0.058823529411764705 0.2901960784313726 0.12941176470588237);
128
+ --ntl-green-900: color(srgb 0.08235294117647059 0.16470588235294117 0.09803921568627451);
129
+ --ntl-heading-text-color: var(--ntl-neutral-800);
130
+ --ntl-line-height-heading: 1.1;
131
+ --ntl-line-height-loose: 2;
132
+ --ntl-line-height-none: 1;
133
+ --ntl-line-height-relaxed: 1.65;
134
+ --ntl-line-height-snug: 1.35;
135
+ --ntl-line-height-text: 1.5;
136
+ --ntl-line-height-tight: 1.2;
137
+ --ntl-motion-duration-base: 200ms;
138
+ --ntl-motion-duration-fast: 100ms;
139
+ --ntl-motion-duration-slow: 300ms;
140
+ --ntl-motion-duration-slower: 500ms;
141
+ --ntl-motion-easing-default: ease;
142
+ --ntl-motion-easing-in: ease-in;
143
+ --ntl-motion-easing-out: ease-out;
144
+ --ntl-motion-easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
145
+ --ntl-neutral-000: color(srgb 1 1 1);
146
+ --ntl-neutral-100: color(srgb 0.9647058823529412 0.9647058823529412 0.9686274509803922);
147
+ --ntl-neutral-200: color(srgb 0.9137254901960784 0.9215686274509803 0.9294117647058824);
148
+ --ntl-neutral-300: color(srgb 0.8196078431372549 0.8352941176470589 0.8549019607843137);
149
+ --ntl-neutral-400: color(srgb 0.615686274509804 0.6549019607843137 0.6980392156862745);
150
+ --ntl-neutral-500: color(srgb 0.4666666666666667 0.5019607843137255 0.5372549019607843);
151
+ --ntl-neutral-600: color(srgb 0.32941176470588235 0.35294117647058826 0.3803921568627451);
152
+ --ntl-neutral-700: color(srgb 0.20784313725490197 0.22745098039215686 0.24313725490196078);
153
+ --ntl-neutral-800: color(srgb 0.09411764705882353 0.10196078431372549 0.10980392156862745);
154
+ --ntl-neutral-900: color(srgb 0.023529411764705882 0.043137254901960784 0.06274509803921569);
155
+ --ntl-page-content-max-width: 80rem;
156
+ --ntl-page-gutter: var(--ntl-space-l);
157
+ --ntl-pink-000: color(srgb 0.9882352941176471 0.9411764705882353 0.984313725490196);
158
+ --ntl-pink-100: color(srgb 0.9647058823529412 0.8235294117647058 0.9490196078431372);
159
+ --ntl-pink-200: color(srgb 0.9686274509803922 0.7372549019607844 0.9529411764705882);
160
+ --ntl-pink-300: color(srgb 0.9529411764705882 0.6588235294117647 0.9333333333333333);
161
+ --ntl-pink-400: color(srgb 0.9372549019607843 0.4980392156862745 0.9215686274509803);
162
+ --ntl-pink-500: color(srgb 0.8745098039215686 0.35294117647058826 0.8627450980392157);
163
+ --ntl-pink-600: color(srgb 0.7254901960784313 0.2196078431372549 0.7215686274509804);
164
+ --ntl-pink-700: color(srgb 0.6039215686274509 0.17647058823529413 0.6);
165
+ --ntl-pink-800: color(srgb 0.4235294117647059 0.11372549019607843 0.4196078431372549);
166
+ --ntl-pink-900: color(srgb 0.2196078431372549 0.10588235294117647 0.21568627450980393);
167
+ --ntl-purple-000: color(srgb 0.9607843137254902 0.9490196078431372 0.9882352941176471);
168
+ --ntl-purple-100: color(srgb 0.8862745098039215 0.8509803921568627 0.9686274509803922);
169
+ --ntl-purple-200: color(srgb 0.8470588235294118 0.7803921568627451 1);
170
+ --ntl-purple-300: color(srgb 0.792156862745098 0.7254901960784313 0.9568627450980393);
171
+ --ntl-purple-400: color(srgb 0.7058823529411765 0.615686274509804 0.9450980392156862);
172
+ --ntl-purple-500: color(srgb 0.6078431372549019 0.5019607843137255 0.9294117647058824);
173
+ --ntl-purple-600: color(srgb 0.4666666666666667 0.3607843137254902 0.9058823529411765);
174
+ --ntl-purple-700: color(srgb 0.3803921568627451 0.2901960784313726 0.792156862745098);
175
+ --ntl-purple-800: color(srgb 0.2196078431372549 0.16470588235294117 0.6431372549019608);
176
+ --ntl-purple-900: color(srgb 0.1607843137254902 0.12941176470588237 0.25882352941176473);
177
+ --ntl-radius-2xl: 1.875rem;
178
+ --ntl-radius-l: 0.75rem;
179
+ --ntl-radius-m: 0.375rem;
180
+ --ntl-radius-pill: 360px;
181
+ --ntl-radius-s: 0.25rem;
182
+ --ntl-radius-xl: 1rem;
183
+ --ntl-radius-xs: 0.125rem;
184
+ --ntl-red-000: color(srgb 0.984313725490196 0.9333333333333333 0.9294117647058824);
185
+ --ntl-red-100: color(srgb 0.984313725490196 0.8274509803921568 0.8156862745098039);
186
+ --ntl-red-200: color(srgb 1 0.7411764705882353 0.7294117647058823);
187
+ --ntl-red-300: color(srgb 1 0.6784313725490196 0.6627450980392157);
188
+ --ntl-red-400: color(srgb 0.996078431372549 0.5137254901960784 0.5098039215686274);
189
+ --ntl-red-500: color(srgb 0.996078431372549 0.3058823529411765 0.3607843137254902);
190
+ --ntl-red-600: color(srgb 0.8392156862745098 0.15294117647058825 0.25098039215686274);
191
+ --ntl-red-700: color(srgb 0.6862745098039216 0.1450980392156863 0.21176470588235294);
192
+ --ntl-red-800: color(srgb 0.5019607843137255 0.0392156862745098 0.12549019607843137);
193
+ --ntl-red-900: color(srgb 0.23921568627450981 0.10980392156862745 0.10588235294117647);
194
+ --ntl-search-answer-message-color: var(--ntl-neutral-200);
195
+ --ntl-search-back-btn-bg-color: var(--ntl-neutral-100);
196
+ --ntl-search-bg-color: var(--ntl-neutral-000);
197
+ --ntl-search-highlight-color: var(--ntl-teal-000);
198
+ --ntl-search-icon-color: var(--ntl-neutral-400);
199
+ --ntl-search-input-bg-color: var(--ntl-neutral-100);
200
+ --ntl-search-loading-color: var(--ntl-teal-700);
201
+ --ntl-search-source-list-color: var(--ntl-neutral-100);
202
+ --ntl-search-submit-btn-bg-color: var(--ntl-teal-200);
203
+ --ntl-search-user-message-color: var(--ntl-teal-000);
204
+ --ntl-shadow-deep: 0 16px 24px 0 color(srgb 0 0 0 / 0.07), 0 6px 30px 0 color(srgb 0 0 0 / 0.06), 0 8px 10px 0 color(srgb 0 0 0 / 0.1);
205
+ --ntl-shadow-heavy: -10px 10px 80px 0 color(srgb 0 0 0 / 0.1);
206
+ --ntl-shadow-hover: 0 4px 12px 0 color(srgb 0 0 0 / 0.25);
207
+ --ntl-shadow-light: 0 2px 4px 0 color(srgb 0.2 0.21568627450980393 0.23137254901960785 / 0.08), 0 1px 10px 0 color(srgb 0.2 0.21568627450980393 0.23137254901960785 / 0.06);
208
+ --ntl-space-0: 0;
209
+ --ntl-space-2xl: 4rem;
210
+ --ntl-space-2xs: 0.5rem;
211
+ --ntl-space-3xl: 6rem;
212
+ --ntl-space-3xs: 0.25rem;
213
+ --ntl-space-4xl: 10rem;
214
+ --ntl-space-l: 2rem;
215
+ --ntl-space-m: 1.5rem;
216
+ --ntl-space-s: 1rem;
217
+ --ntl-space-xl: 3rem;
218
+ --ntl-space-xs: 0.75rem;
219
+ --ntl-tabbed-content-bg-color: var(--ntl-neutral-000);
220
+ --ntl-tabbed-content-bg-color-active: var(--ntl-neutral-000);
221
+ --ntl-tabbed-content-border-color: var(--ntl-color-icon);
222
+ --ntl-tabbed-content-code-bg-color: var(--ntl-neutral-900);
223
+ --ntl-tabbed-content-tab-text-color-active: var(--ntl-color-icon);
224
+ --ntl-teal-000: color(srgb 0.8705882352941177 1 0.996078431372549);
225
+ --ntl-teal-100: color(srgb 0.5568627450980392 0.984313725490196 0.9686274509803922);
226
+ --ntl-teal-200: color(srgb 0.19607843137254902 0.9019607843137255 0.8862745098039215);
227
+ --ntl-teal-300: color(srgb 0.0784313725490196 0.8470588235294118 0.8313725490196079);
228
+ --ntl-teal-400: color(srgb 0.0196078431372549 0.7411764705882353 0.7294117647058823);
229
+ --ntl-teal-500: color(srgb 0.01568627450980392 0.6352941176470588 0.6235294117647059);
230
+ --ntl-teal-600: color(srgb 0.00784313725490196 0.5019607843137255 0.49019607843137253);
231
+ --ntl-teal-700: color(srgb 0.00392156862745098 0.4117647058823529 0.40784313725490196);
232
+ --ntl-teal-800: color(srgb 0.00392156862745098 0.2823529411764706 0.2784313725490196);
233
+ --ntl-teal-900: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117);
234
+ --ntl-testimonial-logo-hover-color: var(--ntl-neutral-500);
235
+ --ntl-testimonial-logo-inactive-color: var(--ntl-neutral-400);
236
+ --ntl-text-underline-offset: 0.125em;
237
+ --ntl-title-text-color: color(srgb 0.32941176470588235 0.35294117647058826 0.3803921568627451 / 0.7490196078431373);
238
+ --ntl-tracking-tight: -0.02em;
239
+ --ntl-z-index-base: 0;
240
+ --ntl-z-index-modal: 300;
241
+ --ntl-z-index-overlay: 200;
242
+ --ntl-z-index-raised: 10;
243
+ --ntl-z-index-sticky: 100;
244
+ --ntl-z-index-toast: 400;
245
+ --ntl-z-index-tooltip: 500;
204
246
  }
205
247
 
206
248
  @media (prefers-color-scheme: dark) {
207
249
  :root {
208
- --active-switcher-tab-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117);
209
- --badge-bg-color: var(--neutral-700);
210
- --badge-border-color: var(--neutral-600);
211
- --badge-text-color: var(--neutral-100);
212
- --blockquote-accent-color: var(--teal-200);
213
- --button-outline-bg-color: color(srgb 0 0 0 / 0);
214
- --button-outline-bg-color-hover: var(--neutral-500);
215
- --button-outline-stroke-color: var(--teal-200);
216
- --button-outline-text-color: var(--teal-200);
217
- --button-primary-bg-color: var(--teal-200);
218
- --button-primary-bg-color-hover: var(--teal-100);
219
- --button-primary-text-color: var(--neutral-800);
220
- --button-secondary-bg-color: color(srgb 1 1 1 / 0.09803921568627451);
221
- --button-secondary-bg-color-hover: color(srgb 0.6549019607843137 1 0.9921568627450981 / 0.14901960784313725);
222
- --button-secondary-text-color: var(--teal-200);
223
- --card-bg-color: var(--teal-900);
224
- --card-border-color: var(--teal-900);
225
- --card-border-color-hover: var(--teal-800);
226
- --code-bg-color: var(--teal-900);
227
- --color-bg: var(--neutral-800);
228
- --color-bg-2: var(--neutral-700);
229
- --color-bg-3: var(--neutral-600);
230
- --color-disabled-bg: var(--neutral-600);
231
- --color-disabled-border: var(--neutral-400);
232
- --color-disabled-text: var(--neutral-400);
233
- --color-highlight-bg: var(--purple-200);
234
- --color-highlight-border: var(--purple-700);
235
- --color-highlight-text: var(--purple-700);
236
- --color-icon: var(--teal-200);
237
- --color-info-bg: var(--blue-200);
238
- --color-info-border: var(--blue-700);
239
- --color-info-text: var(--blue-700);
240
- --color-invalid-bg: var(--red-200);
241
- --color-invalid-border: var(--red-700);
242
- --color-invalid-text: var(--red-700);
243
- --color-link: var(--teal-200);
244
- --color-logo-inactive: color(srgb 0.2823529411764706 0.36470588235294116 0.36470588235294116);
245
- --color-logo-spark: var(--teal-200);
246
- --color-logo-type: var(--neutral-000);
247
- --color-stroke: color(srgb 1 1 1 / 0.09803921568627451);
248
- --color-success-bg: var(--green-200);
249
- --color-success-border: var(--green-400);
250
- --color-success-text: var(--green-900);
251
- --color-text: var(--teal-000);
252
- --color-text-accent: var(--teal-600);
253
- --color-text-weak: var(--neutral-300);
254
- --color-text-weaker: var(--neutral-400);
255
- --color-warning-bg: var(--gold-200);
256
- --color-warning-border: var(--gold-400);
257
- --color-warning-text: var(--gold-900);
258
- --eyebrow-text-color: var(--teal-200);
259
- --filter-invert: invert(1);
260
- --heading-text-color: var(--neutral-100);
261
- --neutral-000: color(srgb 0 0 0);
262
- --neutral-100: color(srgb 0.9019607843137255 0.9254901960784314 0.9490196078431372);
263
- --neutral-200: color(srgb 0.6705882352941176 0.7098039215686275 0.7490196078431373);
264
- --neutral-300: color(srgb 0.49411764705882355 0.5294117647058824 0.5725490196078431);
265
- --neutral-400: color(srgb 0.30196078431372547 0.33725490196078434 0.37254901960784315);
266
- --neutral-500: color(srgb 0.23137254901960785 0.2627450980392157 0.2980392156862745);
267
- --neutral-600: color(srgb 0.15294117647058825 0.1843137254901961 0.2196078431372549);
268
- --neutral-700: color(srgb 0.11764705882352941 0.1411764705882353 0.17254901960784313);
269
- --neutral-800: color(srgb 0.07058823529411765 0.09411764705882353 0.12156862745098039);
270
- --neutral-900: color(srgb 0.023529411764705882 0.043137254901960784 0.06274509803921569);
271
- --search-answer-message-color: var(--neutral-600);
272
- --search-back-btn-bg-color: var(--neutral-500);
273
- --search-bg-color: var(--neutral-700);
274
- --search-highlight-color: var(--teal-800);
275
- --search-icon-color: var(--neutral-300);
276
- --search-input-bg-color: var(--neutral-600);
277
- --search-loading-color: var(--teal-200);
278
- --search-source-list-color: var(--neutral-700);
279
- --search-submit-btn-bg-color: var(--teal-200);
280
- --search-user-message-color: var(--teal-800);
281
- --tabbed-content-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.2);
282
- --tabbed-content-bg-color-active: var(--teal-900);
283
- --tabbed-content-border-color: var(--color-icon);
284
- --tabbed-content-code-bg-color: var(--neutral-900);
285
- --tabbed-content-tab-text-color-active: var(--color-icon);
286
- --testimonial-logo-hover-color: var(--neutral-300);
287
- --testimonial-logo-inactive-color: var(--neutral-400);
288
- --title-text-color: color(srgb 0.8352941176470589 1 0.996078431372549 / 0.7490196078431373);
250
+ --ntl-active-switcher-tab-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117);
251
+ --ntl-badge-bg-color: var(--ntl-neutral-700);
252
+ --ntl-badge-border-color: var(--ntl-neutral-600);
253
+ --ntl-badge-text-color: var(--ntl-neutral-100);
254
+ --ntl-blockquote-accent-color: var(--ntl-teal-200);
255
+ --ntl-button-outline-bg-color: color(srgb 0 0 0 / 0);
256
+ --ntl-button-outline-bg-color-hover: var(--ntl-neutral-500);
257
+ --ntl-button-outline-stroke-color: var(--ntl-teal-200);
258
+ --ntl-button-outline-text-color: var(--ntl-teal-200);
259
+ --ntl-button-primary-bg-color: var(--ntl-teal-200);
260
+ --ntl-button-primary-bg-color-hover: var(--ntl-teal-100);
261
+ --ntl-button-primary-text-color: var(--ntl-neutral-800);
262
+ --ntl-button-secondary-bg-color: color(srgb 1 1 1 / 0.09803921568627451);
263
+ --ntl-button-secondary-bg-color-hover: color(srgb 0.6549019607843137 1 0.9921568627450981 / 0.14901960784313725);
264
+ --ntl-button-secondary-text-color: var(--ntl-teal-200);
265
+ --ntl-card-bg-color: var(--ntl-teal-900);
266
+ --ntl-card-border-color: var(--ntl-teal-900);
267
+ --ntl-card-border-color-hover: var(--ntl-teal-800);
268
+ --ntl-code-bg-color: var(--ntl-teal-900);
269
+ --ntl-color-bg: var(--ntl-neutral-800);
270
+ --ntl-color-bg-2: var(--ntl-neutral-700);
271
+ --ntl-color-bg-3: var(--ntl-neutral-600);
272
+ --ntl-color-bg-inverse: var(--ntl-neutral-000);
273
+ --ntl-color-bg-translucent: color(srgb 0.07058823529411765 0.09411764705882353 0.12156862745098039 / 0.9490196078431372);
274
+ --ntl-color-border-default: color(srgb 1 1 1 / 0.09803921568627451);
275
+ --ntl-color-border-strong: var(--ntl-neutral-500);
276
+ --ntl-color-border-subtle: color(srgb 1 1 1 / 0.0392156862745098);
277
+ --ntl-color-brand-primary: var(--ntl-teal-300);
278
+ --ntl-color-brand-primary-hover: var(--ntl-teal-800);
279
+ --ntl-color-brand-secondary: var(--ntl-blue-700);
280
+ --ntl-color-brand-secondary-hover: var(--ntl-blue-800);
281
+ --ntl-color-disabled-bg: var(--ntl-neutral-600);
282
+ --ntl-color-disabled-border: var(--ntl-neutral-400);
283
+ --ntl-color-disabled-text: var(--ntl-neutral-400);
284
+ --ntl-color-highlight-bg: var(--ntl-purple-200);
285
+ --ntl-color-highlight-border: var(--ntl-purple-700);
286
+ --ntl-color-highlight-text: var(--ntl-purple-700);
287
+ --ntl-color-icon: var(--ntl-teal-200);
288
+ --ntl-color-info-bg: var(--ntl-blue-200);
289
+ --ntl-color-info-border: var(--ntl-blue-700);
290
+ --ntl-color-info-text: var(--ntl-blue-700);
291
+ --ntl-color-invalid-bg: var(--ntl-red-200);
292
+ --ntl-color-invalid-border: var(--ntl-red-700);
293
+ --ntl-color-invalid-text: var(--ntl-red-700);
294
+ --ntl-color-link: var(--ntl-teal-200);
295
+ --ntl-color-link-default: var(--ntl-teal-200);
296
+ --ntl-color-link-hover: var(--ntl-teal-100);
297
+ --ntl-color-link-inverse: var(--ntl-blue-600);
298
+ --ntl-color-logo-inactive: color(srgb 0.2823529411764706 0.36470588235294116 0.36470588235294116);
299
+ --ntl-color-logo-spark: var(--ntl-teal-200);
300
+ --ntl-color-logo-type: var(--ntl-neutral-000);
301
+ --ntl-color-stroke: color(srgb 1 1 1 / 0.09803921568627451);
302
+ --ntl-color-success-bg: var(--ntl-green-200);
303
+ --ntl-color-success-border: var(--ntl-green-400);
304
+ --ntl-color-success-text: var(--ntl-green-900);
305
+ --ntl-color-text: var(--ntl-teal-000);
306
+ --ntl-color-text-accent: var(--ntl-teal-600);
307
+ --ntl-color-text-default: var(--ntl-teal-000);
308
+ --ntl-color-text-inverse: var(--ntl-teal-800);
309
+ --ntl-color-text-weak: var(--ntl-neutral-300);
310
+ --ntl-color-text-weaker: var(--ntl-neutral-400);
311
+ --ntl-color-warning-bg: var(--ntl-gold-200);
312
+ --ntl-color-warning-border: var(--ntl-gold-400);
313
+ --ntl-color-warning-text: var(--ntl-gold-900);
314
+ --ntl-eyebrow-text-color: var(--ntl-teal-200);
315
+ --ntl-filter-invert: invert(1);
316
+ --ntl-heading-text-color: var(--ntl-neutral-100);
317
+ --ntl-neutral-000: color(srgb 1 1 1);
318
+ --ntl-neutral-100: color(srgb 0.9019607843137255 0.9254901960784314 0.9490196078431372);
319
+ --ntl-neutral-200: color(srgb 0.6705882352941176 0.7098039215686275 0.7490196078431373);
320
+ --ntl-neutral-300: color(srgb 0.49411764705882355 0.5294117647058824 0.5725490196078431);
321
+ --ntl-neutral-400: color(srgb 0.30196078431372547 0.33725490196078434 0.37254901960784315);
322
+ --ntl-neutral-500: color(srgb 0.23137254901960785 0.2627450980392157 0.2980392156862745);
323
+ --ntl-neutral-600: color(srgb 0.15294117647058825 0.1843137254901961 0.2196078431372549);
324
+ --ntl-neutral-700: color(srgb 0.11764705882352941 0.1411764705882353 0.17254901960784313);
325
+ --ntl-neutral-800: color(srgb 0.07058823529411765 0.09411764705882353 0.12156862745098039);
326
+ --ntl-neutral-900: color(srgb 0.023529411764705882 0.043137254901960784 0.06274509803921569);
327
+ --ntl-search-answer-message-color: var(--ntl-neutral-600);
328
+ --ntl-search-back-btn-bg-color: var(--ntl-neutral-500);
329
+ --ntl-search-bg-color: var(--ntl-neutral-700);
330
+ --ntl-search-highlight-color: var(--ntl-teal-800);
331
+ --ntl-search-icon-color: var(--ntl-neutral-300);
332
+ --ntl-search-input-bg-color: var(--ntl-neutral-600);
333
+ --ntl-search-loading-color: var(--ntl-teal-200);
334
+ --ntl-search-source-list-color: var(--ntl-neutral-700);
335
+ --ntl-search-submit-btn-bg-color: var(--ntl-teal-200);
336
+ --ntl-search-user-message-color: var(--ntl-teal-800);
337
+ --ntl-tabbed-content-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.2);
338
+ --ntl-tabbed-content-bg-color-active: var(--ntl-teal-900);
339
+ --ntl-tabbed-content-border-color: var(--ntl-color-icon);
340
+ --ntl-tabbed-content-code-bg-color: var(--ntl-neutral-900);
341
+ --ntl-tabbed-content-tab-text-color-active: var(--ntl-color-icon);
342
+ --ntl-testimonial-logo-hover-color: var(--ntl-neutral-300);
343
+ --ntl-testimonial-logo-inactive-color: var(--ntl-neutral-400);
344
+ --ntl-title-text-color: color(srgb 0.8352941176470589 1 0.996078431372549 / 0.7490196078431373);
289
345
  }
290
346
  }
291
347
 
292
348
  [data-theme="dark"] {
293
- --active-switcher-tab-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117);
294
- --badge-bg-color: var(--neutral-700);
295
- --badge-border-color: var(--neutral-600);
296
- --badge-text-color: var(--neutral-100);
297
- --blockquote-accent-color: var(--teal-200);
298
- --button-outline-bg-color: color(srgb 0 0 0 / 0);
299
- --button-outline-bg-color-hover: var(--neutral-500);
300
- --button-outline-stroke-color: var(--teal-200);
301
- --button-outline-text-color: var(--teal-200);
302
- --button-primary-bg-color: var(--teal-200);
303
- --button-primary-bg-color-hover: var(--teal-100);
304
- --button-primary-text-color: var(--neutral-800);
305
- --button-secondary-bg-color: color(srgb 1 1 1 / 0.09803921568627451);
306
- --button-secondary-bg-color-hover: color(srgb 0.6549019607843137 1 0.9921568627450981 / 0.14901960784313725);
307
- --button-secondary-text-color: var(--teal-200);
308
- --card-bg-color: var(--teal-900);
309
- --card-border-color: var(--teal-900);
310
- --card-border-color-hover: var(--teal-800);
311
- --code-bg-color: var(--teal-900);
312
- --color-bg: var(--neutral-800);
313
- --color-bg-2: var(--neutral-700);
314
- --color-bg-3: var(--neutral-600);
315
- --color-disabled-bg: var(--neutral-600);
316
- --color-disabled-border: var(--neutral-400);
317
- --color-disabled-text: var(--neutral-400);
318
- --color-highlight-bg: var(--purple-200);
319
- --color-highlight-border: var(--purple-700);
320
- --color-highlight-text: var(--purple-700);
321
- --color-icon: var(--teal-200);
322
- --color-info-bg: var(--blue-200);
323
- --color-info-border: var(--blue-700);
324
- --color-info-text: var(--blue-700);
325
- --color-invalid-bg: var(--red-200);
326
- --color-invalid-border: var(--red-700);
327
- --color-invalid-text: var(--red-700);
328
- --color-link: var(--teal-200);
329
- --color-logo-inactive: color(srgb 0.2823529411764706 0.36470588235294116 0.36470588235294116);
330
- --color-logo-spark: var(--teal-200);
331
- --color-logo-type: var(--neutral-000);
332
- --color-stroke: color(srgb 1 1 1 / 0.09803921568627451);
333
- --color-success-bg: var(--green-200);
334
- --color-success-border: var(--green-400);
335
- --color-success-text: var(--green-900);
336
- --color-text: var(--teal-000);
337
- --color-text-accent: var(--teal-600);
338
- --color-text-weak: var(--neutral-300);
339
- --color-text-weaker: var(--neutral-400);
340
- --color-warning-bg: var(--gold-200);
341
- --color-warning-border: var(--gold-400);
342
- --color-warning-text: var(--gold-900);
343
- --eyebrow-text-color: var(--teal-200);
344
- --filter-invert: invert(1);
345
- --heading-text-color: var(--neutral-100);
346
- --neutral-000: color(srgb 0 0 0);
347
- --neutral-100: color(srgb 0.9019607843137255 0.9254901960784314 0.9490196078431372);
348
- --neutral-200: color(srgb 0.6705882352941176 0.7098039215686275 0.7490196078431373);
349
- --neutral-300: color(srgb 0.49411764705882355 0.5294117647058824 0.5725490196078431);
350
- --neutral-400: color(srgb 0.30196078431372547 0.33725490196078434 0.37254901960784315);
351
- --neutral-500: color(srgb 0.23137254901960785 0.2627450980392157 0.2980392156862745);
352
- --neutral-600: color(srgb 0.15294117647058825 0.1843137254901961 0.2196078431372549);
353
- --neutral-700: color(srgb 0.11764705882352941 0.1411764705882353 0.17254901960784313);
354
- --neutral-800: color(srgb 0.07058823529411765 0.09411764705882353 0.12156862745098039);
355
- --neutral-900: color(srgb 0.023529411764705882 0.043137254901960784 0.06274509803921569);
356
- --search-answer-message-color: var(--neutral-600);
357
- --search-back-btn-bg-color: var(--neutral-500);
358
- --search-bg-color: var(--neutral-700);
359
- --search-highlight-color: var(--teal-800);
360
- --search-icon-color: var(--neutral-300);
361
- --search-input-bg-color: var(--neutral-600);
362
- --search-loading-color: var(--teal-200);
363
- --search-source-list-color: var(--neutral-700);
364
- --search-submit-btn-bg-color: var(--teal-200);
365
- --search-user-message-color: var(--teal-800);
366
- --tabbed-content-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.2);
367
- --tabbed-content-bg-color-active: var(--teal-900);
368
- --tabbed-content-border-color: var(--color-icon);
369
- --tabbed-content-code-bg-color: var(--neutral-900);
370
- --tabbed-content-tab-text-color-active: var(--color-icon);
371
- --testimonial-logo-hover-color: var(--neutral-300);
372
- --testimonial-logo-inactive-color: var(--neutral-400);
373
- --title-text-color: color(srgb 0.8352941176470589 1 0.996078431372549 / 0.7490196078431373);
349
+ --ntl-active-switcher-tab-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117);
350
+ --ntl-badge-bg-color: var(--ntl-neutral-700);
351
+ --ntl-badge-border-color: var(--ntl-neutral-600);
352
+ --ntl-badge-text-color: var(--ntl-neutral-100);
353
+ --ntl-blockquote-accent-color: var(--ntl-teal-200);
354
+ --ntl-button-outline-bg-color: color(srgb 0 0 0 / 0);
355
+ --ntl-button-outline-bg-color-hover: var(--ntl-neutral-500);
356
+ --ntl-button-outline-stroke-color: var(--ntl-teal-200);
357
+ --ntl-button-outline-text-color: var(--ntl-teal-200);
358
+ --ntl-button-primary-bg-color: var(--ntl-teal-200);
359
+ --ntl-button-primary-bg-color-hover: var(--ntl-teal-100);
360
+ --ntl-button-primary-text-color: var(--ntl-neutral-800);
361
+ --ntl-button-secondary-bg-color: color(srgb 1 1 1 / 0.09803921568627451);
362
+ --ntl-button-secondary-bg-color-hover: color(srgb 0.6549019607843137 1 0.9921568627450981 / 0.14901960784313725);
363
+ --ntl-button-secondary-text-color: var(--ntl-teal-200);
364
+ --ntl-card-bg-color: var(--ntl-teal-900);
365
+ --ntl-card-border-color: var(--ntl-teal-900);
366
+ --ntl-card-border-color-hover: var(--ntl-teal-800);
367
+ --ntl-code-bg-color: var(--ntl-teal-900);
368
+ --ntl-color-bg: var(--ntl-neutral-800);
369
+ --ntl-color-bg-2: var(--ntl-neutral-700);
370
+ --ntl-color-bg-3: var(--ntl-neutral-600);
371
+ --ntl-color-bg-inverse: var(--ntl-neutral-000);
372
+ --ntl-color-bg-translucent: color(srgb 0.07058823529411765 0.09411764705882353 0.12156862745098039 / 0.9490196078431372);
373
+ --ntl-color-border-default: color(srgb 1 1 1 / 0.09803921568627451);
374
+ --ntl-color-border-strong: var(--ntl-neutral-500);
375
+ --ntl-color-border-subtle: color(srgb 1 1 1 / 0.0392156862745098);
376
+ --ntl-color-brand-primary: var(--ntl-teal-300);
377
+ --ntl-color-brand-primary-hover: var(--ntl-teal-800);
378
+ --ntl-color-brand-secondary: var(--ntl-blue-700);
379
+ --ntl-color-brand-secondary-hover: var(--ntl-blue-800);
380
+ --ntl-color-disabled-bg: var(--ntl-neutral-600);
381
+ --ntl-color-disabled-border: var(--ntl-neutral-400);
382
+ --ntl-color-disabled-text: var(--ntl-neutral-400);
383
+ --ntl-color-highlight-bg: var(--ntl-purple-200);
384
+ --ntl-color-highlight-border: var(--ntl-purple-700);
385
+ --ntl-color-highlight-text: var(--ntl-purple-700);
386
+ --ntl-color-icon: var(--ntl-teal-200);
387
+ --ntl-color-info-bg: var(--ntl-blue-200);
388
+ --ntl-color-info-border: var(--ntl-blue-700);
389
+ --ntl-color-info-text: var(--ntl-blue-700);
390
+ --ntl-color-invalid-bg: var(--ntl-red-200);
391
+ --ntl-color-invalid-border: var(--ntl-red-700);
392
+ --ntl-color-invalid-text: var(--ntl-red-700);
393
+ --ntl-color-link: var(--ntl-teal-200);
394
+ --ntl-color-link-default: var(--ntl-teal-200);
395
+ --ntl-color-link-hover: var(--ntl-teal-100);
396
+ --ntl-color-link-inverse: var(--ntl-blue-600);
397
+ --ntl-color-logo-inactive: color(srgb 0.2823529411764706 0.36470588235294116 0.36470588235294116);
398
+ --ntl-color-logo-spark: var(--ntl-teal-200);
399
+ --ntl-color-logo-type: var(--ntl-neutral-000);
400
+ --ntl-color-stroke: color(srgb 1 1 1 / 0.09803921568627451);
401
+ --ntl-color-success-bg: var(--ntl-green-200);
402
+ --ntl-color-success-border: var(--ntl-green-400);
403
+ --ntl-color-success-text: var(--ntl-green-900);
404
+ --ntl-color-text: var(--ntl-teal-000);
405
+ --ntl-color-text-accent: var(--ntl-teal-600);
406
+ --ntl-color-text-default: var(--ntl-teal-000);
407
+ --ntl-color-text-inverse: var(--ntl-teal-800);
408
+ --ntl-color-text-weak: var(--ntl-neutral-300);
409
+ --ntl-color-text-weaker: var(--ntl-neutral-400);
410
+ --ntl-color-warning-bg: var(--ntl-gold-200);
411
+ --ntl-color-warning-border: var(--ntl-gold-400);
412
+ --ntl-color-warning-text: var(--ntl-gold-900);
413
+ --ntl-eyebrow-text-color: var(--ntl-teal-200);
414
+ --ntl-filter-invert: invert(1);
415
+ --ntl-heading-text-color: var(--ntl-neutral-100);
416
+ --ntl-neutral-000: color(srgb 1 1 1);
417
+ --ntl-neutral-100: color(srgb 0.9019607843137255 0.9254901960784314 0.9490196078431372);
418
+ --ntl-neutral-200: color(srgb 0.6705882352941176 0.7098039215686275 0.7490196078431373);
419
+ --ntl-neutral-300: color(srgb 0.49411764705882355 0.5294117647058824 0.5725490196078431);
420
+ --ntl-neutral-400: color(srgb 0.30196078431372547 0.33725490196078434 0.37254901960784315);
421
+ --ntl-neutral-500: color(srgb 0.23137254901960785 0.2627450980392157 0.2980392156862745);
422
+ --ntl-neutral-600: color(srgb 0.15294117647058825 0.1843137254901961 0.2196078431372549);
423
+ --ntl-neutral-700: color(srgb 0.11764705882352941 0.1411764705882353 0.17254901960784313);
424
+ --ntl-neutral-800: color(srgb 0.07058823529411765 0.09411764705882353 0.12156862745098039);
425
+ --ntl-neutral-900: color(srgb 0.023529411764705882 0.043137254901960784 0.06274509803921569);
426
+ --ntl-search-answer-message-color: var(--ntl-neutral-600);
427
+ --ntl-search-back-btn-bg-color: var(--ntl-neutral-500);
428
+ --ntl-search-bg-color: var(--ntl-neutral-700);
429
+ --ntl-search-highlight-color: var(--ntl-teal-800);
430
+ --ntl-search-icon-color: var(--ntl-neutral-300);
431
+ --ntl-search-input-bg-color: var(--ntl-neutral-600);
432
+ --ntl-search-loading-color: var(--ntl-teal-200);
433
+ --ntl-search-source-list-color: var(--ntl-neutral-700);
434
+ --ntl-search-submit-btn-bg-color: var(--ntl-teal-200);
435
+ --ntl-search-user-message-color: var(--ntl-teal-800);
436
+ --ntl-tabbed-content-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.2);
437
+ --ntl-tabbed-content-bg-color-active: var(--ntl-teal-900);
438
+ --ntl-tabbed-content-border-color: var(--ntl-color-icon);
439
+ --ntl-tabbed-content-code-bg-color: var(--ntl-neutral-900);
440
+ --ntl-tabbed-content-tab-text-color-active: var(--ntl-color-icon);
441
+ --ntl-testimonial-logo-hover-color: var(--ntl-neutral-300);
442
+ --ntl-testimonial-logo-inactive-color: var(--ntl-neutral-400);
443
+ --ntl-title-text-color: color(srgb 0.8352941176470589 1 0.996078431372549 / 0.7490196078431373);
374
444
  }
375
445
 
376
446
  [data-theme="light"] {
377
- --active-switcher-tab-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.047058823529411764);
378
- --badge-bg-color: var(--neutral-100);
379
- --badge-border-color: var(--neutral-300);
380
- --badge-text-color: var(--neutral-500);
381
- --blockquote-accent-color: var(--blue-700);
382
- --button-outline-bg-color: color(srgb 0 0 0 / 0);
383
- --button-outline-bg-color-hover: color(srgb 0.8392156862745098 0.9803921568627451 0.9764705882352941);
384
- --button-outline-stroke-color: var(--neutral-800);
385
- --button-outline-text-color: var(--neutral-800);
386
- --button-primary-bg-color: var(--teal-200);
387
- --button-primary-bg-color-hover: var(--teal-100);
388
- --button-primary-text-color: var(--neutral-800);
389
- --button-secondary-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.09803921568627451);
390
- --button-secondary-bg-color-hover: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.14901960784313725);
391
- --button-secondary-text-color: var(--neutral-800);
392
- --card-bg-color: var(--neutral-000);
393
- --card-border-color: var(--neutral-200);
394
- --card-border-color-hover: var(--neutral-300);
395
- --code-bg-color: var(--teal-900);
396
- --color-bg: var(--neutral-000);
397
- --color-bg-2: var(--neutral-100);
398
- --color-bg-3: var(--neutral-200);
399
- --color-disabled-bg: var(--neutral-200);
400
- --color-disabled-border: var(--neutral-400);
401
- --color-disabled-text: var(--neutral-400);
402
- --color-highlight-bg: var(--purple-100);
403
- --color-highlight-border: var(--purple-600);
404
- --color-highlight-text: var(--purple-600);
405
- --color-icon: var(--blue-700);
406
- --color-info-bg: var(--blue-100);
407
- --color-info-border: var(--blue-600);
408
- --color-info-text: var(--blue-600);
409
- --color-invalid-bg: var(--red-100);
410
- --color-invalid-border: var(--red-600);
411
- --color-invalid-text: var(--red-600);
412
- --color-link: var(--blue-700);
413
- --color-logo-inactive: color(srgb 0.7019607843137254 0.7019607843137254 0.7019607843137254);
414
- --color-logo-spark: var(--teal-400);
415
- --color-logo-type: var(--teal-800);
416
- --color-stroke: color(srgb 0 0 0 / 0.14901960784313725);
417
- --color-success-bg: var(--green-100);
418
- --color-success-border: var(--green-300);
419
- --color-success-text: var(--green-800);
420
- --color-text: var(--neutral-600);
421
- --color-text-accent: var(--teal-000);
422
- --color-text-weak: var(--neutral-500);
423
- --color-text-weaker: var(--neutral-400);
424
- --color-warning-bg: var(--gold-100);
425
- --color-warning-border: var(--gold-300);
426
- --color-warning-text: var(--gold-800);
427
- --eyebrow-text-color: var(--blue-700);
428
- --filter-invert: none;
429
- --heading-text-color: var(--neutral-800);
430
- --neutral-000: color(srgb 1 1 1);
431
- --neutral-100: color(srgb 0.9647058823529412 0.9647058823529412 0.9686274509803922);
432
- --neutral-200: color(srgb 0.9137254901960784 0.9215686274509803 0.9294117647058824);
433
- --neutral-300: color(srgb 0.8196078431372549 0.8352941176470589 0.8549019607843137);
434
- --neutral-400: color(srgb 0.615686274509804 0.6549019607843137 0.6980392156862745);
435
- --neutral-500: color(srgb 0.4666666666666667 0.5019607843137255 0.5372549019607843);
436
- --neutral-600: color(srgb 0.32941176470588235 0.35294117647058826 0.3803921568627451);
437
- --neutral-700: color(srgb 0.20784313725490197 0.22745098039215686 0.24313725490196078);
438
- --neutral-800: color(srgb 0.09411764705882353 0.10196078431372549 0.10980392156862745);
439
- --search-answer-message-color: var(--neutral-200);
440
- --search-back-btn-bg-color: var(--neutral-100);
441
- --search-bg-color: var(--neutral-000);
442
- --search-highlight-color: var(--teal-000);
443
- --search-icon-color: var(--neutral-400);
444
- --search-input-bg-color: var(--neutral-100);
445
- --search-loading-color: var(--teal-700);
446
- --search-source-list-color: var(--neutral-100);
447
- --search-submit-btn-bg-color: var(--teal-200);
448
- --search-user-message-color: var(--teal-000);
449
- --tabbed-content-bg-color: var(--neutral-000);
450
- --tabbed-content-bg-color-active: var(--neutral-000);
451
- --tabbed-content-border-color: var(--color-icon);
452
- --tabbed-content-code-bg-color: var(--neutral-900);
453
- --tabbed-content-tab-text-color-active: var(--color-icon);
454
- --testimonial-logo-hover-color: var(--neutral-500);
455
- --testimonial-logo-inactive-color: var(--neutral-400);
456
- --title-text-color: color(srgb 0.32941176470588235 0.35294117647058826 0.3803921568627451 / 0.7490196078431373);
447
+ --ntl-active-switcher-tab-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.047058823529411764);
448
+ --ntl-badge-bg-color: var(--ntl-neutral-100);
449
+ --ntl-badge-border-color: var(--ntl-neutral-300);
450
+ --ntl-badge-text-color: var(--ntl-neutral-500);
451
+ --ntl-blockquote-accent-color: var(--ntl-blue-700);
452
+ --ntl-button-outline-bg-color: color(srgb 0 0 0 / 0);
453
+ --ntl-button-outline-bg-color-hover: color(srgb 0.8392156862745098 0.9803921568627451 0.9764705882352941);
454
+ --ntl-button-outline-stroke-color: var(--ntl-neutral-800);
455
+ --ntl-button-outline-text-color: var(--ntl-neutral-800);
456
+ --ntl-button-primary-bg-color: var(--ntl-teal-200);
457
+ --ntl-button-primary-bg-color-hover: var(--ntl-teal-100);
458
+ --ntl-button-primary-text-color: var(--ntl-neutral-800);
459
+ --ntl-button-secondary-bg-color: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.09803921568627451);
460
+ --ntl-button-secondary-bg-color-hover: color(srgb 0.047058823529411764 0.16470588235294117 0.16470588235294117 / 0.14901960784313725);
461
+ --ntl-button-secondary-text-color: var(--ntl-neutral-800);
462
+ --ntl-card-bg-color: var(--ntl-neutral-000);
463
+ --ntl-card-border-color: var(--ntl-neutral-200);
464
+ --ntl-card-border-color-hover: var(--ntl-neutral-300);
465
+ --ntl-code-bg-color: var(--ntl-teal-900);
466
+ --ntl-color-bg: var(--ntl-neutral-000);
467
+ --ntl-color-bg-2: var(--ntl-neutral-100);
468
+ --ntl-color-bg-3: var(--ntl-neutral-200);
469
+ --ntl-color-bg-inverse: var(--ntl-neutral-300);
470
+ --ntl-color-bg-translucent: color(srgb 1 1 1 / 0.9019607843137255);
471
+ --ntl-color-border-default: color(srgb 0 0 0 / 0.14901960784313725);
472
+ --ntl-color-border-strong: var(--ntl-neutral-300);
473
+ --ntl-color-border-subtle: color(srgb 0 0 0 / 0.06274509803921569);
474
+ --ntl-color-brand-primary: var(--ntl-blue-700);
475
+ --ntl-color-brand-primary-hover: var(--ntl-blue-800);
476
+ --ntl-color-brand-secondary: var(--ntl-teal-300);
477
+ --ntl-color-brand-secondary-hover: var(--ntl-teal-800);
478
+ --ntl-color-disabled-bg: var(--ntl-neutral-200);
479
+ --ntl-color-disabled-border: var(--ntl-neutral-400);
480
+ --ntl-color-disabled-text: var(--ntl-neutral-400);
481
+ --ntl-color-highlight-bg: var(--ntl-purple-100);
482
+ --ntl-color-highlight-border: var(--ntl-purple-600);
483
+ --ntl-color-highlight-text: var(--ntl-purple-600);
484
+ --ntl-color-icon: var(--ntl-blue-700);
485
+ --ntl-color-info-bg: var(--ntl-blue-100);
486
+ --ntl-color-info-border: var(--ntl-blue-600);
487
+ --ntl-color-info-text: var(--ntl-blue-600);
488
+ --ntl-color-invalid-bg: var(--ntl-red-100);
489
+ --ntl-color-invalid-border: var(--ntl-red-600);
490
+ --ntl-color-invalid-text: var(--ntl-red-600);
491
+ --ntl-color-link: var(--ntl-blue-700);
492
+ --ntl-color-link-default: var(--ntl-blue-700);
493
+ --ntl-color-link-hover: var(--ntl-blue-800);
494
+ --ntl-color-link-inverse: var(--ntl-blue-400);
495
+ --ntl-color-logo-inactive: color(srgb 0.7019607843137254 0.7019607843137254 0.7019607843137254);
496
+ --ntl-color-logo-spark: var(--ntl-teal-400);
497
+ --ntl-color-logo-type: var(--ntl-teal-800);
498
+ --ntl-color-stroke: color(srgb 0 0 0 / 0.14901960784313725);
499
+ --ntl-color-success-bg: var(--ntl-green-100);
500
+ --ntl-color-success-border: var(--ntl-green-300);
501
+ --ntl-color-success-text: var(--ntl-green-800);
502
+ --ntl-color-text: var(--ntl-neutral-700);
503
+ --ntl-color-text-accent: var(--ntl-teal-300);
504
+ --ntl-color-text-default: var(--ntl-neutral-700);
505
+ --ntl-color-text-inverse: var(--ntl-neutral-100);
506
+ --ntl-color-text-weak: var(--ntl-neutral-500);
507
+ --ntl-color-text-weaker: var(--ntl-neutral-400);
508
+ --ntl-color-warning-bg: var(--ntl-gold-100);
509
+ --ntl-color-warning-border: var(--ntl-gold-300);
510
+ --ntl-color-warning-text: var(--ntl-gold-800);
511
+ --ntl-eyebrow-text-color: var(--ntl-blue-700);
512
+ --ntl-filter-invert: none;
513
+ --ntl-heading-text-color: var(--ntl-neutral-800);
514
+ --ntl-neutral-000: color(srgb 1 1 1);
515
+ --ntl-neutral-100: color(srgb 0.9647058823529412 0.9647058823529412 0.9686274509803922);
516
+ --ntl-neutral-200: color(srgb 0.9137254901960784 0.9215686274509803 0.9294117647058824);
517
+ --ntl-neutral-300: color(srgb 0.8196078431372549 0.8352941176470589 0.8549019607843137);
518
+ --ntl-neutral-400: color(srgb 0.615686274509804 0.6549019607843137 0.6980392156862745);
519
+ --ntl-neutral-500: color(srgb 0.4666666666666667 0.5019607843137255 0.5372549019607843);
520
+ --ntl-neutral-600: color(srgb 0.32941176470588235 0.35294117647058826 0.3803921568627451);
521
+ --ntl-neutral-700: color(srgb 0.20784313725490197 0.22745098039215686 0.24313725490196078);
522
+ --ntl-neutral-800: color(srgb 0.09411764705882353 0.10196078431372549 0.10980392156862745);
523
+ --ntl-search-answer-message-color: var(--ntl-neutral-200);
524
+ --ntl-search-back-btn-bg-color: var(--ntl-neutral-100);
525
+ --ntl-search-bg-color: var(--ntl-neutral-000);
526
+ --ntl-search-highlight-color: var(--ntl-teal-000);
527
+ --ntl-search-icon-color: var(--ntl-neutral-400);
528
+ --ntl-search-input-bg-color: var(--ntl-neutral-100);
529
+ --ntl-search-loading-color: var(--ntl-teal-700);
530
+ --ntl-search-source-list-color: var(--ntl-neutral-100);
531
+ --ntl-search-submit-btn-bg-color: var(--ntl-teal-200);
532
+ --ntl-search-user-message-color: var(--ntl-teal-000);
533
+ --ntl-tabbed-content-bg-color: var(--ntl-neutral-000);
534
+ --ntl-tabbed-content-bg-color-active: var(--ntl-neutral-000);
535
+ --ntl-tabbed-content-border-color: var(--ntl-color-icon);
536
+ --ntl-tabbed-content-code-bg-color: var(--ntl-neutral-900);
537
+ --ntl-tabbed-content-tab-text-color-active: var(--ntl-color-icon);
538
+ --ntl-testimonial-logo-hover-color: var(--ntl-neutral-500);
539
+ --ntl-testimonial-logo-inactive-color: var(--ntl-neutral-400);
540
+ --ntl-title-text-color: color(srgb 0.32941176470588235 0.35294117647058826 0.3803921568627451 / 0.7490196078431373);
457
541
  }
458
542