PluginProbe
Booking Calendar / 11.9
Booking Calendar v11.9
11.9 11.8.4 11.8.3 11.8.2 11.8.1 11.8 11.7 11.6.1 11.6 11.5 11.4.3 11.4.2 11.4.1 11.4 11.3 11.2.1 11.2 11.1 11.0 10.15.7 10.15.6 10.1.3 10.10 10.10.1 10.10.2 All 205 releases
booking / includes / page-setup-wizard / step-date-selection / _out / step-date-selection.css

step-date-selection.css in Booking Calendar 11.9, at includes/page-setup-wizard/step-date-selection/_out/step-date-selection.css

759 lines 20.9 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .wpbc_setup_wizard__date-selection-form {
2 display: grid;
3 gap: 14px
4 }
5 .wpbc_setup_wizard__date-selection-behavior,
6 .wpbc_setup_wizard__date-selection-changeover,
7 .wpbc_setup_wizard__date-selection-legend,
8 .wpbc_setup_wizard__date-selection-modes,
9 .wpbc_setup_wizard__date-selection-preview,
10 .wpbc_setup_wizard__date-selection-settings {
11 margin: 0;
12 border: 1px solid var(--wpbc-wizard-border,#dcdcde);
13 border-radius: 7px;
14 background: #fff;
15 box-shadow: 0 1px 2px rgba(0,0,0,.03)
16 }
17 .wpbc_setup_wizard__date-selection-modes {
18 padding: 14px 16px 16px
19 }
20 .wpbc_setup_wizard__date-selection-modes-heading {
21 display: -ms-flexbox;
22 display: flex;
23 -ms-flex-align: center;
24 align-items: center;
25 -ms-flex-wrap: wrap;
26 flex-wrap: wrap;
27 gap: 8px 12px
28 }
29 .wpbc_setup_wizard__date-selection-compatibility-note {
30 display: -ms-inline-flexbox;
31 display: inline-flex;
32 -ms-flex-align: center;
33 align-items: center;
34 gap: 5px;
35 color: var(--wpbc-wizard-muted,#646970);
36 font-size: 12px
37 }
38 .wpbc_setup_wizard__date-selection-compatibility-note .menu_icon {
39 color: var(--wp-admin-theme-color,#2271b1)
40 }
41 .wpbc_setup_wizard__date-selection-journey-badge {
42 display: -ms-inline-flexbox;
43 display: inline-flex;
44 min-width: 0;
45 max-width: 100%;
46 -ms-flex-align: center;
47 align-items: center;
48 padding: 3px 10px;
49 border-radius: 999px;
50 background: #e8f0fe;
51 color: #135e96;
52 font-size: 11px;
53 font-weight: 600;
54 line-height: 1.35;
55 overflow-wrap: anywhere;
56 white-space: normal
57 }
58 .wpbc_setup_wizard__date-selection-behavior h2,
59 .wpbc_setup_wizard__date-selection-changeover h2,
60 .wpbc_setup_wizard__date-selection-legend h2,
61 .wpbc_setup_wizard__date-selection-modes > legend,
62 .wpbc_setup_wizard__date-selection-preview h2,
63 .wpbc_setup_wizard__date-selection-settings h2 {
64 margin: 0;
65 color: #1d2327;
66 font-size: 16px;
67 font-weight: 600;
68 line-height: 1.4
69 }
70 .wpbc_setup_wizard__date-selection-mode-grid {
71 display: grid;
72 grid-template-columns: repeat(4,minmax(0,1fr));
73 margin-top: 9px
74 }
75 .wpbc_setup_wizard__date-selection-mode-option {
76 display: grid;
77 grid-template-rows: auto minmax(0,1fr);
78 min-width: 0
79 }
80 .wpbc_setup_wizard__date-selection-mode-card {
81 position: relative;
82 display: grid;
83 grid-template-columns: auto 92px minmax(0,1fr);
84 min-width: 0;
85 min-height: 98px;
86 height: 100%;
87 -ms-flex-align: center;
88 align-items: center;
89 gap: 11px;
90 margin: 0;
91 padding: 10px 16px;
92 border-right: 1px solid #dcdcde;
93 background: #fff;
94 box-sizing: border-box;
95 cursor: pointer
96 }
97 .wpbc_setup_wizard__date-selection-mode-option:first-child .wpbc_setup_wizard__date-selection-mode-card {
98 border-radius: 5px 0 0 5px
99 }
100 .wpbc_setup_wizard__date-selection-mode-option:last-child .wpbc_setup_wizard__date-selection-mode-card {
101 border-right: 0;
102 border-radius: 0 5px 5px 0
103 }
104 .wpbc_setup_wizard__date-selection-mode-card.is-selected {
105 background: color-mix(in srgb,var(--wp-admin-theme-color,#2271b1) 5%,#fff);
106 box-shadow: inset 0 0 0 2px var(--wp-admin-theme-color,#2271b1)
107 }
108 .wpbc_setup_wizard__date-selection-mode-card:focus-within {
109 outline: 2px solid var(--wp-admin-theme-color,#2271b1);
110 outline-offset: -2px
111 }
112 .wpbc_setup_wizard__date-selection-mode-card.is-locked {
113 background: #f6f7f7;
114 color: #646970;
115 cursor: not-allowed
116 }
117 .wpbc_setup_wizard__date-selection-mode-card.is-locked .wpbc_setup_wizard__date-selection-mode-copy,
118 .wpbc_setup_wizard__date-selection-mode-card.is-locked .wpbc_setup_wizard__date-selection-mode-icon {
119 opacity: .7
120 }
121 .wpbc_setup_wizard__date-selection-mode-card > input {
122 -ms-flex-item-align: center;
123 align-self: center;
124 margin: 0
125 }
126 .wpbc_setup_wizard__date-selection-mode-icon {
127 display: block;
128 -ms-flex-item-align: start;
129 align-self: start;
130 width: 92px;
131 min-height: 76px;
132 padding: 5px 7px;
133 border: 1px solid #c3c4c7;
134 border-radius: 4px;
135 background: #fff;
136 box-sizing: border-box
137 }
138 .wpbc_setup_wizard__date-selection-mode-header {
139 display: -ms-flexbox;
140 display: flex;
141 -ms-flex-align: center;
142 align-items: center;
143 -ms-flex-pack: justify;
144 justify-content: space-between;
145 gap: 4px;
146 min-height: 12px;
147 margin: 0 0 6px
148 }
149 .wpbc_setup_wizard__date-selection-mode-year {
150 display: block;
151 margin: 0;
152 color: #3c434a;
153 font-size: 10px;
154 font-weight: 600;
155 line-height: 1.2;
156 text-align: start
157 }
158 .wpbc_setup_wizard__date-selection-mode-navigation {
159 display: -ms-inline-flexbox;
160 display: inline-flex;
161 -ms-flex-align: center;
162 align-items: center;
163 gap: 1px;
164 color: #50575e;
165 line-height: 5px
166 }
167 .wpbc_setup_wizard__date-selection-mode-navigation .menu_icon {
168 margin: 0
169 }
170 .wpbc_setup_wizard__date-selection-mode-navigation .menu_icon::before {
171 font-size: 10px;
172 line-height: 5px
173 }
174 .wpbc_setup_wizard__date-selection-mode-icon .wpbc_setup_wizard__preview-calendar {
175 width: 100%
176 }
177 .wpbc_setup_wizard__date-selection-mode-copy {
178 display: grid;
179 align-self: start;
180 min-width: 0;
181 gap: 3px
182 }
183 .wpbc_setup_wizard__date-selection-mode-copy strong {
184 display: -ms-inline-flexbox;
185 display: inline-flex;
186 -ms-flex-align: center;
187 align-items: center;
188 gap: 4px;
189 font-size: 14px;
190 line-height: 1.35
191 }
192 .wpbc_setup_wizard__date-selection-mode-copy .menu_icon::before {
193 font-size: 14px
194 }
195 .wpbc_setup_wizard__date-selection-mode-badges {
196 display: -ms-flexbox;
197 display: flex;
198 min-width: 0;
199 min-height: 20px;
200 width: 100%;
201 -ms-flex-align: start;
202 align-items: flex-start;
203 -ms-flex-pack: end;
204 justify-content: flex-end;
205 -ms-flex-wrap: wrap;
206 flex-wrap: wrap;
207 gap: 4px;
208 padding: 0 7px 5px;
209 box-sizing: border-box
210 }
211 .wpbc_setup_wizard__date-selection-mode-badge {
212 display: -ms-inline-flexbox;
213 display: inline-flex;
214 -ms-flex-align: center;
215 align-items: center;
216 max-width: 100%;
217 padding: 2px 7px;
218 border-radius: 999px;
219 box-sizing: border-box;
220 font-size: 10px;
221 font-weight: 600;
222 line-height: 1.25;
223 overflow-wrap: anywhere;
224 text-align: center;
225 white-space: normal
226 }
227 .wpbc_setup_wizard__date-selection-mode-badge.is-best {
228 background: #dff4dc;
229 color: #116329
230 }
231 .wpbc_setup_wizard__date-selection-mode-badge.is-supported {
232 background: #e8f0fe;
233 color: #135e96
234 }
235 .wpbc_setup_wizard__date-selection-mode-badge.is-locked {
236 background: #e5e5e5;
237 color: #50575e
238 }
239 .wpbc_setup_wizard__date-selection-review-journeys {
240 display: block;
241 margin: 12px 0 0 auto;
242 font-size: 12px
243 }
244 .wpbc_setup_wizard__date-selection-locked-note,
245 .wpbc_setup_wizard__date-selection-mode-copy small,
246 .wpbc_setup_wizard__date-selection-preview-help,
247 .wpbc_setup_wizard__date-selection-settings-panel p {
248 color: var(--wpbc-wizard-muted,#646970);
249 font-size: 12px;
250 line-height: 1.45
251 }
252 .wpbc_setup_wizard__date-selection-locked-note {
253 margin: 12px 0 0;
254 padding: 10px 12px;
255 border: 1px solid var(--wpbc-wizard-warning-border);
256 border-inline-start: 4px solid var(--wpbc-wizard-warning-accent);
257 border-radius: 6px;
258 background: var(--wpbc-wizard-warning-background);
259 color: var(--wpbc-wizard-warning-text)
260 }
261 .wpbc_setup_wizard__date-selection-behavior :disabled,
262 .wpbc_setup_wizard__date-selection-changeover :disabled,
263 .wpbc_setup_wizard__date-selection-legend :disabled,
264 .wpbc_setup_wizard__date-selection-settings :disabled {
265 cursor: not-allowed
266 }
267 .wpbc_setup_wizard__date-selection-step [data-wpbc-date-selection-disabled-tooltip-active="1"],
268 .wpbc_setup_wizard__date-selection-step [data-wpbc-date-selection-disabled-tooltip-active="1"] .wpbc_ui__toggle_icon {
269 cursor: help
270 }
271 .wpbc_setup_wizard__date-selection-step [data-wpbc-date-selection-disabled-tooltip-active="1"]:focus {
272 border-radius: 999px;
273 outline: 2px solid var(--wp-admin-theme-color,#2271b1);
274 outline-offset: 2px
275 }
276 .wpbc_setup_wizard__edition-badge {
277 display: -ms-inline-flexbox;
278 display: inline-flex;
279 -ms-flex-align: center;
280 align-items: center;
281 -ms-flex-pack: center;
282 justify-content: center;
283 padding: 2px 7px;
284 border-radius: 999px;
285 background: #f9d89c;
286 color: #7a3e00;
287 font-size: 10px;
288 font-weight: 700;
289 white-space: nowrap
290 }
291 .wpbc_setup_wizard__date-selection-workspace {
292 display: grid;
293 grid-template-columns: minmax(0,1.9fr) minmax(330px,1fr);
294 gap: 14px
295 }
296 .wpbc_setup_wizard__date-selection-sidebar {
297 display: grid;
298 min-width: 0;
299 -ms-flex-line-pack: start;
300 align-content: start;
301 gap: 14px
302 }
303 .wpbc_setup_wizard__date-selection-preview {
304 position: sticky;
305 top: 0;
306 -ms-flex-item-align: start;
307 align-self: start
308 }
309 @media screen and (min-width:1181px) {
310 .wpbc_setup_wizard[data-step=date_selection] .wpbc_setup_wizard__main {
311 padding-top: 0
312 }
313 .wpbc_setup_wizard__stage--date_selection {
314 padding-top: 30px
315 }
316 }
317 .wpbc_setup_wizard__date-selection-preview,
318 .wpbc_setup_wizard__date-selection-settings {
319 padding: 18px 20px
320 }
321 .wpbc_setup_wizard__date-selection-preview-help {
322 margin: 4px 0 12px
323 }
324 .wpbc_setup_wizard__date-selection-calendar {
325 padding: 8px;
326 border-radius: 5px;
327 background: #fff;
328 overflow: auto
329 }
330 .wpbc_setup_wizard__date-selection-calendar .datepick-inline,
331 .wpbc_setup_wizard__date-selection-calendar .wpbc_cal_container,
332 .wpbc_setup_wizard__date-selection-calendar .wpbc_calendar_wraper {
333 width: 100%!important;
334 max-width: 1023px!important
335 }
336 .wpbc_setup_wizard__date-selection-calendar .wpbc_cal_container {
337 margin: 0 auto
338 }
339 .wpbc_setup_wizard__date-selection-calendar .wpbc_calendar_wraper > .block_hints {
340 display: none!important
341 }
342 .wpbc_setup_wizard__date-selection-legend-preview {
343 display: -ms-flexbox;
344 display: flex;
345 -ms-flex-wrap: wrap;
346 flex-wrap: wrap;
347 -ms-flex-align: center;
348 align-items: center;
349 gap: 8px 16px;
350 margin-top: 12px
351 }
352 .wpbc_setup_wizard__date-selection-legend-preview [hidden],
353 .wpbc_setup_wizard__date-selection-legend-preview[hidden] {
354 display: none
355 }
356 .wpbc_setup_wizard__date-selection-legend-preview.is-vertical {
357 -ms-flex-align: start;
358 align-items: flex-start;
359 -ms-flex-direction: column;
360 flex-direction: column
361 }
362 .wpbc_setup_wizard__date-selection-legend-preview .block_hints {
363 display: block;
364 margin: 0
365 }
366 .wpbc_setup_wizard__date-selection-legend-preview .wpdev_hint_with_text {
367 margin: 0
368 }
369 .wpbc_setup_wizard__date-selection-settings {
370 display: -ms-flexbox;
371 display: flex;
372 min-width: 0;
373 -ms-flex-direction: column;
374 flex-direction: column
375 }
376 .wpbc_setup_wizard__date-selection-settings-heading {
377 display: -ms-flexbox;
378 display: flex;
379 -ms-flex-align: center;
380 align-items: center;
381 -ms-flex-pack: justify;
382 justify-content: space-between;
383 gap: 12px
384 }
385 .wpbc_setup_wizard__date-selection-settings-heading h2 {
386 margin: 0
387 }
388 .wpbc_setup_wizard__date-selection-settings-panel {
389 padding: 16px 0 0;
390 border-bottom: 0 solid #dcdcde;
391 font-size: 14px
392 }
393 .wpbc_setup_wizard__date-selection-changeover-controls[hidden],
394 .wpbc_setup_wizard__date-selection-changeover-fields[hidden],
395 .wpbc_setup_wizard__date-selection-changeover[hidden],
396 .wpbc_setup_wizard__date-selection-option[hidden],
397 .wpbc_setup_wizard__date-selection-settings-panel[hidden] {
398 display: none
399 }
400 .wpbc_setup_wizard__date-selection-number-intro {
401 margin: 0 0 10px
402 }
403 .wpbc_setup_wizard__date-selection-number-grid {
404 display: grid;
405 grid-template-columns: repeat(2,minmax(0,1fr));
406 gap: 12px
407 }
408 .wpbc_setup_wizard__date-selection-number-field {
409 display: grid;
410 min-width: 0;
411 gap: 8px;
412 padding: 12px;
413 border: 1px solid #dcdcde;
414 border-radius: 5px;
415 background: #f6f7f7
416 }
417 .wpbc_setup_wizard__date-selection-number-heading {
418 display: -ms-flexbox;
419 display: flex;
420 -ms-flex-align: center;
421 align-items: center;
422 -ms-flex-pack: justify;
423 justify-content: space-between;
424 gap: 12px
425 }
426 .wpbc_setup_wizard__date-selection-number-heading label {
427 color: #1d2327;
428 font-weight: 600;
429 line-height: 1.35;
430 font-size: 12px
431 }
432 .wpbc_setup_wizard__date-selection-number-heading input[type=number] {
433 width: 76px;
434 min-width: 76px;
435 min-height: 36px;
436 margin: 0
437 }
438 .wpbc_setup_wizard__date-selection-range {
439 width: 100%;
440 margin: 0;
441 accent-color: var(--wp-admin-theme-color,#2271b1)
442 }
443 .wpbc_setup_wizard__date-selection-number-help {
444 margin: 0
445 }
446 .wpbc_setup_wizard__date-selection-weekdays {
447 display: grid;
448 gap: 8px;
449 margin-top: 14px
450 }
451 .wpbc_setup_wizard__date-selection-weekdays > div {
452 display: grid;
453 grid-template-columns: repeat(7,minmax(0,1fr));
454 gap: 6px
455 }
456 .wpbc_setup_wizard__date-selection-weekdays .button {
457 min-width: 0;
458 padding: 0 5px;
459 text-align: center
460 }
461 .wpbc_setup_wizard__date-selection-weekdays .button.is-selected {
462 border-color: var(--wp-admin-theme-color,#2271b1);
463 background: var(--wp-admin-theme-color,#2271b1);
464 color: #fff
465 }
466 .wpbc_setup_wizard__date-selection-specific {
467 display: grid;
468 gap: 6px;
469 margin-top: 14px;
470 font-size: 12px;
471 line-height: 1.45
472 }
473 .wpbc_setup_wizard__date-selection-specific > label {
474 color: #1d2327;
475 font-size: 12px;
476 font-weight: 600;
477 line-height: 1.35
478 }
479 .wpbc_setup_wizard__date-selection-specific input[type=text] {
480 width: 100%;
481 min-height: 36px;
482 margin: 0;
483 font-size: 13px
484 }
485 .wpbc_setup_wizard__date-selection-specific-presets {
486 display: -ms-flexbox;
487 display: flex;
488 -ms-flex-wrap: wrap;
489 flex-wrap: wrap;
490 -ms-flex-align: center;
491 align-items: center;
492 gap: 2px 12px
493 }
494 .wpbc_setup_wizard__date-selection-specific-presets .button-link {
495 min-height: 24px;
496 padding: 0;
497 font-size: 12px;
498 line-height: 1.4
499 }
500 .wpbc_setup_wizard__date-selection-specific .wpbc_setup_wizard__field-help {
501 margin: 0;
502 font-size: 12px;
503 line-height: 1.45
504 }
505 .wpbc_setup_wizard__date-selection-behavior,
506 .wpbc_setup_wizard__date-selection-changeover,
507 .wpbc_setup_wizard__date-selection-legend {
508 display: grid;
509 gap: 12px;
510 padding: 18px 20px
511 }
512 .wpbc_setup_wizard__date-selection-changeover.is-locked {
513 opacity: .7
514 }
515 .wpbc_setup_wizard__date-selection-changeover-heading {
516 display: -ms-flexbox;
517 display: flex;
518 -ms-flex-align: center;
519 align-items: center;
520 gap: 8px
521 }
522 .wpbc_setup_wizard__date-selection-changeover-toggle {
523 margin-left: auto
524 }
525 .wpbc_setup_wizard__date-selection-changeover-visual {
526 box-sizing: border-box;
527 width: 100%;
528 max-width: 320px;
529 padding: 10px 12px;
530 border: 1px solid #dcdcde;
531 border-radius: 5px;
532 background: #f6f7f7
533 }
534 .wpbc_setup_wizard__date-selection-changeover-visual .wpbc_setup_wizard__preview-calendar {
535 grid-template-columns: repeat(7,minmax(0,1fr));
536 gap: 4px
537 }
538 .wpbc_setup_wizard__date-selection-changeover-visual .wpbc_setup_wizard__preview-calendar > span {
539 min-height: 24px;
540 aspect-ratio: auto
541 }
542 .wpbc_setup_wizard__date-selection-changeover-visual .wpbc_setup_wizard__preview-calendar > span:nth-child(-n+14),
543 .wpbc_setup_wizard__date-selection-changeover-visual .wpbc_setup_wizard__preview-calendar > span:nth-child(n+22) {
544 display: none
545 }
546 .wpbc_setup_wizard__date-selection-changeover-help {
547 margin: -4px 0 0;
548 color: var(--wpbc-wizard-muted,#646970);
549 font-size: 12px;
550 line-height: 1.45
551 }
552 .wpbc_setup_wizard__date-selection-changeover-controls {
553 display: grid;
554 gap: 10px;
555 padding: 12px;
556 border: 1px solid #cfe2f8;
557 border-radius: 5px;
558 background: #f5f9ff
559 }
560 .wpbc_setup_wizard__date-selection-changeover-fields {
561 display: grid;
562 gap: 10px
563 }
564 .wpbc_setup_wizard__date-selection-time-fields {
565 display: grid;
566 grid-template-columns: repeat(2,minmax(0,1fr));
567 gap: 10px
568 }
569 .wpbc_setup_wizard__date-selection-time-field {
570 display: grid;
571 min-width: 0;
572 gap: 5px;
573 color: #1d2327;
574 font-size: 12px;
575 font-weight: 600;
576 line-height: 1.4
577 }
578 .wpbc_setup_wizard__date-selection-time-field select {
579 width: 100%;
580 min-width: 0;
581 font-weight: 400
582 }
583 .wpbc_setup_wizard__date-selection-changeover-option {
584 display: -ms-flexbox;
585 display: flex;
586 -ms-flex-align: center;
587 align-items: center;
588 -ms-flex-pack: justify;
589 justify-content: space-between;
590 gap: 8px;
591 font-size: 12px;
592 line-height: 1.45
593 }
594 .wpbc_setup_wizard__date-selection-changeover-option-toggle {
595 -ms-flex: 0 0 auto;
596 flex: 0 0 auto
597 }
598 .wpbc_setup_wizard__date-selection-option {
599 display: -ms-flexbox;
600 display: flex;
601 min-width: 0;
602 -ms-flex-align: center;
603 align-items: center;
604 gap: 10px;
605 padding: 12px 0;
606 border-bottom: 0 solid #dcdcde
607 }
608 .wpbc_setup_wizard__date-selection-option:last-of-type {
609 border-bottom: 0
610 }
611 .wpbc_setup_wizard__date-selection-option > span:first-child {
612 display: grid;
613 min-width: 0;
614 gap: 3px
615 }
616 .wpbc_setup_wizard__date-selection-legend-item-heading > label,
617 .wpbc_setup_wizard__date-selection-option label {
618 color: #1d2327;
619 font-size: 12px;
620 font-weight: 600;
621 line-height: 1.4
622 }
623 .wpbc_setup_wizard__date-selection-option small,
624 .wpbc_setup_wizard__date-selection-section-heading small {
625 color: var(--wpbc-wizard-muted,#646970);
626 font-size: 12px;
627 line-height: 1.45
628 }
629 .wpbc_setup_wizard__date-selection-option.is-locked {
630 opacity: .7
631 }
632 .wpbc_setup_wizard__date-selection-option > .wpbc_setup_wizard__edition-badge {
633 margin-left: auto
634 }
635 .wpbc_setup_wizard__date-selection-option-toggle {
636 -ms-flex: 0 0 auto;
637 flex: 0 0 auto;
638 margin-left: auto
639 }
640 .wpbc_setup_wizard__date-selection-option > .wpbc_setup_wizard__edition-badge + .wpbc_setup_wizard__date-selection-option-toggle {
641 margin-left: 0
642 }
643 .wpbc_setup_wizard__date-selection-section-heading {
644 display: -ms-flexbox;
645 display: flex;
646 -ms-flex-align: center;
647 align-items: center;
648 gap: 12px
649 }
650 .wpbc_setup_wizard__date-selection-section-heading > span:first-child {
651 display: grid;
652 min-width: 0;
653 gap: 3px
654 }
655 .wpbc_setup_wizard__date-selection-section-toggle {
656 -ms-flex: 0 0 auto;
657 flex: 0 0 auto;
658 margin-left: auto
659 }
660 .wpbc_setup_wizard__date-selection-legend-settings {
661 display: grid;
662 gap: 12px
663 }
664 .wpbc_setup_wizard__date-selection-legend-settings[hidden] {
665 display: none
666 }
667 .wpbc_setup_wizard__date-selection-legend-grid {
668 display: grid;
669 grid-template-columns: repeat(2,minmax(0,1fr));
670 gap: 10px
671 }
672 .wpbc_setup_wizard__date-selection-legend-item {
673 display: grid;
674 min-width: 0;
675 gap: 8px;
676 padding: 10px;
677 border: 1px solid #dcdcde;
678 border-radius: 5px;
679 background: #f6f7f7
680 }
681 .wpbc_setup_wizard__date-selection-legend-item-heading {
682 display: -ms-flexbox;
683 display: flex;
684 -ms-flex-align: center;
685 align-items: center;
686 -ms-flex-pack: justify;
687 justify-content: space-between;
688 gap: 8px
689 }
690 .wpbc_setup_wizard__date-selection-legend-item input[type=text] {
691 width: 100%;
692 min-width: 0;
693 min-height: 34px;
694 margin: 0;
695 font-size: 12px
696 }
697 .wpbc_setup_wizard__date-selection-legend-options {
698 display: grid;
699 border-top: 1px solid #dcdcde
700 }
701 @media screen and (max-width:1180px) {
702 .wpbc_setup_wizard__date-selection-mode-grid {
703 grid-template-columns: repeat(2,minmax(0,1fr))
704 }
705 .wpbc_setup_wizard__date-selection-mode-option:nth-child(2) .wpbc_setup_wizard__date-selection-mode-card {
706 border-right: 0
707 }
708 .wpbc_setup_wizard__date-selection-mode-option:nth-child(-n+2) .wpbc_setup_wizard__date-selection-mode-card {
709 border-bottom: 1px solid #dcdcde
710 }
711 .wpbc_setup_wizard__date-selection-workspace {
712 grid-template-columns: 1fr
713 }
714 .wpbc_setup_wizard__date-selection-preview {
715 position: static
716 }
717 }
718 @media screen and (max-width:782px) {
719 .wpbc_setup_wizard__date-selection-mode-grid {
720 grid-template-columns: 1fr
721 }
722 .wpbc_setup_wizard__date-selection-mode-card {
723 border-right: 0;
724 border-bottom: 1px solid #dcdcde
725 }
726 .wpbc_setup_wizard__date-selection-mode-option:last-child .wpbc_setup_wizard__date-selection-mode-card {
727 border-bottom: 0
728 }
729 .wpbc_setup_wizard__date-selection-behavior,
730 .wpbc_setup_wizard__date-selection-changeover,
731 .wpbc_setup_wizard__date-selection-legend,
732 .wpbc_setup_wizard__date-selection-preview,
733 .wpbc_setup_wizard__date-selection-settings {
734 padding: 14px
735 }
736 .wpbc_setup_wizard__date-selection-legend-grid,
737 .wpbc_setup_wizard__date-selection-number-grid,
738 .wpbc_setup_wizard__date-selection-time-fields {
739 grid-template-columns: 1fr
740 }
741 }
742 [dir=rtl] .wpbc_setup_wizard__date-selection-mode-card {
743 border-right: 0;
744 border-left: 1px solid #dcdcde
745 }
746 [dir=rtl] .wpbc_setup_wizard__date-selection-mode-option:last-child .wpbc_setup_wizard__date-selection-mode-card {
747 border-left: 0
748 }
749 [dir=rtl] .wpbc_setup_wizard__date-selection-changeover-toggle,
750 [dir=rtl] .wpbc_setup_wizard__date-selection-option-toggle,
751 [dir=rtl] .wpbc_setup_wizard__date-selection-option>.wpbc_setup_wizard__edition-badge,
752 [dir=rtl] .wpbc_setup_wizard__date-selection-review-journeys,
753 [dir=rtl] .wpbc_setup_wizard__date-selection-section-toggle {
754 margin-right: auto;
755 margin-left: 0
756 }
757 [dir=rtl] .wpbc_setup_wizard__date-selection-option > .wpbc_setup_wizard__edition-badge + .wpbc_setup_wizard__date-selection-option-toggle {
758 margin-right: 0
759 }