PluginProbe
Booking Calendar / 11.6.1
Booking Calendar v11.6.1
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 10.11 All 204 releases
booking / includes / __css / admin / page-bookings / bo_listing.css

bo_listing.css in Booking Calendar 11.6.1, at includes/__css/admin/page-bookings/bo_listing.css

1,004 lines 30.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* == V A R s == */
2 .wpbc_admin {
3 --wpbc_ui_listing__back_color: #fff;
4 --wpbc_ui_listing__back_alt_color: #fbfbfc;
5 --wpbc_ui_listing__table_border_color: #d6d6d6;
6 --wpbc_ui_listing__row_border_color: #e4e4e4;
7
8 --wpbc_ui_listing__border_radius: var(--wpbc_ui__gen__border-radius);
9
10 --wpbc_ui_listing__header_height: 44px;
11
12 --wpbc_ui_listing__pending_color: #ed9f0a;
13 --wpbc_ui_listing__approved_color: #64AA45;
14 --wpbc_ui_listing__trash_color: #d94a48;
15 --wpbc_ui_listing__restore_color: #1e9220;
16 --wpbc_ui_listing__resource_color: var(--wpbc_admin-theme-color, #6b96ce); /* FixIn: 10.15.1.7. */
17 --wpbc_ui_listing__selected_row_color: var(--wpbc_admin-theme-color, #08a );
18
19 --wpbc_ui_listing__colapsed_height: 80px;
20 }
21
22 /** ====================================================================================================================
23 .wpbc__wrap__booking_listing{
24 .wpbc__list__table {
25 .wpbc__list__head {
26 .wpbc__list__row {
27 .wpbc__list__col {
28
29 }
30 }
31 }
32 .wpbc__list__body {
33 .wpbc__list__row {
34 .wpbc__list__col {
35
36 }
37 }
38 }
39 }
40 }
41 */
42 /* ================================================================================================================== */
43 /* == S t r u c u t u r e == */
44 /* ================================================================================================================== */
45 .wpbc__wrap__booking_listing {
46 margin: 15px 0;
47 }
48 .wpbc__list__table,
49 .wpbc__list__table .wpbc__list__head,
50 .wpbc__list__table .wpbc__list__foot,
51 .wpbc__list__table .wpbc__list__body {
52 flex: 1 1 100%;
53 width: 100%;
54
55 display: flex;
56 flex-flow: column nowrap;
57 justify-content: flex-start;
58 align-items: stretch;
59
60 margin: 0;
61 padding: 0;
62 }
63 .wpbc__list__table .wpbc__list__row{
64 flex: 1 1 100%;
65 width: 100%;
66
67 display: flex;
68 flex-flow: row wrap;
69 justify-content: flex-start;
70 align-items: flex-start;
71 }
72 .wpbc__list__table .wpbc__list__col {
73 /*flex: 1 1 1px;*/
74 flex: 0 1 auto;
75
76 display: flex;
77 flex-flow: row wrap;
78 justify-content: flex-start;
79 align-items: flex-start;
80 align-content: normal;
81 }
82 /* ------------------------------------------------------------------------------------------------------------------ */
83 /* == S t y l e s == */
84 /* ------------------------------------------------------------------------------------------------------------------ */
85 .wpbc__list__table {
86 border-radius: var(--wpbc_ui_listing__border_radius);
87 background: transparent;
88
89 }
90 /* == H E A D E R == */
91 .wpbc__list__table .wpbc__list__head,
92 .wpbc__list__table .wpbc__list__foot{
93 background: var(--wpbc_ui_listing__back_color);
94 border-radius: var(--wpbc_ui_listing__border_radius) var(--wpbc_ui_listing__border_radius) 0 0;
95 border-bottom: 1px solid var(--wpbc_ui_listing__row_border_color);
96 min-height: var(--wpbc_ui_listing__header_height);
97 line-height: var(--wpbc_ui_listing__header_height);
98 /* left padding: 8px = because usual row has: 4px padding & 4px border */
99 padding:0 4px 0 8px;
100 box-sizing: border-box;
101 }
102 /* == F O O T E R == */
103 .wpbc__list__table .wpbc__list__foot {
104 border-radius: 0 0 var(--wpbc_ui_listing__border_radius) var(--wpbc_ui_listing__border_radius);
105 border: 0;
106 border-top: 1px solid var(--wpbc_ui_listing__row_border_color);
107 padding: 5px 15px;
108 }
109 .wpbc__list__table .wpbc__list__foot *{
110 font-size: 1em;
111 }
112 .wpbc__list__table .wpbc__list__head .wpbc__list__col,
113 .wpbc__list__table .wpbc__list__foot .wpbc__list__col{
114 align-items: center;
115 }
116 /* ------------------------------------------------------------------------------------------------------------------ */
117 /* == Elements == */
118 /* ------------------------------------------------------------------------------------------------------------------ */
119 .wpbc__list__table .wpbc__list__head .wpbc__list__row,
120 .wpbc__list__table .wpbc__list__foot .wpbc__list__row {
121 align-items: stretch;
122 }
123 .wpbc__list__table .wpbc__list__head .wpbc__list__col.check-column,
124 .wpbc__list__table .wpbc__list__foot .wpbc__list__col.check-column {
125 flex: 0 0 40px;
126 display: flex;
127 flex-flow: column nowrap;
128 align-items: center;
129 justify-content: center;
130 }
131 /* == LINKS == */
132 .wpbc__list__table .wpbc__list__head a,
133 .wpbc__list__table .wpbc__list__head a:hover,
134 .wpbc__list__table .wpbc__list__head a:focus,
135 .wpbc__list__table .wpbc__list__foot a,
136 .wpbc__list__table .wpbc__list__foot a:hover,
137 .wpbc__list__table .wpbc__list__foot a:focus {
138 text-decoration: none;
139 }
140 .wpbc__list__table .wpbc__list__head .wpbc_ui_el__a,
141 .wpbc__list__table .wpbc__list__foot .wpbc_ui_el__a,
142 .wpbc__list__table .wpbc__list__head .ul_dropdown_menu_toggle,
143 .wpbc__list__table .wpbc__list__foot .ul_dropdown_menu_toggle {
144 color: var(--wpbc_ui__gen__text-color);
145 }
146 .wpbc__list__table .wpbc__list__head .wpbc_ui_el__a.disabled,
147 .wpbc__list__table .wpbc__list__foot .wpbc_ui_el__a.disabled {
148 color:#d8d8d8;
149 cursor: not-allowed;
150 }
151 /* ------------------------------------------------------------------------------------------------------------------ */
152 /* == Pagination in Booking Listing == */
153 /* ------------------------------------------------------------------------------------------------------------------ */
154 .wpbc_pagination_el {
155 flex: 0 1 auto;
156
157 display: flex;
158 flex-flow: row wrap;
159 justify-content: flex-start;
160 align-items: center;
161 }
162 .wpbc_pagination__prev_next .wpbc_ui_el:first-child,
163 .wpbc_pagination_active_page_in_selectbox {
164 margin-right: 10px;
165 }
166 .wpbc_pagination__prev_next .wpbc_ui_el__a {
167 margin: 0;
168 padding: 0 5px;
169 }
170 .wpbc__list__head .wpbc_ui_el__a .menu_icon::before {
171 font-size: 28px;
172 line-height: var(--wpbc_ui_listing__header_height);
173 vertical-align: middle;
174 }
175 .wpbc__list__head .wpbc_ui_el__divider .wpbc_ui_el__vertical_line,
176 .wpbc__list__foot .wpbc_ui_el__divider .wpbc_ui_el__vertical_line{
177 margin: 5px 15px;
178 }
179 /* ================================================================================================================== */
180 /* == G e n e r a l - R O W - C O L == */
181 /* ================================================================================================================== */
182 .wpbc__list__col.col__right {
183 margin-left: auto;
184 }
185
186 .wpbc_a_row {
187 flex: 1 1 100%;
188 width: 100%;
189
190 display: flex;
191 flex-flow: row wrap;
192 justify-content: flex-start;
193 align-items: flex-start;
194 }
195 .wpbc_a_col {
196 flex: 1 1 1px;
197
198 display: flex;
199 flex-flow: row wrap;
200 justify-content: flex-start;
201 align-items: flex-start;
202 align-content: normal;
203 }
204 .wpbc_a_overflow_hide{
205 overflow: hidden;
206 }
207 .wpbc_a_row_nowrap{
208 flex-flow: row nowrap;
209 }
210
211 /* ================================================================================================================== */
212 /* == C O N T A I N E R == */
213 /* ================================================================================================================== */
214 .wpbc__list__table {
215 display: flex;
216 flex-flow: column nowrap;
217 justify-content: flex-start;
218 align-items: stretch;
219
220 margin: 0;
221 padding: 0;
222 box-shadow: 0 0 1px #aaa;
223 }
224 .wpbc__list__table:has(.wpbc_spins_loading_container) {
225 box-shadow: none;
226 }
227 /* B O D Y */
228 .wpbc__list__table .wpbc_selectable_body {
229 display: flex;
230 flex-flow: column nowrap;
231 justify-content: flex-start;
232 align-items: stretch;
233
234 margin: 0;
235 padding:0;
236 background: var(--wpbc_ui_listing__back_color);
237 border: 0;
238 }
239 /* R O W */
240 div .wpbc_listing_usual_row {
241 flex: 1 1 100%;
242
243 display: flex;
244 flex-flow:row nowrap;
245 justify-content: flex-start;
246 align-items: flex-start;
247 border-bottom: 1px solid var(--wpbc_ui_listing__row_border_color);
248 border-left: 4px solid transparent;
249 margin:0;
250 }
251 .wpbc_listing_usual_row:last-child {
252 border-bottom: 0;
253 }
254 /* C O L */
255 .wpbc_listing_col {
256 flex: 0 1 auto;
257 }
258 .wpbc_listing_col .booking_details_simple,
259 .wpbc_listing_col .booking_details_simple * {
260 font-size: var(--wpbc_ui__gen__font-size);
261 }
262 /* Booking Row */
263 .wpbc__list__table .wpbc_selectable_body > .wpbc_listing_usual_row {
264 padding: 4px 0 4px 4px;
265 line-height: 2.4;
266 flex-flow: row wrap;
267 }
268 .wpbc_row_wrap{
269 flex: 1 1 100%;
270 display: flex;
271 flex-flow:row nowrap;
272 justify-content: flex-start;
273 align-items: flex-start;
274 transition: all .25s ease-in-out;
275 }
276
277 /* ================================================================================================================== */
278 /* == Max Colapsed row height == */
279 /* ================================================================================================================== */
280 /* == Colpased == */
281 .wpbc_row_wrap.max_height_a {
282 max-height: var(--wpbc_ui_listing__colapsed_height);
283 height: var(--wpbc_ui_listing__colapsed_height);
284 overflow: hidden;
285 }
286 .wpbc_row_wrap.max_height_a:has(.wpbc_btn_expand_down_a:hover){
287 /*--wpbc_ui_listing__colapsed_height: 82px;*/
288 /*height: var(--wpbc_ui_listing__colapsed_height);*/
289 --wpbc_ui_listing__colapsed_height: auto;
290 min-height: 82px;
291 }
292 .wpbc_row_wrap .wpbc_btn_expand_down_a:hover i::before {
293 transform: rotateZ(45deg);
294 transition: all .4s ease-in-out;
295 }
296 .wpbc_row_wrap.max_height_a .wpbc_btn_expand_down_a:hover i::before {
297 transform: rotateZ(-45deg);
298 }
299 .wpbc_row_wrap.max_height_a .booking_details_full{
300 display: none;
301 }
302 /* == Expanded == */
303 .wpbc_row_wrap:not(.max_height_a){
304 --wpbc_ui_listing__colapsed_height: 82px;
305 min-height: var(--wpbc_ui_listing__colapsed_height);
306 }
307 .wpbc_row_wrap:not(.max_height_a) .booking_details_simple{
308 display: none;
309 }
310 .wpbc_row_wrap.max_height_a .booking_dates_expand_section {
311 /*max-height: 56px; 80px - 24px (wpbc_btn_expand_down height) - 4px (highlighting) */
312 max-height: calc(var(--wpbc_ui_listing__colapsed_height) - 1px);
313 overflow: hidden;
314 }
315 .wpbc_col_data .booking_details_simple__expand,
316 .wpbc_col_data a.booking_details_simple__expand:hover{
317 color: var(--wpbc_ui__gen__text-color);
318 text-decoration: none;
319 outline: none;
320 box-shadow: none;
321 }
322 .wpbc_col_data a.booking_details_simple__expand,
323 .wpbc_col_data a.booking_details_simple__expand:hover {
324 cursor: pointer;
325 }
326 /* ================================================================================================================== */
327 /* == S p e c i f ic . R o w s . C o l u m n s == */
328 /* ================================================================================================================== */
329 /* -- CHECKBOX -- */
330 .wpbc_a_col__check {
331 flex: 0 0 40px;
332 align-self: stretch;
333
334 display: flex;
335 flex-flow: column nowrap;
336 align-items: center;
337 justify-content: flex-start;
338 }
339 /* ------------------------------------------------------------------------------------------------------------------ */
340 /* -- DATES -- */
341 /* ------------------------------------------------------------------------------------------------------------------ */
342 .wpbc_a_col__dates{
343 flex: 0 0 170px;
344 align-self: stretch;
345
346 display: flex;
347 flex-flow: row nowrap;
348 align-items: flex-start;
349 justify-content: flex-start;
350 }
351 /* == Dates . Border Color == */
352 .wpbc_a_col__dates {
353 border-right: 4px solid var(--wpbc_ui_listing__pending_color);
354 }
355 .wpbc_listing_usual_row.wpbc_row_booking_approved .wpbc_a_col__dates {
356 border-right-color: var(--wpbc_ui_listing__approved_color);
357 }
358 .wpbc_listing_usual_row.wpbc_row_booking_trash .wpbc_a_col__dates {
359 border-right-color: var(--wpbc_ui_listing__trash_color);
360 }
361 /* -- Dates . Colapsed row -- Short Dates -- */
362 .wpbc_row_wrap.max_height_a .wpbc_a_col__dates .booking_dates_small{
363 display: flex;
364 }
365 .wpbc_row_wrap.max_height_a .wpbc_a_col__dates .booking_dates_full{
366 display: none;
367 }
368 /* -- Dates . Expanded row -- Full Dates -- */
369 .wpbc_row_wrap:not(.max_height_a) .wpbc_a_col__dates .booking_dates_full {
370 display: flex;
371 }
372 .wpbc_row_wrap:not(.max_height_a) .wpbc_a_col__dates .booking_dates_small {
373 display: none;
374 }
375 /* -- Dates . Expanded row -- show Dates in Row (not column) -- */
376 .wpbc_row_wrap:not(.max_height_a) .wpbc_a_col__dates .content_text{
377 flex-flow: row wrap;
378 justify-content: flex-start;
379 }
380 /* -- Dates . Show internal dates as column centered */
381 .wpbc_a_col__dates .content_text {
382 display: flex;
383 flex-flow: column;
384 justify-content: center;
385 align-items: center;
386 margin: auto;
387 }
388 /* Dates . Slash */
389 .wpbc_a_col__dates .date_tire {
390 line-height: 10px;
391 margin: 0 5px;
392 }
393 .booking_dates_expand_section {
394 flex: 1 1 auto;
395 display: flex;
396 flex-flow: column nowrap;
397 align-items: center;
398 justify-content: flex-start;
399 }
400 /* Dates - Expand Down Button */
401 .wpbc_btn_expand_down {
402 flex: 0 0 auto;
403 align-self: stretch;
404 width: 20px;
405 display: flex;
406 flex-flow: column;
407 justify-content: flex-start;
408 align-items: flex-start;
409 align-self: flex-start;
410 margin-bottom: 2px;
411 }
412 .wpbc_btn_expand_down a,
413 .wpbc_btn_expand_down a:hover{
414 line-height: 1;
415 text-align: center;
416 color: var(--wpbc_ui__gen__text-color);
417 flex: 0 1 auto;
418 margin: 2px 0 0 -3px;
419 }
420 .wpbc_btn_expand_down i::before {
421 font-size: 20px;
422 }
423
424 /* ------------------------------------------------------------------------------------------------------------------ */
425 /* -- D A T A -- */
426 /* ------------------------------------------------------------------------------------------------------------------ */
427 .wpbc_a_col__data{
428
429 }
430 .wpbc_a_col__details_lables {
431 flex: 1 1 auto;
432 padding-left: 15px;
433 margin-bottom:10px;
434 min-width: 1%;
435 }
436 .wpbc_a_col__cost{
437 flex: 0 0 110px;
438 align-self: stretch;
439 }
440 .wpbc_a_col__action{
441 flex: 0 0 50px;
442 align-self: stretch;
443 }
444 /* -- Notes -- */
445 .wpbc_a_row__notes .wpbc_col_note_readonly {
446 flex: 1 1 1px;
447 margin: 0 10px 10px 15px;
448 }
449 /* -- Sys Information -- */
450 .wpbc_a_row__system .wpbc_col_sys_info {
451 flex: 1 1 1px;
452 margin: 0 10px 5px 18px;
453 }
454 /* ------------------------------------------------------------------------------------------------------------------ */
455 /* -- M o b i l e _ V i e w -- */
456 /* ------------------------------------------------------------------------------------------------------------------ */
457 /* -- Responsive Sizes: < 600px (less top icons), < 782px (no wp left bar), < 960px (wp left bar colapse) ------- */
458 @media (max-width: 960px ) {
459 /* -- Rows Separation -- */
460 .wpbc__list__table{
461 box-shadow: none;
462 }
463 .wpbc__list__table .wpbc_selectable_body {
464 background: transparent;
465 }
466 .wpbc__list__table .wpbc__list__head,
467 .wpbc__list__table .wpbc__list__foot,
468 .wpbc__list__table .wpbc_selectable_body > .wpbc_listing_usual_row {
469 margin: 10px 0;
470 background: var(--wpbc_ui_listing__back_color);
471 border-radius: 6px;
472 padding: 6px 0 6px 4px;
473 box-shadow: 0 0 2px 0 #cbcbcb;
474 min-width: 180px;
475 }
476 .wpbc__list__table .wpbc__list__head,
477 .wpbc__list__table .wpbc__list__foot{
478 padding: 6px;
479 }
480 .wpbc_a_col__cost,
481 .wpbc_a_col__action {
482 align-self: flex-start;
483 }
484 .wpbc_a_col__action {
485 margin-top: 22px;
486 }
487 }
488 @media (max-width: 782px ) {
489 .wpbc_admin {
490 --wpbc_ui_listing__colapsed_height: auto;
491 }
492 /* -- Rows Separation -- */
493 .wpbc_a_col__cost,
494 .wpbc_a_col__action {
495 align-self: stretch;
496 margin:0;
497 }
498 /* -- Main Booking Row -- */
499 .wpbc_a_row__booking {
500 flex-flow: row wrap;
501 }
502 /* all other details. */
503 .wpbc_listing_col .booking_details_simple,
504 .wpbc_listing_col .booking_details_simple * {
505 font-size: 13px;
506 }
507 /* -- Dates -- */
508 .wpbc_a_col__dates {
509 flex: 1 1 170px;
510 }
511 .wpbc_a_col__dates .content_text {
512 flex-flow: row wrap;
513 justify-content: flex-start;
514 align-items: flex-start;
515 margin: 0 5px;
516 }
517 .booking_dates_expand_section {
518 align-items: flex-start;
519 }
520 .wpbc_a_col__dates .wpbc_label.wpbc_label_booking_dates {
521 font-size: 16px;
522 }
523 .wpbc_a_col__dates .wpbc_label.wpbc_label_booking_dates .field-booking-time{
524 font-size: 11px;
525 margin-left: 5px;
526 }
527 /* -- Data & Labels -- */
528 .wpbc_a_col__data {
529 flex: 1 1 100%;
530 }
531 .wpbc_a_col.wpbc_a_col__data.wpbc_a_overflow_hide > .wpbc_a_row.wpbc_a_row_nowrap {
532 flex-flow: row wrap;
533 padding-right: 5px;
534 box-sizing: border-box;
535 }
536 .wpbc_a_col__action{
537 margin-left:auto;
538 min-height:30px;
539 }
540 .wpbc_a_col__details_lables {
541 padding: 10px 0;
542 overflow: auto;
543 scrollbar-width: thin;
544 border-top: 1px dashed #ccc;
545 margin: 5px 0;
546 }
547 .wpbc_row_wrap.max_height_a .wpbc_a_col__details_lables .wpbc_col_booking_labels .content_text{
548 flex-flow: row nowrap;
549 }
550 .wpbc_row_wrap.max_height_a .wpbc_a_col__details_lables .wpbc_col_booking_labels .content_text * {
551 white-space: nowrap;
552 }
553 /* -- Cost -- */
554 .wpbc_a_col__cost .wpbc_listing_col.wpbc_col_cost,
555 .wpbc_a_col__cost .wpbc_listing_col.wpbc_col_cost a {
556 justify-content: flex-start;
557 margin: 0 3px;
558 }
559 .wpbc_listing_col.wpbc_col_action {
560 justify-content: flex-end;
561 }
562 /* -- Notes and Sys Information -- */
563 .wpbc_row_wrap.max_height_a .wpbc_a_row__appointment,
564 .wpbc_row_wrap.max_height_a .wpbc_a_row__notes,
565 .wpbc_row_wrap.max_height_a .wpbc_a_row__system {
566 display:none;
567 }
568 .wpbc_a_row__appointment .wpbc_col_appointment_details {
569 margin: 5px 10px;
570 }
571 .wpbc_a_row__system .wpbc_col_sys_info{
572 margin-left:10px;
573 }
574 .wpbc_a_row__notes {
575 order: 1;
576 }
577 .wpbc_a_row__notes .wpbc_col_note_readonly {
578 margin: 0 10px 5px 5px;
579 }
580 .wpbc_a_row__notes .ui_remark_section__note_readonly textarea {
581 height: 160px;
582 }
583 }
584 @media (max-width: 600px ) {
585
586 }
587 /* == Dates ========================================================================================================= */
588 /* Dates Labels */
589 .wpbc_label.wpbc_label_booking_dates {
590 background-color: transparent;
591 color: #41474e;
592 box-shadow: none;
593 border: 0;
594 font-size: 14px;
595 line-height: 1.7;
596 text-decoration: none;
597 padding: 0;
598 margin: 0 2px 2px;
599 }
600 /* -- Lables ------------------------------------------------------------------------------------------------ */
601 .wpbc__list__table .wpbc_selectable_body .wpbc_listing_col.wpbc_col_booking_labels .content_text {
602 display: flex;
603 flex-flow: row wrap;
604 justify-content: flex-start;
605 align-items: flex-start;
606 gap: 10px;
607 padding: 2px 0;
608 }
609 /* -- Data -------------------------------------------------------------------------------------------------- */
610 .wpbc_row_wrap.max_height_a .wpbc_col_data {
611 white-space: nowrap;
612 }
613 .fieldvalue {
614 margin: 0 1em 0 0;
615 padding: 1px 5px 3px;
616 vertical-align: baseline;
617 border-radius: 2px;
618 background: #fffcf5;
619 background: #f8f8fa;
620 background:transparent;
621 word-wrap: anywhere;
622 }
623 .fieldvalue.name.fieldsearchvalue {
624 font-weight: 600;
625 border-radius: 0;
626 padding: 1px 7px;
627
628 border-bottom: 2px solid #708700;
629 color: #6a8000;
630 background: #f3f6e7;
631
632 color: #904c03;
633 border-bottom: 2px solid #975500;
634 background: #fffaf3;
635 }
636 .wpbc_actions_sysinfo {
637 font-size: 0.7em;
638 }
639 /* -- Specific COL Width -------------------------------------------------------------------------------------------- */
640 .wpbc_col_all_data .wpbc_listing_usual_row{
641 border:0;
642 margin-bottom: 5px;
643 }
644 .wpbc_listing_col.wpbc_col_cost{
645 flex: 0 0 100px;
646 }
647 .wpbc_listing_col.wpbc_col_action{
648 flex: 0 0 70px;
649 }
650 /* -- Stripe - Row --------------------------------------------------------------------------------------------- */
651 .wpbc_ui_el__listing_row:nth-of-type(2n+1) {
652 background-color: var(--wpbc_ui_listing__back_alt_color);
653 border-left-color: var(--wpbc_ui_listing__back_alt_color);
654 }
655 .wpbc_ui_el__listing_row.wpbc_row.row_selected_color {
656 border-left-color: var(--wpbc_ui_listing__selected_row_color);
657 }
658
659 /* == Labels ======================================================================================================== */
660 .wpbc_label {
661 display: inline;
662 flex: 0 1 auto;
663
664 font-size: 0.95em;
665 font-weight: 600;
666 line-height: 2.7;
667 white-space: pre-wrap;
668 text-align: center;
669 vertical-align: baseline;
670
671 padding: 5px 10px;
672 margin: 5px 15px 5px 0;
673 margin: 5px;
674 /*background: rgb(from var(--wpbc_admin-theme-color, #6b96ce) r g b / 100);*/
675 background: var(--wpbc_admin-default_label-color, #6b96ce);
676 color: #fff;
677
678 border-radius: 4px;
679 border: 0;
680 box-shadow: none;
681 }
682 .wpbc_col_booking_labels .wpbc_label {
683 padding: 2px 10px;
684 line-height: 1.7;
685 }
686 .wpbc_label .menu_icon {
687 margin: 0 5px 0 0;
688 }
689 .wpbc_label .label_sup {
690 font-size: 10px;
691 padding: 0 5px 0 0;
692 line-height: 1em;
693 }
694 .wpbc_label_link {
695 display: flex;
696 flex-flow: column nowrap;
697 align-items: center;
698 justify-content: center;
699 cursor: pointer;
700 text-decoration: none;
701 }
702 /* -- Labels Colors ------------------------------------------------------------------------------------------------- */
703 .wpbc__wrap__booking_listing a.wpbc_is_new_button,
704 .wpbc__wrap__booking_listing a.wpbc_is_new_button:hover {
705 position: absolute;
706 margin: 0 0 0 -28px;
707 display:flex; /* It Fix rotating icon, on clicking */
708 opacity: 0.8; /* FixIn: 10.15.1.7. */
709 }
710 .wpbc_label.wpbc_label_booking_id {
711 box-shadow: none;
712 background-color: #fff;
713 border: 1px solid #0000001c;
714 color: #717171;
715 }
716 .wpbc_label.wpbc_label_resource {
717 background-color: #6b96ce;
718 background-color: rgb(from var(--wpbc_admin-theme-color, #6b96ce) r g b / var(--wpbc_admin-theme-opacity, 80%));
719 background-color: var(--wpbc_admin-resource-badge-color, #556e91); /* FixIn: 10.15.6.1. */
720 }
721 .wpbc_label.wpbc_label_deleted_resource {
722 background-color: #ee6f48;
723 }
724 .wpbc_label.wpbc_label_pending {
725 background-color: #ed9f0a;
726 color: #fff;
727 box-shadow: 0 0 1px #fde4c9;
728 }
729 .wpbc_label.wpbc_label_approved {
730 background-color: #64AA45;
731 color: #f7fff4;
732 box-shadow: 0 0 1px #b8c6b1;
733 }
734 /* General class for all payment statuses: .wpbc_label.wpbc_label_payment_status { ... } */
735 .wpbc_label.wpbc_label_payment_status_success {
736 background-color: #468847;
737 }
738 .wpbc_label.wpbc_label_payment_status_pending {
739 background-color: #992;
740 }
741 .wpbc_label.wpbc_label_payment_status_unknown {
742 background-color: #f2f2f3;
743 color: #717379;
744 border: 1px solid #e3e3e3;
745 }
746 .wpbc_label.wpbc_label_payment_status_error {
747 background-color: #FA773D;
748 }
749 .wpbc_label.wpbc_label_imported {
750 background-color: #517aba;
751 }
752 .wpbc_label.wpbc_label_trash {
753 background: #D94A48;
754 color: #fff;
755 text-shadow: 0 0 1px #E00;
756 }
757
758 /* == C O S T ======================================================================================================= */
759 .wpbc_listing_col.wpbc_col_cost a,
760 .wpbc_listing_col.wpbc_col_cost {
761 color: #41474e;
762 font-size: 16px;
763 line-height: 2.7;
764 display: flex;
765 flex-flow: row nowrap;
766 align-items: center;
767 justify-content: center;
768 flex: 0 0 110px;
769 align-self: center;
770 font-weight: 600;
771 cursor: pointer;
772 text-decoration: none;
773 }
774
775 /* == A C T I O N S _ B U T T O N =================================================================================== */
776 .wpbc_listing_col.wpbc_col_action {
777 color: #41474e;
778 font-size: 14px;
779 line-height: 1.7;
780 display: flex;
781 flex-flow: row nowrap;
782 align-items: center;
783 justify-content: center;
784 flex: 0 0 50px;
785 align-self: stretch;
786 }
787 .wpbc_listing_col.wpbc_col_action a.ul_dropdown_menu_toggle,
788 .wpbc_listing_col.wpbc_col_action a.ul_dropdown_menu_toggle:hover,
789 .wpbc_listing_col.wpbc_col_action a.ul_dropdown_menu_toggle:focus{
790 background: #00000012;
791 border-radius: 50%;
792 width: 33px;
793 flex-flow: column;
794 align-items: center;
795 justify-content: center;
796 aspect-ratio: 1/1;
797 color: #555;
798 display: flex;
799 }
800 /* Options for actions in Dropdown Actions Menu*/
801 .wpbc__wrap__booking_listing .wpbc_ui_el__dropdown .ul_dropdown_menu > li > a.ul_dropdown_menu_li_action,
802 .wpbc_col_action .wpbc_ui_el__dropdown .ul_dropdown_menu > li > a.ul_dropdown_menu_li_action {
803 display: flex;
804 flex-flow: row nowrap;
805 justify-content: flex-start;
806 align-items: center;
807 }
808 .wpbc_col_action .wpbc_ui_el__dropdown .ul_dropdown_menu > li > a.ul_dropdown_menu_li_action > *:last-child {
809 margin-left: auto;
810 padding-left: 1em;
811 }
812 /* if icon spinning then no padding */
813 .wpbc_col_action .wpbc_ui_el__dropdown .ul_dropdown_menu > li > a.ul_dropdown_menu_li_action > *:last-child.wpbc_spin {
814 padding-left:0;
815 }
816 /* Approved - left border line */
817 .ul_dropdown_menu_li_action_set_booking_approved {
818 border-left: 2px solid var(--wpbc_ui_listing__approved_color);
819 }
820 /* Pending - left border line */
821 .ul_dropdown_menu_li_action_set_booking_pending {
822 border-left: 2px solid var(--wpbc_ui_listing__pending_color);
823 }
824 /* Trash - left border line */
825 .wpbc_ui_el__dropdown .ul_dropdown_menu > li > a.ul_dropdown_menu_li_action_move_booking_to_trash.hide_button_if_no_selection:not(:hover, :focus),
826 .ul_dropdown_menu_li_action_move_booking_to_trash.hide_button_if_no_selection,
827 .wpbc_ui_el__dropdown .ul_dropdown_menu > li > a.ul_dropdown_menu_li_action_move_booking_to_trash:not(:hover,:focus){
828 /*border-left: 2px solid var(--wpbc_ui_listing__trash_color);*/
829 /*color: var(--wpbc_ui_dropdown__a-color);*/
830 color: #d79249;
831 }
832 .wpbc_ui_el__dropdown .ul_dropdown_menu > li > a.ul_dropdown_menu_li_trash_color:not(:hover,:focus),
833 .wpbc_ui_el__dropdown .ul_dropdown_menu > li > a.ul_dropdown_menu_li_action_delete_booking_completely:not(:hover,:focus) {
834 color:var(--wpbc_ui_listing__trash_color);
835 }
836 .wpbc_ui_el__dropdown .ul_dropdown_menu > li > a.ul_dropdown_menu_li_action_restore_booking_from_trash:not(:hover,:focus) {
837 color:var(--wpbc_ui_listing__restore_color);
838 }
839 .ul_dropdown_menu_li_action .hint_value_instead_icon {
840 font-size: 0.85em;
841 font-weight: 600;
842 align-self: center;
843 line-height: 1;
844 }
845
846 /* ================================================================================================================== */
847 /* -- M O D A L _ A C T I O N S ----------------------------------------------------------------------------------- */
848 /* ================================================================================================================== */
849 /* Modal SIZE */
850 @media (min-width: 768px) {
851 #wpbc_modal__set_booking_note__section .modal-dialog {
852 width: 80%;
853 margin: 5px auto;
854 }
855 }
856 /* -- Input Fields -------------------------------------------------------------------------------------------------- */
857 .wpbc_page .wpbc_modal_in_listing input[type=text],
858 .wpbc_page .wpbc_modal_in_listing select,
859 .wpbc_page .wpbc_modal_in_listing textarea{
860 width: 100%;
861 max-width: 100%;
862 font-size: 15px;
863 line-height: 2.4;
864 }
865 .wpdevelop .modal-footer .button {
866 margin: 0 5px;
867 }
868 /* -- Modal Payment Request ----------------------------------------------------------------------------------------- */
869 #wpbc_modal__send_payment_request__section p.help-block {
870 /*font-size: 13px;*/
871 /*line-height: 2;*/
872 /*margin: 15px 0 0;*/
873 }
874 #wpbc_modal__send_payment_request__section label.help-block {
875 /*font-size: 0.9em;*/
876 }
877 #wpbc_modal__send_payment_request__section #wpbc_modal__send_payment_request__url{
878 font-size: 13px;
879 }
880 #wpbc_modal__send_payment_request__section #wpbc_modal__send_payment_request__value {
881 margin-top: 15px;
882 line-height: 2;
883 height: 70px;
884 font-size: 14px;
885 }
886 .wpbc_modal__2_fields {
887 display: flex;
888 flex-flow: row nowrap;
889 justify-content: flex-start;
890 align-items: center;
891 }
892 .wpbc_modal__2_fields .wpbc_modal__2_fields_button {
893 flex: 0 1 1%;
894 align-self: stretch;
895 min-height: 35px;
896 margin-left: 10px;
897 display: flex;
898 align-items: center;
899 align-self: center;
900 font-weight: 600;
901 }
902 #wpbc_modal__send_payment_request__section .wpbc_modal__send_payment_request__cost {
903 font-size: 16px;
904 font-weight: 600;
905 padding: 0 10px;
906 }
907 /* -- Notes --------------------------------------------------------------------------------------------------------- */
908 .ui_remark_section__note_readonly {
909 width:99%;
910 margin: 0;
911 }
912 .ui_remark_section__note_readonly label{
913 font-size: 0.9em;
914 font-weight: 600;
915 }
916 .ui_remark_section__note_readonly a {
917 font-size: 0.9em;
918 line-height: 2;
919 margin: 7px 3px 0;
920 float: right;
921 padding: 0;
922 text-decoration: none;
923 font-weight: 600;
924 }
925 .ui_remark_section__note_readonly a i::before{
926 font-size:11px;
927 }
928 .ui_remark_section__note_readonly textarea {
929 font-size: 12px;
930 width: 100%;
931 scrollbar-width: thin;
932 height: 70px;
933 line-height: 1.75;
934 color: #777;
935 box-shadow: none;
936 border: 1px solid #d5d5d5;
937 background: #fefefe;
938 }
939 /* -- Modal Notes --------------------------------------------------------------------------------------------------- */
940 #wpbc_modal__set_booking_note__section textarea {
941 margin-top: 5px;
942 line-height: 1.8;
943 height: 120px;
944 font-size: 13px;
945 }
946 .modal-header .wpbc_modal__booking_id__in_title {
947 font-size: 0.6em;
948 font-weight: 600;
949 margin-left: 5px;
950 top: -0.75em;
951 }
952 .modal-header .wpbc_modal__title__reason__booking_id {
953 font-size: 0.7em;
954 font-weight: 400;
955 margin-left: 5px;
956 top: -0.1em;
957 word-break: break-all;
958 }
959 /**********************************************************************************************************************/
960 /** Hidden Templates **/
961 /**********************************************************************************************************************/
962 .wpbc_hidden_templates {
963 display: none;
964 }
965 /* ================================================================================================================== */
966 /* == F I L T E R E L E M E N T S == */
967 /* ================================================================================================================== */
968 /* -- Dropdown Menu, where we show selected value in main toggle, sucn as in - SORT BY -- */
969 .wpbc_ui_el__dropdown .ul_dropdown_menu_toggle .selected_value {
970 margin: 0 0.2em;
971 }
972 .wpbc_ui_el__dropdown .ul_dropdown_menu_toggle .selected_value .menu_icon{
973 margin: 0 0 0 2px;
974 }
975 .wpbc_ui_el__dropdown .ul_dropdown_menu_toggle .selected_value [class*=" wpbc-bi-"]::before {
976 font-size: 1.08em;
977 /*font-weight: 600 !important;*/
978 vertical-align: -.18em;
979 }
980 /* ================================================================================================================== */
981 /* == T O O L B A R i n Booking Listing == */
982 /* ================================================================================================================== */
983 .wpbc_ui_toolbar.wpbc_ui_toolbar__bo_listing {
984 margin: var(--wpbc_ui_horis_top_nav__margin);
985 }
986
987 /* Appointment snapshot details shown only for rows with Appointment data. */
988 .wpbc_appointment_booking_details {
989 border: 1px dashed #777;
990 border-radius: 4px;
991 display: flex;
992 flex-flow: row wrap;
993 gap: 4px 18px;
994 line-height: 1.6;
995 padding: 8px 10px;
996 margin: 0 20px 0 15px;
997 }
998 .wpbc_appointment_booking_details > strong {
999 flex: 1 1 100%;
1000 }
1001 .wpbc_appointment_booking_details > span {
1002 overflow-wrap: anywhere;
1003 }
1004