1/*
21. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
32. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
4*/
5
6.tailwind *,
7.tailwind ::before,
8.tailwind ::after {
9  box-sizing: border-box; /* 1 */
10  border-width: 0; /* 2 */
11  border-style: solid; /* 2 */
12  border-color: theme('borderColor.DEFAULT', currentColor); /* 2 */
13}
14
15.tailwind ::before,
16.tailwind ::after {
17  --tw-content: '';
18}
19
20/*
211. Use a consistent sensible line-height in all browsers.
222. Prevent adjustments of font size after orientation changes in iOS.
233. Use a more readable tab size.
244. Use the user's configured `sans` font-family by default.
255. Use the user's configured `sans` font-feature-settings by default.
266. Use the user's configured `sans` font-variation-settings by default.
277. Disable tap highlights on iOS
28*/
29
30.tailwind :host {
31  line-height: 1.5; /* 1 */
32  -webkit-text-size-adjust: 100%; /* 2 */
33  -moz-tab-size: 4; /* 3 */
34  tab-size: 4; /* 3 */
35  font-family: theme('fontFamily.sans', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); /* 4 */
36  font-feature-settings: theme('fontFamily.sans[1].fontFeatureSettings', normal); /* 5 */
37  font-variation-settings: theme('fontFamily.sans[1].fontVariationSettings', normal); /* 6 */
38  -webkit-tap-highlight-color: transparent; /* 7 */
39}
40
41/*
421. Add the correct height in Firefox.
432. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
443. Ensure horizontal rules are visible by default.
45*/
46
47.tailwind hr {
48  height: 0; /* 1 */
49  color: inherit; /* 2 */
50  border-top-width: 1px; /* 3 */
51}
52
53/*
54Add the correct text decoration in Chrome, Edge, and Safari.
55*/
56
57.tailwind abbr:where([title]) {
58  text-decoration: underline dotted;
59}
60
61/*
62Remove the default font size and weight for headings.
63*/
64
65.tailwind h1,
66.tailwind h2,
67.tailwind h3,
68.tailwind h4,
69.tailwind h5,
70.tailwind h6 {
71  font-size: inherit;
72  font-weight: inherit;
73}
74
75/*
76Reset links to optimize for opt-in styling instead of opt-out.
77*/
78
79.tailwind a {
80  color: inherit;
81  text-decoration: inherit;
82}
83
84/*
85Add the correct font weight in Edge and Safari.
86*/
87
88.tailwind b,
89.tailwind strong {
90  font-weight: bolder;
91}
92
93/*
941. Use the user's configured `mono` font-family by default.
952. Use the user's configured `mono` font-feature-settings by default.
963. Use the user's configured `mono` font-variation-settings by default.
974. Correct the odd `em` font sizing in all browsers.
98*/
99
100.tailwind code,
101.tailwind kbd,
102.tailwind samp,
103.tailwind pre {
104  font-family: theme('fontFamily.mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
105  font-feature-settings: theme('fontFamily.mono[1].fontFeatureSettings', normal); /* 2 */
106  font-variation-settings: theme('fontFamily.mono[1].fontVariationSettings', normal); /* 3 */
107  font-size: 1em; /* 4 */
108}
109
110/*
111Add the correct font size in all browsers.
112*/
113
114.tailwind small {
115  font-size: 80%;
116}
117
118/*
119Prevent `sub` and `sup` elements from affecting the line height in all browsers.
120*/
121
122.tailwind sub,
123.tailwind sup {
124  font-size: 75%;
125  line-height: 0;
126  position: relative;
127  vertical-align: baseline;
128}
129
130.tailwind sub {
131  bottom: -0.25em;
132}
133
134.tailwind sup {
135  top: -0.5em;
136}
137
138/*
1391. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
1402. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
1413. Remove gaps between table borders by default.
142*/
143
144.tailwind table {
145  text-indent: 0; /* 1 */
146  border-color: inherit; /* 2 */
147  border-collapse: collapse; /* 3 */
148}
149
150/*
1511. Change the font styles in all browsers.
1522. Remove the margin in Firefox and Safari.
1533. Remove default padding in all browsers.
154*/
155
156.tailwind button,
157.tailwind input,
158.tailwind optgroup,
159.tailwind select,
160.tailwind textarea {
161  font-family: inherit; /* 1 */
162  font-feature-settings: inherit; /* 1 */
163  font-variation-settings: inherit; /* 1 */
164  font-size: 100%; /* 1 */
165  font-weight: inherit; /* 1 */
166  line-height: inherit; /* 1 */
167  letter-spacing: inherit; /* 1 */
168  color: inherit; /* 1 */
169  margin: 0; /* 2 */
170  padding: 0; /* 3 */
171}
172
173/*
174Remove the inheritance of text transform in Edge and Firefox.
175*/
176
177.tailwind button,
178.tailwind select {
179  text-transform: none;
180}
181
182/*
1831. Correct the inability to style clickable types in iOS and Safari.
1842. Remove default button styles.
185*/
186
187.tailwind button,
188.tailwind input:where([type='button']),
189.tailwind input:where([type='reset']),
190.tailwind input:where([type='submit']) {
191  -webkit-appearance: button; /* 1 */
192  background-color: transparent; /* 2 */
193  background-image: none; /* 2 */
194}
195
196/*
197Use the modern Firefox focus style for all focusable elements.
198*/
199
200.tailwind :-moz-focusring {
201  outline: auto;
202}
203
204/*
205Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
206*/
207
208.tailwind :-moz-ui-invalid {
209  box-shadow: none;
210}
211
212/*
213Add the correct vertical alignment in Chrome and Firefox.
214*/
215
216.tailwind progress {
217  vertical-align: baseline;
218}
219
220/*
221Correct the cursor style of increment and decrement buttons in Safari.
222*/
223
224.tailwind ::-webkit-inner-spin-button,
225.tailwind ::-webkit-outer-spin-button {
226  height: auto;
227}
228
229/*
2301. Correct the odd appearance in Chrome and Safari.
2312. Correct the outline style in Safari.
232*/
233
234.tailwind [type='search'] {
235  -webkit-appearance: textfield; /* 1 */
236  outline-offset: -2px; /* 2 */
237}
238
239/*
240Remove the inner padding in Chrome and Safari on macOS.
241*/
242
243.tailwind ::-webkit-search-decoration {
244  -webkit-appearance: none;
245}
246
247/*
2481. Correct the inability to style clickable types in iOS and Safari.
2492. Change font properties to `inherit` in Safari.
250*/
251
252.tailwind ::-webkit-file-upload-button {
253  -webkit-appearance: button; /* 1 */
254  font: inherit; /* 2 */
255}
256
257/*
258Add the correct display in Chrome and Safari.
259*/
260
261.tailwind summary {
262  display: list-item;
263}
264
265/*
266Removes the default spacing and border for appropriate elements.
267*/
268
269.tailwind blockquote,
270.tailwind dl,
271.tailwind dd,
272.tailwind h1,
273.tailwind h2,
274.tailwind h3,
275.tailwind h4,
276.tailwind h5,
277.tailwind h6,
278.tailwind hr,
279.tailwind figure,
280.tailwind p,
281.tailwind pre {
282  margin: 0;
283}
284
285.tailwind fieldset {
286  margin: 0;
287  padding: 0;
288}
289
290.tailwind legend {
291  padding: 0;
292}
293
294.tailwind ol,
295.tailwind ul,
296.tailwind menu {
297  list-style: none;
298  margin: 0;
299  padding: 0;
300}
301
302/*
303Reset default styling for dialogs.
304*/
305.tailwind dialog {
306  padding: 0;
307}
308
309/*
310Prevent resizing textareas horizontally by default.
311*/
312
313.tailwind textarea {
314  resize: vertical;
315}
316
317/*
3181. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
3192. Set the default placeholder color to the user's configured gray 400 color.
320*/
321
322.tailwind input::placeholder,
323.tailwind textarea::placeholder {
324  opacity: 1; /* 1 */
325  color: theme('colors.gray.400', #9ca3af); /* 2 */
326}
327
328/*
329Set the default cursor for buttons.
330*/
331
332.tailwind button,
333.tailwind [role="button"] {
334  cursor: pointer;
335}
336
337/*
338Make sure disabled buttons don't get the pointer cursor.
339*/
340.tailwind :disabled {
341  cursor: default;
342}
343
344/*
3451. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
3462. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
347   This can trigger a poorly considered lint error in some tools but is included by design.
348*/
349
350.tailwind img,
351.tailwind svg,
352.tailwind video,
353.tailwind canvas,
354.tailwind audio,
355.tailwind iframe,
356.tailwind embed,
357.tailwind object {
358  display: block; /* 1 */
359  vertical-align: middle; /* 2 */
360}
361
362/*
363Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
364*/
365
366.tailwind img,
367.tailwind video {
368  max-width: 100%;
369  height: auto;
370}
371
372/* Make elements with the HTML hidden attribute stay hidden by default */
373.tailwind [hidden]:where(:not([hidden="until-found"])) {
374  display: none;
375}
376

1/*
21. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
32. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
4*/
5
6.tailwind *,
7.tailwind ::before,
8.tailwind ::after {
9  box-sizing: border-box; /* 1 */
10  border-width: 0; /* 2 */
11  border-style: solid; /* 2 */
12  border-color: theme('borderColor.DEFAULT', currentColor); /* 2 */
13}
14
15.tailwind ::before,
16.tailwind ::after {
17  --tw-content: '';
18}
19
20/*
211. Use a consistent sensible line-height in all browsers.
222. Prevent adjustments of font size after orientation changes in iOS.
233. Use a more readable tab size.
244. Use the user's configured `sans` font-family by default.
255. Use the user's configured `sans` font-feature-settings by default.
266. Use the user's configured `sans` font-variation-settings by default.
277. Disable tap highlights on iOS
28*/
29
30.tailwind :host {
31  line-height: 1.5; /* 1 */
32  -webkit-text-size-adjust: 100%; /* 2 */
33  -moz-tab-size: 4; /* 3 */
34  tab-size: 4; /* 3 */
35  font-family: theme('fontFamily.sans', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); /* 4 */
36  font-feature-settings: theme('fontFamily.sans[1].fontFeatureSettings', normal); /* 5 */
37  font-variation-settings: theme('fontFamily.sans[1].fontVariationSettings', normal); /* 6 */
38  -webkit-tap-highlight-color: transparent; /* 7 */
39}
40
41/*
421. Add the correct height in Firefox.
432. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
443. Ensure horizontal rules are visible by default.
45*/
46
47.tailwind hr {
48  height: 0; /* 1 */
49  color: inherit; /* 2 */
50  border-top-width: 1px; /* 3 */
51}
52
53/*
54Add the correct text decoration in Chrome, Edge, and Safari.
55*/
56
57.tailwind abbr:where([title]) {
58  text-decoration: underline dotted;
59}
60
61/*
62Remove the default font size and weight for headings.
63*/
64
65.tailwind h1,
66.tailwind h2,
67.tailwind h3,
68.tailwind h4,
69.tailwind h5,
70.tailwind h6 {
71  font-size: inherit;
72  font-weight: inherit;
73}
74
75/*
76Reset links to optimize for opt-in styling instead of opt-out.
77*/
78
79.tailwind a {
80  color: inherit;
81  text-decoration: inherit;
82}
83
84/*
85Add the correct font weight in Edge and Safari.
86*/
87
88.tailwind b,
89.tailwind strong {
90  font-weight: bolder;
91}
92
93/*
941. Use the user's configured `mono` font-family by default.
952. Use the user's configured `mono` font-feature-settings by default.
963. Use the user's configured `mono` font-variation-settings by default.
974. Correct the odd `em` font sizing in all browsers.
98*/
99
100.tailwind code,
101.tailwind kbd,
102.tailwind samp,
103.tailwind pre {
104  font-family: theme('fontFamily.mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); /* 1 */
105  font-feature-settings: theme('fontFamily.mono[1].fontFeatureSettings', normal); /* 2 */
106  font-variation-settings: theme('fontFamily.mono[1].fontVariationSettings', normal); /* 3 */
107  font-size: 1em; /* 4 */
108}
109
110/*
111Add the correct font size in all browsers.
112*/
113
114.tailwind small {
115  font-size: 80%;
116}
117
118/*
119Prevent `sub` and `sup` elements from affecting the line height in all browsers.
120*/
121
122.tailwind sub,
123.tailwind sup {
124  font-size: 75%;
125  line-height: 0;
126  position: relative;
127  vertical-align: baseline;
128}
129
130.tailwind sub {
131  bottom: -0.25em;
132}
133
134.tailwind sup {
135  top: -0.5em;
136}
137
138/*
1391. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
1402. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
1413. Remove gaps between table borders by default.
142*/
143
144.tailwind table {
145  text-indent: 0; /* 1 */
146  border-color: inherit; /* 2 */
147  border-collapse: collapse; /* 3 */
148}
149
150/*
1511. Change the font styles in all browsers.
1522. Remove the margin in Firefox and Safari.
1533. Remove default padding in all browsers.
154*/
155
156.tailwind button,
157.tailwind input,
158.tailwind optgroup,
159.tailwind select,
160.tailwind textarea {
161  font-family: inherit; /* 1 */
162  font-feature-settings: inherit; /* 1 */
163  font-variation-settings: inherit; /* 1 */
164  font-size: 100%; /* 1 */
165  font-weight: inherit; /* 1 */
166  line-height: inherit; /* 1 */
167  letter-spacing: inherit; /* 1 */
168  color: inherit; /* 1 */
169  margin: 0; /* 2 */
170  padding: 0; /* 3 */
171}
172
173/*
174Remove the inheritance of text transform in Edge and Firefox.
175*/
176
177.tailwind button,
178.tailwind select {
179  text-transform: none;
180}
181
182/*
1831. Correct the inability to style clickable types in iOS and Safari.
1842. Remove default button styles.
185*/
186
187.tailwind button,
188.tailwind input:where([type='button']),
189.tailwind input:where([type='reset']),
190.tailwind input:where([type='submit']) {
191  -webkit-appearance: button; /* 1 */
192  background-color: transparent; /* 2 */
193  background-image: none; /* 2 */
194}
195
196/*
197Use the modern Firefox focus style for all focusable elements.
198*/
199
200.tailwind :-moz-focusring {
201  outline: auto;
202}
203
204/*
205Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
206*/
207
208.tailwind :-moz-ui-invalid {
209  box-shadow: none;
210}
211
212/*
213Add the correct vertical alignment in Chrome and Firefox.
214*/
215
216.tailwind progress {
217  vertical-align: baseline;
218}
219
220/*
221Correct the cursor style of increment and decrement buttons in Safari.
222*/
223
224.tailwind ::-webkit-inner-spin-button,
225.tailwind ::-webkit-outer-spin-button {
226  height: auto;
227}
228
229/*
2301. Correct the odd appearance in Chrome and Safari.
2312. Correct the outline style in Safari.
232*/
233
234.tailwind [type='search'] {
235  -webkit-appearance: textfield; /* 1 */
236  outline-offset: -2px; /* 2 */
237}
238
239/*
240Remove the inner padding in Chrome and Safari on macOS.
241*/
242
243.tailwind ::-webkit-search-decoration {
244  -webkit-appearance: none;
245}
246
247/*
2481. Correct the inability to style clickable types in iOS and Safari.
2492. Change font properties to `inherit` in Safari.
250*/
251
252.tailwind ::-webkit-file-upload-button {
253  -webkit-appearance: button; /* 1 */
254  font: inherit; /* 2 */
255}
256
257/*
258Add the correct display in Chrome and Safari.
259*/
260
261.tailwind summary {
262  display: list-item;
263}
264
265/*
266Removes the default spacing and border for appropriate elements.
267*/
268
269.tailwind blockquote,
270.tailwind dl,
271.tailwind dd,
272.tailwind h1,
273.tailwind h2,
274.tailwind h3,
275.tailwind h4,
276.tailwind h5,
277.tailwind h6,
278.tailwind hr,
279.tailwind figure,
280.tailwind p,
281.tailwind pre {
282  margin: 0;
283}
284
285.tailwind fieldset {
286  margin: 0;
287  padding: 0;
288}
289
290.tailwind legend {
291  padding: 0;
292}
293
294.tailwind ol,
295.tailwind ul,
296.tailwind menu {
297  list-style: none;
298  margin: 0;
299  padding: 0;
300}
301
302/*
303Reset default styling for dialogs.
304*/
305.tailwind dialog {
306  padding: 0;
307}
308
309/*
310Prevent resizing textareas horizontally by default.
311*/
312
313.tailwind textarea {
314  resize: vertical;
315}
316
317/*
3181. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
3192. Set the default placeholder color to the user's configured gray 400 color.
320*/
321
322.tailwind input::placeholder,
323.tailwind textarea::placeholder {
324  opacity: 1; /* 1 */
325  color: theme('colors.gray.400', #9ca3af); /* 2 */
326}
327
328/*
329Set the default cursor for buttons.
330*/
331
332.tailwind button,
333.tailwind [role="button"] {
334  cursor: pointer;
335}
336
337/*
338Make sure disabled buttons don't get the pointer cursor.
339*/
340.tailwind :disabled {
341  cursor: default;
342}
343
344/*
3451. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
3462. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
347   This can trigger a poorly considered lint error in some tools but is included by design.
348*/
349
350.tailwind img,
351.tailwind svg,
352.tailwind video,
353.tailwind canvas,
354.tailwind audio,
355.tailwind iframe,
356.tailwind embed,
357.tailwind object {
358  display: block; /* 1 */
359  vertical-align: middle; /* 2 */
360}
361
362/*
363Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
364*/
365
366.tailwind img,
367.tailwind video {
368  max-width: 100%;
369  height: auto;
370}
371
372/* Make elements with the HTML hidden attribute stay hidden by default */
373.tailwind [hidden]:where(:not([hidden="until-found"])) {
374  display: none;
375}
376