PluginProbe
Taskbuilder – Project Management & Task Management Tool With Kanban Board / trunk
Taskbuilder – Project Management & Task Management Tool With Kanban Board vtrunk
6.0.5 6.0.2 6.0.3 6.0.4 6.0.1 6.0.0 5.0.8 5.0.9 4.0.9 5.0.0 5.0.1 5.0.2 5.0.3 5.0.4 5.0.5 5.0.6 5.0.7 trunk 1.0.0 1.0.1 1.0.2 1.0.3 1.0.4 1.0.5 1.0.6 All 57 releases
taskbuilder / asset / css / admin.css

admin.css in Taskbuilder – Project Management & Task Management Tool With Kanban Board trunk, at asset/css/admin.css

2,494 lines 52.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .wppm-heading-inline{
2 display:inline-block;
3 margin-right:5px;
4 margin-bottom: 0;
5 padding: 9px 0 4px 0;
6 line-height: 1.3;
7 font: 22px "OpenSans-Light",Helvetica,Arial,sans-serif;
8 }
9 .wppm_table_header{
10 font-weight: normal;
11 font-size: 14px;
12 font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
13 }
14 .wppm_admin_logo{
15 margin-right:5px !important;
16 }
17 .mce-window.mce-in, .mce-menu.mce-in.mce-animate{
18 z-index: 900000000001 !important;;
19 }
20 .wppm-add-new-btn{
21 padding: 4px 8px;
22 position: relative;
23 top: -3px;
24 text-decoration: none;
25 border: 1px solid #0071a1;
26 border-radius: 2px;
27 text-shadow: none;
28 font-weight: 600;
29 font-size: 13px;
30 line-height: normal;
31 color: #0071a1;
32 background: #f3f5f6;
33 cursor: pointer;
34 display: inline-block;
35 }
36 .wppm_loading_icon img{
37 margin-left: auto;
38 margin-right: auto;
39 margin-top: auto;
40 display: block;
41 margin-bottom: auto;
42 }
43 #wppm_project_container .wppm_loading_icon, #wppm_task_container .wppm_loading_icon{
44 margin-top: 118px;
45 }
46 .wppm_bootstrap .dataTables_wrapper .dataTables_length select{
47 padding: 0 24px 0 8px !important;
48 }
49 #wppm_add_new_project_frm{
50 position: relative;
51 min-width: 100px;
52 border: 1px solid #ccd0d4;
53 box-shadow: 0 1px 1px rgba(0,0,0,.04);
54 background: #fff;
55 }
56 input[type=text]{
57 box-shadow: 0 0 0 transparent;
58 border-radius: 4px;
59 border: 1px solid #7e8993;
60 background-color: #fff;
61 color: #32373c;
62 }
63 .wppm-button {
64 display: inline-block;
65 text-decoration: none;
66 font-size: 13px;
67 line-height: 26px;
68 height: 28px;
69 margin: 0;
70 padding: 0 10px 1px;
71 cursor: pointer;
72 border-radius: 3px;
73 white-space: nowrap;
74 box-sizing: border-box;
75 border: none;
76 }
77 .wppm-primary {
78 background: #1A9ED4;
79 color: #fff;
80 }
81 .wppm-primary:hover {
82 color: #fff;
83 }
84 .wppm_table{
85 background: #fff;
86 box-shadow: 0 1px 1px rgba(0,0,0,.04);
87 border-spacing: 0;
88 width: 100%;
89 clear: both;
90 margin-top: 10px;
91 display: table;
92 border-collapse: separate;
93 color: #444;
94 font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
95 font-size: 13px;
96 line-height: 1.4em;
97 max-width:100%;
98 }
99 .wppm_table th{
100 border-bottom: 1px solid #555c64;
101 line-height: 2.2em;
102 font-weight: 400;
103 text-align: left;
104 font-size: 14px;
105 display: table-cell;
106 vertical-align: inherit;
107 background-color:#304FFE;
108 color: #FFFFFF;
109 width:2.2em;
110 padding:0 0 0 3px;
111 }
112 .wppm_table td{
113 vertical-align: middle;
114 padding: 5px 0 5px 2px;
115 width: 2.2em;
116 color: #32373c;
117 font-weight: 400;
118 text-align: left;
119 line-height: 1.3em;
120 font-size: 14px;
121 display: table-cell;
122 white-space: normal;
123 }
124 .wppm_table tbody{
125 word-wrap: break-word;
126 display: table-row-group;
127 vertical-align: middle;
128 border-color: inherit;
129 background-color: #ffffff;
130 color: #444;
131 font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
132 font-size: 13px;
133 line-height: 1.4em;
134 white-space: normal;
135 }
136 .wppm_table tr:hover{
137 background-color:#f5f5f5;
138 cursor: pointer;
139 }
140 .wppm_table tr{
141 display: table-row;
142 vertical-align: middle;
143 }
144 #wppm_project_table tr:nth-child(even){
145 background-color: #f2f2f2;
146 }
147 #wppm_project_table td{
148 font-weight: 400;
149 font-family: "Nunito", "Segoe UI", arial;
150 border: none !important;
151 white-space: normal;
152 }
153 #wppm_project_table th{
154 border: none !important;
155 }
156 .wppm_thread,.wppm_proj_thread{
157 background-color: #FFFFFF;
158 color: #000000;
159 border-color: #C3C3C3;
160 display: table;
161 padding: 10px;
162 background-color: #FFFFFF;
163 border-radius: 5px;
164 margin-bottom: 20px;
165 margin-top: 10px;
166 }
167 .wppm_thread_avatar{
168 display: table-cell;
169 vertical-align: top;
170 width: 40px;
171 padding: 5px 5px 5px 10px;
172 }
173 .wppm_thread_body{
174 display: table-cell;
175 vertical-align: top;
176 padding: 0 15px 5px 15px;
177 width: 100%;
178 }
179 .wppm_thread_user_name{
180 margin-bottom: 10px;
181 font: 15px "Helvetica Neue",Helvetica,Arial,sans-serif;
182 }
183 #wppm_load_individual_project{
184 border-radius: 4px;
185 color: #2C3E50;
186 min-height: 300px;
187 width: 99%;
188 margin-top: 25px;
189 padding-left: 15px;
190 }
191 .wppm_sidebar_labels{
192 font-size: 12px;
193 margin: 10px 0;
194 cursor: pointer;
195 overflow: hidden;
196 color: #9c9c9c;
197 }
198 .wppm_label_info{
199 margin-right: 5px;
200 font-size: 12;
201 font-weight: 400;
202 }
203 .wppm_sidebar .wppm_body{
204 padding-top: 20px;
205 }
206 .wppm_body {
207 padding-left: 0px;
208 }
209 .wppm_sidebar .row{
210 background-color: #fff;
211 padding: 0 15px;
212 border-radius: 4px;
213 margin-bottom: 15px;
214 }
215 #wppm_project_status_widget{
216 margin-top: 10px;
217 border: 1px solid #eee !important;
218 }
219 .wppm_widget{
220 display: flex;
221 flex-direction: column;
222 width: 100%;
223 min-width: 100%;
224 max-width: 100%;
225 box-sizing: border-box;
226 margin-bottom: 15px;
227 border: 1px solid #eee !important;
228 }
229 .wppm-widget-header {
230 display: flex;
231 align-items: center;
232 padding: 10px;
233 }
234 .wppm-widget-header span {
235 display: flex;
236 align-items: center;
237 margin-left: 5px;
238 cursor: pointer;
239 }
240 .wppm-widget-header h4 {
241 flex-grow: 1;
242 margin: 0px !important;
243 }
244 .wppm-widget-body {
245 display: flex;
246 flex-direction: column;
247 padding: 10px 10px 0;
248 }
249 .wppm-btn{
250 padding: 5px 10px;
251 border-radius: 20px;
252 font-size: 14px;
253 margin-left:20px;
254 background-color: #5067c5;
255 color:#ffffff!important;
256 border: 1px solid #8a8a8a !important;
257 }
258 .wppm-btn-cancel{
259 padding: 5px 10px;
260 border-radius: 14px;
261 font-size: 14px;
262 margin-left:20px;
263 background: linear-gradient(135deg, #ffffff, #ffffff);
264 color:#000000;
265 border: 1px solid #C3C3C3;
266 }
267 .wppm_admin_label{
268 border-radius: 30px;
269 font-weight: bold;
270 padding: 5px 10px;
271 font-size: 10px;
272 }
273 .wppm_section_title{
274 display:inline-block;
275 margin-right:20px;
276 font-size: 23px;
277 font-weight: 400;
278 margin-bottom: 0;
279 padding: 9px 0 4px 0;
280 line-height: 1.3;
281 }
282 #wppm_task_table{
283 width:100%;
284 background-color: #FFFFFF;
285 cursor: pointer;
286 }
287 #wppm_task_table tr:nth-child(even){
288 background-color: #f2f2f2;
289 }
290 #wppm_task_table td{
291 /* border: 1px solid #f2f2f2; */
292 font-weight: 400;
293 font-family: "Nunito", "Segoe UI", arial;
294 border: none !important;
295 white-space: normal;
296 }
297 #wppm_task_table th{
298 border: none !important;
299 }
300 #wppm_task_table_container{
301 padding: 0 15px 15px 15px;
302 }
303 .wppm_status{
304 background-color: aqua;
305 border-radius: 30px;
306 padding: 3px 5px 3px 5px;
307 color: #FFFFFF;
308 font-weight: 600;
309 letter-spacing: .3px;
310 font-size: 10px;
311 display: inline-block;
312 text-align: center;
313 line-height: 1;
314 }
315 .wppm_category{
316 background-color: red;
317 border-radius: 30px;
318 padding: 3px 5px 3px 5px;
319 color: #FFFFFF;
320 font-weight: 600;
321 letter-spacing: .3px;
322 font-size: 10px;
323 display: inline-block;
324 text-align: center;
325 line-height: 1;
326
327 }
328 .avatar{
329 border-radius: 50%;
330 border: 2px solid #FFF;
331 margin-left: -12px;
332 border: 2px solid #FFF;
333 }
334 .wppm_action_btn{
335 background-color: #FFF;
336 color: #383333 !important;
337 margin-bottom: 3px !important;
338 }
339 /***
340 * Filter display css start
341 */
342 .wppm_filter_display_container{
343 list-style-type: none !important;
344 width: 100% !important;
345 margin: 0 !important;
346 float: left;
347 }
348 .wppm_filter_display_element{
349 max-width: 300px !important;
350 float: left;
351 margin: 3px 3px 3px 0 !important;
352 }
353 .wppm_filter_display_element .flex-container{
354 display: flex;
355 border-radius: 4px;
356 background-color:#1E90FF;
357 color:#fff;
358 font-size: 10px;
359 }
360 .wppm_filter_display_text{
361 max-width: 280px !important;
362 padding: 5px;
363 }
364 .wppm_filter_display_remove{
365 width: 20px !important;
366 padding: 6px;
367 cursor: pointer;
368 }
369 .wppm_padding_space{
370 padding-top: 20px;
371 }
372 .wppm_setting_col2{
373 background-color: #fff;
374 width: 62% !important;
375 padding: 20px;
376 border-radius: 20px;
377 }
378 .wppm_padding_space{
379 padding-top: 20px;
380 }
381 .wppm-sortable-handle,.wppm-sortable-edit,.wppm-sortable-delete,.wppm-sortable-clone{
382 cursor: pointer;
383 width: 25px;
384 }
385 .wppm-sortable-label{
386 width: 220px;
387 }
388 .wppm-flex-container {
389 display: flex;
390 border-radius: 5px;
391 max-width: 320px;
392 height: 35px;
393 }
394 .wppm-title{
395 font:18px "OpenSans-Light",Helvetica,Arial,sans-serif;
396 }
397 .wppm-flex-container > div {
398 margin: 5px 0 5px 5px;
399 padding: 3px;
400 font-size: 12px;
401 }
402 .wppm_alert{
403 position: fixed;
404 top: 50px;
405 right: 50px;
406 font-size: 15px;
407 font-weight: bold;
408 z-index: 10000000000000;
409 }
410 #wppm_add_new_project{
411 margin:20px;
412 background-color: #FFFFFF;
413 font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
414 }
415 .wppm_form_field_label{
416 font-size: 13px;
417 font-style:bold ;
418 }
419 .wppm_task_description,.wppm_project_description{
420 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
421 }
422 .wppm_email_notification_header{
423 padding-left: 15px;
424 }
425 #wppm_project_container{
426 border-radius: 4px;
427 border: 1px solid #E5E4E4;
428 background-color: #fff;
429 color: #2C3E50;
430 min-height: 300px;
431 width: 99%;
432 }
433 #wppm_frm_field_container{
434 padding: 0 20px;
435 padding-top: 15px;
436 width:100%;
437 }
438 .wppm_frm_submit{
439 padding: 0 30px;
440 margin: 30px 0;
441 }
442 .wppm_td_project_status{
443 border-radius: 30px;
444 padding: 3px 5px 3px 5px;
445 font-weight: 600;
446 letter-spacing: .3px;
447 font-size: 10px;
448 display: inline-block;
449 text-align: center;
450 line-height: 1;
451 }
452 #wppm_apply_filter{
453 background-color:#306EFF;
454 margin-bottom:2px;
455 }
456
457 .wppm_label{
458 font-size: 12px;
459 font-weight: 600;
460 color: #9c9c9c;
461 width: 100%;
462 }
463 #wppm_avatar{
464 background-color:black;
465 padding: 3px;
466 color: #fff;
467 display: inline!important;
468 }
469 #wppm_project_search_filter{
470 padding: 0 30px;
471 border-radius: 20px;
472 font: 12px "Helvetica Neue",Arial,Helvetica,sans-serif;
473 }
474 #wppm_project_search_filter_img, .wppm_task_search_filter_img{
475 position: relative !important;
476 top: 10px;
477 left: 30px;
478 }
479 .wppm_add_new_task_img, .wppm_task_list_image{
480 padding-right: 5px;
481 padding-bottom: 3px;
482 }
483 .wppm_table_td{
484 font-size: 14px !important;
485 }
486 #wppm_project_and_task_search{
487 width:40%;
488 margin-top: 15px;
489 }
490 #wppm_project_and_task_search svg{
491 width: 16px;
492 height: 16px;
493 margin-left: 10px;
494 float: left;
495 margin-top: -26px;
496 cursor: pointer;
497 }
498 .wppm_project_frm_fields ul, #frm_get_task_users ul, #frm_get_task_creator ul, #frm_get_project_users ul, #frm_get_project_creator ul{
499 border: 1px solid #ddd;
500 list-style-type: none!important;
501 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
502 }
503 #wppm_task_search{
504 flex-shrink: 0;
505 white-space: nowrap;
506 width:40%;
507 margin-top: 15px;
508 display: flex;
509 /* align-items: center;
510 gap: 8px;
511 align-items: center; */
512 flex-wrap: nowrap;
513 }
514 #wppm_task_search svg{
515 width: 16px;
516 height: 16px;
517 margin-left: 10px;
518 float: left;
519 margin-top: -26px;
520 cursor: pointer;
521 }
522 #wppm_task_search_filter{
523 padding: 0 30px;
524 border-radius: 20px;
525 width: auto;
526 flex: 1;
527 min-width: 150px;
528 min-height: 30px!important;
529 }
530 #wppm_more_filter_option div{
531 display: inline-block;
532 }
533 #wppm_heading_inline svg{
534 width: 28px;
535 height:23px;
536 }
537 .wppm_card_header{
538 border-bottom: 1px solid #EFF2F7;
539 height: 35px;
540 padding-top: 5px;
541 padding-bottom: 5px;
542 }
543 .wppm_task_list{
544 border:1px solid #EFF2F7;
545 display:flex;
546 flex-direction:column;
547 flex-basis: 30%;
548 /* flex: 1 0 auto; */
549 overflow: hidden;
550 flex-grow: 1;
551 flex-shrink: 0;
552 margin:5px;
553 }
554 @media screen and (max-width: 767px) {
555 .wppm_task_list{
556 flex-basis: 50%;
557 }
558 }
559 .wppm_task_name_grid_view, .wppm_task_due_date_grid_view, .wppm_empty_container, .wppm_proj_name_grid_view{
560 font-family: "OpenSans-Semibold","Helvetica Neue",Arial,Helvetica,sans-serif;
561 font-size: 14px;
562 }
563 .wppm_card_body{
564 text-align: center;
565 border:1px solid #EFF2F7;
566 margin: 10px;
567 text-align:left;
568 padding: 10px 5px 10px 0px;
569 border-radius: 5px;
570 }
571 .wppm_task_container{
572 overflow:scroll;
573 display: flex;
574 flex-direction: row;
575 margin-top:40px;
576 overflow-x: auto;
577 overflow-y: auto;
578 min-height: 750px;
579 }
580 #wppm_task_frm_field_container{
581 padding-top: 20px;
582 width:100%;
583 }
584 #wppm_add_new_task{
585 margin:20px;
586 background-color: #FFFFFF;
587 font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
588 }
589 #wppm_task_container{
590 border-radius: 4px;
591 border: 1px solid #E5E4E4;
592 background-color: #fff;
593 color: #2C3E50;
594 min-height: 300px;
595 width: 99%;
596 }
597 .wppm-submit-btn{
598 color: #FFF !important;
599 background-color: #306EFF;
600 border-color: #306EFF;
601 box-shadow: inset 0 1px 0 rgb(255 255 255 / 15%);
602 cursor: pointer;
603 border-radius: 50px !important;
604 padding: 5px;
605 }
606 .wppm_btn{
607 border-radius: 15px!important;
608 }
609 .wppm_reset_btn{
610 color: #273444;
611 background-color: #EFF2F7;
612 border-color: #EFF2F7;
613 border-radius: 50px;
614 padding: 5px;
615 }
616 .select2-selection--single{
617 height:35px!important;
618 }
619 .select2-container{
620 width:500px!important;
621 }
622 .wppm_td_task_status{
623 border-radius: 30px;
624 padding: 3px 5px 3px 5px;
625 font-weight: 600;
626 letter-spacing: .3px;
627 font-size: 10px;
628 display: inline-block;
629 text-align: center;
630 line-height: 1;
631 }
632 .wppm_td_task_priority{
633 border-radius: 30px;
634 padding: 3px 5px 3px 5px;
635 font-weight: 600;
636 letter-spacing: .3px;
637 font-size: 10px;
638 display: inline-block;
639 text-align: center;
640 line-height: 1;
641 }
642 .wppm_empty_container{
643 display: flex;
644 justify-content: center;
645 align-items: center;
646 font-size: 10;
647 font-weight: 500;
648 color: #becdd9;
649 border: 1px dashed #becdd9;
650 height: 0;
651 opacity: 0;
652 border-radius: 15px;
653 opacity: 1;
654 height: 60px;
655 margin-top: 10px;
656 }
657 .wppm_card_task_action{
658 text-align:right;
659 }
660 .wppm_card_task_progress{
661 color:#8492A6;
662 text-align: right;
663 }
664 .wppm_status_name{
665 text-align:left;
666 font-family: "OpenSans-Regular","Helvetica Neue",Arial,Helvetica,sans-serif;
667 font-size: 15px;
668 padding-top: 5px;
669 }
670 .wppm_task_frm_fields ul{
671 border: 1px solid #ddd;
672 list-style-type: none;
673 }
674 .wppm_task_frm_fields li{
675 padding: 5px;
676 }
677 #wppm_view_task_search_filter{
678 padding: 0 30px;
679 border-radius: 20px;
680 }
681 .wppm_task_details, .wppm_project_details{
682 border-bottom: 1px dashed;
683 cursor: pointer;
684 display: inline-block;
685 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
686 }
687 .wppm_task_details_priority{
688 cursor: pointer;
689 }
690 .wppm_task_details_label, #wppm_add_checklist, .wppm_project_details_label{
691 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
692 color: #858c96;
693 width: 98px;
694 float: left;
695 word-wrap: break-word;
696 margin: 5px;
697 cursor: pointer;
698 }
699 .wppm_task_details_container{
700 background-color: #FFFFFF;
701 margin: 15px;
702 padding-bottom: 10px;
703 border: 1px solid #eee !important;
704 }
705 .wppm_task_checklist_container, .wppm_thread{
706 background-color: #FFFFFF;
707 margin: 15px;
708 border: 1px solid #eee !important;
709 }
710 .wppm_proj_thread{
711 background-color: #FFFFFF;
712 border: 1px solid #eee !important;
713 }
714
715 .wppm_progress_bar_container{
716 margin-bottom: 6px;
717 margin-top: 5px;
718 position: relative;
719 }
720 .wppm_progress_bar{
721 background: rgba(9,30,66,.08);
722 border-radius: 4px;
723 clear: both;
724 height: 8px;
725 margin: 0 0 0 40px;
726 overflow: hidden;
727 position: relative;
728 }
729 .wppm_progressbar_label {
730 color: #5e6c84;
731 font-size: 11px;
732 line-height: 10px;
733 position: absolute;
734 top: -1px;
735 left:0;
736 text-align: center;
737 width: 32px;
738 margin-left:10px;
739 }
740 .wppm_checkprogress{
741 bottom: 0;
742 left: 0;
743 position: absolute;
744 overflow:hidden;
745 top: 0;
746 transition-duration: .14s;
747 transition-timing-function: ease-in;
748 margin:10px,0px,10px,0px !important;
749 }
750 .wppm_checklist_divider{
751 margin: 0 15px 0 15px;
752 }
753 .wppm_add_checklist_item_btn{
754 margin-top:10px !important;
755 }
756 #wppm_checklist_btn{
757 margin:10px;
758 }
759 #wppm_add_checklist{
760 border-bottom: 1px dashed;
761 }
762 .wppm_total_checked_item{
763 margin-left: 5px !important;
764 margin-bottom: 10px !important;
765 }
766 .wppm_checklist_total_checked_item{
767 color:#8492A6;
768 font-size: 10px !important;
769 }
770 .wppm_checklist input[type="checkbox"]{
771 margin:5px;
772 }
773 .wppm_card_body{
774 cursor:pointer;
775 }
776 #wppm_grid_view_btn{
777 border: 1px solid #ccc;
778 padding: 5px;
779 background-color: #FFFFFF;
780 float: right;
781 border-radius: 4px;
782 cursor: pointer;
783 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
784 color: #858c96;
785 margin-bottom: 5px;
786 margin-top: 5px;
787 }
788 #tb-advanced-toggle{
789 border: 1px solid #ccc;
790 padding: 6px;
791 background-color: #FFFFFF;
792 /* float: right; */
793 border-radius: 4px;
794 cursor: pointer;
795 /* margin-top:10px; */
796 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
797 color: #858c96;
798 }
799 #wppm_list_view_btn{
800 border: 1px solid #ccc;
801 padding: 5px;
802 background-color: #FFFFFF;
803 float: right;
804 border-radius: 4px;
805 cursor: pointer;
806 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
807 color: #858c96;
808 }
809 #wppm_select_user_role{
810 margin: 10px 10px 10px 0px;
811 }
812 .wppm_delete_user_icon, .wppm_user_roles{
813 margin-top: 7px;
814 cursor: pointer;
815 }
816 #wppm_project_users,#wppm_task_users {
817 margin-bottom: 10px;
818 }
819 .wppm_project_user_avatar,.wppm_task_user_avatar{
820 padding: 10px;
821 overflow:hidden;
822 }
823 .wppm_project_user_names, .wppm_task_user_names,.wppm_project_user_role{
824 padding: 0 0 10px 5px;
825 overflow:hidden;
826 color:#9c9c9c;
827 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
828 }
829 .wppm_project_users_not_assign_label{
830 color:#9c9c9c;
831 }
832 .wppm_user_display_container, .wppm_task_user_display_container{
833 padding: 5px;
834 }
835 #wppm_user_name, #wppm_task_user_name{
836 margin-bottom: 10px;
837 }
838 #wppm_task_users,#wppm_project_creator{
839 margin-left: 10px;
840 }
841 #wppm_comment_btn{
842 display:none;
843 padding: 10px;
844 }
845 #wppm_proj_comment_btn{
846 display:none;
847 padding: 10px;
848 }
849 #wppm_activity_container{
850 background-color:#ffffff;
851 margin:15px;
852 border: 1px solid #eee !important;
853 }
854 .wppm_task_discussion{
855 font: 18px "Helvetica Neue",Helvetica,Arial,sans-serif;
856 }
857 .wppm_proj_discussion{
858 font: 18px "Helvetica Neue",Helvetica,Arial,sans-serif;
859 }
860 .wppm_delete_checklist{
861 color:#b73232 !important;
862 font: 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
863 border-bottom: 1px dashed;
864 position: relative;
865 margin-left: 12px;
866 cursor: pointer;
867 transition: 170ms linear all;
868 }
869 .wppm_delete_checklist:hover{
870 color:#2067b0 !important;
871 border-bottom: 1px dashed !important;
872 text-decoration:none !important;
873 }
874 .wppm_add_checklist{
875 color: #80868e !important;
876 font: 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
877 border-bottom: 1px dashed !important;
878 position: relative;
879 margin-left: 12px;
880 cursor: pointer;
881 transition: 170ms linear all;
882 }
883 .wppm_add_checklist:hover{
884 border-bottom: 1px dashed !important;
885 text-decoration:none !important;
886 }
887 #wppm_task_comment{
888 width: 80%;
889 height: 30px;
890 padding: 5px;
891 margin-bottom: 15px;
892 overflow: hidden;
893 border: 1px solid #eee;
894 color:#eee;
895 margin-top: 10px;
896 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
897 }
898 #wppm_proj_comment{
899 width: 80%;
900 height: 30px;
901 padding: 5px;
902 margin-bottom: 15px;
903 overflow: hidden;
904 border: 1px solid #eee;
905 color:#eee;
906 margin-top: 10px;
907 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
908 }
909 .wppm_attachment_title{
910 font: 15px "Helvetica Neue",Helvetica,Arial,sans-serif;
911 }
912 .wppm_comment_date{
913 color:#a8aeb5;
914 }
915 .wppm_comment_date:hover{
916 color:#000000;
917 font-style: normal;
918 }
919 #wppm_attach_file{
920 color:#301db7;
921 cursor:pointer;
922 font-weight: normal;
923 text-decoration-line: underline;
924 text-decoration-style: dotted;
925 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
926 }
927 #wppm_individual_cancel_comment_btn{
928 float:right;
929 background-color:#ffffff;
930 margin-left: 5px;
931 margin-top:5px;
932 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
933 }
934 #wppm_individual_submit_task_comment_btn{
935 float:right;
936 margin-left: 5px;
937 margin-top:5px;
938 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
939 }
940 #wppm_proj_attach_file{
941 color:#301db7;
942 cursor:pointer;
943 font-weight: normal;
944 text-decoration-line: underline;
945 text-decoration-style: dotted;
946 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
947 }
948 #wppm_individual_cancel_proj_comment_btn{
949 float:right;
950 background-color:#ffffff;
951 margin-left: 5px;
952 margin-top:5px;
953 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
954 }
955 #wppm_individual_submit_proj_comment_btn{
956 float:right;
957 margin-left: 5px;
958 margin-top:5px;
959 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
960 }
961 .wppm_thread_messege{
962 font-size: 14px;
963 font-weight: 400;
964 color: #4e4e4e;
965 }
966 .wppm_attachment_cancel{
967 float: right;
968 margin: -22px 0px 0 0;
969 cursor: pointer;
970 }
971 .widget_header{
972 margin-bottom: 3px !important;
973 font: 14px "Helvetica Neue",Helvetica,Arial,sans-serif !important;
974 }
975 .wppm_task_label,.wppm_checklist_label,.wppm_project_label{
976 font: 18px "Helvetica Neue",Helvetica,Arial,sans-serif !important;
977 }
978 .widget_divider{
979 margin:4px 0 6px 0px !important;
980 }
981 .wppm_individual_task_widget{
982 margin-top: 15px!important;
983 }
984 .select2-container{
985 z-index:999999999!important;
986 width:100%!important;
987 }
988 .flatpickr-calendar{
989 z-index:999999999999!important;
990 }
991 #wppm_edit_task_label{
992 width: 100%;
993 margin-bottom: 10px;
994 }
995 #wppm_edit_project_title, #wppm_edit_task_priority,#wppm_edit_task_description_label{
996 margin-bottom:10px;
997 }
998 #wppm_edit_task_priority{
999 max-width:100%!important;
1000 }
1001 .wppm_edit_task_details_widget, .wppm_thread_action, .wppm_edit_project_details_widget{
1002 float:right;
1003 cursor:pointer;
1004 }
1005 .wppm_add_new_task_btn, #wppm_task_list_btn,#wppm_delete_btn,#wppm_delete_task_btn,#wppm_clone_task_btn,#wppm_print_task_btn,#wppm_archieve_task_btn,#wppm_dashboard_btn{
1006 cursor: pointer;
1007 }
1008 #wppm_project_details_container{
1009 border: 1px solid #eee;
1010 margin-top: 12px;
1011 padding-top: 10px;
1012 margin-bottom: 12px;
1013 }
1014 #wppm_view_project_task{
1015 background-color: #ffffff;
1016 margin-top: 10px;
1017 }
1018 #wppm_project_tasks,.wppm_add_new_project_btn,#wppm_proj_overview_btn{
1019 cursor:pointer;
1020 }
1021 #wppm_add_new_project_btn,#wppm_proj_overview_btn,#wppm_archieve_project_btn{
1022 margin-bottom: 10px;
1023 }
1024 #wppm_delete_project_icon, #wppm_add_new_project_icon, #wppm_project_list_icon, #wppm_task_list_icon{
1025 margin-top: -7px;
1026 }
1027 .wppm_add_new_icon{
1028 float: right!important;
1029 cursor:pointer;
1030 }
1031 .wppm_flex {
1032 display: flex !important;
1033 }
1034 .attachment_link span{
1035 font-size: 13px;
1036 color: #0077AE;
1037 cursor: pointer;
1038 text-decoration-line: underline;
1039 text-decoration-style:dotted;
1040 padding-right: 10px;
1041 }
1042 .wppm_bootstrap select{
1043 max-width:100% !important;
1044 }
1045 #wppm_en_body {
1046 height: 200px !important;
1047 }
1048 #wppm_tbl_templates tr{
1049 cursor:pointer;
1050 }
1051 #tbl_project_tasks td, #tbl_project_tasks th{
1052 text-align: center;
1053 }
1054 #tbl_project_tasks tr{
1055 cursor:pointer;
1056 }
1057 .wppm-pagination-txt{
1058 text-decoration: none;
1059 cursor: default;
1060 padding-right: 5px;
1061 }
1062 .wppm_task_pagination{
1063 float:right;
1064 color:#5f6368;
1065 margin-right:10px;
1066 cursor:pointer;
1067 }
1068 .wppm_proj_pagination{
1069 color:#5f6368;
1070 cursor:pointer;
1071 }
1072 .wppm_proj_pagination_container, .wppm_task_pagination_container{
1073 height: 30px;
1074 margin-top: 10px;
1075 display: flex;
1076 font-family: 'OpenSans-Semibold',"Helvetica Neue",Arial,Helvetica,sans-serif;
1077 font-size: 14px;
1078 }
1079 .wppm_proj_pagination_container a, .wppm_task_pagination_container a{
1080 color:#0073aa;
1081 }
1082 .wppm_pagination_prev{
1083 border-left-width: 1px;
1084 border-left-style: solid;
1085 padding-left: .75em;
1086 padding-right: .5em;
1087 text-decoration: none;
1088 border-color: #cdcdcd;
1089 color:#0073aa;
1090 }
1091 .wppm_pagination_next{
1092 border-left-width: 1px;
1093 border-left-style: solid;
1094 padding-left: .75em;
1095 padding-right: .5em;
1096 text-decoration: none;
1097 border-color: #cdcdcd;
1098 color:#337ab7;
1099 }
1100 .wppm_thread_action_btn{
1101 float: right;
1102 cursor: pointer;
1103 margin-left: 10px;
1104 color: #a7a9ab;
1105 font-size: 14px;
1106 }
1107 .wppm-task-list-btn{
1108 cursor:pointer;
1109 }
1110 .wppm_setting_pills li{
1111 background-color: #ffffff;
1112 border-radius: 15px !important;
1113 color:#9c9c9c !important;
1114 line-height:normal !important;
1115 }
1116 .wppm_email_notification_table td{
1117 font-weight: 400;
1118 font-family: "Nunito", "Segoe UI", arial;
1119 }
1120 .wppm_email_notification_table th{
1121 font-weight: 400;
1122 font-family: "Nunito", "Segoe UI", arial;
1123 font-weight: bold;
1124 }
1125 .wppm_task_result{
1126 text-align: center;
1127 margin-top: 15px;
1128 font-family: 'OpenSans-Light',Arial,Helvetica,sans-serif;
1129 font-size: 15px;
1130 color: #525c69;
1131 }
1132 .wppm_project_result{
1133 text-align: center;
1134 font-family: 'OpenSans-Light',Arial,Helvetica,sans-serif;
1135 font-size: 15px;
1136 color: #525c69;
1137 }
1138 #wppm_edit_project_label{
1139 margin-bottom: 10px;
1140 }
1141 #wppm_edit_project_category{
1142 margin-bottom: 20px;
1143 }
1144 #tbl_project_tasks,#tbl_custom_field,.select2-results__options,.select2-selection__rendered, .wppm_filter_display_text, .wppm_display_user_none, #wppm_assign_to_none_task{
1145 font:13px "Helvetica Neue",Helvetica,Arial,sans-serif;
1146 }
1147 .wppm_edit_project_label, .wppm_edit_task_label, .wppm_edit_task_start_date, .wppm_edit_task_end_date, .wppm_edit_task_priority_label, .wppm_edit_task_description_label,.wppm_edit_project_label,.wppm_edit_project_start_date,.wppm_edit_project_end_date,.wppm_edit_project_category_label, .wppm_edit_project_description_label,.wppm_project_status, .wppm_edit_task_status_label,.wppm_ct_field_label{
1148 font:13px "Helvetica Neue",Helvetica,Arial,sans-serif;
1149 margin-bottom: 5px;
1150 }
1151 #frm_get_project_users ul, #frm_get_task_users ul{
1152 z-index: 10000!important;
1153 position: absolute;
1154 box-shadow: 0 1px 2px rgb(79 148 212 / 80%);
1155 background-color: #fff;
1156 cursor: pointer;
1157 }
1158
1159 .wppm_bootstrap .wppm_padding_space{
1160 padding-top: 20px;
1161 }
1162
1163 .wppm_bootstrap .pricing-widget {
1164 margin-bottom: 30px;
1165 }
1166 .wppm_bootstrap .pheader {
1167 background-color: #555;
1168 color: #ffffff;
1169 padding: 10px;
1170 }
1171 .wppm_bootstrap .pheader .title{
1172 padding: 0;
1173 margin: 0;
1174 text-align: center;
1175 }
1176 .wppm_bootstrap .pheader .subtitle{
1177 padding: 0;
1178 margin: 10px 0 0;
1179 text-align: center;
1180 }
1181 .wppm_bootstrap .payment_freq {
1182 color: #fff !important;
1183 }
1184 .wppm_bootstrap .pbody {
1185 padding: 20px;
1186 border: 1px solid #555;
1187 }
1188 .wppm_bootstrap .addon-container {
1189 display: flex;
1190 align-items: center;
1191 padding: 5px 0;
1192 }
1193 .wppm_bootstrap .addon-details {
1194 flex-grow: 1;
1195 padding-left: 5px;
1196 }
1197 .wppm_bootstrap .pfooter {
1198 display: flex;
1199 border-left: 1px solid #555;
1200 border-right: 1px solid #555;
1201 border-bottom: 1px solid #555;
1202 justify-content: center;
1203 padding: 10px 0;
1204 }
1205
1206 .wppm_bootstrap .purchase_addon{
1207 padding-right: 5px;
1208 }
1209
1210 #wppm_chevron_sort_down_task_name_img, #wppm_chevron_sort_down_project_list_img, #wppm_chevron_sort_down_status_img, #wppm_chevron_sort_down_priority_img, #wppm_chevron_sort_down_start_date_img, #wppm_chevron_sort_down_end_date_img,#wppm_chevron_sort_down_task_duration_img{
1211 margin-right:-19px;
1212 }
1213
1214 .wppm-help-container{
1215 padding: 10px;
1216 background-color: #f0f0f1;
1217 margin-bottom: 15px;
1218 border-radius: 3px;
1219 }
1220
1221 #wppm_public_project_label{
1222 padding: 10px 0px 0px 10px;
1223 }
1224
1225 .wppm-filter-actions{
1226 display: flex;
1227 flex-wrap: wrap;
1228 align-items: center;
1229 }
1230
1231 #wppm_project_filter_container{
1232 display: flex;
1233 flex-wrap: wrap;
1234 align-items: flex-end;
1235 margin-bottom: 10px;
1236 }
1237
1238 #wppm_task_filter_container{
1239 display: flex;
1240 flex-wrap: wrap;
1241 align-items: flex-end;
1242 margin-bottom: 10px;
1243 }
1244
1245 #wppm_task_filter, #wppm_task_list_proj_filter, #tb-filter-created-by
1246 {
1247 border: 1px solid #ccc !important;
1248 background-color:#FFFFFF;
1249 border-radius:4px;
1250 font: 15px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
1251 }
1252
1253 .wppm-filter-item {
1254 max-width: 200px;
1255 margin-right: 5px;
1256 margin-bottom: 10px;
1257 margin: 0 5px 10px 10px;
1258 }
1259 .wppm-filter-item select {
1260 width: 100% !important;
1261 }
1262
1263 .wppm-filter-item label{
1264 font-size: 12px;
1265 font-weight: 600;
1266 margin-bottom: 3px;
1267 vertical-align: middle;
1268 color: #858c96;
1269 }
1270
1271 .wppm_display_submit{
1272 display: flex;
1273 margin-bottom: 10px;
1274 }
1275
1276 .wppm-filter-actions span {
1277 cursor: pointer;
1278 font-size: 16px;
1279 text-decoration: underline;
1280 margin-bottom: 7px!important;
1281 font: 14px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
1282 color: #858c96;
1283 }
1284
1285 .wppm-link {
1286 cursor: pointer !important;
1287 text-decoration: none !important;
1288 }
1289
1290 .wppm-link:hover {
1291 color: #2271b1 !important;
1292 text-decoration: underline !important;
1293 }
1294
1295 #wppm_project_list_container select{
1296 min-height: 30px !important;
1297 max-height: 35px !important;
1298 padding: 0 24px 0 8px !important;
1299 border: 1px solid #ccc !important;
1300 font: 14px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
1301 }
1302
1303 #wppm_task_list_container select{
1304 min-height: 30px !important;
1305 max-height: 35px !important;
1306 padding: 0 24px 0 8px !important;
1307 border: 1px solid #ccc !important;
1308 font: 15px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
1309 }
1310
1311 #wppm_proj_discussion_container{
1312 background-color: #ffffff;
1313 border: 1px solid #eee !important;
1314 }
1315 .wppm-setting-tab-container {
1316 display: flex;
1317 flex-wrap: wrap;
1318 width: 100%;
1319 align-items: center;
1320 margin-bottom: 10px;
1321 background-color:#F0F0F1;
1322 }
1323 .wppm-setting-tab-container button {
1324 padding: 7px 15px;
1325 font-size: 16px;
1326 font-weight: normal;
1327 border: none !important;
1328 color: #6A6A6A;
1329 background-color: transparent;
1330 cursor: pointer;
1331 border-radius: 16px;
1332 margin: 10 0 5px 5px;
1333 }
1334 .wppm-setting-tab-container button.active,
1335 .wppm-setting-tab-container button:hover {
1336 color: #fff;
1337 background-color: #FFA04A;
1338 }
1339 .wppm-input-group {
1340 width: 100%;
1341 display: flex;
1342 flex-direction: column;
1343 padding-bottom: 15px;
1344 box-sizing: border-box;
1345 }
1346 .wppm-input-group .label-container {
1347 display: flex;
1348 align-items: center;
1349 color: #000;
1350 margin-bottom: 2px;
1351 }
1352 .wppm-input-group label {
1353 font-size: 12px;
1354 font-weight: 600;
1355 margin-right: 5px;
1356 }
1357 .wppm-input-group .label-container svg {
1358 width: 12px;
1359 margin-left: 5px;
1360 }
1361 .wppm-input-group input[type="text"],
1362 .wppm-input-group select {
1363 width: 100%;
1364 max-width: 100%;
1365 }
1366 .wppm-input-group .checkbox-group,
1367 .wppm-input-group .radio-group {
1368 width: 100%;
1369 display: flex;
1370 flex-wrap: wrap;
1371 align-items: center;
1372 }
1373 .wppm-input-group .checkbox-group div,
1374 .wppm-input-group .radio-group div {
1375 width: 250px;
1376 display: flex;
1377 flex-wrap: wrap;
1378 align-items: center;
1379 margin: 0 10px 5px 0;
1380 }
1381 .wppm-input-group .checkbox-group div input,
1382 .wppm-input-group .radio-group div input {
1383 margin: 0 5px 0 0 !important;
1384 }
1385 .wppm-input-group .checkbox-group div span,
1386 .wppm-input-group .radio-group div span {
1387 font-size: 12px;
1388 font-weight: 300;
1389 }
1390 .wppm-input-group .required-char {
1391 font-size: 12px;
1392 color: #ff0000;
1393 }
1394 .wppm-input-group .divide-bar {
1395 width: 100%;
1396 display: flex;
1397 flex-wrap: grid;
1398 align-items: center;
1399 }
1400
1401 /* Checkboxes */
1402 #wppm-container .checkbox-container,
1403 .wppm-modal .checkbox-container, #wppm_task_list_container .checkbox-container {
1404 display: flex;
1405 line-height: normal;
1406 }
1407 #wppm-container .checkbox-container input,
1408 .wppm-modal .checkbox-container input, #wppm_task_list_container .checkbox-container input{
1409 padding: 0;
1410 height: initial;
1411 width: initial;
1412 margin-bottom: 0;
1413 display: none;
1414 cursor: pointer;
1415 }
1416 #wppm-container .checkbox-container label,
1417 .wppm-modal .checkbox-container label , #wppm_task_list_container .checkbox-container label{
1418 position: relative;
1419 cursor: pointer;
1420 padding: 0 !important;
1421 font-size: 14px !important;
1422 }
1423 #wppm-container .checkbox-container label:before,
1424 .wppm-modal .checkbox-container label:before , #wppm_task_list_container .checkbox-container label:before{
1425 content:'';
1426 -webkit-appearance: none;
1427 background-color: #fff;
1428 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
1429 display: inline-block;
1430 position: relative;
1431 vertical-align: middle;
1432 cursor: pointer;
1433 margin-left: 5px;
1434 border: 1px solid #8a8a8a;
1435 }
1436 #wppm-container .checkbox-container input:checked + label:after,
1437 .wppm-modal .checkbox-container input:checked + label:after, #wppm_task_list_container .checkbox-container input:checked + label:after{
1438 content: '';
1439 display: block;
1440 position: absolute;
1441 top: 1px;
1442 right: 9px;
1443 width: 6px;
1444 height: 9px;
1445 border: solid #0079bf;
1446 border-width: 0 0 2px 2px;
1447 transform: matrix(-1, -1, -1, 1, 3, 0);
1448 }
1449 #wppm-container .checkbox-container label,
1450 .wppm-modal .checkbox-container label, #wppm_task_list_container .checkbox-container label{
1451 display: flex;
1452 }
1453 #wppm-container .checkbox-container label:before,
1454 .wppm-modal .checkbox-container label:before, #wppm_task_list_container .checkbox-container label:before{
1455 width: 18px !important;
1456 height: 18px !important;
1457 box-sizing: border-box;
1458 padding: 8px;
1459 }
1460 #wppm-container .checkbox-container label:after,
1461 .wppm-modal .checkbox-container label:after, #wppm_task_list_container .checkbox-container label:after {
1462 flex-grow: 1;
1463 }
1464 #wppm-container .checkbox-container p,
1465 .wppm-modal .checkbox-container p, #wppm_task_list_container .checkbox-container p{
1466 margin: 0 !important;
1467 }
1468
1469 .wppm-bulk-actions {
1470 display: flex;
1471 align-items: center;
1472 }
1473 .wppm-bulk-actions select {
1474 min-width: 150px;
1475 max-width: 250px;
1476 margin-left: 5px;
1477 }
1478 .wppm-bulk-actions button {
1479 margin-left: 10px;
1480 display: flex;
1481 align-items: center;
1482 }
1483 .wppm-bulk-actions button svg {
1484 height: 13px;
1485 margin-right: 15px;
1486 }
1487
1488 #wppm-bulk-actions{
1489 left: 0px!important;
1490 }
1491
1492 /* Popover Menu */
1493 .wppm-popover-menu {
1494 padding: 3px !important;
1495 border-radius: 3px !important;
1496 }
1497 .wppm-popover-menu-item {
1498 display: flex;
1499 align-items: center;
1500 padding: 10px;
1501 cursor: pointer;
1502 background-color: #fff;
1503 color: #707070;
1504 margin-left: 10px !important;
1505 }
1506 .wppm-popover-menu-item:hover {
1507 color: #fff;
1508 background-color: #313042 !important;
1509 }
1510 .wppm-popover-menu-item svg {
1511 width: 14px;
1512 margin-left: 10px;
1513 }
1514 .wppm-popover-menu-item span {
1515 font-size: 14px;
1516 }
1517
1518 .wppm-button.secondary {
1519 border: 1px solid #ccc !important;
1520 background-color: #fff !important;
1521 color: #313042 !important;
1522 font: 14px "Helvetica Neue", Arial, Helvetica, sans-serif !important;
1523 }
1524
1525 .wppm-button.small {
1526 font-size: 12px !important;
1527 }
1528
1529 #wppm_task_description, #wppm_add_new_project #wppm_proj_description{
1530 height: 160px !important;
1531 width: 100% !important;
1532 }
1533
1534 /* Form fields */
1535 .wppm-input-group {
1536 width: 100%;
1537 display: flex;
1538 flex-direction: column;
1539 padding-bottom: 15px;
1540 box-sizing: border-box;
1541 }
1542 .wppm-input-group .label-container {
1543 display: flex;
1544 align-items: center;
1545 color: #000;
1546 margin-bottom: 2px;
1547 }
1548 .wppm-input-group label {
1549 font-size: 12px;
1550 font-weight: 600;
1551 margin-left: 5px;
1552 }
1553 .wppm-input-group .label-container svg {
1554 width: 12px;
1555 margin-right: 5px;
1556 }
1557 .wppm-input-group input[type="text"],
1558 .wppm-input-group select {
1559 width: 100%;
1560 max-width: 100%;
1561 }
1562
1563 @media (max-width: 768px) {
1564 .wppm_task_list{
1565 flex-basis: 50% !important;
1566 }
1567 }
1568
1569 #wppmprint_menu{
1570 display: flex;
1571 flex-direction: column;
1572 position: absolute;
1573 background: white;
1574 border: 1px solid #ccc;
1575 z-index: 1000;
1576 margin-left: 155px;
1577 display: none;
1578 }
1579
1580 #wppmprint_menu a {
1581 padding: 8px 12px;
1582 text-decoration: none;
1583 color: #333;
1584 }
1585
1586 #wppmprint_menu a:hover {
1587 background: #f0f0f0;
1588 }
1589
1590 .wppm_checklist_items_container { list-style: none; padding-left: 0; }
1591 .wppm_checklist_items_container .wppm_checklist_item {
1592 padding: 6px 10px;
1593 background: #fff;
1594 margin-bottom: 4px;
1595 border: 1px solid #ddd;
1596 cursor: grab;
1597 display: flex;
1598 align-items: center;
1599 }
1600 .wppm_checklist_items_container .wppm_chk_items_drag {
1601 margin-right: 10px;
1602 cursor: move;
1603 }
1604
1605 /* Main container */
1606 /* GRID CONTAINER */
1607 .wppm_bootstrap .pricing-flex {
1608 display: grid !important;
1609 grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
1610 gap: 20px;
1611 align-items: stretch;
1612 }
1613
1614 /* CARD */
1615 .wppm_bootstrap .pricing-widget {
1616 display: flex;
1617 flex-direction: column;
1618
1619 background: #fff;
1620 border: 1px solid #e5e5e5;
1621 border-radius: 6px;
1622 padding: 15px;
1623 box-sizing: border-box;
1624 }
1625
1626 /* BODY GROWS */
1627 .wppm_bootstrap .pricing-widget .pbody {
1628 flex: 1;
1629 }
1630
1631 /* FOOTER */
1632 /* .wppm_bootstrap .pricing-widget .pfooter {
1633 display: flex;
1634 justify-content: space-between;
1635 gap: 10px;
1636 margin-top: 15px;
1637 }
1638
1639 /* MOBILE FOOTER STACK */
1640 @media (max-width: 480px) {
1641 .wppm_bootstrap .pricing-widget .pfooter {
1642 flex-direction: column;
1643 }
1644 } */
1645
1646 .wppm-dashboard{
1647 padding:20px;
1648 margin-top:20px;
1649 font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
1650 }
1651 .wppm-dashboard-top{
1652 display:grid;
1653 grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
1654 gap:20px;
1655 margin-bottom:20px;
1656 }
1657
1658 .wppm-small-widget{
1659 background:#ffffff;
1660 border-radius:10px;
1661 padding:20px;
1662 box-shadow:0 2px 8px rgba(0,0,0,0.05);
1663 transition:all 0.2s ease;
1664 display:flex;
1665 align-items:center;
1666 gap:15px;
1667 }
1668
1669 .wppm-small-widget:hover{
1670 transform:translateY(-3px);
1671 box-shadow:0 6px 16px rgba(0,0,0,0.08);
1672 }
1673
1674 .wppm-small-widget h3{
1675 font-size:14px;
1676 color:#666;
1677 margin-bottom:10px;
1678 }
1679
1680 .wppm-number{
1681 font-size:28px;
1682 font-weight:600;
1683 color:#222;
1684 }
1685 .wppm-small-widget.overdue{
1686 border-left:4px solid #e74c3c;
1687 }
1688
1689 .wppm-divider{
1690 height:1px;
1691 background:#eee;
1692 margin:20px 0;
1693 }
1694
1695 .wppm-row{
1696 display:grid;
1697 grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
1698 gap:20px;
1699 margin-bottom:20px;
1700 }
1701
1702 .wppm-widget{
1703 background:#fff;
1704 border-radius:10px;
1705 padding:20px;
1706 box-shadow:0 2px 8px rgba(0,0,0,0.05);
1707 transition:all 0.2s ease;
1708 }
1709 .wppm-widget h2{
1710 font-size:16px;
1711 margin-bottom:15px;
1712 font-weight:600;
1713 color:#222;
1714 }
1715
1716 #tbl_my_tasks,#tbl_active_projects,#tbl_upcoming_tasks, #tbl_todays_tasks {
1717 border-collapse: collapse !important;
1718 width: 100% !important;
1719 }
1720
1721 #tbl_my_tasks th,
1722 #tbl_my_tasks td,
1723 #tbl_todays_tasks th,
1724 #tbl_todays_tasks td,
1725 #tbl_active_projects th,
1726 #tbl_active_projects td,
1727 #tbl_upcoming_tasks th,
1728 #tbl_upcoming_tasks td {
1729 border: 1px solid #ddd !important;
1730 padding: 8px !important;
1731 }
1732
1733 #tbl_my_tasks th, #tbl_active_projects th, #tbl_upcoming_tasks th, #tbl_todays_tasks th{
1734 background-color: #f5f5f5 !important;
1735 text-align: left !important;
1736 }
1737
1738 #tbl_my_tasks tr:hover, #tbl_active_projects tr:hover, #tbl_upcoming_tasks tr:hover, #tbl_todays_tasks tr:hover{
1739 background-color: #f9f9f9 !important;
1740 cursor: pointer;
1741 }
1742 .wppm-widget table td{
1743 padding:10px;
1744 border-top:1px solid #f2f2f2;
1745 font-size:14px;
1746 }
1747
1748 .wppm-widget table th{
1749 background:#f8fafc;
1750 color:#777;
1751 font-weight:600;
1752 padding:10px;
1753 border-bottom:1px solid #e5e7eb;
1754 }
1755
1756 canvas{
1757 max-height:250px !important;
1758 }
1759
1760 .wppm-widget:hover{
1761 box-shadow:0 8px 20px rgba(0,0,0,0.07);
1762 }
1763
1764 .wppm-widget-icon{
1765 font-size:28px;
1766 background:#f5f7fb;
1767 padding:12px;
1768 border-radius:8px;
1769 }
1770 .wppm-widget h2{
1771 display:flex;
1772 justify-content:space-between;
1773 align-items:center;
1774 }
1775
1776 .wppm-view-all{
1777 font-size:13px;
1778 color:#4c7cf3;
1779 text-decoration:none;
1780 }
1781
1782 .wppm-view-all:hover{
1783 text-decoration:underline;
1784 }
1785
1786 .wppm-workload-list {
1787 list-style: none;
1788 padding: 0;
1789 margin: 0;
1790 }
1791
1792 .wppm-workload-list li {
1793 display: flex;
1794 align-items: center;
1795 gap:10px;
1796 margin-bottom: 10px;
1797 }
1798
1799 .wppm-workload-bar {
1800 flex:1;
1801 height:8px;
1802 background:#eee;
1803 border-radius:5px;
1804 overflow:hidden;
1805 }
1806
1807 .wppm-workload-bar div {
1808 height: 100%;
1809 background: #3498db;
1810 border-radius: 5px;
1811 }
1812
1813 .dashboard-progress-wrapper{
1814 display:flex;
1815 align-items:center;
1816 gap:8px;
1817 }
1818
1819 .dashboard-progress-bar{
1820 flex:1;
1821 height:8px;
1822 background:#e5e7eb;
1823 border-radius:5px;
1824 overflow:hidden;
1825 }
1826
1827 .dashboard-progress{
1828 height:100%;
1829 border-radius:5px;
1830 }
1831
1832 .dashboard-progress-text{
1833 font-size:12px;
1834 font-weight:600;
1835 }
1836 .wppm-priority-dot{
1837 display:inline-block;
1838 width:10px;
1839 height:10px;
1840 border-radius:50%;
1841 margin-right:6px;
1842 vertical-align:middle;
1843 }
1844 /* Wrapper (relative parent) */
1845 .tb-filter-bar {
1846 position: relative;
1847 }
1848
1849 /* Advanced panel (FLOAT) */
1850 #tb-advanced-panel {
1851 position: absolute;
1852 top: 110%; /* below button */
1853 right: 0;
1854 width: 320px;
1855
1856 background: #ffffff;
1857 border: 1px solid #e2e8f0;
1858 border-radius: 10px;
1859 box-shadow: 0 10px 25px rgba(0,0,0,0.1);
1860
1861 padding: 12px;
1862 z-index: 999999999;
1863
1864 /* hidden state */
1865 opacity: 0;
1866 transform: translateY(-10px);
1867 pointer-events: none;
1868
1869 transition: all 0.25s ease;
1870 }
1871
1872 /* OPEN STATE */
1873 #tb-advanced-panel.tb-open {
1874 opacity: 1;
1875 transform: translateY(0);
1876 pointer-events: auto;
1877 }
1878
1879 /* Rows */
1880 .tb-row {
1881 margin-bottom: 10px;
1882 }
1883
1884 .tb-row label {
1885 font-size: 12px;
1886 font-weight: 600;
1887 display: block;
1888 margin-bottom: 4px;
1889 }
1890
1891 /* Inputs */
1892 #tb-advanced-panel input,
1893 #tb-advanced-panel select {
1894 width: 100%!important;
1895 padding: 6px 8px!important;
1896 border: 1px solid #cbd5e1;
1897 border-radius: 6px;
1898 }
1899 /* Wrapper */
1900 .tb-filter-bar {
1901 position: relative;
1902 display: flex;
1903 align-items: center;
1904 gap: 10px;
1905 overflow: visible!important;
1906 }
1907
1908 /* Button */
1909 .tb-btn {
1910 padding: 2px 10px;
1911 border-radius: 6px;
1912 border: 1px solid #cbd5e1;
1913 background: #fff;
1914 cursor: pointer;
1915 }
1916
1917 /* ================= POPOVER ================= */
1918 .tb-popover {
1919 position: absolute;
1920 top: 120%;
1921 right: 0;
1922 width: 320px;
1923
1924 background: #fff;
1925 border: 1px solid #e2e8f0;
1926 border-radius: 10px;
1927 box-shadow: 0 15px 35px rgba(0,0,0,0.12);
1928
1929 padding: 12px;
1930 z-index: 999999999;
1931
1932 opacity: 0;
1933 transform: translateY(-10px);
1934 pointer-events: none;
1935 transition: all 0.25s ease;
1936 }
1937
1938 .tb-popover.tb-open {
1939 opacity: 1;
1940 transform: translateY(0);
1941 pointer-events: auto;
1942 }
1943
1944 /* Arrow */
1945 .tb-arrow {
1946 position: absolute;
1947 top: -6px;
1948 right: 20px;
1949 width: 12px;
1950 height: 12px;
1951 background: white;
1952 border-left: 1px solid #e2e8f0;
1953 border-top: 1px solid #e2e8f0;
1954 transform: rotate(45deg);
1955 }
1956
1957 /* Sections */
1958 .tb-section {
1959 margin-bottom: 12px;
1960 }
1961
1962 .tb-section h4 {
1963 font-size: 12px;
1964 margin-bottom: 6px;
1965 color: #64748b;
1966 }
1967
1968 /* Inputs */
1969 .tb-popover input,
1970 .tb-popover select {
1971 width: 100%;
1972 margin-bottom: 6px;
1973 padding: 6px;
1974 border: 1px solid #cbd5e1;
1975 border-radius: 6px;
1976 }
1977
1978 /* ================= CHIPS ================= */
1979 /* .tb-chips {
1980 display: flex;
1981 gap: 6px;
1982 flex-wrap: wrap;
1983 } */
1984
1985 /* .tb-chip {
1986 background: #eef2ff;
1987 color: #3730a3;
1988 padding: 4px 8px;
1989 border-radius: 20px;
1990 font-size: 12px;
1991 cursor: pointer;
1992 } */
1993 /* =========================
1994 MOBILE FILTER PANEL
1995 ========================= */
1996 /* @media (max-width: 768px) {
1997
1998 #tb-advanced-panel {
1999 position: fixed;
2000 left: 0;
2001 right: 0;
2002 bottom: 0;
2003 top: auto;
2004
2005 width: 100%;
2006 max-height: 80vh;
2007
2008 border-radius: 16px 16px 0 0;
2009 padding: 16px;
2010
2011 transform: translateY(100%);
2012 opacity: 1;
2013 pointer-events: auto;
2014
2015 overflow-y: auto;
2016 }
2017
2018 #tb-advanced-panel.tb-open {
2019 transform: translateY(0);
2020 }
2021
2022 .tb-arrow {
2023 display: none;
2024 }
2025
2026 /* backdrop */
2027 /* #tb-backdrop {
2028 position: fixed;
2029 top: 0;
2030 left: 0;
2031 right: 0;
2032 bottom: 0;
2033 background: rgba(0,0,0,0.4);
2034 z-index: 9998;
2035 display: none;
2036 }
2037
2038 #tb-backdrop.active {
2039 display: block;
2040 }
2041
2042 } */
2043 /* =========================
2044 MOBILE FILTER PANEL
2045 ========================= */
2046 @media (max-width: 768px) {
2047
2048 #tb-advanced-panel,
2049 #tb-advanced-panel.tb-popover {
2050 position: fixed !important;
2051
2052 top: 0 !important;
2053 right: 0 !important;
2054 bottom: 0 !important;
2055 left: 0 !important;
2056
2057 width: 100vw !important;
2058 height: 100vh !important;
2059 max-width: none !important;
2060 max-height: none !important;
2061
2062 margin: 0 !important;
2063 padding: 16px !important;
2064
2065 box-sizing: border-box !important;
2066
2067 background: #fff !important;
2068
2069 border: none !important;
2070 border-radius: 0 !important;
2071
2072 box-shadow: none !important;
2073
2074 overflow-y: auto !important;
2075 -webkit-overflow-scrolling: touch;
2076
2077 z-index: 999999999 !important;
2078
2079 /* CLOSED */
2080 opacity: 0 !important;
2081 visibility: hidden !important;
2082 transform: none !important;
2083 pointer-events: none !important;
2084
2085 transition: opacity 0.25s ease, visibility 0.25s ease !important;
2086 }
2087
2088 @media (max-width: 768px) {
2089
2090 #tb-active-filters,
2091 .tb-chips {
2092 display: flex !important;
2093 flex-direction: column !important;
2094 align-items: stretch !important;
2095 gap: 8px !important;
2096 width: 100% !important;
2097 }
2098
2099 #tb-active-filters .tb-chip,
2100 .tb-chips .tb-chip {
2101 display: inline-flex !important;
2102 align-items: center;
2103 justify-content: space-between;
2104
2105 width: 100% !important;
2106 box-sizing: border-box;
2107 }
2108 }
2109
2110 /* OPEN */
2111 #tb-advanced-panel.tb-open {
2112 opacity: 1 !important;
2113 visibility: visible !important;
2114 transform: none !important;
2115 pointer-events: auto !important;
2116 }
2117
2118 /* Hide arrow on mobile */
2119 #tb-advanced-panel .tb-arrow {
2120 display: none !important;
2121 }
2122
2123 /* Mobile header */
2124 .tb-mobile-header {
2125 display: flex !important;
2126
2127 position: sticky;
2128 top: 0;
2129
2130 background: #fff;
2131 z-index: 2;
2132
2133 padding: 5px 0 15px;
2134 margin-bottom: 15px;
2135
2136 font-size: 18px;
2137 }
2138
2139 #tb-close-filters {
2140 border: 0;
2141 background: transparent;
2142 font-size: 24px;
2143 cursor: pointer;
2144 }
2145
2146 /* Backdrop */
2147 #tb-backdrop {
2148 position: fixed !important;
2149
2150 top: 0 !important;
2151 right: 0 !important;
2152 bottom: 0 !important;
2153 left: 0 !important;
2154
2155 width: 100vw !important;
2156 height: 100vh !important;
2157
2158 background: rgba(0, 0, 0, 0.4);
2159
2160 z-index: 999998 !important;
2161
2162 display: none;
2163 }
2164
2165 #tb-backdrop.active {
2166 display: block !important;
2167 }
2168
2169 }
2170
2171 .tb-mobile-header {
2172 display: none;
2173 justify-content: space-between;
2174 align-items: center;
2175 font-weight: 600;
2176 margin-bottom: 10px;
2177 }
2178
2179 @media (max-width:768px){
2180 .tb-mobile-header {
2181 display: flex;
2182 }
2183 }
2184 .tb-section {
2185 display: flex;
2186 flex-direction: column;
2187 gap: 8px;
2188 }
2189 .tb-popover {
2190 width: 300px;
2191 }
2192 .tb-chip {
2193 background: #eef3ff;
2194 padding: 5px 10px;
2195 border-radius: 20px;
2196 margin: 18px 5px 10px 0px;
2197 display: inline-block;
2198 cursor: pointer;
2199 color: #3730a3;
2200 font-size: 12px;
2201 gap: 6px;
2202 }
2203
2204 .tb-remove {
2205 margin-left: 6px;
2206 color: red;
2207 font-weight: bold;
2208 }
2209
2210 .tb-chip-close {
2211 margin-left: 6px;
2212 cursor: pointer;
2213 }
2214
2215 @media (max-width: 767px) {
2216
2217 .tb-filter-bar {
2218 display: flex;
2219 align-items: center;
2220 justify-content: flex-end;
2221 flex-wrap: wrap;
2222 gap: 8px;
2223 width: 100%;
2224 overflow: visible!important;
2225 }
2226
2227 #tb-advanced-toggle {
2228 display: inline-flex !important;
2229 align-items: center;
2230 justify-content: center;
2231
2232 /* float: left; */
2233 position: relative;
2234 margin-top : 20px;
2235
2236 height: 34px;
2237 min-width: 34px;
2238 padding: 0 10px;
2239
2240 border: 1px solid #d5d9dd;
2241 border-radius: 5px;
2242 background: #fff;
2243
2244 color: #555;
2245 font: 13px "Helvetica Neue", Helvetica, Arial, sans-serif;
2246
2247 cursor: pointer;
2248 box-sizing: border-box;
2249 white-space: nowrap;
2250 }
2251
2252 #tb-advanced-toggle:hover {
2253 background: #f5f5f5;
2254 }
2255
2256 #tb-advanced-panel input,
2257 #tb-advanced-panel select {
2258 width: 75%!important;
2259 padding: 6px 8px!important;
2260 border: 1px solid #cbd5e1;
2261 border-radius: 6px;
2262 }
2263
2264 .wppm-filter-actions span {
2265 cursor: pointer;
2266 font-size: 16px;
2267 text-decoration: underline;
2268 /* margin-bottom: 7px!important; */
2269 font: 14px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
2270 color: #858c96;
2271 margin-bottom: 20px !important;
2272 margin-left: 5px;
2273 }
2274 }
2275
2276 .wppm-mention {
2277 display:inline;
2278 background: #e7f3ff;
2279 color: #0073aa;
2280 font-weight: bold;
2281 padding: 2px 6px;
2282 border-radius: 4px;
2283 font-weight: 500;
2284 margin: 0;
2285 }
2286
2287 .wppm-mention:hover {
2288 background: #d0e7ff;
2289 }
2290
2291 .wppm-mention-me{
2292 background:#ffcc00 !important;
2293 color:#000 !important;
2294 font-weight:700;
2295 }
2296
2297 #wppm_mention_list {
2298 position: absolute !important;
2299 min-width: 220px;
2300 max-width: 300px;
2301 max-height: 240px;
2302 overflow-y: auto;
2303 background: #fff;
2304 border: 1px solid #dcdcde;
2305 border-radius: 8px;
2306 box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
2307 padding: 6px 0;
2308 margin-top: 4px;
2309 z-index: 99999999999 !important;
2310 animation: wppmMentionFade .15s ease-in-out;
2311 }
2312
2313 #wppm_mention_list .mention-item:hover,
2314 #wppm_mention_list .mention-item.active {
2315 background: linear-gradient(135deg, #7c3aed, #a855f7);
2316 color: #fff;
2317 }
2318
2319 #wppm_mention_list .mention-item {
2320 padding: 2px 12px;
2321 cursor: pointer;
2322 font-size: 14px;
2323 color: #333;
2324 border-bottom: 1px solid #eee;
2325 }
2326
2327 #wppm_mention_list .mention-item:last-child {
2328 border-bottom: none;
2329 }
2330
2331 /* Floating Button */
2332 #wppm_notification_bell{
2333 position:fixed;
2334 right:24px;
2335 bottom:24px;
2336 width:56px;
2337 height:56px;
2338 border-radius:16px;
2339 background:#ffffff;
2340 border:1px solid #e5e7eb;
2341 box-shadow:
2342 0 8px 24px rgba(15,23,42,.12),
2343 0 2px 8px rgba(15,23,42,.08);
2344 display:flex;
2345 justify-content:center;
2346 align-items:center;
2347 cursor:pointer;
2348 z-index:999999999!important;
2349 transition:all .25s ease;
2350 }
2351
2352 #wppm_notification_bell:hover{
2353 transform:translateY(-3px);
2354 box-shadow:
2355 0 15px 35px rgba(15,23,42,.18),
2356 0 5px 15px rgba(15,23,42,.12);
2357 }
2358
2359 #wppm_notification_bell .dashicons{
2360 color:#6b7280;
2361 font-size:22px;
2362 transition:.2s;
2363 }
2364
2365 #wppm_notification_bell:hover .dashicons{
2366 color:#7c3aed;
2367 }
2368
2369 /* Notification Badge */
2370 .wppm-badge{
2371 position:absolute;
2372 top:-6px;
2373 right:-6px;
2374 min-width:22px;
2375 height:22px;
2376 border-radius:50px;
2377 background:#ff3366;
2378 color:#fff;
2379 display:flex;
2380 align-items:center;
2381 justify-content:center;
2382 font-size:11px;
2383 font-weight:700;
2384 border:2px solid #fff;
2385 }
2386
2387 /* Popup */
2388 #wppm-notification-container{
2389 position:fixed;
2390 right:24px;
2391 bottom:90px;
2392 width:360px;
2393 background:#fff;
2394 border-radius:18px;
2395 box-shadow:0 20px 60px rgba(0,0,0,.15);
2396 overflow:hidden;
2397 display:none;
2398 z-index:999999999!important;
2399 }
2400
2401 /* Item */
2402 .wppm-notification-item, .wppm-no-notification{
2403 padding:16px 18px;
2404 border-bottom:1px solid #f3f4f6;
2405 cursor:pointer;
2406 transition:.2s;
2407 }
2408
2409 .wppm-notification-item:hover{
2410 background:#f9fafb;
2411 }
2412
2413 .wppm-notification-message{
2414 font-size:14px;
2415 font-weight:600;
2416 color:#111827;
2417 margin-bottom:4px;
2418 }
2419
2420 .wppm-notification-item small{
2421 color:#9ca3af;
2422 }
2423
2424 .wppm-pro-btn{
2425 display:inline-flex;
2426 align-items:center;
2427 gap:6px;
2428 text-decoration:none;
2429 }
2430 /* .wppm-pro-btn .dashicons{
2431 font-size:16px;
2432 width:16px;
2433 height:16px;
2434 line-height:16px;
2435 } */
2436 .wppm-pro-btn .wppm-btn-text{
2437 display:inline-block;
2438 }
2439
2440 .tb-pro-feature-card{
2441 position:relative;
2442 overflow:hidden;
2443 border-radius:8px;
2444 }
2445
2446 .tb-pro-content{
2447 filter:blur(4px);
2448 pointer-events:none;
2449 opacity:.7;
2450 }
2451
2452 .tb-pro-overlay{
2453 position:absolute;
2454 inset:0;
2455 display:flex;
2456 flex-direction:column;
2457 justify-content:center;
2458 align-items:center;
2459 background:rgba(255,255,255,.5);
2460 z-index:10;
2461 }
2462
2463 .tb-pro-badge{
2464 background:#ff9800;
2465 color:#fff;
2466 padding:6px 12px;
2467 border-radius:4px;
2468 margin-bottom:10px;
2469 font-weight:600;
2470 }
2471
2472 #wppm-archive-project {
2473 display: inline-flex;
2474 align-items: center;
2475 gap: 6px;
2476 }
2477
2478 #wppm-archive-project svg {
2479 flex-shrink: 0;
2480 }
2481
2482 .wppm_create_project_btn {
2483 display: inline-flex;
2484 align-items: center;
2485 gap: 6px;
2486 padding: 8px 12px;
2487 border-radius: 4px;
2488 text-decoration: none;
2489 cursor: pointer;
2490 }
2491
2492 .wppm_create_project_btn svg {
2493 flex-shrink: 0;
2494 }