@gomusdev/web-components 1.55.0 → 1.55.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,1321 +1,1323 @@
1
1
  * {
2
- font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
2
+ font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
3
3
  }
4
4
 
5
5
  /* General reset for list items */
6
6
 
7
7
  :global .innerZoomElementWrapper h3 {
8
- margin-top: 4rem;
9
- margin-bottom: 1rem;
10
- }
8
+ margin-top: 4rem;
9
+ margin-bottom: 1rem;
10
+ }
11
11
 
12
12
  :global .innerZoomElementWrapper go-tickets {
13
- display: flex;
14
- flex-direction: column;
15
- gap: 1rem;
16
- }
13
+ display: flex;
14
+ flex-direction: column;
15
+ gap: 1rem;
16
+ }
17
17
 
18
18
  :global .innerZoomElementWrapper go-tickets label {
19
- display: inline-block;
20
- padding: 10px 20px;
21
- border: 2px solid #ccc;
22
- border-radius: 0;
23
- cursor: pointer;
24
- transition: background-color 0.3s, border-color 0.3s;
25
- }
19
+ display: inline-block;
20
+ padding: 10px 20px;
21
+ border: 2px solid #ccc;
22
+ border-radius: 0;
23
+ cursor: pointer;
24
+ transition:
25
+ background-color 0.3s, border-color 0.3s;
26
+ }
26
27
 
27
28
  /* Available timeslot */
28
29
 
29
30
  :global .innerZoomElementWrapper go-tickets .available {
30
- background-color: #fff;
31
- color: #333;
32
- }
31
+ background-color: #fff;
32
+ color: #333;
33
+ }
33
34
 
34
35
  :global .innerZoomElementWrapper go-tickets input[type='checkbox'] {
35
- display: none; /* Hide the radio button */
36
- }
36
+ display: none; /* Hide the radio button */
37
+ }
37
38
 
38
39
  /* When a timeslot is selected (checked radio button) */
39
40
 
40
41
  :global .innerZoomElementWrapper go-tickets label:has(input[type='checkbox']:checked) {
41
- background-color: #12826a;
42
- background-color: var(--primary); /* blue-green color */
43
- border-color: #12826a;
44
- border-color: var(--primary);
45
- color: white;
46
- }
42
+ background-color: #12826a;
43
+ background-color: var(--primary); /* blue-green color */
44
+ border-color: #12826a;
45
+ border-color: var(--primary);
46
+ color: white;
47
+ }
47
48
 
48
49
  /* Finished (unavailable) timeslot */
49
50
 
50
51
  :global .innerZoomElementWrapper go-tickets .finished {
51
- background-color: #f0f0f0;
52
- color: #999;
53
- }
52
+ background-color: #f0f0f0;
53
+ color: #999;
54
+ }
54
55
 
55
56
  :global .innerZoomElementWrapper go-tickets .finished input {
56
- display: none;
57
- }
57
+ display: none;
58
+ }
58
59
 
59
60
  :global .innerZoomElementWrapper go-tickets .finished {
60
- pointer-events: none;
61
- }
61
+ pointer-events: none;
62
+ }
62
63
 
63
64
  /* Disabled radio button appearance */
64
65
 
65
66
  :global .innerZoomElementWrapper go-tickets input:disabled + label {
66
- background-color: #e0e0e0;
67
- color: #bbb;
68
- cursor: not-allowed;
69
- border-color: #ddd;
70
- }
67
+ background-color: #e0e0e0;
68
+ color: #bbb;
69
+ cursor: not-allowed;
70
+ border-color: #ddd;
71
+ }
71
72
 
72
73
  :global .innerZoomElementWrapper go-tickets label:hover {
73
- background-color: #f0f0f0;
74
- border-color: #aaa;
75
- }
74
+ background-color: #f0f0f0;
75
+ border-color: #aaa;
76
+ }
76
77
 
77
78
  /* Focus state for better accessibility */
78
79
 
79
80
  :global .innerZoomElementWrapper go-tickets input:focus + label {
80
- outline: 2px solid #0052cc;
81
- }
81
+ outline: 2px solid #0052cc;
82
+ }
82
83
 
83
84
  :host,
84
85
  :root {
85
- --black: #111;
86
- --red: red;
87
- --light-red: #fff0f0;
88
- --primary: #12826a;
89
- --primary-hover: #19987e;
90
- --invalid-border: 4px solid var(--red);
91
- --fg: #111;
92
- --bg: white;
93
- --border: 3px solid transparent;
94
- --outline-hover: 3px solid var(--primary);
86
+ --black: #111;
87
+ --red: red;
88
+ --light-red: #fff0f0;
89
+ --primary: #12826a;
90
+ --primary-hover: #19987e;
91
+ --invalid-border: 4px solid var(--red);
92
+ --fg: #111;
93
+ --bg: white;
94
+ --border: 3px solid transparent;
95
+ --outline-hover: 3px solid var(--primary);
95
96
  }
96
97
 
97
98
  :host,
98
99
  :root {
99
- --fg: #111;
100
- --black: #111;
101
- --red: red;
102
- --light-red: #fff0f0;
103
- --primary: #12826a;
100
+ --fg: #111;
101
+ --black: #111;
102
+ --red: red;
103
+ --light-red: #fff0f0;
104
+ --primary: #12826a;
104
105
  }
105
106
 
106
107
  :host .is-invalid {
107
- --fg: #ff0000;
108
- background-color: #fff0f0;
109
- background-color: var(--light-red);
110
- border-left: 4px solid red;
111
- border-left: var(--invalid-border);
112
- }
108
+ --fg: #ff0000;
109
+ background-color: #fff0f0;
110
+ background-color: var(--light-red);
111
+ border-left: 4px solid red;
112
+ border-left: var(--invalid-border);
113
+ }
113
114
 
114
115
  :root .is-invalid {
115
- --fg: #ff0000;
116
- background-color: #fff0f0;
117
- background-color: var(--light-red);
118
- border-left: 4px solid red;
119
- border-left: var(--invalid-border);
120
- }
116
+ --fg: #ff0000;
117
+ background-color: #fff0f0;
118
+ background-color: var(--light-red);
119
+ border-left: 4px solid red;
120
+ border-left: var(--invalid-border);
121
+ }
121
122
 
122
123
  :host .form-group {
123
- margin-bottom: 0.5rem;
124
- display: flex;
125
- flex-direction: column;
126
- --invalid-border: 4px solid var(--red);
124
+ margin-bottom: 0.5rem;
125
+ display: flex;
126
+ flex-direction: column;
127
+ --invalid-border: 4px solid var(--red);
127
128
 
128
- padding: 0.5rem;
129
- }
129
+ padding: 0.5rem;
130
+ }
130
131
 
131
132
  :root .form-group {
132
- margin-bottom: 0.5rem;
133
- display: flex;
134
- flex-direction: column;
135
- --invalid-border: 4px solid var(--red);
133
+ margin-bottom: 0.5rem;
134
+ display: flex;
135
+ flex-direction: column;
136
+ --invalid-border: 4px solid var(--red);
136
137
 
137
- padding: 0.5rem;
138
- }
138
+ padding: 0.5rem;
139
+ }
139
140
 
140
141
  :host .go-field {
141
- margin-bottom: 0.5rem;
142
- display: flex;
143
- flex-direction: column;
144
- --invalid-border: 4px solid var(--red);
142
+ margin-bottom: 0.5rem;
143
+ display: flex;
144
+ flex-direction: column;
145
+ --invalid-border: 4px solid var(--red);
145
146
 
146
- padding: 0.5rem;
147
- }
147
+ padding: 0.5rem;
148
+ }
148
149
 
149
150
  :root .go-field {
150
- margin-bottom: 0.5rem;
151
- display: flex;
152
- flex-direction: column;
153
- --invalid-border: 4px solid var(--red);
151
+ margin-bottom: 0.5rem;
152
+ display: flex;
153
+ flex-direction: column;
154
+ --invalid-border: 4px solid var(--red);
154
155
 
155
- padding: 0.5rem;
156
- }
156
+ padding: 0.5rem;
157
+ }
157
158
 
158
159
  :host .form-group label {
159
- font-weight: bold;
160
- margin-bottom: 0.25rem;
161
- color: #111;
162
- color: var(--fg);
163
- }
160
+ font-weight: bold;
161
+ margin-bottom: 0.25rem;
162
+ color: #111;
163
+ color: var(--fg);
164
+ }
164
165
 
165
166
  :root .form-group label {
166
- font-weight: bold;
167
- margin-bottom: 0.25rem;
168
- color: #111;
169
- color: var(--fg);
170
- }
167
+ font-weight: bold;
168
+ margin-bottom: 0.25rem;
169
+ color: #111;
170
+ color: var(--fg);
171
+ }
171
172
 
172
173
  :host .go-field label {
173
- font-weight: bold;
174
- margin-bottom: 0.25rem;
175
- color: #111;
176
- color: var(--fg);
177
- }
174
+ font-weight: bold;
175
+ margin-bottom: 0.25rem;
176
+ color: #111;
177
+ color: var(--fg);
178
+ }
178
179
 
179
180
  :root .go-field label {
180
- font-weight: bold;
181
- margin-bottom: 0.25rem;
182
- color: #111;
183
- color: var(--fg);
184
- }
181
+ font-weight: bold;
182
+ margin-bottom: 0.25rem;
183
+ color: #111;
184
+ color: var(--fg);
185
+ }
185
186
 
186
187
  :host .form-group input {
187
- padding: 0.5rem;
188
- font-size: 1rem;
189
- border: 1px solid #111;
190
- border: 1px solid var(--fg);
191
- border-radius: 0;
192
- background-color: #fff;
193
- color: #111;
194
- color: var(--fg);
195
- transition: border-color 0.3s ease;
196
- }
188
+ padding: 0.5rem;
189
+ font-size: 1rem;
190
+ border: 1px solid #111;
191
+ border: 1px solid var(--fg);
192
+ border-radius: 0;
193
+ background-color: #fff;
194
+ color: #111;
195
+ color: var(--fg);
196
+ transition: border-color 0.3s ease;
197
+ }
197
198
 
198
199
  :root .form-group input {
199
- padding: 0.5rem;
200
- font-size: 1rem;
201
- border: 1px solid #111;
202
- border: 1px solid var(--fg);
203
- border-radius: 0;
204
- background-color: #fff;
205
- color: #111;
206
- color: var(--fg);
207
- transition: border-color 0.3s ease;
208
- }
200
+ padding: 0.5rem;
201
+ font-size: 1rem;
202
+ border: 1px solid #111;
203
+ border: 1px solid var(--fg);
204
+ border-radius: 0;
205
+ background-color: #fff;
206
+ color: #111;
207
+ color: var(--fg);
208
+ transition: border-color 0.3s ease;
209
+ }
209
210
 
210
211
  :host .go-field input {
211
- padding: 0.5rem;
212
- font-size: 1rem;
213
- border: 1px solid #111;
214
- border: 1px solid var(--fg);
215
- border-radius: 0;
216
- background-color: #fff;
217
- color: #111;
218
- color: var(--fg);
219
- transition: border-color 0.3s ease;
220
- }
212
+ padding: 0.5rem;
213
+ font-size: 1rem;
214
+ border: 1px solid #111;
215
+ border: 1px solid var(--fg);
216
+ border-radius: 0;
217
+ background-color: #fff;
218
+ color: #111;
219
+ color: var(--fg);
220
+ transition: border-color 0.3s ease;
221
+ }
221
222
 
222
223
  :root .go-field input {
223
- padding: 0.5rem;
224
- font-size: 1rem;
225
- border: 1px solid #111;
226
- border: 1px solid var(--fg);
227
- border-radius: 0;
228
- background-color: #fff;
229
- color: #111;
230
- color: var(--fg);
231
- transition: border-color 0.3s ease;
232
- }
224
+ padding: 0.5rem;
225
+ font-size: 1rem;
226
+ border: 1px solid #111;
227
+ border: 1px solid var(--fg);
228
+ border-radius: 0;
229
+ background-color: #fff;
230
+ color: #111;
231
+ color: var(--fg);
232
+ transition: border-color 0.3s ease;
233
+ }
233
234
 
234
235
  :host .form-group select {
235
- padding: 0.5rem;
236
- font-size: 1rem;
237
- border: 1px solid #111;
238
- border: 1px solid var(--fg);
239
- border-radius: 0;
240
- background-color: #fff;
241
- color: #111;
242
- color: var(--fg);
243
- transition: border-color 0.3s ease;
244
- }
236
+ padding: 0.5rem;
237
+ font-size: 1rem;
238
+ border: 1px solid #111;
239
+ border: 1px solid var(--fg);
240
+ border-radius: 0;
241
+ background-color: #fff;
242
+ color: #111;
243
+ color: var(--fg);
244
+ transition: border-color 0.3s ease;
245
+ }
245
246
 
246
247
  :root .form-group select {
247
- padding: 0.5rem;
248
- font-size: 1rem;
249
- border: 1px solid #111;
250
- border: 1px solid var(--fg);
251
- border-radius: 0;
252
- background-color: #fff;
253
- color: #111;
254
- color: var(--fg);
255
- transition: border-color 0.3s ease;
256
- }
248
+ padding: 0.5rem;
249
+ font-size: 1rem;
250
+ border: 1px solid #111;
251
+ border: 1px solid var(--fg);
252
+ border-radius: 0;
253
+ background-color: #fff;
254
+ color: #111;
255
+ color: var(--fg);
256
+ transition: border-color 0.3s ease;
257
+ }
257
258
 
258
259
  :host .go-field select {
259
- padding: 0.5rem;
260
- font-size: 1rem;
261
- border: 1px solid #111;
262
- border: 1px solid var(--fg);
263
- border-radius: 0;
264
- background-color: #fff;
265
- color: #111;
266
- color: var(--fg);
267
- transition: border-color 0.3s ease;
268
- }
260
+ padding: 0.5rem;
261
+ font-size: 1rem;
262
+ border: 1px solid #111;
263
+ border: 1px solid var(--fg);
264
+ border-radius: 0;
265
+ background-color: #fff;
266
+ color: #111;
267
+ color: var(--fg);
268
+ transition: border-color 0.3s ease;
269
+ }
269
270
 
270
271
  :root .go-field select {
271
- padding: 0.5rem;
272
- font-size: 1rem;
273
- border: 1px solid #111;
274
- border: 1px solid var(--fg);
275
- border-radius: 0;
276
- background-color: #fff;
277
- color: #111;
278
- color: var(--fg);
279
- transition: border-color 0.3s ease;
280
- }
272
+ padding: 0.5rem;
273
+ font-size: 1rem;
274
+ border: 1px solid #111;
275
+ border: 1px solid var(--fg);
276
+ border-radius: 0;
277
+ background-color: #fff;
278
+ color: #111;
279
+ color: var(--fg);
280
+ transition: border-color 0.3s ease;
281
+ }
281
282
 
282
283
  :host .form-group textarea {
283
- padding: 0.5rem;
284
- font-size: 1rem;
285
- border: 1px solid #111;
286
- border: 1px solid var(--fg);
287
- border-radius: 0;
288
- background-color: #fff;
289
- color: #111;
290
- color: var(--fg);
291
- transition: border-color 0.3s ease;
292
- }
284
+ padding: 0.5rem;
285
+ font-size: 1rem;
286
+ border: 1px solid #111;
287
+ border: 1px solid var(--fg);
288
+ border-radius: 0;
289
+ background-color: #fff;
290
+ color: #111;
291
+ color: var(--fg);
292
+ transition: border-color 0.3s ease;
293
+ }
293
294
 
294
295
  :root .form-group textarea {
295
- padding: 0.5rem;
296
- font-size: 1rem;
297
- border: 1px solid #111;
298
- border: 1px solid var(--fg);
299
- border-radius: 0;
300
- background-color: #fff;
301
- color: #111;
302
- color: var(--fg);
303
- transition: border-color 0.3s ease;
304
- }
296
+ padding: 0.5rem;
297
+ font-size: 1rem;
298
+ border: 1px solid #111;
299
+ border: 1px solid var(--fg);
300
+ border-radius: 0;
301
+ background-color: #fff;
302
+ color: #111;
303
+ color: var(--fg);
304
+ transition: border-color 0.3s ease;
305
+ }
305
306
 
306
307
  :host .go-field textarea {
307
- padding: 0.5rem;
308
- font-size: 1rem;
309
- border: 1px solid #111;
310
- border: 1px solid var(--fg);
311
- border-radius: 0;
312
- background-color: #fff;
313
- color: #111;
314
- color: var(--fg);
315
- transition: border-color 0.3s ease;
316
- }
308
+ padding: 0.5rem;
309
+ font-size: 1rem;
310
+ border: 1px solid #111;
311
+ border: 1px solid var(--fg);
312
+ border-radius: 0;
313
+ background-color: #fff;
314
+ color: #111;
315
+ color: var(--fg);
316
+ transition: border-color 0.3s ease;
317
+ }
317
318
 
318
319
  :root .go-field textarea {
319
- padding: 0.5rem;
320
- font-size: 1rem;
321
- border: 1px solid #111;
322
- border: 1px solid var(--fg);
323
- border-radius: 0;
324
- background-color: #fff;
325
- color: #111;
326
- color: var(--fg);
327
- transition: border-color 0.3s ease;
328
- }
320
+ padding: 0.5rem;
321
+ font-size: 1rem;
322
+ border: 1px solid #111;
323
+ border: 1px solid var(--fg);
324
+ border-radius: 0;
325
+ background-color: #fff;
326
+ color: #111;
327
+ color: var(--fg);
328
+ transition: border-color 0.3s ease;
329
+ }
329
330
 
330
331
  :host .form-group input:focus {
331
- border-color: #12826a;
332
- border-color: var(--primary);
333
- outline: 3px solid #12826a;
334
- outline: var(--outline-hover);
335
- }
332
+ border-color: #12826a;
333
+ border-color: var(--primary);
334
+ outline: 3px solid #12826a;
335
+ outline: var(--outline-hover);
336
+ }
336
337
 
337
338
  :root .form-group input:focus {
338
- border-color: #12826a;
339
- border-color: var(--primary);
340
- outline: 3px solid #12826a;
341
- outline: var(--outline-hover);
342
- }
339
+ border-color: #12826a;
340
+ border-color: var(--primary);
341
+ outline: 3px solid #12826a;
342
+ outline: var(--outline-hover);
343
+ }
343
344
 
344
345
  :host .go-field input:focus {
345
- border-color: #12826a;
346
- border-color: var(--primary);
347
- outline: 3px solid #12826a;
348
- outline: var(--outline-hover);
349
- }
346
+ border-color: #12826a;
347
+ border-color: var(--primary);
348
+ outline: 3px solid #12826a;
349
+ outline: var(--outline-hover);
350
+ }
350
351
 
351
352
  :root .go-field input:focus {
352
- border-color: #12826a;
353
- border-color: var(--primary);
354
- outline: 3px solid #12826a;
355
- outline: var(--outline-hover);
356
- }
353
+ border-color: #12826a;
354
+ border-color: var(--primary);
355
+ outline: 3px solid #12826a;
356
+ outline: var(--outline-hover);
357
+ }
357
358
 
358
359
  :host .form-group select:focus {
359
- border-color: #12826a;
360
- border-color: var(--primary);
361
- outline: 3px solid #12826a;
362
- outline: var(--outline-hover);
363
- }
360
+ border-color: #12826a;
361
+ border-color: var(--primary);
362
+ outline: 3px solid #12826a;
363
+ outline: var(--outline-hover);
364
+ }
364
365
 
365
366
  :root .form-group select:focus {
366
- border-color: #12826a;
367
- border-color: var(--primary);
368
- outline: 3px solid #12826a;
369
- outline: var(--outline-hover);
370
- }
367
+ border-color: #12826a;
368
+ border-color: var(--primary);
369
+ outline: 3px solid #12826a;
370
+ outline: var(--outline-hover);
371
+ }
371
372
 
372
373
  :host .go-field select:focus {
373
- border-color: #12826a;
374
- border-color: var(--primary);
375
- outline: 3px solid #12826a;
376
- outline: var(--outline-hover);
377
- }
374
+ border-color: #12826a;
375
+ border-color: var(--primary);
376
+ outline: 3px solid #12826a;
377
+ outline: var(--outline-hover);
378
+ }
378
379
 
379
380
  :root .go-field select:focus {
380
- border-color: #12826a;
381
- border-color: var(--primary);
382
- outline: 3px solid #12826a;
383
- outline: var(--outline-hover);
384
- }
381
+ border-color: #12826a;
382
+ border-color: var(--primary);
383
+ outline: 3px solid #12826a;
384
+ outline: var(--outline-hover);
385
+ }
385
386
 
386
387
  :host .form-group textarea:focus {
387
- border-color: #12826a;
388
- border-color: var(--primary);
389
- outline: 3px solid #12826a;
390
- outline: var(--outline-hover);
391
- }
388
+ border-color: #12826a;
389
+ border-color: var(--primary);
390
+ outline: 3px solid #12826a;
391
+ outline: var(--outline-hover);
392
+ }
392
393
 
393
394
  :root .form-group textarea:focus {
394
- border-color: #12826a;
395
- border-color: var(--primary);
396
- outline: 3px solid #12826a;
397
- outline: var(--outline-hover);
398
- }
395
+ border-color: #12826a;
396
+ border-color: var(--primary);
397
+ outline: 3px solid #12826a;
398
+ outline: var(--outline-hover);
399
+ }
399
400
 
400
401
  :host .go-field textarea:focus {
401
- border-color: #12826a;
402
- border-color: var(--primary);
403
- outline: 3px solid #12826a;
404
- outline: var(--outline-hover);
405
- }
402
+ border-color: #12826a;
403
+ border-color: var(--primary);
404
+ outline: 3px solid #12826a;
405
+ outline: var(--outline-hover);
406
+ }
406
407
 
407
408
  :root .go-field textarea:focus {
408
- border-color: #12826a;
409
- border-color: var(--primary);
410
- outline: 3px solid #12826a;
411
- outline: var(--outline-hover);
412
- }
409
+ border-color: #12826a;
410
+ border-color: var(--primary);
411
+ outline: 3px solid #12826a;
412
+ outline: var(--outline-hover);
413
+ }
413
414
 
414
415
  :host .form-group input:hover {
415
- border-color: #12826a;
416
- border-color: var(--primary);
417
- outline: 3px solid #12826a;
418
- outline: var(--outline-hover);
419
- }
416
+ border-color: #12826a;
417
+ border-color: var(--primary);
418
+ outline: 3px solid #12826a;
419
+ outline: var(--outline-hover);
420
+ }
420
421
 
421
422
  :root .form-group input:hover {
422
- border-color: #12826a;
423
- border-color: var(--primary);
424
- outline: 3px solid #12826a;
425
- outline: var(--outline-hover);
426
- }
423
+ border-color: #12826a;
424
+ border-color: var(--primary);
425
+ outline: 3px solid #12826a;
426
+ outline: var(--outline-hover);
427
+ }
427
428
 
428
429
  :host .go-field input:hover {
429
- border-color: #12826a;
430
- border-color: var(--primary);
431
- outline: 3px solid #12826a;
432
- outline: var(--outline-hover);
433
- }
430
+ border-color: #12826a;
431
+ border-color: var(--primary);
432
+ outline: 3px solid #12826a;
433
+ outline: var(--outline-hover);
434
+ }
434
435
 
435
436
  :root .go-field input:hover {
436
- border-color: #12826a;
437
- border-color: var(--primary);
438
- outline: 3px solid #12826a;
439
- outline: var(--outline-hover);
440
- }
437
+ border-color: #12826a;
438
+ border-color: var(--primary);
439
+ outline: 3px solid #12826a;
440
+ outline: var(--outline-hover);
441
+ }
441
442
 
442
443
  :host .form-group select:hover {
443
- border-color: #12826a;
444
- border-color: var(--primary);
445
- outline: 3px solid #12826a;
446
- outline: var(--outline-hover);
447
- }
444
+ border-color: #12826a;
445
+ border-color: var(--primary);
446
+ outline: 3px solid #12826a;
447
+ outline: var(--outline-hover);
448
+ }
448
449
 
449
450
  :root .form-group select:hover {
450
- border-color: #12826a;
451
- border-color: var(--primary);
452
- outline: 3px solid #12826a;
453
- outline: var(--outline-hover);
454
- }
451
+ border-color: #12826a;
452
+ border-color: var(--primary);
453
+ outline: 3px solid #12826a;
454
+ outline: var(--outline-hover);
455
+ }
455
456
 
456
457
  :host .go-field select:hover {
457
- border-color: #12826a;
458
- border-color: var(--primary);
459
- outline: 3px solid #12826a;
460
- outline: var(--outline-hover);
461
- }
458
+ border-color: #12826a;
459
+ border-color: var(--primary);
460
+ outline: 3px solid #12826a;
461
+ outline: var(--outline-hover);
462
+ }
462
463
 
463
464
  :root .go-field select:hover {
464
- border-color: #12826a;
465
- border-color: var(--primary);
466
- outline: 3px solid #12826a;
467
- outline: var(--outline-hover);
468
- }
465
+ border-color: #12826a;
466
+ border-color: var(--primary);
467
+ outline: 3px solid #12826a;
468
+ outline: var(--outline-hover);
469
+ }
469
470
 
470
471
  :host .form-group textarea:hover {
471
- border-color: #12826a;
472
- border-color: var(--primary);
473
- outline: 3px solid #12826a;
474
- outline: var(--outline-hover);
475
- }
472
+ border-color: #12826a;
473
+ border-color: var(--primary);
474
+ outline: 3px solid #12826a;
475
+ outline: var(--outline-hover);
476
+ }
476
477
 
477
478
  :root .form-group textarea:hover {
478
- border-color: #12826a;
479
- border-color: var(--primary);
480
- outline: 3px solid #12826a;
481
- outline: var(--outline-hover);
482
- }
479
+ border-color: #12826a;
480
+ border-color: var(--primary);
481
+ outline: 3px solid #12826a;
482
+ outline: var(--outline-hover);
483
+ }
483
484
 
484
485
  :host .go-field textarea:hover {
485
- border-color: #12826a;
486
- border-color: var(--primary);
487
- outline: 3px solid #12826a;
488
- outline: var(--outline-hover);
489
- }
486
+ border-color: #12826a;
487
+ border-color: var(--primary);
488
+ outline: 3px solid #12826a;
489
+ outline: var(--outline-hover);
490
+ }
490
491
 
491
492
  :root .go-field textarea:hover {
492
- border-color: #12826a;
493
- border-color: var(--primary);
494
- outline: 3px solid #12826a;
495
- outline: var(--outline-hover);
496
- }
493
+ border-color: #12826a;
494
+ border-color: var(--primary);
495
+ outline: 3px solid #12826a;
496
+ outline: var(--outline-hover);
497
+ }
497
498
 
498
499
  :host .form-group input:active {
499
- border-color: #12826a;
500
- border-color: var(--primary);
501
- outline: 3px solid #12826a;
502
- outline: var(--outline-hover);
503
- }
500
+ border-color: #12826a;
501
+ border-color: var(--primary);
502
+ outline: 3px solid #12826a;
503
+ outline: var(--outline-hover);
504
+ }
504
505
 
505
506
  :root .form-group input:active {
506
- border-color: #12826a;
507
- border-color: var(--primary);
508
- outline: 3px solid #12826a;
509
- outline: var(--outline-hover);
510
- }
507
+ border-color: #12826a;
508
+ border-color: var(--primary);
509
+ outline: 3px solid #12826a;
510
+ outline: var(--outline-hover);
511
+ }
511
512
 
512
513
  :host .go-field input:active {
513
- border-color: #12826a;
514
- border-color: var(--primary);
515
- outline: 3px solid #12826a;
516
- outline: var(--outline-hover);
517
- }
514
+ border-color: #12826a;
515
+ border-color: var(--primary);
516
+ outline: 3px solid #12826a;
517
+ outline: var(--outline-hover);
518
+ }
518
519
 
519
520
  :root .go-field input:active {
520
- border-color: #12826a;
521
- border-color: var(--primary);
522
- outline: 3px solid #12826a;
523
- outline: var(--outline-hover);
524
- }
521
+ border-color: #12826a;
522
+ border-color: var(--primary);
523
+ outline: 3px solid #12826a;
524
+ outline: var(--outline-hover);
525
+ }
525
526
 
526
527
  :host .form-group select:active {
527
- border-color: #12826a;
528
- border-color: var(--primary);
529
- outline: 3px solid #12826a;
530
- outline: var(--outline-hover);
531
- }
528
+ border-color: #12826a;
529
+ border-color: var(--primary);
530
+ outline: 3px solid #12826a;
531
+ outline: var(--outline-hover);
532
+ }
532
533
 
533
534
  :root .form-group select:active {
534
- border-color: #12826a;
535
- border-color: var(--primary);
536
- outline: 3px solid #12826a;
537
- outline: var(--outline-hover);
538
- }
535
+ border-color: #12826a;
536
+ border-color: var(--primary);
537
+ outline: 3px solid #12826a;
538
+ outline: var(--outline-hover);
539
+ }
539
540
 
540
541
  :host .go-field select:active {
541
- border-color: #12826a;
542
- border-color: var(--primary);
543
- outline: 3px solid #12826a;
544
- outline: var(--outline-hover);
545
- }
542
+ border-color: #12826a;
543
+ border-color: var(--primary);
544
+ outline: 3px solid #12826a;
545
+ outline: var(--outline-hover);
546
+ }
546
547
 
547
548
  :root .go-field select:active {
548
- border-color: #12826a;
549
- border-color: var(--primary);
550
- outline: 3px solid #12826a;
551
- outline: var(--outline-hover);
552
- }
549
+ border-color: #12826a;
550
+ border-color: var(--primary);
551
+ outline: 3px solid #12826a;
552
+ outline: var(--outline-hover);
553
+ }
553
554
 
554
555
  :host .form-group textarea:active {
555
- border-color: #12826a;
556
- border-color: var(--primary);
557
- outline: 3px solid #12826a;
558
- outline: var(--outline-hover);
559
- }
556
+ border-color: #12826a;
557
+ border-color: var(--primary);
558
+ outline: 3px solid #12826a;
559
+ outline: var(--outline-hover);
560
+ }
560
561
 
561
562
  :root .form-group textarea:active {
562
- border-color: #12826a;
563
- border-color: var(--primary);
564
- outline: 3px solid #12826a;
565
- outline: var(--outline-hover);
566
- }
563
+ border-color: #12826a;
564
+ border-color: var(--primary);
565
+ outline: 3px solid #12826a;
566
+ outline: var(--outline-hover);
567
+ }
567
568
 
568
569
  :host .go-field textarea:active {
569
- border-color: #12826a;
570
- border-color: var(--primary);
571
- outline: 3px solid #12826a;
572
- outline: var(--outline-hover);
573
- }
570
+ border-color: #12826a;
571
+ border-color: var(--primary);
572
+ outline: 3px solid #12826a;
573
+ outline: var(--outline-hover);
574
+ }
574
575
 
575
576
  :root .go-field textarea:active {
576
- border-color: #12826a;
577
- border-color: var(--primary);
578
- outline: 3px solid #12826a;
579
- outline: var(--outline-hover);
580
- }
577
+ border-color: #12826a;
578
+ border-color: var(--primary);
579
+ outline: 3px solid #12826a;
580
+ outline: var(--outline-hover);
581
+ }
581
582
 
582
583
  :host .form-group .error {
583
- color: red;
584
- font-size: 0.875rem;
585
- margin-top: 0.25rem;
586
- }
584
+ color: red;
585
+ font-size: 0.875rem;
586
+ margin-top: 0.25rem;
587
+ }
587
588
 
588
589
  :root .form-group .error {
589
- color: red;
590
- font-size: 0.875rem;
591
- margin-top: 0.25rem;
592
- }
590
+ color: red;
591
+ font-size: 0.875rem;
592
+ margin-top: 0.25rem;
593
+ }
593
594
 
594
595
  :host .go-field .error {
595
- color: red;
596
- font-size: 0.875rem;
597
- margin-top: 0.25rem;
598
- }
596
+ color: red;
597
+ font-size: 0.875rem;
598
+ margin-top: 0.25rem;
599
+ }
599
600
 
600
601
  :root .go-field .error {
601
- color: red;
602
- font-size: 0.875rem;
603
- margin-top: 0.25rem;
604
- }
602
+ color: red;
603
+ font-size: 0.875rem;
604
+ margin-top: 0.25rem;
605
+ }
605
606
 
606
607
  :host .form-group .success {
607
- margin-top: 1rem;
608
- color: green;
609
- font-weight: bold;
610
- }
608
+ margin-top: 1rem;
609
+ color: green;
610
+ font-weight: bold;
611
+ }
611
612
 
612
613
  :root .form-group .success {
613
- margin-top: 1rem;
614
- color: green;
615
- font-weight: bold;
616
- }
614
+ margin-top: 1rem;
615
+ color: green;
616
+ font-weight: bold;
617
+ }
617
618
 
618
619
  :host .go-field .success {
619
- margin-top: 1rem;
620
- color: green;
621
- font-weight: bold;
622
- }
620
+ margin-top: 1rem;
621
+ color: green;
622
+ font-weight: bold;
623
+ }
623
624
 
624
625
  :root .go-field .success {
625
- margin-top: 1rem;
626
- color: green;
627
- font-weight: bold;
628
- }
626
+ margin-top: 1rem;
627
+ color: green;
628
+ font-weight: bold;
629
+ }
629
630
 
630
631
  :host ul {
631
- list-style: none;
632
- padding: 0;
633
- margin: 0;
634
- }
632
+ list-style: none;
633
+ padding: 0;
634
+ margin: 0;
635
+ }
635
636
 
636
637
  :root ul {
637
- list-style: none;
638
- padding: 0;
639
- margin: 0;
640
- }
638
+ list-style: none;
639
+ padding: 0;
640
+ margin: 0;
641
+ }
641
642
 
642
643
  :host .go-field-errors {
643
- color: red;
644
- font-size: 0.875rem;
645
- margin-top: 0.25rem;
646
- min-height: 1rem;
647
- min-height: 1lh;
648
- }
644
+ color: red;
645
+ font-size: 0.875rem;
646
+ margin-top: 0.25rem;
647
+ min-height: 1rem;
648
+ min-height: 1lh;
649
+ }
649
650
 
650
651
  :root .go-field-errors {
651
- color: red;
652
- font-size: 0.875rem;
653
- margin-top: 0.25rem;
654
- min-height: 1rem;
655
- min-height: 1lh;
656
- }
652
+ color: red;
653
+ font-size: 0.875rem;
654
+ margin-top: 0.25rem;
655
+ min-height: 1rem;
656
+ min-height: 1lh;
657
+ }
657
658
 
658
659
  :host .go-field-errors > li {
659
- margin-top: 0.25rem;
660
- }
660
+ margin-top: 0.25rem;
661
+ }
661
662
 
662
663
  :root .go-field-errors > li {
663
- margin-top: 0.25rem;
664
- }
664
+ margin-top: 0.25rem;
665
+ }
665
666
 
666
667
  :host .go-field-star {
667
- color: red;
668
- font-size: 0.875rem;
669
- margin-left: 0.25rem;
670
- }
668
+ color: red;
669
+ font-size: 0.875rem;
670
+ margin-left: 0.25rem;
671
+ }
671
672
 
672
673
  :root .go-field-star {
673
- color: red;
674
- font-size: 0.875rem;
675
- margin-left: 0.25rem;
676
- }
674
+ color: red;
675
+ font-size: 0.875rem;
676
+ margin-left: 0.25rem;
677
+ }
677
678
 
678
679
  :host .sr-only {
679
- position: absolute;
680
- width: 1px;
681
- height: 1px;
682
- padding: 0;
683
- margin: -1px;
684
- overflow: hidden;
685
- clip: rect(0, 0, 0, 0);
686
- white-space: nowrap;
687
- border-width: 0;
688
- }
680
+ position: absolute;
681
+ width: 1px;
682
+ height: 1px;
683
+ padding: 0;
684
+ margin: -1px;
685
+ overflow: hidden;
686
+ clip: rect(0, 0, 0, 0);
687
+ white-space: nowrap;
688
+ border-width: 0;
689
+ }
689
690
 
690
691
  :root .sr-only {
691
- position: absolute;
692
- width: 1px;
693
- height: 1px;
694
- padding: 0;
695
- margin: -1px;
696
- overflow: hidden;
697
- clip: rect(0, 0, 0, 0);
698
- white-space: nowrap;
699
- border-width: 0;
700
- }
692
+ position: absolute;
693
+ width: 1px;
694
+ height: 1px;
695
+ padding: 0;
696
+ margin: -1px;
697
+ overflow: hidden;
698
+ clip: rect(0, 0, 0, 0);
699
+ white-space: nowrap;
700
+ border-width: 0;
701
+ }
701
702
 
702
703
  :host .go-feedback {
703
- margin-bottom: 1rem;
704
- margin-top: 2rem;
705
- padding: 0.5rem;
706
- }
704
+ margin-bottom: 1rem;
705
+ margin-top: 2rem;
706
+ padding: 0.5rem;
707
+ }
707
708
 
708
709
  :root .go-feedback {
709
- margin-bottom: 1rem;
710
- margin-top: 2rem;
711
- padding: 0.5rem;
712
- }
710
+ margin-bottom: 1rem;
711
+ margin-top: 2rem;
712
+ padding: 0.5rem;
713
+ }
713
714
 
714
715
  :host .go-feedback p {
715
- margin: 0;
716
- }
716
+ margin: 0;
717
+ }
717
718
 
718
719
  :root .go-feedback p {
719
- margin: 0;
720
- }
720
+ margin: 0;
721
+ }
721
722
 
722
723
  :host .go-feedback.is-invalid {
723
- background-color: #fff0f0;
724
- background-color: var(--light-red);
725
- border-left: 4px solid red;
726
- border-left: var(--invalid-border);
727
- }
724
+ background-color: #fff0f0;
725
+ background-color: var(--light-red);
726
+ border-left: 4px solid red;
727
+ border-left: var(--invalid-border);
728
+ }
728
729
 
729
730
  :root .go-feedback.is-invalid {
730
- background-color: #fff0f0;
731
- background-color: var(--light-red);
732
- border-left: 4px solid red;
733
- border-left: var(--invalid-border);
734
- }
731
+ background-color: #fff0f0;
732
+ background-color: var(--light-red);
733
+ border-left: 4px solid red;
734
+ border-left: var(--invalid-border);
735
+ }
735
736
 
736
737
  :host .go-feedback.is-successful {
737
- background-color: #f0fff0;
738
- border-left: 4px solid #3c763d;
739
- }
738
+ background-color: #f0fff0;
739
+ border-left: 4px solid #3c763d;
740
+ }
740
741
 
741
742
  :root .go-feedback.is-successful {
742
- background-color: #f0fff0;
743
- border-left: 4px solid #3c763d;
744
- }
743
+ background-color: #f0fff0;
744
+ border-left: 4px solid #3c763d;
745
+ }
745
746
 
746
747
  :host a {
747
- color: #12826a;
748
- color: var(--primary);
749
- }
748
+ color: #12826a;
749
+ color: var(--primary);
750
+ }
750
751
 
751
752
  :root a {
752
- color: #12826a;
753
- color: var(--primary);
754
- }
753
+ color: #12826a;
754
+ color: var(--primary);
755
+ }
755
756
 
756
757
  :host button {
757
- margin-top: 2rem;
758
- background-color: #12826a;
759
- background-color: var(--primary);
760
- color: white;
761
- font-size: 1rem;
762
- padding: 20px 60px;
763
- border: none;
764
- border-radius: 0;
765
- cursor: pointer;
766
- transition: background-color 0.3s ease;
767
- }
758
+ margin-top: 2rem;
759
+ background-color: #12826a;
760
+ background-color: var(--primary);
761
+ color: white;
762
+ font-size: 1rem;
763
+ padding: 20px 60px;
764
+ border: none;
765
+ border-radius: 0;
766
+ cursor: pointer;
767
+ transition: background-color 0.3s ease;
768
+ }
768
769
 
769
770
  :root button {
770
- margin-top: 2rem;
771
- background-color: #12826a;
772
- background-color: var(--primary);
773
- color: white;
774
- font-size: 1rem;
775
- padding: 20px 60px;
776
- border: none;
777
- border-radius: 0;
778
- cursor: pointer;
779
- transition: background-color 0.3s ease;
780
- }
771
+ margin-top: 2rem;
772
+ background-color: #12826a;
773
+ background-color: var(--primary);
774
+ color: white;
775
+ font-size: 1rem;
776
+ padding: 20px 60px;
777
+ border: none;
778
+ border-radius: 0;
779
+ cursor: pointer;
780
+ transition: background-color 0.3s ease;
781
+ }
781
782
 
782
783
  :host .button-primary {
783
- margin-top: 2rem;
784
- background-color: #12826a;
785
- background-color: var(--primary);
786
- color: white;
787
- font-size: 1rem;
788
- padding: 20px 60px;
789
- border: none;
790
- border-radius: 0;
791
- cursor: pointer;
792
- transition: background-color 0.3s ease;
793
- }
784
+ margin-top: 2rem;
785
+ background-color: #12826a;
786
+ background-color: var(--primary);
787
+ color: white;
788
+ font-size: 1rem;
789
+ padding: 20px 60px;
790
+ border: none;
791
+ border-radius: 0;
792
+ cursor: pointer;
793
+ transition: background-color 0.3s ease;
794
+ }
794
795
 
795
796
  :root .button-primary {
796
- margin-top: 2rem;
797
- background-color: #12826a;
798
- background-color: var(--primary);
799
- color: white;
800
- font-size: 1rem;
801
- padding: 20px 60px;
802
- border: none;
803
- border-radius: 0;
804
- cursor: pointer;
805
- transition: background-color 0.3s ease;
806
- }
797
+ margin-top: 2rem;
798
+ background-color: #12826a;
799
+ background-color: var(--primary);
800
+ color: white;
801
+ font-size: 1rem;
802
+ padding: 20px 60px;
803
+ border: none;
804
+ border-radius: 0;
805
+ cursor: pointer;
806
+ transition: background-color 0.3s ease;
807
+ }
807
808
 
808
809
  :host button:hover {
809
- background-color: #125948;
810
- }
810
+ background-color: #125948;
811
+ }
811
812
 
812
813
  :root button:hover {
813
- background-color: #125948;
814
- }
814
+ background-color: #125948;
815
+ }
815
816
 
816
817
  :host img {
817
- max-width: 100%;
818
- max-height: 100%;
819
- }
818
+ max-width: 100%;
819
+ max-height: 100%;
820
+ }
820
821
 
821
822
  /*CALENDARUI CSS*/
822
823
 
823
824
  [data-calendar-wrapper] {
824
- max-width: 650px;
825
+ max-width: 650px;
825
826
  }
826
827
 
827
828
  [data-calendar-wrapper] [data-calendar-prev-button],[data-calendar-wrapper] [data-calendar-next-button] {
828
- padding: 5px !important;
829
- background-color: transparent !important;
830
- border: none !important;
831
- font-size: 1rem !important;
832
- color: black !important;
833
- margin-top: 0px !important;
834
- }
829
+ padding: 5px !important;
830
+ background-color: transparent !important;
831
+ border: none !important;
832
+ font-size: 1rem !important;
833
+ color: black !important;
834
+ margin-top: 0px !important;
835
+ }
835
836
 
836
837
  [data-calendar-wrapper] [data-calendar-cell] {
837
- margin: auto;
838
- border: 1px solid transparent;
839
- }
838
+ margin: auto;
839
+ border: 1px solid transparent;
840
+ }
840
841
 
841
842
  [data-calendar-wrapper] [data-calendar-cell]:hover {
842
- border: 1px solid #12826a;
843
- border: 1px solid var(--primary);
844
- outline: 3px solid #12826a;
845
- outline: var(--outline-hover);
846
- }
843
+ border: 1px solid #12826a;
844
+ border: 1px solid var(--primary);
845
+ outline: 3px solid #12826a;
846
+ outline: var(--outline-hover);
847
+ }
847
848
 
848
849
  [data-calendar-wrapper] [data-calendar-cell] {
849
- text-align: -webkit-center;
850
- text-align: -moz-center;
851
- }
850
+ text-align: -webkit-center;
851
+ text-align: -moz-center;
852
+ }
852
853
 
853
854
  [data-calendar-wrapper] [data-bits-day] {
854
- display: flex;
855
- height: 1.5rem;
856
- width: 1.5rem;
857
- cursor: pointer;
858
- -webkit-user-select: none;
859
- -moz-user-select: none;
860
- user-select: none;
861
- align-items: center;
862
- justify-content: center;
863
- border-radius: 0;
864
- padding: 1rem;
865
- }
855
+ display: flex;
856
+ height: 1.5rem;
857
+ width: 1.5rem;
858
+ cursor: pointer;
859
+ -webkit-user-select: none;
860
+ -moz-user-select: none;
861
+ user-select: none;
862
+ align-items: center;
863
+ justify-content: center;
864
+ border-radius: 0;
865
+ padding: 1rem;
866
+ }
866
867
 
867
868
  [data-calendar-wrapper] [data-calendar-header] {
868
- display: flex;
869
- padding: 20px 10px;
870
- }
869
+ display: flex;
870
+ padding: 20px 10px;
871
+ }
871
872
 
872
873
  [data-calendar-wrapper] [data-calendar-heading] {
873
- font-weight: 700;
874
- font-size: 1.125rem;
875
- line-height: 1.5;
876
- flex-grow: 1;
877
- padding: 0 5px;
878
- text-align: center;
879
- }
874
+ font-weight: 700;
875
+ font-size: 1.125rem;
876
+ line-height: 1.5;
877
+ flex-grow: 1;
878
+ padding: 0 5px;
879
+ text-align: center;
880
+ }
880
881
 
881
882
  [data-calendar-wrapper] [data-calendar-grid] {
882
- width: 100%;
883
- padding: 5px 6px 7px 6px;
884
- }
883
+ width: 100%;
884
+ padding: 5px 6px 7px 6px;
885
+ }
885
886
 
886
887
  [data-calendar-wrapper] [data-calendar-grid-row] {
887
- display: grid;
888
- grid-template-columns: repeat(7, 1fr);
889
- grid-gap: 8px;
890
- gap: 8px;
891
- padding: 10px 5px;
892
- }
888
+ display: grid;
889
+ grid-template-columns: repeat(7, 1fr);
890
+ grid-gap: 8px;
891
+ gap: 8px;
892
+ padding: 10px 5px;
893
+ }
893
894
 
894
895
  [data-calendar-wrapper] [data-calendar-cell] {
895
- display: flex;
896
- justify-content: center;
897
- align-items: center;
898
- font-size: 1rem;
899
- font-weight: 500;
900
- border-radius: 0;
901
- width: 28px;
902
- height: 28px;
903
- }
896
+ display: flex;
897
+ justify-content: center;
898
+ align-items: center;
899
+ font-size: 1rem;
900
+ font-weight: 500;
901
+ border-radius: 0;
902
+ width: 28px;
903
+ height: 28px;
904
+ }
904
905
 
905
906
  [data-calendar-wrapper] [data-calendar-root] {
906
- padding: 1.25rem;
907
- border: 1px solid #12826a;
908
- border: 1px solid var(--primary);
909
- border-radius: 0rem;
910
- }
907
+ padding: 1.25rem;
908
+ border: 1px solid #12826a;
909
+ border: 1px solid var(--primary);
910
+ border-radius: 0rem;
911
+ }
911
912
 
912
913
  [data-calendar-wrapper] [data-calendar-cell][data-unavailable] {
913
- color: #999;
914
- pointer-events: none;
915
- }
914
+ color: #999;
915
+ pointer-events: none;
916
+ }
916
917
 
917
918
  [data-calendar-wrapper] [data-calendar-cell][data-disabled] {
918
- color: #999;
919
- pointer-events: none;
920
- }
919
+ color: #999;
920
+ pointer-events: none;
921
+ }
921
922
 
922
923
  [data-calendar-wrapper] [data-calendar-cell][data-selected] {
923
- color: #ffffff;
924
- background-color: #12826a;
925
- background-color: var(--primary);
926
- outline: 3px solid #12826a;
927
- outline: var(--outline-hover);
928
- }
924
+ color: #ffffff;
925
+ background-color: #12826a;
926
+ background-color: var(--primary);
927
+ outline: 3px solid #12826a;
928
+ outline: var(--outline-hover);
929
+ }
929
930
 
930
931
  [data-calendar-wrapper] [data-calendar-cell][data-today] {
931
- border: 1px solid #12826a;
932
- border: 1px solid var(--primary);
933
- outline: 3px solid #12826a;
934
- outline: var(--outline-hover);
935
- }
932
+ border: 1px solid #12826a;
933
+ border: 1px solid var(--primary);
934
+ outline: 3px solid #12826a;
935
+ outline: var(--outline-hover);
936
+ }
936
937
 
937
938
  /*END CALENDARUI CSS*/
938
939
 
939
940
  go-timeslots > ul {
940
- max-width: 650px;
941
- list-style: none;
942
- padding: 0;
943
- margin: 0;
944
- display: grid;
945
- grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
941
+ max-width: 650px;
942
+ list-style: none;
943
+ padding: 0;
944
+ margin: 0;
945
+ display: grid;
946
+ grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
946
947
  }
947
948
 
948
949
  go-timeslots > ul li {
949
- margin: 5px;
950
- display: flex;
951
- }
950
+ margin: 5px;
951
+ display: flex;
952
+ }
952
953
 
953
954
  go-timeslots > ul label {
954
- display: inline-block;
955
- padding: 10px 20px;
956
- border: 1px solid #ddd;
957
- border-radius: 0px;
958
- cursor: pointer;
959
- transition: background-color 0.3s, border-color 0.3s;
960
-
961
- flex: 1 0 auto;
962
- text-align: center;
963
- }
955
+ display: inline-block;
956
+ padding: 10px 20px;
957
+ border: 1px solid #ddd;
958
+ border-radius: 0px;
959
+ cursor: pointer;
960
+ transition:
961
+ background-color 0.3s, border-color 0.3s;
962
+
963
+ flex: 1 0 auto;
964
+ text-align: center;
965
+ }
964
966
 
965
967
  /* Available timeslot */
966
968
 
967
969
  go-timeslots > ul input[type='radio'] {
968
- display: none; /* Hide the radio button */
969
- }
970
+ display: none; /* Hide the radio button */
971
+ }
970
972
 
971
973
  /* When a timeslot is selected (checked radio button) */
972
974
 
973
975
  go-timeslots > ul label:has(input[type='radio']:checked) {
974
- background-color: #12826a;
975
- background-color: var(--primary); /* blue-green color */
976
- border-color: #12826a;
977
- border-color: var(--primary);
978
- color: white;
979
- outline: 3px solid #12826a;
980
- outline: var(--outline-hover);
981
- }
976
+ background-color: #12826a;
977
+ background-color: var(--primary); /* blue-green color */
978
+ border-color: #12826a;
979
+ border-color: var(--primary);
980
+ color: white;
981
+ outline: 3px solid #12826a;
982
+ outline: var(--outline-hover);
983
+ }
982
984
 
983
985
  /* Finished (unavailable) timeslot */
984
986
 
985
987
  go-timeslots > ul .is-sold-out,go-timeslots > ul .is-disabled {
986
- background-color: #f0f0f0;
987
- color: #999;
988
- pointer-events: none;
989
- }
988
+ background-color: #f0f0f0;
989
+ color: #999;
990
+ pointer-events: none;
991
+ }
990
992
 
991
993
  go-timeslots > ul .is-sold-out input,go-timeslots > ul .is-disabled input {
992
- display: none;
993
- }
994
+ display: none;
995
+ }
994
996
 
995
997
  /* Disabled radio button appearance */
996
998
 
997
999
  go-timeslots > ul input:disabled + label {
998
- background-color: #e0e0e0;
999
- color: #bbb;
1000
- cursor: not-allowed;
1001
- border-color: #ddd;
1002
- }
1000
+ background-color: #e0e0e0;
1001
+ color: #bbb;
1002
+ cursor: not-allowed;
1003
+ border-color: #ddd;
1004
+ }
1003
1005
 
1004
1006
  go-timeslots > ul label:hover {
1005
- /*background-color: #f0f0f0;*/
1006
- border-color: #12826a;
1007
- border-color: var(--primary);
1008
- outline: 3px solid #12826a;
1009
- outline: var(--outline-hover);
1010
- }
1007
+ /*background-color: #f0f0f0;*/
1008
+ border-color: #12826a;
1009
+ border-color: var(--primary);
1010
+ outline: 3px solid #12826a;
1011
+ outline: var(--outline-hover);
1012
+ }
1011
1013
 
1012
1014
  /* Focus state for better accessibility */
1013
1015
 
1014
1016
  go-timeslots > ul input:focus + label {
1015
- outline: 2px solid #0052cc;
1016
- }
1017
+ outline: 2px solid #0052cc;
1018
+ }
1017
1019
 
1018
1020
  go-tickets {
1019
- /*// Tweak these numbers to change column ratios (must match header + rows)*/
1020
- --col-title: 2;
1021
- --col-desc: 4;
1022
- --col-price: 1;
1023
- --col-qty: 1;
1021
+ /*// Tweak these numbers to change column ratios (must match header + rows)*/
1022
+ --col-title: 2;
1023
+ --col-desc: 4;
1024
+ --col-price: 1;
1025
+ --col-qty: 1;
1024
1026
  }
1025
1027
 
1026
1028
  go-tickets ol.go-tickets {
1027
- margin: 0;
1028
- padding: 0;
1029
- list-style: none;
1029
+ margin: 0;
1030
+ padding: 0;
1031
+ list-style: none;
1030
1032
 
1031
- /*// Header row*/
1032
- }
1033
+ /*// Header row*/
1034
+ }
1033
1035
 
1034
1036
  go-tickets ol.go-tickets > .go-tickets-header {
1035
- top: 0;
1036
- background: inherit;
1037
- }
1037
+ top: 0;
1038
+ background: inherit;
1039
+ }
1038
1040
 
1039
1041
  go-tickets ol.go-tickets > .go-tickets-header > ul {
1040
- display: flex;
1041
- align-items: center;
1042
- gap: 1rem;
1043
- padding: 0.5rem 0;
1044
- border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1045
- font-weight: 600;
1046
- }
1042
+ display: flex;
1043
+ align-items: center;
1044
+ gap: 1rem;
1045
+ padding: 0.5rem 0;
1046
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1047
+ font-weight: 600;
1048
+ }
1047
1049
 
1048
1050
  go-tickets ol.go-tickets > .go-tickets-header > ul > li {
1049
- list-style: none;
1050
- /*// allow truncation*/
1051
- min-width: 0;
1052
- }
1051
+ list-style: none;
1052
+ /*// allow truncation*/
1053
+ min-width: 0;
1054
+ }
1053
1055
 
1054
1056
  go-tickets ol.go-tickets > .go-tickets-header > ul > li:first-child {
1055
- padding-left: 0;
1056
- }
1057
+ padding-left: 0;
1058
+ }
1057
1059
 
1058
1060
  go-tickets ol.go-tickets > .go-tickets-header > ul .go-tickets-header-title {
1059
- flex: var(--col-title) 0 0;
1060
- }
1061
+ flex: var(--col-title) 0 0;
1062
+ }
1061
1063
 
1062
1064
  go-tickets ol.go-tickets > .go-tickets-header > ul .go-tickets-description {
1063
- flex: var(--col-desc) 0 0;
1064
- }
1065
+ flex: var(--col-desc) 0 0;
1066
+ }
1065
1067
 
1066
1068
  go-tickets ol.go-tickets > .go-tickets-header > ul .go-tickets-price {
1067
- flex: var(--col-price) 0 0;
1068
- text-align: right;
1069
- }
1069
+ flex: var(--col-price) 0 0;
1070
+ text-align: right;
1071
+ }
1070
1072
 
1071
1073
  go-tickets ol.go-tickets > .go-tickets-header > ul .go-tickets-quality {
1072
- flex: var(--col-qty) 0 0;
1073
- text-align: right;
1074
- }
1074
+ flex: var(--col-qty) 0 0;
1075
+ text-align: right;
1076
+ }
1075
1077
 
1076
1078
  /*// Data rows*/
1077
1079
 
1078
1080
  go-tickets ol.go-tickets > li {
1079
- list-style: none;
1080
- }
1081
+ list-style: none;
1082
+ }
1081
1083
 
1082
1084
  go-tickets ol.go-tickets > li > article.go-tickets-item > ul {
1083
- display: flex;
1084
- align-items: center;
1085
- gap: 1rem;
1086
- padding: 0.75rem 0;
1087
- border-bottom: 1px solid rgba(0, 0, 0, 0.06);
1088
- }
1085
+ display: flex;
1086
+ align-items: center;
1087
+ gap: 1rem;
1088
+ padding: 0.75rem 0;
1089
+ border-bottom: 1px solid rgba(0, 0, 0, 0.06);
1090
+ }
1089
1091
 
1090
1092
  go-tickets ol.go-tickets > li > article.go-tickets-item > ul > li {
1091
- list-style: none;
1092
- /*// enable text truncation*/
1093
- min-width: 0;
1094
- /*// Optional: single-line truncation (comment out if you want wrapping)*/
1095
- /*white-space: ;*/
1096
- /*overflow: hidden;*/
1097
- /*text-overflow: ellipsis;*/
1098
- }
1093
+ list-style: none;
1094
+ /*// enable text truncation*/
1095
+ min-width: 0;
1096
+ /*// Optional: single-line truncation (comment out if you want wrapping)*/
1097
+ /*white-space: ;*/
1098
+ /*overflow: hidden;*/
1099
+ /*text-overflow: ellipsis;*/
1100
+ }
1099
1101
 
1100
1102
  go-tickets ol.go-tickets > li > article.go-tickets-item > ul .go-tickets-item-title {
1101
- flex: var(--col-title) 0 0;
1102
- }
1103
+ flex: var(--col-title) 0 0;
1104
+ }
1103
1105
 
1104
1106
  go-tickets ol.go-tickets > li > article.go-tickets-item > ul .go-tickets-item-description {
1105
- flex: var(--col-desc) 0 0;
1106
- }
1107
+ flex: var(--col-desc) 0 0;
1108
+ }
1107
1109
 
1108
1110
  go-tickets ol.go-tickets > li > article.go-tickets-item > ul .go-tickets-item-price {
1109
- flex: var(--col-price) 0 0;
1110
- text-align: right;
1111
- }
1111
+ flex: var(--col-price) 0 0;
1112
+ text-align: right;
1113
+ }
1112
1114
 
1113
1115
  go-tickets ol.go-tickets > li > article.go-tickets-item > ul .go-tickets-item-quality {
1114
- flex: var(--col-qty) 0 0;
1115
- text-align: right;
1116
- }
1116
+ flex: var(--col-qty) 0 0;
1117
+ text-align: right;
1118
+ }
1117
1119
 
1118
1120
  go-tickets ol.go-tickets > li > article.go-tickets-item > ul .go-tickets-item-quality select {
1119
- /*// keeps the quantity control aligned but not stretched*/
1120
- margin-left: auto;
1121
- /*// adjust as needed*/
1122
- max-width: 8rem;
1123
-
1124
- min-width: 4rem;
1125
- min-height: 2rem;
1126
- width: auto;
1127
- }
1121
+ /*// keeps the quantity control aligned but not stretched*/
1122
+ margin-left: auto;
1123
+ /*// adjust as needed*/
1124
+ max-width: 8rem;
1125
+
1126
+ min-width: 4rem;
1127
+ min-height: 2rem;
1128
+ width: auto;
1129
+ }
1128
1130
 
1129
1131
  go-tickets go-ticket-segment.is-empty .sum-container {
1130
- display: none;
1131
- }
1132
+ display: none;
1133
+ }
1132
1134
 
1133
1135
  /*=== CART ===*/
1134
1136
  go-cart {
1135
- display: block;
1137
+ display: block;
1136
1138
  }
1137
- go-cart ul,go-cart ol{
1139
+ go-cart ul,go-cart ol {
1138
1140
  margin: 0;
1139
1141
  padding: 0;
1140
1142
  list-style: none;
1141
-
1142
- }
1143
+ }
1143
1144
 
1144
1145
  /* Header row */
1145
1146
  .go-cart-header {
1146
- background: inherit;
1147
- padding: 0.5rem 0;
1147
+ background: inherit;
1148
+ padding: 0.5rem 0;
1148
1149
  }
1149
1150
  .go-cart-header > ul {
1150
- display: flex;
1151
- gap: 1rem;
1152
- font-weight: 600;
1153
- border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1154
- padding: 0.5rem 0;
1155
- }
1151
+ display: flex;
1152
+ gap: 1rem;
1153
+ font-weight: 600;
1154
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1155
+ padding: 0.5rem 0;
1156
+ }
1156
1157
  .go-cart-header > ul > li {
1157
- list-style: none;
1158
- min-width: 0;
1159
- }
1158
+ list-style: none;
1159
+ min-width: 0;
1160
+ }
1160
1161
  .go-cart-header > ul .go-cart-header-title {
1161
- flex: 2;
1162
- }
1162
+ flex: 2;
1163
+ }
1163
1164
  .go-cart-header > ul .go-cart-header-price {
1164
- flex: 1;
1165
- text-align: right;
1166
- }
1165
+ flex: 1;
1166
+ text-align: right;
1167
+ }
1167
1168
  .go-cart-header > ul .go-cart-header-count {
1168
- flex: 1;
1169
- text-align: right;
1170
- }
1169
+ flex: 1;
1170
+ text-align: right;
1171
+ }
1171
1172
  .go-cart-header > ul .go-cart-header-remove {
1172
- flex: 1;
1173
- text-align: right;
1174
- }
1173
+ flex: 1;
1174
+ text-align: right;
1175
+ }
1175
1176
  .go-cart-header > ul .go-cart-header-sum {
1176
- flex: 1;
1177
- text-align: right;
1178
- }
1177
+ flex: 1;
1178
+ text-align: right;
1179
+ }
1179
1180
 
1180
1181
  /* Data rows */
1181
1182
  .go-cart-item article > ul {
1182
- display: flex;
1183
- gap: 1rem;
1184
- padding: 0.75rem 0;
1185
- border-bottom: 1px solid rgba(0, 0, 0, 0.06);
1186
- align-items: center;
1187
- }
1183
+ display: flex;
1184
+ gap: 1rem;
1185
+ padding: 0.75rem 0;
1186
+ border-bottom: 1px solid rgba(0, 0, 0, 0.06);
1187
+ align-items: center;
1188
+ }
1188
1189
  .go-cart-item article > ul > li {
1189
- list-style: none;
1190
- min-width: 0;
1191
- /*white-space: nowrap;*/
1192
- /*overflow: hidden;*/
1193
- /*text-overflow: ellipsis;*/
1194
- }
1190
+ list-style: none;
1191
+ min-width: 0;
1192
+ /*white-space: nowrap;*/
1193
+ /*overflow: hidden;*/
1194
+ /*text-overflow: ellipsis;*/
1195
+ }
1195
1196
  .go-cart-item article > ul .go-cart-item-title-container {
1196
- flex: 2;
1197
- }
1197
+ flex: 2;
1198
+ }
1198
1199
  .go-cart-item article > ul .go-cart-item-price {
1199
- flex: 1;
1200
- text-align: right;
1201
- }
1200
+ flex: 1;
1201
+ text-align: right;
1202
+ }
1202
1203
  .go-cart-item article > ul .go-cart-item-count {
1203
- flex: 1;
1204
- text-align: right;
1205
- }
1204
+ flex: 1;
1205
+ text-align: right;
1206
+ }
1206
1207
  .go-cart-item article > ul .go-cart-item-remove {
1207
- flex: 1;
1208
- text-align: right;
1209
- }
1208
+ flex: 1;
1209
+ text-align: right;
1210
+ }
1210
1211
  .go-cart-item article > ul .go-cart-item-remove button {
1211
- padding: 0.25rem 0.5rem;
1212
- margin: 0;
1213
- background-color: white;
1214
- background-color: var(--bg);
1215
- color: #111;
1216
- color: var(--fg);
1217
- border: none;
1218
- border-radius: 0px;
1219
- cursor: pointer;
1220
- }
1212
+ padding: 0.25rem 0.5rem;
1213
+ margin: 0;
1214
+ background-color: white;
1215
+ background-color: var(--bg);
1216
+ color: #111;
1217
+ color: var(--fg);
1218
+ border: none;
1219
+ border-radius: 0px;
1220
+ cursor: pointer;
1221
+ }
1221
1222
  .go-cart-item article > ul .go-cart-item-sum {
1222
- flex: 1;
1223
- text-align: right;
1224
- }
1223
+ flex: 1;
1224
+ text-align: right;
1225
+ }
1225
1226
 
1226
1227
  /* Footer row */
1227
1228
  .go-cart-footer {
1228
- background: inherit;
1229
+ background: inherit;
1229
1230
  }
1230
1231
  .go-cart-footer > ul {
1231
- display: flex;
1232
- gap: 1rem;
1233
- padding: 0.5rem 0;
1234
- border-top: 1px solid rgba(0, 0, 0, 0.1);
1235
- font-weight: 600;
1236
- }
1232
+ display: flex;
1233
+ gap: 1rem;
1234
+ padding: 0.5rem 0;
1235
+ border-top: 1px solid rgba(0, 0, 0, 0.1);
1236
+ font-weight: 600;
1237
+ }
1237
1238
  .go-cart-footer > ul > li {
1238
- list-style: none;
1239
- min-width: 0;
1240
- }
1239
+ list-style: none;
1240
+ min-width: 0;
1241
+ }
1241
1242
  .go-cart-footer > ul .go-cart-footer-title {
1242
- flex: 2;
1243
- }
1243
+ flex: 2;
1244
+ }
1244
1245
  .go-cart-footer > ul .go-cart-footer-price {
1245
- flex: 1;
1246
- text-align: right;
1247
- }
1246
+ flex: 1;
1247
+ text-align: right;
1248
+ }
1248
1249
  .go-cart-footer > ul .go-cart-footer-count {
1249
- flex: 1;
1250
- text-align: right;
1251
- }
1250
+ flex: 1;
1251
+ text-align: right;
1252
+ }
1252
1253
  .go-cart-footer > ul .go-cart-footer-remove {
1253
- flex: 1;
1254
- text-align: right;
1255
- }
1254
+ flex: 1;
1255
+ text-align: right;
1256
+ }
1256
1257
  .go-cart-footer > ul .go-cart-footer-sum {
1257
- flex: 1;
1258
- text-align: right;
1259
- }
1258
+ flex: 1;
1259
+ text-align: right;
1260
+ }
1260
1261
 
1261
1262
  [data-add-to-cart-button]:disabled {
1262
- background-color: #d3d3d3; /* Gray color for disabled state */
1263
- color: #a1a1a1; /* Lighter text color */
1264
- cursor: not-allowed; /* Show that the button is disabled */
1263
+ background-color: #d3d3d3; /* Gray color for disabled state */
1264
+ color: #a1a1a1; /* Lighter text color */
1265
+ cursor: not-allowed; /* Show that the button is disabled */
1265
1266
  }
1266
1267
 
1267
1268
  h2 {
1268
- margin-top: 3rlh;
1269
+ margin-top: 3rlh;
1269
1270
  }
1270
1271
 
1271
1272
  .sum-container {
1272
- display: flex;
1273
- flex-direction: row;
1274
- justify-content: space-between;
1273
+ display: flex;
1274
+ flex-direction: row;
1275
+ justify-content: space-between;
1275
1276
  }
1276
1277
 
1277
1278
  .component-container {
1278
- max-width: 650px;
1279
- margin: 0 auto;
1280
- box-shadow: 0 4px 12px rgba(12, 12, 12, 0.15),
1279
+ max-width: 650px;
1280
+ margin: 0 auto;
1281
+ box-shadow:
1282
+ 0 4px 12px rgba(12, 12, 12, 0.15),
1281
1283
  0 0 0 1px rgba(0, 0, 0, 0.05);
1282
- border-radius: 3px;
1283
- padding: 32px 32px 48px;
1284
+ border-radius: 3px;
1285
+ padding: 32px 32px 48px;
1284
1286
 
1285
- margin: 2rem auto;
1287
+ margin: 2rem auto;
1286
1288
  }
1287
1289
 
1288
1290
  go-cart,
1289
1291
  go-ticket-selection,
1290
1292
  go-if {
1291
- width: 100%;
1292
- display: block;
1293
+ width: 100%;
1294
+ display: block;
1293
1295
  }
1294
1296
 
1295
1297
  go-cart-empty {
1296
- display: contents;
1298
+ display: contents;
1297
1299
  }
1298
1300
 
1299
1301
  .go-cart-checkout-button {
1300
- display: none;
1302
+ display: none;
1301
1303
  }
1302
1304
 
1303
1305
  go-link {
1304
- cursor: pointer;
1305
- color: #12826a;
1306
- color: var(--primary);
1307
- font-weight: bold;
1306
+ cursor: pointer;
1307
+ color: #12826a;
1308
+ color: var(--primary);
1309
+ font-weight: bold;
1308
1310
  }
1309
1311
 
1310
1312
  .is-unavailable {
1311
- pointer-events: none;
1312
- cursor: not-allowed;
1313
- opacity: 0.5;
1313
+ pointer-events: none;
1314
+ cursor: not-allowed;
1315
+ opacity: 0.5;
1314
1316
  }
1315
1317
 
1316
1318
  .go-order-breakdown-ical a {
1317
- line-height: 24px;
1318
- display: inline-block;
1319
+ line-height: 24px;
1320
+ display: inline-block;
1319
1321
  }
1320
1322
 
1321
1323
  .go-donation-campaign {