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 +1677 -33 1.0.56.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,19 +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 - width:100%;
196 - overflow:hidden;
197 - float:left;
198 - display:inline-block;
199 - font-family: Verdana,sans-serif;
200 - font-size: 15px;
201 - line-height: 1.5;
202 -}
203 191 .wppm_sidebar_labels{
204 192 font-size: 12px;
205 193 margin: 10px 0;
206 194 cursor: pointer;
@@ -228,10 +216,37 @@
228 216 margin-top: 10px;
229 217 border: 1px solid #eee !important;
230 218 }
231 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;
232 227 border: 1px solid #eee !important;
233 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 +}
234 249 .wppm-btn{
235 250 padding: 5px 10px;
236 251 border-radius: 20px;
237 252 font-size: 14px;
@@ -237,9 +252,9 @@
237 252 font-size: 14px;
238 253 margin-left:20px;
239 254 background-color: #5067c5;
240 255 color:#ffffff!important;
241 - border: 1px;
256 + border: 1px solid #8a8a8a !important;
242 257 }
243 258 .wppm-btn-cancel{
244 259 padding: 5px 10px;
245 260 border-radius: 14px;
@@ -282,9 +297,9 @@
282 297 #wppm_task_table th{
283 298 border: none !important;
284 299 }
285 300 #wppm_task_table_container{
286 - padding:15px;
301 + padding: 0 15px 15px 15px;
287 302 }
288 303 .wppm_status{
289 304 background-color: aqua;
290 305 border-radius: 30px;
@@ -309,9 +324,9 @@
309 324 text-align: center;
310 325 line-height: 1;
311 326
312 327 }
313 -.avatar{
328 +.wppm_bootstrap .avatar{
314 329 border-radius: 50%;
315 330 border: 2px solid #FFF;
316 331 margin-left: -12px;
317 332 border: 2px solid #FFF;
@@ -389,8 +404,9 @@
389 404 top: 50px;
390 405 right: 50px;
391 406 font-size: 15px;
392 407 font-weight: bold;
408 + z-index: 10000000000000;
393 409 }
394 410 #wppm_add_new_project{
395 411 margin:20px;
396 412 background-color: #FFFFFF;
@@ -436,12 +452,9 @@
436 452 #wppm_apply_filter{
437 453 background-color:#306EFF;
438 454 margin-bottom:2px;
439 455 }
440 -#wppm_project_table{
441 - margin: 15px;
442 - overflow-x: auto;
443 -}
456 +
444 457 .wppm_label{
445 458 font-size: 12px;
446 459 font-weight: 600;
447 460 color: #9c9c9c;
@@ -458,11 +471,11 @@
458 471 border-radius: 20px;
459 472 font: 12px "Helvetica Neue",Arial,Helvetica,sans-serif;
460 473 }
461 474 #wppm_project_search_filter_img, .wppm_task_search_filter_img{
462 - position: absolute;
475 + position: relative !important;
463 476 top: 10px;
464 - left: 18px;
477 + left: 30px;
465 478 }
466 479 .wppm_add_new_task_img, .wppm_task_list_image{
467 480 padding-right: 5px;
468 481 padding-bottom: 3px;
@@ -487,10 +500,17 @@
487 500 list-style-type: none!important;
488 501 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
489 502 }
490 503 #wppm_task_search{
504 + flex-shrink: 0;
505 + white-space: nowrap;
491 506 width:40%;
492 507 margin-top: 15px;
508 + display: flex;
509 + /* align-items: center;
510 + gap: 8px;
511 + align-items: center; */
512 + flex-wrap: nowrap;
493 513 }
494 514 #wppm_task_search svg{
495 515 width: 16px;
496 516 height: 16px;
@@ -501,9 +521,13 @@
501 521 }
502 522 #wppm_task_search_filter{
503 523 padding: 0 30px;
504 524 border-radius: 20px;
505 -}
525 + width: auto;
526 + flex: 1;
527 + min-width: 150px;
528 + min-height: 30px!important;
529 +}
506 530 #wppm_more_filter_option div{
507 531 display: inline-block;
508 532 }
509 533 #wppm_heading_inline svg{
@@ -531,9 +555,9 @@
531 555 .wppm_task_list{
532 556 flex-basis: 50%;
533 557 }
534 558 }
535 -.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{
536 560 font-family: "OpenSans-Semibold","Helvetica Neue",Arial,Helvetica,sans-serif;
537 561 font-size: 14px;
538 562 }
539 563 .wppm_card_body{
@@ -682,8 +706,37 @@
682 706 background-color: #FFFFFF;
683 707 margin: 15px;
684 708 border: 1px solid #eee !important;
685 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 +
686 739 .wppm_progress_bar_container{
687 740 margin-bottom: 6px;
688 741 margin-top: 5px;
689 742 position: relative;
@@ -755,8 +808,19 @@
755 808 color: #858c96;
756 809 margin-bottom: 5px;
757 810 margin-top: 5px;
758 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 +}
759 823 #wppm_list_view_btn{
760 824 border: 1px solid #ccc;
761 825 padding: 5px;
762 826 background-color: #FFFFFF;
@@ -761,13 +825,11 @@
761 825 padding: 5px;
762 826 background-color: #FFFFFF;
763 827 float: right;
764 828 border-radius: 4px;
765 - margin-right: 10px;
766 829 cursor: pointer;
767 830 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
768 831 color: #858c96;
769 - margin-top: 5px;
770 832 }
771 833 #wppm_select_user_role{
772 834 margin: 10px 10px 10px 0px;
773 835 }
@@ -803,8 +865,12 @@
803 865 #wppm_comment_btn{
804 866 display:none;
805 867 padding: 10px;
806 868 }
869 +#wppm_proj_comment_btn{
870 + display:none;
871 + padding: 10px;
872 +}
807 873 #wppm_activity_container{
808 874 background-color:#ffffff;
809 875 margin:15px;
810 876 border: 1px solid #eee !important;
@@ -811,8 +877,11 @@
811 877 }
812 878 .wppm_task_discussion{
813 879 font: 18px "Helvetica Neue",Helvetica,Arial,sans-serif;
814 880 }
881 +.wppm_proj_discussion{
882 + font: 18px "Helvetica Neue",Helvetica,Arial,sans-serif;
883 +}
815 884 .wppm_delete_checklist{
816 885 color:#b73232 !important;
817 886 font: 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
818 887 border-bottom: 1px dashed;
@@ -849,8 +918,19 @@
849 918 color:#eee;
850 919 margin-top: 10px;
851 920 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
852 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 +}
853 933 .wppm_attachment_title{
854 934 font: 15px "Helvetica Neue",Helvetica,Arial,sans-serif;
855 935 }
856 936 .wppm_comment_date{
@@ -880,8 +960,29 @@
880 960 margin-left: 5px;
881 961 margin-top:5px;
882 962 font: 13px "Helvetica Neue",Helvetica,Arial,sans-serif;
883 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 +}
884 985 .wppm_thread_messege{
885 986 font-size: 14px;
886 987 font-weight: 400;
887 988 color: #4e4e4e;
@@ -897,17 +998,28 @@
897 998 }
898 999 .wppm_task_label,.wppm_checklist_label,.wppm_project_label{
899 1000 font: 18px "Helvetica Neue",Helvetica,Arial,sans-serif !important;
900 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 +}
901 1014 .widget_divider{
902 - margin-top: 4px !important;
903 - margin-bottom: 6px !important;
1015 + margin:4px 0 6px 0px !important;
904 1016 }
905 1017 .wppm_individual_task_widget{
906 1018 margin-top: 15px!important;
907 1019 }
908 1020 .select2-container{
909 - z-index:999999999999!important;
1021 + z-index:999999999!important;
910 1022 width:100%!important;
911 1023 }
912 1024 .flatpickr-calendar{
913 1025 z-index:999999999999!important;
@@ -925,9 +1037,9 @@
925 1037 .wppm_edit_task_details_widget, .wppm_thread_action, .wppm_edit_project_details_widget{
926 1038 float:right;
927 1039 cursor:pointer;
928 1040 }
929 -.wppm_add_new_task_btn, #wppm_task_list_btn,#wppm_delete_btn,#wppm_delete_task_btn,#wppm_clone_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{
930 1042 cursor: pointer;
931 1043 }
932 1044 #wppm_project_details_container{
933 1045 border: 1px solid #eee;
@@ -936,17 +1048,18 @@
936 1048 margin-bottom: 12px;
937 1049 }
938 1050 #wppm_view_project_task{
939 1051 background-color: #ffffff;
1052 + margin-top: 10px;
940 1053 }
941 -#wppm_project_tasks,.wppm_add_new_project_btn{
1054 +#wppm_project_tasks,.wppm_add_new_project_btn,#wppm_proj_overview_btn{
942 1055 cursor:pointer;
943 1056 }
944 -#wppm_add_new_project_btn{
1057 +#wppm_add_new_project_btn,#wppm_proj_overview_btn,#wppm_archieve_project_btn{
945 1058 margin-bottom: 10px;
946 1059 }
947 1060 #wppm_delete_project_icon, #wppm_add_new_project_icon, #wppm_project_list_icon, #wppm_task_list_icon{
948 - margin-top: -3px;
1061 + margin-top: -7px;
949 1062 }
950 1063 .wppm_add_new_icon{
951 1064 float: right!important;
952 1065 cursor:pointer;
@@ -1128,4 +1241,1535 @@
1128 1241
1129 1242 .wppm_bootstrap .purchase_addon{
1130 1243 padding-right: 5px;
1131 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;
2775 +}