PluginProbe
Forumax – AI Powered Advanced Community Forum Plugin / 1.4.1
Forumax – AI Powered Advanced Community Forum Plugin v1.4.1
2.4.4 2.4.3 2.4.2 2.4.1 2.4.0 trunk 1.0.8 1.1.0 1.2.1 1.2.2 1.2.3 1.2.4 1.2.5 1.2.6 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.4.0 1.4.1 2.0.0 2.1.0 All 29 releases
bbp-core / assets / admin / css / admin-ui-style.css

admin-ui-style.css in Forumax – AI Powered Advanced Community Forum Plugin 1.4.1, at assets/admin/css/admin-ui-style.css

2,100 lines 42.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Convert font-size from px to rem with px fallback
3 *
4 * @param $size - the value in pixel you want to convert
5 *
6 * e.g. p font-size: fs-rem(12px);
7 * e.g. p {@include fontSize(12px);}
8 *
9 */
10 /*--------------------------------------
11 - Base
12 ----------------------------------------*/
13 /**
14 * Convert font-size from px to rem with px fallback
15 *
16 * @param $size - the value in pixel you want to convert
17 *
18 * e.g. p {@include fontSize(12px);}
19 *
20 */
21 @import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap");
22 .col {
23 position: relative;
24 width: 100%;
25 padding-right: 15px;
26 padding-left: 15px;
27 }
28
29 /*--------------------------------------
30 - Utilities
31 ----------------------------------------*/
32 :root {
33 --container-width: 100%;
34 --container-sm: 33.75rem;
35 --container-md: 45rem;
36 --container-lg: 60rem;
37 --container-xl: 71.25rem;
38 --container-xxl: 90rem;
39 --container-fluid: 100%;
40 --gutter-x: 1.875rem;
41 --gutter-3: 0.125rem;
42 --gutter-5: 0.225rem;
43 --gutter-10: 0.625rem;
44 --gutter-15: 0.9375rem;
45 --gutter-20: 1.25rem;
46 --gutter-25: 1.5625rem;
47 --gutter-30: 1.875rem;
48 --gutter-32: 2rem;
49 --gutter-35: 2.1875rem;
50 --gutter-40: 2.5rem;
51 --gutter-45: 2.8125rem;
52 --gutter-50: 3.125rem;
53 --ff-roboto: "Roboto", sans-serif;
54 --fw-100: 100;
55 --fw-200: 200;
56 --fw-300: 300;
57 --fw-400: 400;
58 --fw-500: 500;
59 --fw-600: 600;
60 --fw-700: 700;
61 --fw-800: 800;
62 --fw-900: 900;
63 --fs-12: 0.75rem;
64 --fs-13: 0.8125rem;
65 --fs-14: 0.875rem;
66 --fs-15: 0.9375rem;
67 --fs-16: 1rem;
68 --fs-17: 1.0625rem;
69 --fs-18: 1.125rem;
70 --fs-20: 1.25rem;
71 --fs-21: 1.3125rem;
72 --fs-24: 1.5rem;
73 --fs-25: 1.5625rem;
74 --fs-28: 1.75rem;
75 --fs-30: 1.875rem;
76 --fs-32: 2rem;
77 --fs-35: 2.1875rem;
78 --fs-40: 2.5rem;
79 --fs-45: 2.8125rem;
80 --hr-bg: var(--clr-black);
81 --hr-width: 100%;
82 --hr-height: 0.3125rem;
83 --hr-gutter-y: 1.875rem;
84 --hr-gutter-x: 0;
85 --hr-padding: 0;
86 --hr-radius: 0;
87 --m: 0;
88 --mt: 0;
89 --mr: 0;
90 --mb: 0;
91 --ml: 0;
92 --mx: 0;
93 --my: 0;
94 --m-auto: auto;
95 --my-auto: auto;
96 --mx-auto: auto;
97 --p: 0;
98 --pt: 0;
99 --pr: 0;
100 --pb: 0;
101 --pl: 0;
102 --px: 0;
103 --py: 0;
104 --p-auto: auto;
105 --py-auto: auto;
106 --px-auto: auto;
107 --border-width: 0.0625rem;
108 --border-style: solid;
109 --border-clr: transparent;
110 --border: var(--border-width) var(--border-style) var(--border-clr);
111 --border-t: var(--border-width) var(--border-style) var(--border-clr);
112 --border-r: var(--border-width) var(--border-style) var(--border-clr);
113 --border-b: var(--border-width) var(--border-style) var(--border-clr);
114 --border-l: var(--border-width) var(--border-style) var(--border-clr);
115 --border-x: var(--border-width) var(--border-style) var(--border-clr);
116 --border-y: var(--border-width) var(--border-style) var(--border-clr);
117 --radius: 0;
118 --radius-t: 0;
119 --radius-r: 0;
120 --radius-b: 0;
121 --radius-l: 0;
122 --radius-full: 50%;
123 --btn-bg: transparent;
124 --btn-clr: inherit;
125 --btn-ff: var(--ff-roboto);
126 --btn-fs: var(--fs-15);
127 --btn-py: 0.625rem;
128 --btn-px: 1.125rem;
129 --btn-my: var(--my);
130 --btn-mx: var(--mx);
131 --clr-black: #000;
132 --clr-black-100: #0D0E2B;
133 --clr-dark: #252733;
134 --clr-text: #575766;
135 --clr-text-light: #9199A1;
136 --clr-white: #fff;
137 --clr-blue: #4C4CF1;
138 --clr-orange: #ff5a46;
139 --clr-yellow: #FFE132;
140 --black_50: #ebebeb;
141 --black_100: #d6d9dc;
142 --black_150: #c8ccd0;
143 --black_200: #bbc0c4;
144 --black_300: #9fa6ad;
145 --black_350: #9199a1;
146 --black_400: #848d95;
147 --black_500: #6a737c;
148 --black_600: #535a60;
149 --black_700: #3c4146;
150 --black_750: #2f3337;
151 --black_800: #242729;
152 --black_900: #0c0d0e;
153 }
154
155 /* Box sizing rules */
156 *,
157 *::before,
158 *::after {
159 box-sizing: border-box;
160 }
161
162 /* Remove default margin */
163 body,
164 h1,
165 h2,
166 h3,
167 h4,
168 p,
169 figure,
170 blockquote,
171 dl,
172 dd {
173 margin: 0;
174 }
175
176 /* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
177 ul[role=list],
178 ol[role=list] {
179 list-style: none;
180 }
181
182 /* Set core root defaults */
183 html:focus-within {
184 scroll-behavior: smooth;
185 }
186
187 /* Set core body defaults */
188 body {
189 font-family: var(--ff-roboto);
190 font-weight: 400;
191 font-size: var(--fs-15);
192 line-height: 1.5625rem;
193 text-rendering: optimizeSpeed;
194 color: var(--clr-black);
195 }
196
197 /* A elements that don't have a class get default styles */
198 a:not([class]) {
199 text-decoration-skip-ink: auto;
200 }
201
202 /* Make images easier to work with */
203 img,
204 picture {
205 max-width: 100%;
206 display: block;
207 }
208
209 /* Inherit fonts for inputs and buttons */
210 input,
211 button,
212 textarea,
213 select {
214 font: inherit;
215 }
216
217 button {
218 border: none;
219 background: transparent;
220 outline: none;
221 cursor: pointer;
222 }
223
224 .hr {
225 background: var(--clr-black-200);
226 width: 100%;
227 height: 1px;
228 margin: 50px 0;
229 padding: 0;
230 border: none;
231 border-radius: 0;
232 opacity: 1;
233 }
234
235 /* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
236 @media (prefers-reduced-motion: reduce) {
237 html:focus-within {
238 scroll-behavior: auto;
239 }
240 *,
241 *::before,
242 *::after {
243 animation-duration: 0.01ms !important;
244 animation-iteration-count: 1 !important;
245 transition-duration: 0.01ms !important;
246 scroll-behavior: auto !important;
247 }
248 }
249 .fill-current {
250 fill: currentColor;
251 }
252
253 .scrollToTop {
254 width: 30px;
255 height: 30px;
256 line-height: 30px;
257 text-align: center;
258 color: var(--clr-blue);
259 font-size: 25px;
260 background: transparent;
261 position: fixed;
262 right: 20px;
263 bottom: 50px;
264 display: none;
265 z-index: 99999;
266 border-radius: 50%;
267 }
268 @media screen and (min-width: 576px) {
269 .scrollToTop {
270 width: 50px;
271 height: 50px;
272 line-height: 50px;
273 }
274 }
275 .scrollToTop:hover {
276 color: var(--clr-blue);
277 }
278
279 .no-scroll-y {
280 overflow-y: hidden;
281 }
282
283 .text-blue {
284 color: var(--clr-blue);
285 }
286
287 .green {
288 color: #27ae60;
289 }
290
291 .red {
292 color: #e74c3c;
293 }
294
295 h1,
296 h2,
297 h3,
298 h4,
299 h5,
300 h6 {
301 font-family: var(--ff-roboto);
302 color: #14183E;
303 line-height: 1.4;
304 }
305
306 h1 a,
307 h2 a,
308 h3 a,
309 h4 a,
310 h5 a,
311 h6 a {
312 color: inherit;
313 }
314
315 h1 {
316 font-size: 2rem;
317 }
318 @media screen and (min-width: 20rem) {
319 h1 {
320 font-size: calc(2rem + 1.75 * (100vw - 20rem) / 55);
321 }
322 }
323 @media screen and (min-width: 75rem) {
324 h1 {
325 font-size: 3.75rem;
326 }
327 }
328
329 h2 {
330 font-size: 2rem;
331 }
332 @media screen and (min-width: 20rem) {
333 h2 {
334 font-size: calc(2rem + 1 * (100vw - 20rem) / 55);
335 }
336 }
337 @media screen and (min-width: 75rem) {
338 h2 {
339 font-size: 3rem;
340 }
341 }
342
343 h3 {
344 font-size: 1.375rem;
345 }
346 @media screen and (min-width: 20rem) {
347 h3 {
348 font-size: calc(1.375rem + 0.125 * (100vw - 20rem) / 55);
349 }
350 }
351 @media screen and (min-width: 75rem) {
352 h3 {
353 font-size: 1.5rem;
354 }
355 }
356
357 h4 {
358 font-size: 1rem;
359 }
360 @media screen and (min-width: 20rem) {
361 h4 {
362 font-size: calc(1rem + 0.125 * (100vw - 20rem) / 55);
363 }
364 }
365 @media screen and (min-width: 75rem) {
366 h4 {
367 font-size: 1.125rem;
368 }
369 }
370
371 ul {
372 margin: 0;
373 padding: 0;
374 }
375
376 li {
377 list-style: none;
378 }
379
380 hr {
381 background: #c2cfff;
382 width: 50px;
383 height: 3px;
384 margin: 35px 0;
385 padding: 0;
386 border: none;
387 }
388 @media screen and (min-width: 768px) {
389 hr {
390 margin-top: 25px;
391 margin-bottom: 25px;
392 }
393 }
394
395 p {
396 margin: 0;
397 }
398
399 label {
400 color: var(--clr-black);
401 cursor: pointer;
402 font-size: 14px;
403 font-weight: 400;
404 }
405
406 /*Home 3 Default Font Family*/
407 .home-3 {
408 font-size: var(--fs-15);
409 font-weight: var(--fw-400);
410 color: var(--clr-black);
411 font-family: var(--font-quicksand);
412 }
413
414 /*Home 3 Default Font Family*/
415 .home-4 {
416 font-size: var(--fs-15);
417 font-weight: var(--fw-400);
418 font-family: var(--font-arimo);
419 }
420
421 .alignment-center {
422 align-items: center;
423 }
424
425 .justify-content-between {
426 justify-content: space-between;
427 }
428
429 .justify-content-end {
430 justify-content: end;
431 }
432
433 /*--------------------------------------
434 - Color
435 ----------------------------------------*/
436 .color {
437 color: var(--clr-black);
438 }
439
440 .text-black {
441 color: var(--clr-black) !important;
442 }
443
444 .bg-black {
445 background: var(--clr-black);
446 }
447
448 .text-white {
449 color: var(--clr-white) !important;
450 }
451
452 .bg-white {
453 background: var(--clr-white);
454 }
455
456 .d-block {
457 display: block;
458 }
459
460 .d-inline-block {
461 display: inline-block;
462 }
463
464 .d-grid {
465 display: grid;
466 }
467
468 .d-flex {
469 display: flex;
470 }
471
472 .flex-row {
473 flex-direction: row;
474 }
475
476 .flex-reverse {
477 flex-direction: row-reverse;
478 }
479
480 .flex-column {
481 flex-direction: column;
482 }
483
484 .flex-column-reverse {
485 flex-direction: column-reverse;
486 }
487
488 /*--
489 - Font Famaly
490 -----------------------------------------*/
491 /*--
492 - Font weight
493 -----------------------------------------*/
494 .font-regular {
495 font-weight: var(--fw-400);
496 }
497
498 .font-medium {
499 font-weight: var(--fw-500);
500 }
501
502 .font-semi-bold {
503 font-weight: var(--fw-600);
504 }
505
506 .font-bold {
507 font-weight: var(--fw-700);
508 }
509
510 .font-black {
511 font-weight: var(--fw-900);
512 }
513
514 /*--
515 - Font Size
516 -----------------------------------------*/
517 /*--
518 - Margin
519 -------------------------------------------*/
520 .mt-n3 {
521 margin-top: -0.4375rem;
522 }
523
524 .mt-n4 {
525 margin-top: -0.75rem;
526 }
527
528 .m-auto {
529 margin: auto;
530 }
531
532 .mx-auto {
533 margin-left: auto;
534 margin-right: auto;
535 }
536
537 .mt-0 {
538 margin-top: 0;
539 }
540
541 .mt-73 {
542 margin-top: 4.5625rem;
543 }
544
545 .mb-8 {
546 margin-bottom: 2rem;
547 }
548
549 .mr-1 {
550 margin-right: 0.25rem;
551 }
552
553 @media (min-width: 768px) {
554 .mt-md-n4 {
555 margin-top: -0.75rem;
556 }
557 }
558
559 .mt-40 {
560 margin-top: 40px;
561 }
562
563 /*---
564 -- Padding
565 -------------------------------------------*/
566 /*----------------------------------------*/
567 /* Component CSS
568 /*----------------------------------------*/
569 .easydocs-accordion {
570 position: relative;
571 padding: 0;
572 list-style: none;
573 margin: 10px 0 20px;
574 background: var(--clr-white);
575 border-radius: 5px;
576 overflow: hidden;
577 border: 1px solid #edeae9;
578 }
579 .easydocs-accordion .acc_active .accordion-title {
580 border-bottom: 1px solid #edeae9;
581 }
582 .easydocs-accordion .acc_active .accordion-title::before {
583 transform: translateY(-50%) rotate(90deg);
584 }
585 .easydocs-accordion .ui-state-highlight {
586 height: 50px;
587 background: #f9f9f9;
588 border-top: 1px solid #afabac;
589 border-bottom: 1px solid #afabac;
590 }
591
592 .easydocs-accordion-item {
593 width: 100%;
594 margin: 0;
595 }
596 .easydocs-accordion-item + .easydocs-accordion-item {
597 border-top: 1px solid #edeae9;
598 }
599 .easydocs-accordion-item.is-accordion-open:last-child .accordion-title {
600 border-bottom-left-radius: 0;
601 border-bottom-right-radius: 0;
602 }
603 .easydocs-accordion-item.child-one .child-right-content {
604 align-items: center;
605 }
606 .easydocs-accordion-item.child-one .child-right-content .progress-text a {
607 font-size: 14px;
608 color: var(--clr-text-light);
609 margin-right: var(--gutter-30);
610 text-decoration: none;
611 }
612 .easydocs-accordion-item.child-one .accordion-title::before {
613 transform: translateY(-50%);
614 }
615 .easydocs-accordion-item.child-one.acc_active .accordion-title::before {
616 transform: translateY(-50%) rotate(90deg);
617 }
618 .easydocs-accordion-item.child-one a {
619 padding: 0;
620 }
621 .easydocs-accordion-item.child-one .accordion-title.has-child a.section-last-label {
622 margin-left: 19px;
623 }
624 .easydocs-accordion-item.child-one .accordion-title.has-child::before {
625 left: 52px;
626 }
627 .easydocs-accordion-item.child-one .nesting-accordion a.child-last-label {
628 margin: 10px 50px 10px 70px;
629 }
630
631 .accordion-title {
632 position: relative;
633 background: #fff;
634 padding: 15px 30px 15px 30px;
635 cursor: pointer;
636 display: flex;
637 align-items: center;
638 justify-content: space-between;
639 }
640 @media (max-width: 1440px) {
641 .accordion-title {
642 padding: 12px 20px 12px 34px;
643 }
644 }
645 .accordion-title.ez-section-title h4 {
646 font-weight: var(--fw-500);
647 }
648 @media (max-width: 1440px) {
649 .accordion-title.ez-section-title::before {
650 left: 20px;
651 }
652 }
653 .accordion-title.has-child::before {
654 content: "";
655 top: 50%;
656 left: 32px;
657 position: absolute;
658 width: 0;
659 height: 0;
660 border-style: solid;
661 border-width: 5px 0 5px 6px;
662 border-color: transparent transparent transparent var(--clr-text);
663 display: block;
664 transform: translateY(-50%);
665 -webkit-transition: 0.3s ease-out;
666 transition: 0.3s ease-out;
667 }
668 @media (max-width: 1440px) {
669 .accordion-title.has-child::before {
670 left: 20px;
671 }
672 }
673 .accordion-title .count {
674 margin-left: 5px;
675 color: #fff;
676 background: var(--black_200);
677 }
678 .accordion-title ul.actions {
679 display: flex;
680 }
681 .accordion-title ul.actions li {
682 margin: 0;
683 }
684 .accordion-title:hover {
685 background: #f9f9f9;
686 }
687 .accordion-title:hover h4 {
688 color: var(--clr-dark);
689 }
690 .accordion-title:hover ul.actions {
691 display: flex;
692 }
693 .accordion-title:hover ul.actions li {
694 margin: 0;
695 line-height: normal;
696 }
697 .accordion-title h4 {
698 font-size: var(--fs-14);
699 color: var(--clr-text);
700 display: flex;
701 align-items: center;
702 font-weight: normal;
703 }
704 .accordion-title h4 a {
705 text-decoration: none;
706 }
707 .accordion-title .accordion-category-icon {
708 width: 1.25rem;
709 height: 1.25rem;
710 line-height: 1.25rem;
711 border-radius: 50%;
712 text-align: center;
713 margin-left: 5px;
714 }
715 .accordion-title .light-green {
716 background: rgba(45, 178, 45, 0.1);
717 --category-icon: #2db22d;
718 }
719 .accordion-title .light-orange {
720 background: rgba(204, 128, 51, 0.1);
721 --category-icon: #cc8033;
722 }
723 .accordion-title .light-blue {
724 background: rgba(2, 117, 216, 0.1);
725 --category-icon: var(--clr-blue);
726 }
727 .accordion-title .light-gray {
728 background: rgba(66, 66, 66, 0.1);
729 --category-icon: #424242;
730 }
731 .accordion-title ul.actions {
732 display: none;
733 align-items: center;
734 gap: var(--gutter-10);
735 --section-icon: #9199a1;
736 margin-left: 15px;
737 }
738 .accordion-title ul.actions .duplicate {
739 order: 1;
740 }
741 .accordion-title ul.actions .delete {
742 order: 2;
743 }
744 .accordion-title ul.actions li:hover {
745 --section-icon: var(--clr-dark);
746 }
747 .accordion-title ul.actions li a {
748 text-decoration: none;
749 }
750 .accordion-title ul.actions li a .dashicons {
751 color: var(--black_150);
752 font-size: 18px;
753 padding-top: 3px;
754 }
755 .accordion-title ul.actions li a .dashicons:hover {
756 color: var(--black_400);
757 }
758 .accordion-title ul.actions li a img {
759 opacity: 0.5;
760 }
761 .accordion-title ul.actions li a img:hover {
762 opacity: 1;
763 }
764 .accordion-title ul.actions li a.st-pro-notice .dashicons {
765 color: #f1bd6c;
766 }
767 .accordion-title .left-content {
768 display: flex;
769 align-items: center;
770 }
771 .accordion-title .left-content .topic-status {
772 width: 30px;
773 height: 20px;
774 text-align: left;
775 margin-right: 5px;
776 }
777 .accordion-title .left-content .bbpc-author-name {
778 font-size: 14px;
779 color: var(--clr-text-light);
780 }
781 .accordion-title .left-content .bbpc-author-name a {
782 text-decoration: none;
783 }
784 .accordion-title .right-content {
785 display: flex;
786 align-items: center;
787 }
788 .accordion-title .right-content .progress-text a {
789 font-size: 14px;
790 color: var(--clr-text-light);
791 margin-left: var(--gutter-30);
792 text-decoration: none;
793 }
794
795 .easydocs-accordion-body {
796 background: var(--clr-white);
797 color: var(--clr-text);
798 font-size: var(--fs-14);
799 padding: 10px 50px 10px 50px;
800 }
801
802 .nesting-accordion {
803 padding: 0;
804 }
805 .nesting-accordion a {
806 text-decoration: none;
807 }
808
809 .child-docs-wrap {
810 border-bottom: 1px solid #edeae9;
811 }
812 .child-docs-wrap:hover {
813 background-color: #f9f9f9;
814 }
815 .child-docs-wrap .child-right-content {
816 visibility: hidden;
817 }
818 .child-docs-wrap:hover .child-right-content {
819 visibility: visible;
820 }
821
822 a.child-delete,
823 a.child-view-link {
824 padding-left: 5px !important;
825 padding-right: 5px !important;
826 }
827 a.child-delete img,
828 a.child-view-link img {
829 opacity: 0.5;
830 }
831 a.child-delete img:hover,
832 a.child-view-link img:hover {
833 opacity: 1;
834 }
835
836 a.child-delete {
837 padding-right: 28px !important;
838 }
839
840 /* replies count */
841 .count-replies span {
842 position: absolute;
843 top: 1px;
844 left: 8px;
845 color: #fff;
846 font-size: 0.55em;
847 }
848
849 .bbpc-reply-count {
850 box-sizing: border-box;
851 display: block;
852 padding: 0;
853 min-width: 22px;
854 height: 2em;
855 border-radius: 5px;
856 background-color: var(--black_200);
857 color: #fff;
858 font-size: 10px;
859 line-height: 1.9090909;
860 text-align: center;
861 margin-left: 10px;
862 }
863 .bbpc-reply-count:after {
864 content: "";
865 display: block;
866 margin-left: 11px;
867 width: 0;
868 height: 0;
869 border-top: 5px solid var(--black_200);
870 border-right: 5px solid transparent;
871 }
872 .bbpc-reply-count.bbpc-published-replies {
873 background-color: #cc8033;
874 }
875 .bbpc-reply-count.bbpc-published-replies:after {
876 border-top: 5px solid #cc8033;
877 }
878
879 .bbpc-pending-replies:hover, .bbpc-pending-replies:active {
880 background: #0275d8;
881 }
882 .bbpc-pending-replies:hover:after, .bbpc-pending-replies:active:after {
883 border-top-color: #0275d8;
884 }
885
886 .bbpc-nested-replies {
887 margin-left: 30px;
888 display: none;
889 }
890
891 .ez-section-title div:has(.active) .bbpc-pending-replies {
892 background: #0275d8;
893 }
894 .ez-section-title div:has(.active) .bbpc-pending-replies:after {
895 border-top-color: #0275d8;
896 }
897
898 .bbpc-reply-wrap {
899 background-color: #fff;
900 padding: 8px 0;
901 margin-left: 20px;
902 }
903 .bbpc-reply-wrap a {
904 width: 22px;
905 height: 22px;
906 display: inline-block;
907 }
908 .bbpc-reply-wrap:hover {
909 background: #f9f9f9;
910 }
911 .bbpc-reply-wrap:not(:last-child) {
912 border-bottom: 1px solid #edeae9;
913 }
914
915 .bbpc-admin-pagination {
916 margin-bottom: 15px;
917 }
918 .bbpc-admin-pagination button {
919 border: 1px solid;
920 min-width: 35px;
921 border-radius: 4px;
922 background: rgba(0, 0, 0, 0.8);
923 color: white;
924 }
925 .bbpc-admin-pagination button:hover, .bbpc-admin-pagination button.mixitup-control-active {
926 background: var(--clr-blue);
927 }
928
929 .ezd-btn {
930 --btn-fs: var(--fs-16);
931 --btn-ff: var(--ff-roboto);
932 --btn-py: 0.5rem;
933 --btn-px: 1.6rem;
934 position: relative;
935 font-family: var(--btn-ff);
936 font-size: var(--btn-fs);
937 font-weight: var(--fw-400);
938 line-height: 1.5;
939 background: var(--btn-bg);
940 color: var(--btn-clr);
941 border: var(--btn-bw, var(--border-width)) var(--btn-bs, var(--border-style)) var(--btn-bc, var(--btn-bg));
942 text-transform: capitalize;
943 text-decoration: none;
944 border-radius: var(--btn-radius, var(--radius));
945 padding: var(--btn-py) var(--btn-px);
946 margin: var(--btn-mx) var(--btn-mx);
947 display: inline-block;
948 overflow: hidden;
949 text-align: center;
950 cursor: pointer;
951 -webkit-transition: 0.3s ease-out;
952 transition: 0.3s ease-out;
953 }
954 .ezd-btn-sm {
955 --btn-py: 0.3125rem;
956 }
957 .ezd-btn-lg {
958 --btn-py: 0.625rem;
959 }
960 .ezd-btn-xl {
961 --btn-py: 0.75rem;
962 }
963 .ezd-btn-none {
964 --btn-radius: 0;
965 }
966 .ezd-btn-round {
967 --btn-radius: 0.375rem;
968 }
969 .ezd-btn-rounded {
970 --btn-radius: 1.875rem;
971 }
972 .ezd-btn-round-full {
973 --btn-radius: 50%;
974 }
975 .ezd-btn-disabled {
976 pointer-events: none;
977 opacity: 0.65;
978 }
979 .ezd-btn-black-light {
980 --btn-bg: rgba(13, 14, 43, 0.1);
981 --btn-clr: #0D0E2B;
982 --btn-bc: transparent;
983 }
984 .ezd-btn-black-light:hover {
985 --btn-clr: #0D0E2B;
986 --btn-bg: rgba(13, 14, 43, 0.1);
987 --btn-bc: #0D0E2B;
988 }
989 .ezd-btn-black-light:focus {
990 outline: 0;
991 box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
992 }
993 .ezd-btn-green-light {
994 --btn-bg: rgba(45, 178, 45, 0.1);
995 --btn-clr: #2DB22D;
996 --btn-bc: transparent;
997 }
998 .ezd-btn-green-light:hover {
999 --btn-clr: #2DB22D;
1000 --btn-bg: rgba(45, 178, 45, 0.1);
1001 --btn-bc: #2DB22D;
1002 }
1003 .ezd-btn-green-light:focus {
1004 outline: 0;
1005 box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
1006 }
1007 .ezd-btn-blue-light {
1008 --btn-bg: rgba(2, 117, 216, 0.1);
1009 --btn-clr: #0275D8;
1010 --btn-bc: transparent;
1011 }
1012 .ezd-btn-blue-light:hover {
1013 --btn-clr: #0275D8;
1014 --btn-bg: rgba(2, 117, 216, 0.1);
1015 --btn-bc: #0275D8;
1016 }
1017 .ezd-btn-blue-light:focus {
1018 outline: 0;
1019 box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
1020 }
1021 .ezd-btn-orange-light {
1022 --btn-bg: rgba(204, 128, 51, 0.1);
1023 --btn-clr: #CC8033;
1024 --btn-bc: transparent;
1025 }
1026 .ezd-btn-orange-light:hover {
1027 --btn-clr: #CC8033;
1028 --btn-bg: rgba(204, 128, 51, 0.1);
1029 --btn-bc: #CC8033;
1030 }
1031 .ezd-btn-orange-light:focus {
1032 outline: 0;
1033 box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
1034 }
1035 .ezd-btn-gray-light {
1036 --btn-bg: rgba(66, 66, 66, 0.1);
1037 --btn-clr: #424242;
1038 --btn-bc: transparent;
1039 }
1040 .ezd-btn-gray-light:hover {
1041 --btn-clr: #424242;
1042 --btn-bg: rgba(66, 66, 66, 0.1);
1043 --btn-bc: #424242;
1044 }
1045 .ezd-btn-gray-light:focus {
1046 outline: 0;
1047 box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
1048 }
1049 .ezd-btn-blue {
1050 --btn-bg: var(--clr-blue);
1051 --btn-clr: var(--clr-white);
1052 --btn-bc: var(--clr-blue);
1053 }
1054 .ezd-btn-blue:hover {
1055 --btn-clr: var(--clr-blue);
1056 --btn-bg: transparent;
1057 --btn-bc: var(--clr-blue);
1058 }
1059 .ezd-btn-blue:focus {
1060 outline: 0;
1061 box-shadow: 0 0 0 0.4rem rgba(65, 65, 230, 0.5);
1062 }
1063 .ezd-btn-outline-blue {
1064 --btn-clr: #4141E6;
1065 --btn-bc: #4141E6;
1066 }
1067 .ezd-btn-outline-blue:hover {
1068 --btn-clr: var(--clr-white);
1069 --btn-bg: #4141E6;
1070 --btn-bc: #4141E6;
1071 }
1072 .ezd-btn-outline-blue:focus {
1073 outline: 0;
1074 box-shadow: 0 0 0 0.4rem rgba(65, 65, 230, 0.5);
1075 }
1076 .ezd-btn-white {
1077 --btn-bg: var(--clr-white);
1078 --btn-clr: var(--clr-white);
1079 --btn-bc: var(--clr-white);
1080 }
1081 .ezd-btn-white:hover {
1082 --btn-clr: var(--clr-white);
1083 --btn-bg: transparent;
1084 --btn-bc: var(--clr-white);
1085 }
1086 .ezd-btn-white:focus {
1087 outline: 0;
1088 box-shadow: 0 0 0 0.4rem rgba(255, 255, 255, 0.5);
1089 }
1090 .ezd-btn-outline-white {
1091 --btn-clr: var(--clr-white);
1092 --btn-bc: var(--clr-white);
1093 }
1094 .ezd-btn-outline-white:hover {
1095 --btn-clr: var(--clr-black);
1096 --btn-bg: var(--clr-white);
1097 --btn-bc: var(--clr-white);
1098 }
1099 .ezd-btn-outline-white:focus {
1100 outline: 0;
1101 box-shadow: 0 0 0 0.4rem rgba(var(--clr-white), 0.5);
1102 }
1103 .ezd-btn-gray {
1104 --btn-bg: rgba(37, 39, 51, 0.1);
1105 --btn-clr: var(--clr-dark);
1106 --btn-bc: transparent;
1107 }
1108 .ezd-btn-gray:hover {
1109 --btn-clr: var(--clr-white);
1110 --btn-bg: var(--clr-blue);
1111 --btn-bc: transparent;
1112 }
1113 .ezd-btn-gray:focus {
1114 outline: 0;
1115 box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
1116 }
1117
1118 .easydocs-dropdown {
1119 top: 130%;
1120 right: -20px;
1121 position: absolute;
1122 -webkit-box-shadow: 0 30px 40px 0 rgba(4, 73, 89, 0.1) 0 0 0 rgba(var(--clr-black), 1);
1123 -moz-box-shadow: 0 30px 40px 0 rgba(4, 73, 89, 0.1) 0 0 0 rgba(var(--clr-black), 1);
1124 box-shadow: 0 30px 40px 0 rgba(4, 73, 89, 0.1) 0 0 0 rgba(var(--clr-black), 1);
1125 background-color: var(--clr-white);
1126 border-radius: 0.5rem;
1127 z-index: 999;
1128 -webkit-transition: 0.3s ease-out;
1129 transition: 0.3s ease-out;
1130 display: none;
1131 }
1132 .easydocs-dropdown.is-active {
1133 opacity: 1;
1134 visibility: visible;
1135 top: 130%;
1136 }
1137
1138 .notification-dropdown {
1139 width: 340px;
1140 border-bottom: 1px solid rgba(0, 0, 0, 0.08);
1141 border-left: 1px solid rgba(0, 0, 0, 0.05);
1142 border-radius: 3px;
1143 box-shadow: 3px 2px 7px 1px rgba(0, 0, 0, 0.08);
1144 }
1145 .notification-dropdown::before {
1146 content: "";
1147 top: -0.625rem;
1148 right: 28px;
1149 position: absolute;
1150 width: 0;
1151 height: 0;
1152 border-style: solid;
1153 border-width: 0 10px 10px 10px;
1154 border-color: transparent transparent #f9f9f9 transparent;
1155 display: block;
1156 }
1157
1158 .notification-head {
1159 padding: 9px 12px;
1160 background: #f9f9f9;
1161 -webkit-box-shadow: 0 1px 0 0 #edeef2;
1162 -moz-box-shadow: 0 1px 0 0 #edeef2;
1163 box-shadow: 0 1px 0 0 #edeef2;
1164 }
1165 .notification-head.no-notification-text {
1166 padding: 20px 12px;
1167 background: rgba(190, 190, 190, 0.1490196078);
1168 display: block;
1169 text-align: center;
1170 }
1171 .notification-head .header-text {
1172 color: var(--clr-dark);
1173 font-size: var(--fs-13);
1174 font-weight: var(--fw-500);
1175 line-height: 1;
1176 }
1177 .notification-head .right-text {
1178 color: var(--clr-text);
1179 font-size: var(--fs-12);
1180 line-height: 1;
1181 }
1182
1183 .form-control {
1184 font-family: var(--ff-roboto);
1185 font-size: var(--fs-14);
1186 color: #9199a1;
1187 background: transparent;
1188 text-transform: capitalize;
1189 padding: 0.75rem 1.25rem;
1190 margin: 0 auto;
1191 width: 100%;
1192 height: auto;
1193 max-width: 37.5rem;
1194 border: 1px solid #EDEAE9;
1195 border-radius: 0.625rem;
1196 -webkit-transition: 0.3s ease-out;
1197 transition: 0.3s ease-out;
1198 }
1199 .form-control:focus {
1200 outline: none;
1201 }
1202 .form-control:focus {
1203 background: white;
1204 box-shadow: none !important;
1205 border: 1px solid #4c4cf1 !important;
1206 border-radius: 0.625rem;
1207 box-sizing: border-box !important;
1208 line-height: unset !important;
1209 }
1210 .form-control:focus ~ .search-icon {
1211 background: var(--clr-blue);
1212 --search-icon: var(--clr-white);
1213 }
1214 .form-control:focus ~ .search-icon .dashicons {
1215 color: #fff;
1216 }
1217
1218 .easydocs-search-form {
1219 position: relative;
1220 max-width: 37.5rem;
1221 flex: 1;
1222 margin-left: auto;
1223 margin-right: auto;
1224 }
1225 .easydocs-search-form .search-icon {
1226 position: absolute;
1227 -webkit-transition: 0.3s ease-out;
1228 transition: 0.3s ease-out;
1229 left: 20px;
1230 transform: translateY(50%);
1231 }
1232 .easydocs-search-form input#bbpc-search {
1233 color: #9199a1;
1234 padding: 10px 15px 10px 48px;
1235 border: 1px solid #EDEAE9;
1236 box-sizing: border-box;
1237 line-height: unset;
1238 box-shadow: 0 1px 1px rgba(11, 80, 115, 0.3), 0 1px 5px rgba(60, 64, 67, 0.1);
1239 background: rgba(255, 255, 255, 0.35);
1240 border-radius: 25px;
1241 }
1242 .easydocs-search-form input#bbpc-search:hover {
1243 box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.3), 0 2px 6px 2px rgba(60, 64, 67, 0.15);
1244 }
1245 .easydocs-search-form input#bbpc-search:focus {
1246 background: #fff;
1247 color: #242729;
1248 outline: none;
1249 }
1250
1251 .easydocs-accordion-item progress {
1252 -webkit-appearance: none;
1253 appearance: none;
1254 height: 6px;
1255 border-radius: 32px;
1256 width: 100px;
1257 }
1258 .easydocs-accordion-item progress::-webkit-progress-bar {
1259 background-color: #e74c3c;
1260 }
1261 .easydocs-accordion-item progress::-webkit-progress-value {
1262 background-color: #27ae60;
1263 }
1264
1265 .badge {
1266 display: inline-block;
1267 padding: 0.35em 0.65em 0.3em;
1268 font-size: 0.75em;
1269 font-weight: 400;
1270 line-height: 1;
1271 color: #fff;
1272 text-align: center;
1273 white-space: nowrap;
1274 vertical-align: baseline;
1275 border-radius: 0.25rem;
1276 }
1277
1278 /*----------------------------------------*/
1279 /* 02. Header Area
1280 /*----------------------------------------*/
1281 .easydocs-header-area {
1282 padding-top: 40px;
1283 padding-bottom: 50px;
1284 padding-right: 40px;
1285 }
1286 .easydocs-header-area .easydocs-row {
1287 margin-left: 0;
1288 margin-right: 0;
1289 }
1290
1291 .navbar-left {
1292 gap: var(--gutter-20);
1293 }
1294 .navbar-left .easydocs-btn {
1295 --btn-icon: var(--clr-blue);
1296 --btn-py: 0.5rem;
1297 --btn-px: 1rem;
1298 --btn-fs: var(--fs-12);
1299 font-weight: 500;
1300 gap: 6px;
1301 display: flex;
1302 border: 1px solid var(--clr-blue);
1303 align-items: center;
1304 text-decoration: none;
1305 padding: 8px 15px;
1306 border-radius: 6px;
1307 color: var(--clr-blue);
1308 }
1309 .navbar-left .easydocs-btn span.dashicons {
1310 font-size: 14px;
1311 margin-bottom: -4px;
1312 }
1313 .navbar-left .easydocs-btn:hover {
1314 --btn-icon: var(--clr-white);
1315 background: var(--clr-blue);
1316 }
1317 .navbar-left .easydocs-btn:focus {
1318 box-shadow: 0 0 0 0.4rem rgba(65, 65, 230, 0.5);
1319 }
1320
1321 .easydocs-logo-area a {
1322 text-decoration: none;
1323 color: var(--clr-dark);
1324 font-size: var(--fs-24);
1325 font-weight: var(--fw-700);
1326 }
1327
1328 :is(.easydocs-notification, .easydocs-settings) .header-notify-icon {
1329 width: 2.5rem;
1330 height: 2.5rem;
1331 line-height: 2.5rem;
1332 border-radius: 50%;
1333 background: rgba(37, 39, 51, 0.05);
1334 text-align: center;
1335 cursor: pointer;
1336 }
1337 :is(.easydocs-notification, .easydocs-settings) .header-notify-icon:hover {
1338 background: rgba(37, 39, 51, 0.09);
1339 }
1340 :is(.easydocs-notification, .easydocs-settings) .header-notify-icon svg {
1341 position: relative;
1342 top: 0.3rem;
1343 }
1344
1345 .easydocs-notification {
1346 margin-right: 1.6875rem;
1347 position: relative;
1348 }
1349 .easydocs-notification .easydocs-badge {
1350 top: -0.4375rem;
1351 right: -0.5rem;
1352 position: absolute;
1353 background: #FA3E3E;
1354 color: var(--clr-white);
1355 top: -0.4375rem;
1356 right: -0.2rem;
1357 position: absolute;
1358 padding: 0 4px;
1359 min-width: 18px;
1360 max-width: 18px;
1361 border-radius: 50%;
1362 text-align: center;
1363 font-size: 10px;
1364 font-weight: 700;
1365 line-height: 18px;
1366 height: 16px;
1367 display: inline-table;
1368 font-family: "Roboto";
1369 }
1370
1371 .easydocs-settings .header-notify-icons a {
1372 text-decoration: none;
1373 padding-top: 5px;
1374 display: inline-block;
1375 }
1376
1377 :is(.knobs, .layer) {
1378 inset: 0;
1379 position: absolute;
1380 }
1381
1382 .navbar-right .js-darkmode-btn .day svg {
1383 color: #fff;
1384 }
1385 .navbar-right .js-darkmode-btn .night svg {
1386 color: var(--clr-dark);
1387 }
1388
1389 .body_dark .navbar-right .js-darkmode-btn .day svg {
1390 --toggle-icon: #575766;
1391 }
1392 .body_dark .navbar-right .js-darkmode-btn .night svg {
1393 --toggle-icon: #fff;
1394 }
1395
1396 .navbar-right {
1397 display: flex;
1398 align-items: center;
1399 justify-content: flex-end;
1400 }
1401 .navbar-right > ul {
1402 align-items: center;
1403 gap: 8px;
1404 }
1405 .navbar-right .js-darkmode-btn {
1406 display: flex;
1407 align-items: center;
1408 justify-content: space-between;
1409 width: 5rem;
1410 height: 2.5rem;
1411 position: relative;
1412 background: rgba(37, 39, 51, 0.05);
1413 padding: 0 10px;
1414 color: #fff;
1415 border-radius: 24px;
1416 -webkit-transition: 0.3s ease-out;
1417 transition: 0.3s ease-out;
1418 }
1419 .navbar-right .js-darkmode-btn .day svg {
1420 --toggle-icon: #fff;
1421 -webkit-transition: 0.3s ease-out;
1422 transition: 0.3s ease-out;
1423 margin-top: 7px;
1424 }
1425 .navbar-right .js-darkmode-btn .night svg {
1426 --toggle-icon: #575766;
1427 -webkit-transition: 0.3s ease-out;
1428 transition: 0.3s ease-out;
1429 margin-top: 7px;
1430 }
1431 .navbar-right .js-darkmode-btn label {
1432 margin: 0;
1433 cursor: pointer;
1434 position: relative;
1435 z-index: 2;
1436 }
1437 .navbar-right .js-darkmode-btn .ball {
1438 height: 30px;
1439 width: 30px;
1440 position: absolute;
1441 background-color: var(--clr-blue);
1442 border-radius: 50%;
1443 left: 4px;
1444 top: 50%;
1445 transform: translateY(-50%);
1446 cursor: default;
1447 transition: all 0.3s linear 0s;
1448 z-index: 1;
1449 }
1450 .navbar-right .js-darkmode-btn svg {
1451 font-size: 16px;
1452 transition: all 0.3s linear 0s;
1453 }
1454 .navbar-right .js-darkmode-btn input {
1455 display: none;
1456 }
1457
1458 .settings-pro-icon {
1459 position: absolute;
1460 right: 0px;
1461 top: -5px;
1462 }
1463
1464 .swal2-styled.swal2-confirm.upgrade-premium-button > a {
1465 color: black;
1466 font-weight: normal;
1467 text-decoration: none;
1468 }
1469
1470 .swal2-footer.notification-pro-footer-wrap > a {
1471 text-decoration: none;
1472 }
1473
1474 .notification-body .filter-button-group {
1475 display: flex;
1476 gap: 8px;
1477 padding-left: var(--gutter-25);
1478 padding-right: var(--gutter-25);
1479 }
1480 .notification-body .filter-button-group svg {
1481 top: 0;
1482 }
1483 .notification-body .filter-button-group .easydocs-btn {
1484 --notification-icon: var(--clr-dark);
1485 --btn-px: 1rem;
1486 --btn-fs: var(--fs-14);
1487 --btn-py: 0.4rem;
1488 display: flex;
1489 align-items: center;
1490 gap: 1px;
1491 --btn-bg: #e4e6eb;
1492 --btn-clr: var(--clr-dark);
1493 --btn-bc: transparent;
1494 }
1495 .notification-body .filter-button-group .easydocs-btn.mixitup-control-active {
1496 background-color: #e7f3ff;
1497 color: #1877f2;
1498 --notification-icon: #1877f2;
1499 }
1500 .notification-body .filter-button-group .easydocs-btn.mixitup-control-active .dashicons-screenoptions:before {
1501 color: #1877f2;
1502 }
1503 .notification-body .filter-button-group .easydocs-btn.mixitup-control-active:hover {
1504 background-color: #d2e6f9;
1505 }
1506 .notification-body .filter-button-group .easydocs-btn:hover {
1507 --notification-icon: var(--clr-white);
1508 background: #cdcdcd;
1509 }
1510
1511 .notify-column {
1512 max-height: 25rem;
1513 overflow-y: auto;
1514 scrollbar-width: thin;
1515 /* Notification updated css */
1516 }
1517 .notify-column::-webkit-scrollbar-track {
1518 background-color: var(--clr-text-light);
1519 }
1520 .notify-column::-webkit-scrollbar {
1521 width: 8px;
1522 background-color: #F5F5F5;
1523 }
1524 .notify-column::-webkit-scrollbar-thumb {
1525 background-color: var(--clr-text);
1526 }
1527 .notify-column ul li {
1528 border-bottom: 1px solid #f1f2f3;
1529 margin-bottom: 0;
1530 }
1531 .notify-column ul li a {
1532 text-decoration: none;
1533 gap: 9px;
1534 align-content: space-around;
1535 padding: 10px;
1536 box-sizing: border-box;
1537 }
1538 .notify-column ul li a .notify-icon {
1539 padding-top: 5px;
1540 }
1541 .notify-column ul li a .notify-content-wrap {
1542 width: -webkit-fill-available;
1543 }
1544 .notify-column ul li a .notify-content-wrap .notify-content-header {
1545 color: hsl(210, 8%, 35%);
1546 font-size: 12px;
1547 }
1548 .notify-column ul li a .notify-content-wrap .notify-content-header .noti-type {
1549 color: var(--black_800);
1550 font-weight: 500;
1551 }
1552 .notify-column ul li a .notify-content-wrap .notify-content-summary p {
1553 color: hsl(206, 100%, 40%);
1554 font-size: 13px;
1555 }
1556 .notify-column ul li a:focus {
1557 box-shadow: none;
1558 }
1559 .notify-column ul li:hover {
1560 background: hsl(210, 8%, 90%);
1561 }
1562 .notify-column ul li:last-child {
1563 border-bottom: none;
1564 }
1565
1566 .notification-item {
1567 display: flex;
1568 align-items: flex-start;
1569 cursor: pointer;
1570 gap: var(--gutter-10);
1571 padding: var(--gutter-10) 15px;
1572 margin-left: var(--gutter-10);
1573 margin-right: var(--gutter-10);
1574 -webkit-transition: 0.3s ease-out;
1575 transition: 0.3s ease-out;
1576 border-radius: 0.3125rem;
1577 }
1578 .notification-item .notification-image {
1579 width: 2.5rem;
1580 height: 2.5rem;
1581 border-radius: 50%;
1582 position: relative;
1583 }
1584 .notification-item .notification-image .notify-badge {
1585 right: 0;
1586 bottom: 0;
1587 position: absolute;
1588 width: 1.125rem;
1589 height: 1.125rem;
1590 line-height: 1.125rem;
1591 border-radius: 50%;
1592 text-align: center;
1593 }
1594 .notification-item .notification-image .notify-badge .dashicons {
1595 top: 0;
1596 }
1597 .notification-item .notification-image .notify-badge-blue {
1598 background-color: #22AAF1;
1599 background-image: linear-gradient(180deg, #22AAF1 0%, #066BDA 100%);
1600 }
1601 .notification-item .notification-image .notify-badge-blue .dashicons {
1602 font-size: 12px;
1603 color: white;
1604 padding-top: 2.5px;
1605 }
1606 .notification-item .notification-image .notify-badge-green {
1607 background-color: #62D77E;
1608 background-image: linear-gradient(180deg, #62D77E 0%, #2BB64E 100%);
1609 }
1610 .notification-item .notification-image .notify-badge-green .dashicons {
1611 font-size: 12px;
1612 color: white;
1613 padding-top: 4px;
1614 }
1615 .notification-item:hover {
1616 background: rgba(76, 76, 241, 0.05);
1617 }
1618
1619 .notification-content .notify-name {
1620 font-size: var(--fs-14);
1621 font-weight: var(--fw-500);
1622 color: var(--clr-dark);
1623 padding-right: 0.5rem;
1624 margin: 0;
1625 line-height: 1;
1626 }
1627 .notification-content .notify-name a {
1628 text-decoration: none;
1629 }
1630 .notification-content .reply-text {
1631 font-size: 14px;
1632 color: var(--clr-text-light);
1633 line-height: 1;
1634 margin-top: 5px;
1635 }
1636
1637 .notify-short-description {
1638 font-size: var(--fs-14);
1639 color: var(--clr-text);
1640 line-height: 1;
1641 margin-top: 0.325rem;
1642 }
1643
1644 .notify-date {
1645 text-align: left;
1646 color: var(--clr-text-light);
1647 line-height: 1;
1648 margin-top: 0.375rem;
1649 }
1650
1651 .eazydocs-no-content {
1652 display: block;
1653 text-align: center;
1654 margin-top: 250px;
1655 }
1656 .eazydocs-no-content img {
1657 width: auto;
1658 max-width: 50px;
1659 height: auto;
1660 margin: 0px auto 10px;
1661 }
1662
1663 .bbpc-trash-filter {
1664 border-radius: 1.875rem;
1665 margin-bottom: 0;
1666 background-color: rgba(212, 23, 23, 0.1);
1667 transition: all 0.3s;
1668 }
1669 .bbpc-trash-filter:hover {
1670 background-color: rgba(212, 23, 23, 0.3);
1671 }
1672 .bbpc-trash-filter:hover a {
1673 color: #c10000;
1674 }
1675 .bbpc-trash-filter svg {
1676 fill: rgb(212, 23, 23);
1677 }
1678 .bbpc-trash-filter a {
1679 justify-content: center;
1680 gap: 0.3125rem;
1681 padding: 5px 15px;
1682 font-size: 14px;
1683 display: flex;
1684 align-items: center;
1685 color: rgb(212, 23, 23);
1686 text-decoration: none;
1687 }
1688
1689 .bbpc-settings-icon {
1690 background: rgba(0, 0, 255, 0.058);
1691 padding: 10px;
1692 border-radius: 50%;
1693 }
1694
1695 /*----------------------------------------*/
1696 /* Grid Layout
1697 /*----------------------------------------*/
1698 .container {
1699 width: 100%;
1700 padding-right: 15px;
1701 padding-left: 15px;
1702 margin-right: auto;
1703 margin-left: auto;
1704 }
1705 @media (min-width: 576px) {
1706 .container {
1707 max-width: 540px;
1708 }
1709 }
1710 @media (min-width: 768px) {
1711 .container {
1712 max-width: 720px;
1713 }
1714 }
1715 @media (min-width: 992px) {
1716 .container {
1717 max-width: 960px;
1718 }
1719 }
1720 @media (min-width: 1200px) {
1721 .container {
1722 max-width: 1170px;
1723 }
1724 }
1725 @media (min-width: 1441px) {
1726 .container {
1727 max-width: 1170px;
1728 }
1729 }
1730
1731 .container-fluid {
1732 width: 100%;
1733 padding-right: 15px;
1734 padding-left: 15px;
1735 margin-right: auto;
1736 margin-left: auto;
1737 }
1738
1739 .row {
1740 display: flex;
1741 flex-wrap: wrap;
1742 margin-right: -15px;
1743 margin-left: -15px;
1744 }
1745
1746 .no-gutters {
1747 margin-right: 0;
1748 margin-left: 0;
1749 }
1750 .no-gutters > .col,
1751 .no-gutters > [class*=col-] {
1752 padding-right: 0;
1753 padding-left: 0;
1754 }
1755
1756 html, body {
1757 height: auto !important;
1758 }
1759
1760 body.bbpc-forum-ui {
1761 background: radial-gradient(80.99% 100% at 50% 0%, #00FF0A 0%, #36008E 100%), radial-gradient(50% 123.47% at 50% 50%, #EFE7C8 0%, #36008E 100%), linear-gradient(301.28deg, #FF006B 0%, #48DD9E 100%), linear-gradient(294.84deg, #5A60E4 0%, #D30000 100%), linear-gradient(52.29deg, #000000 0%, #00FF85 100%), radial-gradient(100% 138.69% at 100% 0%, #0007A5 0%, #FF7A00 100%), radial-gradient(70.41% 100% at 50% 0%, #D5B300 0%, #2200AA 100%);
1762 background-blend-mode: screen, screen, lighten, overlay, lighten, difference, normal;
1763 }
1764
1765 /*----------------------------------------*/
1766 /* 03. Sidebar Area
1767 /*----------------------------------------*/
1768 .tab-container {
1769 display: flex;
1770 }
1771
1772 .tab-menu {
1773 position: relative;
1774 background: #000000;
1775 background: -moz-linear-gradient(to right, #000000 0%, #0a1852 100%);
1776 background: -webkit-linear-gradient(to right, #000000 0%, #0a1852 100%);
1777 background: linear-gradient(to right, #000000 0%, #0a1852 100%);
1778 flex: 0 0 auto;
1779 width: auto;
1780 }
1781 .tab-menu.short {
1782 height: 100vh;
1783 }
1784 @media (max-width: 1680px) {
1785 .tab-menu {
1786 width: 30%;
1787 }
1788 }
1789 .tab-menu .tab-menu-left-layer {
1790 position: absolute;
1791 top: 0;
1792 left: 0;
1793 width: 80px;
1794 height: 100%;
1795 -webkit-transition: 0.3s ease-out;
1796 transition: 0.3s ease-out;
1797 background: rgba(143, 143, 143, 0.3);
1798 }
1799
1800 .easydocs-tab {
1801 display: none;
1802 }
1803 .easydocs-tab.tab-active {
1804 display: block;
1805 }
1806
1807 .easydocs-navitem {
1808 display: flex;
1809 align-items: center;
1810 justify-content: space-between;
1811 padding: 12px 30px 12px 15px;
1812 margin-bottom: 5px;
1813 cursor: pointer;
1814 -webkit-transition: 0.3s ease-out;
1815 transition: 0.3s ease-out;
1816 position: relative;
1817 border-left: 5px solid transparent;
1818 }
1819 @media (max-width: 1680px) {
1820 .easydocs-navitem {
1821 padding: 13px 25px 13px 20px;
1822 }
1823 }
1824 .easydocs-navitem .link-wrapper {
1825 display: flex;
1826 align-items: center;
1827 justify-content: end;
1828 width: 110px;
1829 }
1830 .easydocs-navitem.is-active {
1831 border-left-color: #ffffff;
1832 background: rgba(159, 162, 180, 0.2);
1833 --title-opacity: 1;
1834 --total-page-opacity: 1;
1835 }
1836 .easydocs-navitem.is-active::before {
1837 content: "";
1838 right: 0;
1839 position: absolute;
1840 width: 0;
1841 height: 0;
1842 border-style: solid;
1843 border-width: 7px 10px 7px 0;
1844 border-color: transparent var(--clr-white) transparent transparent;
1845 display: block;
1846 }
1847 .easydocs-navitem.is-active .total-page {
1848 display: none;
1849 }
1850 .easydocs-navitem.is-active .link {
1851 display: flex;
1852 }
1853 .easydocs-navitem .title {
1854 display: flex;
1855 align-items: center;
1856 gap: 20px;
1857 -webkit-transition: 0.3s ease-out;
1858 transition: 0.3s ease-out;
1859 text-decoration: none;
1860 font-size: var(--fs-16);
1861 font-weight: 500;
1862 color: var(--clr-white);
1863 opacity: var(--title-opacity, 0.7);
1864 }
1865 .easydocs-navitem .title .featured-image {
1866 width: 40px;
1867 height: 40px;
1868 padding: 5px;
1869 border-radius: 7px;
1870 display: flex;
1871 align-items: center;
1872 justify-content: center;
1873 background: rgba(255, 255, 255, 0.5803921569);
1874 }
1875 .easydocs-navitem .title .featured-image img {
1876 width: 100%;
1877 height: auto;
1878 }
1879 .easydocs-navitem .title .featured-image span.dashicons {
1880 width: 32px;
1881 color: #000;
1882 }
1883 .easydocs-navitem .title span.easydocs-forums-title {
1884 padding-left: 20px;
1885 }
1886 .easydocs-navitem .total-page {
1887 font-size: var(--fs-12);
1888 color: var(--clr-white);
1889 opacity: var(--total-page-opacity, 0.5);
1890 -webkit-transition: 0.3s ease-out;
1891 transition: 0.3s ease-out;
1892 position: absolute;
1893 right: 30px;
1894 }
1895 .easydocs-navitem:hover {
1896 background: rgba(159, 162, 180, 0.2);
1897 --title-opacity: 1;
1898 --total-page-opacity: 1;
1899 }
1900 .easydocs-navitem:hover .total-page {
1901 display: none;
1902 }
1903 .easydocs-navitem:hover .link {
1904 display: flex;
1905 }
1906 .easydocs-navitem:hover .link a {
1907 padding-left: 2px;
1908 padding-right: 2px;
1909 }
1910
1911 .link {
1912 align-items: center;
1913 gap: 0.325rem;
1914 display: none;
1915 -webkit-transition: 0.3s ease-out;
1916 transition: 0.3s ease-out;
1917 }
1918 .link a {
1919 text-decoration: none;
1920 }
1921 .link a .dashicons {
1922 color: var(--black_200);
1923 font-size: 18px;
1924 padding-top: 2px;
1925 }
1926 .link a .dashicons:hover {
1927 color: #fff;
1928 }
1929 .link a.st-pro-notice .dashicons {
1930 color: #f1bd6c;
1931 }
1932 .link:hover svg {
1933 color: #fff;
1934 fill-color: #fff;
1935 }
1936
1937 .easydocs-tab-content {
1938 flex: 1;
1939 width: auto;
1940 padding: 0 40px 40px 40px;
1941 }
1942 @media (max-width: 1680px) {
1943 .easydocs-tab-content {
1944 width: 70%;
1945 }
1946 }
1947 @media (max-width: 1440px) {
1948 .easydocs-tab-content {
1949 width: 70%;
1950 padding: 20px;
1951 }
1952 }
1953 .easydocs-tab-content .button {
1954 padding: 6px 25px;
1955 }
1956
1957 .easydocs-filter-container {
1958 background: var(--clr-white);
1959 padding: var(--gutter-15) var(--gutter-30);
1960 border-radius: 0.375rem;
1961 display: flex;
1962 align-items: center;
1963 justify-content: space-between;
1964 background: linear-gradient(125.95deg, #C700BF 10.95%, #7DA900 100%), linear-gradient(341.1deg, #00C2FF 7.52%, #4E00B1 77.98%), linear-gradient(222.34deg, #A90000 12.99%, #00FFE0 87.21%), linear-gradient(130.22deg, #8FA600 18.02%, #5A31FF 100%);
1965 background-blend-mode: screen, color-dodge, color-dodge, normal;
1966 padding-left: 16px;
1967 }
1968 @media (max-width: 1440px) {
1969 .easydocs-filter-container {
1970 padding: 10px 20px;
1971 }
1972 }
1973
1974 .single-item-filter {
1975 display: flex;
1976 align-items: center;
1977 gap: 5px;
1978 }
1979 .single-item-filter.all-available li {
1980 padding: 5px 15px;
1981 }
1982 .single-item-filter .easydocs-btn {
1983 display: flex;
1984 align-items: center;
1985 justify-content: center;
1986 font-size: 12px;
1987 gap: 0.3125rem;
1988 --btn-fs: var(--fs-14);
1989 transition: all 0.3s;
1990 border-radius: 15px;
1991 padding: 5px 25px;
1992 cursor: pointer;
1993 margin: 0;
1994 }
1995 .single-item-filter .easydocs-btn:hover {
1996 background-color: rgba(0, 0, 0, 0.1);
1997 }
1998 .single-item-filter .easydocs-btn.is-active {
1999 background-color: rgba(0, 0, 0, 0.8);
2000 color: #f1f1f1;
2001 }
2002 .single-item-filter .easydocs-btn.is-active img {
2003 filter: brightness(0) invert(1);
2004 }
2005 .single-item-filter .easydocs-btn.easydocs-btn-black-light {
2006 --btn-icon: #0D0E2B;
2007 }
2008 .single-item-filter .easydocs-btn.easydocs-btn-black-light svg {
2009 fill: #0D0E2B;
2010 }
2011 .single-item-filter .easydocs-btn.easydocs-btn-black-light.mixitup-control-active {
2012 --btn-bg: #0D0E2B;
2013 --btn-clr: var(--clr-white);
2014 --btn-icon: var(--clr-white);
2015 }
2016 .single-item-filter .easydocs-btn.easydocs-btn-black-light.mixitup-control-active svg {
2017 fill: #ffffff;
2018 }
2019 .single-item-filter .easydocs-btn.easydocs-btn-green-light {
2020 --btn-icon: #2DB22D;
2021 }
2022 .single-item-filter .easydocs-btn.easydocs-btn-green-light svg {
2023 fill: #2DB22D;
2024 }
2025 .single-item-filter .easydocs-btn.easydocs-btn-green-light.mixitup-control-active {
2026 --btn-bg: #2DB22D;
2027 --btn-clr: var(--clr-white);
2028 --btn-icon: var(--clr-white);
2029 }
2030 .single-item-filter .easydocs-btn.easydocs-btn-green-light.mixitup-control-active svg {
2031 fill: #ffffff;
2032 }
2033 .single-item-filter .easydocs-btn.easydocs-btn-blue-light {
2034 --btn-icon: #0275D8;
2035 }
2036 .single-item-filter .easydocs-btn.easydocs-btn-blue-light svg {
2037 fill: #0275D8;
2038 }
2039 .single-item-filter .easydocs-btn.easydocs-btn-blue-light.mixitup-control-active {
2040 --btn-bg: #0275D8;
2041 --btn-clr: var(--clr-white);
2042 --btn-icon: var(--clr-white);
2043 }
2044 .single-item-filter .easydocs-btn.easydocs-btn-blue-light.mixitup-control-active svg {
2045 fill: #fff;
2046 }
2047 .single-item-filter .easydocs-btn.easydocs-btn-orange-light {
2048 --btn-icon: #CC8033;
2049 }
2050 .single-item-filter .easydocs-btn.easydocs-btn-orange-light svg {
2051 fill: #CC8033;
2052 }
2053 .single-item-filter .easydocs-btn.easydocs-btn-orange-light.mixitup-control-active {
2054 --btn-bg: #CC8033;
2055 --btn-clr: var(--clr-white);
2056 --btn-icon: var(--clr-white);
2057 }
2058 .single-item-filter .easydocs-btn.easydocs-btn-orange-light.mixitup-control-active svg {
2059 fill: #fff;
2060 }
2061 .single-item-filter .easydocs-btn.easydocs-btn-gray-light {
2062 --btn-icon: #424242;
2063 }
2064 .single-item-filter .easydocs-btn.easydocs-btn-gray-light.mixitup-control-active {
2065 --btn-bg: #424242;
2066 --btn-clr: var(--clr-white);
2067 --btn-icon: var(--clr-white);
2068 }
2069
2070 .single-grid-container {
2071 display: flex;
2072 align-items: center;
2073 border: 1px solid #EDEAE9;
2074 border-radius: 0.375rem;
2075 --grid-icon: #9199A1;
2076 }
2077 .single-grid-container a {
2078 text-decoration: none;
2079 padding: 0.3rem 0.5rem 0.5rem;
2080 height: 1.875rem;
2081 }
2082 .single-grid-container a:first-child {
2083 border-right: 1px solid #EDEAE9;
2084 }
2085 .single-grid-container .is-active {
2086 background: rgba(37, 39, 51, 0.05);
2087 --grid-icon: var(--clr-blue);
2088 }
2089
2090 @media screen and (min-width: 1200px) {
2091 .container {
2092 max-width: 1170px;
2093 }
2094 }
2095 #wpcontent {
2096 height: 100vh;
2097 }
2098
2099 /*# sourceMappingURL=admin-ui-style.css.map */
2100