PluginProbe
Easy Elements for Elementor – Addons & Website Templates / 1.0.7
Easy Elements for Elementor – Addons & Website Templates v1.0.7
1.5.3 1.5.2 1.5.1 1.5.0 1.4.9 1.4.6 1.4.7 1.4.8 1.4.5 1.4.4 1.4.3 1.2.7 1.2.8 1.2.9 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 1.3.6 1.3.7 1.3.8 1.3.9 1.4.0 All 47 releases
easy-elements / assets / css / admin / admin.css

admin.css in Easy Elements for Elementor – Addons & Website Templates 1.0.7, at assets/css/admin/admin.css

1,061 lines 22.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 :root{
2 --easy-primary-color: #7455FF;
3 --easy-white-color: #ffffff;
4 --easy-title-color: #09051B;
5 --easy-black-color: #000000;
6 }
7 /* Common Class CSS */
8 .easyel-tColor{
9 color: var(--easy-title-color);
10 }
11 .overflow-hidden{
12 overflow: hidden;
13 }
14 .easyel-decoration-none{
15 text-decoration: none;
16 }
17 .easyel-border-radius-20{
18 border-radius: 20px;
19 }
20 .easyel-position-rl{
21 position: relative;
22 }
23 .easyel-position-ab{
24 position: absolute;
25 }
26 .easyel-top-0{
27 top: 0;
28 }
29 .easyel-bottom-0{
30 bottom: 0;
31 }
32 .easyel-star-0{
33 left: 0;
34 }
35 .easyel-end-0{
36 right: 0;
37 }
38 .easyel-section-gap{
39 padding: 120px 80px;
40 }
41 .easyel-py-0{
42 padding-top: 0px;
43 padding-bottom: 0px;
44 }
45 .easyel-dflex{
46 display: flex;
47 }
48 .easyel-align-center{
49 align-items: center;
50 }
51 .easyel-justify-between{
52 justify-content: space-between;
53 }
54 .easyel-section-heading .easyel-title{
55 color: var(--easy-title-color);
56 font-size: 40px;
57 font-weight: 600;
58 line-height: 130%;
59 margin: 0 0 35px;
60 }
61 .easyel-section-heading .easyel-desc{
62 font-size: 18px;
63 color: #09051bcc;
64 margin: 0;
65 text-transform: capitalize;
66 }
67 .easyel-tab-panel .easyel-dashboard-heading{
68 font-size: 28px;
69 font-weight: 500;
70 color: var(--easy-title-color);
71 line-height: 160%;
72 padding: 0;
73 margin-bottom: 25px;
74 }
75 .easyel-focus-hide:focus{
76 box-shadow: none;
77 outline: none;
78 color: inherit;
79 }
80 /* End Common Class CSS */
81 body.toplevel_page_easy-elements-dashboard #wpbody-content{
82 font-family: "Inter", sans-serif !important;
83 font-size: 16px;
84 }
85 .elementor-panel .elementor-element .icon i.rt-icon::before{
86 display: none;
87 }
88 .elementor-panel .elementor-element .icon i.rt-icon::after{
89 width: 30px;
90 height: 30px;
91 content: "";
92 display: inline-block;
93 border-radius: 5px;
94 background: url("../img/icons/easy-editor-logo.svg") no-repeat center center/cover;
95 }
96
97 .elementor-icons-manager__tab-link i.rt-icon{
98 width: 30px;
99 height: 30px;
100 content: "";
101 border-radius: 100%;
102 background: url(../img/icons/easy-editor-logo.svg) no-repeat center center/cover;
103 display: inline-block;
104 position: relative;
105 top: 10px;
106 margin-right: 6px;
107 }
108
109 .easy-form-table{
110 background-color: #f9f9f9;
111 border-top: 3px solid #003599;
112 }
113 .easy-widget-row strong{
114 display: block;
115 }
116 .easy-form-table td {
117 border: 1px solid #0000000a;
118 padding: 25px !important;
119 text-align: center;
120 box-sizing: border-box;
121 background: var(--easy-white-color);
122 }
123
124 .easy-form-table td:nth-child(2n+0) {
125 background: #fafafa;
126 }
127
128 .eel-pro-notice {
129 padding: 10px;
130 color: #d94a4a;
131 font-weight: bold;
132 }
133
134 .eel-popup-note {
135 padding: 8px 10px;
136 color: #2271b1;
137 background: #f0f6fb;
138 border-radius: 4px;
139 margin: 8px 0 0 0;
140 font-size: 14px;
141 }
142
143 /* Upload box */
144 #easyel-custom-fonts-upload-form input[type="file"] {
145 padding: 10px;
146 border: 2px dashed #0073aa;
147 border-radius: 6px;
148 background: #f1f1f1;
149 width: 100%;
150 margin-bottom: 10px;
151 transition: border-color 0.3s, background 0.3s;
152 }
153 #easyel-custom-fonts-upload-form input[type="file"]:hover {
154 border-color: #00a0d2;
155 background: #e8f7ff;
156 }
157
158 /* Uploaded fonts grid */
159 #easyel-custom-fonts-upload-form input[type="file"] {
160 padding: 10px;
161 border: 2px dashed #0073aa;
162 border-radius: 6px;
163 background: #f1f1f1;
164 width: 100%;
165 margin-bottom: 10px;
166 transition: all 0.3s;
167 }
168 #easyel-custom-fonts-upload-form input[type="file"]:hover {
169 border-color: #00a0d2;
170 background: #e8f7ff;
171 }
172 .easyel-fonts-grid {
173 display: grid;
174 grid-template-columns: repeat(5, 1fr);
175 gap: 15px;
176 margin-top: 15px;
177 }
178 .easyel-font-box {
179 padding: 15px;
180 border: 1px solid #ccc;
181 border-radius: 6px;
182 background: #f9f9f9;
183 text-align: center;
184 transition: transform 0.2s, box-shadow 0.2s;
185 }
186 .easyel-font-box:hover {
187 transform: translateY(-2px);
188 box-shadow: 0 4px 10px rgba(0,0,0,0.1);
189 }
190 .easyel-font-box p { margin: 5px 0; }
191 .easyel-font-box .button-secondary { margin-top: 8px; }
192
193 #easy-elements-notifications {
194 position: fixed;
195 top: 32px;
196 right: 20px;
197 z-index: 999999;
198 max-width: 400px;
199 }
200
201 .easy-elements-notification {
202 background: var(--easy-white-color);
203 border-left: 4px solid;
204 box-shadow: 0 2px 8px rgba(0,0,0,0.15);
205 margin-bottom: 10px;
206 padding: 12px 16px;
207 border-radius: 4px;
208 font-size: 14px;
209 display: none;
210 }
211
212 .easy-elements-notification.success {
213 border-color: #4CAF50;
214 color: #155724;
215 background-color: #d4edda;
216 }
217
218 .easy-elements-notification.error {
219 border-color: #f44336;
220 color: #721c24;
221 background-color: #f8d7da;
222 }
223
224 .easy-elements-notification.info {
225 border-color: #2196F3;
226 color: #0c5460;
227 background-color: #d1ecf1;
228 }
229
230
231 /*Theme builder css*/
232 .easyel-builder-tabs {
233 display:flex;
234 gap:10px;
235 margin:15px 0;
236 padding:10px;
237 background:var(--easy-white-color);
238 border:1px solid #ccd0d4;
239 }
240
241 .easyel-tab {
242 padding:6px 12px;
243 border:1px solid #ccd0d4;
244 text-decoration:none;
245 border-radius:4px;
246 }
247 .easyel-tab.active,
248 .easyel-tab:hover {
249 background:#2271b1;
250 color:var(--easy-white-color);
251 }
252
253 .easyel-choose-template {
254 display: flex;
255 flex-direction: column;
256 align-items: center;
257 justify-content: center;
258 gap: 20px;
259 max-width: 400px;
260 margin: 0 auto;
261 }
262
263 .easyel-choose-template h2 {
264 font-size: 22px;
265 font-weight: 600;
266 color: #333;
267 text-align: center;
268 }
269
270 .easyel-template-type {
271 width: 100%;
272 }
273
274 .easyel-builder-tmpl-type,
275 .easyel-builder-template-name {
276 width: 100%;
277 padding: 8px 15px !important;
278 border: 1px solid #ddd !important;;
279 border-radius: 4px !important;;
280 font-size: 15px;
281 outline: none;
282 transition: all 0.3s ease;
283 }
284
285 .easyel-builder-tmpl-type:focus,
286 .easyel-builder-template-name:focus {
287 border-color: #4a90e2;
288 box-shadow: 0 0 8px rgba(74, 144, 226, 0.3);
289 }
290
291 .easyel-builder-tmpl-type option {
292 padding: 10px;
293 }
294
295 .easyel-builder-template-name::placeholder {
296 color: #aaa;
297 font-style: italic;
298 }
299
300 /* easy elements tab css */
301 .easyel-overview-header{
302 padding: 24px 30px;
303 background: var(--easy-white-color);
304 }
305 .easyel-plugin-settings-wrapper{
306 display: flex;
307 justify-content: flex-start;
308 gap: 30px;
309 margin-top: 35px;
310 }
311 /* Left Side */
312 .easyel-nav-tab-item{
313 width: 20%;
314 }
315 .easyel-nav-tab-wrapper{
316 position: sticky;
317 top: 50px;
318 height: 85vh;
319 }
320 .easyel-nav-tab-wrapper,
321 .easyel-tab-panel{
322 padding: 20px;
323 background: var(--easy-white-color);
324 }
325 .easyel-nav-tab-pro,
326 .easyel-nav-tab{
327 display: flex;
328 gap: 10px;
329 align-items: center;
330 font-size: 18px;
331 color: var(--easy-title-color);
332 font-weight: 500;
333 text-decoration: none;
334 padding: 16px;
335 margin-bottom: 24px;
336 border-radius: 10px;
337 transition: 0.3s;
338 line-height: 1em;
339 }
340 .easyel-nav-tab-pro i,
341 .easyel-nav-tab i{
342 font-size: 23px;
343 }
344 .easyel-nav-tab:focus,
345 .easyel-nav-tab:hover,
346 .easyel-nav-tab-active {
347 background: var(--easy-primary-color);
348 color: var(--easy-white-color);
349 outline: none;
350 box-shadow: none;
351 }
352 .easyel-tab-pro-link{
353 position: absolute;
354 left: 20px;
355 bottom: 20px;
356 width: calc(100% - 40px);
357 }
358 .easyel-tab-pro-link .easyel-nav-tab-pro{
359 margin-bottom: 0;
360 border-radius: 8px;
361 color: var(--easy-primary-color);
362 background: #7455ff26;
363 justify-content: center;
364 }
365 .easyel-tab-pro-link .easyel-nav-tab-pro i{
366 font-size: 23px;
367 top: -2px;
368 position: relative;
369 }
370 /* Right Side */
371 #easyel-tab-content{
372 width: 80%;
373 }
374
375 /************************/
376 /* Start Overview Area */
377 /***********************/
378 .easyel-overview-area{
379 margin: 0;
380 }
381 /* Start Banner Area */
382 .easyel-overview-area .easyel-banner-section .easyel-shape-2{
383 margin-top: 30px;
384 }
385 .easyel-overview-area .easyel-banner-content-area{
386 background: #f1f2fa80;
387 padding: 120px 60px 78px;
388 }
389 .easyel-overview-area .easyel-banner-content{
390 max-width: 432px;
391 width: 100%;
392 position: relative;
393 z-index: 2;
394 }
395 .easyel-overview-area .easyel-banner-content .title{
396 margin-top: 40px;
397 font-size: 56px;
398 line-height: 1em;
399 }
400 .easyel-overview-area .easyel-banner-content .title span{
401 color: var(--easy-primary-color);
402 font-weight: 700;
403 }
404 .easyel-overview-area .easyel-banner-rating{
405 gap: 30px;
406 margin-top: 70px;
407 }
408 .easyel-overview-area .easyel-rating-content{
409 gap: 20px;
410 }
411 .easyel-overview-area .easyel-banner-rating h3{
412 font-size: 40px;
413 margin: 0;
414 }
415 .easyel-overview-area .easyel-rating .rating-icon i{
416 color: #1CB165;
417 font-size: 16px;
418 width: 16px;
419 height: 16px;
420 }
421 .easyel-overview-area .easyel-rating span{
422 color: var(--easy-black-color);
423 font-size: 14px;
424 }
425 .easyel-overview-area .easyel-btn{
426 display: inline-flex;
427 align-items: center;
428 gap: 10px;
429 font-size: 16px;
430 font-weight: 600;
431 padding: 14px 28px;
432 color: var(--easy-white-color);
433 border: 2px solid transparent;
434 border-radius: 30px;
435 background: linear-gradient(to right, #8E74FF, var(--easy-primary-color) 57%, var(--easy-primary-color)) padding-box,
436 linear-gradient(to right, var(--easy-primary-color), #C2B4FF) border-box;
437 background-size: 200% 100%;
438 background-position: left center;
439 transition: all 0.4s ease;
440 }
441 .easyel-overview-area .easyel-btn i{
442 font-size: 22px;
443 }
444 .easyel-overview-area .easyel-btn:focus,
445 .easyel-overview-area .easyel-btn:hover{
446 color: var(--easy-white-color);
447 background: linear-gradient(to left, var(--easy-primary-color), #8E74FF 57%, var(--easy-primary-color)) padding-box,
448 linear-gradient(to left, #C2B4FF, var(--easy-primary-color) ) border-box;
449 background-size: 200% 100%;
450 background-position: right center;
451 box-shadow: none;
452 outline: none;
453 }
454
455 /* End Banner Area */
456
457 /* Start Documentation Area */
458 .easyel-overview-area .easyel-docx-area{
459 gap: 40px;
460 }
461 .easyel-overview-area .easyel-docx-image-area{
462 background: #F9FAFD;
463 padding: 50px;
464 }
465 .easyel-overview-area .easyel-docx-image-area img{
466 max-width: 100%;
467 }
468 .easyel-overview-area .easyel-docx-content{
469 max-width: 490px;
470 width: 100%;
471 padding-bottom: 55px;
472 }
473 /* End Documentation Area */
474
475 /* Start Video Area */
476 .easyel-overview-area .easyel-video-heading{
477 max-width: 600px;
478 text-align: center;
479 margin: auto;
480 padding-bottom: 40px;
481 }
482 .easyel-overview-area .easyel-video-heading .easyel-title{
483 margin-bottom: 20px;
484 }
485 .easyel-overview-area .easyel-video-items{
486 gap:28px;
487 }
488 .easyel-overview-area .easyel-video-item{
489 flex-basis: 33%;
490 width: 33%;
491 }
492 .easyel-overview-area .easyel-video-img span{
493 display: none;
494 }
495 .easyel-overview-area .easyel-video-img a{
496 display: block;
497 border-radius: 20px;
498 overflow: hidden;
499 }
500 .easyel-overview-area .easyel-video-img a::before{
501 content: '';
502 position: absolute;
503 left: 0;
504 top: 0;
505 width: 100%;
506 height: 100%;
507 background: var(--easy-white-color);
508 opacity: 0.2;
509 }
510 .easyel-overview-area .easyel-video-img a img{
511 width: 100%;
512 max-height: 200px;
513 object-fit: cover;
514 }
515 .easyel-overview-area .easyel-video-img svg{
516 width: 50px;
517 position: absolute;
518 left: 50%;
519 top: 50%;
520 transform: translate(-50%, -50%);
521 }
522 .easyel-overview-area .easyel-video-item .easyel-video-text{
523 font-size: 16px;
524 font-weight: 600;
525 margin: 20px 0 0 ;
526 }
527 .easyel-overview-area .easyel-video-btn{
528 text-align: center;
529 margin-top: 50px;
530 }
531
532 /* Popup Style */
533 #easyel-popup-video-area {
534 display: none;
535 position: fixed;
536 inset: 0;
537 background: rgba(0,0,0,0.75);
538 z-index: 9999;
539 }
540 #easyel-popup-video-area .easyel-popup-content {
541 position: relative;
542 max-width: 800px;
543 width: 100%;
544 top: 50%;
545 left: 50%;
546 transform: translate(-50%, -50%);
547 }
548 #easyel-popup-video-area .easyel-popup-video {
549 aspect-ratio: 16 / 9;
550 border-radius: 12px;
551 overflow: hidden;
552 }
553
554 #easyel-popup-video-area .easyel-popup-close {
555 position: absolute;
556 top: -23px;
557 right: -23px;
558 font-size: 18px;
559 font-weight: bold;
560 width: 32px;
561 height: 32px;
562 color: var(--easy-white-color);
563 background: linear-gradient(to left, var(--easy-primary-color), #8E74FF 57%, var(--easy-primary-color));
564 opacity: .8;
565 border-radius: 50%;
566 cursor: pointer;
567 z-index: 10;
568 justify-content: center;
569 transition: all 0.3s ease;
570 }
571 #easyel-popup-video-area .easyel-popup-close:hover {
572 transform: scale(1.1);
573 }
574
575 #easyel-popup-video-area iframe {
576 width: 100%;
577 height: 100%;
578 border: none;
579 display: block;
580 }
581 /* End Video Area */
582
583 /* Start Faq Area */
584 .easyel-faq-area{
585 gap: 30px;
586 }
587 .easyel-faq-heading{
588 max-width: 335px;
589 width: 100%;
590 }
591 .easyel-faq-heading .easyel-title{
592 font-size: 32px;
593 margin-bottom: 30px;
594 }
595 .easyel-faq-item:not(:last-child){
596 padding-bottom: 40px;
597 }
598 .easyel-faq-item-heading {
599 position: relative;
600 width: 100%;
601 text-align: left;
602 font-size: 20px;
603 font-weight: 600;
604 padding: 0;
605 cursor: pointer;
606 background: none;
607 border: none;
608 outline: none;
609 }
610 .easyel-faq-item-heading span{
611 display: inline-block;
612 width: 93%;
613 }
614 .easyel-faq-item-heading:before {
615 content: "";
616 position: absolute;
617 right: 0;
618 width: 25px;
619 height: 25px;
620 color: var(--easy-primary-color);
621 font-size: 18px;
622 display: flex;
623 justify-content: center;
624 align-items: center;
625 border: 2px solid var(--easy-primary-color);
626 border-radius: 50%;
627 }
628 .easyel-faq-item.active .easyel-faq-item-heading:before {
629 content: "";
630 }
631 .easyel-faq-item-content {
632 display: none;
633 padding-top: 12px;
634 font-weight: 500;
635 line-height: 1.5;
636 width: 95%;
637 }
638 /* End Faq Area */
639
640 /* Start Request Feature Area */
641 .easyel-requestFeature-section{
642 background: #F9FAFD;
643 padding: 100px 40px 40px;
644 }
645 .easyel-requestFeature-heading{
646 max-width: 800px;
647 width: 100%;
648 margin: auto;
649 text-align: center;
650 margin-bottom: 60px;
651 }
652 .easyel-requestFeature-heading .easyel-title{
653 margin-bottom: 20px;
654 }
655 .easyel-requestFeature-heading .easyel-btn{
656 margin-top: 40px;
657 }
658 .easyel-requestFeature-image img{
659 width: 100%;
660 }
661 /* End Request Feature Area */
662
663 /* Start Support Area */
664 .easyel-support-area{
665 padding-top: 60px;
666 gap: 20px;
667 }
668 .easyel-support-item{
669 padding: 28px;
670 width: 50%;
671 position: relative;
672 }
673 .easyel-support-item-left{
674 background: #F9FAFD;
675 }
676 .easyel-support-item img{
677 width: 100%;
678 }
679 .easyel-support-heading{
680 max-width: 450px;
681 width: 100%;
682 margin-bottom: 110px;
683 }
684 .easyel-support-heading .easyel-title{
685 font-size: 28px;
686 margin-top: 35px;
687 margin-bottom: 28px;
688 }
689 .easyel-support-item .easyel-btn{
690 position: absolute;
691 left: 28px;
692 bottom: 28px;
693 }
694 .easyel-support-item-right{
695 background: var(--easy-primary-color);
696 }
697 .easyel-support-item-right .easyel-support-heading *{
698 color: var(--easy-white-color) !important;
699 }
700 .easyel-support-item-right .easyel-btn{
701 background: linear-gradient(to right, var(--easy-white-color), var(--easy-white-color)) padding-box,
702 linear-gradient(to right, var(--easy-primary-color), #C2B4FF) border-box;
703 color: var(--easy-primary-color);
704 }
705 .easyel-support-item-right .easyel-btn svg{
706 fill: currentColor;
707 }
708 /* End Support Area */
709
710 /****************************/
711 /* End Overview Area */
712 /****************************/
713
714 /****************************/
715 /* Start Widget Area */
716 /****************************/
717
718 /* Widget top section style */
719 .easyel-addon-search button{
720 font-size: 16px;
721 line-height: 150%;
722 border: none;
723 box-shadow: none;
724 border-radius: 8px;
725 cursor: pointer;
726 transition: all 0.3s ease;
727 }
728 .easyel-addon-search .easyel-action-btn{
729 background: #7455ff1a;
730 color: var(--easy-primary-color);
731 padding: 6px 16px;
732 margin-right: 5px;
733 }
734 .easyel-addon-search .easyel-action-btn:hover,
735 .easyel-addon-search .easyel-action-btn.active{
736 background: var(--easy-primary-color);
737 color: var(--easy-white-color);
738 }
739 .easyel-widget-activeDeactivate-button button{
740 background: var(--easy-primary-color);
741 color: var(--easy-white-color);
742 font-weight: 500;
743 padding: 12px 24px;
744 }
745 .easyel-widget-activeDeactivate-button button#deactivate-all-btn{
746 margin-left: 10px;
747 background: #E21700;
748 }
749 .easyel-addon-search #element-search{
750 width: 100%;
751 font-size: 14px;
752 background: #F4F6F8;
753 color: var(--easy-title-color);
754 padding: 8px 12px;
755 border: none;
756 box-shadow: none;
757 border-radius: 10px;
758 margin-top: 24px;
759 height: 36px;
760 }
761 .easyel-addon-search #element-search::placeholder{
762 color: #919EAB;
763 }
764 /* Widget Item Style */
765 .easyel-widgets-grid,
766 .easyel-extension-wrapper {
767 display: grid;
768 grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
769 gap: 20px;
770 padding-bottom: 20px;
771 }
772 .easyel-widget-group-title,
773 .easyel-extension-group-title {
774 font-size: 20px;
775 font-weight: 600;
776 color: var(--easy-title-color);
777 margin: 40px 0 28px;
778 }
779 .easyel-widget-card {
780 position: relative;
781 overflow: hidden;
782 background: #F1F2FA;
783 padding: 10px;
784 border-radius: 12px;
785 }
786 .easyel-widget-card.easyel-pro-enable {
787 opacity: 0.7;
788 }
789 .easyel-widget-icon {
790 font-size: 24px;
791 width: 60px;
792 height: 60px;
793 background: var(--easy-white-color);
794 display: flex;
795 justify-content: center;
796 align-items: center;
797 border-radius: 8px;
798 margin-right: 12px;
799 position: relative;
800 }
801 .easyel-pro-badge {
802 position: absolute;
803 left: 50%;
804 top: -4px;
805 background-color: #F2295B;
806 color: var(--easy-white-color);
807 border-radius: 36px;
808 font-size: 8px;
809 font-weight: 500;
810 transform: translateX(-50%);
811 display: inline-flex;
812 align-items: center;
813 gap: 3px;
814 padding: 4px 6px;
815 line-height: 100%;
816 }
817 .widget-header strong{
818 font-size: 16px;
819 font-weight: 600;
820 color:var(--easy-title-color);
821 line-height: 1.2;
822 }
823 .easyel-demo-link{
824 margin-top: 8px;
825 gap: 14px;
826 }
827 .easyel-demo-link a{
828 font-size: 12px;
829 color: #09091480;
830 text-decoration: none;
831 box-shadow: none;
832 transition: 0.3s;
833 line-height: 1em;
834 }
835 .easyel-demo-link a i{
836 font-size: 14px;
837 }
838 .easyel-demo-link a:hover{
839 color: var(--easy-primary-color);
840 }
841 /* Widget Toggle switcher */
842 .easy-toggle-switch{
843 position: relative;
844 display: inline-block;
845 width: 40px;
846 height: 24px;
847 margin-top: 0;
848 }
849 .easy-toggle-switch input,
850 .easyel-toggle-switch-extension input{
851 opacity: 0;
852 width: 0;
853 height: 0;
854 }
855 .easy-toggle-switch .slider{
856 position: absolute;
857 cursor: pointer;
858 top: 0;
859 left: 0;
860 right: 0;
861 bottom: 0;
862 background-color: var(--easy-white-color);
863 transition: .4s;
864 border-radius: 24px;
865 }
866 .easy-toggle-switch .slider:before,
867 .easyel-toggle-switch-extension .slider:before {
868 position: absolute;
869 content: "";
870 height: 16px;
871 width: 16px;
872 left: 4px;
873 top: 4px;
874 background-color: #E9EAED;
875 transition: all .3s ease;
876 border-radius: 50%;
877 }
878 .easy-toggle-switch input:checked + .slider,
879 .easyel-toggle-switch-extension input:checked ~ .slider {
880 background-color: #22C55E;
881 }
882 .easy-toggle-switch input:checked + .slider:before {
883 transform: translateX(16px);
884 }
885
886 /****************************/
887 /* End Widget Area */
888 /****************************/
889
890 /****************************/
891 /* Start Extention Area */
892 /****************************/
893
894 .easyel-toggle-switch-extension {
895 display: inline-flex;
896 align-items: center;
897 cursor: pointer;
898 position: relative;
899 user-select: none;
900 gap: 10px;
901 }
902 .easyel-toggle-switch-extension .easyel-enable-all {
903 font-size: 14px;
904 font-weight: 500;
905 color: var(--easy-title-color);
906 line-height: 1;
907 white-space: nowrap;
908 }
909 .easyel-toggle-switch-extension input {
910 position: absolute;
911 }
912 .easyel-toggle-switch-extension .slider {
913 position: relative;
914 width: 44px;
915 height: 24px;
916 background-color: #E5E7EB;
917 border-radius: 24px;
918 transition: all 0.3s ease;
919 }
920 .easyel-toggle-switch-extension .slider:before {
921 background-color: #fff;
922 box-shadow: 0 2px 4px rgba(0,0,0,0.2);
923 }
924
925 .easyel-toggle-switch-extension input:checked ~ .slider:before {
926 transform: translateX(20px);
927 }
928
929 #toplevel_page_easy-elements-dashboard .wp-menu-image {
930 background: url('../../img/easy-dashicon.svg') no-repeat center center !important;
931 background-size: 20px 20px !important;
932 }
933 /* Remove default dashicon */
934 #toplevel_page_easy-elements-dashboard .wp-menu-image:before {
935 content: none !important;
936 }
937
938 .easyel-extension-main-wrapper .easyel-widget-icon img {
939 width: 28px;
940 height: 28px;
941 max-width: 100%;
942 }
943
944 .easyel-video-section {
945 display: none;
946 }
947
948 /*black friday sale notice*/
949
950 .easyel-promo-notice {
951 padding: 0;
952 border: none !important;
953 background: #0d0c24;
954 color: #fff;
955 margin-top: 20px;
956 position: relative;
957 overflow: hidden;
958 border-radius: 6px;
959 margin-bottom: 30px;
960 }
961 .easyel-promo-content {
962 display: flex;
963 justify-content: space-between;
964 align-items: center;
965 padding: 18px 25px;
966 background: linear-gradient(90deg, #062e87, #0d0c24);
967 }
968 .easyel-promo-left {
969 font-size: 20px;
970 font-weight: 600;
971 display: flex;
972 align-items: center;
973 gap: 10px;
974 }
975 .easyel-promo-left span.orange {
976 color: #ff7a00;
977 }
978 .easyel-promo-right {
979 font-size: 18px;
980 font-weight: 700;
981 }
982 .easyel-promo-btn {
983 background: #fff;
984 padding: 10px 18px;
985 border-radius: 5px;
986 font-weight: 600;
987 text-decoration: none;
988 color: #000;
989 margin-left: 20px;
990 display: inline-flex;
991 align-items: center;
992 gap: 5px;
993 font-size: 16px;
994 }
995 .easyel-promo-dismiss {
996 position: absolute;
997 right: 10px;
998 top: 10px;
999 color: #fff;
1000 cursor: pointer;
1001 text-decoration: none;
1002 font-size: 16px;
1003 }
1004
1005 .easyel-promo-notice .notice-dismiss::before {
1006 font-size: 30px;
1007 }
1008
1009 .easyel-promo-notice .notice-dismiss {
1010 top: 10px;
1011 right: 10px;
1012 }
1013
1014
1015 /****************************/
1016 /* End Extention Area */
1017 /****************************/
1018
1019 /****************************/
1020 /* Start Responsive Area */
1021 /****************************/
1022 @media only screen and (min-width: 1600px) and (max-width: 1700px) {
1023 .easyel-banner-section .easyel-shape-3 {
1024 width: 45%;
1025 height: 100%;
1026 }
1027 }
1028
1029 @media only screen and (min-width: 1367px) and (max-width: 1599px) {
1030 .easyel-banner-section .easyel-shape-3 {
1031 width: 40%;
1032 height: 100%;
1033 }
1034 }
1035
1036
1037 @media only screen and (max-width: 1400px) {
1038 .easyel-nav-tab-item {
1039 width: 25%;
1040 }
1041 .easyel-plugin-settings-wrapper{
1042 gap: 20px;
1043 }
1044 .easyel-section-gap {
1045 padding: 80px 10px;
1046 }
1047 }
1048
1049 @media only screen and (max-width: 1366px) {
1050 .easyel-banner-section .easyel-shape-3 {
1051 display: none;
1052 }
1053 }
1054 @media only screen and (max-width: 1250px) {
1055 .easyel-section-heading .easyel-title{
1056 font-size: 28px;
1057 }
1058 .easyel-section-heading .easyel-desc{
1059 font-size: 16px;
1060 }
1061 }