PluginProbe
Elementor Website Builder – more than just a page builder / 3.22.2
Elementor Website Builder – more than just a page builder v3.22.2
4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 4.1.0-beta2 4.1.0-dev2 4.0.8 4.1.0-beta1 4.1.0-dev1 4.0.7 All 451 releases
← All changes | assets/css/app.css +538 -376 4.2.23.22.2 View file →
@@ -1,5 +1,8 @@
1 +/*! elementor - v3.22.0 - 24-06-2024 */
1 2 @import "//fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap";
3 +@import "//fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap";
4 +@import "//fonts.googleapis.com/css2?family=Source%20Serif%20Pro&display=swap";
2 5 :root {
3 6 --color-box-shadow-color: rgba(0, 0, 0, 0.05);
4 7 }
5 8
@@ -118,30 +121,30 @@
118 121 --button-primary-hover-background-color: #F5D0FE;
119 122 --button-primary-active-background-color: #F3BAFD;
120 123 --button-primary-color: #0C0D0E;
121 124 --button-secondary-background-color: #69727D;
122 - --button-secondary-hover-background-color: rgb(81.7173913043, 88.7217391304, 97.2826086957);
123 - --button-secondary-active-background-color: rgb(58.4347826087, 63.4434782609, 69.5652173913);
125 + --button-secondary-hover-background-color: #525961;
126 + --button-secondary-active-background-color: #3a3f46;
124 127 --button-secondary-color: #ffffff;
125 128 --button-danger-background-color: #DC2626;
126 - --button-danger-hover-background-color: rgb(178.25, 28.75, 28.75);
127 - --button-danger-active-background-color: rgb(134.3333333333, 21.6666666667, 21.6666666667);
129 + --button-danger-hover-background-color: #b21d1d;
130 + --button-danger-active-background-color: #861616;
128 131 --button-danger-color: #ffffff;
129 132 --button-cta-background-color: #93003f;
130 - --button-cta-hover-background-color: rgb(96, 0, 41.1428571429);
131 - --button-cta-active-background-color: rgb(45, 0, 19.2857142857);
133 + --button-cta-hover-background-color: #600029;
134 + --button-cta-active-background-color: #2d0013;
132 135 --button-cta-color: #ffffff;
133 136 --button-brand-background-color: #93003f;
134 - --button-brand-hover-background-color: rgb(96, 0, 41.1428571429);
135 - --button-brand-active-background-color: rgb(45, 0, 19.2857142857);
137 + --button-brand-hover-background-color: #600029;
138 + --button-brand-active-background-color: #2d0013;
136 139 --button-brand-color: #ffffff;
137 140 --button-link-background-color: #515962;
138 - --button-link-hover-background-color: rgb(57.9217877095, 63.6424581006, 70.0782122905);
139 - --button-link-active-background-color: rgb(34.843575419, 38.2849162011, 42.156424581);
141 + --button-link-hover-background-color: #3a4046;
142 + --button-link-active-background-color: #23262a;
140 143 --button-link-color: #ffffff;
141 144 --button-disabled-background-color: #D5D8DC;
142 - --button-disabled-hover-background-color: rgb(185.1818181818, 190.1688311688, 196.8181818182);
143 - --button-disabled-active-background-color: rgb(157.3636363636, 164.3376623377, 173.6363636364);
145 + --button-disabled-hover-background-color: #b9bec5;
146 + --button-disabled-active-background-color: #9da4ae;
144 147 --button-disabled-color: #ffffff;
145 148 color: var(--button-background-color, currentColor);
146 149 font-size: var(--button-font-size, inherit);
147 150 font-weight: 500;
@@ -161,25 +164,25 @@
161 164 --button-primary-hover-background-color: #EB8EFB;
162 165 --button-primary-active-background-color: #F3BAFD;
163 166 --button-secondary-background-color: #BABFC5;
164 167 --button-secondary-color: #fff;
165 - --button-secondary-hover-background-color: rgb(158.2913385827, 165.2992125984, 173.7086614173);
166 - --button-secondary-active-background-color: rgb(130.5826771654, 139.5984251969, 150.4173228346);
168 + --button-secondary-hover-background-color: #9ea5ae;
169 + --button-secondary-active-background-color: #838c96;
167 170 --button-cta-background-color: #93003f;
168 - --button-cta-hover-background-color: rgb(96, 0, 41.1428571429);
169 - --button-cta-active-background-color: rgb(45, 0, 19.2857142857);
171 + --button-cta-hover-background-color: #600029;
172 + --button-cta-active-background-color: #2d0013;
170 173 --button-cta-color: #fff;
171 - --button-brand-hover-background-color: rgb(96, 0, 41.1428571429);
172 - --button-brand-active-background-color: rgb(45, 0, 19.2857142857);
174 + --button-brand-hover-background-color: #600029;
175 + --button-brand-active-background-color: #2d0013;
173 176 --button-brand-color: #fff;
174 177 --button-brand-background-color: #93003f;
175 178 --button-link-background-color: #515962;
176 - --button-link-hover-background-color: rgb(57.9217877095, 63.6424581006, 70.0782122905);
177 - --button-link-active-background-color: rgb(34.843575419, 38.2849162011, 42.156424581);
179 + --button-link-hover-background-color: #3a4046;
180 + --button-link-active-background-color: #23262a;
178 181 --button-link-color: #ffffff;
179 182 --button-disabled-background-color: #69727D;
180 - --button-disabled-hover-background-color: rgb(81.7173913043, 88.7217391304, 97.2826086957);
181 - --button-disabled-active-background-color: rgb(58.4347826087, 63.4434782609, 69.5652173913);
183 + --button-disabled-hover-background-color: #525961;
184 + --button-disabled-active-background-color: #3a3f46;
182 185 --button-disabled-color: #fff;
183 186 }
184 187 .eps-button--contained {
185 188 color: var(--button-color);
@@ -300,9 +303,9 @@
300 303 --warning-bg: #FFFBEB;
301 304 --body-color: #515962;
302 305 --body-bg: #ffffff;
303 306 --link-color: #515962;
304 - --link-hover-color: rgb(46.3826815642, 50.9636871508, 56.1173184358);
307 + --link-hover-color: #2e3338;
305 308 --hr-color: #E6E8EA;
306 309 --box-shadow-color: theme-colors(dark);
307 310 --display-1-color: #515962;
308 311 --display-2-color: #515962;
@@ -354,9 +357,9 @@
354 357 --danger-bg: #390A0A;
355 358 --body-color: #BABFC5;
356 359 --body-bg: #1f2124;
357 360 --link-color: #0077CC;
358 - --link-hover-color: rgb(46.3826815642, 50.9636871508, 56.1173184358);
361 + --link-hover-color: #2e3338;
359 362 --hr-color: #333438;
360 363 --box-shadow-color: rgba(0, 0, 0, 0.15);
361 364 --display-1-color: #BABFC5;
362 365 --display-2-color: #BABFC5;
@@ -489,9 +492,9 @@
489 492 button {
490 493 border-radius: 0;
491 494 }
492 495
493 -button:focus:not(:where([data-module=onboarding] *)) {
496 +button:focus {
494 497 outline: 1px dotted;
495 498 outline: 5px auto -webkit-focus-ring-color;
496 499 }
497 500
@@ -690,10 +693,10 @@
690 693 height: 0;
691 694 }
692 695 .video-wrapper iframe {
693 696 position: absolute;
694 - inset-block-start: 0;
695 - inset-inline-start: 0;
697 + top: 0;
698 + left: 0;
696 699 width: 100%;
697 700 height: 100%;
698 701 }
699 702
@@ -749,12 +752,12 @@
749 752 justify-content: center;
750 753 position: fixed;
751 754 height: 100%;
752 755 width: 100%;
753 - inset-block-end: 0;
754 - inset-inline-start: 0;
755 756 background-color: var(--app-lightbox-background-color);
756 757 z-index: 1040;
758 + bottom: 0;
759 + left: 0;
757 760 }
758 761 .eps-app__header {
759 762 flex-shrink: 0;
760 763 font-size: 0.9375rem;
@@ -794,11 +797,12 @@
794 797 width: 1.75rem;
795 798 height: 1.75rem;
796 799 line-height: 1.75rem;
797 800 text-align: center;
798 - font-size: 1.75rem;
801 + font-size: calc(0.4 * 1.75rem);
799 802 border-radius: 50%;
800 - color: var(--app-logo-background-color);
803 + color: var(--app-logo-color);
804 + background-color: var(--app-logo-background-color);
801 805 }
802 806 .eps-app__logo:not(:last-child) {
803 807 margin-inline-end: 0.625rem;
804 808 }
@@ -900,11 +904,11 @@
900 904 }
901 905
902 906 .elementor-loader-wrapper {
903 907 position: absolute;
904 - inset-block-start: 50%;
905 - inset-inline-start: 50%;
906 - transform: translate(calc(-50% * var(--direction-multiplier)), -50%);
908 + top: 50%;
909 + left: 50%;
910 + transform: translate(-50%, -50%);
907 911 width: 300px;
908 912 display: flex;
909 913 flex-direction: column;
910 914 align-items: center;
@@ -934,13 +938,13 @@
934 938 }
935 939 .elementor-loader-box:nth-of-type(1) {
936 940 width: 20%;
937 941 height: 100%;
938 - inset-block-start: 0;
939 - inset-inline-start: 0;
942 + left: 0;
943 + top: 0;
940 944 }
941 945 .elementor-loader-box:not(:nth-of-type(1)) {
942 - inset-inline-end: 0;
946 + right: 0;
943 947 height: 20%;
944 948 width: 60%;
945 949 }
946 950 .elementor-loader-box:nth-of-type(2) {
@@ -1050,9 +1054,9 @@
1050 1054 }
1051 1055 .e-app-import-export-wizard-step__notice {
1052 1056 display: block;
1053 1057 position: sticky;
1054 - inset-block-start: 100%; /* Will prevent text overlapping when window height is too short. */
1058 + top: 100%; /* Will prevent text overlapping when window height is too short. */
1055 1059 color: var(--e-app-import-export-wizard-step-block-end-text-color);
1056 1060 font-style: italic;
1057 1061 margin-block-end: 0;
1058 1062 }
@@ -1068,9 +1072,9 @@
1068 1072 --e-app-import-export-page-header-description-color: #69727D;
1069 1073 margin-block-end: 2.75rem;
1070 1074 }
1071 1075 .e-app-import-export-page-header__content-wrapper {
1072 - max-width: 655px;
1076 + max-width: 645px;
1073 1077 }
1074 1078 .e-app-import-export-page-header__heading {
1075 1079 color: var(--e-app-import-export-page-header-heading-color);
1076 1080 }
@@ -1167,8 +1171,11 @@
1167 1171 border: var(--card-border);
1168 1172 border-radius: 0.1875rem;
1169 1173 transition: 0.3s;
1170 1174 font-size: 0.75rem;
1175 + /*
1176 + todo: TBD: Optionally remove headline styling in favor of a global atom depending on variation needs
1177 + */
1171 1178 }
1172 1179 .eps-card__header {
1173 1180 padding: 0.625rem;
1174 1181 border-block-end: var(--card-header-footer-border);
@@ -1178,13 +1185,8 @@
1178 1185 }
1179 1186 .eps-card__header--padding {
1180 1187 padding: var(--eps-card-header-padding);
1181 1188 }
1182 -.eps-card {
1183 - /*
1184 - todo: TBD: Optionally remove headline styling in favor of a global atom depending on variation needs
1185 - */
1186 -}
1187 1189 .eps-card__headline {
1188 1190 color: var(--card-headline-color);
1189 1191 margin-block-end: 0;
1190 1192 font-weight: 500;
@@ -1212,14 +1214,14 @@
1212 1214 object-fit: contain;
1213 1215 -o-object-position: top;
1214 1216 object-position: top;
1215 1217 position: absolute;
1216 - inset-block-start: 0;
1217 - inset-inline-start: 0;
1218 + top: 0;
1219 + left: 0;
1218 1220 }
1219 1221 .eps-card__image-overlay {
1220 1222 position: absolute;
1221 - inset-block-start: 0;
1223 + top: 0;
1222 1224 background-color: var(--card-image-overlay-background-color);
1223 1225 z-index: 1;
1224 1226 width: 100%;
1225 1227 height: 100%;
@@ -1266,10 +1268,10 @@
1266 1268 .eps-menu-item::before {
1267 1269 content: "";
1268 1270 display: block;
1269 1271 position: absolute;
1270 - inset-block-start: 0;
1271 - inset-inline-start: 0;
1272 + top: 0;
1273 + left: 0;
1272 1274 height: 100%;
1273 1275 width: var(--menu-item-pointer-width);
1274 1276 background-color: #0C0D0E;
1275 1277 }
@@ -1865,9 +1867,12 @@
1865 1867 .eps-modal__overlay {
1866 1868 background: rgba(0, 0, 0, 0.5);
1867 1869 position: fixed;
1868 1870 display: flex;
1869 - inset: 0;
1871 + top: 0;
1872 + left: 0;
1873 + width: 100%;
1874 + height: 100%;
1870 1875 align-items: center;
1871 1876 justify-content: center;
1872 1877 z-index: 1030;
1873 1878 }
@@ -2135,13 +2140,16 @@
2135 2140 position: absolute;
2136 2141 z-index: 1050;
2137 2142 margin-block-start: 9px;
2138 2143 transform: translateX(-50%);
2139 - inset-inline-start: 0.25rem;
2144 + left: 0.25rem;
2140 2145 }
2141 2146 .eps-popover__background {
2142 2147 position: fixed;
2143 - inset: 0;
2148 + top: 0;
2149 + bottom: 0;
2150 + left: 0;
2151 + right: 0;
2144 2152 z-index: 1030;
2145 2153 }
2146 2154 .eps-popover__container {
2147 2155 position: relative;
@@ -2152,10 +2160,10 @@
2152 2160 position: absolute;
2153 2161 width: 16px;
2154 2162 height: 9px;
2155 2163 margin: 0 0.1875rem 9px;
2156 - inset-block-start: -9px;
2157 - inset-inline-start: 50%;
2164 + top: -9px;
2165 + left: 50%;
2158 2166 transform: translateX(-50%);
2159 2167 border-color: transparent;
2160 2168 border-style: solid;
2161 2169 border-width: 0 calc(16px / 2) 9px calc(16px / 2);
@@ -2160,20 +2168,8 @@
2160 2168 border-style: solid;
2161 2169 border-width: 0 calc(16px / 2) 9px calc(16px / 2);
2162 2170 border-block-end-color: var(--popover-arrow-color);
2163 2171 }
2164 -.eps-popover--arrow-start::before {
2165 - inset-inline-start: 0.1875rem;
2166 - transform: none;
2167 -}
2168 -.eps-popover--arrow-end::before {
2169 - inset-inline-start: auto;
2170 - inset-inline-end: 0.1875rem;
2171 - transform: none;
2172 -}
2173 -.eps-popover--arrow-none::before {
2174 - display: none;
2175 -}
2176 2172 .eps-popover__item {
2177 2173 padding: 0.3125rem 1rem;
2178 2174 background-color: var(--popover-item-background-color);
2179 2175 color: var(--popover-item-color);
@@ -2225,14 +2221,14 @@
2225 2221 }
2226 2222
2227 2223 :root {
2228 2224 --checkbox-border-color: #9DA5AE;
2229 - --checkbox-hover-border-color: rgb(143.0391061453, 152.1787709497, 162.4608938547);
2230 - --checkbox-active-border-color: rgb(170.9608938547, 177.8212290503, 185.5391061453);
2225 + --checkbox-hover-border-color: #8f98a2;
2226 + --checkbox-active-border-color: #abb2ba;
2231 2227 --checkbox-background-color: #ffffff;
2232 2228 --checkbox-checked-background-color: #515962;
2233 - --checkbox-checked-hover-background-color: rgb(69.4608938547, 76.3212290503, 84.0391061453);
2234 - --checkbox-checked-active-background-color: rgb(92.5391061453, 101.6787709497, 111.9608938547);
2229 + --checkbox-checked-hover-background-color: #454c54;
2230 + --checkbox-checked-active-background-color: #5d6670;
2235 2231 --checkbox-checked-disabled-background-color: #D5D8DC;
2236 2232 --checkbox-indicator-color: #ffffff;
2237 2233 --checkbox-error-background-color: #DC2626;
2238 2234 }
@@ -2291,8 +2287,12 @@
2291 2287 }
2292 2288 .eps-checkbox--rounded {
2293 2289 border-radius: 50%;
2294 2290 }
2291 +.eps-checkbox--indeterminate {
2292 + --checkbox-background-color: var(--checkbox-checked-background-color);
2293 + --checkbox-border-color: var(--checkbox-checked-background-color);
2294 +}
2295 2295 .eps-checkbox--indeterminate::after {
2296 2296 display: inline-block;
2297 2297 margin-block-end: 0;
2298 2298 content: " ";
@@ -2300,12 +2300,8 @@
2300 2300 height: 0;
2301 2301 transform: rotate(0deg);
2302 2302 border-block-start: 1px solid #ffffff;
2303 2303 }
2304 -.eps-checkbox--indeterminate {
2305 - --checkbox-background-color: var(--checkbox-checked-background-color);
2306 - --checkbox-border-color: var(--checkbox-checked-background-color);
2307 -}
2308 2304 .eps-checkbox--error::before, .eps-checkbox--error::after, .eps-checkbox--error:checked::before, .eps-checkbox--error:checked::after {
2309 2305 display: inline-block;
2310 2306 margin-block-end: 0;
2311 2307 content: " ";
@@ -2353,10 +2349,10 @@
2353 2349 width: 375px;
2354 2350 }
2355 2351 .eps-dialog__close-button {
2356 2352 position: absolute;
2357 - inset-block-start: -2.75rem;
2358 - inset-inline-end: -2.75rem;
2353 + top: -2.75rem;
2354 + right: -2.75rem;
2359 2355 margin-block-start: 0.625rem;
2360 2356 margin-inline-end: 0.625rem;
2361 2357 z-index: 1040;
2362 2358 font-size: 1.25rem;
@@ -2396,10 +2392,10 @@
2396 2392 }
2397 2393 .e-app__popover:before {
2398 2394 content: "";
2399 2395 position: absolute;
2400 - inset-block-start: -16px;
2401 - inset-inline-end: var(--popover-arrow-offset-end, 22px);
2396 + top: -16px;
2397 + right: var(--popover-arrow-offset-end, 22px);
2402 2398 border: 8px solid transparent;
2403 2399 border-block-end-color: #fff;
2404 2400 }
2405 2401
@@ -2442,11 +2438,8 @@
2442 2438 --eps-text-field-background-color: transparent;
2443 2439 --eps-text-field-placeholder-color: #69727D;
2444 2440 --eps-text-field-outlined-border-color: #9DA5AE;
2445 2441 --eps-text-field-outlined-focus-border-color: #515962;
2446 - --eps-text-field-standard-border-color: #9DA5AE;
2447 - --eps-text-field-standard-focus-border-color: #515962;
2448 - --border: 1px solid var(--eps-text-field-outlined-border-color);
2449 2442 width: 100%;
2450 2443 color: var(--eps-text-field-color);
2451 2444 background-color: var(--eps-text-field-background-color);
2452 2445 border: 0;
@@ -2458,22 +2451,14 @@
2458 2451 line-height: 1.5;
2459 2452 }
2460 2453 .eps-text-field--outlined {
2461 2454 border-radius: 0.1875rem;
2462 - border: var(--border);
2455 + border: 1px solid var(--eps-text-field-outlined-border-color);
2463 2456 padding: 0.625rem;
2464 2457 }
2465 2458 .eps-text-field--outlined:focus {
2466 2459 border-color: var(--eps-text-field-outlined-focus-border-color);
2467 2460 }
2468 -.eps-text-field--standard {
2469 - padding-top: 0.625rem;
2470 - padding-bottom: 0.625rem;
2471 - border-bottom: var(--border);
2472 -}
2473 -.eps-text-field--standard:focus {
2474 - border-color: var(--eps-text-field-standard-focus-border-color);
2475 -}
2476 2461 .eps-text-field::-moz-placeholder {
2477 2462 color: var(--eps-text-field-placeholder-color);
2478 2463 font-family: Roboto, Arial, Helvetica, Verdana, sans-serif;
2479 2464 font-size: 0.875rem;
@@ -2500,14 +2485,8 @@
2500 2485 }
2501 2486 .eps-theme-dark--outlined:focus {
2502 2487 border-color: var(--eps-text-field-outlined-focus-border-color);
2503 2488 }
2504 -.eps-theme-dark--standard {
2505 - border-color: var(--eps-text-field-standard-border-color);
2506 -}
2507 -.eps-theme-dark--standard:focus {
2508 - border-color: var(--eps-text-field-standard-focus-border-color);
2509 -}
2510 2489
2511 2490 .e-app-import-export-content-layout {
2512 2491 display: flex;
2513 2492 justify-content: center;
@@ -2642,8 +2621,11 @@
2642 2621
2643 2622 .e-app-export-kit {
2644 2623 padding-block-end: 1.25rem;
2645 2624 }
2625 +.e-app-export-kit-information {
2626 + margin-block-start: 1.25rem;
2627 +}
2646 2628 .e-app-export-kit-information__field-header {
2647 2629 margin-block-end: 0.625rem;
2648 2630 }
2649 2631 .e-app-export-kit-information__label {
@@ -2651,26 +2633,14 @@
2651 2633 }
2652 2634 .e-app-export-kit-information__info-icon {
2653 2635 margin-inline-start: 0.625rem;
2654 2636 }
2655 -.e-app-export-kit-information__content {
2656 - gap: 16px;
2637 +.e-app-export-kit-info-modal__icon {
2638 + padding-inline-start: 0.625rem;
2657 2639 }
2658 -.e-app-export-kit-information__field--error {
2659 - border-color: var(--e-a-color-danger);
2640 +.e-app-export-kit-info-modal__heading {
2641 + margin-block-end: 1.25rem;
2660 2642 }
2661 -.e-app-export-kit-information__error-container {
2662 - height: 20px;
2663 - display: flex;
2664 - align-items: flex-start;
2665 - margin-block-start: 4px;
2666 -}
2667 -.e-app-export-kit-information__validation-error {
2668 - color: var(--e-a-color-danger);
2669 -}
2670 -.e-app-export-kit__content {
2671 - gap: 20px;
2672 -}
2673 2643
2674 2644 .e-app-import-export-info-modal__section:not(:first-child) {
2675 2645 margin-block-start: 1.875rem;
2676 2646 }
@@ -2717,9 +2687,9 @@
2717 2687 outline: none;
2718 2688 }
2719 2689 .eps-collapse__icon {
2720 2690 transition: all 150ms;
2721 - scale: calc(1 * var(--direction-multiplier)) 1;
2691 + transform: rotate(0deg);
2722 2692 }
2723 2693 .eps-collapse__content {
2724 2694 margin-block-start: 0.625rem;
2725 2695 display: none;
@@ -2798,8 +2768,9 @@
2798 2768 .e-kit-library__filter-indication-button {
2799 2769 margin-inline-start: 1.5rem;
2800 2770 }
2801 2771
2772 +#eps-app-header-btn-apply,
2802 2773 #eps-app-header-btn-promotion,
2803 2774 #eps-app-header-btn-connect {
2804 2775 margin-inline-start: 0.625rem;
2805 2776 margin-inline-end: 0.625rem;
@@ -2804,17 +2775,8 @@
2804 2775 margin-inline-start: 0.625rem;
2805 2776 margin-inline-end: 0.625rem;
2806 2777 }
2807 2778
2808 -#eps-app-header-btn-apply {
2809 - margin-inline-start: 0.625rem;
2810 -}
2811 -
2812 -#eps-app-header-btn-download {
2813 - margin-inline-end: 1rem;
2814 - margin-inline-start: 1rem;
2815 -}
2816 -
2817 2779 .e-kit-library__apply-button {
2818 2780 display: flex;
2819 2781 align-items: center;
2820 2782 justify-content: center;
@@ -2831,8 +2793,11 @@
2831 2793
2832 2794 .e-kit-library__kit-item-overlay {
2833 2795 height: 100%;
2834 2796 }
2797 +.e-kit-library__kit-item-overlay > *:first-child {
2798 + flex: 1;
2799 +}
2835 2800 .e-kit-library__kit-item-overlay-overview-button {
2836 2801 display: flex;
2837 2802 flex-direction: column;
2838 2803 align-items: center;
@@ -2862,104 +2827,16 @@
2862 2827 .e-kit-library__kit-item-overlay-promotion-button > * {
2863 2828 margin: 0 3px;
2864 2829 }
2865 2830 .e-kit-library__kit-item-subscription-plan-badge {
2866 - --e-a-color-brand: #467FF7;
2867 -}
2868 -.e-kit-library__kit-item-subscription-plan-badge.promoted {
2869 - --e-a-color-brand: #92003B;
2870 -}
2871 -.e-kit-library__kit-item-subscription-plan-badge {
2872 2831 position: absolute;
2873 - inset-block-start: 0;
2874 - inset-inline-end: 0;
2832 + top: 0;
2833 + right: 0;
2875 2834 margin: 0.3125rem;
2876 2835 background-color: var(--e-a-color-brand);
2877 2836 color: #ffffff;
2878 2837 text-transform: uppercase;
2879 2838 }
2880 -.e-kit-library__kit-item-header {
2881 - position: relative;
2882 -}
2883 -.e-kit-library__kit-item-lock-icon {
2884 - font-size: 14px;
2885 - margin-inline-end: 8px;
2886 - color: var(--card-headline-color);
2887 - cursor: pointer;
2888 -}
2889 -.e-kit-library__kit-item-actions-menu i {
2890 - font-size: 16px;
2891 -}
2892 -.e-kit-library__kit-item-actions-popover {
2893 - display: flex;
2894 - flex-direction: column;
2895 - align-items: start;
2896 - min-width: 0;
2897 - padding: 12px 0;
2898 - position: absolute;
2899 - inset-block-start: 25px;
2900 - inset-inline-start: 100%;
2901 - transform: translateX(calc(-100% * var(--direction-multiplier)));
2902 -}
2903 -.e-kit-library__kit-item-actions-popover-item {
2904 - display: flex;
2905 - height: 30px;
2906 - width: 100%;
2907 - align-items: center;
2908 - gap: 8px;
2909 - padding: 0 12px;
2910 - cursor: pointer;
2911 -}
2912 -.e-kit-library__kit-item-actions-popover-item i {
2913 - font-size: 16px;
2914 -}
2915 -.e-kit-library__kit-item-actions-popover-item:hover {
2916 - background-color: var(--e-a-bg-hover);
2917 -}
2918 -.e-kit-library__kit-item-actions-popover-item--danger {
2919 - color: var(--e-a-color-danger);
2920 -}
2921 -.e-kit-library__kit-item-actions-popover-item--danger:hover {
2922 - background-color: var(--e-a-bg-danger);
2923 -}
2924 -.e-kit-library__kit-item-actions-popover-item--danger i {
2925 - color: var(--e-a-color-danger);
2926 -}
2927 -.e-kit-library__kit-item-cloud-overlay {
2928 - height: 100%;
2929 - display: flex;
2930 - flex-direction: column;
2931 - align-items: center;
2932 - justify-content: center;
2933 -}
2934 -.e-kit-library__kit-item-cloud-overlay-import-button {
2935 - display: flex;
2936 - align-items: center;
2937 - justify-content: center;
2938 - padding: 8px 22px;
2939 - gap: 8px;
2940 -}
2941 -.e-kit-library__kit-item-cloud-overlay-import-button > i {
2942 - font-size: 20px;
2943 - font-weight: 600;
2944 -}
2945 -.e-kit-library__kit-item-cloud-overlay-import-button > span {
2946 - font-size: 15px;
2947 -}
2948 -.e-kit-library__kit-item-cloud-overlay i.eicon-lock {
2949 - font-size: 48px;
2950 - color: rgba(255, 255, 255, 0.8);
2951 - cursor: pointer;
2952 -}
2953 -.e-kit-library__kit-item--locked {
2954 - opacity: 0.6;
2955 -}
2956 -.e-kit-library__kit-item--locked .eps-card__image {
2957 - opacity: 0.7;
2958 -}
2959 -.e-kit-library__kit-item--locked .eps-card__overlay {
2960 - background-color: rgba(0, 0, 0, 0.5);
2961 -}
2962 2839
2963 2840 :root {
2964 2841 --e-kit-library-header-back-border: 1px solid var(--e-a-border-color);
2965 2842 --e-kit-library-header-back-color: #69727D;
@@ -2984,9 +2861,9 @@
2984 2861 flex: 1;
2985 2862 height: 100%;
2986 2863 }
2987 2864 .e-kit-library__header-back .eps-icon {
2988 - scale: calc(1 * var(--direction-multiplier)) 1;
2865 + transform: rotate(0deg);
2989 2866 }
2990 2867
2991 2868 .e-kit-library__page-loader {
2992 2869 width: 100%;
@@ -3044,10 +2921,10 @@
3044 2921 font-size: 1.25rem;
3045 2922 padding: 0.625rem;
3046 2923 color: #69727D;
3047 2924 position: absolute;
3048 - inset-block-start: 0;
3049 - inset-inline-start: 0;
2925 + top: 0;
2926 + left: 0;
3050 2927 height: 100%;
3051 2928 display: flex;
3052 2929 align-items: center;
3053 2930 justify-content: center;
@@ -3059,10 +2936,10 @@
3059 2936 font-size: 0.875rem;
3060 2937 padding: 0.625rem;
3061 2938 color: #69727D;
3062 2939 position: absolute;
3063 - inset-block-start: 0;
3064 - inset-inline-end: 0;
2940 + top: 0;
2941 + right: 0;
3065 2942 height: 100%;
3066 2943 display: flex;
3067 2944 align-items: center;
3068 2945 justify-content: center;
@@ -3097,10 +2974,11 @@
3097 2974 .eps-sort-select__select-wrapper::after {
3098 2975 content: "\e8ad";
3099 2976 font-family: eicons;
3100 2977 position: absolute;
3101 - inset-inline-end: 0.625rem;
3102 - inset-block: 0;
2978 + right: 0.625rem;
2979 + top: 0;
2980 + bottom: 0;
3103 2981 color: #69727D;
3104 2982 display: flex;
3105 2983 align-items: center;
3106 2984 justify-content: center;
@@ -3197,14 +3075,13 @@
3197 3075 }
3198 3076 .e-kit-library__index-layout-heading {
3199 3077 padding: 1.875rem 2.75rem;
3200 3078 position: sticky;
3201 - inset-block-start: -1px;
3079 + top: -1px;
3202 3080 width: 100%;
3203 3081 z-index: 2;
3204 3082 background-color: var(--app-background-color);
3205 3083 gap: 1.5rem;
3206 - align-items: center;
3207 3084 }
3208 3085 .e-kit-library__index-layout-heading-search, .e-kit-library__index-layout-heading-sort {
3209 3086 min-width: 265px;
3210 3087 }
@@ -3210,13 +3087,8 @@
3210 3087 }
3211 3088 .e-kit-library__index-layout-heading-search {
3212 3089 flex: 1;
3213 3090 }
3214 -.e-kit-library__index-layout-heading-quota {
3215 - display: flex;
3216 - align-items: center;
3217 - justify-content: flex-end;
3218 -}
3219 3091 .e-kit-library__index-layout-main {
3220 3092 padding-block-start: 0;
3221 3093 padding-block-end: 1.5rem;
3222 3094 overflow-y: hidden;
@@ -3225,45 +3097,8 @@
3225 3097 display: flex;
3226 3098 flex-direction: column;
3227 3099 justify-content: space-between;
3228 3100 }
3229 -.e-kit-library__index-layout-main.e-kit-library__connect-container {
3230 - justify-content: center;
3231 - align-items: center;
3232 -}
3233 -.e-kit-library__connect-button {
3234 - background-color: var(--e-a-btn-bg-primary);
3235 - color: var(--e-a-btn-color);
3236 - border-radius: 4px;
3237 - padding: 8px;
3238 -}
3239 -.e-kit-library__connect-button:hover {
3240 - opacity: 0.8;
3241 -}
3242 -.e-kit-library__upgrade-button {
3243 - background-color: var(--e-a-color-accent);
3244 - color: var(--e-a-color-txt-invert);
3245 - border-radius: 4px;
3246 - padding: 8px;
3247 -}
3248 -.e-kit-library__upgrade-button:hover {
3249 - opacity: 0.8;
3250 -}
3251 -.e-kit-library .eicon-library-cloud-connect,
3252 -.e-kit-library .eicon-library-subscription-upgrade {
3253 - font-size: 65px;
3254 -}
3255 -.e-kit-library .connect-badge {
3256 - color: #C00BB9;
3257 - margin-inline-start: 10px;
3258 -}
3259 -.e-kit-library .upgrade-badge {
3260 - color: #93003f;
3261 - border: 1px solid #93003f;
3262 - border-radius: 10px;
3263 - padding: 2px 6px;
3264 - margin-inline-start: 10px;
3265 -}
3266 3101
3267 3102 .e-kit-library__tags-filter {
3268 3103 --e-kit-library-item-sidebar-header-title-color: #515962;
3269 3104 --e-kit-library-item-sidebar-description-color: #515962;
@@ -3345,10 +3180,10 @@
3345 3180 }
3346 3181
3347 3182 .e-kit-library__preview-loader {
3348 3183 position: absolute;
3349 - inset-block-start: 0;
3350 - inset-inline-start: 0;
3184 + top: 0;
3185 + left: 0;
3351 3186 z-index: 0;
3352 3187 }
3353 3188 .e-kit-library__preview-iframe {
3354 3189 border: none;
@@ -3376,10 +3211,10 @@
3376 3211 align-items: center;
3377 3212 justify-content: center;
3378 3213 font-size: 0.875rem;
3379 3214 position: absolute;
3380 - inset-block-start: 50%;
3381 - inset-inline-end: var(--e-app-collapse-toggle-icon-spacing);
3215 + top: 50%;
3216 + right: var(--e-app-collapse-toggle-icon-spacing);
3382 3217 transform: translateY(-50%);
3383 3218 }
3384 3219 .e-app-collapse-toggle__icon:before {
3385 3220 transition: all 0.2s linear;
@@ -3394,10 +3229,10 @@
3394 3229 display: block;
3395 3230 }
3396 3231
3397 3232 [dir=rtl] .e-app-collapse-toggle__icon {
3398 - inset-inline-start: var(--e-app-collapse-toggle-icon-spacing);
3399 - inset-inline-end: initial;
3233 + right: initial;
3234 + left: var(--e-app-collapse-toggle-icon-spacing);
3400 3235 }
3401 3236
3402 3237 .eps-theme-dark .e-app-collapse {
3403 3238 --e-app-collapse-icon-color: #BABFC5;
@@ -3524,10 +3359,10 @@
3524 3359 font-size: 1.85rem;
3525 3360 }
3526 3361 .e-app-import-export-loader--absolute-center {
3527 3362 position: absolute;
3528 - inset-block-start: 50%;
3529 - inset-inline-start: 50%;
3363 + top: 50%;
3364 + left: 50%;
3530 3365 transform: translateX(-50%) translateY(-50%);
3531 3366 }
3532 3367
3533 3368 .eps-theme-dark .e-app-import-export-loader {
@@ -3560,159 +3395,486 @@
3560 3395 .e-app-import-failed-plugins-notice {
3561 3396 margin-block-end: 1.25rem;
3562 3397 }
3563 3398
3564 -.e-app-export-actions-container {
3399 +.e-onboarding {
3400 + font-family: "DM Sans", "Roboto", sans-serif;
3401 + color-scheme: light;
3402 +}
3403 +.e-onboarding .eps-app__main {
3404 + justify-content: center;
3405 + overflow-y: auto;
3406 +}
3407 +.e-onboarding__content {
3408 + max-width: 1135px;
3409 + padding: 2.75rem;
3410 + margin: initial;
3411 + overflow-y: initial;
3412 +}
3413 +.e-onboarding__checkbox-label {
3565 3414 display: flex;
3566 - gap: 15px;
3415 + line-height: 18px;
3416 + margin-block-end: 27px;
3417 +}
3418 +.e-onboarding__checkbox-input {
3419 + margin-inline-end: 14px;
3420 + width: 16px;
3421 + height: 16px;
3422 + border-color: #69727D;
3423 + border-radius: 2px;
3424 +}
3425 +.e-onboarding__checkbox-input:checked {
3426 + background-color: #525861;
3427 +}
3428 +.e-onboarding__checkbox-input:checked::after {
3429 + margin-block-end: 15%;
3430 + width: 6px;
3431 + height: 9px;
3432 + border-width: 0 2px 2px 0;
3433 +}
3434 +.e-onboarding__feature-list {
3435 + margin-block-end: 40px;
3436 +}
3437 +.e-onboarding__text-input {
3438 + font-size: 14px;
3439 + width: 325px;
3440 + padding: 12px 16px;
3441 + color: #69727D;
3442 + border: 1px solid #9EA5AD;
3443 +}
3444 +.e-onboarding__text-input:focus-visible {
3445 + outline: initial;
3446 + border: 1px solid #3A3F45;
3447 +}
3448 +.e-onboarding__text-input::-moz-placeholder {
3449 + color: #C2C7CC;
3450 +}
3451 +.e-onboarding__text-input::placeholder {
3452 + color: #C2C7CC;
3453 +}
3454 +.e-onboarding__footnote {
3455 + margin-block-start: 24px;
3456 + width: 325px;
3457 + text-align: center;
3458 +}
3459 +.e-onboarding__footnote a {
3460 + text-decoration: underline;
3461 + color: #3A3F45;
3462 +}
3463 +
3464 +#e-app ~ #__wp-uploader-id-2 .media-modal {
3465 + max-width: 1024px;
3466 + max-height: 768px;
3467 + margin: auto;
3468 +}
3469 +
3470 +.e-onboarding__page-content {
3471 + margin-block-end: 70px;
3472 +}
3473 +.e-onboarding__page-content-start {
3474 + max-width: 675px;
3475 + text-align: start;
3476 + flex-basis: 555px;
3477 + align-self: start;
3478 +}
3479 +.e-onboarding__page-content-end {
3480 + min-width: 440px;
3481 + max-width: 540px;
3482 +}
3483 +.e-onboarding__page-content-end img {
3567 3484 width: 100%;
3568 - justify-content: flex-end;
3569 3485 }
3486 +.e-onboarding__page-content-section-title {
3487 + font-family: "DM Serif Display", serif;
3488 + font-size: 36px;
3489 + font-weight: 700;
3490 + color: #0C0D0E;
3491 +}
3492 +.e-onboarding__page-content-section-text {
3493 + font-size: 18px;
3494 + color: #3A3F45;
3495 +}
3570 3496
3571 -.e-kit-library__quota-bar {
3497 +.e-onboarding__header-logo .eps-app__logo {
3498 + background-color: #0C0D0E;
3499 + color: #ffffff;
3500 + width: 1.3rem;
3501 + height: 1.3rem;
3502 + line-height: 1.3rem;
3503 + font-size: 0.48rem;
3504 +}
3505 +.e-onboarding__header-logo .eps-app__logo:not(:last-child) {
3506 + margin-inline-end: 7px;
3507 +}
3508 +.e-onboarding__header-logo img {
3509 + width: 104px;
3510 +}
3511 +.e-onboarding__header .eps-app__header-btn {
3572 3512 display: flex;
3573 3513 align-items: center;
3514 + font-size: 13px;
3574 3515 }
3575 -.e-kit-library__quota-bar__container {
3516 +.e-onboarding__header .eps-app__header-btn .eps-icon:not(:last-child) {
3517 + margin-inline-end: 7px;
3518 +}
3519 +.e-onboarding__header .eps-button {
3520 + color: #0C0D0E;
3521 +}
3522 +.e-onboarding__header .eps-button__go-pro-btn {
3523 + background-color: #93003f;
3524 + color: #ffffff;
3525 + padding: 4px 8px;
3526 + border-radius: 4px;
3527 + font-weight: 700;
3528 + font-size: 12px;
3529 + transition: 0.5s;
3530 +}
3531 +.e-onboarding__header .eps-button__go-pro-btn:hover {
3532 + background: #c60055;
3533 +}
3534 +
3535 +.e-onboarding__go-pro {
3536 + width: 288px;
3537 + font-size: 12px;
3538 + background-color: #ffffff;
3539 +}
3540 +.e-onboarding__go-pro-title {
3541 + font-size: 18px;
3542 + font-weight: 700;
3543 + color: #93003f;
3544 +}
3545 +.e-onboarding__go-pro-cta {
3546 + display: inline-block;
3547 + color: #93003f;
3548 + padding: 9px;
3549 + border: 1px solid #93003f;
3550 +}
3551 +.e-onboarding__go-pro-cta.e-onboarding__button {
3552 + font-size: 14px;
3553 +}
3554 +.e-onboarding__go-pro-paragraph:not(:last-child) {
3555 + margin-block-end: 20px;
3556 +}
3557 +.e-onboarding__go-pro-already-have {
3558 + text-decoration: underline;
3559 +}
3560 +
3561 +.e-onboarding__progress-bar {
3576 3562 display: flex;
3577 - flex-direction: column;
3578 - gap: 8px;
3579 - min-width: 230px;
3563 + justify-content: center;
3564 + margin-block-end: 125px;
3580 3565 }
3581 -.e-kit-library__quota-bar__header {
3566 +.e-onboarding__progress-bar-item {
3582 3567 display: flex;
3583 - justify-content: space-between;
3584 3568 align-items: center;
3569 + color: #69727D;
3570 + font-size: 0.75rem;
3585 3571 }
3586 -.e-kit-library__quota-bar__label {
3587 - color: var(--body-color);
3588 - font-weight: 400;
3589 - white-space: nowrap;
3590 - font-size: 12px;
3572 +.e-onboarding__progress-bar-item-icon {
3573 + display: inline-block;
3574 + font-family: "DM Serif Display", serif;
3575 + text-align: center;
3576 + width: 1.1rem;
3577 + height: 1.1rem;
3578 + line-height: 1rem;
3579 + font-size: 0.75rem;
3580 + font-weight: bold;
3581 + border-radius: 50%;
3582 + border: 1px solid #69727D;
3583 + margin-inline-end: 8px;
3584 + flex-shrink: 0;
3591 3585 }
3592 -.e-kit-library__quota-bar__progress-container {
3593 - width: 100%;
3594 - height: 4px;
3595 - overflow: hidden;
3596 - position: relative;
3586 +.e-onboarding__progress-bar-item:not(:last-child) {
3587 + margin-inline-end: 22px;
3597 3588 }
3598 -.e-kit-library__quota-bar__progress-container--empty {
3599 - background-color: #F0ABFC;
3589 +.e-onboarding__progress-bar-item:not(:last-child):after {
3590 + font-family: "eicons";
3591 + margin-inline-start: 22px;
3592 + content: "\e89e";
3600 3593 }
3601 -.e-kit-library__quota-bar__progress-container--normal {
3602 - background-color: #F0ABFC;
3594 +.e-onboarding__progress-bar-item--active {
3595 + color: #D004D4;
3603 3596 }
3604 -.e-kit-library__quota-bar__progress-container--warning {
3605 - background-color: rgb(251.0236220472, 216.4291338583, 157.9763779528);
3597 +.e-onboarding__progress-bar-item--active .e-onboarding__progress-bar-item-icon, .e-onboarding__progress-bar-item--completed .e-onboarding__progress-bar-item-icon {
3598 + color: #ffffff;
3599 + border-color: #D004D4;
3600 + background-color: #D004D4;
3606 3601 }
3607 -.e-kit-library__quota-bar__progress-container--alert {
3608 - background: #93003f;
3602 +.e-onboarding__progress-bar-item--skipped, .e-onboarding__progress-bar-item--completed {
3603 + cursor: pointer;
3609 3604 }
3610 -.e-kit-library__quota-bar__progress-bar {
3611 - height: 100%;
3612 - transition: width 0.3s ease;
3605 +.e-onboarding__progress-bar-item--skipped .e-onboarding__progress-bar-item-icon {
3606 + color: #ffffff;
3607 + background-color: #69727D;
3613 3608 }
3614 -.e-kit-library__quota-bar__progress-bar--empty {
3615 - background: transparent;
3609 +
3610 +.e-onboarding__button {
3611 + font-size: 18px;
3612 + cursor: pointer;
3613 + transition: var(--e-a-transition-hover);
3616 3614 }
3617 -.e-kit-library__quota-bar__progress-bar--normal {
3618 - background: #D004D4;
3615 +.e-onboarding__button-action {
3616 + color: var(--e-a-btn-color);
3617 + background-color: var(--e-a-btn-bg-primary);
3618 + min-width: 325px;
3619 + padding: 15px 30px;
3620 + text-align: center;
3619 3621 }
3620 -.e-kit-library__quota-bar__progress-bar--warning {
3621 - background: #F59E0B;
3622 +.e-onboarding__button-action:hover {
3623 + background-color: var(--e-a-btn-bg-primary-hover);
3622 3624 }
3623 -.e-kit-library__quota-bar__progress-bar--alert {
3624 - background: #93003f;
3625 +.e-onboarding__button-skip {
3626 + padding: 8px 16px;
3627 + color: #515962;
3625 3628 }
3626 -.e-kit-library__quota-bar__upgrade-message {
3629 +.e-onboarding__button-skip:hover {
3630 + background-color: #F9FAFA;
3631 +}
3632 +.e-onboarding__button--disabled {
3633 + pointer-events: none;
3634 + background-color: #D5D8DC;
3635 + color: #9EA5AD;
3636 +}
3637 +.e-onboarding__button--disabled:hover {
3638 + cursor: progress;
3639 +}
3640 +.e-onboarding__button--processing {
3641 + pointer-events: none;
3642 + filter: brightness(90%);
3643 +}
3644 +
3645 +.e-onboarding__card {
3646 + border: 1px solid #3A3F45;
3647 + border-radius: 8px;
3648 + padding: 40px 40px;
3649 + cursor: pointer;
3650 + flex-grow: 1;
3627 3651 display: flex;
3652 + flex-direction: column;
3628 3653 align-items: center;
3629 - gap: 4px;
3630 3654 }
3631 -.e-kit-library__quota-bar__upgrade-link {
3632 - color: #93003f;
3633 - text-decoration: underline;
3634 - cursor: pointer;
3655 +.e-onboarding__card-image, .e-onboarding__card-text {
3656 + width: 345px;
3657 +}
3658 +.e-onboarding__card-image {
3659 + margin-block-end: 44px;
3660 +}
3661 +.e-onboarding__card-text {
3662 + font-size: 20px;
3663 + font-weight: 700;
3664 + text-align: center;
3665 + color: #0C0D0E;
3666 +}
3667 +.e-onboarding__card:hover {
3668 + box-shadow: 4px 4px 0 0 #000000;
3669 +}
3670 +.e-onboarding__card:active {
3671 + box-shadow: initial;
3672 +}
3673 +
3674 +.e-onboarding__checklist {
3675 + padding-inline-start: 0;
3676 +}
3677 +.e-onboarding__checklist-item {
3678 + display: flex;
3679 + align-items: center;
3635 3680 font-size: 12px;
3636 - font-weight: 400;
3681 + margin-block-end: 12px;
3637 3682 }
3638 -.e-kit-library__quota-bar__upgrade-link:hover {
3639 - opacity: 0.8;
3683 +.e-onboarding__checklist-item .eicon-check-circle {
3684 + margin-inline-end: 9px;
3685 + font-size: 16px;
3686 + font-weight: 600;
3640 3687 }
3641 -.e-kit-library__quota-bar__count {
3642 - color: var(--body-color);
3643 - white-space: nowrap;
3644 - font-size: 12px;
3688 +
3689 +.e-onboarding__notice {
3690 + display: inline-block;
3691 + padding: 12px 14px;
3692 + margin-block-end: 16px;
3693 + color: #3A3F45;
3645 3694 }
3695 +.e-onboarding__notice--error {
3696 + background-color: #FDE8EC;
3697 +}
3698 +.e-onboarding__notice--error i {
3699 + font-size: 16px;
3700 + color: #B92136;
3701 +}
3702 +.e-onboarding__notice--success {
3703 + background-color: #ECF9F2;
3704 +}
3705 +.e-onboarding__notice--success i {
3706 + color: #117740;
3707 +}
3708 +.e-onboarding__notice i {
3709 + margin-inline-end: 14px;
3710 +}
3711 +.e-onboarding__notice-empty-spacer {
3712 + height: 61px;
3713 +}
3646 3714
3647 -:root {
3648 - --text-secondary: #3F444B;
3715 +.e-onboarding__page-account .e-onboarding__checkbox-label {
3716 + margin-block-start: 50px;
3649 3717 }
3650 3718
3651 -.e-kit-library__quota-notification {
3719 +.e-onboarding__action-button-text {
3720 + margin-inline-start: 10px;
3721 +}
3722 +
3723 +.e-onboarding__site-name-input {
3724 + margin-block-start: 80px;
3725 +}
3726 +
3727 +.e-onboarding__page-siteLogo .e-app-upload-file__button {
3728 + color: var(--e-a-color-primary-bold);
3729 + border-color: var(--e-a-color-primary-bold);
3730 +}
3731 +.e-onboarding__page-siteLogo .e-app-upload-file__button:hover {
3732 + background-color: #FAE8FF;
3733 +}
3734 +.e-onboarding__drop-zone {
3735 + margin-block-start: 3rem;
3736 +}
3737 +.e-onboarding .eps-display-3 {
3738 + font-size: 16px;
3739 + margin-block-end: 0.5rem;
3740 +}
3741 +.e-onboarding .e-app-upload-file__button {
3742 + max-width: 198px;
3743 + margin: 0 auto;
3744 +}
3745 +.e-onboarding .e-app-drop-zone__secondary-text {
3746 + font-size: 14px;
3747 +}
3748 +.e-onboarding__logo-container {
3749 + position: relative;
3750 + margin-block-start: 3rem;
3751 + min-height: 120px;
3752 + width: -moz-fit-content;
3753 + width: fit-content;
3652 3754 display: flex;
3653 - align-items: flex-start;
3654 - justify-content: space-between;
3655 - padding: 16px 20px;
3656 - margin: 0 44px 30px;
3657 - border-radius: 4px;
3755 + align-items: center;
3756 + justify-content: center;
3757 + min-width: 220px;
3758 + border: 1px solid #BABFC5;
3658 3759 }
3659 -.e-kit-library__quota-notification--warning {
3660 - background-color: #FBF1E6;
3661 - color: #3f444b;
3760 +.e-onboarding__logo-container img {
3761 + height: auto;
3762 + max-height: 100%;
3763 + width: auto;
3662 3764 }
3663 -.e-kit-library__quota-notification--alert {
3664 - background-color: #FDECEC;
3665 - color: #3f444b;
3765 +.e-onboarding__logo-remove {
3766 + position: absolute;
3767 + right: 0;
3768 + top: 5px;
3666 3769 }
3667 -.e-kit-library__quota-notification__content {
3668 - display: flex;
3669 - align-items: flex-start;
3670 - gap: 12px;
3671 - flex: 1;
3770 +.e-onboarding__logo-remove i {
3771 + font-size: 16px;
3772 + width: 15px;
3672 3773 }
3673 -.e-kit-library__quota-notification__icon {
3674 - font-size: 18px;
3675 - margin-top: 1px;
3676 - flex-shrink: 0;
3774 +.e-onboarding__logo-remove:hover {
3775 + cursor: pointer;
3677 3776 }
3678 -.e-kit-library__quota-notification__icon.eicon-warning-full {
3679 - color: #F59E0B;
3777 +.e-onboarding__is-uploading {
3778 + visibility: hidden;
3680 3779 }
3681 -.e-kit-library__quota-notification__icon.eicon-alert {
3682 - color: #DC2626;
3780 +
3781 +.e-onboarding__page-goodToGo .e-onboarding__page-content-section-title,
3782 +.e-onboarding__page-goodToGo .e-onboarding__page-content-section-text {
3783 + text-align: center;
3683 3784 }
3684 -.e-kit-library__quota-notification__message {
3685 - flex: 1;
3686 - line-height: 1.5;
3687 - font-size: 13px;
3785 +.e-onboarding__cards-grid.e-onboarding__page-content {
3786 + margin-block-start: 48px;
3787 + margin-block-end: 48px;
3688 3788 }
3689 -.e-kit-library__quota-notification__message span {
3690 - color: var(--text-secondary);
3691 - font-size: 13px;
3789 +.e-onboarding__cards-grid .e-onboarding__card {
3790 + max-width: 555px;
3692 3791 }
3693 -.e-kit-library__quota-notification__action-link {
3694 - color: inherit;
3792 +.e-onboarding__cards-grid .e-onboarding__card:not(:last-child) {
3793 + margin-inline-end: 20px;
3794 +}
3795 +.e-onboarding__good-to-go-footer {
3796 + justify-content: end;
3797 +}
3798 +
3799 +.e-onboarding__upload-pro {
3800 + flex-direction: row;
3801 + justify-content: center;
3802 + font-family: "DM Sans", "Roboto", sans-serif;
3803 + text-align: center;
3804 +}
3805 +.e-onboarding__upload-pro .eps-app__content {
3806 + overflow-y: hidden;
3807 + max-width: 1113px;
3808 + padding: 30px;
3809 +}
3810 +.e-onboarding__upload-pro-drop-zone {
3811 + margin-block-end: 24px;
3812 +}
3813 +.e-onboarding__upload-pro-drop-zone h1 {
3814 + font-family: "Source Serif Pro", "Roboto", sans-serif;
3815 +}
3816 +.e-onboarding__upload-pro-drop-zone .e-app-drag-drop {
3817 + padding: 48px;
3818 +}
3819 +.e-onboarding__upload-pro-drop-zone .eps-display-3,
3820 +.e-onboarding__upload-pro-drop-zone .e-app-drop-zone__text,
3821 +.e-onboarding__upload-pro-drop-zone .e-app-drop-zone__secondary-text {
3822 + margin-block-end: 12px;
3823 +}
3824 +.e-onboarding__upload-pro-drop-zone .e-app-upload-file__button {
3825 + background-color: #040080;
3826 + color: #46F2B6;
3827 + padding: 14px 40px;
3828 + border-color: #040080;
3829 +}
3830 +.e-onboarding__upload-pro-get-file {
3831 + font-size: 12px;
3832 + margin-block-start: 24px;
3833 +}
3834 +.e-onboarding__upload-pro-get-file a {
3695 3835 text-decoration: underline;
3696 - font-size: 13px;
3836 +}
3837 +.e-onboarding__upload-pro .e-onboarding__notice {
3838 + margin-block-end: 0;
3839 +}
3840 +
3841 +.e-onboarding__choose-features-section {
3842 + width: 100%;
3843 + display: flex;
3844 + flex-wrap: wrap;
3845 + gap: 10px 20px;
3846 + margin-block: 20px;
3847 +}
3848 +.e-onboarding__choose-features-section__label {
3849 + display: flex;
3850 + align-items: center;
3851 + font-size: 14px;
3697 3852 font-weight: 400;
3853 + line-height: 24px;
3854 + letter-spacing: -0.01em;
3855 + -webkit-user-select: none;
3856 + -moz-user-select: none;
3857 + user-select: none;
3858 + border: 1px solid #D5D8DC;
3859 + padding: 12px 16px;
3860 + width: 267px;
3698 3861 }
3699 -.e-kit-library__quota-notification__action-link:hover {
3700 - opacity: 0.8;
3862 +.e-onboarding__choose-features-section__checkbox {
3863 + justify-self: end;
3864 + margin-inline-end: 8px;
3865 + width: 16px;
3866 + height: 16px;
3701 3867 }
3702 -.e-kit-library__quota-notification__dismiss {
3703 - background: none;
3704 - border: none;
3705 - cursor: pointer;
3706 - padding: 0;
3707 - margin-inline-start: 12px;
3708 - color: inherit;
3709 - opacity: 0.7;
3710 - flex-shrink: 0;
3868 +.e-onboarding__choose-features-section__message {
3869 + font-size: 18px;
3870 + font-weight: 400;
3871 + line-height: 27px;
3872 + letter-spacing: -0.01em;
3873 + padding-inline-end: 120px;
3874 + min-height: 55px;
3875 + margin-block-end: 20px;
3711 3876 }
3712 -.e-kit-library__quota-notification__dismiss:hover {
3713 - opacity: 1;
3714 -}
3715 -.e-kit-library__quota-notification__dismiss i {
3716 - font-size: 14px;
3877 +.e-onboarding__page-chooseFeatures .e-onboarding__page-content {
3878 + margin-bottom: 0;
3717 3879 }
3718 3880 /*# sourceMappingURL=app.css.map */