PluginProbe
Taskbuilder – Project Management & Task Management Tool With Kanban Board / 6.0.6
Taskbuilder – Project Management & Task Management Tool With Kanban Board v6.0.6
6.0.6 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 All 58 releases
← All changes | asset/css/admin.css +1728 -35 1.0.36.0.6 View file →
@@ -68,9 +68,8 @@
68 68 height: 28px;
69 69 margin: 0;
70 70 padding: 0 10px 1px;
71 71 cursor: pointer;
72 - -webkit-appearance: none;
73 72 border-radius: 3px;
74 73 white-space: nowrap;
75 74 box-sizing: border-box;
76 75 border: none;
@@ -153,9 +152,9 @@
153 152 }
154 153 #wppm_project_table th{
155 154 border: none !important;
156 155 }
157 -.wppm_thread{
156 +.wppm_thread,.wppm_proj_thread{
158 157 background-color: #FFFFFF;
159 158 color: #000000;
160 159 border-color: #C3C3C3;
161 160 display: table;
@@ -188,21 +187,8 @@
188 187 width: 99%;
189 188 margin-top: 25px;
190 189 padding-left: 15px;
191 190 }
192 -#wppm_action_bar{
193 - color:#ffffff;
194 - background-color:#306EFF;
195 - /* background-color:#304FFE; */
196 - width:100%;
197 - overflow:hidden;
198 - display:inline-block;
199 - float:left;
200 - display:inline-block;
201 - font-family: Verdana,sans-serif;
202 - font-size: 15px;
203 - line-height: 1.5;
204 -}
205 191 .wppm_sidebar_labels{
206 192 font-size: 12px;
207 193 margin: 10px 0;
208 194 cursor: pointer;
@@ -230,10 +216,37 @@
230 216 margin-top: 10px;
231 217 border: 1px solid #eee !important;
232 218 }
233 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;
234 227 border: 1px solid #eee !important;
235 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 +}
236 249 .wppm-btn{
237 250 padding: 5px 10px;
238 251 border-radius: 20px;
239 252 font-size: 14px;
@@ -239,9 +252,9 @@
239 252 font-size: 14px;
240 253 margin-left:20px;
241 254 background-color: #5067c5;
242 255 color:#ffffff!important;
243 - border: 1px;
256 + border: 1px solid #8a8a8a !important;
244 257 }
245 258 .wppm-btn-cancel{
246 259 padding: 5px 10px;
247 260 border-radius: 14px;
@@ -284,9 +297,9 @@
284 297 #wppm_task_table th{
285 298 border: none !important;
286 299 }
287 300 #wppm_task_table_container{
288 - padding:15px;
301 + padding: 0 15px 15px 15px;
289 302 }
290 303 .wppm_status{
291 304 background-color: aqua;
292 305 border-radius: 30px;
@@ -311,9 +324,9 @@
311 324 text-align: center;
312 325 line-height: 1;
313 326
314 327 }
315 -.avatar{
328 +.wppm_bootstrap .avatar{
316 329 border-radius: 50%;
317 330 border: 2px solid #FFF;
318 331 margin-left: -12px;
319 332 border: 2px solid #FFF;
@@ -391,8 +404,9 @@
391 404 top: 50px;
392 405 right: 50px;
393 406 font-size: 15px;
394 407 font-weight: bold;
408 + z-index: 10000000000000;
395 409 }
396 410 #wppm_add_new_project{
397 411 margin:20px;
398 412 background-color: #FFFFFF;
@@ -438,12 +452,9 @@
438 452 #wppm_apply_filter{
439 453 background-color:#306EFF;
440 454 margin-bottom:2px;
441 455 }
442 -#wppm_project_table{
443 - margin: 15px;
444 - overflow-x: auto;
445 -}
456 +
446 457 .wppm_label{
447 458 font-size: 12px;
448 459 font-weight: 600;
449 460 color: #9c9c9c;
@@ -460,11 +471,11 @@
460 471 border-radius: 20px;
461 472 font: 12px "Helvetica Neue",Arial,Helvetica,sans-serif;
462 473 }
463 474 #wppm_project_search_filter_img, .wppm_task_search_filter_img{
464 - position: absolute;
475 + position: relative !important;
465 476 top: 10px;
466 - left: 18px;
477 + left: 30px;
467 478 }
468 479 .wppm_add_new_task_img, .wppm_task_list_image{
469 480 padding-right: 5px;
470 481 padding-bottom: 3px;
@@ -489,10 +500,17 @@
489 500 list-style-type: none!important;
490 501 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
491 502 }
492 503 #wppm_task_search{
504 + flex-shrink: 0;
505 + white-space: nowrap;
493 506 width:40%;
494 507 margin-top: 15px;
508 + display: flex;
509 + /* align-items: center;
510 + gap: 8px;
511 + align-items: center; */
512 + flex-wrap: nowrap;
495 513 }
496 514 #wppm_task_search svg{
497 515 width: 16px;
498 516 height: 16px;
@@ -503,9 +521,13 @@
503 521 }
504 522 #wppm_task_search_filter{
505 523 padding: 0 30px;
506 524 border-radius: 20px;
507 -}
525 + width: auto;
526 + flex: 1;
527 + min-width: 150px;
528 + min-height: 30px!important;
529 +}
508 530 #wppm_more_filter_option div{
509 531 display: inline-block;
510 532 }
511 533 #wppm_heading_inline svg{
@@ -533,9 +555,9 @@
533 555 .wppm_task_list{
534 556 flex-basis: 50%;
535 557 }
536 558 }
537 -.wppm_task_name_grid_view, .wppm_task_due_date_grid_view, .wppm_empty_container{
559 +.wppm_task_name_grid_view, .wppm_task_due_date_grid_view, .wppm_empty_container, .wppm_proj_name_grid_view{
538 560 font-family: "OpenSans-Semibold","Helvetica Neue",Arial,Helvetica,sans-serif;
539 561 font-size: 14px;
540 562 }
541 563 .wppm_card_body{
@@ -684,8 +706,37 @@
684 706 background-color: #FFFFFF;
685 707 margin: 15px;
686 708 border: 1px solid #eee !important;
687 709 }
710 +.wppm_task_subtask_container{
711 + background-color: #FFFFFF;
712 + margin: 15px;
713 + border: 1px solid #eee !important;
714 +}
715 +.wppm_subtask_parent_link{
716 + font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
717 + color: #7a7a7a;
718 + margin-top: 4px;
719 +}
720 +.wppm_subtask_parent_link a{
721 + color: #306EFF;
722 + text-decoration: none;
723 +}
724 +.wppm_subtask_badge{
725 + display: inline-block;
726 + font: 11px "Helvetica Neue",Helvetica,Arial,sans-serif;
727 + color: #5a5a5a;
728 + background-color: #eef1f5;
729 + border-radius: 10px;
730 + padding: 1px 8px;
731 + margin-left: 6px;
732 + vertical-align: middle;
733 +}
734 +.wppm_proj_thread{
735 + background-color: #FFFFFF;
736 + border: 1px solid #eee !important;
737 +}
738 +
688 739 .wppm_progress_bar_container{
689 740 margin-bottom: 6px;
690 741 margin-top: 5px;
691 742 position: relative;
@@ -757,8 +808,19 @@
757 808 color: #858c96;
758 809 margin-bottom: 5px;
759 810 margin-top: 5px;
760 811 }
812 +#tb-advanced-toggle{
813 + border: 1px solid #ccc;
814 + padding: 6px;
815 + background-color: #FFFFFF;
816 + /* float: right; */
817 + border-radius: 4px;
818 + cursor: pointer;
819 + /* margin-top:10px; */
820 + font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
821 + color: #858c96;
822 +}
761 823 #wppm_list_view_btn{
762 824 border: 1px solid #ccc;
763 825 padding: 5px;
764 826 background-color: #FFFFFF;
@@ -763,13 +825,11 @@
763 825 padding: 5px;
764 826 background-color: #FFFFFF;
765 827 float: right;
766 828 border-radius: 4px;
767 - margin-right: 10px;
768 829 cursor: pointer;
769 830 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
770 831 color: #858c96;
771 - margin-top: 5px;
772 832 }
773 833 #wppm_select_user_role{
774 834 margin: 10px 10px 10px 0px;
775 835 }
@@ -805,8 +865,12 @@
805 865 #wppm_comment_btn{
806 866 display:none;
807 867 padding: 10px;
808 868 }
869 +#wppm_proj_comment_btn{
870 + display:none;
871 + padding: 10px;
872 +}
809 873 #wppm_activity_container{
810 874 background-color:#ffffff;
811 875 margin:15px;
812 876 border: 1px solid #eee !important;
@@ -813,8 +877,11 @@
813 877 }
814 878 .wppm_task_discussion{
815 879 font: 18px "Helvetica Neue",Helvetica,Arial,sans-serif;
816 880 }
881 +.wppm_proj_discussion{
882 + font: 18px "Helvetica Neue",Helvetica,Arial,sans-serif;
883 +}
817 884 .wppm_delete_checklist{
818 885 color:#b73232 !important;
819 886 font: 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
820 887 border-bottom: 1px dashed;
@@ -851,8 +918,19 @@
851 918 color:#eee;
852 919 margin-top: 10px;
853 920 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
854 921 }
922 +#wppm_proj_comment{
923 + width: 80%;
924 + height: 30px;
925 + padding: 5px;
926 + margin-bottom: 15px;
927 + overflow: hidden;
928 + border: 1px solid #eee;
929 + color:#eee;
930 + margin-top: 10px;
931 + font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
932 +}
855 933 .wppm_attachment_title{
856 934 font: 15px "Helvetica Neue",Helvetica,Arial,sans-serif;
857 935 }
858 936 .wppm_comment_date{
@@ -882,8 +960,29 @@
882 960 margin-left: 5px;
883 961 margin-top:5px;
884 962 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
885 963 }
964 +#wppm_proj_attach_file{
965 + color:#301db7;
966 + cursor:pointer;
967 + font-weight: normal;
968 + text-decoration-line: underline;
969 + text-decoration-style: dotted;
970 + font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
971 +}
972 +#wppm_individual_cancel_proj_comment_btn{
973 + float:right;
974 + background-color:#ffffff;
975 + margin-left: 5px;
976 + margin-top:5px;
977 + font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
978 +}
979 +#wppm_individual_submit_proj_comment_btn{
980 + float:right;
981 + margin-left: 5px;
982 + margin-top:5px;
983 + font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
984 +}
886 985 .wppm_thread_messege{
887 986 font-size: 14px;
888 987 font-weight: 400;
889 988 color: #4e4e4e;
@@ -899,17 +998,28 @@
899 998 }
900 999 .wppm_task_label,.wppm_checklist_label,.wppm_project_label{
901 1000 font: 18px "Helvetica Neue",Helvetica,Arial,sans-serif !important;
902 1001 }
1002 +.wppm_task_subtask_container .wppm_checklist_label {
1003 + display: inline-flex;
1004 + align-items: center;
1005 + gap: 8px;
1006 + margin-top: 7px;
1007 +}
1008 +.wppm_task_checklist_container .wppm_checklist_label {
1009 + display: inline-flex;
1010 + align-items: center;
1011 + gap: 8px;
1012 + margin-top: 7px;
1013 +}
903 1014 .widget_divider{
904 - margin-top: 4px !important;
905 - margin-bottom: 6px !important;
1015 + margin:4px 0 6px 0px !important;
906 1016 }
907 1017 .wppm_individual_task_widget{
908 1018 margin-top: 15px!important;
909 1019 }
910 1020 .select2-container{
911 - z-index:999999999999!important;
1021 + z-index:999999999!important;
912 1022 width:100%!important;
913 1023 }
914 1024 .flatpickr-calendar{
915 1025 z-index:999999999999!important;
@@ -927,9 +1037,9 @@
927 1037 .wppm_edit_task_details_widget, .wppm_thread_action, .wppm_edit_project_details_widget{
928 1038 float:right;
929 1039 cursor:pointer;
930 1040 }
931 -.wppm_add_new_task_btn, #wppm_task_list_btn,#wppm_delete_btn,#wppm_delete_task_btn{
1041 +.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{
932 1042 cursor: pointer;
933 1043 }
934 1044 #wppm_project_details_container{
935 1045 border: 1px solid #eee;
@@ -938,17 +1048,18 @@
938 1048 margin-bottom: 12px;
939 1049 }
940 1050 #wppm_view_project_task{
941 1051 background-color: #ffffff;
1052 + margin-top: 10px;
942 1053 }
943 -#wppm_project_tasks,.wppm_add_new_project_btn{
1054 +#wppm_project_tasks,.wppm_add_new_project_btn,#wppm_proj_overview_btn{
944 1055 cursor:pointer;
945 1056 }
946 -#wppm_add_new_project_btn{
1057 +#wppm_add_new_project_btn,#wppm_proj_overview_btn,#wppm_archieve_project_btn{
947 1058 margin-bottom: 10px;
948 1059 }
949 1060 #wppm_delete_project_icon, #wppm_add_new_project_icon, #wppm_project_list_icon, #wppm_task_list_icon{
950 - margin-top: -3px;
1061 + margin-top: -7px;
951 1062 }
952 1063 .wppm_add_new_icon{
953 1064 float: right!important;
954 1065 cursor:pointer;
@@ -1078,5 +1189,1587 @@
1078 1189 position: absolute;
1079 1190 box-shadow: 0 1px 2px rgb(79 148 212 / 80%);
1080 1191 background-color: #fff;
1081 1192 cursor: pointer;
1193 +}
1194 +
1195 +.wppm_bootstrap .wppm_padding_space{
1196 + padding-top: 20px;
1197 +}
1198 +
1199 +.wppm_bootstrap .pricing-widget {
1200 + margin-bottom: 30px;
1201 +}
1202 +.wppm_bootstrap .pheader {
1203 + background-color: #555;
1204 + color: #ffffff;
1205 + padding: 10px;
1206 +}
1207 +.wppm_bootstrap .pheader .title{
1208 + padding: 0;
1209 + margin: 0;
1210 + text-align: center;
1211 +}
1212 +.wppm_bootstrap .pheader .subtitle{
1213 + padding: 0;
1214 + margin: 10px 0 0;
1215 + text-align: center;
1216 +}
1217 +.wppm_bootstrap .payment_freq {
1218 + color: #fff !important;
1219 +}
1220 +.wppm_bootstrap .pbody {
1221 + padding: 20px;
1222 + border: 1px solid #555;
1223 +}
1224 +.wppm_bootstrap .addon-container {
1225 + display: flex;
1226 + align-items: center;
1227 + padding: 5px 0;
1228 +}
1229 +.wppm_bootstrap .addon-details {
1230 + flex-grow: 1;
1231 + padding-left: 5px;
1232 +}
1233 +.wppm_bootstrap .pfooter {
1234 + display: flex;
1235 + border-left: 1px solid #555;
1236 + border-right: 1px solid #555;
1237 + border-bottom: 1px solid #555;
1238 + justify-content: center;
1239 + padding: 10px 0;
1240 +}
1241 +
1242 +.wppm_bootstrap .purchase_addon{
1243 + padding-right: 5px;
1244 +}
1245 +
1246 +#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{
1247 + margin-right:-19px;
1248 +}
1249 +
1250 +.wppm-help-container{
1251 + padding: 10px;
1252 + background-color: #f0f0f1;
1253 + margin-bottom: 15px;
1254 + border-radius: 3px;
1255 +}
1256 +
1257 +#wppm_public_project_label{
1258 + padding: 10px 0px 0px 10px;
1259 +}
1260 +
1261 +.wppm-filter-actions{
1262 + display: flex;
1263 + flex-wrap: wrap;
1264 + align-items: center;
1265 +}
1266 +
1267 +#wppm_project_filter_container{
1268 + display: flex;
1269 + flex-wrap: wrap;
1270 + align-items: flex-end;
1271 + margin-bottom: 10px;
1272 +}
1273 +
1274 +#wppm_task_filter_container{
1275 + display: flex;
1276 + flex-wrap: wrap;
1277 + align-items: flex-end;
1278 + margin-bottom: 10px;
1279 +}
1280 +
1281 +#wppm_task_filter, #wppm_task_list_proj_filter, #tb-filter-created-by
1282 +{
1283 + border: 1px solid #ccc !important;
1284 + background-color:#FFFFFF;
1285 + border-radius:4px;
1286 + font: 15px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
1287 +}
1288 +
1289 +.wppm-filter-item {
1290 + max-width: 200px;
1291 + margin-right: 5px;
1292 + margin-bottom: 10px;
1293 + margin: 0 5px 10px 10px;
1294 +}
1295 +.wppm-filter-item select {
1296 + width: 100% !important;
1297 +}
1298 +
1299 +.wppm-filter-item label{
1300 + font-size: 12px;
1301 + font-weight: 600;
1302 + margin-bottom: 3px;
1303 + vertical-align: middle;
1304 + color: #858c96;
1305 +}
1306 +
1307 +.wppm_display_submit{
1308 + display: flex;
1309 + margin-bottom: 10px;
1310 +}
1311 +
1312 +.wppm-filter-actions span {
1313 + cursor: pointer;
1314 + font-size: 16px;
1315 + text-decoration: underline;
1316 + margin-bottom: 7px!important;
1317 + font: 14px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
1318 + color: #858c96;
1319 +}
1320 +
1321 +.wppm-link {
1322 + cursor: pointer !important;
1323 + text-decoration: none !important;
1324 +}
1325 +
1326 +.wppm-link:hover {
1327 + color: #2271b1 !important;
1328 + text-decoration: underline !important;
1329 +}
1330 +
1331 +#wppm_project_list_container select{
1332 + min-height: 30px !important;
1333 + max-height: 35px !important;
1334 + padding: 0 24px 0 8px !important;
1335 + border: 1px solid #ccc !important;
1336 + font: 14px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
1337 +}
1338 +
1339 +#wppm_task_list_container select{
1340 + min-height: 30px !important;
1341 + max-height: 35px !important;
1342 + padding: 0 24px 0 8px !important;
1343 + border: 1px solid #ccc !important;
1344 + font: 15px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
1345 +}
1346 +
1347 +#wppm_proj_discussion_container{
1348 + background-color: #ffffff;
1349 + border: 1px solid #eee !important;
1350 +}
1351 +.wppm-setting-tab-container {
1352 + display: flex;
1353 + flex-wrap: wrap;
1354 + width: 100%;
1355 + align-items: center;
1356 + margin-bottom: 10px;
1357 + background-color:#F0F0F1;
1358 +}
1359 +.wppm-setting-tab-container button {
1360 + padding: 7px 15px;
1361 + font-size: 16px;
1362 + font-weight: normal;
1363 + border: none !important;
1364 + color: #6A6A6A;
1365 + background-color: transparent;
1366 + cursor: pointer;
1367 + border-radius: 16px;
1368 + margin: 10 0 5px 5px;
1369 +}
1370 +.wppm-setting-tab-container button.active,
1371 +.wppm-setting-tab-container button:hover {
1372 + color: #fff;
1373 + background-color: #FFA04A;
1374 +}
1375 +.wppm-input-group {
1376 + width: 100%;
1377 + display: flex;
1378 + flex-direction: column;
1379 + padding-bottom: 15px;
1380 + box-sizing: border-box;
1381 +}
1382 +.wppm-input-group .label-container {
1383 + display: flex;
1384 + align-items: center;
1385 + color: #000;
1386 + margin-bottom: 2px;
1387 +}
1388 +.wppm-input-group label {
1389 + font-size: 12px;
1390 + font-weight: 600;
1391 + margin-right: 5px;
1392 +}
1393 +.wppm-input-group .label-container svg {
1394 + width: 12px;
1395 + margin-left: 5px;
1396 +}
1397 +.wppm-input-group input[type="text"],
1398 +.wppm-input-group select {
1399 + width: 100%;
1400 + max-width: 100%;
1401 +}
1402 +.wppm-input-group .checkbox-group,
1403 +.wppm-input-group .radio-group {
1404 + width: 100%;
1405 + display: flex;
1406 + flex-wrap: wrap;
1407 + align-items: center;
1408 +}
1409 +.wppm-input-group .checkbox-group div,
1410 +.wppm-input-group .radio-group div {
1411 + width: 250px;
1412 + display: flex;
1413 + flex-wrap: wrap;
1414 + align-items: center;
1415 + margin: 0 10px 5px 0;
1416 +}
1417 +.wppm-input-group .checkbox-group div input,
1418 +.wppm-input-group .radio-group div input {
1419 + margin: 0 5px 0 0 !important;
1420 +}
1421 +.wppm-input-group .checkbox-group div span,
1422 +.wppm-input-group .radio-group div span {
1423 + font-size: 12px;
1424 + font-weight: 300;
1425 +}
1426 +.wppm-input-group .required-char {
1427 + font-size: 12px;
1428 + color: #ff0000;
1429 +}
1430 +.wppm-input-group .divide-bar {
1431 + width: 100%;
1432 + display: flex;
1433 + flex-wrap: grid;
1434 + align-items: center;
1435 +}
1436 +
1437 +/* Checkboxes */
1438 +#wppm-container .checkbox-container,
1439 +.wppm-modal .checkbox-container, #wppm_task_list_container .checkbox-container {
1440 + display: flex;
1441 + line-height: normal;
1442 +}
1443 +#wppm-container .checkbox-container input,
1444 +.wppm-modal .checkbox-container input, #wppm_task_list_container .checkbox-container input{
1445 + padding: 0;
1446 + height: initial;
1447 + width: initial;
1448 + margin-bottom: 0;
1449 + display: none;
1450 + cursor: pointer;
1451 +}
1452 +#wppm-container .checkbox-container label,
1453 +.wppm-modal .checkbox-container label , #wppm_task_list_container .checkbox-container label{
1454 + position: relative;
1455 + cursor: pointer;
1456 + padding: 0 !important;
1457 + font-size: 14px !important;
1458 +}
1459 +#wppm-container .checkbox-container label:before,
1460 +.wppm-modal .checkbox-container label:before , #wppm_task_list_container .checkbox-container label:before{
1461 + content:'';
1462 + -webkit-appearance: none;
1463 + background-color: #fff;
1464 + box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
1465 + display: inline-block;
1466 + position: relative;
1467 + vertical-align: middle;
1468 + cursor: pointer;
1469 + margin-left: 5px;
1470 + border: 1px solid #8a8a8a;
1471 +}
1472 +#wppm-container .checkbox-container input:checked + label:after,
1473 +.wppm-modal .checkbox-container input:checked + label:after, #wppm_task_list_container .checkbox-container input:checked + label:after{
1474 + content: '';
1475 + display: block;
1476 + position: absolute;
1477 + top: 1px;
1478 + right: 9px;
1479 + width: 6px;
1480 + height: 9px;
1481 + border: solid #0079bf;
1482 + border-width: 0 0 2px 2px;
1483 + transform: matrix(-1, -1, -1, 1, 3, 0);
1484 +}
1485 +#wppm-container .checkbox-container label,
1486 +.wppm-modal .checkbox-container label, #wppm_task_list_container .checkbox-container label{
1487 + display: flex;
1488 +}
1489 +#wppm-container .checkbox-container label:before,
1490 +.wppm-modal .checkbox-container label:before, #wppm_task_list_container .checkbox-container label:before{
1491 + width: 18px !important;
1492 + height: 18px !important;
1493 + box-sizing: border-box;
1494 + padding: 8px;
1495 +}
1496 +#wppm-container .checkbox-container label:after,
1497 +.wppm-modal .checkbox-container label:after, #wppm_task_list_container .checkbox-container label:after {
1498 + flex-grow: 1;
1499 +}
1500 +#wppm-container .checkbox-container p,
1501 +.wppm-modal .checkbox-container p, #wppm_task_list_container .checkbox-container p{
1502 + margin: 0 !important;
1503 +}
1504 +
1505 +.wppm-bulk-actions {
1506 + display: flex;
1507 + align-items: center;
1508 +}
1509 +.wppm-bulk-actions select {
1510 + min-width: 150px;
1511 + max-width: 250px;
1512 + margin-left: 5px;
1513 +}
1514 +.wppm-bulk-actions button {
1515 + margin-left: 10px;
1516 + display: flex;
1517 + align-items: center;
1518 +}
1519 +.wppm-bulk-actions button svg {
1520 + height: 13px;
1521 + margin-right: 15px;
1522 +}
1523 +
1524 +#wppm-bulk-actions{
1525 + left: 0px!important;
1526 +}
1527 +
1528 +/* Popover Menu */
1529 +.wppm-popover-menu {
1530 + padding: 3px !important;
1531 + border-radius: 3px !important;
1532 +}
1533 +.wppm-popover-menu-item {
1534 + display: flex;
1535 + align-items: center;
1536 + padding: 10px;
1537 + cursor: pointer;
1538 + background-color: #fff;
1539 + color: #707070;
1540 + margin-left: 10px !important;
1541 +}
1542 +.wppm-popover-menu-item:hover {
1543 + color: #fff;
1544 + background-color: #313042 !important;
1545 +}
1546 +.wppm-popover-menu-item svg {
1547 + width: 14px;
1548 + margin-left: 10px;
1549 +}
1550 +.wppm-popover-menu-item span {
1551 + font-size: 14px;
1552 +}
1553 +
1554 +.wppm-button.secondary {
1555 + border: 1px solid #ccc !important;
1556 + background-color: #fff !important;
1557 + color: #313042 !important;
1558 + font: 14px "Helvetica Neue", Arial, Helvetica, sans-serif !important;
1559 +}
1560 +
1561 +.wppm-button.small {
1562 + font-size: 12px !important;
1563 +}
1564 +
1565 +#wppm_task_description, #wppm_add_new_project #wppm_proj_description{
1566 + height: 160px !important;
1567 + width: 100% !important;
1568 +}
1569 +
1570 +/* Form fields */
1571 +.wppm-input-group {
1572 + width: 100%;
1573 + display: flex;
1574 + flex-direction: column;
1575 + padding-bottom: 15px;
1576 + box-sizing: border-box;
1577 +}
1578 +.wppm-input-group .label-container {
1579 + display: flex;
1580 + align-items: center;
1581 + color: #000;
1582 + margin-bottom: 2px;
1583 +}
1584 +.wppm-input-group label {
1585 + font-size: 12px;
1586 + font-weight: 600;
1587 + margin-left: 5px;
1588 +}
1589 +.wppm-input-group .label-container svg {
1590 + width: 12px;
1591 + margin-right: 5px;
1592 +}
1593 +.wppm-input-group input[type="text"],
1594 +.wppm-input-group select {
1595 + width: 100%;
1596 + max-width: 100%;
1597 +}
1598 +
1599 + @media (max-width: 768px) {
1600 + .wppm_task_list{
1601 + flex-basis: 50% !important;
1602 + }
1603 + }
1604 +
1605 +#wppmprint_menu{
1606 + display: flex;
1607 + flex-direction: column;
1608 + position: absolute;
1609 + background: white;
1610 + border: 1px solid #ccc;
1611 + z-index: 1000;
1612 + margin-left: 155px;
1613 + display: none;
1614 +}
1615 +
1616 +#wppmprint_menu a {
1617 + padding: 8px 12px;
1618 + text-decoration: none;
1619 + color: #333;
1620 +}
1621 +
1622 +#wppmprint_menu a:hover {
1623 + background: #f0f0f0;
1624 +}
1625 +
1626 +.wppm_checklist_items_container {
1627 + list-style: none;
1628 + padding-left: 0;
1629 + margin-left: 20px;
1630 + margin-right: 20px;
1631 +}
1632 +.wppm_checklist_items_container .wppm_checklist_item {
1633 + padding: 6px 10px;
1634 + background: #fff;
1635 + margin-right: 5px;
1636 + margin-bottom: 4px;
1637 + margin-left: 5px;
1638 + border: 1px solid #ddd;
1639 + cursor: grab;
1640 + display: flex;
1641 + align-items: center;
1642 +}
1643 +.wppm_checklist_items_container .wppm_chk_items_drag {
1644 + margin-right: 10px;
1645 + cursor: move;
1646 +}
1647 +.wppm_subtask_more_users {
1648 + display: inline-flex;
1649 + flex-shrink: 0;
1650 + align-items: center;
1651 + justify-content: center;
1652 + width: 20px;
1653 + height: 20px;
1654 + min-width: 20px;
1655 + border-radius: 50%;
1656 + background: #e2e4e7;
1657 + color: #555d66;
1658 + font-size: 8px;
1659 + line-height: 1;
1660 + font-weight: 600;
1661 + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
1662 + vertical-align: middle;
1663 + margin-left: -12px;
1664 + padding: 0;
1665 + border: 2px solid #fff;
1666 + box-sizing: border-box;
1667 +}
1668 +
1669 +/* Add checklist / add checklist item: input + button sized to content, not full-width */
1670 +#wppm_checklist_label,
1671 +input[name="wppm_checklist_item_label"] {
1672 + display: inline-block !important;
1673 + width: 240px !important;
1674 + max-width: 100%;
1675 + margin-right: 8px;
1676 + vertical-align: middle;
1677 + box-sizing: border-box;
1678 +}
1679 +#wppm_checklist_btn,
1680 +input[name="wppm_checklist_item_label"] + input[type="button"] {
1681 + display: inline-block !important;
1682 + width: auto !important;
1683 + vertical-align: middle;
1684 +}
1685 +
1686 +/* Subtasks / checklist - mobile */
1687 +@media (max-width: 782px) {
1688 + .wppm_checklist_items_container {
1689 + margin-left: 0;
1690 + margin-right: 0;
1691 + }
1692 + .wppm_checklist_items_container .wppm_checklist_item {
1693 + flex-wrap: wrap;
1694 + margin-left: 0;
1695 + margin-right: 0;
1696 + }
1697 + .wppm_checklist_items_container .wppm_checklist_item .col-sm-8,
1698 + .wppm_checklist_items_container .wppm_checklist_item .col-sm-4 {
1699 + width: 100%;
1700 + text-align: left !important;
1701 + margin-top: 6px;
1702 + }
1703 + #wppm_checklist_label,
1704 + input[name="wppm_checklist_item_label"] {
1705 + width: 100% !important;
1706 + margin-right: 0;
1707 + margin-bottom: 8px;
1708 + }
1709 + #wppm_checklist_btn,
1710 + input[name="wppm_checklist_item_label"] + input[type="button"] {
1711 + width: 100% !important;
1712 + }
1713 +
1714 + /* Open Task toolbar: let the icon buttons wrap instead of overflowing */
1715 + .wppm_headers.row {
1716 + display: flex;
1717 + flex-wrap: wrap;
1718 + align-items: center;
1719 + row-gap: 8px;
1720 + }
1721 + .wppm_headers .col-sm-8 {
1722 + display: flex;
1723 + flex-wrap: wrap;
1724 + align-items: center;
1725 + gap: 6px;
1726 + width: 100%;
1727 + }
1728 +
1729 + /* Checklist header row (title + delete link) - stack like subtask/checklist items */
1730 + .wppm_task_checklist_container .row .col-sm-8,
1731 + .wppm_task_checklist_container .row .col-sm-4 {
1732 + width: 100%;
1733 + text-align: left !important;
1734 + margin-top: 4px;
1735 + }
1736 + .wppm_task_subtask_container,
1737 + .wppm_task_checklist_container,
1738 + .wppm_thread,
1739 + .wppm_proj_thread {
1740 + margin: 8px;
1741 + }
1742 +
1743 + /* Comment thread: avatar above the comment body instead of a cramped side-by-side table */
1744 + .wppm_thread,
1745 + .wppm_proj_thread {
1746 + display: block;
1747 + }
1748 + .wppm_thread_avatar,
1749 + .wppm_thread_body {
1750 + display: block;
1751 + width: 100%;
1752 + padding-left: 0;
1753 + }
1754 + .wppm_thread_avatar {
1755 + padding-bottom: 8px;
1756 + }
1757 +}
1758 +
1759 +/* Main container */
1760 +/* GRID CONTAINER */
1761 +.wppm_bootstrap .pricing-flex {
1762 + display: grid !important;
1763 + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
1764 + gap: 20px;
1765 + align-items: stretch;
1766 +}
1767 +
1768 +/* CARD */
1769 +.wppm_bootstrap .pricing-widget {
1770 + display: flex;
1771 + flex-direction: column;
1772 +
1773 + background: #fff;
1774 + border: 1px solid #e5e5e5;
1775 + border-radius: 6px;
1776 + padding: 15px;
1777 + box-sizing: border-box;
1778 +}
1779 +
1780 +/* BODY GROWS */
1781 +.wppm_bootstrap .pricing-widget .pbody {
1782 + flex: 1;
1783 +}
1784 +
1785 +/* PRO ADDON CARD (Addons page) - card stays fully visible, just a small corner badge */
1786 +.wppm_bootstrap .pricing-widget {
1787 + position: relative;
1788 +}
1789 +.wppm_bootstrap .wppm-pro-badge-corner-lg {
1790 + position: absolute;
1791 + top: 10px;
1792 + right: 10px;
1793 + z-index: 5;
1794 + display: flex;
1795 + align-items: center;
1796 + justify-content: center;
1797 + width: 30px;
1798 + height: 30px;
1799 + background: #fff;
1800 + border-radius: 50%;
1801 + box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
1802 + line-height: 0;
1803 +}
1804 +
1805 +/* PRO FEATURE BADGE ICON (sidebar menu, settings pills, toolbar buttons) */
1806 +.wppm-pro-badge {
1807 + display: inline-flex;
1808 + align-items: center;
1809 + margin-left: 4px;
1810 + line-height: 0;
1811 + vertical-align: middle;
1812 +}
1813 +.wppm-pro-badge svg {
1814 + display: block;
1815 +}
1816 +
1817 +/* Locked settings pill */
1818 +.wppm_bootstrap .wppm_setting_pills li.wppm-locked-pill a {
1819 + display: flex;
1820 + align-items: center;
1821 + opacity: 0.75;
1822 +}
1823 +.wppm_bootstrap .wppm_setting_pills li.wppm-locked-pill .wppm-pro-pill-lock {
1824 + display: inline-flex;
1825 + align-items: center;
1826 + margin-right: 4px;
1827 + line-height: 0;
1828 + vertical-align: middle;
1829 +}
1830 +
1831 +/* Locked project toolbar button */
1832 +.wppm_bootstrap .wppm-locked-toolbar-btn {
1833 + opacity: 0.7;
1834 +}
1835 +.wppm_bootstrap .wppm-locked-toolbar-btn:hover {
1836 + opacity: 1;
1837 +}
1838 +.wppm_bootstrap .wppm-pro-icon-wrap {
1839 + position: relative;
1840 + display: inline-block;
1841 + line-height: 0;
1842 +}
1843 +.wppm_bootstrap .wppm-pro-icon-wrap img {
1844 + width: 16px;
1845 + height: 16px;
1846 + vertical-align: middle;
1847 +}
1848 +.wppm_bootstrap .wppm-pro-badge-corner {
1849 + position: absolute;
1850 + top: -5px;
1851 + right: -6px;
1852 + display: flex;
1853 + align-items: center;
1854 + justify-content: center;
1855 + width: 14px;
1856 + height: 14px;
1857 + background: #fff;
1858 + border-radius: 50%;
1859 + box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
1860 + line-height: 0;
1861 +}
1862 +
1863 +/* Pro addon teaser (sidebar page + settings inline upsell) */
1864 +.wppm-pro-teaser {
1865 + max-width: 520px;
1866 + margin: 30px auto;
1867 + padding: 30px;
1868 + text-align: center;
1869 + background: #fff;
1870 + border: 1px solid #e5e5e5;
1871 + border-radius: 6px;
1872 + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
1873 +}
1874 +.wppm-pro-teaser-inline {
1875 + margin: 0;
1876 +}
1877 +.wppm-pro-teaser-icon {
1878 + position: relative;
1879 + display: inline-block;
1880 + margin-bottom: 15px;
1881 +}
1882 +.wppm-pro-teaser-icon img {
1883 + width: 48px;
1884 + height: 48px;
1885 + opacity: 0.5;
1886 +}
1887 +.wppm-pro-teaser-icon .wppm-pro-teaser-lock {
1888 + position: absolute;
1889 + right: -6px;
1890 + bottom: -4px;
1891 + display: flex;
1892 + align-items: center;
1893 + justify-content: center;
1894 + width: 22px;
1895 + height: 22px;
1896 + background: #f5a623;
1897 + border-radius: 50%;
1898 + line-height: 0;
1899 +}
1900 +.wppm-pro-teaser h2 {
1901 + margin: 0 0 10px;
1902 + font-family: "OpenSans-Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
1903 +}
1904 +.wppm-pro-teaser p {
1905 + color: #555;
1906 + margin-bottom: 20px;
1907 +}
1908 +.wppm-pro-teaser-actions .btn {
1909 + margin: 0 5px;
1910 +}
1911 +
1912 +/* FOOTER */
1913 +/* .wppm_bootstrap .pricing-widget .pfooter {
1914 + display: flex;
1915 + justify-content: space-between;
1916 + gap: 10px;
1917 + margin-top: 15px;
1918 +}
1919 +
1920 +/* MOBILE FOOTER STACK */
1921 +@media (max-width: 480px) {
1922 + .wppm_bootstrap .pricing-widget .pfooter {
1923 + flex-direction: column;
1924 + }
1925 +} */
1926 +
1927 +.wppm-dashboard{
1928 + padding:20px;
1929 + margin-top:20px;
1930 + font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
1931 +}
1932 +.wppm-dashboard-top{
1933 + display:grid;
1934 + grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
1935 + gap:20px;
1936 + margin-bottom:20px;
1937 +}
1938 +
1939 +.wppm-small-widget{
1940 + background:#ffffff;
1941 + border-radius:10px;
1942 + padding:20px;
1943 + box-shadow:0 2px 8px rgba(0,0,0,0.05);
1944 + transition:all 0.2s ease;
1945 + display:flex;
1946 + align-items:center;
1947 + gap:15px;
1948 +}
1949 +
1950 +.wppm-small-widget:hover{
1951 + transform:translateY(-3px);
1952 + box-shadow:0 6px 16px rgba(0,0,0,0.08);
1953 +}
1954 +
1955 +.wppm-small-widget h3{
1956 + font-size:14px;
1957 + color:#666;
1958 + margin-bottom:10px;
1959 +}
1960 +
1961 +.wppm-number{
1962 + font-size:28px;
1963 + font-weight:600;
1964 + color:#222;
1965 +}
1966 +.wppm-small-widget.overdue{
1967 + border-left:4px solid #e74c3c;
1968 +}
1969 +
1970 +.wppm-divider{
1971 + height:1px;
1972 + background:#eee;
1973 + margin:20px 0;
1974 +}
1975 +
1976 +.wppm-row{
1977 + display:grid;
1978 + grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
1979 + gap:20px;
1980 + margin-bottom:20px;
1981 +}
1982 +
1983 +.wppm-widget{
1984 + background:#fff;
1985 + border-radius:10px;
1986 + padding:20px;
1987 + box-shadow:0 2px 8px rgba(0,0,0,0.05);
1988 + transition:all 0.2s ease;
1989 +}
1990 +.wppm-widget h2{
1991 + font-size:16px;
1992 + margin-bottom:15px;
1993 + font-weight:600;
1994 + color:#222;
1995 +}
1996 +
1997 +#tbl_my_tasks,#tbl_active_projects,#tbl_upcoming_tasks, #tbl_todays_tasks {
1998 + border-collapse: collapse !important;
1999 + width: 100% !important;
2000 +}
2001 +
2002 +#tbl_my_tasks th,
2003 +#tbl_my_tasks td,
2004 +#tbl_todays_tasks th,
2005 +#tbl_todays_tasks td,
2006 +#tbl_active_projects th,
2007 +#tbl_active_projects td,
2008 +#tbl_upcoming_tasks th,
2009 +#tbl_upcoming_tasks td {
2010 + border: 1px solid #ddd !important;
2011 + padding: 8px !important;
2012 +}
2013 +
2014 +#tbl_my_tasks th, #tbl_active_projects th, #tbl_upcoming_tasks th, #tbl_todays_tasks th{
2015 + background-color: #f5f5f5 !important;
2016 + text-align: left !important;
2017 +}
2018 +
2019 +#tbl_my_tasks tr:hover, #tbl_active_projects tr:hover, #tbl_upcoming_tasks tr:hover, #tbl_todays_tasks tr:hover{
2020 + background-color: #f9f9f9 !important;
2021 + cursor: pointer;
2022 +}
2023 +.wppm-widget table td{
2024 + padding:10px;
2025 + border-top:1px solid #f2f2f2;
2026 + font-size:14px;
2027 +}
2028 +
2029 +.wppm-widget table th{
2030 + background:#f8fafc;
2031 + color:#777;
2032 + font-weight:600;
2033 + padding:10px;
2034 + border-bottom:1px solid #e5e7eb;
2035 +}
2036 +
2037 +canvas{
2038 + max-height:250px !important;
2039 +}
2040 +
2041 +.wppm-widget:hover{
2042 + box-shadow:0 8px 20px rgba(0,0,0,0.07);
2043 +}
2044 +
2045 +.wppm-widget-icon{
2046 + font-size:28px;
2047 + background:#f5f7fb;
2048 + padding:12px;
2049 + border-radius:8px;
2050 +}
2051 +.wppm-widget h2{
2052 + display:flex;
2053 + justify-content:space-between;
2054 + align-items:center;
2055 +}
2056 +
2057 +.wppm-view-all{
2058 + font-size:13px;
2059 + color:#4c7cf3;
2060 + text-decoration:none;
2061 +}
2062 +
2063 +.wppm-view-all:hover{
2064 + text-decoration:underline;
2065 +}
2066 +
2067 +.wppm-workload-list {
2068 + list-style: none;
2069 + padding: 0;
2070 + margin: 0;
2071 +}
2072 +
2073 +.wppm-workload-list li {
2074 + display: flex;
2075 + align-items: center;
2076 + gap:10px;
2077 + margin-bottom: 10px;
2078 +}
2079 +
2080 +.wppm-workload-bar {
2081 + flex:1;
2082 + height:8px;
2083 + background:#eee;
2084 + border-radius:5px;
2085 + overflow:hidden;
2086 +}
2087 +
2088 +.wppm-workload-bar div {
2089 + height: 100%;
2090 + background: #3498db;
2091 + border-radius: 5px;
2092 +}
2093 +
2094 +.dashboard-progress-wrapper{
2095 + display:flex;
2096 + align-items:center;
2097 + gap:8px;
2098 +}
2099 +
2100 +.dashboard-progress-bar{
2101 + flex:1;
2102 + height:8px;
2103 + background:#e5e7eb;
2104 + border-radius:5px;
2105 + overflow:hidden;
2106 +}
2107 +
2108 +.dashboard-progress{
2109 + height:100%;
2110 + border-radius:5px;
2111 +}
2112 +
2113 +.dashboard-progress-text{
2114 + font-size:12px;
2115 + font-weight:600;
2116 +}
2117 +.wppm-priority-dot{
2118 + display:inline-block;
2119 + width:10px;
2120 + height:10px;
2121 + border-radius:50%;
2122 + margin-right:6px;
2123 + vertical-align:middle;
2124 +}
2125 +/* Wrapper (relative parent) */
2126 +.tb-filter-bar {
2127 + position: relative;
2128 +}
2129 +
2130 +/* Advanced panel (FLOAT) */
2131 +#tb-advanced-panel {
2132 + position: absolute;
2133 + top: 110%; /* below button */
2134 + right: 0;
2135 + width: 320px;
2136 +
2137 + background: #ffffff;
2138 + border: 1px solid #e2e8f0;
2139 + border-radius: 10px;
2140 + box-shadow: 0 10px 25px rgba(0,0,0,0.1);
2141 +
2142 + padding: 12px;
2143 + z-index: 999999999;
2144 +
2145 + /* hidden state */
2146 + opacity: 0;
2147 + transform: translateY(-10px);
2148 + pointer-events: none;
2149 +
2150 + transition: all 0.25s ease;
2151 +}
2152 +
2153 +/* OPEN STATE */
2154 +#tb-advanced-panel.tb-open {
2155 + opacity: 1;
2156 + transform: translateY(0);
2157 + pointer-events: auto;
2158 +}
2159 +
2160 +/* Rows */
2161 +.tb-row {
2162 + margin-bottom: 10px;
2163 +}
2164 +
2165 +.tb-row label {
2166 + font-size: 12px;
2167 + font-weight: 600;
2168 + display: block;
2169 + margin-bottom: 4px;
2170 +}
2171 +
2172 +/* Inputs */
2173 +#tb-advanced-panel input,
2174 +#tb-advanced-panel select {
2175 + width: 100%!important;
2176 + padding: 6px 8px!important;
2177 + border: 1px solid #cbd5e1;
2178 + border-radius: 6px;
2179 +}
2180 +/* Wrapper */
2181 +.tb-filter-bar {
2182 + position: relative;
2183 + display: flex;
2184 + align-items: center;
2185 + gap: 10px;
2186 + overflow: visible!important;
2187 +}
2188 +
2189 +/* Button */
2190 +.tb-btn {
2191 + padding: 2px 10px;
2192 + border-radius: 6px;
2193 + border: 1px solid #cbd5e1;
2194 + background: #fff;
2195 + cursor: pointer;
2196 +}
2197 +
2198 +/* ================= POPOVER ================= */
2199 +.tb-popover {
2200 + position: absolute;
2201 + top: 120%;
2202 + right: 0;
2203 + width: 320px;
2204 +
2205 + background: #fff;
2206 + border: 1px solid #e2e8f0;
2207 + border-radius: 10px;
2208 + box-shadow: 0 15px 35px rgba(0,0,0,0.12);
2209 +
2210 + padding: 12px;
2211 + z-index: 999999999;
2212 +
2213 + opacity: 0;
2214 + transform: translateY(-10px);
2215 + pointer-events: none;
2216 + transition: all 0.25s ease;
2217 +}
2218 +
2219 +.tb-popover.tb-open {
2220 + opacity: 1;
2221 + transform: translateY(0);
2222 + pointer-events: auto;
2223 +}
2224 +
2225 +/* Arrow */
2226 +.tb-arrow {
2227 + position: absolute;
2228 + top: -6px;
2229 + right: 20px;
2230 + width: 12px;
2231 + height: 12px;
2232 + background: white;
2233 + border-left: 1px solid #e2e8f0;
2234 + border-top: 1px solid #e2e8f0;
2235 + transform: rotate(45deg);
2236 +}
2237 +
2238 +/* Sections */
2239 +.tb-section {
2240 + margin-bottom: 12px;
2241 +}
2242 +
2243 +.tb-section h4 {
2244 + font-size: 12px;
2245 + margin-bottom: 6px;
2246 + color: #64748b;
2247 +}
2248 +
2249 +/* Inputs */
2250 +.tb-popover input,
2251 +.tb-popover select {
2252 + width: 100%;
2253 + margin-bottom: 6px;
2254 + padding: 6px;
2255 + border: 1px solid #cbd5e1;
2256 + border-radius: 6px;
2257 +}
2258 +
2259 +/* ================= CHIPS ================= */
2260 +/* .tb-chips {
2261 + display: flex;
2262 + gap: 6px;
2263 + flex-wrap: wrap;
2264 +} */
2265 +
2266 +/* .tb-chip {
2267 + background: #eef2ff;
2268 + color: #3730a3;
2269 + padding: 4px 8px;
2270 + border-radius: 20px;
2271 + font-size: 12px;
2272 + cursor: pointer;
2273 +} */
2274 +/* =========================
2275 + MOBILE FILTER PANEL
2276 +========================= */
2277 +/* @media (max-width: 768px) {
2278 +
2279 + #tb-advanced-panel {
2280 + position: fixed;
2281 + left: 0;
2282 + right: 0;
2283 + bottom: 0;
2284 + top: auto;
2285 +
2286 + width: 100%;
2287 + max-height: 80vh;
2288 +
2289 + border-radius: 16px 16px 0 0;
2290 + padding: 16px;
2291 +
2292 + transform: translateY(100%);
2293 + opacity: 1;
2294 + pointer-events: auto;
2295 +
2296 + overflow-y: auto;
2297 + }
2298 +
2299 + #tb-advanced-panel.tb-open {
2300 + transform: translateY(0);
2301 + }
2302 +
2303 + .tb-arrow {
2304 + display: none;
2305 + }
2306 +
2307 + /* backdrop */
2308 + /* #tb-backdrop {
2309 + position: fixed;
2310 + top: 0;
2311 + left: 0;
2312 + right: 0;
2313 + bottom: 0;
2314 + background: rgba(0,0,0,0.4);
2315 + z-index: 9998;
2316 + display: none;
2317 + }
2318 +
2319 + #tb-backdrop.active {
2320 + display: block;
2321 + }
2322 +
2323 +} */
2324 +/* =========================
2325 + MOBILE FILTER PANEL
2326 +========================= */
2327 +@media (max-width: 768px) {
2328 +
2329 + #tb-advanced-panel,
2330 + #tb-advanced-panel.tb-popover {
2331 + position: fixed !important;
2332 +
2333 + top: 0 !important;
2334 + right: 0 !important;
2335 + bottom: 0 !important;
2336 + left: 0 !important;
2337 +
2338 + width: 100vw !important;
2339 + height: 100vh !important;
2340 + max-width: none !important;
2341 + max-height: none !important;
2342 +
2343 + margin: 0 !important;
2344 + padding: 16px !important;
2345 +
2346 + box-sizing: border-box !important;
2347 +
2348 + background: #fff !important;
2349 +
2350 + border: none !important;
2351 + border-radius: 0 !important;
2352 +
2353 + box-shadow: none !important;
2354 +
2355 + overflow-y: auto !important;
2356 + -webkit-overflow-scrolling: touch;
2357 +
2358 + z-index: 999999999 !important;
2359 +
2360 + /* CLOSED */
2361 + opacity: 0 !important;
2362 + visibility: hidden !important;
2363 + transform: none !important;
2364 + pointer-events: none !important;
2365 +
2366 + transition: opacity 0.25s ease, visibility 0.25s ease !important;
2367 + }
2368 +
2369 + @media (max-width: 768px) {
2370 +
2371 + #tb-active-filters,
2372 + .tb-chips {
2373 + display: flex !important;
2374 + flex-direction: column !important;
2375 + align-items: stretch !important;
2376 + gap: 8px !important;
2377 + width: 100% !important;
2378 + }
2379 +
2380 + #tb-active-filters .tb-chip,
2381 + .tb-chips .tb-chip {
2382 + display: inline-flex !important;
2383 + align-items: center;
2384 + justify-content: space-between;
2385 +
2386 + width: 100% !important;
2387 + box-sizing: border-box;
2388 + }
2389 +}
2390 +
2391 + /* OPEN */
2392 + #tb-advanced-panel.tb-open {
2393 + opacity: 1 !important;
2394 + visibility: visible !important;
2395 + transform: none !important;
2396 + pointer-events: auto !important;
2397 + }
2398 +
2399 + /* Hide arrow on mobile */
2400 + #tb-advanced-panel .tb-arrow {
2401 + display: none !important;
2402 + }
2403 +
2404 + /* Mobile header */
2405 + .tb-mobile-header {
2406 + display: flex !important;
2407 +
2408 + position: sticky;
2409 + top: 0;
2410 +
2411 + background: #fff;
2412 + z-index: 2;
2413 +
2414 + padding: 5px 0 15px;
2415 + margin-bottom: 15px;
2416 +
2417 + font-size: 18px;
2418 + }
2419 +
2420 + #tb-close-filters {
2421 + border: 0;
2422 + background: transparent;
2423 + font-size: 24px;
2424 + cursor: pointer;
2425 + }
2426 +
2427 + /* Backdrop */
2428 + #tb-backdrop {
2429 + position: fixed !important;
2430 +
2431 + top: 0 !important;
2432 + right: 0 !important;
2433 + bottom: 0 !important;
2434 + left: 0 !important;
2435 +
2436 + width: 100vw !important;
2437 + height: 100vh !important;
2438 +
2439 + background: rgba(0, 0, 0, 0.4);
2440 +
2441 + z-index: 999998 !important;
2442 +
2443 + display: none;
2444 + }
2445 +
2446 + #tb-backdrop.active {
2447 + display: block !important;
2448 + }
2449 +
2450 +}
2451 +
2452 +.tb-mobile-header {
2453 + display: none;
2454 + justify-content: space-between;
2455 + align-items: center;
2456 + font-weight: 600;
2457 + margin-bottom: 10px;
2458 +}
2459 +
2460 +@media (max-width:768px){
2461 + .tb-mobile-header {
2462 + display: flex;
2463 + }
2464 +}
2465 +.tb-section {
2466 + display: flex;
2467 + flex-direction: column;
2468 + gap: 8px;
2469 +}
2470 +.tb-popover {
2471 + width: 300px;
2472 +}
2473 +.tb-chip {
2474 + background: #eef3ff;
2475 + padding: 5px 10px;
2476 + border-radius: 20px;
2477 + margin: 18px 5px 10px 0px;
2478 + display: inline-block;
2479 + cursor: pointer;
2480 + color: #3730a3;
2481 + font-size: 12px;
2482 + gap: 6px;
2483 +}
2484 +
2485 +.tb-remove {
2486 + margin-left: 6px;
2487 + color: red;
2488 + font-weight: bold;
2489 +}
2490 +
2491 +.tb-chip-close {
2492 + margin-left: 6px;
2493 + cursor: pointer;
2494 +}
2495 +
2496 +@media (max-width: 767px) {
2497 +
2498 + .tb-filter-bar {
2499 + display: flex;
2500 + align-items: center;
2501 + justify-content: flex-end;
2502 + flex-wrap: wrap;
2503 + gap: 8px;
2504 + width: 100%;
2505 + overflow: visible!important;
2506 + }
2507 +
2508 + #tb-advanced-toggle {
2509 + display: inline-flex !important;
2510 + align-items: center;
2511 + justify-content: center;
2512 +
2513 + /* float: left; */
2514 + position: relative;
2515 + margin-top : 20px;
2516 +
2517 + height: 34px;
2518 + min-width: 34px;
2519 + padding: 0 10px;
2520 +
2521 + border: 1px solid #d5d9dd;
2522 + border-radius: 5px;
2523 + background: #fff;
2524 +
2525 + color: #555;
2526 + font: 13px "Helvetica Neue", Helvetica, Arial, sans-serif;
2527 +
2528 + cursor: pointer;
2529 + box-sizing: border-box;
2530 + white-space: nowrap;
2531 + }
2532 +
2533 + #tb-advanced-toggle:hover {
2534 + background: #f5f5f5;
2535 + }
2536 +
2537 + #tb-advanced-panel input,
2538 + #tb-advanced-panel select {
2539 + width: 75%!important;
2540 + padding: 6px 8px!important;
2541 + border: 1px solid #cbd5e1;
2542 + border-radius: 6px;
2543 + }
2544 +
2545 + .wppm-filter-actions span {
2546 + cursor: pointer;
2547 + font-size: 16px;
2548 + text-decoration: underline;
2549 + /* margin-bottom: 7px!important; */
2550 + font: 14px "Helvetica Neue",Arial,Helvetica,sans-serif !important;
2551 + color: #858c96;
2552 + margin-bottom: 20px !important;
2553 + margin-left: 5px;
2554 + }
2555 +}
2556 +
2557 +.wppm-mention {
2558 + display:inline;
2559 + background: #e7f3ff;
2560 + color: #0073aa;
2561 + font-weight: bold;
2562 + padding: 2px 6px;
2563 + border-radius: 4px;
2564 + font-weight: 500;
2565 + margin: 0;
2566 +}
2567 +
2568 +.wppm-mention:hover {
2569 + background: #d0e7ff;
2570 +}
2571 +
2572 +.wppm-mention-me{
2573 + background:#ffcc00 !important;
2574 + color:#000 !important;
2575 + font-weight:700;
2576 +}
2577 +
2578 +#wppm_mention_list {
2579 + position: absolute !important;
2580 + min-width: 220px;
2581 + max-width: 300px;
2582 + max-height: 240px;
2583 + overflow-y: auto;
2584 + background: #fff;
2585 + border: 1px solid #dcdcde;
2586 + border-radius: 8px;
2587 + box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
2588 + padding: 6px 0;
2589 + margin-top: 4px;
2590 + z-index: 99999999999 !important;
2591 + animation: wppmMentionFade .15s ease-in-out;
2592 +}
2593 +
2594 +#wppm_mention_list .mention-item:hover,
2595 +#wppm_mention_list .mention-item.active {
2596 + background: linear-gradient(135deg, #7c3aed, #a855f7);
2597 + color: #fff;
2598 +}
2599 +
2600 +#wppm_mention_list .mention-item {
2601 + padding: 2px 12px;
2602 + cursor: pointer;
2603 + font-size: 14px;
2604 + color: #333;
2605 + border-bottom: 1px solid #eee;
2606 +}
2607 +
2608 +#wppm_mention_list .mention-item:last-child {
2609 + border-bottom: none;
2610 +}
2611 +
2612 +/* Floating Button */
2613 +#wppm_notification_bell{
2614 + position:fixed;
2615 + right:24px;
2616 + bottom:24px;
2617 + width:56px;
2618 + height:56px;
2619 + border-radius:16px;
2620 + background:#ffffff;
2621 + border:1px solid #e5e7eb;
2622 + box-shadow:
2623 + 0 8px 24px rgba(15,23,42,.12),
2624 + 0 2px 8px rgba(15,23,42,.08);
2625 + display:flex;
2626 + justify-content:center;
2627 + align-items:center;
2628 + cursor:pointer;
2629 + z-index:999999999!important;
2630 + transition:all .25s ease;
2631 +}
2632 +
2633 +#wppm_notification_bell:hover{
2634 + transform:translateY(-3px);
2635 + box-shadow:
2636 + 0 15px 35px rgba(15,23,42,.18),
2637 + 0 5px 15px rgba(15,23,42,.12);
2638 +}
2639 +
2640 +#wppm_notification_bell .dashicons{
2641 + color:#6b7280;
2642 + font-size:22px;
2643 + transition:.2s;
2644 +}
2645 +
2646 +#wppm_notification_bell:hover .dashicons{
2647 + color:#7c3aed;
2648 +}
2649 +
2650 +/* Notification Badge */
2651 +.wppm-badge{
2652 + position:absolute;
2653 + top:-6px;
2654 + right:-6px;
2655 + min-width:22px;
2656 + height:22px;
2657 + border-radius:50px;
2658 + background:#ff3366;
2659 + color:#fff;
2660 + display:flex;
2661 + align-items:center;
2662 + justify-content:center;
2663 + font-size:11px;
2664 + font-weight:700;
2665 + border:2px solid #fff;
2666 +}
2667 +
2668 +/* Popup */
2669 +#wppm-notification-container{
2670 + position:fixed;
2671 + right:24px;
2672 + bottom:90px;
2673 + width:360px;
2674 + background:#fff;
2675 + border-radius:18px;
2676 + box-shadow:0 20px 60px rgba(0,0,0,.15);
2677 + overflow:hidden;
2678 + display:none;
2679 + z-index:999999999!important;
2680 +}
2681 +
2682 +/* Item */
2683 +.wppm-notification-item, .wppm-no-notification{
2684 + padding:16px 18px;
2685 + border-bottom:1px solid #f3f4f6;
2686 + cursor:pointer;
2687 + transition:.2s;
2688 +}
2689 +
2690 +.wppm-notification-item:hover{
2691 + background:#f9fafb;
2692 +}
2693 +
2694 +.wppm-notification-message{
2695 + font-size:14px;
2696 + font-weight:600;
2697 + color:#111827;
2698 + margin-bottom:4px;
2699 +}
2700 +
2701 +.wppm-notification-item small{
2702 + color:#9ca3af;
2703 +}
2704 +
2705 +.wppm-pro-btn{
2706 + display:inline-flex;
2707 + align-items:center;
2708 + gap:6px;
2709 + text-decoration:none;
2710 +}
2711 +/* .wppm-pro-btn .dashicons{
2712 + font-size:16px;
2713 + width:16px;
2714 + height:16px;
2715 + line-height:16px;
2716 +} */
2717 +.wppm-pro-btn .wppm-btn-text{
2718 + display:inline-block;
2719 +}
2720 +
2721 +.tb-pro-feature-card{
2722 + position:relative;
2723 + overflow:hidden;
2724 + border-radius:8px;
2725 +}
2726 +
2727 +.tb-pro-content{
2728 + filter:blur(4px);
2729 + pointer-events:none;
2730 + opacity:.7;
2731 +}
2732 +
2733 +.tb-pro-overlay{
2734 + position:absolute;
2735 + inset:0;
2736 + display:flex;
2737 + flex-direction:column;
2738 + justify-content:center;
2739 + align-items:center;
2740 + background:rgba(255,255,255,.5);
2741 + z-index:10;
2742 +}
2743 +
2744 +.tb-pro-badge{
2745 + background:#ff9800;
2746 + color:#fff;
2747 + padding:6px 12px;
2748 + border-radius:4px;
2749 + margin-bottom:10px;
2750 + font-weight:600;
2751 +}
2752 +
2753 +#wppm-archive-project {
2754 + display: inline-flex;
2755 + align-items: center;
2756 + gap: 6px;
2757 +}
2758 +
2759 +#wppm-archive-project svg {
2760 + flex-shrink: 0;
2761 +}
2762 +
2763 +.wppm_create_project_btn {
2764 + display: inline-flex;
2765 + align-items: center;
2766 + gap: 6px;
2767 + padding: 8px 12px;
2768 + border-radius: 4px;
2769 + text-decoration: none;
2770 + cursor: pointer;
2771 +}
2772 +
2773 +.wppm_create_project_btn svg {
2774 + flex-shrink: 0;
1082 2775 }