semantic-forms 5.2.2 → 5.3.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 (18) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/semantic-forms.cjs +93 -69
  3. package/dist/semantic-forms.cjs.map +1 -1
  4. package/dist/semantic-forms.css +874 -2781
  5. package/dist/semantic-forms.css.map +1 -1
  6. package/dist/semantic-forms.js +66 -51
  7. package/dist/semantic-forms.js.map +1 -1
  8. package/dist/semantic-forms.min.js +1 -1
  9. package/dist/semantic-forms.min.js.map +1 -1
  10. package/dist/semantic-forms.min.mjs +1 -1
  11. package/dist/semantic-forms.min.mjs.map +1 -1
  12. package/dist/semantic-forms.mjs +93 -69
  13. package/dist/semantic-forms.mjs.map +1 -1
  14. package/docs/statics/pages/fullDemo.html +1283 -866
  15. package/docs/statics/pages/usage.html +388 -190
  16. package/package.json +3 -3
  17. package/semanticForms.js +14 -568
  18. package/semanticForms.scss +167 -1570
package/dist/semantic-forms.css CHANGED
@@ -1,10 +1,13 @@
1
- form.semanticForms, form.semanticForms.light, table.semanticForms {
1
+ form.semanticForms,
2
+ form.semanticForms.light,
3
+ table.semanticForms {
2
4
  --semanticFormsFontFamily: sans-serif;
3
5
  --semanticFormsFontSize: 16px;
4
6
  --semanticFormsFormBgColor: #fff;
5
7
  --semanticFormsFormSubBgColor: #f5f5f5;
6
8
  --semanticFormsTextColor: #000;
7
9
  --semanticFormsBorderColor: #c0c0c0;
10
+ --semanticFormsFocusColor: #c0c0c0;
8
11
  --semanticFormsSubBorderColor: #c0c0c0;
9
12
  --semanticFormsPlaceholderColor: rgba(0, 0, 0, 0.75);
10
13
  --semanticFormsScrollbarColor: #c0c0c0;
@@ -19,6 +22,7 @@ form.semanticForms, form.semanticForms.light, table.semanticForms {
19
22
  --semanticFormsInputFontSize: 16px;
20
23
  --semanticFormsInputTopMargin: 15px;
21
24
  --semanticFormsInputMinWidth: 250px;
25
+ --semanticFormsInputMaxWidth: 365px;
22
26
  --semanticFormsBorderRadius: 10px;
23
27
  --semanticFormsNestedFieldsetBgColor: oklch(from var(--semanticFormsFormSubBgColor) 0.3 c h / 0.05);
24
28
  --semanticFormsNestedFieldsetBorder: 1px rgba(0, 0, 0, .2) solid;
@@ -32,6 +36,95 @@ form.semanticForms, form.semanticForms.light, table.semanticForms {
32
36
  --semanticFormsSelectIcon: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23000'%3E%3Cpolygon points='0,0 100,0 50,50'/%3E%3C/svg%3E");
33
37
  --semanticFormsCustomResizer: url("data:image/svg+xml;utf8,%3Csvg width='20' height='20' viewBox='0 0 5.2916665 5.2916666' version='1.1' id='svg5' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'%3E%3Cdefs id='defs2' /%3E%3Cg id='layer1'%3E%3Cpath style='fill:%23aaa;stroke:%23aaa;stroke-width:0.264583;stroke-dasharray:none;stroke-opacity:1' d='M 2.8245112,5.0994569 C 4.9396993,2.9842685 4.9396993,2.9842685 4.9396993,2.9842685' id='path1034' /%3E%3Cpath style='fill:%23aaa;stroke:%23aaa;stroke-width:0.264583;stroke-dasharray:none;stroke-opacity:1' d='M 1.515747,5.0406977 C 4.8873304,1.6691138 4.8873304,1.6691138 4.8873304,1.6691138' id='path1034-1' /%3E%3Cpath style='fill:%23aaa;stroke:%23aaa;stroke-width:0.264583;stroke-linecap:butt;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1' d='M 0.20657789,5.0909782 C 4.9312207,0.3663348 4.9312207,0.3663348 4.9312207,0.3663348' id='path1034-9' /%3E%3C/g%3E%3C/svg%3E");
34
38
  --semanticFormsSearchIcon: url("data:image/svg+xml,%3Csvg%20width%3D%2214px%22%20height%3D%2214px%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M15.7955%2015.8111L21%2021M18%2010.5C18%2014.6421%2014.6421%2018%2010.5%2018C6.35786%2018%203%2014.6421%203%2010.5C3%206.35786%206.35786%203%2010.5%203C14.6421%203%2018%206.35786%2018%2010.5Z%22%20stroke%3D%22%23000000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
39
+ font-family: var(--semanticFormsFontFamily);
40
+ font-size: var(--semanticFormsFontSize);
41
+ width: 100%;
42
+ overflow-x: hidden;
43
+ }
44
+ form.semanticForms:not(table),
45
+ form.semanticForms.light:not(table),
46
+ table.semanticForms:not(table) {
47
+ display: flex;
48
+ flex-direction: column;
49
+ gap: 10px;
50
+ }
51
+ @supports (interpolate-size: allow-keywords) {
52
+ form.semanticForms,
53
+ form.semanticForms.light,
54
+ table.semanticForms {
55
+ interpolate-size: allow-keywords;
56
+ }
57
+ }
58
+ form.semanticForms [hidden],
59
+ form.semanticForms.light [hidden],
60
+ table.semanticForms [hidden] {
61
+ display: none !important;
62
+ }
63
+ form.semanticForms div:has(dd[hidden]),
64
+ form.semanticForms.light div:has(dd[hidden]),
65
+ table.semanticForms div:has(dd[hidden]) {
66
+ display: none !important;
67
+ }
68
+ form.semanticForms fieldset,
69
+ form.semanticForms label,
70
+ form.semanticForms input,
71
+ form.semanticForms select,
72
+ form.semanticForms textarea,
73
+ form.semanticForms button,
74
+ form.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea),
75
+ form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea),
76
+ form.semanticForms dt:has(> input, > select, > textarea),
77
+ form.semanticForms dd:has(> input, > select, > textarea, > ul, > menu),
78
+ form.semanticForms div:has(dt, dd),
79
+ form.semanticForms dd > p,
80
+ form.semanticForms.light fieldset,
81
+ form.semanticForms.light label,
82
+ form.semanticForms.light input,
83
+ form.semanticForms.light select,
84
+ form.semanticForms.light textarea,
85
+ form.semanticForms.light button,
86
+ form.semanticForms.light menu:has(li > input, li > label, li > button, li > select, li > textarea),
87
+ form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea),
88
+ form.semanticForms.light dt:has(> input, > select, > textarea),
89
+ form.semanticForms.light dd:has(> input, > select, > textarea, > ul, > menu),
90
+ form.semanticForms.light div:has(dt, dd),
91
+ form.semanticForms.light dd > p,
92
+ table.semanticForms fieldset,
93
+ table.semanticForms label,
94
+ table.semanticForms input,
95
+ table.semanticForms select,
96
+ table.semanticForms textarea,
97
+ table.semanticForms button,
98
+ table.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea),
99
+ table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea),
100
+ table.semanticForms dt:has(> input, > select, > textarea),
101
+ table.semanticForms dd:has(> input, > select, > textarea, > ul, > menu),
102
+ table.semanticForms div:has(dt, dd),
103
+ table.semanticForms dd > p {
104
+ color: var(--semanticFormsTextColor);
105
+ font-family: var(--semanticFormsFontFamily);
106
+ box-sizing: border-box;
107
+ }
108
+ form.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea),
109
+ form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea),
110
+ form.semanticForms dt:has(> input, > select, > textarea),
111
+ form.semanticForms dd:has(> input, > select, > textarea, > ul, > menu),
112
+ form.semanticForms div:has(dt, dd),
113
+ form.semanticForms dd > p,
114
+ form.semanticForms.light menu:has(li > input, li > label, li > button, li > select, li > textarea),
115
+ form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea),
116
+ form.semanticForms.light dt:has(> input, > select, > textarea),
117
+ form.semanticForms.light dd:has(> input, > select, > textarea, > ul, > menu),
118
+ form.semanticForms.light div:has(dt, dd),
119
+ form.semanticForms.light dd > p,
120
+ table.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea),
121
+ table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea),
122
+ table.semanticForms dt:has(> input, > select, > textarea),
123
+ table.semanticForms dd:has(> input, > select, > textarea, > ul, > menu),
124
+ table.semanticForms div:has(dt, dd),
125
+ table.semanticForms dd > p {
126
+ margin: 0;
127
+ padding: 0;
35
128
  }
36
129
 
37
130
  @media (prefers-color-scheme: dark) {
@@ -41,6 +134,7 @@ form.semanticForms, form.semanticForms.light, table.semanticForms {
41
134
  --semanticFormsFormSubBgColor: #2f2f2f;
42
135
  --semanticFormsTextColor: #fff;
43
136
  --semanticFormsBorderColor: #656565;
137
+ --semanticFormsFocusColor: #656565;
44
138
  --semanticFormsSubBorderColor: #3f3f3f;
45
139
  --semanticFormsPlaceholderColor: rgba(255, 255, 255, 0.85);
46
140
  --semanticFormsScrollbarColor: #373737;
@@ -70,6 +164,7 @@ html:not(.light) body:not(.light) form.semanticForms.dark, html:not(.light) body
70
164
  --semanticFormsFormSubBgColor: #2f2f2f;
71
165
  --semanticFormsTextColor: #fff;
72
166
  --semanticFormsBorderColor: #656565;
167
+ --semanticFormsFocusColor: #656565;
73
168
  --semanticFormsSubBorderColor: #3f3f3f;
74
169
  --semanticFormsPlaceholderColor: rgba(255, 255, 255, 0.85);
75
170
  --semanticFormsScrollbarColor: #373737;
@@ -93,12 +188,14 @@ html:not(.light) body:not(.light) form.semanticForms.dark input::-webkit-calenda
93
188
  filter: invert(100%);
94
189
  }
95
190
 
96
- form.semanticForms.dark, table.semanticForms.dark {
191
+ form.semanticForms.dark,
192
+ table.semanticForms.dark {
97
193
  --semanticFormsFormBgColor: #555;
98
194
  --inputBackgroudColor: rgba(85,85,85,0.1);
99
195
  --semanticFormsFormSubBgColor: #2f2f2f;
100
196
  --semanticFormsTextColor: #fff;
101
197
  --semanticFormsBorderColor: #656565;
198
+ --semanticFormsFocusColor: #656565;
102
199
  --semanticFormsSubBorderColor: #3f3f3f;
103
200
  --semanticFormsPlaceholderColor: rgba(255, 255, 255, 0.85);
104
201
  --semanticFormsScrollbarColor: #373737;
@@ -118,122 +215,29 @@ form.semanticForms.dark, table.semanticForms.dark {
118
215
  --semanticFormsCustomResizer: url("data:image/svg+xml;utf8,%3Csvg width='20' height='20' viewBox='0 0 5.2916665 5.2916666' version='1.1' id='svg5' xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg'%3E%3Cdefs id='defs2' /%3E%3Cg id='layer1'%3E%3Cpath style='fill:%23c9c9c9;stroke:%23c9c9c9;stroke-width:0.264583;stroke-dasharray:none;stroke-opacity:1' d='M 2.8245112,5.0994569 C 4.9396993,2.9842685 4.9396993,2.9842685 4.9396993,2.9842685' id='path1034' /%3E%3Cpath style='fill:%23c9c9c9;stroke:%23c9c9c9;stroke-width:0.264583;stroke-dasharray:none;stroke-opacity:1' d='M 1.515747,5.0406977 C 4.8873304,1.6691138 4.8873304,1.6691138 4.8873304,1.6691138' id='path1034-1' /%3E%3Cpath style='fill:%23c9c9c9;stroke:%23c9c9c9;stroke-width:0.264583;stroke-linecap:butt;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1' d='M 0.20657789,5.0909782 C 4.9312207,0.3663348 4.9312207,0.3663348 4.9312207,0.3663348' id='path1034-9' /%3E%3C/g%3E%3C/svg%3E");
119
216
  --semanticFormsSearchIcon: url("data:image/svg+xml,%3Csvg%20width%3D%2214px%22%20height%3D%2214px%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M15.7955%2015.8111L21%2021M18%2010.5C18%2014.6421%2014.6421%2018%2010.5%2018C6.35786%2018%203%2014.6421%203%2010.5C3%206.35786%206.35786%203%2010.5%203C14.6421%203%2018%206.35786%2018%2010.5Z%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
120
217
  }
121
- form.semanticForms.dark input::-webkit-calendar-picker-indicator, table.semanticForms.dark input::-webkit-calendar-picker-indicator {
218
+ form.semanticForms.dark input::-webkit-calendar-picker-indicator,
219
+ table.semanticForms.dark input::-webkit-calendar-picker-indicator {
122
220
  filter: invert(100%);
123
221
  }
124
222
 
125
- form.semanticForms,
126
- form.semanticForms.light,
127
- table.semanticForms,
128
- table.semanticForms.light {
129
- font-family: var(--semanticFormsFontFamily);
130
- font-size: var(--semanticFormsFontSize);
131
- width: 100%;
132
- }
133
- @supports (interpolate-size: allow-keywords) {
134
- form.semanticForms,
135
- form.semanticForms.light,
136
- table.semanticForms,
137
- table.semanticForms.light {
138
- interpolate-size: allow-keywords;
139
- }
140
- }
141
- form.semanticForms [hidden],
142
- form.semanticForms.light [hidden],
143
- table.semanticForms [hidden],
144
- table.semanticForms.light [hidden] {
145
- display: none !important;
146
- }
147
- form.semanticForms div:has(dd[hidden]),
148
- form.semanticForms.light div:has(dd[hidden]),
149
- table.semanticForms div:has(dd[hidden]),
150
- table.semanticForms.light div:has(dd[hidden]) {
151
- display: none !important;
223
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio]),
224
+ .semanticForms select {
225
+ height: var(--semanticFormsInputHeight);
152
226
  }
153
- form.semanticForms:not(table),
154
- form.semanticForms.light:not(table),
155
- table.semanticForms:not(table),
156
- table.semanticForms.light:not(table) {
157
- display: flex;
158
- flex-direction: column;
159
- gap: 10px;
227
+ .semanticForms input[type=checkbox],
228
+ .semanticForms input[type=radio] {
229
+ width: 18px;
230
+ height: 18px;
231
+ margin: 3px 0;
232
+ cursor: pointer;
160
233
  }
161
- form.semanticForms fieldset,
162
- form.semanticForms label,
163
- form.semanticForms input,
164
- form.semanticForms select,
165
- form.semanticForms textarea,
166
- form.semanticForms button,
167
- form.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea),
168
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea),
169
- form.semanticForms dt:has(> input, > select, > textarea),
170
- form.semanticForms dd:has(> input, > select, > textarea, > ul, > menu),
171
- form.semanticForms div:has(dt, dd),
172
- form.semanticForms dd > p,
173
- form.semanticForms.light fieldset,
174
- form.semanticForms.light label,
175
- form.semanticForms.light input,
176
- form.semanticForms.light select,
177
- form.semanticForms.light textarea,
178
- form.semanticForms.light button,
179
- form.semanticForms.light menu:has(li > input, li > label, li > button, li > select, li > textarea),
180
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea),
181
- form.semanticForms.light dt:has(> input, > select, > textarea),
182
- form.semanticForms.light dd:has(> input, > select, > textarea, > ul, > menu),
183
- form.semanticForms.light div:has(dt, dd),
184
- form.semanticForms.light dd > p,
185
- table.semanticForms fieldset,
186
- table.semanticForms label,
187
- table.semanticForms input,
188
- table.semanticForms select,
189
- table.semanticForms textarea,
190
- table.semanticForms button,
191
- table.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea),
192
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea),
193
- table.semanticForms dt:has(> input, > select, > textarea),
194
- table.semanticForms dd:has(> input, > select, > textarea, > ul, > menu),
195
- table.semanticForms div:has(dt, dd),
196
- table.semanticForms dd > p,
197
- table.semanticForms.light fieldset,
198
- table.semanticForms.light label,
199
- table.semanticForms.light input,
200
- table.semanticForms.light select,
201
- table.semanticForms.light textarea,
202
- table.semanticForms.light button,
203
- table.semanticForms.light menu:has(li > input, li > label, li > button, li > select, li > textarea),
204
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea),
205
- table.semanticForms.light dt:has(> input, > select, > textarea),
206
- table.semanticForms.light dd:has(> input, > select, > textarea, > ul, > menu),
207
- table.semanticForms.light div:has(dt, dd),
208
- table.semanticForms.light dd > p {
234
+ .semanticForms input[type=checkbox] ~ label:first-of-type,
235
+ .semanticForms input[type=radio] ~ label:first-of-type {
209
236
  color: var(--semanticFormsTextColor);
210
- font-family: var(--semanticFormsFontFamily);
211
- box-sizing: border-box;
212
- margin: 0;
213
- padding: 0;
214
- }
215
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
216
- form.semanticForms select,
217
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
218
- form.semanticForms.light select,
219
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
220
- table.semanticForms select,
221
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
222
- table.semanticForms.light select {
223
- height: var(--semanticFormsInputHeight);
224
237
  }
225
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
226
- form.semanticForms select,
227
- form.semanticForms textarea,
228
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
229
- form.semanticForms.light select,
230
- form.semanticForms.light textarea,
231
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
232
- table.semanticForms select,
233
- table.semanticForms textarea,
234
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
235
- table.semanticForms.light select,
236
- table.semanticForms.light textarea {
238
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio]),
239
+ .semanticForms select,
240
+ .semanticForms textarea {
237
241
  font-size: var(--semanticFormsInputFontSize);
238
242
  background: var(--semanticFormsFormBgColor);
239
243
  border: var(--semanticFormsBorder);
@@ -242,301 +246,84 @@ table.semanticForms.light textarea {
242
246
  touch-action: manipulation;
243
247
  outline: none;
244
248
  }
245
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]):not([type=range]),
246
- form.semanticForms select:not([type=range]),
247
- form.semanticForms textarea:not([type=range]),
248
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]):not([type=range]),
249
- form.semanticForms.light select:not([type=range]),
250
- form.semanticForms.light textarea:not([type=range]),
251
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]):not([type=range]),
252
- table.semanticForms select:not([type=range]),
253
- table.semanticForms textarea:not([type=range]),
254
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]):not([type=range]),
255
- table.semanticForms.light select:not([type=range]),
256
- table.semanticForms.light textarea:not([type=range]) {
249
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio]):focus,
250
+ .semanticForms select:focus,
251
+ .semanticForms textarea:focus {
252
+ outline: none;
253
+ box-shadow: 0 0 0 1px var(--semanticFormsFocusColor);
254
+ }
255
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio]):not([type=range]),
256
+ .semanticForms select:not([type=range]),
257
+ .semanticForms textarea:not([type=range]) {
257
258
  padding: 6px 30px 6px 20px;
258
259
  }
259
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) input:not([type=submit], [type=reset], [type=image]):focus,
260
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) select:focus,
261
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) textarea:focus,
262
- form.semanticForms select input:not([type=submit], [type=reset], [type=image]):focus,
263
- form.semanticForms select select:focus,
264
- form.semanticForms select textarea:focus,
265
- form.semanticForms textarea input:not([type=submit], [type=reset], [type=image]):focus,
266
- form.semanticForms textarea select:focus,
267
- form.semanticForms textarea textarea:focus,
268
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) input:not([type=submit], [type=reset], [type=image]):focus,
269
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) select:focus,
270
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) textarea:focus,
271
- form.semanticForms.light select input:not([type=submit], [type=reset], [type=image]):focus,
272
- form.semanticForms.light select select:focus,
273
- form.semanticForms.light select textarea:focus,
274
- form.semanticForms.light textarea input:not([type=submit], [type=reset], [type=image]):focus,
275
- form.semanticForms.light textarea select:focus,
276
- form.semanticForms.light textarea textarea:focus,
277
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) input:not([type=submit], [type=reset], [type=image]):focus,
278
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) select:focus,
279
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) textarea:focus,
280
- table.semanticForms select input:not([type=submit], [type=reset], [type=image]):focus,
281
- table.semanticForms select select:focus,
282
- table.semanticForms select textarea:focus,
283
- table.semanticForms textarea input:not([type=submit], [type=reset], [type=image]):focus,
284
- table.semanticForms textarea select:focus,
285
- table.semanticForms textarea textarea:focus,
286
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) input:not([type=submit], [type=reset], [type=image]):focus,
287
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) select:focus,
288
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]) textarea:focus,
289
- table.semanticForms.light select input:not([type=submit], [type=reset], [type=image]):focus,
290
- table.semanticForms.light select select:focus,
291
- table.semanticForms.light select textarea:focus,
292
- table.semanticForms.light textarea input:not([type=submit], [type=reset], [type=image]):focus,
293
- table.semanticForms.light textarea select:focus,
294
- table.semanticForms.light textarea textarea:focus {
295
- outline: none;
296
- box-shadow: 0 0 0 1px var(--semanticFormsBorderColor);
297
- }
298
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=password], form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=text]:has(~ button.show),
299
- form.semanticForms select[type=password],
300
- form.semanticForms select[type=text]:has(~ button.show),
301
- form.semanticForms textarea[type=password],
302
- form.semanticForms textarea[type=text]:has(~ button.show),
303
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=password],
304
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=text]:has(~ button.show),
305
- form.semanticForms.light select[type=password],
306
- form.semanticForms.light select[type=text]:has(~ button.show),
307
- form.semanticForms.light textarea[type=password],
308
- form.semanticForms.light textarea[type=text]:has(~ button.show),
309
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=password],
310
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=text]:has(~ button.show),
311
- table.semanticForms select[type=password],
312
- table.semanticForms select[type=text]:has(~ button.show),
313
- table.semanticForms textarea[type=password],
314
- table.semanticForms textarea[type=text]:has(~ button.show),
315
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=password],
316
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=text]:has(~ button.show),
317
- table.semanticForms.light select[type=password],
318
- table.semanticForms.light select[type=text]:has(~ button.show),
319
- table.semanticForms.light textarea[type=password],
320
- table.semanticForms.light textarea[type=text]:has(~ button.show) {
260
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=password], .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=text]:has(~ button.show),
261
+ .semanticForms select[type=password],
262
+ .semanticForms select[type=text]:has(~ button.show),
263
+ .semanticForms textarea[type=password],
264
+ .semanticForms textarea[type=text]:has(~ button.show) {
321
265
  padding: 6px 55px 6px 20px;
322
266
  }
323
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search],
324
- form.semanticForms select[type=search],
325
- form.semanticForms textarea[type=search],
326
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search],
327
- form.semanticForms.light select[type=search],
328
- form.semanticForms.light textarea[type=search],
329
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search],
330
- table.semanticForms select[type=search],
331
- table.semanticForms textarea[type=search],
332
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search],
333
- table.semanticForms.light select[type=search],
334
- table.semanticForms.light textarea[type=search] {
267
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=search],
268
+ .semanticForms select[type=search],
269
+ .semanticForms textarea[type=search] {
335
270
  padding: 6px 20px 6px 32px;
336
271
  background: var(--semanticFormsSearchIcon) no-repeat 10px;
337
272
  background-color: var(--semanticFormsFormBgColor);
338
273
  background-size: 18px;
339
274
  }
340
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]:focus + label.floatLabelFormAnimatedLabel, form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
341
- form.semanticForms select[type=search]:focus + label.floatLabelFormAnimatedLabel,
342
- form.semanticForms select[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
343
- form.semanticForms textarea[type=search]:focus + label.floatLabelFormAnimatedLabel,
344
- form.semanticForms textarea[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
345
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]:focus + label.floatLabelFormAnimatedLabel,
346
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
347
- form.semanticForms.light select[type=search]:focus + label.floatLabelFormAnimatedLabel,
348
- form.semanticForms.light select[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
349
- form.semanticForms.light textarea[type=search]:focus + label.floatLabelFormAnimatedLabel,
350
- form.semanticForms.light textarea[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
351
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]:focus + label.floatLabelFormAnimatedLabel,
352
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
353
- table.semanticForms select[type=search]:focus + label.floatLabelFormAnimatedLabel,
354
- table.semanticForms select[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
355
- table.semanticForms textarea[type=search]:focus + label.floatLabelFormAnimatedLabel,
356
- table.semanticForms textarea[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
357
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]:focus + label.floatLabelFormAnimatedLabel,
358
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
359
- table.semanticForms.light select[type=search]:focus + label.floatLabelFormAnimatedLabel,
360
- table.semanticForms.light select[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
361
- table.semanticForms.light textarea[type=search]:focus + label.floatLabelFormAnimatedLabel,
362
- table.semanticForms.light textarea[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel {
275
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=search]:focus + label.floatLabelFormAnimatedLabel, .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
276
+ .semanticForms select[type=search]:focus + label.floatLabelFormAnimatedLabel,
277
+ .semanticForms select[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel,
278
+ .semanticForms textarea[type=search]:focus + label.floatLabelFormAnimatedLabel,
279
+ .semanticForms textarea[type=search]:not(:placeholder-shown) + label.floatLabelFormAnimatedLabel {
363
280
  left: 20px;
364
281
  }
365
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]::-webkit-search-cancel-button,
366
- form.semanticForms select[type=search]::-webkit-search-cancel-button,
367
- form.semanticForms textarea[type=search]::-webkit-search-cancel-button,
368
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]::-webkit-search-cancel-button,
369
- form.semanticForms.light select[type=search]::-webkit-search-cancel-button,
370
- form.semanticForms.light textarea[type=search]::-webkit-search-cancel-button,
371
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]::-webkit-search-cancel-button,
372
- table.semanticForms select[type=search]::-webkit-search-cancel-button,
373
- table.semanticForms textarea[type=search]::-webkit-search-cancel-button,
374
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=search]::-webkit-search-cancel-button,
375
- table.semanticForms.light select[type=search]::-webkit-search-cancel-button,
376
- table.semanticForms.light textarea[type=search]::-webkit-search-cancel-button {
282
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=search]::-webkit-search-cancel-button,
283
+ .semanticForms select[type=search]::-webkit-search-cancel-button,
284
+ .semanticForms textarea[type=search]::-webkit-search-cancel-button {
377
285
  display: none;
378
286
  }
379
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=checkbox], form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=radio],
380
- form.semanticForms select[type=checkbox],
381
- form.semanticForms select[type=radio],
382
- form.semanticForms textarea[type=checkbox],
383
- form.semanticForms textarea[type=radio],
384
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=checkbox],
385
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=radio],
386
- form.semanticForms.light select[type=checkbox],
387
- form.semanticForms.light select[type=radio],
388
- form.semanticForms.light textarea[type=checkbox],
389
- form.semanticForms.light textarea[type=radio],
390
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=checkbox],
391
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=radio],
392
- table.semanticForms select[type=checkbox],
393
- table.semanticForms select[type=radio],
394
- table.semanticForms textarea[type=checkbox],
395
- table.semanticForms textarea[type=radio],
396
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=checkbox],
397
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=radio],
398
- table.semanticForms.light select[type=checkbox],
399
- table.semanticForms.light select[type=radio],
400
- table.semanticForms.light textarea[type=checkbox],
401
- table.semanticForms.light textarea[type=radio] {
402
- width: 18px;
403
- height: 18px;
404
- margin: 3px 0;
405
- cursor: pointer;
406
- }
407
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=checkbox] ~ label:first-of-type, form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=radio] ~ label:first-of-type,
408
- form.semanticForms select[type=checkbox] ~ label:first-of-type,
409
- form.semanticForms select[type=radio] ~ label:first-of-type,
410
- form.semanticForms textarea[type=checkbox] ~ label:first-of-type,
411
- form.semanticForms textarea[type=radio] ~ label:first-of-type,
412
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=checkbox] ~ label:first-of-type,
413
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=radio] ~ label:first-of-type,
414
- form.semanticForms.light select[type=checkbox] ~ label:first-of-type,
415
- form.semanticForms.light select[type=radio] ~ label:first-of-type,
416
- form.semanticForms.light textarea[type=checkbox] ~ label:first-of-type,
417
- form.semanticForms.light textarea[type=radio] ~ label:first-of-type,
418
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=checkbox] ~ label:first-of-type,
419
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=radio] ~ label:first-of-type,
420
- table.semanticForms select[type=checkbox] ~ label:first-of-type,
421
- table.semanticForms select[type=radio] ~ label:first-of-type,
422
- table.semanticForms textarea[type=checkbox] ~ label:first-of-type,
423
- table.semanticForms textarea[type=radio] ~ label:first-of-type,
424
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=checkbox] ~ label:first-of-type,
425
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=radio] ~ label:first-of-type,
426
- table.semanticForms.light select[type=checkbox] ~ label:first-of-type,
427
- table.semanticForms.light select[type=radio] ~ label:first-of-type,
428
- table.semanticForms.light textarea[type=checkbox] ~ label:first-of-type,
429
- table.semanticForms.light textarea[type=radio] ~ label:first-of-type {
430
- color: var(--semanticFormsTextColor);
431
- }
432
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=range], form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=color],
433
- form.semanticForms select[type=range],
434
- form.semanticForms select[type=color],
435
- form.semanticForms textarea[type=range],
436
- form.semanticForms textarea[type=color],
437
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=range],
438
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=color],
439
- form.semanticForms.light select[type=range],
440
- form.semanticForms.light select[type=color],
441
- form.semanticForms.light textarea[type=range],
442
- form.semanticForms.light textarea[type=color],
443
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=range],
444
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=color],
445
- table.semanticForms select[type=range],
446
- table.semanticForms select[type=color],
447
- table.semanticForms textarea[type=range],
448
- table.semanticForms textarea[type=color],
449
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=range],
450
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=color],
451
- table.semanticForms.light select[type=range],
452
- table.semanticForms.light select[type=color],
453
- table.semanticForms.light textarea[type=range],
454
- table.semanticForms.light textarea[type=color] {
287
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=range], .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=color],
288
+ .semanticForms select[type=range],
289
+ .semanticForms select[type=color],
290
+ .semanticForms textarea[type=range],
291
+ .semanticForms textarea[type=color] {
455
292
  cursor: pointer;
456
293
  }
457
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=color],
458
- form.semanticForms select[type=color],
459
- form.semanticForms textarea[type=color],
460
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=color],
461
- form.semanticForms.light select[type=color],
462
- form.semanticForms.light textarea[type=color],
463
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=color],
464
- table.semanticForms select[type=color],
465
- table.semanticForms textarea[type=color],
466
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=color],
467
- table.semanticForms.light select[type=color],
468
- table.semanticForms.light textarea[type=color] {
294
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=color],
295
+ .semanticForms select[type=color],
296
+ .semanticForms textarea[type=color] {
469
297
  height: var(--semanticFormsInputHeight);
298
+ min-width: var(--semanticFormsInputMinWidth);
470
299
  padding: 4px 30px 4px 10px;
471
300
  }
472
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=file],
473
- form.semanticForms select[type=file],
474
- form.semanticForms textarea[type=file],
475
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=file],
476
- form.semanticForms.light select[type=file],
477
- form.semanticForms.light textarea[type=file],
478
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=file],
479
- table.semanticForms select[type=file],
480
- table.semanticForms textarea[type=file],
481
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[type=file],
482
- table.semanticForms.light select[type=file],
483
- table.semanticForms.light textarea[type=file] {
301
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[type=file],
302
+ .semanticForms select[type=file],
303
+ .semanticForms textarea[type=file] {
484
304
  cursor: pointer;
485
305
  font-size: var(--semanticFormsInputFontSize);
486
306
  }
487
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled],
488
- form.semanticForms select[disabled],
489
- form.semanticForms textarea[disabled],
490
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled],
491
- form.semanticForms.light select[disabled],
492
- form.semanticForms.light textarea[disabled],
493
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled],
494
- table.semanticForms select[disabled],
495
- table.semanticForms textarea[disabled],
496
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled],
497
- table.semanticForms.light select[disabled],
498
- table.semanticForms.light textarea[disabled] {
307
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[disabled],
308
+ .semanticForms select[disabled],
309
+ .semanticForms textarea[disabled] {
499
310
  cursor: not-allowed;
500
311
  opacity: 0.5;
501
312
  }
502
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled] ~ label:first-of-type,
503
- form.semanticForms select[disabled] ~ label:first-of-type,
504
- form.semanticForms textarea[disabled] ~ label:first-of-type,
505
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled] ~ label:first-of-type,
506
- form.semanticForms.light select[disabled] ~ label:first-of-type,
507
- form.semanticForms.light textarea[disabled] ~ label:first-of-type,
508
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled] ~ label:first-of-type,
509
- table.semanticForms select[disabled] ~ label:first-of-type,
510
- table.semanticForms textarea[disabled] ~ label:first-of-type,
511
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled] ~ label:first-of-type,
512
- table.semanticForms.light select[disabled] ~ label:first-of-type,
513
- table.semanticForms.light textarea[disabled] ~ label:first-of-type {
313
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[disabled] ~ label:first-of-type,
314
+ .semanticForms select[disabled] ~ label:first-of-type,
315
+ .semanticForms textarea[disabled] ~ label:first-of-type {
514
316
  opacity: 0.5;
515
317
  }
516
- form.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled] ~ label + button,
517
- form.semanticForms select[disabled] ~ label + button,
518
- form.semanticForms textarea[disabled] ~ label + button,
519
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled] ~ label + button,
520
- form.semanticForms.light select[disabled] ~ label + button,
521
- form.semanticForms.light textarea[disabled] ~ label + button,
522
- table.semanticForms input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled] ~ label + button,
523
- table.semanticForms select[disabled] ~ label + button,
524
- table.semanticForms textarea[disabled] ~ label + button,
525
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio])[disabled] ~ label + button,
526
- table.semanticForms.light select[disabled] ~ label + button,
527
- table.semanticForms.light textarea[disabled] ~ label + button {
318
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio])[disabled] ~ label + button,
319
+ .semanticForms select[disabled] ~ label + button,
320
+ .semanticForms textarea[disabled] ~ label + button {
528
321
  display: none;
529
322
  }
530
- form.semanticForms select,
531
- form.semanticForms.light select,
532
- table.semanticForms select,
533
- table.semanticForms.light select {
323
+ .semanticForms select {
534
324
  cursor: pointer;
535
325
  }
536
- form.semanticForms select:not([multiple]),
537
- form.semanticForms.light select:not([multiple]),
538
- table.semanticForms select:not([multiple]),
539
- table.semanticForms.light select:not([multiple]) {
326
+ .semanticForms select:not([multiple]) {
540
327
  background-image: var(--semanticFormsSelectIcon);
541
328
  background-size: 14px;
542
329
  background-position: calc(100% - 8px) 16px;
@@ -545,54 +332,30 @@ table.semanticForms.light select:not([multiple]) {
545
332
  -moz-appearance: none;
546
333
  appearance: none;
547
334
  }
548
- form.semanticForms select[multiple],
549
- form.semanticForms.light select[multiple],
550
- table.semanticForms select[multiple],
551
- table.semanticForms.light select[multiple] {
335
+ .semanticForms select[multiple] {
552
336
  min-height: 38px;
553
337
  height: 100px;
554
338
  padding: 0;
555
339
  }
556
- form.semanticForms select[multiple] option,
557
- form.semanticForms.light select[multiple] option,
558
- table.semanticForms select[multiple] option,
559
- table.semanticForms.light select[multiple] option {
340
+ .semanticForms select[multiple] option {
560
341
  padding: 6px 20px;
561
342
  }
562
- form.semanticForms select[multiple] option:first-of-type,
563
- form.semanticForms.light select[multiple] option:first-of-type,
564
- table.semanticForms select[multiple] option:first-of-type,
565
- table.semanticForms.light select[multiple] option:first-of-type {
343
+ .semanticForms select[multiple] option:first-of-type {
566
344
  border-top-left-radius: var(--semanticFormsBorderRadius);
567
345
  }
568
- form.semanticForms select[multiple] option:last-of-type,
569
- form.semanticForms.light select[multiple] option:last-of-type,
570
- table.semanticForms select[multiple] option:last-of-type,
571
- table.semanticForms.light select[multiple] option:last-of-type {
346
+ .semanticForms select[multiple] option:last-of-type {
572
347
  border-bottom-left-radius: var(--semanticFormsBorderRadius);
573
348
  }
574
- form.semanticForms textarea,
575
- form.semanticForms.light textarea,
576
- table.semanticForms textarea,
577
- table.semanticForms.light textarea {
349
+ .semanticForms textarea {
578
350
  resize: vertical;
579
351
  line-height: 1.5;
580
352
  width: 100%;
581
353
  min-height: 38px;
582
354
  }
583
- form.semanticForms textarea[data-auto-grow],
584
- form.semanticForms.light textarea[data-auto-grow],
585
- table.semanticForms textarea[data-auto-grow],
586
- table.semanticForms.light textarea[data-auto-grow] {
355
+ .semanticForms textarea[data-auto-grow] {
587
356
  field-sizing: content;
588
357
  }
589
- form.semanticForms button.clear, form.semanticForms button.show,
590
- form.semanticForms.light button.clear,
591
- form.semanticForms.light button.show,
592
- table.semanticForms button.clear,
593
- table.semanticForms button.show,
594
- table.semanticForms.light button.clear,
595
- table.semanticForms.light button.show {
358
+ .semanticForms button.clear, .semanticForms button.show {
596
359
  cursor: pointer;
597
360
  appearance: none;
598
361
  -webkit-appearance: none;
@@ -611,52 +374,26 @@ table.semanticForms.light button.show {
611
374
  align-items: center;
612
375
  justify-content: center;
613
376
  }
614
- form.semanticForms button.show,
615
- form.semanticForms.light button.show,
616
- table.semanticForms button.show,
617
- table.semanticForms.light button.show {
377
+ .semanticForms button.show {
618
378
  right: 25px;
619
379
  }
620
- form.semanticForms textarea ~ .clear,
621
- form.semanticForms.light textarea ~ .clear,
622
- table.semanticForms textarea ~ .clear,
623
- table.semanticForms.light textarea ~ .clear {
380
+ .semanticForms button.show svg {
381
+ height: 100%;
382
+ }
383
+ .semanticForms textarea ~ .clear {
624
384
  bottom: auto;
625
385
  }
626
- form.semanticForms input:placeholder-shown ~ .clear,
627
- form.semanticForms input:placeholder-shown ~ .show,
628
- form.semanticForms textarea:placeholder-shown ~ .clear,
629
- form.semanticForms input[type=file] ~ .clear,
630
- form.semanticForms.light input:placeholder-shown ~ .clear,
631
- form.semanticForms.light input:placeholder-shown ~ .show,
632
- form.semanticForms.light textarea:placeholder-shown ~ .clear,
633
- form.semanticForms.light input[type=file] ~ .clear,
634
- table.semanticForms input:placeholder-shown ~ .clear,
635
- table.semanticForms input:placeholder-shown ~ .show,
636
- table.semanticForms textarea:placeholder-shown ~ .clear,
637
- table.semanticForms input[type=file] ~ .clear,
638
- table.semanticForms.light input:placeholder-shown ~ .clear,
639
- table.semanticForms.light input:placeholder-shown ~ .show,
640
- table.semanticForms.light textarea:placeholder-shown ~ .clear,
641
- table.semanticForms.light input[type=file] ~ .clear {
386
+ .semanticForms input:placeholder-shown ~ .clear,
387
+ .semanticForms input:placeholder-shown ~ .show,
388
+ .semanticForms textarea:placeholder-shown ~ .clear,
389
+ .semanticForms input[type=file] ~ .clear {
642
390
  display: none;
643
391
  }
644
- form.semanticForms input[type=submit],
645
- form.semanticForms input[type=reset],
646
- form.semanticForms button:not(.clear, .show),
647
- form.semanticForms .button-link,
648
- form.semanticForms.light input[type=submit],
649
- form.semanticForms.light input[type=reset],
650
- form.semanticForms.light button:not(.clear, .show),
651
- form.semanticForms.light .button-link,
652
- table.semanticForms input[type=submit],
653
- table.semanticForms input[type=reset],
654
- table.semanticForms button:not(.clear, .show),
655
- table.semanticForms .button-link,
656
- table.semanticForms.light input[type=submit],
657
- table.semanticForms.light input[type=reset],
658
- table.semanticForms.light button:not(.clear, .show),
659
- table.semanticForms.light .button-link {
392
+ .semanticForms input[type=submit],
393
+ .semanticForms input[type=reset],
394
+ .semanticForms input[type=button],
395
+ .semanticForms button:not(.clear, .show),
396
+ .semanticForms .button-link {
660
397
  appearance: none;
661
398
  -moz-appearance: none;
662
399
  -webkit-appearance: none;
@@ -676,787 +413,199 @@ table.semanticForms.light .button-link {
676
413
  text-decoration: none;
677
414
  color: var(--semanticFormsTextColor);
678
415
  }
679
- form.semanticForms input[type=submit]:active,
680
- form.semanticForms input[type=reset]:active,
681
- form.semanticForms button:not(.clear, .show):active,
682
- form.semanticForms .button-link:active,
683
- form.semanticForms.light input[type=submit]:active,
684
- form.semanticForms.light input[type=reset]:active,
685
- form.semanticForms.light button:not(.clear, .show):active,
686
- form.semanticForms.light .button-link:active,
687
- table.semanticForms input[type=submit]:active,
688
- table.semanticForms input[type=reset]:active,
689
- table.semanticForms button:not(.clear, .show):active,
690
- table.semanticForms .button-link:active,
691
- table.semanticForms.light input[type=submit]:active,
692
- table.semanticForms.light input[type=reset]:active,
693
- table.semanticForms.light button:not(.clear, .show):active,
694
- table.semanticForms.light .button-link:active {
416
+ .semanticForms input[type=submit]:active,
417
+ .semanticForms input[type=reset]:active,
418
+ .semanticForms input[type=button]:active,
419
+ .semanticForms button:not(.clear, .show):active,
420
+ .semanticForms .button-link:active {
695
421
  transform: scale(0.97);
696
422
  }
697
- form.semanticForms input[type=submit],
698
- form.semanticForms input[type=reset],
699
- form.semanticForms input[type=image],
700
- form.semanticForms button:not(.clear):not(.show),
701
- form.semanticForms .button-link,
702
- form.semanticForms.light input[type=submit],
703
- form.semanticForms.light input[type=reset],
704
- form.semanticForms.light input[type=image],
705
- form.semanticForms.light button:not(.clear):not(.show),
706
- form.semanticForms.light .button-link,
707
- table.semanticForms input[type=submit],
708
- table.semanticForms input[type=reset],
709
- table.semanticForms input[type=image],
710
- table.semanticForms button:not(.clear):not(.show),
711
- table.semanticForms .button-link,
712
- table.semanticForms.light input[type=submit],
713
- table.semanticForms.light input[type=reset],
714
- table.semanticForms.light input[type=image],
715
- table.semanticForms.light button:not(.clear):not(.show),
716
- table.semanticForms.light .button-link {
423
+ .semanticForms input[type=submit],
424
+ .semanticForms input[type=reset],
425
+ .semanticForms input[type=button],
426
+ .semanticForms input[type=image],
427
+ .semanticForms button:not(.clear):not(.show),
428
+ .semanticForms .button-link {
717
429
  transition: filter 0.1s;
718
430
  }
719
- form.semanticForms input[type=submit]:hover,
720
- form.semanticForms input[type=reset]:hover,
721
- form.semanticForms input[type=image]:hover,
722
- form.semanticForms button:not(.clear):not(.show):hover,
723
- form.semanticForms .button-link:hover,
724
- form.semanticForms.light input[type=submit]:hover,
725
- form.semanticForms.light input[type=reset]:hover,
726
- form.semanticForms.light input[type=image]:hover,
727
- form.semanticForms.light button:not(.clear):not(.show):hover,
728
- form.semanticForms.light .button-link:hover,
729
- table.semanticForms input[type=submit]:hover,
730
- table.semanticForms input[type=reset]:hover,
731
- table.semanticForms input[type=image]:hover,
732
- table.semanticForms button:not(.clear):not(.show):hover,
733
- table.semanticForms .button-link:hover,
734
- table.semanticForms.light input[type=submit]:hover,
735
- table.semanticForms.light input[type=reset]:hover,
736
- table.semanticForms.light input[type=image]:hover,
737
- table.semanticForms.light button:not(.clear):not(.show):hover,
738
- table.semanticForms.light .button-link:hover {
431
+ .semanticForms input[type=submit]:hover,
432
+ .semanticForms input[type=reset]:hover,
433
+ .semanticForms input[type=button]:hover,
434
+ .semanticForms input[type=image]:hover,
435
+ .semanticForms button:not(.clear):not(.show):hover,
436
+ .semanticForms .button-link:hover {
739
437
  filter: brightness(1.05);
740
438
  }
741
- form.semanticForms .button-link,
742
- form.semanticForms.light .button-link,
743
- table.semanticForms .button-link,
744
- table.semanticForms.light .button-link {
439
+ .semanticForms .button-link {
745
440
  display: block;
746
441
  }
747
- form.semanticForms .button-link:visited, form.semanticForms .button-link:link,
748
- form.semanticForms.light .button-link:visited,
749
- form.semanticForms.light .button-link:link,
750
- table.semanticForms .button-link:visited,
751
- table.semanticForms .button-link:link,
752
- table.semanticForms.light .button-link:visited,
753
- table.semanticForms.light .button-link:link {
442
+ .semanticForms .button-link:visited, .semanticForms .button-link:link {
754
443
  color: var(--semanticFormsTextColor);
755
444
  }
756
- form.semanticForms [data-invalid-text],
757
- form.semanticForms.light [data-invalid-text],
758
- table.semanticForms [data-invalid-text],
759
- table.semanticForms.light [data-invalid-text] {
445
+ .semanticForms [data-invalid-text] {
760
446
  display: none;
761
447
  color: var(--semanticFormsInvalid);
762
448
  }
763
- form.semanticForms input:not([type=submit], [type=reset], [type=image]).invalid, form.semanticForms input:not([type=submit], [type=reset], [type=image]):user-invalid,
764
- form.semanticForms select.invalid,
765
- form.semanticForms select:user-invalid,
766
- form.semanticForms textarea.invalid,
767
- form.semanticForms textarea:user-invalid,
768
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image]).invalid,
769
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image]):user-invalid,
770
- form.semanticForms.light select.invalid,
771
- form.semanticForms.light select:user-invalid,
772
- form.semanticForms.light textarea.invalid,
773
- form.semanticForms.light textarea:user-invalid,
774
- table.semanticForms input:not([type=submit], [type=reset], [type=image]).invalid,
775
- table.semanticForms input:not([type=submit], [type=reset], [type=image]):user-invalid,
776
- table.semanticForms select.invalid,
777
- table.semanticForms select:user-invalid,
778
- table.semanticForms textarea.invalid,
779
- table.semanticForms textarea:user-invalid,
780
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image]).invalid,
781
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image]):user-invalid,
782
- table.semanticForms.light select.invalid,
783
- table.semanticForms.light select:user-invalid,
784
- table.semanticForms.light textarea.invalid,
785
- table.semanticForms.light textarea:user-invalid {
449
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image]).invalid, .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image]):user-invalid,
450
+ .semanticForms select.invalid,
451
+ .semanticForms select:user-invalid,
452
+ .semanticForms textarea.invalid,
453
+ .semanticForms textarea:user-invalid {
786
454
  border: var(--semanticFormsInvalidBorder);
787
455
  }
788
- form.semanticForms input:not([type=submit], [type=reset], [type=image]).invalid ~ label:nth-of-type(2), form.semanticForms input:not([type=submit], [type=reset], [type=image]):user-invalid ~ label:nth-of-type(2),
789
- form.semanticForms select.invalid ~ label:nth-of-type(2),
790
- form.semanticForms select:user-invalid ~ label:nth-of-type(2),
791
- form.semanticForms textarea.invalid ~ label:nth-of-type(2),
792
- form.semanticForms textarea:user-invalid ~ label:nth-of-type(2),
793
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image]).invalid ~ label:nth-of-type(2),
794
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image]):user-invalid ~ label:nth-of-type(2),
795
- form.semanticForms.light select.invalid ~ label:nth-of-type(2),
796
- form.semanticForms.light select:user-invalid ~ label:nth-of-type(2),
797
- form.semanticForms.light textarea.invalid ~ label:nth-of-type(2),
798
- form.semanticForms.light textarea:user-invalid ~ label:nth-of-type(2),
799
- table.semanticForms input:not([type=submit], [type=reset], [type=image]).invalid ~ label:nth-of-type(2),
800
- table.semanticForms input:not([type=submit], [type=reset], [type=image]):user-invalid ~ label:nth-of-type(2),
801
- table.semanticForms select.invalid ~ label:nth-of-type(2),
802
- table.semanticForms select:user-invalid ~ label:nth-of-type(2),
803
- table.semanticForms textarea.invalid ~ label:nth-of-type(2),
804
- table.semanticForms textarea:user-invalid ~ label:nth-of-type(2),
805
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image]).invalid ~ label:nth-of-type(2),
806
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image]):user-invalid ~ label:nth-of-type(2),
807
- table.semanticForms.light select.invalid ~ label:nth-of-type(2),
808
- table.semanticForms.light select:user-invalid ~ label:nth-of-type(2),
809
- table.semanticForms.light textarea.invalid ~ label:nth-of-type(2),
810
- table.semanticForms.light textarea:user-invalid ~ label:nth-of-type(2) {
456
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image]).invalid ~ label:nth-of-type(2), .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image]):user-invalid ~ label:nth-of-type(2),
457
+ .semanticForms select.invalid ~ label:nth-of-type(2),
458
+ .semanticForms select:user-invalid ~ label:nth-of-type(2),
459
+ .semanticForms textarea.invalid ~ label:nth-of-type(2),
460
+ .semanticForms textarea:user-invalid ~ label:nth-of-type(2) {
811
461
  color: var(--semanticFormsInvalid);
812
462
  }
813
- form.semanticForms input:not([type=submit], [type=reset], [type=image]).invalid ~ [data-invalid-text], form.semanticForms input:not([type=submit], [type=reset], [type=image]):user-invalid ~ [data-invalid-text],
814
- form.semanticForms select.invalid ~ [data-invalid-text],
815
- form.semanticForms select:user-invalid ~ [data-invalid-text],
816
- form.semanticForms textarea.invalid ~ [data-invalid-text],
817
- form.semanticForms textarea:user-invalid ~ [data-invalid-text],
818
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image]).invalid ~ [data-invalid-text],
819
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image]):user-invalid ~ [data-invalid-text],
820
- form.semanticForms.light select.invalid ~ [data-invalid-text],
821
- form.semanticForms.light select:user-invalid ~ [data-invalid-text],
822
- form.semanticForms.light textarea.invalid ~ [data-invalid-text],
823
- form.semanticForms.light textarea:user-invalid ~ [data-invalid-text],
824
- table.semanticForms input:not([type=submit], [type=reset], [type=image]).invalid ~ [data-invalid-text],
825
- table.semanticForms input:not([type=submit], [type=reset], [type=image]):user-invalid ~ [data-invalid-text],
826
- table.semanticForms select.invalid ~ [data-invalid-text],
827
- table.semanticForms select:user-invalid ~ [data-invalid-text],
828
- table.semanticForms textarea.invalid ~ [data-invalid-text],
829
- table.semanticForms textarea:user-invalid ~ [data-invalid-text],
830
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image]).invalid ~ [data-invalid-text],
831
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image]):user-invalid ~ [data-invalid-text],
832
- table.semanticForms.light select.invalid ~ [data-invalid-text],
833
- table.semanticForms.light select:user-invalid ~ [data-invalid-text],
834
- table.semanticForms.light textarea.invalid ~ [data-invalid-text],
835
- table.semanticForms.light textarea:user-invalid ~ [data-invalid-text] {
463
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image]).invalid ~ [data-invalid-text], .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image]):user-invalid ~ [data-invalid-text],
464
+ .semanticForms select.invalid ~ [data-invalid-text],
465
+ .semanticForms select:user-invalid ~ [data-invalid-text],
466
+ .semanticForms textarea.invalid ~ [data-invalid-text],
467
+ .semanticForms textarea:user-invalid ~ [data-invalid-text] {
836
468
  font-size: small;
837
469
  display: flex;
838
470
  }
839
- form.semanticForms input:not([type=submit], [type=reset], [type=image]).warn,
840
- form.semanticForms select.warn,
841
- form.semanticForms textarea.warn,
842
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image]).warn,
843
- form.semanticForms.light select.warn,
844
- form.semanticForms.light textarea.warn,
845
- table.semanticForms input:not([type=submit], [type=reset], [type=image]).warn,
846
- table.semanticForms select.warn,
847
- table.semanticForms textarea.warn,
848
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image]).warn,
849
- table.semanticForms.light select.warn,
850
- table.semanticForms.light textarea.warn {
471
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image]).warn,
472
+ .semanticForms select.warn,
473
+ .semanticForms textarea.warn {
851
474
  border: var(--semanticFormsWarnBorder);
852
475
  }
853
- form.semanticForms input:not([type=submit], [type=reset], [type=image]).warn ~ label:nth-of-type(2),
854
- form.semanticForms select.warn ~ label:nth-of-type(2),
855
- form.semanticForms textarea.warn ~ label:nth-of-type(2),
856
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image]).warn ~ label:nth-of-type(2),
857
- form.semanticForms.light select.warn ~ label:nth-of-type(2),
858
- form.semanticForms.light textarea.warn ~ label:nth-of-type(2),
859
- table.semanticForms input:not([type=submit], [type=reset], [type=image]).warn ~ label:nth-of-type(2),
860
- table.semanticForms select.warn ~ label:nth-of-type(2),
861
- table.semanticForms textarea.warn ~ label:nth-of-type(2),
862
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image]).warn ~ label:nth-of-type(2),
863
- table.semanticForms.light select.warn ~ label:nth-of-type(2),
864
- table.semanticForms.light textarea.warn ~ label:nth-of-type(2) {
476
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image]).warn ~ label:nth-of-type(2),
477
+ .semanticForms select.warn ~ label:nth-of-type(2),
478
+ .semanticForms textarea.warn ~ label:nth-of-type(2) {
865
479
  color: var(--semanticFormsWarn);
866
480
  }
867
- form.semanticForms input:not([type=submit], [type=reset], [type=image]).warn ~ [data-invalid-text],
868
- form.semanticForms select.warn ~ [data-invalid-text],
869
- form.semanticForms textarea.warn ~ [data-invalid-text],
870
- form.semanticForms.light input:not([type=submit], [type=reset], [type=image]).warn ~ [data-invalid-text],
871
- form.semanticForms.light select.warn ~ [data-invalid-text],
872
- form.semanticForms.light textarea.warn ~ [data-invalid-text],
873
- table.semanticForms input:not([type=submit], [type=reset], [type=image]).warn ~ [data-invalid-text],
874
- table.semanticForms select.warn ~ [data-invalid-text],
875
- table.semanticForms textarea.warn ~ [data-invalid-text],
876
- table.semanticForms.light input:not([type=submit], [type=reset], [type=image]).warn ~ [data-invalid-text],
877
- table.semanticForms.light select.warn ~ [data-invalid-text],
878
- table.semanticForms.light textarea.warn ~ [data-invalid-text] {
481
+ .semanticForms input:not([type=submit], [type=reset], [type=button], [type=image]).warn ~ [data-invalid-text],
482
+ .semanticForms select.warn ~ [data-invalid-text],
483
+ .semanticForms textarea.warn ~ [data-invalid-text] {
879
484
  font-size: small;
880
485
  display: flex;
881
486
  }
882
- form.semanticForms input:-webkit-autofill,
883
- form.semanticForms input:-webkit-autofill:hover,
884
- form.semanticForms input:-webkit-autofill:focus,
885
- form.semanticForms input:-webkit-autofill:active,
886
- form.semanticForms textarea:-webkit-autofill,
887
- form.semanticForms textarea:-webkit-autofill:hover,
888
- form.semanticForms textarea:-webkit-autofill:focus,
889
- form.semanticForms textarea:-webkit-autofill:active,
890
- form.semanticForms select:-webkit-autofill,
891
- form.semanticForms select:-webkit-autofill:hover,
892
- form.semanticForms select:-webkit-autofill:focus,
893
- form.semanticForms select:-webkit-autofill:active,
894
- form.semanticForms.light input:-webkit-autofill,
895
- form.semanticForms.light input:-webkit-autofill:hover,
896
- form.semanticForms.light input:-webkit-autofill:focus,
897
- form.semanticForms.light input:-webkit-autofill:active,
898
- form.semanticForms.light textarea:-webkit-autofill,
899
- form.semanticForms.light textarea:-webkit-autofill:hover,
900
- form.semanticForms.light textarea:-webkit-autofill:focus,
901
- form.semanticForms.light textarea:-webkit-autofill:active,
902
- form.semanticForms.light select:-webkit-autofill,
903
- form.semanticForms.light select:-webkit-autofill:hover,
904
- form.semanticForms.light select:-webkit-autofill:focus,
905
- form.semanticForms.light select:-webkit-autofill:active,
906
- table.semanticForms input:-webkit-autofill,
907
- table.semanticForms input:-webkit-autofill:hover,
908
- table.semanticForms input:-webkit-autofill:focus,
909
- table.semanticForms input:-webkit-autofill:active,
910
- table.semanticForms textarea:-webkit-autofill,
911
- table.semanticForms textarea:-webkit-autofill:hover,
912
- table.semanticForms textarea:-webkit-autofill:focus,
913
- table.semanticForms textarea:-webkit-autofill:active,
914
- table.semanticForms select:-webkit-autofill,
915
- table.semanticForms select:-webkit-autofill:hover,
916
- table.semanticForms select:-webkit-autofill:focus,
917
- table.semanticForms select:-webkit-autofill:active,
918
- table.semanticForms.light input:-webkit-autofill,
919
- table.semanticForms.light input:-webkit-autofill:hover,
920
- table.semanticForms.light input:-webkit-autofill:focus,
921
- table.semanticForms.light input:-webkit-autofill:active,
922
- table.semanticForms.light textarea:-webkit-autofill,
923
- table.semanticForms.light textarea:-webkit-autofill:hover,
924
- table.semanticForms.light textarea:-webkit-autofill:focus,
925
- table.semanticForms.light textarea:-webkit-autofill:active,
926
- table.semanticForms.light select:-webkit-autofill,
927
- table.semanticForms.light select:-webkit-autofill:hover,
928
- table.semanticForms.light select:-webkit-autofill:focus,
929
- table.semanticForms.light select:-webkit-autofill:active {
487
+ .semanticForms input:-webkit-autofill,
488
+ .semanticForms input:-webkit-autofill:hover,
489
+ .semanticForms input:-webkit-autofill:focus,
490
+ .semanticForms input:-webkit-autofill:active,
491
+ .semanticForms textarea:-webkit-autofill,
492
+ .semanticForms textarea:-webkit-autofill:hover,
493
+ .semanticForms textarea:-webkit-autofill:focus,
494
+ .semanticForms textarea:-webkit-autofill:active,
495
+ .semanticForms select:-webkit-autofill,
496
+ .semanticForms select:-webkit-autofill:hover,
497
+ .semanticForms select:-webkit-autofill:focus,
498
+ .semanticForms select:-webkit-autofill:active {
930
499
  -webkit-box-shadow: 0 0 0 1000px var(--semanticFormsFormBgColor) inset;
931
500
  transition: background-color 5000s ease-in-out 0s, color 5000s ease-in-out 0s;
932
501
  transition-delay: 5000s;
933
502
  transition-property: background-color, color;
934
503
  }
935
- form.semanticForms fieldset,
936
- form.semanticForms.light fieldset,
937
- table.semanticForms fieldset,
938
- table.semanticForms.light fieldset {
939
- border-radius: var(--semanticFormsBorderRadius);
940
- background: var(--semanticFormsFormSubBgColor);
941
- border: 1px var(--semanticFormsSubBorderColor) solid;
504
+ @supports (scrollbar-color: auto) {
505
+ .semanticForms textarea {
506
+ scrollbar-color: var(--semanticFormsScrollbarColor) transparent;
507
+ }
508
+ .semanticForms textarea::-webkit-resizer {
509
+ border: none;
510
+ background-image: var(--semanticFormsCustomResizer);
511
+ background-size: 14px;
512
+ background-repeat: no-repeat;
513
+ background-position: 100%;
514
+ margin: 0 2px 2px 0;
515
+ }
516
+ .semanticForms select[multiple] {
517
+ scrollbar-color: var(--semanticFormsScrollbarColor) transparent;
518
+ }
519
+ }
520
+
521
+ .semanticForms input[type=checkbox] + label:first-of-type,
522
+ .semanticForms input[type=radio] + label:first-of-type {
523
+ padding-top: 2px;
524
+ font-size: var(--semanticFormsInputFontSize);
525
+ cursor: pointer;
942
526
  display: flex;
943
- flex-direction: column;
527
+ align-items: center;
944
528
  gap: 5px;
945
- padding: 10px 10px 20px 10px;
946
- margin-bottom: 15px;
947
529
  }
948
- form.semanticForms fieldset fieldset,
949
- form.semanticForms.light fieldset fieldset,
950
- table.semanticForms fieldset fieldset,
951
- table.semanticForms.light fieldset fieldset {
952
- background-color: var(--semanticFormsNestedFieldsetBgColor);
953
- border: var(--semanticFormsNestedFieldsetBorder);
530
+ .semanticForms input[type=checkbox] + label:first-of-type span.required,
531
+ .semanticForms input[type=radio] + label:first-of-type span.required {
532
+ cursor: help;
533
+ pointer-events: auto;
534
+ color: red;
954
535
  }
955
- form.semanticForms fieldset fieldset input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
956
- form.semanticForms fieldset fieldset select,
957
- form.semanticForms fieldset fieldset textarea,
958
- form.semanticForms.light fieldset fieldset input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
959
- form.semanticForms.light fieldset fieldset select,
960
- form.semanticForms.light fieldset fieldset textarea,
961
- table.semanticForms fieldset fieldset input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
962
- table.semanticForms fieldset fieldset select,
963
- table.semanticForms fieldset fieldset textarea,
964
- table.semanticForms.light fieldset fieldset input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio]),
965
- table.semanticForms.light fieldset fieldset select,
966
- table.semanticForms.light fieldset fieldset textarea {
967
- background-color: var(--semanticFormsNestedInputBgColor);
536
+ .semanticForms input[type=checkbox] + label:first-of-type span.help,
537
+ .semanticForms input[type=radio] + label:first-of-type span.help {
538
+ display: grid;
539
+ place-items: center;
540
+ cursor: help;
541
+ pointer-events: auto;
968
542
  }
969
- form.semanticForms details,
970
- form.semanticForms.light details,
971
- table.semanticForms details,
972
- table.semanticForms.light details {
973
- box-sizing: border-box;
543
+ .semanticForms input[type=checkbox] + label:first-of-type span.help svg,
544
+ .semanticForms input[type=radio] + label:first-of-type span.help svg {
545
+ width: 80%;
546
+ }
547
+ .semanticForms .floatLabelForm div dt {
974
548
  position: relative;
975
- background-color: var(--semanticFormsNestedFieldsetBgColor);
976
- border: var(--semanticFormsNestedFieldsetBorder);
977
- border-radius: var(--semanticFormsBorderRadius);
549
+ }
550
+ .semanticForms .floatLabelForm div dt label {
978
551
  display: flex;
979
- flex-direction: column;
552
+ align-items: center;
980
553
  gap: 5px;
981
- padding: 20px 10px 10px 10px;
982
- margin-bottom: 15px;
983
- min-height: calc(var(--semanticFormsFontSize) + 20px);
554
+ z-index: 2;
555
+ user-select: auto;
556
+ color: var(--semanticFormsTextColor);
557
+ font-size: var(--semanticFormsInputFontSize);
558
+ position: absolute;
559
+ transform-origin: left center;
560
+ transform: translateY(-100%) scale(0.7);
561
+ top: var(--semanticFormsInputTopMargin);
562
+ left: 10px;
563
+ white-space: nowrap;
564
+ overflow: hidden;
565
+ text-overflow: ellipsis;
566
+ min-width: 0;
567
+ width: 100%;
984
568
  }
985
- form.semanticForms details::details-content,
986
- form.semanticForms.light details::details-content,
987
- table.semanticForms details::details-content,
988
- table.semanticForms.light details::details-content {
989
- visibility: hidden;
990
- opacity: 0;
991
- transition: opacity 250ms ease-in, visibility 0ms ease-in 250ms;
569
+ .semanticForms .floatLabelForm div dt label span.help {
570
+ display: grid;
571
+ place-items: center;
572
+ cursor: help;
573
+ pointer-events: auto;
992
574
  }
993
- @supports (interpolate-size: allow-keywords) {
994
- form.semanticForms details,
995
- form.semanticForms.light details,
996
- table.semanticForms details,
997
- table.semanticForms.light details {
998
- transition: opacity 250ms ease-in, visibility 0ms ease-in 250ms, height 250ms;
999
- }
1000
- form.semanticForms details::details-content,
1001
- form.semanticForms.light details::details-content,
1002
- table.semanticForms details::details-content,
1003
- table.semanticForms.light details::details-content {
1004
- height: 0;
1005
- overflow: hidden;
1006
- transition: height 250ms, content-visibility 250ms;
1007
- transition-behavior: allow-discrete;
1008
- }
1009
- }
1010
- form.semanticForms details summary,
1011
- form.semanticForms.light details summary,
1012
- table.semanticForms details summary,
1013
- table.semanticForms.light details summary {
1014
- cursor: pointer;
1015
- margin: 0;
1016
- line-height: 1;
1017
- position: absolute;
1018
- top: 10px;
1019
- left: 22px;
1020
- transition: top 250ms;
1021
- }
1022
- form.semanticForms details summary::-webkit-details-marker, form.semanticForms details summary::marker,
1023
- form.semanticForms.light details summary::-webkit-details-marker,
1024
- form.semanticForms.light details summary::marker,
1025
- table.semanticForms details summary::-webkit-details-marker,
1026
- table.semanticForms details summary::marker,
1027
- table.semanticForms.light details summary::-webkit-details-marker,
1028
- table.semanticForms.light details summary::marker {
1029
- content: "";
1030
- }
1031
- form.semanticForms details summary::before,
1032
- form.semanticForms.light details summary::before,
1033
- table.semanticForms details summary::before,
1034
- table.semanticForms.light details summary::before {
1035
- content: "";
1036
- border-width: 0.4rem;
1037
- border-style: solid;
1038
- border-color: transparent transparent transparent var(--semanticFormsTextColor);
1039
- position: absolute;
1040
- top: 0;
1041
- left: -10px;
1042
- transform: rotate(0);
1043
- transform-origin: 0.2rem 50%;
1044
- transition: 250ms transform ease;
1045
- }
1046
- form.semanticForms details[open]::details-content,
1047
- form.semanticForms.light details[open]::details-content,
1048
- table.semanticForms details[open]::details-content,
1049
- table.semanticForms.light details[open]::details-content {
1050
- visibility: visible;
1051
- opacity: 1;
1052
- transition: opacity 250ms ease-in, visibility 0ms ease-in 0ms;
1053
- }
1054
- @supports (interpolate-size: allow-keywords) {
1055
- form.semanticForms details[open]::details-content,
1056
- form.semanticForms.light details[open]::details-content,
1057
- table.semanticForms details[open]::details-content,
1058
- table.semanticForms.light details[open]::details-content {
1059
- height: auto;
1060
- }
1061
- }
1062
- form.semanticForms details[open] summary::before,
1063
- form.semanticForms.light details[open] summary::before,
1064
- table.semanticForms details[open] summary::before,
1065
- table.semanticForms.light details[open] summary::before {
1066
- transform: rotate(90deg);
1067
- }
1068
- form.semanticForms details[open] > dl:first-of-type,
1069
- form.semanticForms.light details[open] > dl:first-of-type,
1070
- table.semanticForms details[open] > dl:first-of-type,
1071
- table.semanticForms.light details[open] > dl:first-of-type {
1072
- margin-top: 15px;
1073
- }
1074
- form.semanticForms details[open], form.semanticForms summary,
1075
- form.semanticForms.light details[open],
1076
- form.semanticForms.light summary,
1077
- table.semanticForms details[open],
1078
- table.semanticForms summary,
1079
- table.semanticForms.light details[open],
1080
- table.semanticForms.light summary {
1081
- margin-bottom: 10px;
1082
- }
1083
- @supports (scrollbar-color: auto) {
1084
- form.semanticForms textarea,
1085
- form.semanticForms.light textarea,
1086
- table.semanticForms textarea,
1087
- table.semanticForms.light textarea {
1088
- scrollbar-color: var(--semanticFormsScrollbarColor) transparent;
1089
- }
1090
- form.semanticForms textarea::-webkit-resizer,
1091
- form.semanticForms.light textarea::-webkit-resizer,
1092
- table.semanticForms textarea::-webkit-resizer,
1093
- table.semanticForms.light textarea::-webkit-resizer {
1094
- border: none;
1095
- background-image: var(--semanticFormsCustomResizer);
1096
- background-size: 14px;
1097
- background-repeat: no-repeat;
1098
- background-position: 100%;
1099
- margin: 0 2px 2px 0;
1100
- }
1101
- form.semanticForms select[multiple],
1102
- form.semanticForms.light select[multiple],
1103
- table.semanticForms select[multiple],
1104
- table.semanticForms.light select[multiple] {
1105
- scrollbar-color: var(--semanticFormsScrollbarColor) transparent;
1106
- }
1107
- }
1108
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea),
1109
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea),
1110
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea),
1111
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) {
1112
- display: grid;
1113
- grid-template-columns: repeat(auto-fit, minmax(var(--semanticFormsInputMinWidth), 1fr));
1114
- gap: 10px;
1115
- margin-bottom: 10px;
1116
- }
1117
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd,
1118
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd,
1119
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd,
1120
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd {
1121
- position: relative;
1122
- display: flex;
1123
- flex-direction: column;
1124
- gap: 10px;
1125
- max-width: 100%;
1126
- }
1127
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox, form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio,
1128
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox,
1129
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio,
1130
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox,
1131
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio,
1132
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox,
1133
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio {
1134
- display: grid;
1135
- grid-template-columns: 15px 1fr;
1136
- align-items: center;
1137
- padding-left: 11px;
1138
- }
1139
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox > :not(input[type=checkbox], input[type=radio], label), form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio > :not(input[type=checkbox], input[type=radio], label),
1140
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox > :not(input[type=checkbox], input[type=radio], label),
1141
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio > :not(input[type=checkbox], input[type=radio], label),
1142
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox > :not(input[type=checkbox], input[type=radio], label),
1143
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio > :not(input[type=checkbox], input[type=radio], label),
1144
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox > :not(input[type=checkbox], input[type=radio], label),
1145
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio > :not(input[type=checkbox], input[type=radio], label) {
1146
- grid-column: 1/-1;
1147
- }
1148
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox label:nth-of-type(2), form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio label:nth-of-type(2),
1149
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox label:nth-of-type(2),
1150
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio label:nth-of-type(2),
1151
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox label:nth-of-type(2),
1152
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio label:nth-of-type(2),
1153
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleCheckbox label:nth-of-type(2),
1154
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio label:nth-of-type(2) {
1155
- grid-column: 1/-1;
1156
- padding: 0 10px;
1157
- font-size: small;
1158
- color: var(--semanticFormsTextColor);
1159
- }
1160
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio > input,
1161
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio > input,
1162
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio > input,
1163
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.singleRadio > input {
1164
- margin: 0;
1165
- }
1166
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes ul, form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios ul,
1167
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes ul,
1168
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios ul,
1169
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes ul,
1170
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios ul,
1171
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes ul,
1172
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios ul {
1173
- display: flex;
1174
- flex-direction: column;
1175
- margin-top: var(--semanticFormsInputTopMargin);
1176
- padding-left: 10px;
1177
- gap: 5px;
1178
- }
1179
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes ul li, form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios ul li,
1180
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes ul li,
1181
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios ul li,
1182
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes ul li,
1183
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios ul li,
1184
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes ul li,
1185
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios ul li {
1186
- display: flex;
1187
- align-items: center;
1188
- gap: 5px;
1189
- }
1190
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes > label, form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios > label,
1191
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes > label,
1192
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios > label,
1193
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes > label,
1194
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios > label,
1195
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.checkboxes > label,
1196
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd.radios > label {
1197
- padding-left: 20px;
1198
- font-size: small;
1199
- color: var(--semanticFormsTextColor);
1200
- }
1201
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)),
1202
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)),
1203
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)),
1204
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) {
1205
- display: grid;
1206
- grid-template-columns: 2fr 1fr;
1207
- }
1208
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button.clear, form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button.show,
1209
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button.clear,
1210
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button.show,
1211
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button.clear,
1212
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button.show,
1213
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button.clear,
1214
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button.show {
1215
- right: 36%;
1216
- }
1217
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input:not([type=submit]), form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) select, form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) textarea,
1218
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input:not([type=submit]),
1219
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) select,
1220
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) textarea,
1221
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input:not([type=submit]),
1222
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) select,
1223
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) textarea,
1224
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input:not([type=submit]),
1225
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) select,
1226
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) textarea {
1227
- grid-row: 1/2;
1228
- grid-column: 1/2;
1229
- }
1230
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button:not(.clear, .show),
1231
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input[type=submit]:not(.clear, .show),
1232
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input[type=button]:not(.clear, .show),
1233
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button:not(.clear, .show),
1234
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input[type=submit]:not(.clear, .show),
1235
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input[type=button]:not(.clear, .show),
1236
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button:not(.clear, .show),
1237
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input[type=submit]:not(.clear, .show),
1238
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input[type=button]:not(.clear, .show),
1239
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) button:not(.clear, .show),
1240
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input[type=submit]:not(.clear, .show),
1241
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) input[type=button]:not(.clear, .show) {
1242
- grid-row: 1/2;
1243
- grid-column: 2/3;
575
+ .semanticForms .floatLabelForm div:has(dd input:required) dt label {
1244
576
  width: 100%;
1245
- max-width: 100%;
1246
- padding: 10px;
1247
- height: var(--semanticFormsInputHeight);
1248
- text-overflow: ellipsis;
1249
- white-space: nowrap;
1250
- overflow: hidden;
1251
- display: inline-block;
1252
- }
1253
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) label:nth-of-type(2),
1254
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) label:not(.floatLabelFormAnimatedLabel),
1255
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) label:nth-of-type(2),
1256
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) label:not(.floatLabelFormAnimatedLabel),
1257
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) label:nth-of-type(2),
1258
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) label:not(.floatLabelFormAnimatedLabel),
1259
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) label:nth-of-type(2),
1260
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(button:not(.clear, .show), input[type=submit]:not(.clear, .show)) label:not(.floatLabelFormAnimatedLabel) {
1261
- grid-row: 2/3;
1262
- grid-column: 1/-1;
1263
- }
1264
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) label:first-of-type,
1265
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) label:first-of-type,
1266
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) label:first-of-type,
1267
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) label:first-of-type {
1268
- width: calc(100% - 95px);
1269
- }
1270
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) span.focus-key,
1271
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) span.focus-key,
1272
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) span.focus-key,
1273
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) span.focus-key {
1274
- display: block;
1275
- }
1276
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) span.focus-key kbd,
1277
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) span.focus-key kbd,
1278
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) span.focus-key kbd,
1279
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key) span.focus-key kbd {
1280
- font-family: sans-serif;
1281
- }
1282
- form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key):has(input:focus, select:focus, textarea:focus) span.focus-key, form.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key):not(:has(input:placeholder-shown, textarea:placeholder-shown)) span.focus-key,
1283
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key):has(input:focus, select:focus, textarea:focus) span.focus-key,
1284
- form.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key):not(:has(input:placeholder-shown, textarea:placeholder-shown)) span.focus-key,
1285
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key):has(input:focus, select:focus, textarea:focus) span.focus-key,
1286
- table.semanticForms dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key):not(:has(input:placeholder-shown, textarea:placeholder-shown)) span.focus-key,
1287
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key):has(input:focus, select:focus, textarea:focus) span.focus-key,
1288
- table.semanticForms.light dl:has(dt > label, dd > input, dd > select, dd > textarea) dd:has(span.focus-key):not(:has(input:placeholder-shown, textarea:placeholder-shown)) span.focus-key {
1289
- display: none;
1290
- }
1291
- form.semanticForms p:has(input:not([type=checkbox], [type=radio]), textarea, label),
1292
- form.semanticForms.light p:has(input:not([type=checkbox], [type=radio]), textarea, label),
1293
- table.semanticForms p:has(input:not([type=checkbox], [type=radio]), textarea, label),
1294
- table.semanticForms.light p:has(input:not([type=checkbox], [type=radio]), textarea, label) {
1295
- display: flex;
1296
- flex-direction: column;
1297
- gap: 5px;
1298
- }
1299
- form.semanticForms p:has(input[type=checkbox], input[type=radio]),
1300
- form.semanticForms.light p:has(input[type=checkbox], input[type=radio]),
1301
- table.semanticForms p:has(input[type=checkbox], input[type=radio]),
1302
- table.semanticForms.light p:has(input[type=checkbox], input[type=radio]) {
1303
- display: flex;
1304
- flex-direction: row;
1305
- align-items: center;
1306
- gap: 5px;
1307
- }
1308
- form.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea),
1309
- form.semanticForms ul:has(li > input, li > label, li > button, li > select, li > textarea),
1310
- form.semanticForms.light menu:has(li > input, li > label, li > button, li > select, li > textarea),
1311
- form.semanticForms.light ul:has(li > input, li > label, li > button, li > select, li > textarea),
1312
- table.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea),
1313
- table.semanticForms ul:has(li > input, li > label, li > button, li > select, li > textarea),
1314
- table.semanticForms.light menu:has(li > input, li > label, li > button, li > select, li > textarea),
1315
- table.semanticForms.light ul:has(li > input, li > label, li > button, li > select, li > textarea) {
1316
- display: flex;
1317
- justify-content: space-between;
1318
- flex-wrap: wrap;
1319
- gap: 10px;
1320
- list-style-type: none;
1321
- }
1322
- form.semanticForms input[type=checkbox] + label:first-of-type,
1323
- form.semanticForms input[type=radio] + label:first-of-type,
1324
- form.semanticForms.light input[type=checkbox] + label:first-of-type,
1325
- form.semanticForms.light input[type=radio] + label:first-of-type,
1326
- table.semanticForms input[type=checkbox] + label:first-of-type,
1327
- table.semanticForms input[type=radio] + label:first-of-type,
1328
- table.semanticForms.light input[type=checkbox] + label:first-of-type,
1329
- table.semanticForms.light input[type=radio] + label:first-of-type {
1330
- padding-top: 2px;
1331
- font-size: var(--semanticFormsInputFontSize);
1332
- cursor: pointer;
1333
- display: flex;
1334
- align-items: center;
1335
- gap: 5px;
577
+ padding-right: 10px;
1336
578
  }
1337
- form.semanticForms input[type=checkbox] + label:first-of-type span.required,
1338
- form.semanticForms input[type=radio] + label:first-of-type span.required,
1339
- form.semanticForms.light input[type=checkbox] + label:first-of-type span.required,
1340
- form.semanticForms.light input[type=radio] + label:first-of-type span.required,
1341
- table.semanticForms input[type=checkbox] + label:first-of-type span.required,
1342
- table.semanticForms input[type=radio] + label:first-of-type span.required,
1343
- table.semanticForms.light input[type=checkbox] + label:first-of-type span.required,
1344
- table.semanticForms.light input[type=radio] + label:first-of-type span.required {
579
+ .semanticForms .floatLabelForm div:has(dd input:required) dt label > span {
580
+ margin-left: 5px;
1345
581
  cursor: help;
1346
582
  pointer-events: auto;
1347
583
  color: red;
1348
584
  }
1349
- form.semanticForms input[type=checkbox] + label:first-of-type span.help,
1350
- form.semanticForms input[type=radio] + label:first-of-type span.help,
1351
- form.semanticForms.light input[type=checkbox] + label:first-of-type span.help,
1352
- form.semanticForms.light input[type=radio] + label:first-of-type span.help,
1353
- table.semanticForms input[type=checkbox] + label:first-of-type span.help,
1354
- table.semanticForms input[type=radio] + label:first-of-type span.help,
1355
- table.semanticForms.light input[type=checkbox] + label:first-of-type span.help,
1356
- table.semanticForms.light input[type=radio] + label:first-of-type span.help {
1357
- display: grid;
1358
- place-items: center;
1359
- cursor: help;
1360
- pointer-events: auto;
1361
- }
1362
- form.semanticForms input[type=checkbox] + label:first-of-type span.help svg,
1363
- form.semanticForms input[type=radio] + label:first-of-type span.help svg,
1364
- form.semanticForms.light input[type=checkbox] + label:first-of-type span.help svg,
1365
- form.semanticForms.light input[type=radio] + label:first-of-type span.help svg,
1366
- table.semanticForms input[type=checkbox] + label:first-of-type span.help svg,
1367
- table.semanticForms input[type=radio] + label:first-of-type span.help svg,
1368
- table.semanticForms.light input[type=checkbox] + label:first-of-type span.help svg,
1369
- table.semanticForms.light input[type=radio] + label:first-of-type span.help svg {
1370
- width: 80%;
1371
- }
1372
- form.semanticForms .floatLabelForm,
1373
- form.semanticForms.light .floatLabelForm,
1374
- table.semanticForms .floatLabelForm,
1375
- table.semanticForms.light .floatLabelForm {
1376
- grid-template-columns: repeat(auto-fit, minmax(var(--semanticFormsInputMinWidth), 1fr));
1377
- }
1378
- form.semanticForms .floatLabelForm div,
1379
- form.semanticForms.light .floatLabelForm div,
1380
- table.semanticForms .floatLabelForm div,
1381
- table.semanticForms.light .floatLabelForm div {
1382
- position: relative;
1383
- width: 100%;
1384
- min-width: var(--semanticFormsInputMinWidth);
1385
- max-width: 100%;
1386
- max-width: 365px;
1387
- }
1388
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type, form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1389
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1390
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1391
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1392
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1393
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1394
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1395
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1396
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1397
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1398
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1399
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1400
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1401
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1402
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1403
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1404
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1405
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1406
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1407
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1408
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1409
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
1410
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type {
585
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=button], [type=image]):focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type, .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=button], [type=image]):not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
586
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
587
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
588
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:not([type=checkbox], [type=radio], .no-float-label) ~ label:first-of-type,
589
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown):not(.no-float-label):not([type=checkbox]):not([type=radio]) ~ label:first-of-type {
1411
590
  color: var(--semanticFormsTextColor);
1412
591
  transform: translateY(-150%) scale(0.7);
1413
592
  width: 100%;
1414
593
  }
1415
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):focus.no-float-label ~ label:first-of-type, form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1416
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus.no-float-label ~ label:first-of-type,
1417
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1418
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus.no-float-label ~ label:first-of-type,
1419
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1420
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):focus.no-float-label ~ label:first-of-type,
1421
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1422
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus.no-float-label ~ label:first-of-type,
1423
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1424
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus.no-float-label ~ label:first-of-type,
1425
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1426
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):focus.no-float-label ~ label:first-of-type,
1427
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1428
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus.no-float-label ~ label:first-of-type,
1429
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1430
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus.no-float-label ~ label:first-of-type,
1431
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1432
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):focus.no-float-label ~ label:first-of-type,
1433
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=image]):not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1434
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus.no-float-label ~ label:first-of-type,
1435
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
1436
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus.no-float-label ~ label:first-of-type,
1437
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type {
594
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=button], [type=image]):focus.no-float-label ~ label:first-of-type, .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:not([type=submit], [type=reset], [type=button], [type=image]):not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
595
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:focus.no-float-label ~ label:first-of-type,
596
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type,
597
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus.no-float-label ~ label:first-of-type,
598
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:not(:placeholder-shown).no-float-label:not([type=checkbox]):not([type=radio]) ~ label:first-of-type {
1438
599
  display: none;
1439
600
  }
1440
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select ~ label:first-of-type,
1441
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select ~ label:first-of-type,
1442
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select ~ label:first-of-type,
1443
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select ~ label:first-of-type {
601
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select ~ label:first-of-type {
1444
602
  color: var(--semanticFormsTextColor);
1445
603
  }
1446
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) button:not(.clear, .show),
1447
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input[type=submit]:not(.clear, .show),
1448
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) button:not(.clear, .show),
1449
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input[type=submit]:not(.clear, .show),
1450
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) button:not(.clear, .show),
1451
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input[type=submit]:not(.clear, .show),
1452
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) button:not(.clear, .show),
1453
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input[type=submit]:not(.clear, .show) {
604
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) button:not(.clear, .show),
605
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input[type=submit]:not(.clear, .show) {
1454
606
  margin-top: var(--semanticFormsInputTopMargin);
1455
607
  }
1456
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type,
1457
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type,
1458
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type,
1459
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type {
608
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type {
1460
609
  position: absolute;
1461
610
  top: calc(var(--semanticFormsInputTopMargin) + 10px);
1462
611
  left: 20px;
@@ -1479,1363 +628,295 @@ table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRad
1479
628
  color: var(--semanticFormsPlaceholderColor);
1480
629
  touch-action: manipulation;
1481
630
  }
1482
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.required,
1483
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.required,
1484
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.required,
1485
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.required {
631
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.required {
1486
632
  cursor: help;
1487
633
  pointer-events: auto;
1488
634
  color: red;
1489
635
  }
1490
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help,
1491
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help,
1492
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help,
1493
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help {
636
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help {
1494
637
  display: grid;
1495
638
  place-items: center;
1496
639
  cursor: help;
1497
640
  pointer-events: auto;
1498
641
  }
1499
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help svg,
1500
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help svg,
1501
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help svg,
1502
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help svg {
642
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:first-of-type span.help svg {
1503
643
  width: 80%;
1504
644
  }
1505
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:nth-of-type(2),
1506
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:nth-of-type(2),
1507
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:nth-of-type(2),
1508
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:nth-of-type(2) {
645
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(span.focus-key) label:first-of-type {
646
+ width: calc(100% - 95px);
647
+ }
648
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(span.focus-key) span.focus-key {
649
+ display: block;
650
+ }
651
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(span.focus-key) span.focus-key kbd {
652
+ font-family: sans-serif;
653
+ }
654
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(span.focus-key):has(input:focus, select:focus, textarea:focus) span.focus-key, .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(span.focus-key):not(:has(input:placeholder-shown, textarea:placeholder-shown)) span.focus-key {
655
+ display: none;
656
+ }
657
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) label:nth-of-type(2) {
1509
658
  margin-top: -5px;
1510
659
  padding: 0 10px;
1511
660
  font-size: small;
1512
661
  color: var(--semanticFormsTextColor);
1513
662
  }
1514
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
1515
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea,
1516
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select,
1517
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
1518
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea,
1519
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select,
1520
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
1521
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea,
1522
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select,
1523
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
1524
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea,
1525
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select {
663
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
664
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea,
665
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) select {
1526
666
  margin-top: var(--semanticFormsInputTopMargin);
1527
667
  }
1528
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
1529
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea,
1530
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
1531
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea,
1532
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
1533
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea,
1534
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
1535
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea {
668
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input,
669
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea {
1536
670
  transition: opacity 250ms;
1537
671
  }
1538
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::placeholder,
1539
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::placeholder,
1540
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::placeholder,
1541
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::placeholder,
1542
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::placeholder,
1543
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::placeholder,
1544
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::placeholder,
1545
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::placeholder {
672
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::placeholder,
673
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::placeholder {
1546
674
  opacity: 0;
1547
675
  transition: opacity 250ms;
1548
676
  }
1549
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-moz-placeholder,
1550
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-moz-placeholder,
1551
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-moz-placeholder,
1552
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-moz-placeholder,
1553
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-moz-placeholder,
1554
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-moz-placeholder,
1555
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-moz-placeholder,
1556
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-moz-placeholder {
677
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-moz-placeholder,
678
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-moz-placeholder {
1557
679
  opacity: 0;
1558
680
  transition: opacity 250ms;
1559
681
  }
1560
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-webkit-input-placeholder,
1561
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-webkit-input-placeholder,
1562
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-webkit-input-placeholder,
1563
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-webkit-input-placeholder,
1564
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-webkit-input-placeholder,
1565
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-webkit-input-placeholder,
1566
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-webkit-input-placeholder,
1567
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-webkit-input-placeholder {
682
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input::-webkit-input-placeholder,
683
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea::-webkit-input-placeholder {
1568
684
  opacity: 0;
1569
685
  transition: opacity 250ms;
1570
686
  }
1571
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:-ms-input-placeholder,
1572
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:-ms-input-placeholder,
1573
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:-ms-input-placeholder,
1574
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:-ms-input-placeholder,
1575
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:-ms-input-placeholder,
1576
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:-ms-input-placeholder,
1577
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:-ms-input-placeholder,
1578
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:-ms-input-placeholder {
687
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:-ms-input-placeholder,
688
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:-ms-input-placeholder {
1579
689
  opacity: 0;
1580
690
  transition: opacity 250ms;
1581
691
  }
1582
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::placeholder,
1583
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::placeholder,
1584
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::placeholder,
1585
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::placeholder,
1586
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::placeholder,
1587
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::placeholder,
1588
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::placeholder,
1589
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::placeholder {
692
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::placeholder,
693
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::placeholder {
1590
694
  opacity: 1;
1591
695
  }
1592
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-moz-placeholder,
1593
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-moz-placeholder,
1594
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-moz-placeholder,
1595
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-moz-placeholder,
1596
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-moz-placeholder,
1597
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-moz-placeholder,
1598
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-moz-placeholder,
1599
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-moz-placeholder {
696
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-moz-placeholder,
697
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-moz-placeholder {
1600
698
  opacity: 1;
1601
699
  }
1602
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-webkit-input-placeholder,
1603
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-webkit-input-placeholder,
1604
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-webkit-input-placeholder,
1605
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-webkit-input-placeholder,
1606
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-webkit-input-placeholder,
1607
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-webkit-input-placeholder,
1608
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-webkit-input-placeholder,
1609
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-webkit-input-placeholder {
700
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus::-webkit-input-placeholder,
701
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus::-webkit-input-placeholder {
1610
702
  opacity: 1;
1611
703
  }
1612
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus:-ms-input-placeholder,
1613
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:-ms-input-placeholder,
1614
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus:-ms-input-placeholder,
1615
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:-ms-input-placeholder,
1616
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus:-ms-input-placeholder,
1617
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:-ms-input-placeholder,
1618
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus:-ms-input-placeholder,
1619
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:-ms-input-placeholder {
704
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) input:focus:-ms-input-placeholder,
705
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) textarea:focus:-ms-input-placeholder {
1620
706
  opacity: 1;
1621
707
  }
1622
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key,
1623
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key,
1624
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key,
1625
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key {
708
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key {
1626
709
  color: var(--semanticFormsPlaceholderColor);
1627
710
  position: absolute;
1628
711
  top: calc(var(--semanticFormsInputTopMargin) + 11px);
1629
712
  right: 20px;
1630
713
  }
1631
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key kbd,
1632
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key kbd,
1633
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key kbd,
1634
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key kbd {
714
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios) span.focus-key kbd {
1635
715
  line-height: 1;
1636
716
  }
1637
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=number]) .focus-key,
1638
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=number]) .focus-key,
1639
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=number]) .focus-key,
1640
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=number]) .focus-key {
717
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=number]) .focus-key {
1641
718
  right: 45px;
1642
719
  }
1643
- form.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=search]) label:first-of-type,
1644
- form.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=search]) label:first-of-type,
1645
- table.semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=search]) label:first-of-type,
1646
- table.semanticForms.light .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=search]) label:first-of-type {
720
+ .semanticForms .floatLabelForm div dd:not(.singleCheckbox, .singleRadio, .checkboxes, .radios):has(input[type=search]) label:first-of-type {
1647
721
  left: 32px;
1648
722
  }
1649
- form.semanticForms .floatLabelForm div dt,
1650
- form.semanticForms.light .floatLabelForm div dt,
1651
- table.semanticForms .floatLabelForm div dt,
1652
- table.semanticForms.light .floatLabelForm div dt {
1653
- position: relative;
1654
- }
1655
- form.semanticForms .floatLabelForm div dt label,
1656
- form.semanticForms.light .floatLabelForm div dt label,
1657
- table.semanticForms .floatLabelForm div dt label,
1658
- table.semanticForms.light .floatLabelForm div dt label {
1659
- display: flex;
1660
- align-items: center;
1661
- gap: 5px;
1662
- z-index: 2;
1663
- user-select: auto;
1664
- color: var(--semanticFormsTextColor);
1665
- font-size: var(--semanticFormsInputFontSize);
1666
- position: absolute;
1667
- transform-origin: left center;
1668
- transform: translateY(-100%) scale(0.7);
1669
- top: var(--semanticFormsInputTopMargin);
1670
- left: 10px;
1671
- white-space: nowrap;
1672
- overflow: hidden;
1673
- text-overflow: ellipsis;
1674
- min-width: 0;
1675
- width: 100%;
1676
- }
1677
- form.semanticForms .floatLabelForm div dt label span.help,
1678
- form.semanticForms.light .floatLabelForm div dt label span.help,
1679
- table.semanticForms .floatLabelForm div dt label span.help,
1680
- table.semanticForms.light .floatLabelForm div dt label span.help {
1681
- display: grid;
1682
- place-items: center;
1683
- cursor: help;
1684
- pointer-events: auto;
1685
- }
1686
- form.semanticForms .floatLabelForm div:has(dd input:required) dt label,
1687
- form.semanticForms.light .floatLabelForm div:has(dd input:required) dt label,
1688
- table.semanticForms .floatLabelForm div:has(dd input:required) dt label,
1689
- table.semanticForms.light .floatLabelForm div:has(dd input:required) dt label {
1690
- width: 100%;
1691
- padding-right: 10px;
1692
- }
1693
- form.semanticForms .floatLabelForm div:has(dd input:required) dt label > span,
1694
- form.semanticForms.light .floatLabelForm div:has(dd input:required) dt label > span,
1695
- table.semanticForms .floatLabelForm div:has(dd input:required) dt label > span,
1696
- table.semanticForms.light .floatLabelForm div:has(dd input:required) dt label > span {
1697
- margin-left: 5px;
1698
- cursor: help;
1699
- pointer-events: auto;
1700
- color: red;
1701
- }
1702
- form.semanticForms .floatLabelForm div:has([data-max-content]),
1703
- form.semanticForms.light .floatLabelForm div:has([data-max-content]),
1704
- table.semanticForms .floatLabelForm div:has([data-max-content]),
1705
- table.semanticForms.light .floatLabelForm div:has([data-max-content]) {
723
+ .semanticForms .floatLabelForm div:has([data-max-content]) {
1706
724
  max-width: max-content;
1707
725
  min-width: 150px;
1708
726
  }
1709
- form.semanticForms .floatLabelForm div:has([data-max-content]) dd,
1710
- form.semanticForms.light .floatLabelForm div:has([data-max-content]) dd,
1711
- table.semanticForms .floatLabelForm div:has([data-max-content]) dd,
1712
- table.semanticForms.light .floatLabelForm div:has([data-max-content]) dd {
727
+ .semanticForms .floatLabelForm div:has([data-max-content]) dd {
1713
728
  width: max-content;
1714
729
  }
1715
- form.semanticForms .floatLabelForm div:has([data-max-content]) dd input, form.semanticForms .floatLabelForm div:has([data-max-content]) dd select,
1716
- form.semanticForms.light .floatLabelForm div:has([data-max-content]) dd input,
1717
- form.semanticForms.light .floatLabelForm div:has([data-max-content]) dd select,
1718
- table.semanticForms .floatLabelForm div:has([data-max-content]) dd input,
1719
- table.semanticForms .floatLabelForm div:has([data-max-content]) dd select,
1720
- table.semanticForms.light .floatLabelForm div:has([data-max-content]) dd input,
1721
- table.semanticForms.light .floatLabelForm div:has([data-max-content]) dd select {
730
+ .semanticForms .floatLabelForm div:has([data-max-content]) dd input, .semanticForms .floatLabelForm div:has([data-max-content]) dd select {
1722
731
  field-sizing: content;
1723
732
  min-width: 150px;
1724
733
  max-width: max-content;
1725
734
  }
1726
- form.semanticForms .floatLabelForm input::placeholder, form.semanticForms .floatLabelForm textarea::placeholder,
1727
- form.semanticForms.light .floatLabelForm input::placeholder,
1728
- form.semanticForms.light .floatLabelForm textarea::placeholder,
1729
- table.semanticForms .floatLabelForm input::placeholder,
1730
- table.semanticForms .floatLabelForm textarea::placeholder,
1731
- table.semanticForms.light .floatLabelForm input::placeholder,
1732
- table.semanticForms.light .floatLabelForm textarea::placeholder {
735
+ .semanticForms .floatLabelForm input::placeholder, .semanticForms .floatLabelForm textarea::placeholder {
1733
736
  color: var(--semanticFormsPlaceholderColor);
1734
737
  opacity: 1;
1735
738
  }
1736
- form.semanticForms div[class^=colspan-],
1737
- form.semanticForms.light div[class^=colspan-],
1738
- table.semanticForms div[class^=colspan-],
1739
- table.semanticForms.light div[class^=colspan-] {
1740
- max-width: 100%;
739
+
740
+ .semanticForms div[class^=colspan-] {
741
+ max-width: 100% !important;
1741
742
  }
1742
- form.semanticForms div.colspan-full,
1743
- form.semanticForms.light div.colspan-full,
1744
- table.semanticForms div.colspan-full,
1745
- table.semanticForms.light div.colspan-full {
743
+ .semanticForms div.colspan-full {
1746
744
  grid-column: 1/-1;
1747
745
  }
1748
- form.semanticForms div.colspan-5,
1749
- form.semanticForms.light div.colspan-5,
1750
- table.semanticForms div.colspan-5,
1751
- table.semanticForms.light div.colspan-5 {
746
+ .semanticForms div.colspan-5 {
1752
747
  grid-column: span 5;
1753
748
  }
1754
- form.semanticForms div.colspan-4,
1755
- form.semanticForms.light div.colspan-4,
1756
- table.semanticForms div.colspan-4,
1757
- table.semanticForms.light div.colspan-4 {
749
+ .semanticForms div.colspan-4 {
1758
750
  grid-column: span 4;
1759
751
  }
1760
- form.semanticForms div.colspan-3,
1761
- form.semanticForms.light div.colspan-3,
1762
- table.semanticForms div.colspan-3,
1763
- table.semanticForms.light div.colspan-3 {
752
+ .semanticForms div.colspan-3 {
1764
753
  grid-column: span 3;
1765
754
  }
1766
- form.semanticForms div.colspan-2,
1767
- form.semanticForms.light div.colspan-2,
1768
- table.semanticForms div.colspan-2,
1769
- table.semanticForms.light div.colspan-2 {
755
+ .semanticForms div.colspan-2 {
1770
756
  grid-column: span 2;
1771
757
  }
1772
- form.semanticForms div.colspan-1,
1773
- form.semanticForms.light div.colspan-1,
1774
- table.semanticForms div.colspan-1,
1775
- table.semanticForms.light div.colspan-1 {
758
+ .semanticForms div.colspan-1 {
1776
759
  grid-column: span 1;
1777
760
  }
1778
- form.semanticForms fieldset[class^=colspan-] dl div,
1779
- form.semanticForms dl[class^=colspan-] div,
1780
- form.semanticForms.light fieldset[class^=colspan-] dl div,
1781
- form.semanticForms.light dl[class^=colspan-] div,
1782
- table.semanticForms fieldset[class^=colspan-] dl div,
1783
- table.semanticForms dl[class^=colspan-] div,
1784
- table.semanticForms.light fieldset[class^=colspan-] dl div,
1785
- table.semanticForms.light dl[class^=colspan-] div {
1786
- max-width: 100%;
761
+ .semanticForms fieldset[class^=colspan-] dl div,
762
+ .semanticForms dl[class^=colspan-] div {
763
+ max-width: 100% !important;
1787
764
  }
1788
- form.semanticForms fieldset.colspan-full dl,
1789
- form.semanticForms dl.colspan-full,
1790
- form.semanticForms.light fieldset.colspan-full dl,
1791
- form.semanticForms.light dl.colspan-full,
1792
- table.semanticForms fieldset.colspan-full dl,
1793
- table.semanticForms dl.colspan-full,
1794
- table.semanticForms.light fieldset.colspan-full dl,
1795
- table.semanticForms.light dl.colspan-full {
765
+ .semanticForms fieldset.colspan-full dl,
766
+ .semanticForms dl.colspan-full {
1796
767
  grid-template-columns: repeat(auto-fit, minmax(var(--semanticFormsInputMinWidth), 1fr));
1797
768
  }
1798
- form.semanticForms fieldset.colspan-5 dl,
1799
- form.semanticForms dl.colspan-5,
1800
- form.semanticForms.light fieldset.colspan-5 dl,
1801
- form.semanticForms.light dl.colspan-5,
1802
- table.semanticForms fieldset.colspan-5 dl,
1803
- table.semanticForms dl.colspan-5,
1804
- table.semanticForms.light fieldset.colspan-5 dl,
1805
- table.semanticForms.light dl.colspan-5 {
769
+ .semanticForms fieldset.colspan-5 dl,
770
+ .semanticForms dl.colspan-5 {
1806
771
  grid-template-columns: repeat(5, minmax(var(--semanticFormsInputMinWidth), 1fr));
1807
772
  }
1808
- form.semanticForms fieldset.colspan-4 dl,
1809
- form.semanticForms dl.colspan-4,
1810
- form.semanticForms.light fieldset.colspan-4 dl,
1811
- form.semanticForms.light dl.colspan-4,
1812
- table.semanticForms fieldset.colspan-4 dl,
1813
- table.semanticForms dl.colspan-4,
1814
- table.semanticForms.light fieldset.colspan-4 dl,
1815
- table.semanticForms.light dl.colspan-4 {
773
+ .semanticForms fieldset.colspan-4 dl,
774
+ .semanticForms dl.colspan-4 {
1816
775
  grid-template-columns: repeat(4, minmax(var(--semanticFormsInputMinWidth), 1fr));
1817
776
  }
1818
- form.semanticForms fieldset.colspan-3 dl,
1819
- form.semanticForms dl.colspan-3,
1820
- form.semanticForms.light fieldset.colspan-3 dl,
1821
- form.semanticForms.light dl.colspan-3,
1822
- table.semanticForms fieldset.colspan-3 dl,
1823
- table.semanticForms dl.colspan-3,
1824
- table.semanticForms.light fieldset.colspan-3 dl,
1825
- table.semanticForms.light dl.colspan-3 {
777
+ .semanticForms fieldset.colspan-3 dl,
778
+ .semanticForms dl.colspan-3 {
1826
779
  grid-template-columns: repeat(3, minmax(var(--semanticFormsInputMinWidth), 1fr));
1827
780
  }
1828
- form.semanticForms fieldset.colspan-2 dl,
1829
- form.semanticForms dl.colspan-2,
1830
- form.semanticForms.light fieldset.colspan-2 dl,
1831
- form.semanticForms.light dl.colspan-2,
1832
- table.semanticForms fieldset.colspan-2 dl,
1833
- table.semanticForms dl.colspan-2,
1834
- table.semanticForms.light fieldset.colspan-2 dl,
1835
- table.semanticForms.light dl.colspan-2 {
781
+ .semanticForms fieldset.colspan-2 dl,
782
+ .semanticForms dl.colspan-2 {
1836
783
  grid-template-columns: repeat(2, minmax(var(--semanticFormsInputMinWidth), 1fr));
1837
784
  }
1838
- form.semanticForms fieldset.colspan-1 dl,
1839
- form.semanticForms dl.colspan-1,
1840
- form.semanticForms.light fieldset.colspan-1 dl,
1841
- form.semanticForms.light dl.colspan-1,
1842
- table.semanticForms fieldset.colspan-1 dl,
1843
- table.semanticForms dl.colspan-1,
1844
- table.semanticForms.light fieldset.colspan-1 dl,
1845
- table.semanticForms.light dl.colspan-1 {
785
+ .semanticForms fieldset.colspan-1 dl,
786
+ .semanticForms dl.colspan-1 {
1846
787
  grid-template-columns: repeat(1, minmax(var(--semanticFormsInputMinWidth), 1fr));
1847
788
  }
1848
- form.semanticForms fieldset.colspan-1 dl dt:nth-of-type(n + 1),
1849
- form.semanticForms fieldset.colspan-1 dl dd:nth-of-type(n + 1),
1850
- form.semanticForms dl.colspan-1 dt:nth-of-type(n + 1),
1851
- form.semanticForms dl.colspan-1 dd:nth-of-type(n + 1),
1852
- form.semanticForms.light fieldset.colspan-1 dl dt:nth-of-type(n + 1),
1853
- form.semanticForms.light fieldset.colspan-1 dl dd:nth-of-type(n + 1),
1854
- form.semanticForms.light dl.colspan-1 dt:nth-of-type(n + 1),
1855
- form.semanticForms.light dl.colspan-1 dd:nth-of-type(n + 1),
1856
- table.semanticForms fieldset.colspan-1 dl dt:nth-of-type(n + 1),
1857
- table.semanticForms fieldset.colspan-1 dl dd:nth-of-type(n + 1),
1858
- table.semanticForms dl.colspan-1 dt:nth-of-type(n + 1),
1859
- table.semanticForms dl.colspan-1 dd:nth-of-type(n + 1),
1860
- table.semanticForms.light fieldset.colspan-1 dl dt:nth-of-type(n + 1),
1861
- table.semanticForms.light fieldset.colspan-1 dl dd:nth-of-type(n + 1),
1862
- table.semanticForms.light dl.colspan-1 dt:nth-of-type(n + 1),
1863
- table.semanticForms.light dl.colspan-1 dd:nth-of-type(n + 1) {
789
+ .semanticForms fieldset.colspan-1 dl dt:nth-of-type(n + 1),
790
+ .semanticForms fieldset.colspan-1 dl dd:nth-of-type(n + 1),
791
+ .semanticForms dl.colspan-1 dt:nth-of-type(n + 1),
792
+ .semanticForms dl.colspan-1 dd:nth-of-type(n + 1) {
1864
793
  grid-column: 1;
1865
794
  }
1866
- form.semanticForms fieldset.colspan-2 dl dt:nth-of-type(2n + 1),
1867
- form.semanticForms fieldset.colspan-2 dl dd:nth-of-type(2n + 1),
1868
- form.semanticForms dl.colspan-2 dt:nth-of-type(2n + 1),
1869
- form.semanticForms dl.colspan-2 dd:nth-of-type(2n + 1),
1870
- form.semanticForms.light fieldset.colspan-2 dl dt:nth-of-type(2n + 1),
1871
- form.semanticForms.light fieldset.colspan-2 dl dd:nth-of-type(2n + 1),
1872
- form.semanticForms.light dl.colspan-2 dt:nth-of-type(2n + 1),
1873
- form.semanticForms.light dl.colspan-2 dd:nth-of-type(2n + 1),
1874
- table.semanticForms fieldset.colspan-2 dl dt:nth-of-type(2n + 1),
1875
- table.semanticForms fieldset.colspan-2 dl dd:nth-of-type(2n + 1),
1876
- table.semanticForms dl.colspan-2 dt:nth-of-type(2n + 1),
1877
- table.semanticForms dl.colspan-2 dd:nth-of-type(2n + 1),
1878
- table.semanticForms.light fieldset.colspan-2 dl dt:nth-of-type(2n + 1),
1879
- table.semanticForms.light fieldset.colspan-2 dl dd:nth-of-type(2n + 1),
1880
- table.semanticForms.light dl.colspan-2 dt:nth-of-type(2n + 1),
1881
- table.semanticForms.light dl.colspan-2 dd:nth-of-type(2n + 1) {
795
+ .semanticForms fieldset.colspan-2 dl dt:nth-of-type(2n + 1),
796
+ .semanticForms fieldset.colspan-2 dl dd:nth-of-type(2n + 1),
797
+ .semanticForms dl.colspan-2 dt:nth-of-type(2n + 1),
798
+ .semanticForms dl.colspan-2 dd:nth-of-type(2n + 1) {
1882
799
  grid-column: 1;
1883
800
  }
1884
- form.semanticForms fieldset.colspan-2 dl dt:nth-of-type(2n + 2),
1885
- form.semanticForms fieldset.colspan-2 dl dd:nth-of-type(2n + 2),
1886
- form.semanticForms dl.colspan-2 dt:nth-of-type(2n + 2),
1887
- form.semanticForms dl.colspan-2 dd:nth-of-type(2n + 2),
1888
- form.semanticForms.light fieldset.colspan-2 dl dt:nth-of-type(2n + 2),
1889
- form.semanticForms.light fieldset.colspan-2 dl dd:nth-of-type(2n + 2),
1890
- form.semanticForms.light dl.colspan-2 dt:nth-of-type(2n + 2),
1891
- form.semanticForms.light dl.colspan-2 dd:nth-of-type(2n + 2),
1892
- table.semanticForms fieldset.colspan-2 dl dt:nth-of-type(2n + 2),
1893
- table.semanticForms fieldset.colspan-2 dl dd:nth-of-type(2n + 2),
1894
- table.semanticForms dl.colspan-2 dt:nth-of-type(2n + 2),
1895
- table.semanticForms dl.colspan-2 dd:nth-of-type(2n + 2),
1896
- table.semanticForms.light fieldset.colspan-2 dl dt:nth-of-type(2n + 2),
1897
- table.semanticForms.light fieldset.colspan-2 dl dd:nth-of-type(2n + 2),
1898
- table.semanticForms.light dl.colspan-2 dt:nth-of-type(2n + 2),
1899
- table.semanticForms.light dl.colspan-2 dd:nth-of-type(2n + 2) {
801
+ .semanticForms fieldset.colspan-2 dl dt:nth-of-type(2n + 2),
802
+ .semanticForms fieldset.colspan-2 dl dd:nth-of-type(2n + 2),
803
+ .semanticForms dl.colspan-2 dt:nth-of-type(2n + 2),
804
+ .semanticForms dl.colspan-2 dd:nth-of-type(2n + 2) {
1900
805
  grid-column: 2;
1901
806
  }
1902
- form.semanticForms fieldset.colspan-3 dl dt:nth-of-type(3n + 1),
1903
- form.semanticForms fieldset.colspan-3 dl dd:nth-of-type(3n + 1),
1904
- form.semanticForms dl.colspan-3 dt:nth-of-type(3n + 1),
1905
- form.semanticForms dl.colspan-3 dd:nth-of-type(3n + 1),
1906
- form.semanticForms.light fieldset.colspan-3 dl dt:nth-of-type(3n + 1),
1907
- form.semanticForms.light fieldset.colspan-3 dl dd:nth-of-type(3n + 1),
1908
- form.semanticForms.light dl.colspan-3 dt:nth-of-type(3n + 1),
1909
- form.semanticForms.light dl.colspan-3 dd:nth-of-type(3n + 1),
1910
- table.semanticForms fieldset.colspan-3 dl dt:nth-of-type(3n + 1),
1911
- table.semanticForms fieldset.colspan-3 dl dd:nth-of-type(3n + 1),
1912
- table.semanticForms dl.colspan-3 dt:nth-of-type(3n + 1),
1913
- table.semanticForms dl.colspan-3 dd:nth-of-type(3n + 1),
1914
- table.semanticForms.light fieldset.colspan-3 dl dt:nth-of-type(3n + 1),
1915
- table.semanticForms.light fieldset.colspan-3 dl dd:nth-of-type(3n + 1),
1916
- table.semanticForms.light dl.colspan-3 dt:nth-of-type(3n + 1),
1917
- table.semanticForms.light dl.colspan-3 dd:nth-of-type(3n + 1) {
807
+ .semanticForms fieldset.colspan-3 dl dt:nth-of-type(3n + 1),
808
+ .semanticForms fieldset.colspan-3 dl dd:nth-of-type(3n + 1),
809
+ .semanticForms dl.colspan-3 dt:nth-of-type(3n + 1),
810
+ .semanticForms dl.colspan-3 dd:nth-of-type(3n + 1) {
1918
811
  grid-column: 1;
1919
812
  }
1920
- form.semanticForms fieldset.colspan-3 dl dt:nth-of-type(3n + 2),
1921
- form.semanticForms fieldset.colspan-3 dl dd:nth-of-type(3n + 2),
1922
- form.semanticForms dl.colspan-3 dt:nth-of-type(3n + 2),
1923
- form.semanticForms dl.colspan-3 dd:nth-of-type(3n + 2),
1924
- form.semanticForms.light fieldset.colspan-3 dl dt:nth-of-type(3n + 2),
1925
- form.semanticForms.light fieldset.colspan-3 dl dd:nth-of-type(3n + 2),
1926
- form.semanticForms.light dl.colspan-3 dt:nth-of-type(3n + 2),
1927
- form.semanticForms.light dl.colspan-3 dd:nth-of-type(3n + 2),
1928
- table.semanticForms fieldset.colspan-3 dl dt:nth-of-type(3n + 2),
1929
- table.semanticForms fieldset.colspan-3 dl dd:nth-of-type(3n + 2),
1930
- table.semanticForms dl.colspan-3 dt:nth-of-type(3n + 2),
1931
- table.semanticForms dl.colspan-3 dd:nth-of-type(3n + 2),
1932
- table.semanticForms.light fieldset.colspan-3 dl dt:nth-of-type(3n + 2),
1933
- table.semanticForms.light fieldset.colspan-3 dl dd:nth-of-type(3n + 2),
1934
- table.semanticForms.light dl.colspan-3 dt:nth-of-type(3n + 2),
1935
- table.semanticForms.light dl.colspan-3 dd:nth-of-type(3n + 2) {
813
+ .semanticForms fieldset.colspan-3 dl dt:nth-of-type(3n + 2),
814
+ .semanticForms fieldset.colspan-3 dl dd:nth-of-type(3n + 2),
815
+ .semanticForms dl.colspan-3 dt:nth-of-type(3n + 2),
816
+ .semanticForms dl.colspan-3 dd:nth-of-type(3n + 2) {
1936
817
  grid-column: 2;
1937
818
  }
1938
- form.semanticForms fieldset.colspan-3 dl dt:nth-of-type(3n + 3),
1939
- form.semanticForms fieldset.colspan-3 dl dd:nth-of-type(3n + 3),
1940
- form.semanticForms dl.colspan-3 dt:nth-of-type(3n + 3),
1941
- form.semanticForms dl.colspan-3 dd:nth-of-type(3n + 3),
1942
- form.semanticForms.light fieldset.colspan-3 dl dt:nth-of-type(3n + 3),
1943
- form.semanticForms.light fieldset.colspan-3 dl dd:nth-of-type(3n + 3),
1944
- form.semanticForms.light dl.colspan-3 dt:nth-of-type(3n + 3),
1945
- form.semanticForms.light dl.colspan-3 dd:nth-of-type(3n + 3),
1946
- table.semanticForms fieldset.colspan-3 dl dt:nth-of-type(3n + 3),
1947
- table.semanticForms fieldset.colspan-3 dl dd:nth-of-type(3n + 3),
1948
- table.semanticForms dl.colspan-3 dt:nth-of-type(3n + 3),
1949
- table.semanticForms dl.colspan-3 dd:nth-of-type(3n + 3),
1950
- table.semanticForms.light fieldset.colspan-3 dl dt:nth-of-type(3n + 3),
1951
- table.semanticForms.light fieldset.colspan-3 dl dd:nth-of-type(3n + 3),
1952
- table.semanticForms.light dl.colspan-3 dt:nth-of-type(3n + 3),
1953
- table.semanticForms.light dl.colspan-3 dd:nth-of-type(3n + 3) {
819
+ .semanticForms fieldset.colspan-3 dl dt:nth-of-type(3n + 3),
820
+ .semanticForms fieldset.colspan-3 dl dd:nth-of-type(3n + 3),
821
+ .semanticForms dl.colspan-3 dt:nth-of-type(3n + 3),
822
+ .semanticForms dl.colspan-3 dd:nth-of-type(3n + 3) {
1954
823
  grid-column: 3;
1955
824
  }
1956
- form.semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 1),
1957
- form.semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 1),
1958
- form.semanticForms dl.colspan-4 dt:nth-of-type(4n + 1),
1959
- form.semanticForms dl.colspan-4 dd:nth-of-type(4n + 1),
1960
- form.semanticForms.light fieldset.colspan-4 dl dt:nth-of-type(4n + 1),
1961
- form.semanticForms.light fieldset.colspan-4 dl dd:nth-of-type(4n + 1),
1962
- form.semanticForms.light dl.colspan-4 dt:nth-of-type(4n + 1),
1963
- form.semanticForms.light dl.colspan-4 dd:nth-of-type(4n + 1),
1964
- table.semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 1),
1965
- table.semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 1),
1966
- table.semanticForms dl.colspan-4 dt:nth-of-type(4n + 1),
1967
- table.semanticForms dl.colspan-4 dd:nth-of-type(4n + 1),
1968
- table.semanticForms.light fieldset.colspan-4 dl dt:nth-of-type(4n + 1),
1969
- table.semanticForms.light fieldset.colspan-4 dl dd:nth-of-type(4n + 1),
1970
- table.semanticForms.light dl.colspan-4 dt:nth-of-type(4n + 1),
1971
- table.semanticForms.light dl.colspan-4 dd:nth-of-type(4n + 1) {
825
+ .semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 1),
826
+ .semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 1),
827
+ .semanticForms dl.colspan-4 dt:nth-of-type(4n + 1),
828
+ .semanticForms dl.colspan-4 dd:nth-of-type(4n + 1) {
1972
829
  grid-column: 1;
1973
830
  }
1974
- form.semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 2),
1975
- form.semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 2),
1976
- form.semanticForms dl.colspan-4 dt:nth-of-type(4n + 2),
1977
- form.semanticForms dl.colspan-4 dd:nth-of-type(4n + 2),
1978
- form.semanticForms.light fieldset.colspan-4 dl dt:nth-of-type(4n + 2),
1979
- form.semanticForms.light fieldset.colspan-4 dl dd:nth-of-type(4n + 2),
1980
- form.semanticForms.light dl.colspan-4 dt:nth-of-type(4n + 2),
1981
- form.semanticForms.light dl.colspan-4 dd:nth-of-type(4n + 2),
1982
- table.semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 2),
1983
- table.semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 2),
1984
- table.semanticForms dl.colspan-4 dt:nth-of-type(4n + 2),
1985
- table.semanticForms dl.colspan-4 dd:nth-of-type(4n + 2),
1986
- table.semanticForms.light fieldset.colspan-4 dl dt:nth-of-type(4n + 2),
1987
- table.semanticForms.light fieldset.colspan-4 dl dd:nth-of-type(4n + 2),
1988
- table.semanticForms.light dl.colspan-4 dt:nth-of-type(4n + 2),
1989
- table.semanticForms.light dl.colspan-4 dd:nth-of-type(4n + 2) {
831
+ .semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 2),
832
+ .semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 2),
833
+ .semanticForms dl.colspan-4 dt:nth-of-type(4n + 2),
834
+ .semanticForms dl.colspan-4 dd:nth-of-type(4n + 2) {
1990
835
  grid-column: 2;
1991
836
  }
1992
- form.semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 3),
1993
- form.semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 3),
1994
- form.semanticForms dl.colspan-4 dt:nth-of-type(4n + 3),
1995
- form.semanticForms dl.colspan-4 dd:nth-of-type(4n + 3),
1996
- form.semanticForms.light fieldset.colspan-4 dl dt:nth-of-type(4n + 3),
1997
- form.semanticForms.light fieldset.colspan-4 dl dd:nth-of-type(4n + 3),
1998
- form.semanticForms.light dl.colspan-4 dt:nth-of-type(4n + 3),
1999
- form.semanticForms.light dl.colspan-4 dd:nth-of-type(4n + 3),
2000
- table.semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 3),
2001
- table.semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 3),
2002
- table.semanticForms dl.colspan-4 dt:nth-of-type(4n + 3),
2003
- table.semanticForms dl.colspan-4 dd:nth-of-type(4n + 3),
2004
- table.semanticForms.light fieldset.colspan-4 dl dt:nth-of-type(4n + 3),
2005
- table.semanticForms.light fieldset.colspan-4 dl dd:nth-of-type(4n + 3),
2006
- table.semanticForms.light dl.colspan-4 dt:nth-of-type(4n + 3),
2007
- table.semanticForms.light dl.colspan-4 dd:nth-of-type(4n + 3) {
837
+ .semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 3),
838
+ .semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 3),
839
+ .semanticForms dl.colspan-4 dt:nth-of-type(4n + 3),
840
+ .semanticForms dl.colspan-4 dd:nth-of-type(4n + 3) {
2008
841
  grid-column: 3;
2009
842
  }
2010
- form.semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 4),
2011
- form.semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 4),
2012
- form.semanticForms dl.colspan-4 dt:nth-of-type(4n + 4),
2013
- form.semanticForms dl.colspan-4 dd:nth-of-type(4n + 4),
2014
- form.semanticForms.light fieldset.colspan-4 dl dt:nth-of-type(4n + 4),
2015
- form.semanticForms.light fieldset.colspan-4 dl dd:nth-of-type(4n + 4),
2016
- form.semanticForms.light dl.colspan-4 dt:nth-of-type(4n + 4),
2017
- form.semanticForms.light dl.colspan-4 dd:nth-of-type(4n + 4),
2018
- table.semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 4),
2019
- table.semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 4),
2020
- table.semanticForms dl.colspan-4 dt:nth-of-type(4n + 4),
2021
- table.semanticForms dl.colspan-4 dd:nth-of-type(4n + 4),
2022
- table.semanticForms.light fieldset.colspan-4 dl dt:nth-of-type(4n + 4),
2023
- table.semanticForms.light fieldset.colspan-4 dl dd:nth-of-type(4n + 4),
2024
- table.semanticForms.light dl.colspan-4 dt:nth-of-type(4n + 4),
2025
- table.semanticForms.light dl.colspan-4 dd:nth-of-type(4n + 4) {
843
+ .semanticForms fieldset.colspan-4 dl dt:nth-of-type(4n + 4),
844
+ .semanticForms fieldset.colspan-4 dl dd:nth-of-type(4n + 4),
845
+ .semanticForms dl.colspan-4 dt:nth-of-type(4n + 4),
846
+ .semanticForms dl.colspan-4 dd:nth-of-type(4n + 4) {
2026
847
  grid-column: 4;
2027
848
  }
2028
- form.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 1),
2029
- form.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 1),
2030
- form.semanticForms dl.colspan-5 dt:nth-of-type(5n + 1),
2031
- form.semanticForms dl.colspan-5 dd:nth-of-type(5n + 1),
2032
- form.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 1),
2033
- form.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 1),
2034
- form.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 1),
2035
- form.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 1),
2036
- table.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 1),
2037
- table.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 1),
2038
- table.semanticForms dl.colspan-5 dt:nth-of-type(5n + 1),
2039
- table.semanticForms dl.colspan-5 dd:nth-of-type(5n + 1),
2040
- table.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 1),
2041
- table.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 1),
2042
- table.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 1),
2043
- table.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 1) {
849
+ .semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 1),
850
+ .semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 1),
851
+ .semanticForms dl.colspan-5 dt:nth-of-type(5n + 1),
852
+ .semanticForms dl.colspan-5 dd:nth-of-type(5n + 1) {
2044
853
  grid-column: 1;
2045
854
  }
2046
- form.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 2),
2047
- form.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 2),
2048
- form.semanticForms dl.colspan-5 dt:nth-of-type(5n + 2),
2049
- form.semanticForms dl.colspan-5 dd:nth-of-type(5n + 2),
2050
- form.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 2),
2051
- form.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 2),
2052
- form.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 2),
2053
- form.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 2),
2054
- table.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 2),
2055
- table.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 2),
2056
- table.semanticForms dl.colspan-5 dt:nth-of-type(5n + 2),
2057
- table.semanticForms dl.colspan-5 dd:nth-of-type(5n + 2),
2058
- table.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 2),
2059
- table.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 2),
2060
- table.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 2),
2061
- table.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 2) {
855
+ .semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 2),
856
+ .semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 2),
857
+ .semanticForms dl.colspan-5 dt:nth-of-type(5n + 2),
858
+ .semanticForms dl.colspan-5 dd:nth-of-type(5n + 2) {
2062
859
  grid-column: 2;
2063
860
  }
2064
- form.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 3),
2065
- form.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 3),
2066
- form.semanticForms dl.colspan-5 dt:nth-of-type(5n + 3),
2067
- form.semanticForms dl.colspan-5 dd:nth-of-type(5n + 3),
2068
- form.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 3),
2069
- form.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 3),
2070
- form.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 3),
2071
- form.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 3),
2072
- table.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 3),
2073
- table.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 3),
2074
- table.semanticForms dl.colspan-5 dt:nth-of-type(5n + 3),
2075
- table.semanticForms dl.colspan-5 dd:nth-of-type(5n + 3),
2076
- table.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 3),
2077
- table.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 3),
2078
- table.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 3),
2079
- table.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 3) {
861
+ .semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 3),
862
+ .semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 3),
863
+ .semanticForms dl.colspan-5 dt:nth-of-type(5n + 3),
864
+ .semanticForms dl.colspan-5 dd:nth-of-type(5n + 3) {
2080
865
  grid-column: 3;
2081
866
  }
2082
- form.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 4),
2083
- form.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 4),
2084
- form.semanticForms dl.colspan-5 dt:nth-of-type(5n + 4),
2085
- form.semanticForms dl.colspan-5 dd:nth-of-type(5n + 4),
2086
- form.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 4),
2087
- form.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 4),
2088
- form.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 4),
2089
- form.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 4),
2090
- table.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 4),
2091
- table.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 4),
2092
- table.semanticForms dl.colspan-5 dt:nth-of-type(5n + 4),
2093
- table.semanticForms dl.colspan-5 dd:nth-of-type(5n + 4),
2094
- table.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 4),
2095
- table.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 4),
2096
- table.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 4),
2097
- table.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 4) {
867
+ .semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 4),
868
+ .semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 4),
869
+ .semanticForms dl.colspan-5 dt:nth-of-type(5n + 4),
870
+ .semanticForms dl.colspan-5 dd:nth-of-type(5n + 4) {
2098
871
  grid-column: 4;
2099
872
  }
2100
- form.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 5),
2101
- form.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 5),
2102
- form.semanticForms dl.colspan-5 dt:nth-of-type(5n + 5),
2103
- form.semanticForms dl.colspan-5 dd:nth-of-type(5n + 5),
2104
- form.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 5),
2105
- form.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 5),
2106
- form.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 5),
2107
- form.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 5),
2108
- table.semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 5),
2109
- table.semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 5),
2110
- table.semanticForms dl.colspan-5 dt:nth-of-type(5n + 5),
2111
- table.semanticForms dl.colspan-5 dd:nth-of-type(5n + 5),
2112
- table.semanticForms.light fieldset.colspan-5 dl dt:nth-of-type(5n + 5),
2113
- table.semanticForms.light fieldset.colspan-5 dl dd:nth-of-type(5n + 5),
2114
- table.semanticForms.light dl.colspan-5 dt:nth-of-type(5n + 5),
2115
- table.semanticForms.light dl.colspan-5 dd:nth-of-type(5n + 5) {
873
+ .semanticForms fieldset.colspan-5 dl dt:nth-of-type(5n + 5),
874
+ .semanticForms fieldset.colspan-5 dl dd:nth-of-type(5n + 5),
875
+ .semanticForms dl.colspan-5 dt:nth-of-type(5n + 5),
876
+ .semanticForms dl.colspan-5 dd:nth-of-type(5n + 5) {
2116
877
  grid-column: 5;
2117
878
  }
2118
- form.semanticForms.lowFlow, form.semanticForms:not(.semanticFormsActive),
2119
- form.semanticForms.light.lowFlow,
2120
- form.semanticForms.light:not(.semanticFormsActive),
2121
- table.semanticForms.lowFlow,
2122
- table.semanticForms:not(.semanticFormsActive),
2123
- table.semanticForms.light.lowFlow,
2124
- table.semanticForms.light:not(.semanticFormsActive) {
2125
- gap: 10px;
879
+
880
+ form.semanticForms,
881
+ fieldset {
882
+ container: semanticForm/inline-size;
2126
883
  }
2127
- form.semanticForms.lowFlow dl, form.semanticForms:not(.semanticFormsActive) dl,
2128
- form.semanticForms.light.lowFlow dl,
2129
- form.semanticForms.light:not(.semanticFormsActive) dl,
2130
- table.semanticForms.lowFlow dl,
2131
- table.semanticForms:not(.semanticFormsActive) dl,
2132
- table.semanticForms.light.lowFlow dl,
2133
- table.semanticForms.light:not(.semanticFormsActive) dl {
2134
- grid-auto-flow: dense;
2135
- gap: 0 10px;
2136
- margin-bottom: 0px;
884
+ @container semanticForm (width >= 1810px) {
885
+ form.semanticForms fieldset dl, form.semanticForms dl,
886
+ fieldset fieldset dl,
887
+ fieldset dl {
888
+ grid-template-columns: repeat(7, minmax(var(--semanticFormsInputMinWidth), 1fr));
889
+ }
2137
890
  }
2138
- form.semanticForms.lowFlow > dt:nth-of-type(2n + 1), form.semanticForms.lowFlow > dd:nth-of-type(2n + 1), form.semanticForms:not(.semanticFormsActive) > dt:nth-of-type(2n + 1), form.semanticForms:not(.semanticFormsActive) > dd:nth-of-type(2n + 1),
2139
- form.semanticForms.light.lowFlow > dt:nth-of-type(2n + 1),
2140
- form.semanticForms.light.lowFlow > dd:nth-of-type(2n + 1),
2141
- form.semanticForms.light:not(.semanticFormsActive) > dt:nth-of-type(2n + 1),
2142
- form.semanticForms.light:not(.semanticFormsActive) > dd:nth-of-type(2n + 1),
2143
- table.semanticForms.lowFlow > dt:nth-of-type(2n + 1),
2144
- table.semanticForms.lowFlow > dd:nth-of-type(2n + 1),
2145
- table.semanticForms:not(.semanticFormsActive) > dt:nth-of-type(2n + 1),
2146
- table.semanticForms:not(.semanticFormsActive) > dd:nth-of-type(2n + 1),
2147
- table.semanticForms.light.lowFlow > dt:nth-of-type(2n + 1),
2148
- table.semanticForms.light.lowFlow > dd:nth-of-type(2n + 1),
2149
- table.semanticForms.light:not(.semanticFormsActive) > dt:nth-of-type(2n + 1),
2150
- table.semanticForms.light:not(.semanticFormsActive) > dd:nth-of-type(2n + 1) {
2151
- grid-column: 1;
891
+ @container semanticForm (width >= 1550px) and (width < 1810px) {
892
+ form.semanticForms fieldset dl, form.semanticForms dl,
893
+ fieldset fieldset dl,
894
+ fieldset dl {
895
+ grid-template-columns: repeat(6, minmax(var(--semanticFormsInputMinWidth), 1fr));
896
+ }
2152
897
  }
2153
- form.semanticForms.lowFlow > dt:nth-of-type(2n + 2), form.semanticForms.lowFlow > dd:nth-of-type(2n + 2), form.semanticForms:not(.semanticFormsActive) > dt:nth-of-type(2n + 2), form.semanticForms:not(.semanticFormsActive) > dd:nth-of-type(2n + 2),
2154
- form.semanticForms.light.lowFlow > dt:nth-of-type(2n + 2),
2155
- form.semanticForms.light.lowFlow > dd:nth-of-type(2n + 2),
2156
- form.semanticForms.light:not(.semanticFormsActive) > dt:nth-of-type(2n + 2),
2157
- form.semanticForms.light:not(.semanticFormsActive) > dd:nth-of-type(2n + 2),
2158
- table.semanticForms.lowFlow > dt:nth-of-type(2n + 2),
2159
- table.semanticForms.lowFlow > dd:nth-of-type(2n + 2),
2160
- table.semanticForms:not(.semanticFormsActive) > dt:nth-of-type(2n + 2),
2161
- table.semanticForms:not(.semanticFormsActive) > dd:nth-of-type(2n + 2),
2162
- table.semanticForms.light.lowFlow > dt:nth-of-type(2n + 2),
2163
- table.semanticForms.light.lowFlow > dd:nth-of-type(2n + 2),
2164
- table.semanticForms.light:not(.semanticFormsActive) > dt:nth-of-type(2n + 2),
2165
- table.semanticForms.light:not(.semanticFormsActive) > dd:nth-of-type(2n + 2) {
2166
- grid-column: 2;
898
+ @container semanticForm (width >= 1290px) and (width < 1550px) {
899
+ form.semanticForms fieldset dl, form.semanticForms dl,
900
+ fieldset fieldset dl,
901
+ fieldset dl {
902
+ grid-template-columns: repeat(5, minmax(var(--semanticFormsInputMinWidth), 1fr));
903
+ }
2167
904
  }
2168
- form.semanticForms.lowFlow dt, form.semanticForms:not(.semanticFormsActive) dt,
2169
- form.semanticForms.light.lowFlow dt,
2170
- form.semanticForms.light:not(.semanticFormsActive) dt,
2171
- table.semanticForms.lowFlow dt,
2172
- table.semanticForms:not(.semanticFormsActive) dt,
2173
- table.semanticForms.light.lowFlow dt,
2174
- table.semanticForms.light:not(.semanticFormsActive) dt {
2175
- min-width: var(--semanticFormsInputMinWidth); /* this matches the max-width of js-enabled inputs */
2176
- }
2177
- form.semanticForms.lowFlow dt label, form.semanticForms:not(.semanticFormsActive) dt label,
2178
- form.semanticForms.light.lowFlow dt label,
2179
- form.semanticForms.light:not(.semanticFormsActive) dt label,
2180
- table.semanticForms.lowFlow dt label,
2181
- table.semanticForms:not(.semanticFormsActive) dt label,
2182
- table.semanticForms.light.lowFlow dt label,
2183
- table.semanticForms.light:not(.semanticFormsActive) dt label {
2184
- position: absolute;
2185
- display: block;
2186
- height: 11px;
2187
- transform: scale(0.7);
2188
- transform-origin: left center;
2189
- padding-left: 22px;
2190
- margin-top: -1px;
2191
- }
2192
- form.semanticForms.lowFlow dt:has(+ dd input:required) label::after, form.semanticForms:not(.semanticFormsActive) dt:has(+ dd input:required) label::after,
2193
- form.semanticForms.light.lowFlow dt:has(+ dd input:required) label::after,
2194
- form.semanticForms.light:not(.semanticFormsActive) dt:has(+ dd input:required) label::after,
2195
- table.semanticForms.lowFlow dt:has(+ dd input:required) label::after,
2196
- table.semanticForms:not(.semanticFormsActive) dt:has(+ dd input:required) label::after,
2197
- table.semanticForms.light.lowFlow dt:has(+ dd input:required) label::after,
2198
- table.semanticForms.light:not(.semanticFormsActive) dt:has(+ dd input:required) label::after {
2199
- content: " *";
2200
- color: red;
2201
- }
2202
- form.semanticForms.lowFlow dt:has(+ dd.checkboxes) label, form.semanticForms.lowFlow dt:has(+ dd.radios) label, form.semanticForms:not(.semanticFormsActive) dt:has(+ dd.checkboxes) label, form.semanticForms:not(.semanticFormsActive) dt:has(+ dd.radios) label,
2203
- form.semanticForms.light.lowFlow dt:has(+ dd.checkboxes) label,
2204
- form.semanticForms.light.lowFlow dt:has(+ dd.radios) label,
2205
- form.semanticForms.light:not(.semanticFormsActive) dt:has(+ dd.checkboxes) label,
2206
- form.semanticForms.light:not(.semanticFormsActive) dt:has(+ dd.radios) label,
2207
- table.semanticForms.lowFlow dt:has(+ dd.checkboxes) label,
2208
- table.semanticForms.lowFlow dt:has(+ dd.radios) label,
2209
- table.semanticForms:not(.semanticFormsActive) dt:has(+ dd.checkboxes) label,
2210
- table.semanticForms:not(.semanticFormsActive) dt:has(+ dd.radios) label,
2211
- table.semanticForms.light.lowFlow dt:has(+ dd.checkboxes) label,
2212
- table.semanticForms.light.lowFlow dt:has(+ dd.radios) label,
2213
- table.semanticForms.light:not(.semanticFormsActive) dt:has(+ dd.checkboxes) label,
2214
- table.semanticForms.light:not(.semanticFormsActive) dt:has(+ dd.radios) label {
2215
- padding-left: 15px;
2216
- }
2217
- form.semanticForms.lowFlow dt:not(:has(+ dd ul)):has(+ dd input[type=checkbox]) label, form.semanticForms:not(.semanticFormsActive) dt:not(:has(+ dd ul)):has(+ dd input[type=checkbox]) label,
2218
- form.semanticForms.light.lowFlow dt:not(:has(+ dd ul)):has(+ dd input[type=checkbox]) label,
2219
- form.semanticForms.light:not(.semanticFormsActive) dt:not(:has(+ dd ul)):has(+ dd input[type=checkbox]) label,
2220
- table.semanticForms.lowFlow dt:not(:has(+ dd ul)):has(+ dd input[type=checkbox]) label,
2221
- table.semanticForms:not(.semanticFormsActive) dt:not(:has(+ dd ul)):has(+ dd input[type=checkbox]) label,
2222
- table.semanticForms.light.lowFlow dt:not(:has(+ dd ul)):has(+ dd input[type=checkbox]) label,
2223
- table.semanticForms.light:not(.semanticFormsActive) dt:not(:has(+ dd ul)):has(+ dd input[type=checkbox]) label {
2224
- transform: scale(1);
2225
- margin-top: 0;
2226
- margin-left: 8px;
2227
- }
2228
- form.semanticForms.lowFlow dt:not(:has(+ dd ul)):has(+ dd input[type=radio]) label, form.semanticForms:not(.semanticFormsActive) dt:not(:has(+ dd ul)):has(+ dd input[type=radio]) label,
2229
- form.semanticForms.light.lowFlow dt:not(:has(+ dd ul)):has(+ dd input[type=radio]) label,
2230
- form.semanticForms.light:not(.semanticFormsActive) dt:not(:has(+ dd ul)):has(+ dd input[type=radio]) label,
2231
- table.semanticForms.lowFlow dt:not(:has(+ dd ul)):has(+ dd input[type=radio]) label,
2232
- table.semanticForms:not(.semanticFormsActive) dt:not(:has(+ dd ul)):has(+ dd input[type=radio]) label,
2233
- table.semanticForms.light.lowFlow dt:not(:has(+ dd ul)):has(+ dd input[type=radio]) label,
2234
- table.semanticForms.light:not(.semanticFormsActive) dt:not(:has(+ dd ul)):has(+ dd input[type=radio]) label {
2235
- transform: scale(1);
2236
- margin-top: 0;
2237
- margin-left: 8px;
2238
- }
2239
- form.semanticForms.lowFlow dd, form.semanticForms:not(.semanticFormsActive) dd,
2240
- form.semanticForms.light.lowFlow dd,
2241
- form.semanticForms.light:not(.semanticFormsActive) dd,
2242
- table.semanticForms.lowFlow dd,
2243
- table.semanticForms:not(.semanticFormsActive) dd,
2244
- table.semanticForms.light.lowFlow dd,
2245
- table.semanticForms.light:not(.semanticFormsActive) dd {
2246
- margin-top: var(--semanticFormsInputTopMargin);
2247
- margin-bottom: 10px;
2248
- min-width: var(--semanticFormsInputMinWidth); /* this matches the max-width of js-enabled inputs */
2249
- }
2250
- form.semanticForms.lowFlow dd.checkboxes, form.semanticForms.lowFlow dd.radios, form.semanticForms:not(.semanticFormsActive) dd.checkboxes, form.semanticForms:not(.semanticFormsActive) dd.radios,
2251
- form.semanticForms.light.lowFlow dd.checkboxes,
2252
- form.semanticForms.light.lowFlow dd.radios,
2253
- form.semanticForms.light:not(.semanticFormsActive) dd.checkboxes,
2254
- form.semanticForms.light:not(.semanticFormsActive) dd.radios,
2255
- table.semanticForms.lowFlow dd.checkboxes,
2256
- table.semanticForms.lowFlow dd.radios,
2257
- table.semanticForms:not(.semanticFormsActive) dd.checkboxes,
2258
- table.semanticForms:not(.semanticFormsActive) dd.radios,
2259
- table.semanticForms.light.lowFlow dd.checkboxes,
2260
- table.semanticForms.light.lowFlow dd.radios,
2261
- table.semanticForms.light:not(.semanticFormsActive) dd.checkboxes,
2262
- table.semanticForms.light:not(.semanticFormsActive) dd.radios {
2263
- margin-top: 0;
2264
- }
2265
- form.semanticForms.lowFlow dd.checkboxes ul input[type=radio], form.semanticForms.lowFlow dd.radios ul input[type=radio], form.semanticForms:not(.semanticFormsActive) dd.checkboxes ul input[type=radio], form.semanticForms:not(.semanticFormsActive) dd.radios ul input[type=radio],
2266
- form.semanticForms.light.lowFlow dd.checkboxes ul input[type=radio],
2267
- form.semanticForms.light.lowFlow dd.radios ul input[type=radio],
2268
- form.semanticForms.light:not(.semanticFormsActive) dd.checkboxes ul input[type=radio],
2269
- form.semanticForms.light:not(.semanticFormsActive) dd.radios ul input[type=radio],
2270
- table.semanticForms.lowFlow dd.checkboxes ul input[type=radio],
2271
- table.semanticForms.lowFlow dd.radios ul input[type=radio],
2272
- table.semanticForms:not(.semanticFormsActive) dd.checkboxes ul input[type=radio],
2273
- table.semanticForms:not(.semanticFormsActive) dd.radios ul input[type=radio],
2274
- table.semanticForms.light.lowFlow dd.checkboxes ul input[type=radio],
2275
- table.semanticForms.light.lowFlow dd.radios ul input[type=radio],
2276
- table.semanticForms.light:not(.semanticFormsActive) dd.checkboxes ul input[type=radio],
2277
- table.semanticForms.light:not(.semanticFormsActive) dd.radios ul input[type=radio] {
2278
- margin-top: 3px;
2279
- }
2280
- form.semanticForms.lowFlow dd.checkboxes ul label, form.semanticForms.lowFlow dd.radios ul label, form.semanticForms:not(.semanticFormsActive) dd.checkboxes ul label, form.semanticForms:not(.semanticFormsActive) dd.radios ul label,
2281
- form.semanticForms.light.lowFlow dd.checkboxes ul label,
2282
- form.semanticForms.light.lowFlow dd.radios ul label,
2283
- form.semanticForms.light:not(.semanticFormsActive) dd.checkboxes ul label,
2284
- form.semanticForms.light:not(.semanticFormsActive) dd.radios ul label,
2285
- table.semanticForms.lowFlow dd.checkboxes ul label,
2286
- table.semanticForms.lowFlow dd.radios ul label,
2287
- table.semanticForms:not(.semanticFormsActive) dd.checkboxes ul label,
2288
- table.semanticForms:not(.semanticFormsActive) dd.radios ul label,
2289
- table.semanticForms.light.lowFlow dd.checkboxes ul label,
2290
- table.semanticForms.light.lowFlow dd.radios ul label,
2291
- table.semanticForms.light:not(.semanticFormsActive) dd.checkboxes ul label,
2292
- table.semanticForms.light:not(.semanticFormsActive) dd.radios ul label {
2293
- padding-top: 7px;
2294
- padding-left: 0;
2295
- font-size: var(--semanticFormsFontSize);
2296
- }
2297
- form.semanticForms.lowFlow dd.checkboxes ul + label, form.semanticForms.lowFlow dd.radios ul + label, form.semanticForms:not(.semanticFormsActive) dd.checkboxes ul + label, form.semanticForms:not(.semanticFormsActive) dd.radios ul + label,
2298
- form.semanticForms.light.lowFlow dd.checkboxes ul + label,
2299
- form.semanticForms.light.lowFlow dd.radios ul + label,
2300
- form.semanticForms.light:not(.semanticFormsActive) dd.checkboxes ul + label,
2301
- form.semanticForms.light:not(.semanticFormsActive) dd.radios ul + label,
2302
- table.semanticForms.lowFlow dd.checkboxes ul + label,
2303
- table.semanticForms.lowFlow dd.radios ul + label,
2304
- table.semanticForms:not(.semanticFormsActive) dd.checkboxes ul + label,
2305
- table.semanticForms:not(.semanticFormsActive) dd.radios ul + label,
2306
- table.semanticForms.light.lowFlow dd.checkboxes ul + label,
2307
- table.semanticForms.light.lowFlow dd.radios ul + label,
2308
- table.semanticForms.light:not(.semanticFormsActive) dd.checkboxes ul + label,
2309
- table.semanticForms.light:not(.semanticFormsActive) dd.radios ul + label {
2310
- margin-top: 0;
2311
- font-size: small;
2312
- }
2313
- form.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]), form.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]),
2314
- form.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]),
2315
- form.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]),
2316
- table.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]),
2317
- table.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]),
2318
- table.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]),
2319
- table.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) {
2320
- margin-top: 0;
2321
- padding-left: 10px;
2322
- }
2323
- form.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=checkbox],
2324
- form.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio], form.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=checkbox],
2325
- form.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio],
2326
- form.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=checkbox],
2327
- form.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio],
2328
- form.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=checkbox],
2329
- form.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio],
2330
- table.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=checkbox],
2331
- table.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio],
2332
- table.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=checkbox],
2333
- table.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio],
2334
- table.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=checkbox],
2335
- table.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio],
2336
- table.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=checkbox],
2337
- table.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio] {
2338
- margin-left: 1px;
2339
- margin-top: 1px;
2340
- margin-right: auto;
2341
- }
2342
- form.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) label, form.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) label,
2343
- form.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) label,
2344
- form.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) label,
2345
- table.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) label,
2346
- table.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) label,
2347
- table.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) label,
2348
- table.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) label {
2349
- font-size: small;
2350
- margin-top: -1px;
2351
- padding-left: 11px;
2352
- }
2353
- form.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio] + label, form.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio] + label,
2354
- form.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio] + label,
2355
- form.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio] + label,
2356
- table.semanticForms.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio] + label,
2357
- table.semanticForms:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio] + label,
2358
- table.semanticForms.light.lowFlow dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio] + label,
2359
- table.semanticForms.light:not(.semanticFormsActive) dd:not(:has(ul)):has(input[type=checkbox], input[type=radio]) input[type=radio] + label {
2360
- margin-top: -4px;
2361
- }
2362
- form.semanticForms.lowFlow dd input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio], [type=range]),
2363
- form.semanticForms.lowFlow dd select,
2364
- form.semanticForms.lowFlow dd textarea, form.semanticForms:not(.semanticFormsActive) dd input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio], [type=range]),
2365
- form.semanticForms:not(.semanticFormsActive) dd select,
2366
- form.semanticForms:not(.semanticFormsActive) dd textarea,
2367
- form.semanticForms.light.lowFlow dd input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio], [type=range]),
2368
- form.semanticForms.light.lowFlow dd select,
2369
- form.semanticForms.light.lowFlow dd textarea,
2370
- form.semanticForms.light:not(.semanticFormsActive) dd input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio], [type=range]),
2371
- form.semanticForms.light:not(.semanticFormsActive) dd select,
2372
- form.semanticForms.light:not(.semanticFormsActive) dd textarea,
2373
- table.semanticForms.lowFlow dd input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio], [type=range]),
2374
- table.semanticForms.lowFlow dd select,
2375
- table.semanticForms.lowFlow dd textarea,
2376
- table.semanticForms:not(.semanticFormsActive) dd input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio], [type=range]),
2377
- table.semanticForms:not(.semanticFormsActive) dd select,
2378
- table.semanticForms:not(.semanticFormsActive) dd textarea,
2379
- table.semanticForms.light.lowFlow dd input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio], [type=range]),
2380
- table.semanticForms.light.lowFlow dd select,
2381
- table.semanticForms.light.lowFlow dd textarea,
2382
- table.semanticForms.light:not(.semanticFormsActive) dd input:not([type=submit], [type=reset], [type=image], [type=checkbox], [type=radio], [type=range]),
2383
- table.semanticForms.light:not(.semanticFormsActive) dd select,
2384
- table.semanticForms.light:not(.semanticFormsActive) dd textarea {
2385
- padding-right: 6px;
2386
- }
2387
- form.semanticForms.lowFlow dd label, form.semanticForms:not(.semanticFormsActive) dd label,
2388
- form.semanticForms.light.lowFlow dd label,
2389
- form.semanticForms.light:not(.semanticFormsActive) dd label,
2390
- table.semanticForms.lowFlow dd label,
2391
- table.semanticForms:not(.semanticFormsActive) dd label,
2392
- table.semanticForms.light.lowFlow dd label,
2393
- table.semanticForms.light:not(.semanticFormsActive) dd label {
2394
- padding-left: 10px;
2395
- margin-top: -5px;
2396
- font-size: small;
2397
- color: var(--semanticFormsPlaceholderColor);
2398
- }
2399
- form.semanticForms.lowFlow dd button:not(.clear, .show),
2400
- form.semanticForms.lowFlow dd input[type=submit]:not(.clear, .show),
2401
- form.semanticForms.lowFlow dd input[type=button]:not(.clear, .show), form.semanticForms:not(.semanticFormsActive) dd button:not(.clear, .show),
2402
- form.semanticForms:not(.semanticFormsActive) dd input[type=submit]:not(.clear, .show),
2403
- form.semanticForms:not(.semanticFormsActive) dd input[type=button]:not(.clear, .show),
2404
- form.semanticForms.light.lowFlow dd button:not(.clear, .show),
2405
- form.semanticForms.light.lowFlow dd input[type=submit]:not(.clear, .show),
2406
- form.semanticForms.light.lowFlow dd input[type=button]:not(.clear, .show),
2407
- form.semanticForms.light:not(.semanticFormsActive) dd button:not(.clear, .show),
2408
- form.semanticForms.light:not(.semanticFormsActive) dd input[type=submit]:not(.clear, .show),
2409
- form.semanticForms.light:not(.semanticFormsActive) dd input[type=button]:not(.clear, .show),
2410
- table.semanticForms.lowFlow dd button:not(.clear, .show),
2411
- table.semanticForms.lowFlow dd input[type=submit]:not(.clear, .show),
2412
- table.semanticForms.lowFlow dd input[type=button]:not(.clear, .show),
2413
- table.semanticForms:not(.semanticFormsActive) dd button:not(.clear, .show),
2414
- table.semanticForms:not(.semanticFormsActive) dd input[type=submit]:not(.clear, .show),
2415
- table.semanticForms:not(.semanticFormsActive) dd input[type=button]:not(.clear, .show),
2416
- table.semanticForms.light.lowFlow dd button:not(.clear, .show),
2417
- table.semanticForms.light.lowFlow dd input[type=submit]:not(.clear, .show),
2418
- table.semanticForms.light.lowFlow dd input[type=button]:not(.clear, .show),
2419
- table.semanticForms.light:not(.semanticFormsActive) dd button:not(.clear, .show),
2420
- table.semanticForms.light:not(.semanticFormsActive) dd input[type=submit]:not(.clear, .show),
2421
- table.semanticForms.light:not(.semanticFormsActive) dd input[type=button]:not(.clear, .show) {
2422
- margin-top: 0;
2423
- }
2424
- form.semanticForms .checkboxes ul,
2425
- form.semanticForms .radios ul,
2426
- form.semanticForms.light .checkboxes ul,
2427
- form.semanticForms.light .radios ul,
2428
- table.semanticForms .checkboxes ul,
2429
- table.semanticForms .radios ul,
2430
- table.semanticForms.light .checkboxes ul,
2431
- table.semanticForms.light .radios ul {
2432
- margin-top: var(--semanticFormsInputTopMargin);
2433
- }
2434
-
2435
- .semanticForms table,
2436
- table.semanticForms {
2437
- table-layout: fixed;
2438
- width: 100%;
2439
- border-spacing: 0;
2440
- border: var(--semanticFormsBorder);
2441
- border-radius: 10px;
2442
- margin-bottom: 15px;
2443
- overflow: hidden;
2444
- }
2445
- .semanticForms table tr.title th,
2446
- table.semanticForms tr.title th {
2447
- background-color: var(--semanticFormsTableTitleColor);
2448
- }
2449
- .semanticForms table th,
2450
- table.semanticForms th {
2451
- background-color: var(--semanticFormsTableHeaderColor);
2452
- font-weight: bold;
2453
- }
2454
- .semanticForms table tr:nth-child(odd) td,
2455
- table.semanticForms tr:nth-child(odd) td {
2456
- background-color: var(--semanticFormsTableOddColor);
2457
- }
2458
- .semanticForms table tr:nth-child(even) td,
2459
- table.semanticForms tr:nth-child(even) td {
2460
- background-color: var(--semanticFormsTableEvenColor);
2461
- }
2462
- .semanticForms table td, .semanticForms table th,
2463
- table.semanticForms td,
2464
- table.semanticForms th {
2465
- border-right: var(--semanticFormsTableBorder);
2466
- border-bottom: var(--semanticFormsTableBorder);
2467
- padding: 7px 10px;
2468
- }
2469
- .semanticForms table th:last-of-type, .semanticForms table td:last-of-type,
2470
- table.semanticForms th:last-of-type,
2471
- table.semanticForms td:last-of-type {
2472
- border-right: none;
2473
- }
2474
- .semanticForms table tbody tr:last-of-type th, .semanticForms table tbody tr:last-of-type td,
2475
- table.semanticForms tbody tr:last-of-type th,
2476
- table.semanticForms tbody tr:last-of-type td {
2477
- border-bottom: none;
2478
- }
2479
- .semanticForms table menu:has(li > input, li > label, li > button, li > select, li > textarea, li > a),
2480
- table.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea, li > a) {
2481
- width: max-content;
2482
- }
2483
-
2484
- form.semanticForms,
2485
- fieldset {
2486
- container: semanticForm/inline-size;
2487
- }
2488
- @container semanticForm (width >= 1810px) {
2489
- form.semanticForms fieldset dl, form.semanticForms dl,
2490
- fieldset fieldset dl,
2491
- fieldset dl {
2492
- grid-template-columns: repeat(7, minmax(var(--semanticFormsInputMinWidth), 1fr));
2493
- }
2494
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(7n + 1), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(7n + 1), form.semanticForms dl:has(:not(div)) dt:nth-of-type(7n + 1), form.semanticForms dl:has(:not(div)) dd:nth-of-type(7n + 1),
2495
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(7n + 1),
2496
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(7n + 1),
2497
- fieldset dl:has(:not(div)) dt:nth-of-type(7n + 1),
2498
- fieldset dl:has(:not(div)) dd:nth-of-type(7n + 1) {
2499
- grid-column: 1;
2500
- }
2501
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(7n + 2), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(7n + 2), form.semanticForms dl:has(:not(div)) dt:nth-of-type(7n + 2), form.semanticForms dl:has(:not(div)) dd:nth-of-type(7n + 2),
2502
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(7n + 2),
2503
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(7n + 2),
2504
- fieldset dl:has(:not(div)) dt:nth-of-type(7n + 2),
2505
- fieldset dl:has(:not(div)) dd:nth-of-type(7n + 2) {
2506
- grid-column: 2;
2507
- }
2508
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(7n + 3), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(7n + 3), form.semanticForms dl:has(:not(div)) dt:nth-of-type(7n + 3), form.semanticForms dl:has(:not(div)) dd:nth-of-type(7n + 3),
2509
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(7n + 3),
2510
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(7n + 3),
2511
- fieldset dl:has(:not(div)) dt:nth-of-type(7n + 3),
2512
- fieldset dl:has(:not(div)) dd:nth-of-type(7n + 3) {
2513
- grid-column: 3;
2514
- }
2515
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(7n + 4), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(7n + 4), form.semanticForms dl:has(:not(div)) dt:nth-of-type(7n + 4), form.semanticForms dl:has(:not(div)) dd:nth-of-type(7n + 4),
2516
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(7n + 4),
2517
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(7n + 4),
2518
- fieldset dl:has(:not(div)) dt:nth-of-type(7n + 4),
2519
- fieldset dl:has(:not(div)) dd:nth-of-type(7n + 4) {
2520
- grid-column: 4;
2521
- }
2522
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(7n + 5), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(7n + 5), form.semanticForms dl:has(:not(div)) dt:nth-of-type(7n + 5), form.semanticForms dl:has(:not(div)) dd:nth-of-type(7n + 5),
2523
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(7n + 5),
2524
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(7n + 5),
2525
- fieldset dl:has(:not(div)) dt:nth-of-type(7n + 5),
2526
- fieldset dl:has(:not(div)) dd:nth-of-type(7n + 5) {
2527
- grid-column: 5;
2528
- }
2529
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(7n + 6), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(7n + 6), form.semanticForms dl:has(:not(div)) dt:nth-of-type(7n + 6), form.semanticForms dl:has(:not(div)) dd:nth-of-type(7n + 6),
2530
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(7n + 6),
2531
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(7n + 6),
2532
- fieldset dl:has(:not(div)) dt:nth-of-type(7n + 6),
2533
- fieldset dl:has(:not(div)) dd:nth-of-type(7n + 6) {
2534
- grid-column: 6;
2535
- }
2536
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(7n + 7), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(7n + 7), form.semanticForms dl:has(:not(div)) dt:nth-of-type(7n + 7), form.semanticForms dl:has(:not(div)) dd:nth-of-type(7n + 7),
2537
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(7n + 7),
2538
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(7n + 7),
2539
- fieldset dl:has(:not(div)) dt:nth-of-type(7n + 7),
2540
- fieldset dl:has(:not(div)) dd:nth-of-type(7n + 7) {
2541
- grid-column: 7;
2542
- }
2543
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-full, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl:has(:not(div)) dd.colspan-5, form.semanticForms dl:has(:not(div)) dd.colspan-full,
2544
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2545
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2546
- fieldset fieldset dl:has(:not(div)) dd.colspan-5,
2547
- fieldset fieldset dl:has(:not(div)) dd.colspan-full,
2548
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2549
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2550
- fieldset dl:has(:not(div)) dd.colspan-5,
2551
- fieldset dl:has(:not(div)) dd.colspan-full {
2552
- grid-column: span 5;
2553
- }
2554
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-4, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl:has(:not(div)) dd.colspan-4,
2555
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2556
- fieldset fieldset dl:has(:not(div)) dd.colspan-4,
2557
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2558
- fieldset dl:has(:not(div)) dd.colspan-4 {
2559
- grid-column: span 4;
2560
- }
2561
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-3, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl:has(:not(div)) dd.colspan-3,
2562
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2563
- fieldset fieldset dl:has(:not(div)) dd.colspan-3,
2564
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2565
- fieldset dl:has(:not(div)) dd.colspan-3 {
2566
- grid-column: span 3;
2567
- }
2568
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-2, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl:has(:not(div)) dd.colspan-2,
2569
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2570
- fieldset fieldset dl:has(:not(div)) dd.colspan-2,
2571
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2572
- fieldset dl:has(:not(div)) dd.colspan-2 {
2573
- grid-column: span 2;
2574
- }
2575
- }
2576
- @container semanticForm (width >= 1550px) and (width < 1810px) {
2577
- form.semanticForms fieldset dl, form.semanticForms dl,
2578
- fieldset fieldset dl,
2579
- fieldset dl {
2580
- grid-template-columns: repeat(6, minmax(var(--semanticFormsInputMinWidth), 1fr));
2581
- }
2582
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(6n + 1), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(6n + 1), form.semanticForms dl:has(:not(div)) dt:nth-of-type(6n + 1), form.semanticForms dl:has(:not(div)) dd:nth-of-type(6n + 1),
2583
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(6n + 1),
2584
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(6n + 1),
2585
- fieldset dl:has(:not(div)) dt:nth-of-type(6n + 1),
2586
- fieldset dl:has(:not(div)) dd:nth-of-type(6n + 1) {
2587
- grid-column: 1;
2588
- }
2589
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(6n + 2), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(6n + 2), form.semanticForms dl:has(:not(div)) dt:nth-of-type(6n + 2), form.semanticForms dl:has(:not(div)) dd:nth-of-type(6n + 2),
2590
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(6n + 2),
2591
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(6n + 2),
2592
- fieldset dl:has(:not(div)) dt:nth-of-type(6n + 2),
2593
- fieldset dl:has(:not(div)) dd:nth-of-type(6n + 2) {
2594
- grid-column: 2;
2595
- }
2596
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(6n + 3), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(6n + 3), form.semanticForms dl:has(:not(div)) dt:nth-of-type(6n + 3), form.semanticForms dl:has(:not(div)) dd:nth-of-type(6n + 3),
2597
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(6n + 3),
2598
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(6n + 3),
2599
- fieldset dl:has(:not(div)) dt:nth-of-type(6n + 3),
2600
- fieldset dl:has(:not(div)) dd:nth-of-type(6n + 3) {
2601
- grid-column: 3;
2602
- }
2603
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(6n + 4), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(6n + 4), form.semanticForms dl:has(:not(div)) dt:nth-of-type(6n + 4), form.semanticForms dl:has(:not(div)) dd:nth-of-type(6n + 4),
2604
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(6n + 4),
2605
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(6n + 4),
2606
- fieldset dl:has(:not(div)) dt:nth-of-type(6n + 4),
2607
- fieldset dl:has(:not(div)) dd:nth-of-type(6n + 4) {
2608
- grid-column: 4;
2609
- }
2610
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(6n + 5), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(6n + 5), form.semanticForms dl:has(:not(div)) dt:nth-of-type(6n + 5), form.semanticForms dl:has(:not(div)) dd:nth-of-type(6n + 5),
2611
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(6n + 5),
2612
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(6n + 5),
2613
- fieldset dl:has(:not(div)) dt:nth-of-type(6n + 5),
2614
- fieldset dl:has(:not(div)) dd:nth-of-type(6n + 5) {
2615
- grid-column: 5;
2616
- }
2617
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(6n + 6), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(6n + 6), form.semanticForms dl:has(:not(div)) dt:nth-of-type(6n + 6), form.semanticForms dl:has(:not(div)) dd:nth-of-type(6n + 6),
2618
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(6n + 6),
2619
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(6n + 6),
2620
- fieldset dl:has(:not(div)) dt:nth-of-type(6n + 6),
2621
- fieldset dl:has(:not(div)) dd:nth-of-type(6n + 6) {
2622
- grid-column: 6;
2623
- }
2624
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-full, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl:has(:not(div)) dd.colspan-5, form.semanticForms dl:has(:not(div)) dd.colspan-full,
2625
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2626
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2627
- fieldset fieldset dl:has(:not(div)) dd.colspan-5,
2628
- fieldset fieldset dl:has(:not(div)) dd.colspan-full,
2629
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2630
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2631
- fieldset dl:has(:not(div)) dd.colspan-5,
2632
- fieldset dl:has(:not(div)) dd.colspan-full {
2633
- grid-column: span 5;
2634
- }
2635
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-4, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl:has(:not(div)) dd.colspan-4,
2636
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2637
- fieldset fieldset dl:has(:not(div)) dd.colspan-4,
2638
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2639
- fieldset dl:has(:not(div)) dd.colspan-4 {
2640
- grid-column: span 4;
2641
- }
2642
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-3, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl:has(:not(div)) dd.colspan-3,
2643
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2644
- fieldset fieldset dl:has(:not(div)) dd.colspan-3,
2645
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2646
- fieldset dl:has(:not(div)) dd.colspan-3 {
2647
- grid-column: span 3;
2648
- }
2649
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-2, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl:has(:not(div)) dd.colspan-2,
2650
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2651
- fieldset fieldset dl:has(:not(div)) dd.colspan-2,
2652
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2653
- fieldset dl:has(:not(div)) dd.colspan-2 {
2654
- grid-column: span 2;
2655
- }
2656
- }
2657
- @container semanticForm (width >= 1290px) and (width < 1550px) {
2658
- form.semanticForms fieldset dl, form.semanticForms dl,
2659
- fieldset fieldset dl,
2660
- fieldset dl {
2661
- grid-template-columns: repeat(5, minmax(var(--semanticFormsInputMinWidth), 1fr));
2662
- }
2663
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(5n + 1), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(5n + 1), form.semanticForms dl:has(:not(div)) dt:nth-of-type(5n + 1), form.semanticForms dl:has(:not(div)) dd:nth-of-type(5n + 1),
2664
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(5n + 1),
2665
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(5n + 1),
2666
- fieldset dl:has(:not(div)) dt:nth-of-type(5n + 1),
2667
- fieldset dl:has(:not(div)) dd:nth-of-type(5n + 1) {
2668
- grid-column: 1;
2669
- }
2670
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(5n + 2), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(5n + 2), form.semanticForms dl:has(:not(div)) dt:nth-of-type(5n + 2), form.semanticForms dl:has(:not(div)) dd:nth-of-type(5n + 2),
2671
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(5n + 2),
2672
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(5n + 2),
2673
- fieldset dl:has(:not(div)) dt:nth-of-type(5n + 2),
2674
- fieldset dl:has(:not(div)) dd:nth-of-type(5n + 2) {
2675
- grid-column: 2;
2676
- }
2677
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(5n + 3), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(5n + 3), form.semanticForms dl:has(:not(div)) dt:nth-of-type(5n + 3), form.semanticForms dl:has(:not(div)) dd:nth-of-type(5n + 3),
2678
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(5n + 3),
2679
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(5n + 3),
2680
- fieldset dl:has(:not(div)) dt:nth-of-type(5n + 3),
2681
- fieldset dl:has(:not(div)) dd:nth-of-type(5n + 3) {
2682
- grid-column: 3;
2683
- }
2684
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(5n + 4), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(5n + 4), form.semanticForms dl:has(:not(div)) dt:nth-of-type(5n + 4), form.semanticForms dl:has(:not(div)) dd:nth-of-type(5n + 4),
2685
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(5n + 4),
2686
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(5n + 4),
2687
- fieldset dl:has(:not(div)) dt:nth-of-type(5n + 4),
2688
- fieldset dl:has(:not(div)) dd:nth-of-type(5n + 4) {
2689
- grid-column: 4;
2690
- }
2691
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(5n + 5), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(5n + 5), form.semanticForms dl:has(:not(div)) dt:nth-of-type(5n + 5), form.semanticForms dl:has(:not(div)) dd:nth-of-type(5n + 5),
2692
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(5n + 5),
2693
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(5n + 5),
2694
- fieldset dl:has(:not(div)) dt:nth-of-type(5n + 5),
2695
- fieldset dl:has(:not(div)) dd:nth-of-type(5n + 5) {
2696
- grid-column: 5;
2697
- }
2698
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-full, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl:has(:not(div)) dd.colspan-5, form.semanticForms dl:has(:not(div)) dd.colspan-full,
2699
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2700
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2701
- fieldset fieldset dl:has(:not(div)) dd.colspan-5,
2702
- fieldset fieldset dl:has(:not(div)) dd.colspan-full,
2703
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2704
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2705
- fieldset dl:has(:not(div)) dd.colspan-5,
2706
- fieldset dl:has(:not(div)) dd.colspan-full {
2707
- grid-column: span 5;
2708
- }
2709
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-4, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl:has(:not(div)) dd.colspan-4,
2710
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2711
- fieldset fieldset dl:has(:not(div)) dd.colspan-4,
2712
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2713
- fieldset dl:has(:not(div)) dd.colspan-4 {
2714
- grid-column: span 4;
2715
- }
2716
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-3, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl:has(:not(div)) dd.colspan-3,
2717
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2718
- fieldset fieldset dl:has(:not(div)) dd.colspan-3,
2719
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2720
- fieldset dl:has(:not(div)) dd.colspan-3 {
2721
- grid-column: span 3;
2722
- }
2723
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-2, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl:has(:not(div)) dd.colspan-2,
2724
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2725
- fieldset fieldset dl:has(:not(div)) dd.colspan-2,
2726
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2727
- fieldset dl:has(:not(div)) dd.colspan-2 {
2728
- grid-column: span 2;
2729
- }
2730
- }
2731
- @container semanticForm (width >= 1030px) and (width < 1290px) {
2732
- form.semanticForms fieldset dl, form.semanticForms fieldset.colspan-5 dl, form.semanticForms dl, form.semanticForms dl.colspan-5,
2733
- fieldset fieldset dl,
2734
- fieldset fieldset.colspan-5 dl,
2735
- fieldset dl,
2736
- fieldset dl.colspan-5 {
2737
- grid-template-columns: repeat(4, minmax(var(--semanticFormsInputMinWidth), 1fr));
2738
- }
2739
- form.semanticForms fieldset dl div.colspan-5, form.semanticForms fieldset.colspan-5 dl div.colspan-5, form.semanticForms dl div.colspan-5, form.semanticForms dl.colspan-5 div.colspan-5,
2740
- fieldset fieldset dl div.colspan-5,
2741
- fieldset fieldset.colspan-5 dl div.colspan-5,
2742
- fieldset dl div.colspan-5,
2743
- fieldset dl.colspan-5 div.colspan-5 {
2744
- grid-column: span 4;
2745
- }
2746
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(4n + 1), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(4n + 1), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(4n + 1), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(4n + 1), form.semanticForms dl:has(:not(div)) dt:nth-of-type(4n + 1), form.semanticForms dl:has(:not(div)) dd:nth-of-type(4n + 1), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(4n + 1), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(4n + 1),
2747
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(4n + 1),
2748
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(4n + 1),
2749
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(4n + 1),
2750
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(4n + 1),
2751
- fieldset dl:has(:not(div)) dt:nth-of-type(4n + 1),
2752
- fieldset dl:has(:not(div)) dd:nth-of-type(4n + 1),
2753
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(4n + 1),
2754
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(4n + 1) {
2755
- grid-column: 1;
2756
- }
2757
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(4n + 2), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(4n + 2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(4n + 2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(4n + 2), form.semanticForms dl:has(:not(div)) dt:nth-of-type(4n + 2), form.semanticForms dl:has(:not(div)) dd:nth-of-type(4n + 2), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(4n + 2), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(4n + 2),
2758
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(4n + 2),
2759
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(4n + 2),
2760
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(4n + 2),
2761
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(4n + 2),
2762
- fieldset dl:has(:not(div)) dt:nth-of-type(4n + 2),
2763
- fieldset dl:has(:not(div)) dd:nth-of-type(4n + 2),
2764
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(4n + 2),
2765
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(4n + 2) {
2766
- grid-column: 2;
2767
- }
2768
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(4n + 3), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(4n + 3), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(4n + 3), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(4n + 3), form.semanticForms dl:has(:not(div)) dt:nth-of-type(4n + 3), form.semanticForms dl:has(:not(div)) dd:nth-of-type(4n + 3), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(4n + 3), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(4n + 3),
2769
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(4n + 3),
2770
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(4n + 3),
2771
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(4n + 3),
2772
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(4n + 3),
2773
- fieldset dl:has(:not(div)) dt:nth-of-type(4n + 3),
2774
- fieldset dl:has(:not(div)) dd:nth-of-type(4n + 3),
2775
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(4n + 3),
2776
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(4n + 3) {
2777
- grid-column: 3;
2778
- }
2779
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(4n + 4), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(4n + 4), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(4n + 4), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(4n + 4), form.semanticForms dl:has(:not(div)) dt:nth-of-type(4n + 4), form.semanticForms dl:has(:not(div)) dd:nth-of-type(4n + 4), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(4n + 4), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(4n + 4),
2780
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(4n + 4),
2781
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(4n + 4),
2782
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(4n + 4),
2783
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(4n + 4),
2784
- fieldset dl:has(:not(div)) dt:nth-of-type(4n + 4),
2785
- fieldset dl:has(:not(div)) dd:nth-of-type(4n + 4),
2786
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(4n + 4),
2787
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(4n + 4) {
2788
- grid-column: 4;
2789
- }
2790
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-full, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl:has(:not(div)) dd.colspan-4, form.semanticForms dl:has(:not(div)) dd.colspan-5, form.semanticForms dl:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-full,
2791
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2792
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2793
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2794
- fieldset fieldset dl:has(:not(div)) dd.colspan-4,
2795
- fieldset fieldset dl:has(:not(div)) dd.colspan-5,
2796
- fieldset fieldset dl:has(:not(div)) dd.colspan-full,
2797
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-4),
2798
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-5),
2799
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-full),
2800
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-4,
2801
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-5,
2802
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-full,
2803
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2804
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2805
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2806
- fieldset dl:has(:not(div)) dd.colspan-4,
2807
- fieldset dl:has(:not(div)) dd.colspan-5,
2808
- fieldset dl:has(:not(div)) dd.colspan-full,
2809
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-4),
2810
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-5),
2811
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-full),
2812
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-4,
2813
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-5,
2814
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-full {
2815
- grid-column: span 4;
2816
- }
2817
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-3, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-3,
2818
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2819
- fieldset fieldset dl:has(:not(div)) dd.colspan-3,
2820
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-3),
2821
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-3,
2822
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2823
- fieldset dl:has(:not(div)) dd.colspan-3,
2824
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-3),
2825
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-3 {
2826
- grid-column: span 3;
2827
- }
2828
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-2, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-2,
2829
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2830
- fieldset fieldset dl:has(:not(div)) dd.colspan-2,
2831
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-2),
2832
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-2,
2833
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2834
- fieldset dl:has(:not(div)) dd.colspan-2,
2835
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-2),
2836
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-2 {
2837
- grid-column: span 2;
2838
- }
905
+ @container semanticForm (width >= 1030px) and (width < 1290px) {
906
+ form.semanticForms fieldset dl, form.semanticForms fieldset.colspan-5 dl, form.semanticForms dl, form.semanticForms dl.colspan-5,
907
+ fieldset fieldset dl,
908
+ fieldset fieldset.colspan-5 dl,
909
+ fieldset dl,
910
+ fieldset dl.colspan-5 {
911
+ grid-template-columns: repeat(4, minmax(var(--semanticFormsInputMinWidth), 1fr));
912
+ }
913
+ form.semanticForms fieldset dl div.colspan-5, form.semanticForms fieldset.colspan-5 dl div.colspan-5, form.semanticForms dl div.colspan-5, form.semanticForms dl.colspan-5 div.colspan-5,
914
+ fieldset fieldset dl div.colspan-5,
915
+ fieldset fieldset.colspan-5 dl div.colspan-5,
916
+ fieldset dl div.colspan-5,
917
+ fieldset dl.colspan-5 div.colspan-5 {
918
+ grid-column: span 4;
919
+ }
2839
920
  }
2840
921
  @container semanticForm (width >= 850px) and (width < 1030px) {
2841
922
  form.semanticForms fieldset dl, form.semanticForms fieldset.colspan-4 dl, form.semanticForms fieldset.colspan-5 dl, form.semanticForms dl, form.semanticForms dl.colspan-4, form.semanticForms dl.colspan-5,
@@ -2868,117 +949,6 @@ fieldset {
2868
949
  fieldset dl.colspan-5 div.colspan-5 {
2869
950
  grid-column: span 3;
2870
951
  }
2871
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(3n + 1), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(3n + 1), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(3n + 1), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(3n + 1), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(3n + 1), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(3n + 1), form.semanticForms dl:has(:not(div)) dt:nth-of-type(3n + 1), form.semanticForms dl:has(:not(div)) dd:nth-of-type(3n + 1), form.semanticForms dl.colspan-4:has(:not(div)) dt:nth-of-type(3n + 1), form.semanticForms dl.colspan-4:has(:not(div)) dd:nth-of-type(3n + 1), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(3n + 1), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(3n + 1),
2872
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(3n + 1),
2873
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(3n + 1),
2874
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(3n + 1),
2875
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(3n + 1),
2876
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(3n + 1),
2877
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(3n + 1),
2878
- fieldset dl:has(:not(div)) dt:nth-of-type(3n + 1),
2879
- fieldset dl:has(:not(div)) dd:nth-of-type(3n + 1),
2880
- fieldset dl.colspan-4:has(:not(div)) dt:nth-of-type(3n + 1),
2881
- fieldset dl.colspan-4:has(:not(div)) dd:nth-of-type(3n + 1),
2882
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(3n + 1),
2883
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(3n + 1) {
2884
- grid-column: 1;
2885
- }
2886
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(3n + 2), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(3n + 2), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(3n + 2), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(3n + 2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(3n + 2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(3n + 2), form.semanticForms dl:has(:not(div)) dt:nth-of-type(3n + 2), form.semanticForms dl:has(:not(div)) dd:nth-of-type(3n + 2), form.semanticForms dl.colspan-4:has(:not(div)) dt:nth-of-type(3n + 2), form.semanticForms dl.colspan-4:has(:not(div)) dd:nth-of-type(3n + 2), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(3n + 2), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(3n + 2),
2887
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(3n + 2),
2888
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(3n + 2),
2889
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(3n + 2),
2890
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(3n + 2),
2891
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(3n + 2),
2892
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(3n + 2),
2893
- fieldset dl:has(:not(div)) dt:nth-of-type(3n + 2),
2894
- fieldset dl:has(:not(div)) dd:nth-of-type(3n + 2),
2895
- fieldset dl.colspan-4:has(:not(div)) dt:nth-of-type(3n + 2),
2896
- fieldset dl.colspan-4:has(:not(div)) dd:nth-of-type(3n + 2),
2897
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(3n + 2),
2898
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(3n + 2) {
2899
- grid-column: 2;
2900
- }
2901
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(3n + 3), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(3n + 3), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(3n + 3), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(3n + 3), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(3n + 3), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(3n + 3), form.semanticForms dl:has(:not(div)) dt:nth-of-type(3n + 3), form.semanticForms dl:has(:not(div)) dd:nth-of-type(3n + 3), form.semanticForms dl.colspan-4:has(:not(div)) dt:nth-of-type(3n + 3), form.semanticForms dl.colspan-4:has(:not(div)) dd:nth-of-type(3n + 3), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(3n + 3), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(3n + 3),
2902
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(3n + 3),
2903
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(3n + 3),
2904
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(3n + 3),
2905
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(3n + 3),
2906
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(3n + 3),
2907
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(3n + 3),
2908
- fieldset dl:has(:not(div)) dt:nth-of-type(3n + 3),
2909
- fieldset dl:has(:not(div)) dd:nth-of-type(3n + 3),
2910
- fieldset dl.colspan-4:has(:not(div)) dt:nth-of-type(3n + 3),
2911
- fieldset dl.colspan-4:has(:not(div)) dd:nth-of-type(3n + 3),
2912
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(3n + 3),
2913
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(3n + 3) {
2914
- grid-column: 3;
2915
- }
2916
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-full, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl:has(:not(div)) dd.colspan-3, form.semanticForms dl:has(:not(div)) dd.colspan-4, form.semanticForms dl:has(:not(div)) dd.colspan-5, form.semanticForms dl:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-full,
2917
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2918
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2919
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2920
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2921
- fieldset fieldset dl:has(:not(div)) dd.colspan-3,
2922
- fieldset fieldset dl:has(:not(div)) dd.colspan-4,
2923
- fieldset fieldset dl:has(:not(div)) dd.colspan-5,
2924
- fieldset fieldset dl:has(:not(div)) dd.colspan-full,
2925
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-3),
2926
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-4),
2927
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-5),
2928
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-full),
2929
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-3,
2930
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-4,
2931
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-5,
2932
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-full,
2933
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-3),
2934
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-4),
2935
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-5),
2936
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-full),
2937
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-3,
2938
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-4,
2939
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-5,
2940
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-full,
2941
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
2942
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
2943
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
2944
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
2945
- fieldset dl:has(:not(div)) dd.colspan-3,
2946
- fieldset dl:has(:not(div)) dd.colspan-4,
2947
- fieldset dl:has(:not(div)) dd.colspan-5,
2948
- fieldset dl:has(:not(div)) dd.colspan-full,
2949
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-3),
2950
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-4),
2951
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-5),
2952
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-full),
2953
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-3,
2954
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-4,
2955
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-5,
2956
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-full,
2957
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-3),
2958
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-4),
2959
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-5),
2960
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-full),
2961
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-3,
2962
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-4,
2963
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-5,
2964
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-full {
2965
- grid-column: span 3;
2966
- }
2967
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-2, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-2,
2968
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2969
- fieldset fieldset dl:has(:not(div)) dd.colspan-2,
2970
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-2),
2971
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-2,
2972
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-2),
2973
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-2,
2974
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
2975
- fieldset dl:has(:not(div)) dd.colspan-2,
2976
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-2),
2977
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-2,
2978
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-2),
2979
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-2 {
2980
- grid-column: span 2;
2981
- }
2982
952
  }
2983
953
  @container semanticForm (width >= 510px) and (width < 850px) {
2984
954
  form.semanticForms fieldset dl, form.semanticForms fieldset.colspan-3 dl, form.semanticForms fieldset.colspan-4 dl, form.semanticForms fieldset.colspan-5 dl, form.semanticForms dl, form.semanticForms dl.colspan-3, form.semanticForms dl.colspan-4, form.semanticForms dl.colspan-5,
@@ -3035,127 +1005,6 @@ fieldset {
3035
1005
  fieldset dl.colspan-5 div.colspan-5 {
3036
1006
  grid-column: span 2;
3037
1007
  }
3038
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(2n + 1), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(2n + 1), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:nth-of-type(2n + 1), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd:nth-of-type(2n + 1), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(2n + 1), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(2n + 1), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(2n + 1), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(2n + 1), form.semanticForms dl:has(:not(div)) dt:nth-of-type(2n + 1), form.semanticForms dl:has(:not(div)) dd:nth-of-type(2n + 1), form.semanticForms dl.colspan-3:has(:not(div)) dt:nth-of-type(2n + 1), form.semanticForms dl.colspan-3:has(:not(div)) dd:nth-of-type(2n + 1), form.semanticForms dl.colspan-4:has(:not(div)) dt:nth-of-type(2n + 1), form.semanticForms dl.colspan-4:has(:not(div)) dd:nth-of-type(2n + 1), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(2n + 1), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(2n + 1),
3039
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(2n + 1),
3040
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(2n + 1),
3041
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:nth-of-type(2n + 1),
3042
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd:nth-of-type(2n + 1),
3043
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(2n + 1),
3044
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(2n + 1),
3045
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(2n + 1),
3046
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(2n + 1),
3047
- fieldset dl:has(:not(div)) dt:nth-of-type(2n + 1),
3048
- fieldset dl:has(:not(div)) dd:nth-of-type(2n + 1),
3049
- fieldset dl.colspan-3:has(:not(div)) dt:nth-of-type(2n + 1),
3050
- fieldset dl.colspan-3:has(:not(div)) dd:nth-of-type(2n + 1),
3051
- fieldset dl.colspan-4:has(:not(div)) dt:nth-of-type(2n + 1),
3052
- fieldset dl.colspan-4:has(:not(div)) dd:nth-of-type(2n + 1),
3053
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(2n + 1),
3054
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(2n + 1) {
3055
- grid-column: 1;
3056
- }
3057
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(2n + 2), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(2n + 2), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:nth-of-type(2n + 2), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd:nth-of-type(2n + 2), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(2n + 2), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(2n + 2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(2n + 2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(2n + 2), form.semanticForms dl:has(:not(div)) dt:nth-of-type(2n + 2), form.semanticForms dl:has(:not(div)) dd:nth-of-type(2n + 2), form.semanticForms dl.colspan-3:has(:not(div)) dt:nth-of-type(2n + 2), form.semanticForms dl.colspan-3:has(:not(div)) dd:nth-of-type(2n + 2), form.semanticForms dl.colspan-4:has(:not(div)) dt:nth-of-type(2n + 2), form.semanticForms dl.colspan-4:has(:not(div)) dd:nth-of-type(2n + 2), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(2n + 2), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(2n + 2),
3058
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(2n + 2),
3059
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(2n + 2),
3060
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:nth-of-type(2n + 2),
3061
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd:nth-of-type(2n + 2),
3062
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(2n + 2),
3063
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(2n + 2),
3064
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(2n + 2),
3065
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(2n + 2),
3066
- fieldset dl:has(:not(div)) dt:nth-of-type(2n + 2),
3067
- fieldset dl:has(:not(div)) dd:nth-of-type(2n + 2),
3068
- fieldset dl.colspan-3:has(:not(div)) dt:nth-of-type(2n + 2),
3069
- fieldset dl.colspan-3:has(:not(div)) dd:nth-of-type(2n + 2),
3070
- fieldset dl.colspan-4:has(:not(div)) dt:nth-of-type(2n + 2),
3071
- fieldset dl.colspan-4:has(:not(div)) dd:nth-of-type(2n + 2),
3072
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(2n + 2),
3073
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(2n + 2) {
3074
- grid-column: 2;
3075
- }
3076
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-full, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl:has(:not(div)) dd.colspan-2, form.semanticForms dl:has(:not(div)) dd.colspan-3, form.semanticForms dl:has(:not(div)) dd.colspan-4, form.semanticForms dl:has(:not(div)) dd.colspan-5, form.semanticForms dl:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-full,
3077
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
3078
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
3079
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
3080
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
3081
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
3082
- fieldset fieldset dl:has(:not(div)) dd.colspan-2,
3083
- fieldset fieldset dl:has(:not(div)) dd.colspan-3,
3084
- fieldset fieldset dl:has(:not(div)) dd.colspan-4,
3085
- fieldset fieldset dl:has(:not(div)) dd.colspan-5,
3086
- fieldset fieldset dl:has(:not(div)) dd.colspan-full,
3087
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-2),
3088
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-3),
3089
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-4),
3090
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-5),
3091
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-full),
3092
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-2,
3093
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-3,
3094
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-4,
3095
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-5,
3096
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-full,
3097
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-2),
3098
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-3),
3099
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-4),
3100
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-5),
3101
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-full),
3102
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-2,
3103
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-3,
3104
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-4,
3105
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-5,
3106
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-full,
3107
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-2),
3108
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-3),
3109
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-4),
3110
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-5),
3111
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-full),
3112
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-2,
3113
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-3,
3114
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-4,
3115
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-5,
3116
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-full,
3117
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
3118
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
3119
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
3120
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
3121
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
3122
- fieldset dl:has(:not(div)) dd.colspan-2,
3123
- fieldset dl:has(:not(div)) dd.colspan-3,
3124
- fieldset dl:has(:not(div)) dd.colspan-4,
3125
- fieldset dl:has(:not(div)) dd.colspan-5,
3126
- fieldset dl:has(:not(div)) dd.colspan-full,
3127
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-2),
3128
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-3),
3129
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-4),
3130
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-5),
3131
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-full),
3132
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-2,
3133
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-3,
3134
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-4,
3135
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-5,
3136
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-full,
3137
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-2),
3138
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-3),
3139
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-4),
3140
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-5),
3141
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-full),
3142
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-2,
3143
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-3,
3144
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-4,
3145
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-5,
3146
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-full,
3147
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-2),
3148
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-3),
3149
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-4),
3150
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-5),
3151
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-full),
3152
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-2,
3153
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-3,
3154
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-4,
3155
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-5,
3156
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-full {
3157
- grid-column: span 2;
3158
- }
3159
1008
  }
3160
1009
  @container semanticForm (width < 510px) {
3161
1010
  form.semanticForms fieldset dl, form.semanticForms fieldset.colspan-2 dl, form.semanticForms fieldset.colspan-3 dl, form.semanticForms fieldset.colspan-4 dl, form.semanticForms fieldset.colspan-5 dl, form.semanticForms dl, form.semanticForms dl.colspan-2, form.semanticForms dl.colspan-3, form.semanticForms dl.colspan-4, form.semanticForms dl.colspan-5,
@@ -3169,7 +1018,7 @@ fieldset {
3169
1018
  fieldset dl.colspan-3,
3170
1019
  fieldset dl.colspan-4,
3171
1020
  fieldset dl.colspan-5 {
3172
- grid-template-columns: repeat(1, minmax(var(--semanticFormsInputMinWidth), 1fr));
1021
+ grid-template-columns: 1fr;
3173
1022
  }
3174
1023
  form.semanticForms fieldset dl div.colspan-2,
3175
1024
  form.semanticForms fieldset dl div.colspan-3,
@@ -3244,152 +1093,396 @@ fieldset {
3244
1093
  fieldset dl.colspan-5 div.colspan-5 {
3245
1094
  grid-column: span 1;
3246
1095
  }
3247
- form.semanticForms fieldset dl:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms fieldset dl:has(:not(div)) dd:nth-of-type(n + 1), form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dd:nth-of-type(n + 1), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd:nth-of-type(n + 1), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(n + 1), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(n + 1), form.semanticForms dl:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms dl:has(:not(div)) dd:nth-of-type(n + 1), form.semanticForms dl.colspan-2:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms dl.colspan-2:has(:not(div)) dd:nth-of-type(n + 1), form.semanticForms dl.colspan-3:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms dl.colspan-3:has(:not(div)) dd:nth-of-type(n + 1), form.semanticForms dl.colspan-4:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms dl.colspan-4:has(:not(div)) dd:nth-of-type(n + 1), form.semanticForms dl.colspan-5:has(:not(div)) dt:nth-of-type(n + 1), form.semanticForms dl.colspan-5:has(:not(div)) dd:nth-of-type(n + 1),
3248
- fieldset fieldset dl:has(:not(div)) dt:nth-of-type(n + 1),
3249
- fieldset fieldset dl:has(:not(div)) dd:nth-of-type(n + 1),
3250
- fieldset fieldset.colspan-2 dl:has(:not(div)) dt:nth-of-type(n + 1),
3251
- fieldset fieldset.colspan-2 dl:has(:not(div)) dd:nth-of-type(n + 1),
3252
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:nth-of-type(n + 1),
3253
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd:nth-of-type(n + 1),
3254
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:nth-of-type(n + 1),
3255
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd:nth-of-type(n + 1),
3256
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:nth-of-type(n + 1),
3257
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd:nth-of-type(n + 1),
3258
- fieldset dl:has(:not(div)) dt:nth-of-type(n + 1),
3259
- fieldset dl:has(:not(div)) dd:nth-of-type(n + 1),
3260
- fieldset dl.colspan-2:has(:not(div)) dt:nth-of-type(n + 1),
3261
- fieldset dl.colspan-2:has(:not(div)) dd:nth-of-type(n + 1),
3262
- fieldset dl.colspan-3:has(:not(div)) dt:nth-of-type(n + 1),
3263
- fieldset dl.colspan-3:has(:not(div)) dd:nth-of-type(n + 1),
3264
- fieldset dl.colspan-4:has(:not(div)) dt:nth-of-type(n + 1),
3265
- fieldset dl.colspan-4:has(:not(div)) dd:nth-of-type(n + 1),
3266
- fieldset dl.colspan-5:has(:not(div)) dt:nth-of-type(n + 1),
3267
- fieldset dl.colspan-5:has(:not(div)) dd:nth-of-type(n + 1) {
3268
- grid-column: 1;
1096
+ }
1097
+
1098
+ form.semanticForms.lowFlow,
1099
+ form.semanticForms:not(.semanticFormsActive) {
1100
+ gap: 10px;
1101
+ }
1102
+ form.semanticForms.lowFlow dl,
1103
+ form.semanticForms:not(.semanticFormsActive) dl {
1104
+ gap: 10px;
1105
+ margin-bottom: 0px;
1106
+ }
1107
+ form.semanticForms.lowFlow div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]),
1108
+ form.semanticForms:not(.semanticFormsActive) div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]) {
1109
+ padding-left: 11px;
1110
+ }
1111
+ form.semanticForms.lowFlow div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]):has(dd > input[type=radio]),
1112
+ form.semanticForms:not(.semanticFormsActive) div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]):has(dd > input[type=radio]) {
1113
+ margin-top: -2px;
1114
+ }
1115
+ form.semanticForms.lowFlow div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]) dt label,
1116
+ form.semanticForms:not(.semanticFormsActive) div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]) dt label {
1117
+ transform: scale(1);
1118
+ margin-top: 4px;
1119
+ margin-left: -4px;
1120
+ }
1121
+ form.semanticForms.lowFlow div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]) dd,
1122
+ form.semanticForms:not(.semanticFormsActive) div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]) dd {
1123
+ margin-top: 0;
1124
+ }
1125
+ form.semanticForms.lowFlow div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]) dd label,
1126
+ form.semanticForms:not(.semanticFormsActive) div:not(:has(dd > ul)):has(dd > input[type=checkbox], dd > input[type=radio]) dd label {
1127
+ font-size: small;
1128
+ margin-top: -2px;
1129
+ padding-left: 10px;
1130
+ }
1131
+ form.semanticForms.lowFlow dt,
1132
+ form.semanticForms:not(.semanticFormsActive) dt {
1133
+ min-width: var(--semanticFormsInputMinWidth); /* this matches the max-width of js-enabled inputs */
1134
+ }
1135
+ form.semanticForms.lowFlow dt label,
1136
+ form.semanticForms:not(.semanticFormsActive) dt label {
1137
+ position: absolute;
1138
+ display: block;
1139
+ height: 11px;
1140
+ transform: scale(0.7);
1141
+ transform-origin: left center;
1142
+ padding-left: 29px;
1143
+ margin-top: -2px;
1144
+ }
1145
+ form.semanticForms.lowFlow dt:has(+ dd input:required) label::after,
1146
+ form.semanticForms:not(.semanticFormsActive) dt:has(+ dd input:required) label::after {
1147
+ content: " *";
1148
+ color: red;
1149
+ }
1150
+ form.semanticForms.lowFlow dt:has(+ dd.checkboxes) label, form.semanticForms.lowFlow dt:has(+ dd.radios) label,
1151
+ form.semanticForms:not(.semanticFormsActive) dt:has(+ dd.checkboxes) label,
1152
+ form.semanticForms:not(.semanticFormsActive) dt:has(+ dd.radios) label {
1153
+ padding-left: 15px;
1154
+ }
1155
+ form.semanticForms.lowFlow dd,
1156
+ form.semanticForms:not(.semanticFormsActive) dd {
1157
+ margin-top: var(--semanticFormsInputTopMargin);
1158
+ min-width: var(--semanticFormsInputMinWidth); /* this matches the max-width of js-enabled inputs */
1159
+ }
1160
+ form.semanticForms.lowFlow dd.checkboxes, form.semanticForms.lowFlow dd.radios,
1161
+ form.semanticForms:not(.semanticFormsActive) dd.checkboxes,
1162
+ form.semanticForms:not(.semanticFormsActive) dd.radios {
1163
+ margin-top: 0;
1164
+ }
1165
+ form.semanticForms.lowFlow dd.checkboxes ul input[type=radio], form.semanticForms.lowFlow dd.radios ul input[type=radio],
1166
+ form.semanticForms:not(.semanticFormsActive) dd.checkboxes ul input[type=radio],
1167
+ form.semanticForms:not(.semanticFormsActive) dd.radios ul input[type=radio] {
1168
+ margin-top: 3px;
1169
+ }
1170
+ form.semanticForms.lowFlow dd.checkboxes ul label, form.semanticForms.lowFlow dd.radios ul label,
1171
+ form.semanticForms:not(.semanticFormsActive) dd.checkboxes ul label,
1172
+ form.semanticForms:not(.semanticFormsActive) dd.radios ul label {
1173
+ padding-top: 7px;
1174
+ padding-left: 0;
1175
+ font-size: var(--semanticFormsFontSize);
1176
+ }
1177
+ form.semanticForms.lowFlow dd.checkboxes ul + label, form.semanticForms.lowFlow dd.radios ul + label,
1178
+ form.semanticForms:not(.semanticFormsActive) dd.checkboxes ul + label,
1179
+ form.semanticForms:not(.semanticFormsActive) dd.radios ul + label {
1180
+ margin-top: 0;
1181
+ font-size: small;
1182
+ }
1183
+ form.semanticForms.lowFlow dd input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio], [type=range]),
1184
+ form.semanticForms.lowFlow dd select,
1185
+ form.semanticForms.lowFlow dd textarea,
1186
+ form.semanticForms:not(.semanticFormsActive) dd input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio], [type=range]),
1187
+ form.semanticForms:not(.semanticFormsActive) dd select,
1188
+ form.semanticForms:not(.semanticFormsActive) dd textarea {
1189
+ padding-right: 6px;
1190
+ }
1191
+ form.semanticForms.lowFlow dd label,
1192
+ form.semanticForms:not(.semanticFormsActive) dd label {
1193
+ padding-left: 10px;
1194
+ margin-top: -5px;
1195
+ font-size: small;
1196
+ color: var(--semanticFormsPlaceholderColor);
1197
+ }
1198
+ form.semanticForms.lowFlow dd button:not(.clear, .show),
1199
+ form.semanticForms.lowFlow dd input[type=submit]:not(.clear, .show),
1200
+ form.semanticForms.lowFlow dd input[type=button]:not(.clear, .show),
1201
+ form.semanticForms:not(.semanticFormsActive) dd button:not(.clear, .show),
1202
+ form.semanticForms:not(.semanticFormsActive) dd input[type=submit]:not(.clear, .show),
1203
+ form.semanticForms:not(.semanticFormsActive) dd input[type=button]:not(.clear, .show) {
1204
+ margin-top: 0;
1205
+ }
1206
+
1207
+ .checkboxes ul,
1208
+ .radios ul {
1209
+ margin-top: var(--semanticFormsInputTopMargin);
1210
+ }
1211
+
1212
+ .semanticForms fieldset {
1213
+ border-radius: var(--semanticFormsBorderRadius);
1214
+ background: var(--semanticFormsFormSubBgColor);
1215
+ border: 1px var(--semanticFormsSubBorderColor) solid;
1216
+ display: flex;
1217
+ flex-direction: column;
1218
+ gap: 10px;
1219
+ padding: 10px 10px 20px 10px;
1220
+ margin-bottom: 15px;
1221
+ }
1222
+ .semanticForms fieldset fieldset {
1223
+ background-color: var(--semanticFormsNestedFieldsetBgColor);
1224
+ border: var(--semanticFormsNestedFieldsetBorder);
1225
+ margin-top: 15px;
1226
+ }
1227
+ .semanticForms fieldset fieldset input:not([type=submit], [type=reset], [type=button], [type=image], [type=checkbox], [type=radio]),
1228
+ .semanticForms fieldset fieldset select,
1229
+ .semanticForms fieldset fieldset textarea {
1230
+ background-color: var(--semanticFormsNestedInputBgColor);
1231
+ }
1232
+ .semanticForms details {
1233
+ box-sizing: border-box;
1234
+ position: relative;
1235
+ background-color: var(--semanticFormsNestedFieldsetBgColor);
1236
+ border: var(--semanticFormsNestedFieldsetBorder);
1237
+ border-radius: var(--semanticFormsBorderRadius);
1238
+ display: flex;
1239
+ flex-direction: column;
1240
+ gap: 5px;
1241
+ padding: 20px 10px 10px 10px;
1242
+ margin-top: 10px;
1243
+ min-height: calc(var(--semanticFormsFontSize) + 20px);
1244
+ }
1245
+ .semanticForms details::details-content {
1246
+ visibility: hidden;
1247
+ opacity: 0;
1248
+ transition: opacity 250ms ease-in, visibility 0ms ease-in 250ms;
1249
+ }
1250
+ @supports (interpolate-size: allow-keywords) {
1251
+ .semanticForms details {
1252
+ transition: opacity 250ms ease-in, visibility 0ms ease-in 250ms, height 250ms;
3269
1253
  }
3270
- form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset dl:has(:not(div)) dd.colspan-1, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dd.colspan-1, form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-2 dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-1, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-3 dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-1, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-4 dl:has(:not(div)) dd.colspan-full, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-1, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-2, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-3, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-4, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-5, form.semanticForms fieldset.colspan-5 dl:has(:not(div)) dd.colspan-full, form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl:has(:not(div)) dd.colspan-1, form.semanticForms dl:has(:not(div)) dd.colspan-2, form.semanticForms dl:has(:not(div)) dd.colspan-3, form.semanticForms dl:has(:not(div)) dd.colspan-4, form.semanticForms dl:has(:not(div)) dd.colspan-5, form.semanticForms dl:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-2:has(:not(div)) dd.colspan-1, form.semanticForms dl.colspan-2:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-2:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-2:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-2:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-2:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-1, form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-3:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-1, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-4:has(:not(div)) dd.colspan-full, form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-1), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-2), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-3), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-4), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-5), form.semanticForms dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-full), form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-1, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-2, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-3, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-4, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-5, form.semanticForms dl.colspan-5:has(:not(div)) dd.colspan-full,
3271
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-1),
3272
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
3273
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
3274
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
3275
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
3276
- fieldset fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
3277
- fieldset fieldset dl:has(:not(div)) dd.colspan-1,
3278
- fieldset fieldset dl:has(:not(div)) dd.colspan-2,
3279
- fieldset fieldset dl:has(:not(div)) dd.colspan-3,
3280
- fieldset fieldset dl:has(:not(div)) dd.colspan-4,
3281
- fieldset fieldset dl:has(:not(div)) dd.colspan-5,
3282
- fieldset fieldset dl:has(:not(div)) dd.colspan-full,
3283
- fieldset fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-1),
3284
- fieldset fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-2),
3285
- fieldset fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-3),
3286
- fieldset fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-4),
3287
- fieldset fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-5),
3288
- fieldset fieldset.colspan-2 dl:has(:not(div)) dt:has(+ dd.colspan-full),
3289
- fieldset fieldset.colspan-2 dl:has(:not(div)) dd.colspan-1,
3290
- fieldset fieldset.colspan-2 dl:has(:not(div)) dd.colspan-2,
3291
- fieldset fieldset.colspan-2 dl:has(:not(div)) dd.colspan-3,
3292
- fieldset fieldset.colspan-2 dl:has(:not(div)) dd.colspan-4,
3293
- fieldset fieldset.colspan-2 dl:has(:not(div)) dd.colspan-5,
3294
- fieldset fieldset.colspan-2 dl:has(:not(div)) dd.colspan-full,
3295
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-1),
3296
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-2),
3297
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-3),
3298
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-4),
3299
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-5),
3300
- fieldset fieldset.colspan-3 dl:has(:not(div)) dt:has(+ dd.colspan-full),
3301
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-1,
3302
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-2,
3303
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-3,
3304
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-4,
3305
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-5,
3306
- fieldset fieldset.colspan-3 dl:has(:not(div)) dd.colspan-full,
3307
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-1),
3308
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-2),
3309
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-3),
3310
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-4),
3311
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-5),
3312
- fieldset fieldset.colspan-4 dl:has(:not(div)) dt:has(+ dd.colspan-full),
3313
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-1,
3314
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-2,
3315
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-3,
3316
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-4,
3317
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-5,
3318
- fieldset fieldset.colspan-4 dl:has(:not(div)) dd.colspan-full,
3319
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-1),
3320
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-2),
3321
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-3),
3322
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-4),
3323
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-5),
3324
- fieldset fieldset.colspan-5 dl:has(:not(div)) dt:has(+ dd.colspan-full),
3325
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-1,
3326
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-2,
3327
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-3,
3328
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-4,
3329
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-5,
3330
- fieldset fieldset.colspan-5 dl:has(:not(div)) dd.colspan-full,
3331
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-1),
3332
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-2),
3333
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-3),
3334
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-4),
3335
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-5),
3336
- fieldset dl:has(:not(div)) dt:has(+ dd.colspan-full),
3337
- fieldset dl:has(:not(div)) dd.colspan-1,
3338
- fieldset dl:has(:not(div)) dd.colspan-2,
3339
- fieldset dl:has(:not(div)) dd.colspan-3,
3340
- fieldset dl:has(:not(div)) dd.colspan-4,
3341
- fieldset dl:has(:not(div)) dd.colspan-5,
3342
- fieldset dl:has(:not(div)) dd.colspan-full,
3343
- fieldset dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-1),
3344
- fieldset dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-2),
3345
- fieldset dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-3),
3346
- fieldset dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-4),
3347
- fieldset dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-5),
3348
- fieldset dl.colspan-2:has(:not(div)) dt:has(+ dd.colspan-full),
3349
- fieldset dl.colspan-2:has(:not(div)) dd.colspan-1,
3350
- fieldset dl.colspan-2:has(:not(div)) dd.colspan-2,
3351
- fieldset dl.colspan-2:has(:not(div)) dd.colspan-3,
3352
- fieldset dl.colspan-2:has(:not(div)) dd.colspan-4,
3353
- fieldset dl.colspan-2:has(:not(div)) dd.colspan-5,
3354
- fieldset dl.colspan-2:has(:not(div)) dd.colspan-full,
3355
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-1),
3356
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-2),
3357
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-3),
3358
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-4),
3359
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-5),
3360
- fieldset dl.colspan-3:has(:not(div)) dt:has(+ dd.colspan-full),
3361
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-1,
3362
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-2,
3363
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-3,
3364
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-4,
3365
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-5,
3366
- fieldset dl.colspan-3:has(:not(div)) dd.colspan-full,
3367
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-1),
3368
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-2),
3369
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-3),
3370
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-4),
3371
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-5),
3372
- fieldset dl.colspan-4:has(:not(div)) dt:has(+ dd.colspan-full),
3373
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-1,
3374
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-2,
3375
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-3,
3376
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-4,
3377
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-5,
3378
- fieldset dl.colspan-4:has(:not(div)) dd.colspan-full,
3379
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-1),
3380
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-2),
3381
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-3),
3382
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-4),
3383
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-5),
3384
- fieldset dl.colspan-5:has(:not(div)) dt:has(+ dd.colspan-full),
3385
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-1,
3386
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-2,
3387
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-3,
3388
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-4,
3389
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-5,
3390
- fieldset dl.colspan-5:has(:not(div)) dd.colspan-full {
3391
- grid-column: span 1;
1254
+ .semanticForms details::details-content {
1255
+ height: 0;
1256
+ overflow: hidden;
1257
+ transition: height 250ms, content-visibility 250ms;
1258
+ transition-behavior: allow-discrete;
1259
+ }
1260
+ }
1261
+ .semanticForms details summary {
1262
+ cursor: pointer;
1263
+ margin: 0;
1264
+ margin-bottom: 10px;
1265
+ line-height: 1;
1266
+ position: absolute;
1267
+ top: 10px;
1268
+ left: 22px;
1269
+ transition: top 250ms;
1270
+ }
1271
+ .semanticForms details summary::-webkit-details-marker, .semanticForms details summary::marker {
1272
+ content: "";
1273
+ }
1274
+ .semanticForms details summary::before {
1275
+ content: "";
1276
+ border-width: 0.4rem;
1277
+ border-style: solid;
1278
+ border-color: transparent transparent transparent var(--semanticFormsTextColor);
1279
+ position: absolute;
1280
+ top: 0;
1281
+ left: -10px;
1282
+ transform: rotate(0);
1283
+ transform-origin: 0.2rem 50%;
1284
+ transition: 250ms transform ease;
1285
+ }
1286
+ .semanticForms details[open]::details-content {
1287
+ visibility: visible;
1288
+ opacity: 1;
1289
+ transition: opacity 250ms ease-in, visibility 0ms ease-in 0ms;
1290
+ }
1291
+ @supports (interpolate-size: allow-keywords) {
1292
+ .semanticForms details[open]::details-content {
1293
+ height: auto;
3392
1294
  }
3393
1295
  }
1296
+ .semanticForms details[open] summary::before {
1297
+ transform: rotate(90deg);
1298
+ }
1299
+ .semanticForms details[open] > dl:first-of-type {
1300
+ margin-top: 15px;
1301
+ margin-bottom: 15px;
1302
+ }
1303
+ .semanticForms dl {
1304
+ display: grid;
1305
+ grid-template-columns: repeat(auto-fit, minmax(var(--semanticFormsInputMinWidth), 1fr));
1306
+ gap: 10px;
1307
+ margin-bottom: 10px;
1308
+ }
1309
+ .semanticForms dl div {
1310
+ position: relative;
1311
+ width: 100%;
1312
+ max-width: var(--semanticFormsInputMaxWidth);
1313
+ }
1314
+ .semanticForms dl div:has([data-max-content]) {
1315
+ min-width: 150px;
1316
+ max-width: max-content;
1317
+ }
1318
+ .semanticForms dl div:has([data-max-content]) dd {
1319
+ width: max-content;
1320
+ }
1321
+ .semanticForms dl div:has([data-max-content]) dd input, .semanticForms dl div:has([data-max-content]) dd select {
1322
+ field-sizing: content;
1323
+ min-width: 150px;
1324
+ max-width: max-content;
1325
+ }
1326
+ .semanticForms dl div:has(dd > button:only-child, dd > input[type=button]:only-child, dd > input[type=submit]:only-child, dd > input[type=reset]:only-child) dt label {
1327
+ display: none;
1328
+ }
1329
+ .semanticForms dl div dd {
1330
+ position: relative;
1331
+ display: flex;
1332
+ flex-direction: column;
1333
+ gap: 10px;
1334
+ max-width: 100%;
1335
+ }
1336
+ .semanticForms dl div dd.singleCheckbox, .semanticForms dl div dd.singleRadio {
1337
+ display: grid;
1338
+ grid-template-columns: 15px 1fr;
1339
+ align-items: center;
1340
+ padding-left: 11px;
1341
+ }
1342
+ .semanticForms dl div dd.singleCheckbox > :not(input[type=checkbox], input[type=radio], label), .semanticForms dl div dd.singleRadio > :not(input[type=checkbox], input[type=radio], label) {
1343
+ grid-column: 1/-1;
1344
+ }
1345
+ .semanticForms dl div dd.singleCheckbox label:nth-of-type(2), .semanticForms dl div dd.singleRadio label:nth-of-type(2) {
1346
+ grid-column: 1/-1;
1347
+ padding: 0 10px;
1348
+ font-size: small;
1349
+ color: var(--semanticFormsTextColor);
1350
+ }
1351
+ .semanticForms dl div dd.singleRadio > input {
1352
+ margin: 0;
1353
+ }
1354
+ .semanticForms dl div dd.checkboxes ul, .semanticForms dl div dd.radios ul {
1355
+ display: flex;
1356
+ flex-direction: column;
1357
+ margin-top: var(--semanticFormsInputTopMargin);
1358
+ padding-left: 10px;
1359
+ gap: 5px;
1360
+ }
1361
+ .semanticForms dl div dd.checkboxes ul li, .semanticForms dl div dd.radios ul li {
1362
+ display: flex;
1363
+ align-items: center;
1364
+ gap: 5px;
1365
+ }
1366
+ .semanticForms dl div dd.checkboxes > label, .semanticForms dl div dd.radios > label {
1367
+ padding-left: 20px;
1368
+ font-size: small;
1369
+ color: var(--semanticFormsTextColor);
1370
+ }
1371
+ .semanticForms dl div dd:has(button:only-child, input[type=button]:only-child, input[type=submit]:only-child, input[type=reset]:only-child) {
1372
+ margin-left: 0;
1373
+ }
1374
+ .semanticForms dl div dd:has(button:only-child, input[type=button]:only-child, input[type=submit]:only-child, input[type=reset]:only-child) button, .semanticForms dl div dd:has(button:only-child, input[type=button]:only-child, input[type=submit]:only-child, input[type=reset]:only-child) input[type=button], .semanticForms dl div dd:has(button:only-child, input[type=button]:only-child, input[type=submit]:only-child, input[type=reset]:only-child) input[type=submit], .semanticForms dl div dd:has(button:only-child, input[type=button]:only-child, input[type=submit]:only-child, input[type=reset]:only-child) input[type=reset] {
1375
+ height: var(--semanticFormsInputHeight);
1376
+ }
1377
+ .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) {
1378
+ display: grid;
1379
+ grid-template-columns: 2fr 1fr;
1380
+ }
1381
+ .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) button.clear, .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) button.show {
1382
+ right: 36%;
1383
+ }
1384
+ .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) input:not([type=submit]), .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) select, .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) textarea {
1385
+ grid-row: 1/2;
1386
+ grid-column: 1/2;
1387
+ }
1388
+ .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) button:not(.clear, .show),
1389
+ .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) input[type=submit]:not(.clear, .show),
1390
+ .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) input[type=button]:not(.clear, .show) {
1391
+ grid-row: 1/2;
1392
+ grid-column: 2/3;
1393
+ width: 100%;
1394
+ max-width: 100%;
1395
+ padding: 10px;
1396
+ height: var(--semanticFormsInputHeight);
1397
+ text-overflow: ellipsis;
1398
+ white-space: nowrap;
1399
+ overflow: hidden;
1400
+ display: inline-block;
1401
+ }
1402
+ .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) label:nth-of-type(2),
1403
+ .semanticForms dl div dd:has(input ~ button:not(.clear, .show), input ~ input[type=submit], input ~ input[type=reset], input ~ input[type=button], select ~ button:not(.clear, .show), select ~ input[type=submit], select ~ input[type=reset], select ~ input[type=button]) label:not(.floatLabelFormAnimatedLabel) {
1404
+ grid-row: 2/3;
1405
+ grid-column: 1/-1;
1406
+ }
1407
+ .semanticForms p:has(input:not([type=checkbox], [type=radio]), textarea, label) {
1408
+ display: flex;
1409
+ flex-direction: column;
1410
+ gap: 5px;
1411
+ }
1412
+ .semanticForms p:has(input[type=checkbox], input[type=radio]) {
1413
+ display: flex;
1414
+ flex-direction: row;
1415
+ align-items: center;
1416
+ gap: 5px;
1417
+ }
1418
+ .semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea),
1419
+ .semanticForms ul:has(li > input, li > label, li > button, li > select, li > textarea) {
1420
+ display: flex;
1421
+ justify-content: space-between;
1422
+ flex-wrap: wrap;
1423
+ gap: 10px;
1424
+ list-style-type: none;
1425
+ }
1426
+ .semanticForms div:has(.align-start) {
1427
+ display: flex;
1428
+ justify-content: start;
1429
+ }
1430
+ .semanticForms div:has(.align-center) {
1431
+ display: flex;
1432
+ justify-content: center;
1433
+ }
1434
+ .semanticForms div:has(.align-end) {
1435
+ display: flex;
1436
+ justify-content: end;
1437
+ }
1438
+
1439
+ .semanticForms table,
1440
+ table.semanticForms {
1441
+ table-layout: fixed;
1442
+ width: 100%;
1443
+ border-spacing: 0;
1444
+ border: var(--semanticFormsBorder);
1445
+ border-radius: 10px;
1446
+ margin-bottom: 15px;
1447
+ overflow: hidden;
1448
+ }
1449
+ .semanticForms table tr.title th,
1450
+ table.semanticForms tr.title th {
1451
+ background-color: var(--semanticFormsTableTitleColor);
1452
+ }
1453
+ .semanticForms table th,
1454
+ table.semanticForms th {
1455
+ background-color: var(--semanticFormsTableHeaderColor);
1456
+ font-weight: bold;
1457
+ }
1458
+ .semanticForms table tr:nth-child(odd) td,
1459
+ table.semanticForms tr:nth-child(odd) td {
1460
+ background-color: var(--semanticFormsTableOddColor);
1461
+ }
1462
+ .semanticForms table tr:nth-child(even) td,
1463
+ table.semanticForms tr:nth-child(even) td {
1464
+ background-color: var(--semanticFormsTableEvenColor);
1465
+ }
1466
+ .semanticForms table td, .semanticForms table th,
1467
+ table.semanticForms td,
1468
+ table.semanticForms th {
1469
+ border-right: var(--semanticFormsTableBorder);
1470
+ border-bottom: var(--semanticFormsTableBorder);
1471
+ padding: 7px 10px;
1472
+ }
1473
+ .semanticForms table th:last-of-type, .semanticForms table td:last-of-type,
1474
+ table.semanticForms th:last-of-type,
1475
+ table.semanticForms td:last-of-type {
1476
+ border-right: none;
1477
+ }
1478
+ .semanticForms table tbody tr:last-of-type th, .semanticForms table tbody tr:last-of-type td,
1479
+ table.semanticForms tbody tr:last-of-type th,
1480
+ table.semanticForms tbody tr:last-of-type td {
1481
+ border-bottom: none;
1482
+ }
1483
+ .semanticForms table menu:has(li > input, li > label, li > button, li > select, li > textarea, li > a),
1484
+ table.semanticForms menu:has(li > input, li > label, li > button, li > select, li > textarea, li > a) {
1485
+ width: max-content;
1486
+ }
3394
1487
 
3395
1488
  /*# sourceMappingURL=semantic-forms.css.map */